/* Normal document scrolling controls every frame. Sticky scenes never trap input. */
.philosophy.section{display:block;align-content:normal;height:auto;max-height:none;min-height:0;overflow:visible;padding:0;isolation:auto}
.philosophy-scene{position:relative;height:680px;min-height:540px;display:flex;align-items:center;justify-content:center;isolation:isolate;overflow:hidden;background:var(--paper)}
.philosophy-scene>.eyebrow{position:absolute;top:38px;left:4.5%;z-index:1;color:#fff;mix-blend-mode:difference}
.philosophy h2{transform:translateY(var(--quote-y,0px)) scale(var(--quote-scale,1));transform-origin:center;z-index:1}
.scene-footer{position:absolute;bottom:38px;left:4.5%;right:4.5%;display:flex;justify-content:space-between;gap:24px;font-size:13px;color:#fff;mix-blend-mode:difference}
.scene-footer a{border-bottom:1px solid #8c8c83;padding-bottom:4px}
.scene-progress{position:absolute;bottom:0;left:0;width:100%;height:2px;background:#93958d;transform:scaleX(var(--scene-progress,0));transform-origin:left}
.scroll-enabled .philosophy{height:230vh;height:230svh}
.scroll-enabled .philosophy-scene{position:sticky;top:96px;height:calc(100vh - 96px);height:calc(100svh - 96px);min-height:0}
.scroll-enabled .expertise{height:255vh;height:255svh;padding:0}
.scroll-enabled .expertise-scene{position:sticky;top:96px;height:calc(100vh - 96px);height:calc(100svh - 96px);padding:40px 4.5%;display:flex;flex-direction:column;justify-content:center}
.expertise .technical-lines{display:none}
.expertise .expertise-layout{gap:6%;align-items:center}
.expertise .expertise-note{position:relative;padding:0;gap:10px;min-width:0}
.expertise .expertise-note p{font-size:clamp(20px,2.4vw,32px);min-height:2.6em;margin:10px 0 0;max-width:380px}
.value-form{width:100%;height:clamp(160px,27vh,300px);height:clamp(160px,27svh,300px);display:block}
.expertise .cap{font-size:clamp(30px,3.6vw,55px);padding:10px 0}
.expertise .cap[aria-pressed=true]{padding-left:12px}
.expertise .section-heading{margin-bottom:30px}
.scroll-enabled #work .project-image img{transform:translateY(var(--image-shift,0px)) scale(1.09);transition:none}
.scroll-enabled #work .project-image:after{content:"";position:absolute;inset:0;pointer-events:none;background:#d9dad4;transform:scaleY(var(--image-cover,0));transform-origin:top}
.scroll-enabled #work .project-meta{transform:translateY(var(--meta-shift,0px))}
footer{position:relative}
.closing-echo{height:2px;background:#c5c2b8;width:100%;transform:scaleX(var(--closing-progress,1));transform-origin:left;margin-bottom:44px}
@media(max-width:700px){
 .scroll-enabled .philosophy{height:195vh;height:195svh}
 .scroll-enabled .philosophy-scene{top:78px;height:calc(100vh - 78px);height:calc(100svh - 78px)}
 .philosophy-scene>.eyebrow{left:20px;top:30px}
 .scene-footer{left:20px;right:20px;bottom:24px;font-size:12px;gap:15px}
 .scroll-enabled .expertise{height:240vh;height:240svh}
 .scroll-enabled .expertise-scene{top:78px;height:calc(100vh - 78px);height:calc(100svh - 78px);padding:25px 20px}
 .expertise .expertise-layout{grid-template-columns:1fr;gap:18px}
 .expertise #capabilities{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}
 .expertise .cap{font-size:27px;padding:9px 0;gap:12px}
 .expertise .cap[aria-pressed=true]{padding-left:6px}
 .expertise .section-heading{margin-bottom:20px}
 .expertise .expertise-note{gap:5px;min-height:0}
 .expertise .expertise-note p{font-size:22px;min-height:2.5em;margin:0;max-width:100%}
 .value-form{height:clamp(130px,23vh,210px);height:clamp(130px,23svh,210px)}
 .expertise-note>.eyebrow{font-size:10px}
}
@media(max-height:660px){
 .scroll-enabled .expertise{height:auto;padding:55px 4.5%}
 .scroll-enabled .expertise-scene{position:relative;top:auto;height:auto;padding:0}
}
@media(prefers-reduced-motion:reduce){
 .scroll-enabled .philosophy,.scroll-enabled .expertise{height:auto}
 .scroll-enabled .philosophy-scene,.scroll-enabled .expertise-scene{position:relative;top:auto;height:auto;min-height:540px}
 .scroll-enabled .expertise-scene{padding:65px 4.5%}
 .philosophy h2{transform:none}
 .scene-progress{display:none}
 .scroll-enabled #work .project-image img{transform:none}
 .scroll-enabled #work .project-image:after{display:none}
 .scroll-enabled #work .project-meta{transform:none}
}

/* A fixed drawing frame keeps the same space registered through all five stages. */
.scroll-enabled .expertise{height:auto;padding:0}
.scroll-enabled .expertise-scene{position:relative;top:auto;height:auto;min-height:0;padding:80px 4.5%;display:block}
.expertise .section-heading{margin:0 0 36px}
.expertise .expertise-layout{grid-template-columns:1.05fr 1fr;gap:7%;align-items:center;transform:translateY(var(--assembly-y,0px));opacity:var(--assembly-opacity,1)}
.expertise .cap{font-size:clamp(30px,3.4vw,48px);line-height:1.1;padding:11px 0}
.expertise .cap span{width:24px;flex-shrink:0}
.expertise .expertise-note{display:grid;grid-template-rows:20px 3.6em clamp(180px,28vh,300px) 18px;grid-template-rows:20px 3.6em clamp(180px,28svh,300px) 18px;gap:16px;font-size:clamp(22px,2.2vw,30px);min-height:0;align-content:center}
.expertise .expertise-note p{font-size:inherit;line-height:1.2;margin:0;min-height:0;max-width:420px}
.expertise .value-form{width:100%;height:100%;min-height:0}
.expertise .expertise-note>.eyebrow{font-size:12px;line-height:18px}
.beyond-link{display:flex;align-items:center;justify-content:space-between;width:max-content;gap:42px;border-bottom:1px solid #a6a69d;padding:8px 0;font-size:14px;margin-top:28px;opacity:var(--assembly-opacity,1)}
.expertise:not(.expertise-is-pinned) .beyond-link{display:none}
.beyond-handover{position:relative;display:grid;place-items:center;min-height:520px;margin-top:75px;isolation:isolate;overflow:hidden}
.beyond-handover h2{position:relative;z-index:1;font-size:clamp(38px,5.5vw,80px);line-height:1.08;letter-spacing:-.055em;font-weight:400;margin:0;padding:30px 0;text-align:center;text-wrap:balance;background:#e9e8e3}
.continuity-field{position:absolute;inset:0;width:100%;height:100%;z-index:-1;overflow:hidden}
.continuity-trace,.continuity-thread{fill:none;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}
.continuity-trace{stroke:#c4c7bf;stroke-width:1}
.continuity-thread{stroke:#50594f;stroke-width:1.5;stroke-dasharray:1;stroke-dashoffset:var(--thread-remainder,0)}
.plane-one{transform:translate(calc(var(--plane-travel,65px) * -.5),calc(var(--plane-travel,65px) * -.3))}
.plane-two{transform:translate(var(--plane-travel,65px),calc(var(--plane-travel,65px) * .4))}
.plane-three{transform:translate(calc(var(--plane-travel,65px) * -.8),calc(var(--plane-travel,65px) * .2))}
.scroll-enabled .expertise.expertise-is-pinned{height:300vh;height:300svh}
.scroll-enabled .expertise-is-pinned .expertise-scene{position:sticky;top:96px;height:calc(100vh - 96px);height:calc(100svh - 96px);padding:90px 4.5% 65px;display:flex;flex-direction:column;justify-content:center}
.expertise-is-pinned .section-heading{position:absolute;top:32px;left:4.5%;right:4.5%;margin:0}
.expertise-is-pinned .expertise-layout{width:100%}
.expertise-is-pinned .beyond-link{position:absolute;left:4.5%;bottom:22px;margin:0}
.expertise-is-pinned .beyond-handover{position:absolute;inset:80px 0 0;min-height:0;margin:0;padding:0 4.5%;opacity:var(--beyond-opacity,0);transform:translateY(var(--beyond-y,30px));visibility:hidden;pointer-events:none}
.expertise-is-pinned.has-beyond .beyond-handover{visibility:visible;pointer-events:auto}
@media(max-width:700px){
 .scroll-enabled .expertise-scene{padding:55px 20px}
 .expertise .expertise-layout{grid-template-columns:1fr;gap:22px}
 .expertise .expertise-note{grid-template-rows:18px 2.4em clamp(145px,23vh,210px) 18px;grid-template-rows:18px 2.4em clamp(145px,23svh,210px) 18px;gap:12px;font-size:22px}
 .expertise .cap{font-size:27px;line-height:1.15;padding:10px 0}
 .expertise .cap span{width:18px}
 .expertise .expertise-note p{max-width:none}
 .beyond-handover{min-height:440px;margin:45px -20px 0;padding:0 20px}
 .beyond-handover h2{font-size:clamp(38px,10.5vw,58px);max-width:420px;padding:25px 0}
 .continuity-field{width:100%;left:0}
 .scroll-enabled .expertise.expertise-is-pinned{height:650vh;height:650svh}
 .scroll-enabled .expertise-is-pinned .expertise-scene{top:78px;height:calc(100vh - 78px);height:calc(100svh - 78px);padding:86px 20px 65px}
 .expertise-is-pinned .section-heading{top:25px;left:20px;right:20px}
 .expertise-is-pinned .beyond-link{left:20px;bottom:23px}
 .expertise-is-pinned .beyond-handover{inset:75px 0 0;padding:0 20px;margin:0}
}
@media(prefers-reduced-motion:reduce){
 .expertise .expertise-layout,.beyond-handover{transform:none!important;opacity:1!important}
 .continuity-thread{stroke-dashoffset:0}
 .continuity-plane{transform:none}
}

/* The Continuum: three gestures resolve into the supplied SANAN artwork. */
.studio.section{padding:0;overflow:visible;position:relative;background:var(--paper)}
.continuum-scene{position:relative;padding:65px 4.5% 40px;isolation:isolate}
.continuum-scene>.eyebrow{position:relative;z-index:2}
.studio .continuum-heading{font-size:clamp(40px,5.2vw,76px);line-height:1.03;letter-spacing:-.055em;margin:50px 0 0;position:relative;z-index:2;font-weight:400}
.continuum-you{display:block}
.convergence-art{position:relative;height:260px;pointer-events:none}
.convergence-canvas{display:none;width:100%;height:100%}
.convergence-logo{position:absolute;width:min(76%,620px);aspect-ratio:820/320;left:50%;top:50%;transform:translate(-50%,-50%)}
.convergence-logo img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.convergence-symbol{clip-path:inset(0 0 55% 0);opacity:var(--symbol-opacity,1)}
.convergence-wordmark{clip-path:inset(50% 0 0 0);opacity:var(--wordmark-opacity,1);transform:translateY(var(--wordmark-rise,0px))}
.convergence-perspectives{display:flex;justify-content:space-between;gap:20px;max-width:620px;margin:20px auto 0;font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:#60645f}
.studio .practice-summary{padding:65px 4.5% 120px;margin:0;border-top:1px solid var(--line)}
.continuum-active .continuum-track{height:230vh;height:230svh}
.continuum-active .continuum-scene{position:sticky;top:96px;height:calc(100vh - 96px);height:calc(100svh - 96px);padding:36px 4.5%;overflow:hidden}
.continuum-active .continuum-heading{position:static;margin:0}
.continuum-active .continuum-intro{position:absolute;top:90px;left:4.5%;right:4.5%;opacity:var(--perspective-opacity,1)}
.continuum-active .continuum-you{position:absolute;left:50%;top:60%;transform:translate(-50%,-50%) scale(var(--you-scale,1));font-size:clamp(60px,8vw,112px);white-space:nowrap;text-align:center;letter-spacing:-.065em;font-weight:400;line-height:1;opacity:var(--you-opacity,1)}
.continuum-active .convergence-art{position:absolute;inset:0;height:100%;z-index:-1}
.continuum-active .convergence-canvas{display:block}
.continuum-active .convergence-logo{top:60%}
.continuum-active .convergence-perspectives{position:absolute;bottom:45px;left:12%;right:12%;max-width:none;margin:0;opacity:var(--perspective-opacity,1)}
.convergence-progress{display:none}
.continuum-active .convergence-progress{display:block;position:absolute;bottom:0;left:0;right:0;height:1px;background:#666d65;transform:scaleX(var(--convergence,0));transform-origin:left}
@media(max-width:700px){
 .continuum-scene{padding:45px 20px 30px}
 .studio .continuum-heading{font-size:clamp(36px,9.6vw,54px);margin-top:40px}
 .convergence-art{height:190px}
 .convergence-perspectives{gap:12px;font-size:12px;letter-spacing:.08em}
 .studio .practice-summary{padding:45px 20px 70px}
 .continuum-active .continuum-track{height:210vh;height:210svh}
 .continuum-active .continuum-scene{top:78px;height:calc(100vh - 78px);height:calc(100svh - 78px);padding:30px 20px}
 .continuum-active .continuum-intro{top:98px;left:20px;right:20px}
 .continuum-active .convergence-perspectives{left:20px;right:20px;bottom:36px}
}

@media(max-width:700px){
 .expertise #capabilities .cap:last-child{grid-column:1 / -1}
 .continuum-active .continuum-you{font-size:clamp(58px,16vw,76px);line-height:.98;white-space:normal}
 .continuum-active .continuum-you span{display:block}
}

/* Mobile browser chrome changes the available height while scrolling. Keep both
   stories pinned, and make their compositions fit a short visible viewport. */
@media(max-width:700px) and (max-height:760px){
 .scroll-enabled .expertise-is-pinned .expertise-scene{padding:58px 20px 42px}
 .expertise-is-pinned .section-heading{top:16px}
 .expertise-is-pinned .expertise-layout{gap:12px}
 .expertise-is-pinned .cap{font-size:clamp(21px,5.5vw,25px);padding:6px 0}
 .expertise-is-pinned .expertise-note{grid-template-rows:16px 2.2em minmax(112px,18vh) 16px;grid-template-rows:16px 2.2em minmax(112px,18svh) 16px;gap:7px;font-size:20px}
 .expertise-is-pinned .expertise-note>.eyebrow{font-size:10px}
 .expertise-is-pinned .beyond-link{bottom:9px}
 .continuum-active .continuum-intro{top:65px}
 .continuum-active .convergence-perspectives{bottom:20px}
}
