:root{color-scheme:dark;--gutter:18px;--margin:36px;--top:112px;--ease:cubic-bezier(.19,1,.22,1)}*{box-sizing:border-box}html{background:#000;scrollbar-width:thin;scrollbar-color:#444 #000}body{margin:0;background:#000;color:#f7f7f4;font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer;padding:0}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:1px solid #ddd;outline-offset:7px}button,a{touch-action:manipulation}.header{position:fixed;inset:0 0 auto;height:94px;z-index:5;background:#000;display:flex;align-items:flex-start;padding:36px var(--margin);justify-content:space-between}.word,.header nav,.project-top,.project-footer,.project-meta{font-size:11px;letter-spacing:1.6px;font-weight:400}.header nav{display:flex;gap:42px}.header button,.header a,.project-top button,.project-footer button{position:relative;min-height:24px}.header button:after,.header a:after,.project-top button:after,.project-footer button:after{content:'';position:absolute;left:0;bottom:0;height:1px;width:100%;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}@media(hover:hover){.header button:hover:after,.header a:hover:after,.project-top button:hover:after,.project-footer button:hover:after{transform:scaleX(1)}}#header-mark{position:absolute;left:54%;top:13px;width:24px;height:62px;overflow:hidden}svg.mark{width:100%;height:100%;display:block;overflow:hidden}.mark path{transform-box:view-box;will-change:transform}#columns{position:fixed;inset:var(--top) var(--margin) 0;display:grid;grid-template-columns:41fr 28fr 19fr 12fr;gap:var(--gutter);overflow:hidden}.column{position:relative;min-width:0;overflow:hidden}.track{position:absolute;top:0;left:0;width:100%;will-change:transform}.card{display:block;position:relative;width:100%;margin:0 0 18px;padding:0;overflow:hidden;text-align:left;isolation:isolate;cursor:pointer}.card img{display:block;width:100%;height:auto;transition:transform 1s var(--ease);background:#101010}.label{position:absolute;left:18px;bottom:18px;padding:15px 16px;background:#15151566;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);font-size:11px;line-height:1.3;letter-spacing:1.5px;text-transform:uppercase;opacity:0;transform:translateY(5px);transition:opacity .4s,transform .6s var(--ease);pointer-events:none;max-width:calc(100% - 36px)}@media(hover:hover){.card:hover img,.card:focus-visible img{transform:scale(1.012)}.card:hover .label,.card:focus-visible .label{opacity:1;transform:none}}.logo-space{height:520px;display:flex;justify-content:center;padding-top:65px}.hero-mark{height:350px;width:137px;overflow:hidden}.header,.card{animation:appear .9s both}.card{animation-delay:.65s}@keyframes appear{from{clip-path:inset(0 0 100%)}to{clip-path:inset(0)}}dialog{padding:0;border:0;color:inherit;background:#000;max-width:none;max-height:none;width:100%;height:100dvh;inset:0;margin:0;overscroll-behavior:contain}dialog::backdrop{background:#000}#project{overflow:hidden}.project-top{position:absolute;inset:0 0 auto;height:94px;display:flex;align-items:center;justify-content:space-between;padding:0 36px;background:#000;z-index:4}.project-top #project-title{position:absolute;left:50%;transform:translateX(-50%);text-transform:uppercase}.project-meta{position:absolute;left:36px;top:132px;display:flex;flex-direction:column;gap:20px;z-index:2;text-transform:uppercase}#project-brand{font-size:16px}#project-count{color:#888;font-size:10px}#project-scroll{height:100%;overflow:auto;overscroll-behavior:contain;scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:#444 #000}#project-images{width:min(640px,50vw);margin:112px auto 100px;display:flex;flex-direction:column;gap:62px}.project-image{margin:0;scroll-margin-top:112px}.project-image img{display:block;width:100%;height:auto}.project-footer{position:absolute;inset:auto 0 0;height:58px;background:#000;display:flex;align-items:center;justify-content:space-between;padding:0 36px;z-index:3}.project-footer>div{display:flex;gap:35px}.project-footer button:disabled{opacity:.3;cursor:default}.project-footer button{font-size:10px;letter-spacing:1.4px}.flight{position:fixed;z-index:20;object-fit:fill;pointer-events:none;transform-origin:top left}#about{padding:36px}#about>button{position:absolute;right:36px;top:36px;font-size:11px;letter-spacing:1.5px;min-height:30px}#about>div{max-width:750px;margin:20vh auto}h1{font-weight:400;font-size:14px;letter-spacing:2px;text-transform:uppercase;margin-bottom:50px}#about p{font-size:clamp(27px,4vw,52px);line-height:1.2;letter-spacing:-.025em}#about a{font-size:14px}
@media(max-width:700px){:root{--margin:14px;--gutter:10px;--top:88px}.header{height:76px;padding:25px 14px}.word{font-size:9px;letter-spacing:1.5px}.header nav{gap:19px;font-size:9px;letter-spacing:1px}#header-mark{left:51%;width:17px;height:44px;top:15px}#columns{grid-template-columns:64fr 36fr}.column:nth-child(n+3){display:none}.logo-space{height:317px;padding-top:38px}.hero-mark{height:236px;width:92px}.card{margin-bottom:10px}.label{position:relative;display:block;left:auto;bottom:auto;margin:0;padding:9px 0 4px;opacity:1;transform:none;background:none;backdrop-filter:none;-webkit-backdrop-filter:none;font-size:8px;letter-spacing:1px;max-width:100%}.project-top{height:76px;padding:0 14px;font-size:9px;letter-spacing:1px}.project-top button{min-height:44px}.project-meta{display:none}#project-scroll{padding-top:0}#project-images{width:100%;margin:88px 0 100px;gap:30px}.project-image{scroll-margin-top:88px}.project-footer{height:calc(64px + env(safe-area-inset-bottom));padding:0 14px env(safe-area-inset-bottom);font-size:9px}.project-footer>div{gap:24px}.project-footer button{min-height:44px;font-size:9px}#about{padding:25px 20px}#about>button{right:20px;top:25px}#about>div{margin-top:24vh}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.track{will-change:auto}}

@media(max-width:700px){.header{padding-top:16px}.header nav{align-items:center}.header button,.header a{min-height:44px;display:flex;align-items:center}.header a:after,.header button:after{bottom:5px}}
.mobile-flow #columns{display:none}
#mobile-sequence{padding-top:88px}
.mobile-band{position:relative;margin:0 14px 38px;display:grid;grid-template-columns:61.8034fr 38.1966fr;gap:10px;overflow:hidden}
.mobile-lane{position:relative;min-width:0;overflow:hidden}
.mobile-track{position:absolute;inset:0 0 auto;will-change:transform}
.mobile-band .card{animation:none}
.mobile-logo-panel{display:flex;justify-content:center;overflow:hidden;margin-bottom:24px}
.mobile-logo-panel .mark{height:100%;width:auto;max-width:100%}
.mobile-feature{position:relative;height:86svh;min-height:500px;max-height:900px;margin:0 0 44px;overflow:hidden}
.mobile-feature .feature-card{height:100%;margin:0;animation:none}
.mobile-feature .feature-card img{position:absolute;top:-44px;height:calc(100% + 88px);width:100%;object-fit:cover;will-change:transform;transition:none}
.mobile-feature .label{position:absolute;left:14px;bottom:18px;padding:13px 15px;background:#15151566;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);font-size:9px;max-width:calc(100% - 28px)}
@media(prefers-reduced-motion:reduce){.mobile-track,.mobile-feature .feature-card img{will-change:auto}}
@font-face{font-family:SuisseIntl;src:url('assets/SuisseIntl-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:SuisseIntl;src:url('assets/SuisseIntl-Light.woff2') format('woff2');font-weight:300;font-display:swap}
body{font-family:SuisseIntl,Arial,Helvetica,sans-serif}
.journey-flow #columns{display:none}
.editorial{padding:130px 36px 140px;background:#000;position:relative}
.eyebrow{font-size:11px;letter-spacing:1.8px;margin:0 0 62px}
.editorial h1,.editorial h2{font-size:clamp(36px,4.5vw,72px);letter-spacing:-.035em;line-height:1.1;text-transform:none;font-weight:300;margin:0 0 42px;max-width:1000px}
.studio-copy{font-weight:300;font-size:20px;line-height:1.5;max-width:600px;margin:0 0 65px}
.services{display:flex;flex-wrap:wrap;gap:22px 45px;font-size:13px;letter-spacing:.3px}
.client-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:50px 30px;font-size:clamp(25px,3vw,48px);font-weight:300;letter-spacing:-.025em}
.feature-card>.label{display:none}
.feature-credit{position:absolute;left:36px;bottom:42px;display:flex;flex-direction:column;gap:10px;z-index:2;color:white;text-shadow:0 1px 15px #0008;pointer-events:none}
.feature-title{font-size:40px;letter-spacing:-.02em;font-weight:300}
.feature-photographer{font-size:12px;letter-spacing:.6px}
.feature-card:after{content:'';position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#0005);pointer-events:none}
.reveal{opacity:0;transform:translateY(12px);transition:opacity .8s var(--ease),transform 1s var(--ease);transition-delay:var(--delay,0ms)}
.reveal.revealed{opacity:1;transform:none}
.ending{padding-top:150px;padding-bottom:30px}
.email{font-size:17px;font-weight:300}
.end-line{display:flex;justify-content:space-between;align-items:center;margin-top:150px;padding-top:25px;border-top:1px solid #242424;font-size:10px;letter-spacing:1.4px;color:#999}
.back-top{display:flex;gap:25px;align-items:center;min-height:48px;color:#f7f7f4;font-size:11px;letter-spacing:1.5px}
.back-top span{font-size:26px;transition:transform .5s var(--ease)}
@media(hover:hover){.back-top:hover span{transform:translateY(-4px)}}
@media(min-width:701px){#mobile-sequence{padding-top:112px}.mobile-band{margin:0 36px 80px;grid-template-columns:41fr 28fr 19fr 12fr;gap:18px}.mobile-logo-panel{margin-bottom:18px}.mobile-feature{height:140vh;max-height:none;min-height:850px;margin-bottom:0;overflow:clip}.mobile-feature .feature-card{position:sticky;top:94px;height:calc(100vh - 94px);overflow:hidden}.mobile-feature .feature-card img{width:calc(100% + 110px);left:-55px;height:calc(100% + 90px);top:-45px}.mobile-logo-panel svg{max-width:80%}}
@media(max-width:700px){.editorial{padding:85px 20px 100px}.eyebrow{font-size:9px;letter-spacing:1.4px;margin-bottom:40px}.editorial h1,.editorial h2{font-size:36px;letter-spacing:-.035em;margin-bottom:30px}.studio-copy{font-size:16px;line-height:1.5;margin-bottom:40px;max-width:330px}.services{display:grid;grid-template-columns:1fr 1fr;gap:20px;font-size:11px}.client-grid{grid-template-columns:1fr 1fr;font-size:30px;gap:35px 20px}.feature-credit{left:20px;bottom:28px;gap:8px}.feature-title{font-size:32px}.feature-photographer{font-size:10px}.ending{padding-top:100px;padding-bottom:20px}.end-line{margin-top:100px;padding-top:20px;font-size:8px;letter-spacing:.7px}.back-top{font-size:9px;gap:12px}.email{font-size:15px}}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}}
.client-heading{display:flex;justify-content:space-between;gap:25px;align-items:flex-start}.client-total{font-size:10px;letter-spacing:1px;color:#888}
.client-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 35px;font-size:clamp(17px,1.55vw,24px);letter-spacing:-.01em;font-weight:300}
.client-cell{height:1.7em;overflow:hidden;white-space:nowrap;min-width:0}.client-stack{display:flex;flex-direction:column;will-change:transform}.client-stack>span{display:block;line-height:1.7em;height:1.7em;flex-shrink:0}
.client-controls{display:flex;justify-content:space-between;margin-top:40px;font-size:10px;letter-spacing:1.4px;color:#999}.client-controls button{min-width:40px;min-height:44px;font-size:10px;letter-spacing:1.4px}.client-pages{display:flex;gap:10px}.client-pages button[aria-current=true]{color:white;text-decoration:underline;text-underline-offset:7px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.service-link{text-align:left}.service-link:hover,.service-link:focus-visible{text-decoration:underline;text-underline-offset:5px}
.hello-link{position:relative;display:inline-block;isolation:isolate;padding:12px 0;min-height:60px}.hello-link>span{position:relative;z-index:2;mix-blend-mode:difference;color:white}.hello-link>img{position:absolute;left:35%;top:50%;width:270px;height:185px;object-fit:cover;z-index:1;pointer-events:none;opacity:0;transform:translate(-10%,-42%) rotate(-5deg) scale(.96);transition:opacity .35s,transform .65s var(--ease)}
@media(hover:hover){.hello-link:hover>img{opacity:1;transform:translate(0,-50%) rotate(-5deg) scale(1)}}.hello-link:focus-visible>img{opacity:1;transform:translate(0,-50%) rotate(-5deg) scale(1)}
.footer-services{margin-top:90px}.footer-services .eyebrow{margin-bottom:30px}.footer-services>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 30px;font-size:13px;max-width:900px}.end-line{gap:20px;margin-top:90px}
.mobile-feature .feature-card img{top:-100px;height:calc(100% + 200px)}
#services-page{padding:36px;overflow:auto}#services-close{position:fixed;right:36px;top:36px;font-size:11px;letter-spacing:1.5px;min-height:44px}.service-page-content{max-width:1000px;margin:110px auto 90px}.service-page-content h1{font-size:clamp(36px,5vw,72px);text-transform:none;letter-spacing:-.03em;font-weight:300}.service-page-content>a{display:inline-block;margin-top:70px;font-size:20px}#service-page-list{display:grid;grid-template-columns:1fr 1fr;gap:30px;font-size:24px;font-weight:300}#service-page-list a{padding:12px 0;border-bottom:1px solid #222}
@media(min-width:701px){.mobile-feature{height:160vh}.mobile-feature .feature-card img{width:calc(100% + 300px);left:-150px;height:calc(100% + 280px);top:-140px}}
@media(max-width:700px){.client-grid{grid-template-columns:repeat(2,minmax(0,1fr));font-size:clamp(10px,3vw,12px);gap:7px 16px}.client-total{font-size:8px;letter-spacing:.4px}.client-heading .eyebrow{margin-bottom:35px}.clients{padding:75px 20px 70px}.client-controls{margin-top:28px}.footer-services{margin-top:65px}.footer-services>div{grid-template-columns:1fr 1fr;font-size:11px;gap:18px 20px}.footer-services .eyebrow{font-size:8px;margin-bottom:25px}.hello-link>img{width:190px;height:145px;left:25%}.ending h2{font-size:52px}.end-line{flex-wrap:wrap;gap:10px}.end-line>span{order:3;width:100%;font-size:8px;color:#777}.header nav{font-size:8px;letter-spacing:.7px;gap:14px}#services-page{padding:20px}#services-close{right:20px;top:20px}.service-page-content{margin-top:95px}#service-page-list{grid-template-columns:1fr;font-size:22px;gap:18px}}
@media(min-width:701px){.clients{padding:90px 36px 80px}.client-heading .eyebrow{margin-bottom:40px}.client-grid{font-size:clamp(17px,1.4vw,23px);gap:6px 35px}}
:root{--ui-size:11px;--ui-tracking:1.3px}html{scrollbar-gutter:stable}html.modal-open{overflow:hidden}dialog{scrollbar-gutter:stable}
.header nav,.project-top,.project-footer,#services-close,#about-close,.panel-close,#service-page-list,.service-link,.service-page-content>a,.footer-services>div{font-size:var(--ui-size);letter-spacing:var(--ui-tracking);font-weight:400}
.header nav{align-items:center;gap:36px}.header nav button,#project-theme-toggle,#all-work,#services-close,#about-close,.panel-close{font-size:var(--ui-size)!important;letter-spacing:var(--ui-tracking);background:none;border:none;border-radius:0;box-shadow:none;text-transform:uppercase}
button:focus-visible,a:focus-visible{outline:none;text-decoration-thickness:2px;text-underline-offset:6px;filter:brightness(1.25)}
a,button:not(.card){text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;text-decoration-color:currentColor}
.card .label{text-decoration:underline;text-underline-offset:4px}.feature-title{text-decoration:underline;text-underline-offset:7px;text-decoration-thickness:1px}
.header button:after,.header a:after,.project-top button:after,.project-footer button:after{display:none}
a,button{position:relative}.is-running:before{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform-origin:left;pointer-events:none;animation:link-travel .6s var(--ease) both;z-index:5}
@keyframes link-travel{0%{clip-path:inset(0 100% 0 0)}65%{clip-path:inset(0)}100%{clip-path:inset(0 0 0 100%)}}
#services-close,#about-close,.panel-close{position:fixed;right:36px;top:25px;min-height:44px;z-index:4}
.service-page-content{max-width:1000px;margin:105px auto 100px}.service-page-content h1{font-size:var(--ui-size);text-transform:uppercase;letter-spacing:var(--ui-tracking);font-weight:400;margin-bottom:60px}
#service-page-list{grid-template-columns:1fr 1fr;gap:0 70px;font-size:var(--ui-size);font-weight:400}
#service-page-list a{display:grid;grid-template-columns:30px 1fr 18px;align-items:center;gap:15px;padding:28px 0;border-bottom:1px solid #202020;text-transform:uppercase;line-height:1.5;animation:service-arrival .7s var(--ease) both;animation-delay:calc(var(--i)*38ms)}
.service-index{font-size:9px;color:#666;text-decoration:none}.service-arrow{font-size:14px;color:#999;transition:transform .5s var(--ease)}
@keyframes service-arrival{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(hover:hover){.service-item:hover .service-arrow{transform:translate(2px,-2px)}}
.contact-content{max-width:1000px;margin:125px auto 100px;padding:0 36px}.contact-content h1{font-size:var(--ui-size);text-transform:uppercase;letter-spacing:var(--ui-tracking);margin-bottom:50px}.contact-content address{font-size:18px;line-height:1.6;font-style:normal;font-weight:300;margin-bottom:60px}
#departments{display:grid;grid-template-columns:1fr 1fr;gap:45px 80px}.department{animation:service-arrival .7s var(--ease) both;animation-delay:calc(var(--i)*45ms)}.department p{font-size:var(--ui-size);line-height:1.7;color:#999;margin:0 0 12px;max-width:400px}.department a{font-size:16px;font-weight:300}.contact-website{display:inline-block;margin-top:65px;font-size:var(--ui-size)}
.project-image img{transform-origin:center;will-change:auto;transition:none}.project-image.is-near img{will-change:transform}#project-scroll{scrollbar-gutter:stable}#project-images{overflow:visible}
.ending h2{max-width:none}.hello-link{display:flex;align-items:flex-end;width:100%;height:390px;overflow:hidden;padding:36px;isolation:isolate}.hello-link>span{mix-blend-mode:normal;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:10px}.hello-link>img{inset:0;width:100%;height:100%;opacity:1;object-fit:cover;object-position:center 25%;transform:none;z-index:0;transition:transform 1.1s var(--ease)}
.hello-link:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0007,transparent 75%);z-index:1;pointer-events:none}
@media(hover:hover){.hello-link:hover>img{transform:scale(1.015)}}.hello-link:focus-visible>img{transform:scale(1.015)}
.legal-links{display:flex;gap:30px;flex-wrap:wrap;margin-top:30px;font-size:9px;letter-spacing:.5px;color:#999}.footer-site{font-size:var(--ui-size)}
@media(max-width:700px){:root{--ui-size:9px;--ui-tracking:.8px}.header nav{font-size:var(--ui-size);gap:10px}.header .word{font-size:var(--ui-size)}#services-close,#about-close,.panel-close{right:14px;top:16px}.service-page-content{margin:90px auto 80px}.service-page-content h1{font-size:var(--ui-size);margin-bottom:30px}#service-page-list{grid-template-columns:1fr;font-size:var(--ui-size)}#service-page-list a{padding:23px 0}.service-index{font-size:8px}.contact-content{padding:0 20px;margin-top:105px}.contact-content address{font-size:16px;margin-bottom:45px}#departments{grid-template-columns:1fr;gap:32px}.department a{font-size:15px}.contact-website{margin-top:45px}.hello-link{height:250px;padding:22px}.hello-link>img{left:0;width:100%;height:100%;top:0}.ending h2{font-size:42px}.legal-links{gap:20px;font-size:8px}.end-line{align-items:center}.project-top,#services-close,#about-close{font-size:var(--ui-size)}}

/* A single quiet link language, with a white action sweep. */
a,button:not(.card),.card .label,.feature-title,.hello-link>span{ text-decoration:none }
.link-ink{position:relative;text-decoration:underline;text-decoration-thickness:.5px;text-underline-offset:5px;text-decoration-color:rgba(255,255,255,.5)}
.is-running:before{display:none}.is-running .link-ink:after{content:'';position:absolute;left:0;right:0;bottom:-5px;height:.5px;background:#fff;pointer-events:none;animation:link-travel .6s var(--ease) both;z-index:6}
.hello-link>.link-ink{z-index:2;text-decoration:underline;text-decoration-thickness:.5px;text-decoration-color:#ffffff80;text-underline-offset:5px}
.card .label,.feature-title{text-decoration:underline;text-decoration-color:#ffffff80;text-decoration-thickness:.5px}
button:focus-visible,a:focus-visible{filter:none;text-decoration-thickness:.5px}button:focus-visible .link-ink,a:focus-visible .link-ink{text-decoration-color:#fff}
.header #home{text-decoration:none;text-transform:none;letter-spacing:.2px}.header #home:before,.header #home:after{display:none}
#info-page{overflow-y:auto;padding:0 36px 100px;scrollbar-gutter:stable}.info-content{max-width:1000px;margin:115px auto 0}.info-content>h1,.info-content h2{font-size:var(--ui-size);letter-spacing:var(--ui-tracking);font-weight:400;text-transform:uppercase;line-height:1.6}.info-content>h1{margin:0 0 70px}.info-content>section{margin:0 0 100px;scroll-margin-top:100px}.info-content h2{color:#999;margin:0 0 35px}.info-about>p{max-width:660px;font-size:18px;font-weight:300;line-height:1.65;margin:0}.info-about>.info-statement{font-size:clamp(34px,4vw,58px);line-height:1.15;letter-spacing:-.035em;margin:0 0 28px}.info-content #service-page-list{display:grid;grid-template-columns:1fr 1fr;gap:0 70px}.info-content #service-page-list a{font-size:var(--ui-size);letter-spacing:var(--ui-tracking);font-weight:400}.info-contact address{font-style:normal;font-size:18px;line-height:1.6;font-weight:300;margin:0 0 45px}.info-contact .department{animation:none}.legal-links{justify-content:space-between;gap:18px;margin-top:36px;padding-bottom:10px}.legal-links>span{margin-left:auto}.service-item .service-index,.service-item .service-arrow{text-decoration:none}.info-content{animation:service-arrival .65s var(--ease) both}
@media(max-width:700px){#info-page{padding:0 20px 70px}.info-content{margin-top:100px}.info-content>h1{margin-bottom:50px}.info-content>section{margin-bottom:65px}.info-about>p{font-size:16px}.info-about>.info-statement{font-size:38px;max-width:280px}.info-content h2{margin-bottom:24px}.info-content #service-page-list{grid-template-columns:1fr;gap:0}.info-contact address{font-size:16px}.legal-links{justify-content:flex-start;gap:20px 22px}.legal-links>span{margin-left:0;flex-basis:100%}}
@media(prefers-reduced-motion:reduce){.info-content,.info-content #service-page-list a{animation:none}.is-running .link-ink:after{animation:none}}

/* Stills edition: plain service labels and a denser final camera roll. */
.header #home{text-transform:uppercase;letter-spacing:var(--ui-tracking);font-size:var(--ui-size)}
.services .service-label{font-size:var(--ui-size);letter-spacing:var(--ui-tracking);font-weight:400;text-decoration:none;line-height:1.8}
.info-content #service-page-list .service-item{display:grid;grid-template-columns:30px 1fr;align-items:center;gap:15px;padding:28px 0;border-bottom:1px solid #202020;font-size:var(--ui-size);letter-spacing:var(--ui-tracking);text-transform:uppercase;line-height:1.5;animation:service-arrival .7s var(--ease) both;animation-delay:calc(var(--i)*65ms)}
.info-content #service-page-list .service-name{text-decoration:none}.info-contact #departments{grid-template-columns:1fr}
@media(max-width:700px){.mobile-band.mobile-triple{grid-template-columns:5fr 3fr 2fr}.mobile-triple .label{font-size:7px;letter-spacing:.3px;line-height:1.5;padding-top:7px}.info-content #service-page-list .service-item{padding:23px 0}}
@media(prefers-reduced-motion:reduce){.info-content #service-page-list .service-item{animation:none}}

/* One physical underline: the white sweep fills its existing half-white track. */
.link-ink,.hello-link>.link-ink{display:inline-block;position:relative;text-decoration:none!important;vertical-align:baseline}
.link-ink:after,.is-running .link-ink:after{content:'';display:block;position:absolute;left:0;right:0;bottom:-5px;height:1px;transform:scaleY(.5);transform-origin:top;pointer-events:none;background-color:rgba(255,255,255,.5);background-image:linear-gradient(#fff,#fff);background-repeat:no-repeat;background-position:left center;background-size:0% 100%;clip-path:none;animation:none;z-index:6}
.is-running .link-ink:after{animation:underline-fill 760ms cubic-bezier(.45,0,.2,1) forwards}
@keyframes underline-fill{from{background-size:0% 100%}to{background-size:100% 100%}}
.client-pages button[aria-current=true]{text-decoration:none}
a:focus-visible .link-ink:after,button:focus-visible .link-ink:after{background-color:#fff}
.card[aria-busy=true]{cursor:progress}
/* Overscan exceeds the travel so the parallax never exposes an empty edge. */
.mobile-feature .feature-card img{width:100%;left:0;top:-210px;height:calc(100% + 420px);transition:none}
@media(min-width:701px){.mobile-feature .feature-card img{width:calc(100% + 420px);left:-210px;height:calc(100% + 320px);top:-160px}}
@media(prefers-reduced-motion:reduce){.is-running .link-ink:after{animation:none;background-size:100% 100%}.mobile-feature .feature-card img{transform:none!important}}

/* Project actions share the navigation's single physical underline. */
.card .label,.feature-title{text-decoration:none!important}
.card.is-running .label{opacity:1;transform:none}
.card .label .link-ink:after{bottom:-4px}
.feature-title.link-ink:after{bottom:-7px}
.mobile-track>.card:last-child{margin-bottom:0}
.project-image{transform-origin:center center}

/* Leave enough page below the final band to reach its upper-third finish. */
.ending{min-height:67vh}

/* Full-bleed photographic opening, with the approved mark at the left. */
#mobile-sequence{padding-top:0}
.opening{position:relative;height:100svh;min-height:560px;overflow:hidden;margin-bottom:38px;background:#111}
.opening-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:45% center}
.opening-mark{position:absolute;left:14px;bottom:94px;height:55%;width:46%;max-width:220px;pointer-events:none}
.opening-mark .mark{width:auto;height:100%;max-width:100%}
.header{background:transparent;transition:background-color .18s linear}
.past-opening .header{background:#000}
.scroll-cue{position:absolute;bottom:24px;left:calc(50% - 24px);width:48px;height:48px;font-size:28px;font-weight:300}
.scroll-cue>span{display:block;animation:scroll-breathe 2s ease-in-out infinite}
.scroll-cue .link-ink:after{display:none}
@keyframes scroll-breathe{0%,100%{transform:translateY(-3px)}50%{transform:translateY(4px)}}
.mark path{transition:none!important}
.is-running .link-ink:after{animation-duration:var(--action-duration,760ms)}
.mobile-track{backface-visibility:hidden;transform:translate3d(0,0,0)}
@media(min-width:701px){.opening{margin-bottom:80px}.opening-mark{left:36px;bottom:60px;height:70%;width:24%;max-width:none}.opening-photo{object-position:center 40%}}
@media(prefers-reduced-motion:reduce){.scroll-cue>span{animation:none}.header{transition:none}}

/* A centred, solid mark over a quiet portrait. */
.opening-mark{left:50%;top:50%;bottom:auto;transform:translate(-50%,-50%);height:55%;width:auto;max-width:none;aspect-ratio:465/1189}
.opening-mark .mark{width:100%;height:100%;max-width:none}
.opening-photo{object-position:center 38%}
.hello-link .hello-text{display:inline-flex;align-items:baseline;gap:.25em;text-decoration:none!important}
.hello-link .hello-text:after,.hello-link .link-ink:after{display:none!important}
.hello-arrow{display:inline-block;font-size:.7em;transition:transform .35s var(--ease)}
@media(hover:hover){.hello-link:hover .hello-arrow{transform:translate(2px,-2px)}}
@media(min-width:701px){.opening-mark{left:50%;top:50%;bottom:auto;height:70%;width:auto}.opening-photo{object-position:center 38%}}
@media(max-width:700px){.clients .client-grid{grid-template-columns:calc(var(--client-second-x,51vw) - 36px) minmax(0,1fr);column-gap:16px}}
@media(prefers-reduced-motion:reduce){.hello-arrow{transition:none}}
@media(min-width:701px){.opening-photo{object-position:center top}}

/* Shared centre and edge guides keep the mobile details on the same grid. */
#header-mark{left:50%;transform:translateX(-50%)}
.scroll-cue{left:50%;transform:translateX(-50%);display:grid;place-items:center}
.scroll-cue>.scroll-chevron{width:10px;height:10px;border-right:.7px solid currentColor;border-bottom:.7px solid currentColor;animation:chevron-breathe 2.4s ease-in-out infinite;transform:rotate(45deg)}
@keyframes chevron-breathe{0%,100%{transform:translateY(-2px) rotate(45deg)}50%{transform:translateY(3px) rotate(45deg)}}
.client-controls button{display:flex;align-items:center;text-align:left;justify-content:flex-start;min-width:0}
@media(max-width:700px){
 .mobile-band:not(.mobile-triple){grid-template-columns:68fr 32fr}
 .client-controls{display:grid;grid-template-columns:repeat(2,calc((var(--client-second-x) - 20px)/2)) minmax(0,1fr) auto;width:calc(var(--info-right) - 20px);align-items:center;font-size:8px;letter-spacing:.8px}
 .client-pages{display:contents}
 .client-controls button{font-size:8px;letter-spacing:.8px}
 .client-controls .client-pause{justify-content:flex-end;text-align:right}
 .ending .legal-links{font-size:7.5px;letter-spacing:.2px}
}
@media(prefers-reduced-motion:reduce){.scroll-cue>.scroll-chevron{animation:none;transform:rotate(45deg)}}

/* Scroll transforms live on independent HTML layers; vectors are painted once. */
.mark{display:block;position:relative;width:100%;height:100%;overflow:hidden;contain:paint}
.mark-letter{display:block;position:absolute;inset:0;transform:translate3d(0,0,0);will-change:transform;backface-visibility:hidden}
.mark-letter>svg{display:block;width:100%;height:100%;overflow:visible;transform:translate3d(0,0,0);backface-visibility:hidden}
.mark-letter path{will-change:auto;transform:none}
/* Translated content must never become an automatic scroll-position anchor. */
html,body,#work,.mobile-band,.mobile-lane,.mobile-track,.opening{overflow-anchor:none}
.mobile-band{overflow:clip;contain:layout paint}
.mobile-lane{overflow:clip;contain:paint}
.mobile-track{contain:layout style;transition:none!important;animation:none;perspective:none}
@media(prefers-reduced-motion:reduce){.mark-letter{will-change:auto}}


/* About uses one quiet heading and two short paragraphs. */
.studio>h2.eyebrow{font-size:var(--ui-size);font-weight:400;line-height:1.6;letter-spacing:var(--ui-tracking);text-transform:uppercase;margin:0 0 30px}
.studio .studio-copy{margin:0;max-width:600px}
.studio-copy p{margin:0}.studio-copy p+p,.info-about>p+p{margin-top:1.35em}

/* The closing invitation echoes the elongated opening mark. */
.ending .hello-link{height:clamp(360px,58vw,min(800px,calc(100svh - 200px)));padding:28px;align-items:stretch}
.hello-wordmark{position:relative;display:block;width:100%;height:100%;z-index:2;overflow:visible;mix-blend-mode:normal;opacity:1}
.hello-wordmark path{fill:none;stroke:#fff;stroke-width:1;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.ending .hello-link:after{display:none}
.ending .legal-links{display:flex;flex-wrap:nowrap;justify-content:flex-start;align-items:baseline;gap:10px;font-size:9px;letter-spacing:0;white-space:nowrap}
.ending .legal-links>span{margin-left:0;flex-basis:auto}
.legal-separator{color:#666}
@media(max-width:700px){.ending .hello-link{height:390px;padding:18px}.ending .legal-links{gap:5px;font-size:clamp(7px,2.1vw,9px);margin-top:24px}}

/* A warm full-width pause within the photographic sequence. */
.editorial.studio{background:#f26d00;color:#000}
.studio .studio-copy,.info-about{text-transform:uppercase}
.studio .studio-copy{line-height:1.6;letter-spacing:.015em}
.studio>h2.eyebrow{color:#000}

/* An equal black surround keeps the About module separate from the work. */
.mobile-feature:has(+.studio){margin-bottom:0}
.editorial.studio{margin:36px}
@media(max-width:700px){.editorial.studio{margin:14px}}

/* Preserve the complete horizontal runner artwork within its parallax frame. */
.nike-zero-gravity .feature-card img{width:100%;left:0;top:0;height:100%;object-fit:contain;object-position:center;background:#000}
@media(max-width:700px){
 .nike-zero-gravity{height:72vw;min-height:0;max-height:none}
 .nike-zero-gravity .feature-card img{width:100%;left:0;top:0;height:100%;object-fit:contain;object-position:center;background:#000}
 .nike-zero-gravity .feature-credit{bottom:10px}
}

.mobile-band{scroll-margin-top:94px}

/* Let the mobile runners feature follow the portrait photograph's proportions. */
@media(max-width:700px){
 .nike-runners-portrait{height:calc(100vw * var(--portrait-ratio));min-height:0;max-height:none}
 .nike-runners-portrait .feature-card img{width:100%;left:0;top:-16px;height:calc(100% + 32px);object-fit:cover;object-position:center}
}

/* Portrait artwork and a small, continuous image overscan on mobile. */
@media(max-width:700px){
 .nike-zero-gravity{height:calc(100vw * var(--portrait-ratio));min-height:0;max-height:none}
 .nike-zero-gravity .feature-card img{width:100%;left:0;top:-36px;height:calc(100% + 72px);object-fit:cover;object-position:center;background:#000}
 .nike-runners-portrait .feature-card img{top:-52px;height:calc(100% + 104px)}
}

/* The parallax surface has its own extended background; the source photo stays intact. */
.mobile-feature .feature-card .feature-original{position:absolute!important;width:1px!important;height:1px!important;top:0!important;left:0!important;opacity:0;pointer-events:none}
.mobile-feature .feature-art{position:absolute;left:0;top:-180px;width:100%;height:calc(100% + 360px);display:block;will-change:transform;pointer-events:none}
@media(max-width:700px){
 .mobile-feature{height:calc(100vw * var(--art-ratio) + 128px);min-height:0;max-height:none}
}

/* Runners use the original photograph directly, without background extension. */
.unextended-feature .feature-card img{width:100%;left:0;top:-52px;height:calc(100% + 104px);object-fit:cover;object-position:center}
@media(max-width:700px){
 .unextended-feature{height:calc(100vw * var(--art-ratio))}
 .unextended-feature .feature-card img{top:-16px;height:calc(100% + 32px)}
}
@media(min-width:701px){
 .unextended-feature .feature-card{height:min(calc(100vh - 94px),calc(100vw * var(--art-ratio) - 96px))}
}

/* Rise from the image edge, with each outline letter on its own composited layer. */
.hello-wordmark .hello-letter{position:absolute;inset:0;display:block;mix-blend-mode:normal;color:inherit;z-index:auto;transform:translate3d(0,112%,0);will-change:transform;pointer-events:none}
.hello-letter svg{display:block;width:100%;height:100%;overflow:visible}
@media(prefers-reduced-motion:reduce){.hello-wordmark .hello-letter{transform:none;will-change:auto}}

.project-top #project-title{max-width:65%;white-space:normal;text-align:center;line-height:1.4}
.mobile-band .label{white-space:normal;overflow-wrap:normal;line-height:1.35}

/* The copper feature fills the desktop viewport; mobile keeps the complete poster. */
@media(min-width:701px){.cdg-copper.unextended-feature .feature-card img{object-position:50% 38%}}

/* Copper is rendered as a visible image on every device; no hidden canvas source. */
.cdg-copper{background:#864528}
/* Image-only copper parallax: real artwork overscan, without added background strips. */
.cdg-copper .feature-card:after{display:none}
.cdg-copper.unextended-feature .feature-card img{height:calc(100% + 160px);top:-80px;object-fit:cover;background:transparent}
@media(max-width:700px){.cdg-copper.unextended-feature{height:calc(100vw * var(--art-ratio))}.cdg-copper.unextended-feature .feature-card img{height:calc(100% + 128px);top:-64px;object-position:center}}

/* A reversible colour treatment keeps the original photograph and detail intact. */
img.dazed-colour{filter:saturate(1.65) brightness(1.045)}

/* Native email activation keeps the complete image a single tap target. */
.hello-link{position:relative;cursor:pointer}.hello-link>img,.hello-link .hello-wordmark{pointer-events:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.nojs-content{padding:120px 24px 40px;max-width:1000px;margin:auto;line-height:1.7}.nojs-content ul{columns:2;list-style:none;padding:0}.nojs-content li{break-inside:avoid;margin-bottom:12px}

/* Feature photographs now move with normal page scrolling, without a sticky hold. */
.mobile-feature.static-feature{height:auto;min-height:0;max-height:none;overflow:hidden}
.mobile-feature.static-feature .feature-card{position:relative;top:auto;height:auto;overflow:hidden}
.mobile-feature.static-feature .feature-card img{position:relative;inset:auto;display:block;width:100%;height:auto;transform:none!important;will-change:auto;transition:none}
@media(min-width:701px){
 .project-meta{display:none}
 .mobile-feature.static-feature .feature-card{height:min(80vh,calc(100vw * var(--art-ratio)))}
 .mobile-feature.static-feature .feature-card img{height:100%;object-fit:cover}
 .mobile-feature.static-feature.cdg-copper .feature-card img{object-position:50% 38%}
}

/* An opaque line-by-line fan: a quiet sideways movement through a clean mask. */

/* A visible native email address settles below the final outline letter. */
.ending h2{position:relative}
.ending .hello-link{padding-bottom:62px}
.hello-email{position:absolute;left:28px;right:28px;bottom:20px;height:30px;overflow:hidden;z-index:3;visibility:hidden;color:#fff;font:400 var(--ui-size,11px)/24px SuisseIntl,Arial,sans-serif;text-transform:uppercase;cursor:pointer}
.hello-email>.link-ink{display:flex;justify-content:space-between;align-items:baseline;width:100%;padding-bottom:3px;transform:translate3d(0,120%,0);transition:transform 750ms cubic-bezier(.22,1,.36,1)}
.hello-email>.link-ink:after{bottom:0}
.hello-email.is-ready{visibility:visible}
.hello-email.is-ready>.link-ink{transform:none}
#header-mark{overflow:visible;cursor:pointer}
#header-mark:before{content:'';position:absolute;inset:-8px -12px}
#header-mark:after{display:none}
@media(max-width:700px){.ending .hello-link{padding-bottom:54px}.hello-email{left:18px;right:18px;bottom:14px;font-size:var(--ui-size,9px)}}
@media(prefers-reduced-motion:reduce){.hello-email>.link-ink{transition:none}}

/* A single half-white track fills before the main contact action hands off. */
.ending.mail-press .hello-email>.link-ink:after{animation:underline-fill 700ms cubic-bezier(.45,0,.2,1) forwards}
.ending.mail-complete .hello-email>.link-ink:after{animation:none;background-size:100% 100%;background-color:#fff}
@media(prefers-reduced-motion:reduce){.ending.mail-press .hello-email>.link-ink:after{animation:none;background-size:100% 100%}}

/* One quiet opening sequence: image first, then the complete interface, then its rules. */
#project[open] #all-work>.link-ink,#project[open] #project-title,#project[open] #project-theme-toggle>.link-ink,#project[open] #footer-count,#project[open] #previous>.link-ink,#project[open] #next>.link-ink{display:inline-block;opacity:0}
#project[open].project-imaging #all-work>.link-ink,#project[open].project-imaging #project-title,#project[open].project-imaging #project-theme-toggle>.link-ink,#project[open].project-imaging #footer-count,#project[open].project-imaging #previous>.link-ink,#project[open].project-imaging #next>.link-ink{opacity:1;animation:project-words-in 540ms cubic-bezier(.22,1,.36,1) 220ms backwards}
#project[open] .project-top .link-ink:after,#project[open] .project-footer .link-ink:after{transform:scale(0,.5);transform-origin:left center}
#project[open].project-imaging .project-top .link-ink:after,#project[open].project-imaging .project-footer .link-ink:after{transform:scale(1,.5);animation:project-line-in 820ms cubic-bezier(.22,1,.36,1) 760ms backwards}
#project[open] button:active .link-ink:after{animation:none;transform:scaleY(.5);background-size:100% 100%}
@keyframes project-words-in{from{opacity:0;translate:0 3px}to{opacity:1;translate:0 0}}
@keyframes project-line-in{from{transform:scale(0,.5)}to{transform:scale(1,.5)}}
@media(prefers-reduced-motion:reduce){#project[open] #project-title,#project[open] .project-top .link-ink,#project[open] .project-footer .link-ink,#project[open] #footer-count{opacity:1;animation:none!important}#project[open] .link-ink:after{transform:scaleY(.5)!important;animation:none!important}}

/* Constrain the layout from first paint, including Safari restore/rotation. */
html{width:100%;max-width:100%;overflow-x:hidden;overflow-x:clip;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{width:100%;max-width:100%;min-width:0}
#work,#mobile-sequence{width:100%;max-width:100%;min-width:0}
.opening,.mobile-feature,.editorial{min-width:0;max-width:100%}
.mobile-band{min-width:0}
/* Close remains a plain text action, including programmatic and keyboard focus. */
#project-theme-toggle,#services-close,#about-close,#info-close,.panel-close{appearance:none;-webkit-appearance:none;border:0;border-radius:0;box-shadow:none;background:none}
#project-theme-toggle:focus,#services-close:focus,#about-close:focus,#info-close:focus,.panel-close:focus{outline:none}
#project-theme-toggle:focus-visible>.link-ink:after,#services-close:focus-visible>.link-ink:after,#about-close:focus-visible>.link-ink:after,#info-close:focus-visible>.link-ink:after,.panel-close:focus-visible>.link-ink:after{animation:none!important;transform:scaleY(.5)!important;background-color:var(--action,#fff)!important;background-size:100% 100%!important;box-shadow:0 2px 0 var(--action,#fff)}
/* The visual layers must never intercept the native email anchor. */
.hello-link>*,.hello-email>*{pointer-events:none}

/* The gallery shares the same theme preference as the main navigation. */
.project-top #project-theme-toggle{margin-left:auto;flex:none;white-space:nowrap}
.project-top #project-title{max-width:calc(100% - 260px)}
@media(max-width:700px){.project-top #project-title{max-width:calc(100% - 166px)}}
/* Keep the athlete's face inside the taller phone crop. */
@media(max-width:700px){.opening-photo{object-position:85% center}}

/* Show every edge of the campaign artwork, with the wordmark clear of its Run mark. */
.opening{background:var(--paper,#000)}
.opening-photo{object-fit:contain;object-position:50% 50%;opacity:0;transition:opacity 520ms ease-in-out}
.opening.image-ready .opening-photo{opacity:1}
.opening-mark{top:42%;height:36%}
@media(min-width:701px){.opening-photo{object-position:50% 50%}.opening-mark{top:42%;height:52%}}
@media(prefers-reduced-motion:reduce){.opening-photo{transition:none}}

/* Opening choreography: mark, navigation, rules, photograph, then the pink cue. */
:root{--image-fade:1300ms;--run-pink:#fe0c49}
.opening-mark{top:48%;height:60%}
@media(min-width:701px){.opening-mark{top:48%;height:70%}}
.opening-photo{transition:opacity var(--image-fade) cubic-bezier(.22,1,.36,1)}
.header{animation:none}
.intro-pending .header #home,.intro-pending .header #theme-toggle,.intro-pending .header #header-mark{opacity:0;transition:opacity 450ms ease-in-out}
.intro-pending.intro-header-ready .header #home,.intro-pending.intro-header-ready .header #theme-toggle,.intro-pending.intro-header-ready .header #header-mark{opacity:1}
.intro-pending #theme-toggle .link-ink:after{transform:scale(0,.5);transform-origin:left center;transition:transform 550ms cubic-bezier(.22,1,.36,1)}
.intro-pending.intro-lines-ready #theme-toggle .link-ink:after{transform:scale(1,.5)}
.opening .scroll-cue{color:var(--run-pink);opacity:0;translate:0 -6px;pointer-events:none;transition:opacity 360ms ease-out,translate 360ms ease-out}
.opening.cue-ready .scroll-cue{opacity:1;translate:0 0;pointer-events:auto}
.opening .scroll-cue>.scroll-chevron{border-width:1.5px;animation-play-state:paused}
.opening.cue-ready .scroll-cue>.scroll-chevron{animation-play-state:running}
@media(prefers-reduced-motion:reduce){.opening-photo,.intro-pending .header #home,.intro-pending .header #theme-toggle,.intro-pending .header #header-mark,.intro-pending #theme-toggle .link-ink:after,.opening .scroll-cue{transition:none}.opening .scroll-cue{translate:none}}

/* The opening photograph fills the screen behind every opening control. */
.opening-photo{object-fit:cover;object-position:50% 50%}
@media(max-width:700px){.opening-photo{object-position:100% 50%}}

/* Let active native animations choose their layers; do not pin whole archives in GPU memory. */
.mobile-track{transform:none;backface-visibility:visible;will-change:auto;transition:none}

/* Desktop unfolds from two spacious columns into three, then four. */
@media(min-width:701px){
 .mobile-band[data-columns="2"]{grid-template-columns:61.8034fr 38.1966fr}
 .mobile-band[data-columns="3"]{grid-template-columns:50fr 30fr 20fr}
 .mobile-band[data-columns="4"]{grid-template-columns:41fr 28fr 19fr 12fr}
 .mobile-band .card{margin-bottom:28px}
 .mobile-band .label{font-size:11px;letter-spacing:1px;padding-top:12px;line-height:1.5}
}

/* Desktop captions follow the same image / credit / breathing-space rhythm as mobile. */
@media(min-width:701px){
 .mobile-band .card{margin-bottom:var(--gutter)}
 .mobile-band .label{position:relative;display:block;inset:auto;max-width:100%;margin:0;padding:12px 0 8px;background:none;color:inherit;backdrop-filter:none;-webkit-backdrop-filter:none;opacity:1;transform:none;transition:none;font-size:11px;letter-spacing:1px;line-height:1.5}
 .mobile-band .card img{transition:none}
 .mobile-band .card:hover img,.mobile-band .card:focus-visible img{transform:none}
 .mobile-band .card:before{content:'';position:absolute;inset:0 0 auto;width:100%;aspect-ratio:var(--image-ratio);background:rgba(255,255,255,.5);opacity:0;z-index:1;pointer-events:none;transition:opacity 320ms ease-in-out}
 .mobile-band .card:focus-visible:before{opacity:1}
 .mobile-feature.static-feature{margin-bottom:80px}
 .editorial.studio{margin-bottom:80px}
}
@media(min-width:701px) and (hover:hover) and (pointer:fine){.pointer-ready .mobile-band .card:hover:before{opacity:1}.journey-flow:not(.pointer-ready) .mobile-band .card:before{transition:none}}
@media(min-width:701px) and (prefers-reduced-motion:reduce){.mobile-band .card:before{transition:none}}

/* The scroll invitation quietly leaves as soon as the journey starts. */
.opening.cue-ready.cue-scrolled .scroll-cue{opacity:0;pointer-events:none;translate:0 -3px}
.opening.cue-scrolled .scroll-cue>.scroll-chevron{animation-play-state:paused}

/* Native document-flow fallback. Never emulate momentum with JS transforms. */
.mobile-band.natural-scroll .mobile-track{position:relative;inset:auto;transform:none!important;will-change:auto;backface-visibility:visible}

/* Keep archive containers in document flow. Native motion is card-sized so
   phone compositors never have to repaint an archive-height moving surface. */
.mobile-track{transform:none!important;contain:style;will-change:auto!important;backface-visibility:visible}
.mobile-band .card{animation:none!important;transition:none;backface-visibility:hidden}
.mobile-band .card img{aspect-ratio:var(--image-ratio);object-fit:cover}
.mobile-band.natural-scroll .card{transform:none!important}