/* Progressive motion enhancement; static layout and typography live in style.css. */
:root{--editorial-ease:cubic-bezier(.22,.68,.15,1)}
.commercial-journey{padding-top:0}
.commercial-heading{border-top:1px solid #0b0e1320;padding-top:65px}
.commercial-heading h2{max-width:1050px}
.commercial-heading .lead{max-width:770px;margin-top:30px}
.commercial-stages{position:relative;isolation:isolate;display:grid;grid-template-columns:repeat(14,minmax(0,1fr));list-style:none;padding:0;margin:75px 0 45px;--commercial-progress:1}
.commercial-stages:before{content:'';position:absolute;top:15px;left:15px;right:calc(100% / 14 - 15px);height:1px;background:#0b0e1326;z-index:-1;pointer-events:none}

.commercial-stages li{min-width:0;padding-right:8px}
.commercial-number{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border:1px solid #0b0e1326;border-radius:50%;background:#faf7f2;font-family:Antonio,sans-serif;font-size:12px;font-weight:400;transition:border-color 650ms var(--editorial-ease),color 650ms var(--editorial-ease)}
.commercial-label{display:block;margin-top:22px;font-family:Antonio,sans-serif;font-size:clamp(14px,1.05vw,18px);font-weight:400;line-height:1.4}

@media(max-width:1200px){
 .commercial-stages{display:block;margin:50px 0 30px}
 .commercial-stages:before{left:15px;right:auto;top:15px;bottom:15px;width:1px;height:auto}

 .commercial-stages li{display:grid;grid-template-columns:30px 1fr;gap:25px;align-items:start;padding:0 0 32px}
 .commercial-label{margin:2px 0 0;font-size:22px}
 .commercial-stages li:last-child{padding-bottom:0}
}
@media(max-width:700px){.commercial-heading{padding-top:45px}.commercial-heading h2 br{display:none}.commercial-heading .lead{margin-top:25px}.commercial-stages{margin-top:40px}.commercial-stages li{padding-bottom:35px}}
@media(prefers-reduced-motion:reduce){.commercial-stages li,.commercial-number{transition:none!important;transform:none!important;opacity:1!important}.commercial-stages:after{transform:none!important}}
.hero>.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 58%;pointer-events:none}
.motion-enabled .hero{overflow:hidden}
.motion-enabled .hero>img{position:absolute;top:-2%;height:104%;transform:translate3d(0,var(--hero-depth,0px),0);animation:hero-image-opening 900ms var(--editorial-ease) both}
.motion-enabled .hero>.hero-video{top:-2%;bottom:auto;height:104%;transform:translate3d(0,var(--hero-depth,0px),0);animation:hero-image-opening 900ms var(--editorial-ease) both}
.motion-enabled .hero-content>.eyebrow,.motion-enabled .hero-content>h1,.motion-enabled .hero-bottom{animation:hero-copy-opening 750ms var(--editorial-ease) both}
.motion-enabled .hero-content>.eyebrow{animation-delay:160ms}
.motion-enabled .hero-content>h1{animation-delay:230ms}
.motion-enabled .hero-bottom{animation-delay:330ms}
@keyframes hero-image-opening{from{opacity:.65;transform:scale(1.04)}to{opacity:1;transform:translate3d(0,var(--hero-depth,0px),0) scale(1)}}
@keyframes hero-copy-opening{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
.motion-image-frame{position:relative;overflow:hidden;isolation:isolate;aspect-ratio:var(--frame-ratio);border-radius:var(--frame-radius)}
.motion-image-frame>img{width:100%;height:100%;max-height:none;aspect-ratio:auto;margin:0;transform:translate3d(0,var(--image-depth,0px),0) scale(1);transition:transform 800ms var(--editorial-ease)}
.motion-enabled .motion-image-frame{clip-path:inset(0 0 0 0 round var(--frame-radius));opacity:1;transform:translateY(0);transition:clip-path 800ms var(--editorial-ease),opacity 700ms var(--editorial-ease),transform 800ms var(--editorial-ease);transition-delay:var(--motion-delay,0ms)}
.motion-enabled .motion-image-frame.motion-pending{clip-path:inset(5% 0 0 0 round var(--frame-radius));opacity:.65;transform:translateY(7px)}
.motion-enabled .motion-copy{opacity:1;transform:translateY(0);transition:opacity 650ms var(--editorial-ease),transform 700ms var(--editorial-ease);transition-delay:var(--motion-delay,120ms)}
.motion-enabled .motion-copy.motion-pending{opacity:.82;transform:translateY(7px)}
.timeline-layout aside>.motion-image-frame{margin-top:45px}
.journey-photo>.motion-image-frame{max-height:750px}
.motion-depth-frame>img{position:absolute;top:-12px;height:calc(100% + 24px);transition:none}
.motion-enabled .show-photo>.motion-image-frame.motion-pending{transform:translateY(7px) scale(1.01)}
.motion-enabled .show-gallery>.motion-image-frame.motion-pending{transform:translate(5px,5px)}
.motion-enabled .show-gallery>.motion-image-frame.motion-pending:last-child{transform:translate(-5px,5px)}
.project:first-child>.motion-image-frame{aspect-ratio:2.15}
.project>.motion-image-frame{aspect-ratio:1.6;border-radius:14px}
.social-feature>.motion-image-frame{aspect-ratio:1;border-radius:14px}
.show-photo>.motion-image-frame{aspect-ratio:2.3;border-radius:14px}
.show-gallery>.motion-image-frame{aspect-ratio:1.5;border-radius:14px}
.journey-photo>.motion-image-frame{aspect-ratio:2}
.timeline-layout aside>.motion-image-frame{aspect-ratio:1.2;border-radius:12px}
@media(hover:hover) and (pointer:fine){.motion-enabled .project:hover>.motion-image-frame>img{transform:scale(1.015)}}
.motion-enabled .timeline{position:relative;isolation:isolate}
.motion-enabled .timeline:before,.motion-enabled .timeline:after{content:'';position:absolute;left:18px;top:18px;bottom:calc(var(--last-stage-height,130px) - 18px);width:1px;pointer-events:none;z-index:-1}
.motion-enabled .timeline:before{background:#ffffff30}
.motion-enabled .timeline:after{background:#f93b0190;transform-origin:top;transform:scaleY(var(--timeline-progress,0));transition:transform 120ms linear}
.motion-enabled .timeline li:not(:last-child):before{display:none}
.motion-enabled .timeline li{opacity:.62;transform:translateY(5px);transition:opacity 700ms var(--editorial-ease),transform 700ms var(--editorial-ease)}
.motion-enabled .timeline li.stage-active{opacity:1;transform:translateY(0)}
.motion-enabled .timeline .stage-num{background:#0e1b2c;transition:border-color 700ms var(--editorial-ease)}
.motion-enabled .timeline .stage-active .stage-num{border-color:#f93b0170}
.motion-enabled .archive-body{overflow:hidden}
.motion-enabled .final .motion-copy{--motion-delay:0ms}
.motion-enabled .final h2.motion-copy{--motion-delay:90ms}
.motion-enabled .final .lead.motion-copy{--motion-delay:180ms}
.motion-enabled .final .button.motion-copy{--motion-delay:240ms}
@media(max-width:700px){
 .project:first-child>.motion-image-frame,.project>.motion-image-frame{aspect-ratio:1.5;border-radius:10px}
 .social-feature>.motion-image-frame{aspect-ratio:1.5}
 .journey-photo>.motion-image-frame{aspect-ratio:1.25}
 .show-photo>.motion-image-frame{aspect-ratio:1.3}
 .show-gallery>.motion-image-frame{aspect-ratio:1;border-radius:9px}
 .timeline-layout aside>.motion-image-frame{margin-top:28px}
 .motion-enabled .motion-image-frame.motion-pending,.motion-enabled .motion-copy.motion-pending{transform:translateY(4px)}
}
@media(prefers-reduced-motion:reduce){
 .motion-enabled .hero>img{position:static;height:100%;transform:none;animation:none}
 .motion-enabled .hero>.hero-video{top:0;height:100%;transform:none;animation:none}
 .motion-enabled .hero-content>.eyebrow,.motion-enabled .hero-content>h1,.motion-enabled .hero-bottom{animation:none}
 .motion-enabled .motion-image-frame,.motion-enabled .motion-image-frame.motion-pending,.motion-enabled .motion-copy,.motion-enabled .motion-copy.motion-pending,.motion-enabled .timeline li,.motion-enabled .timeline li.stage-active{opacity:1;transform:none;clip-path:none;transition:none}
 .motion-enabled .motion-image-frame>img{transform:none;transition:none}
 .motion-enabled .timeline:after{transform:scaleY(1);transition:none}
}

/* The whole diagram enters once; all fourteen markers have equal status. */
.commercial-stages{transition:opacity 800ms var(--editorial-ease),transform 800ms var(--editorial-ease)}
.commercial-entering .commercial-stages{opacity:.65;transform:translateY(8px)}
#projects>.section-heading{grid-template-columns:1fr}
#projects>.section-heading h2{max-width:1200px}
@media(prefers-reduced-motion:reduce){.commercial-stages{transition:none!important;transform:none!important;opacity:1!important}}