@import url("./responsive.css?v=20260821f");

body.secondary-page { background: #fff; }
.secondary-page .site-header { position: sticky; }
.secondary-page main { min-height: calc(100vh - 86px); }
.secondary-page .series-product-image,
.secondary-page .series-product-image.blue,
.secondary-page .series-product-image.cream,
.secondary-page .series-product-image.black,
.secondary-page .series-product-image.orange { background: #f7f7f8; }
.inner-hero { padding: 105px clamp(20px, 8.3vw, 128px) 88px; background: #f1f5fb; border-bottom: 1px solid #dae4f1; }
.inner-hero .eyebrow { color: #5578ad; }.inner-hero h1 { margin: 0 0 22px; max-width: 820px; font-size: clamp(47px, 6vw, 84px); line-height: .96; letter-spacing: -.085em; }.inner-hero h1 em { color: #6d91ca; font-style: normal; }.inner-hero > p:not(.eyebrow) { max-width: 490px; color: #647287; font-size: 14px; line-height: 1.8; margin: 0; }
.inner-content { padding: 70px clamp(20px, 8.3vw, 128px) 110px; }.page-tabs { max-width: 1180px; min-height: 64px; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; margin: 0 auto 44px; padding: 6px; overflow: hidden; border: 0; border-radius: 18px; background: #f5f6f8; scrollbar-width: none; }.page-tabs::-webkit-scrollbar { display: none; }.page-tabs button { min-height: 52px; border: 0; border-radius: 12px; background: transparent; padding: 0 8px; color: #6f7379; font-size: clamp(9px, .86vw, 12px); font-weight: 600; white-space: nowrap; transition: color .24s ease, background .24s ease, box-shadow .24s ease, transform .24s ease; }.page-tabs button:hover { color: #242a33; background: rgba(255, 255, 255, .55); }.page-tabs button.active { color: #4f75b0; border: 0; background: #fff; box-shadow: 0 8px 22px rgba(31, 48, 76, .09); transform: translateY(-1px); }
.secondary-grid { max-width: 1180px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin: 0 auto; }.secondary-grid .series-product-image { height: auto; aspect-ratio: 1 / 1; }.secondary-grid .series-product-info { padding: 22px 28px 18px; }.secondary-grid .series-swatches { padding-left: 28px; padding-right: 28px; }.secondary-grid .series-add-button { background: #5278b4; }
.detail-layout { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(35px, 7vw, 110px); max-width: 1160px; margin: 0 auto; }.detail-visual { min-height: 510px; display: grid; place-items: center; border-radius: 18px; background: #f1f5fb; }.detail-visual .series-device { transform: scale(1.5); }.detail-copy .eyebrow { color: #5578ad; }.detail-copy h1 { font-size: clamp(37px, 4vw, 59px); line-height: 1; letter-spacing: -.075em; margin: 0 0 20px; }.detail-copy > p:not(.eyebrow) { color: #687687; line-height: 1.8; }.detail-price { font-size: 19px; font-weight: 700; margin: 28px 0; }.detail-specs { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-top: 1px solid #ccd7e5; margin: 30px 0; }.detail-specs div { padding: 14px 0; border-bottom: 1px solid #ccd7e5; }.detail-specs span { display: block; color: #8190a1; font: 9px var(--mono); letter-spacing: .08em; margin-bottom: 5px; }.detail-specs b { font-size: 12px; }.detail-actions { display: flex; gap: 11px; align-items: center; }.detail-actions .button { min-width: 150px; }
.honor-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; max-width: 1220px; margin: 0 auto 88px; }.honor-stat { padding: 25px; min-height: 160px; background: #f2f6fb; }.honor-stat strong { display: block; color: #5278b4; font-size: 33px; letter-spacing: -.07em; margin-bottom: 23px; }.honor-stat b { display: block; margin-bottom: 6px; font-size: 14px; }.honor-stat span { color: #748193; font-size: 11px; line-height: 1.55; }.honors-block { max-width: 1220px; margin: 0 auto; border-top: 1px solid #b4c5da; }.honors-row { display: grid; grid-template-columns: 190px 1fr 165px; gap: 25px; align-items: center; min-height: 110px; border-bottom: 1px solid #d0d9e3; }.honors-row > span { color: #6484b4; font: 10px var(--mono); }.honors-row h3 { margin: 0 0 7px; font-size: 16px; }.honors-row p { margin: 0; color: #748193; font-size: 11px; line-height: 1.5; }.honors-row b { justify-self: end; color: #5278b4; font: 11px var(--mono); }
.solution-detail-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; max-width: 1220px; margin: 0 auto 90px; }.solution-detail-card { min-height: 260px; padding: 25px; background: #f2f6fb; border-top: 3px solid #5278b4; }.solution-detail-card > span { color: #5278b4; font: 10px var(--mono); }.solution-detail-card h3 { font-size: 23px; line-height: 1.05; letter-spacing: -.05em; margin: 52px 0 13px; }.solution-detail-card p { color: #6c7b8d; font-size: 11px; line-height: 1.65; margin: 0; }.process-line { max-width: 1220px; margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid #b4c5da; border-bottom: 1px solid #b4c5da; }.process-line div { min-height: 160px; padding: 19px; border-left: 1px solid #b4c5da; }.process-line div:first-child { border-left: 0; }.process-line span { color: #5278b4; font: 10px var(--mono); }.process-line h3 { margin: 33px 0 7px; font-size: 15px; }.process-line p { color: #718093; font-size: 11px; margin: 0; }
.secondary-page footer { margin-top: 0; }
@media (max-width: 1050px) { .page-tabs { display: flex; overflow-x: auto; overscroll-behavior-x: contain; }.page-tabs button { min-width: 132px; flex: 0 0 auto; font-size: 11px; } }
@media (max-width: 800px) { .inner-hero { padding: 70px 25px 62px; }.inner-hero h1 { font-size: 48px; }.inner-content { padding: 52px 20px 75px; }.secondary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }.secondary-grid .series-product-image { height: auto; aspect-ratio: 1 / 1; }.secondary-grid .series-product-info { min-height: 92px; display: block; padding: 13px 12px 16px; }.secondary-grid .series-swatches { padding-left: 12px; padding-right: 12px; }.detail-layout { grid-template-columns: 1fr; gap: 40px; }.detail-visual { min-height: 350px; }.detail-copy h1 { font-size: 43px; }.honor-grid { grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 58px; }.honor-stat { min-height: 140px; padding: 17px; }.honors-row { grid-template-columns: 62px 1fr; gap: 15px; padding: 15px 0; }.honors-row b { grid-column: 2; justify-self: start; }.solution-detail-grid { grid-template-columns: 1fr; gap: 10px; margin-bottom: 60px; }.solution-detail-card { min-height: 190px; }.solution-detail-card h3 { margin-top: 35px; }.process-line { grid-template-columns: 1fr 1fr; }.process-line div:nth-child(3) { border-left: 0; border-top: 1px solid #b4c5da; }.process-line div:nth-child(4) { border-top: 1px solid #b4c5da; } }