html:has(.case-page){scroll-behavior:smooth}.case-page .design-guides--inner{z-index:2}.case-page .design-guides--inner>.design-guide{background:var(--line);width:1px;height:100%}.case-page .design-guides--outer{z-index:4}.case-guide-repeat{top:8082px}.case-breadcrumb{color:var(--muted);align-items:center;gap:12px;font-size:14px;line-height:23px;display:flex}.case-breadcrumb a{align-items:center;gap:10px;display:flex}.case-breadcrumb a:hover{color:var(--ink)}.case-breadcrumb [aria-current]{color:var(--ink);font-weight:500}.case-desktop-header .case-breadcrumb{position:fixed;top:48px;left:20px}.case-hero{padding-top:199px;padding-bottom:48px;position:relative}.case-hero:after,.case-section:after{content:"";width:calc(100% - var(--guide-inset) * 2);background:var(--line);pointer-events:none;max-width:700px;height:1px;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.case-hero-title{letter-spacing:.048px;text-box-trim:trim-both;text-box-edge:cap alphabetic;width:calc(100% - 236px);height:17px;margin-inline:auto;font-size:24px;font-weight:500;line-height:34px}.case-hero-media{z-index:3;aspect-ratio:850/505;border-block:1px solid var(--line);background:#fbfbfb;width:100%;margin-top:48px;position:relative;overflow:hidden}.case-comparison-viewport:after{content:"";z-index:1;border-block:1px solid var(--line);pointer-events:none;position:absolute;inset:0}.case-hero-media .project-video{object-position:center}.case-metadata{gap:10px;margin-top:48px;display:grid}.case-metadata>div{grid-template-columns:64px 1fr;gap:10px;display:grid}.case-metadata dt{color:var(--secondary)}.case-section{padding-block:48px;scroll-margin-top:0;position:relative}.case-section:focus{outline:none}.case-text{flex-direction:column;gap:32px;display:flex}.case-text h2{letter-spacing:.032px;text-box-trim:trim-both;text-box-edge:cap alphabetic;min-height:12px;font-size:16px;font-weight:500;line-height:38.4px}.case-paragraphs{color:var(--secondary);gap:24px;display:grid}.case-text--slate .case-paragraphs{color:var(--case-copy)}.case-detail-rows{gap:32px;margin-top:48px;display:grid}.case-detail-row{grid-template-columns:160px 1fr;gap:48px;display:grid}.case-detail-row dt{font-weight:500}.case-detail-row dd{color:var(--secondary)}.case-detail-row:not(:first-child) dd{max-width:364px}.case-media-width{width:calc(100% - 150px);max-width:700px;margin-inline:auto}.case-panel{z-index:0;border-block:1px solid var(--line);background:#fbfbfb;height:505px;margin-top:48px;position:relative;overflow:hidden}.case-pillars,.case-principles{place-items:center;display:grid}.case-concepts{color:#000;justify-content:space-between;align-items:flex-start;width:500px;display:flex}.case-concepts li{text-align:center;flex-direction:column;align-items:center;gap:12px;width:64px;font-weight:500;display:flex}.case-concepts li>span>span{display:block}.case-principles li{width:120px}.case-screen-scroller{place-items:center;width:100%;height:100%;display:grid}.case-screen-group{align-items:center;gap:19.45px;width:598px;display:flex}.case-screen{border:2.5px solid #fff;border-radius:20px;flex-shrink:0;width:186.343px;height:403.887px;position:relative;overflow:hidden}.case-screen img{object-fit:cover}.case-onboarding--original .case-screen{aspect-ratio:1170/2532;border:0;border-radius:24px;width:186.367px;height:auto}.case-onboarding--single .case-screen-group{justify-content:center;width:100%}.case-onboarding--single .case-screen{width:185px;height:401px}.case-screen-scroll-hint{display:none}.case-screen-description{margin-top:48px}.case-screen-description h3{letter-spacing:.2px;text-box-trim:trim-both;text-box-edge:cap alphabetic;min-height:11px;font-size:15px;font-weight:500;line-height:24px}.case-screen-description p{color:var(--secondary)}.case-comparison-viewport{z-index:0;background:#fbfbfb;height:505px;margin-top:48px;position:relative;overflow:hidden}.case-comparison-track{width:200%;height:100%;transition:transform var(--duration-content) var(--ease-in-out);grid-template-columns:repeat(2,minmax(0,1fr));display:grid;transform:translate(0)}.case-comparison[data-selected=after] .case-comparison-track{transform:translate(-50%)}.case-comparison [role=tabpanel]{visibility:hidden;min-width:0;height:100%;transition:visibility 0s linear var(--duration-content)}.case-comparison [role=tabpanel][aria-hidden=false]{visibility:visible;transition-delay:0s}.case-comparison [role=tabpanel] .case-panel{width:100%;max-width:none;height:100%;margin:0}.case-comparison-tabs{isolation:isolate;border:1px solid var(--line);background:var(--raised);border-radius:999px;width:fit-content;height:48px;margin:48px auto 0;padding:4px;display:flex;position:relative}.case-comparison-selection{z-index:-1;border-radius:inherit;background:var(--selected-surface);width:128px;transition:transform var(--duration-content) var(--ease-in-out);pointer-events:none;position:absolute;inset:4px auto 4px 4px;transform:translate(0);box-shadow:0 2px 2px #e5e5e517,0 7px 3.5px #e5e5e514}.case-comparison[data-selected=after] .case-comparison-selection{transform:translate(100%)}.case-comparison-tabs button{width:128px;color:var(--secondary);transition:color .14s ease, transform var(--duration-press) var(--ease-out);border-radius:999px}.case-comparison-tabs button[aria-selected=true]{color:var(--ink)}.case-comparison[data-motion=pointer] .case-comparison-tabs button:active{transform:scale(.97)}.case-comparison-tabs button:hover{color:var(--ink)}.case-comparison[data-motion=instant] .case-comparison-track,.case-comparison[data-motion=instant] [role=tabpanel],.case-comparison[data-motion=instant] .case-screen-group,.case-comparison[data-motion=instant] .case-comparison-selection,.case-comparison[data-motion=instant] button{transition:none}.case-section-navigation{position:relative}.case-section-navigation>.active-marker{pointer-events:none;transition:transform var(--duration-content) var(--ease-in-out)}.case-section-navigation[data-motion=instant]>.active-marker{transition:none}.case-section-disclosure{font-size:14px}@supports not (text-box-trim:trim-both){.case-hero-title{height:auto;margin-block:-8.5px}.case-text h2{margin-block:-13.2px}.case-screen-description h3{margin-block:-6.5px}}@media (min-width:768px) and (max-width:1199px){.case-desktop-header .case-breadcrumb{top:32px;left:24px}.case-hero{padding-top:176px}.case-section{scroll-margin-top:-16px}.case-hero-title{width:calc(100% - 64px);max-width:604px;height:auto}.case-page .case-media-width{width:calc(100% - 48px);max-width:none}.case-detail-row{grid-template-columns:140px 1fr;gap:32px}.case-concepts{width:min(500px,100% - 64px)}.case-principles li{width:120px}}@media (min-width:1200px) and (max-width:1279px){.case-sidebar-navigation{width:127px;left:24px}.case-sidebar-navigation .active-marker{left:-16px}}.case-onboarding{container-type:inline-size}@container (max-width:630px){.case-onboarding:not(.case-onboarding--single) .case-screen-scroller{overscroll-behavior-inline:contain;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#ccc transparent;height:calc(100% - 40px);display:block;overflow:auto hidden}.case-onboarding:not(.case-onboarding--single) .case-screen-group{width:max-content;min-width:100%;height:100%;padding-inline:24px}.case-onboarding:not(.case-onboarding--single) .case-screen{scroll-snap-align:center}.case-onboarding:not(.case-onboarding--single) .case-screen-scroll-hint{color:#5a5a5a;pointer-events:none;font-size:12px;line-height:20px;display:block;position:absolute;bottom:12px;left:24px;right:24px}}@media (max-width:767px){.case-mobile-header .mobile-header-bar{gap:12px}.case-breadcrumb{gap:8px;min-width:0;font-size:13px}.case-breadcrumb a{flex-shrink:0;gap:6px;min-height:44px}.case-breadcrumb [aria-current]{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.case-mobile-header .mobile-header-actions{flex-shrink:0}.case-mobile-header .mobile-navigation{z-index:2}.case-section-disclosure{border-top:1px solid var(--line);position:relative}.case-section-trigger{width:100%;min-height:48px;padding-inline:var(--text-inset);color:var(--ink);text-align:left;justify-content:space-between;align-items:center;gap:16px;display:flex}.case-section-trigger>span:first-child{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.case-section-icon{width:16px;height:16px;color:var(--muted);transition:color .14s ease, transform var(--duration-content) var(--ease-out);flex:0 0 16px;position:relative}.case-section-icon:before,.case-section-icon:after{content:"";background:currentColor;width:12px;height:1.5px;position:absolute;top:7.25px;left:2px}.case-section-icon:after{transform:rotate(90deg)}.case-section-trigger:hover .case-section-icon,.case-section-trigger[aria-expanded=true] .case-section-icon{color:var(--ink)}.case-section-trigger[aria-expanded=true] .case-section-icon{transform:rotate(45deg)}.case-section-popup{left:var(--text-inset);right:var(--text-inset);max-height:calc(100dvh - var(--mobile-header-height) - 82px);transform-origin:16px -16px;position:absolute}.case-hero{padding-top:64px;padding-bottom:32px}.case-hero:after,.case-section:after{max-width:none}.case-hero-title{width:calc(100% - var(--text-inset) * 2);height:auto;font-size:clamp(22px,5.7vw,28px);line-height:1.4}.case-hero-media{width:calc(100% - var(--text-inset) * 2);margin:32px auto 0}.case-metadata{margin-top:32px}.case-section{scroll-margin-top:calc(var(--mobile-header-height) + 34px);padding-block:32px}.case-page .case-media-width{width:calc(100% - var(--text-inset) * 2);max-width:none}.case-text{gap:24px}.case-detail-rows,.case-panel,.case-screen-description,.case-comparison-viewport,.case-comparison-tabs{margin-top:32px}.case-comparison-tabs{--case-tab-width:min(128px, calc((100vw - var(--mobile-outer-gutter) * 2 - var(--text-inset) * 2 - 10px) / 2))}.case-comparison-tabs button,.case-comparison-selection{width:var(--case-tab-width)}.case-detail-rows{gap:24px}.case-detail-row{grid-template-columns:1fr;gap:8px}.case-detail-row dd,.case-detail-row:not(:first-child) dd{max-width:none}.case-page .case-panel,.case-comparison-viewport{height:var(--mobile-media-height)}.case-onboarding:not(.case-onboarding--single) .case-screen-scroller{height:100%;display:grid;overflow:visible}.case-onboarding:not(.case-onboarding--single) .case-screen-group,.case-onboarding--single .case-screen-group{gap:3.25251%;width:70.3529%;min-width:0;height:auto;padding-inline:0}.case-onboarding .case-screen{aspect-ratio:186.343/403.887;border-width:.294118cqw;border-radius:2.35294cqw;flex:1;width:auto;height:auto}.case-onboarding--original .case-screen{aspect-ratio:1170/2532;border:0;border-radius:2.82353cqw}.case-onboarding--single .case-screen-group{width:21.7647%}.case-onboarding--single .case-screen{aspect-ratio:185/401}.case-onboarding:not(.case-onboarding--single) .case-screen-scroll-hint{display:none}.case-concepts{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;width:calc(100% - 32px);display:grid}.case-concepts li,.case-principles li{width:auto;min-width:0;font-size:13px;line-height:20px}}@media (prefers-reduced-motion:reduce){.case-comparison [role=tabpanel]{transition-delay:.1s}.case-comparison [role=tabpanel][aria-hidden=false]{transition-delay:0s}.case-comparison .case-screen-group{transition:opacity .1s var(--ease-out);transform:none;transition-duration:.1s!important}.case-comparison [aria-hidden=true] .case-screen-group{opacity:0}.case-comparison [aria-hidden=false] .case-screen-group{opacity:1}.case-comparison[data-motion=instant] .case-screen-group{transition:none!important}.case-section-icon,.case-comparison-track,.case-comparison-selection,.case-section-navigation>.active-marker{transition:none}.case-comparison[data-motion=pointer] .case-comparison-tabs button:active{transform:none}}
