.case-study-article{--case-gutter:24px;--case-border:#d4d4d4;--case-muted:#504f4f;--case-accent:var(--accent-spectral);color:#000;background:#efefef}.case-study-article__intro{border-bottom:1px solid var(--case-border);padding-top:clamp(104px,10vw,136px);padding-bottom:clamp(44px,6vw,72px)}.case-study-article__intro-grid{gap:clamp(28px,5vw,48px);display:grid}.case-study-article__intro-grid--text-only{grid-template-columns:minmax(0,1fr)}.case-study-article__hero-media{background:#111;border-radius:16px;width:min(78vw,340px);margin:0;overflow:hidden}.case-study-article__hero-media--portrait{max-width:340px}.case-study-article__hero-media--landscape{width:min(100%,440px)}.case-study-article__hero-media--video{max-width:calc(460px * var(--case-hero-ratio))}.case-study-article__hero-media img,.case-study-article__hero-media video{object-fit:contain;object-position:var(--case-media-position,50% 50%);width:100%;height:auto;max-height:460px;display:block}.case-study-article__inline-media img,.case-study-article__supporting-gallery img,.case-study-article__supporting-gallery video,.case-study-article__inline-media video{object-fit:contain;object-position:var(--case-media-position,50% 50%);width:100%;height:auto;display:block}.case-study-article__video-frame{width:100%;height:auto;position:relative}.case-study-article__video-frame picture{display:block}.case-study-article__sound-toggle{color:#fff;cursor:pointer;opacity:0;pointer-events:none;background:#070707cc;border:1px solid #ffffff59;border-radius:50%;place-items:center;width:44px;height:44px;padding:0;transition:opacity .16s,background .16s;display:grid;position:absolute;top:12px;right:12px}.case-study-article__sound-toggle svg{width:20px;height:20px}.case-study-article__video-frame:hover .case-study-article__sound-toggle,.case-study-article__video-frame:focus-within .case-study-article__sound-toggle,.case-study-article__sound-toggle[aria-pressed=true]{opacity:1;pointer-events:auto}.case-study-article__sound-toggle:hover{background:#070707}.case-study-article__sound-toggle:focus-visible{outline-offset:3px;outline:2px solid #fff}@media (width<=767px),(hover:none),(pointer:coarse){.case-study-article__sound-toggle{opacity:1;pointer-events:auto}}@media (prefers-reduced-motion:reduce){.case-study-article__sound-toggle{transition:none}}.case-study-article__shell{width:min(100%,1440px);padding-inline:var(--case-gutter);margin-inline:auto}.case-study-article__header{border-bottom:0;align-self:center;padding:0;scroll-margin-top:120px}.case-study-article__back{color:inherit;font-size:var(--type-ui);text-underline-offset:5px;align-items:center;gap:8px;margin-bottom:clamp(24px,4vw,40px);font-weight:750;display:inline-flex}.case-study-article__title-row{gap:36px;display:grid}.case-study-article__client,.case-study-article__eyebrow,.case-study-article__aside>div>p,.case-study-article__cta>div>p{color:var(--case-muted);font-size:var(--type-label);letter-spacing:.12em;text-transform:uppercase;margin:0;font-weight:800}.case-study-article__client{margin-bottom:16px}.case-study-article__header h1{max-width:17ch;font-size:var(--type-case-title);letter-spacing:-.058em;margin:0;font-weight:650;line-height:.94}.case-study-article__summary{align-content:end;gap:28px;display:grid}.case-study-article__summary>p{max-width:36rem;color:var(--case-muted);font-size:var(--type-body-large);margin:0;line-height:1.52}.case-study-article__summary ul{flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none;display:flex}.case-study-article__summary li{font-size:var(--type-label);letter-spacing:.04em;text-transform:uppercase;border:1px solid #a7a7a7;border-radius:999px;padding:8px 13px;font-weight:700}.case-study-article__layout{gap:64px;padding-block:clamp(32px,7vw,96px) 0;display:grid}.case-study-article__content{min-width:0}.case-study-article__section{border-top:1px solid var(--case-border);padding-block:clamp(52px,7vw,88px);scroll-margin-top:120px}.case-study-article__section:first-child{border-top:0;padding-top:0}.case-study-article__section h2{max-width:18ch;font-size:var(--type-section-title);letter-spacing:-.052em;margin:14px 0 28px;font-weight:650;line-height:.96}.case-study-article__section>p:not(.case-study-article__eyebrow),.case-study-article__chapter-copy>p:not(.case-study-article__eyebrow){color:#2c2c2c;max-width:46rem;font-size:var(--type-body-large);margin:0 0 1.25em;line-height:1.62}.case-study-article__section--lead>p:not(.case-study-article__eyebrow):first-of-type{color:#000}.case-study-article__section--approach{color:#fff;background:#000;border:0;border-radius:22px;padding:clamp(32px,5vw,64px)}.case-study-article__section--approach .case-study-article__eyebrow,.case-study-article__results .case-study-article__eyebrow,.case-study-article__outcome .case-study-article__eyebrow{color:#bdbdbd}.case-study-article__section--approach h2{max-width:20ch;margin-bottom:0}.case-study-article__section--approach>p:not(.case-study-article__eyebrow){color:#d4d4d4}.case-study-article__list{border-top:1px solid var(--case-border);max-width:46rem;margin:32px 0 0;padding:0;list-style:none;display:grid}.case-study-article__list li{border-bottom:1px solid var(--case-border);font-size:var(--type-body);font-weight:var(--weight-body);padding:15px 12px 15px 32px;line-height:1.4;position:relative}.case-study-article__list li:before{content:"";background:#f65fff;border-radius:50%;width:6px;height:6px;position:absolute;top:20px;left:8px}.case-study-article__inline-media{background:#d4d4d4;border-radius:20px;gap:16px;width:100%;margin:clamp(34px,5vw,56px) 0 0;display:grid;overflow:hidden}.case-study-article__inline-media--device{background:0 0;border-radius:0;overflow:visible}.case-study-article__device{aspect-ratio:35.6/72.2;width:min(100%,300px);margin-inline:auto;position:relative}.case-study-article__device-frame{position:absolute;top:0;left:0;transform-origin:0 0!important}.case-study-article__device img{object-fit:contain;border-radius:0;width:100%;height:100%;display:block}.case-study-article__supporting-gallery{grid-column:1/-1;align-items:start;gap:16px;min-width:0;margin:24px 0 0;display:grid}.case-study-article__device-fan{aspect-ratio:1.25;isolation:isolate;width:min(100%,780px);margin:clamp(32px,5vw,56px) auto 0;position:relative}.case-study-article__device-fan-item{width:30%;position:absolute;top:13%;left:8%;transform:rotate(-12deg)}.case-study-article__device-fan-item:nth-child(2){z-index:1;top:5%;left:35%;transform:none}.case-study-article__device-fan-item:nth-child(3){left:62%;transform:rotate(12deg)}.case-study-article__device-fan .case-study-article__device{width:100%}.case-study-article__phone-screen{color:#fff;background:#000;flex-direction:column;height:100%;display:flex}.case-study-article__phone-status{flex:0 0 6rem;justify-content:space-between;align-items:center;padding:0 2rem;font:600 1.5rem/1 system-ui,sans-serif;display:flex}.case-study-article__phone-status-icons{align-items:center;gap:.4rem;display:flex}.case-study-article__phone-status-icons svg{width:1.4rem;height:1.4rem}.case-study-article__phone-status-icons svg:last-child{width:1.8rem}.case-study-article__phone-page{overscroll-behavior:contain;scrollbar-width:none;flex:1;min-height:0;overflow:auto}.case-study-article__phone-page:focus-visible{outline:3px solid var(--color-primary,#f65fff);outline-offset:-3px}.case-study-article__phone-page img{height:auto}.case-study-article__supporting-gallery img,.case-study-article__supporting-gallery .case-study-article__video-frame{border-radius:16px;overflow:hidden}@media (width>=640px){.case-study-article__supporting-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}.case-study-article__results,.case-study-article__outcome{color:#fff;background:#000;border:0;border-radius:22px;padding:clamp(32px,5vw,64px)}.case-study-article__results dl{margin:0 0 40px;padding:0}.case-study-article__metric-group h3{color:#fff;font-size:var(--type-subheading);letter-spacing:-.025em;margin:0 0 12px;line-height:1.2}.case-study-article__results dl>div{border-bottom:1px solid #504f4f;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:28px;padding-block:20px;display:grid}.case-study-article__results dt{color:#d4d4d4;max-width:24ch;font-size:var(--type-body-small);text-transform:uppercase;line-height:1.35}.case-study-article__results dd{letter-spacing:-.06em;text-align:right;margin:0;font-size:clamp(2rem,7vw,5.4rem);font-weight:650;line-height:.84}.case-study-article__results>p:not(.case-study-article__eyebrow),.case-study-article__outcome>p:not(.case-study-article__eyebrow){color:#d4d4d4}.case-study-article__outcome{margin-top:clamp(24px,4vw,48px)}.case-study-article__outcome h2{max-width:16ch}.case-study-article__outcome .case-study-article__eyebrow,.case-study-article__outcome>p:not(.case-study-article__eyebrow){color:#fff}.case-study-article__quote{background:#fff;border:1px solid #a7a7a7;border-radius:22px;margin:clamp(24px,4vw,48px) 0 0;padding:clamp(28px,5vw,56px)}.case-study-article__quote p{font-size:var(--type-subheading);font-weight:var(--weight-body);letter-spacing:-.025em;margin:0;line-height:1.25}.case-study-article__quote cite{color:var(--case-muted);font-size:var(--type-label);letter-spacing:.1em;text-transform:uppercase;margin-top:26px;font-style:normal;font-weight:800;display:block}.case-study-article__aside{display:none}.case-study-article__cta{padding:clamp(80px, 12vw, 168px) var(--case-gutter);background:0 0}.case-study-article__cta>div{width:min(100%,1344px);margin-inline:auto}.case-study-article__cta h2{max-width:15ch;font-size:var(--type-section-title);letter-spacing:-.055em;margin:18px 0 24px;font-weight:650;line-height:.92}.case-study-article__cta>div>span{max-width:38rem;color:var(--case-muted);font-size:var(--type-body-large);line-height:1.5;display:block}.case-study-article__cta a{color:#fff;font-size:var(--type-ui);transition:background-color .2s var(--ease-out), transform .2s var(--ease-out);background:#000;border-radius:999px;align-items:center;gap:14px;margin-top:36px;padding:14px 22px;font-weight:750;text-decoration:none;display:inline-flex}.case-study-article__cta a svg{width:18px;height:18px}.case-study-article__cta a:hover{background:#504f4f;transform:translateY(-2px)}.case-study-article a:focus-visible{outline-offset:4px;outline:2px solid #f65fff}@media (width>=768px){.case-study-article{--case-gutter:32px}.case-study-article__results dl>div{padding-block:28px}.case-study-article__chapter:has(.case-study-article__inline-media){grid-template-columns:minmax(260px,.82fr) minmax(0,1fr);align-items:center;column-gap:clamp(40px,6vw,72px);display:grid}.case-study-article__chapter:has(.case-study-article__inline-media) .case-study-article__chapter-copy{grid-column:2}.case-study-article__chapter:has(.case-study-article__inline-media) .case-study-article__inline-media{grid-area:1/1;margin:0}}@media (width>=1100px){.case-study-article{--case-gutter:48px}.case-study-article__intro-grid{grid-template-columns:minmax(300px,.68fr) minmax(0,1.32fr);align-items:center;gap:clamp(44px,5vw,72px)}.case-study-article__intro-grid--text-only{grid-template-columns:minmax(0,1fr)}.case-study-article__hero-media{justify-self:start;width:min(100%,440px)}.case-study-article__hero-media--portrait{width:min(100%,340px)}.case-study-article__header h1{max-width:17ch}.case-study-article__layout{grid-template-columns:minmax(0,1fr) 240px;gap:clamp(72px,9vw,136px)}.case-study-article__aside{order:2;display:block}.case-study-article__aside>div{position:sticky;top:118px}.case-study-article__aside ol{border-top:1px solid var(--case-border);margin:18px 0 0;padding:0;list-style:none}.case-study-article__aside a{border-bottom:1px solid var(--case-border);color:var(--case-muted);font-size:var(--type-body-small);transition:color .2s var(--ease-out), transform .2s var(--ease-out);grid-template-columns:30px minmax(0,1fr);gap:8px;padding-block:13px;line-height:1.25;text-decoration:none;display:grid}.case-study-article__aside a span{color:#8a8a8a;font-size:var(--type-label);font-weight:750}.case-study-article__aside a:hover,.case-study-article__aside a[aria-current=location]{color:#000;transform:translate(8px)}.case-study-article__aside a[aria-current=location] span{color:var(--case-accent)}}@media (width<=599px){.case-study-article__intro{padding-top:96px;padding-bottom:48px}.case-study-article__hero-media{width:min(72vw,260px)}.case-study-article__header h1{font-size:min(var(--type-case-title), 3.25rem)}.case-study-article__results dl>div{grid-template-columns:1fr;gap:10px}.case-study-article__results dd{text-align:left;order:-1}}@media (prefers-reduced-motion:reduce){.case-study-article__cta a,.case-study-article__aside a{transition:none}.case-study-article__cta a:hover{transform:none}}
