/* immersive.css */
/* The original cinematic palette and large-scale spatial composition, across retained routes. */
:root{--paper:#0a0e0f;--ink:#f2efe8;--surface:#14221c;--surface-raised:#20342a;--muted:#c0cac2;--copper:#f1b44c;--copper-light:#f4cb87;--rule:#34483e;--school-source-background:#0a0e0f}
body{background:#0a0e0f}.site-header{position:relative;z-index:40;background:transparent!important;border-color:#dae5d522!important}.landing-page .site-header{color:#f2efe8}.landing-page .site-header::before{background:transparent!important}.landing-page .site-header .brand-lettering{filter:none}.button{background:var(--copper);color:#141a16;border-radius:3px}.site-footer{background:#101c16!important}.detail-dialog,.enquiry-dialog{background:#14221c}.work-symbol{width:100%;height:100%;display:block}.immersive-classification{font-size:12px;letter-spacing:.035em;text-transform:uppercase;color:#c0ccc3}
.connected-world{height:360svh;position:relative;background:#0a0e0f}.connected-stage{position:fixed;inset:0;z-index:20;overflow:hidden;background:radial-gradient(ellipse at 65% 64%,#203c2d99,transparent 72%),#0a0e0f;color:#f2efe8}.connected-stage[hidden]{display:none}.camera-field{position:absolute;inset:0;z-index:1}.camera-field canvas{display:block;width:100%;height:100%}.connected-grain{position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(ellipse 53% 43% at 50% 43%,#07100bab,transparent 95%);opacity:var(--intro-copy,1)}
.connected-copy{position:absolute;z-index:5;top:23svh;left:10%;right:10%;text-align:center;opacity:var(--intro-copy,1);will-change:opacity}.connected-copy h1{font-size:clamp(68px,7.5vw,136px);line-height:.98;letter-spacing:-.05em;font-weight:520;max-width:1200px;margin:0 auto;text-wrap:balance;text-shadow:0 3px 40px #041008}.connected-copy h1 span{display:block}.connected-copy>p{font-size:clamp(17px,1.3vw,22px);line-height:1.55;max-width:665px;margin:29px auto 0;color:#d4dfd6;text-wrap:pretty}.connected-actions{display:flex;justify-content:center;gap:28px;align-items:center;margin-top:28px}.connected-actions .text-link{font-size:15px;color:#f2efe8}.connected-actions .button{font-size:15px;min-height:46px;padding:12px 20px}
.connected-purpose{position:absolute;z-index:5;left:8%;right:8%;top:16svh;text-align:center;opacity:var(--intro-purpose,0);pointer-events:none}.connected-purpose h2{font-size:clamp(54px,6.7vw,110px);line-height:1;letter-spacing:-.045em;max-width:1000px;margin:auto;text-shadow:0 3px 40px #041008}.connected-purpose p{font-size:19px;color:#d4dfd6;max-width:640px;margin:24px auto}.connected-selected{position:absolute;z-index:5;left:var(--pad);top:11svh;font-size:15px;letter-spacing:.01em;opacity:var(--intro-source,0);color:#f5f1e6;text-shadow:0 2px 15px #000}.connected-selected span{display:block;font-size:12px;letter-spacing:.05em;margin-bottom:10px;color:#d4dfd6;text-transform:uppercase}
.connected-bottom{position:absolute;z-index:6;left:var(--pad);right:var(--pad);bottom:28px;display:flex;justify-content:space-between;align-items:end;gap:24px;opacity:var(--intro-copy,1)}.connected-scope{display:flex;gap:24px;color:#c4d0c7;font-size:13px}.connected-scroll{font-size:13px;color:#f0d7a6;max-width:220px;text-align:right}.connected-evidence{position:absolute;left:var(--pad);bottom:10px;z-index:7;font-size:12px;color:#bdc9c0;letter-spacing:.04em;opacity:.8}
.connected-fallback{position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,1fr);align-content:center;gap:28px;transform:rotate(-7deg) scale(1.1);opacity:.35}.connected-fallback img{width:100%;aspect-ratio:16/9;object-fit:cover;border:1px solid #acbcab44}.connected-stage[data-ready=true] .connected-fallback{display:none}.connected-stage[data-unavailable=true] .connected-copy{opacity:1}.connected-stage[data-unavailable=true] .connected-purpose,.connected-stage[data-unavailable=true] .connected-selected{opacity:0}
#school-stage .story-shade{background:linear-gradient(180deg,#08100cc9 0,transparent 57%,#08100c86)!important}#school-stage[data-phase=reality] .story-shade,#school-stage[data-phase=observe] .story-shade{background:linear-gradient(270deg,#07100ad9 0,#07100a73 30%,transparent 67%)!important}
#school-stage .story-copy{top:13svh;width:min(660px,42vw);max-width:none}#school-stage .story-copy h2{font-size:clamp(44px,5.1vw,84px);line-height:1.01;letter-spacing:-.04em}#school-stage .story-copy p{font-size:18px;max-width:400px;color:#e0e6dc}#school-stage:is([data-phase=reality],[data-phase=observe]) .story-copy{left:auto;right:var(--pad);width:43vw}#school-stage .hero-copy{top:13svh!important;left:auto!important;right:var(--pad)!important;width:43vw!important;max-width:none!important}#school-stage .hero-copy p{max-width:450px!important;font-size:18px!important}#school-stage .hero-copy h2{font-size:clamp(49px,5.4vw,92px)}.school-chapter-label{display:block;color:#f3c579;font-size:12px;letter-spacing:.09em;margin-bottom:24px;text-transform:uppercase}
.living-world{position:relative;height:440svh;background:radial-gradient(ellipse at 65% 46%,#284b343d,transparent 64%),#0a0e0f}.living-stage{position:sticky;top:0;height:100svh;min-height:700px;isolation:isolate;overflow:hidden}.retained-world{position:absolute;left:15%;right:-6%;top:4%;height:87%;z-index:1}.retained-world canvas{width:100%;height:100%;display:block}.living-copy{position:absolute;z-index:4;left:var(--pad);top:12svh;max-width:560px;width:38%}.living-copy .eyebrow{color:#a7c5b5;text-transform:uppercase;letter-spacing:.1em;font-size:12px;margin-bottom:24px}.living-copy h2{font-size:clamp(43px,4.8vw,80px);letter-spacing:-.04em;line-height:1.035;margin:0}.living-copy>p{font-size:18px;color:#cbd6cd;margin-top:23px;max-width:360px}.living-symbols{position:absolute;z-index:4;left:var(--pad);bottom:128px;width:140px;height:140px;color:#8fb9a8}.living-symbols>div{position:absolute;inset:0;opacity:0;transform:translateY(14px);transition:opacity .25s,transform .4s}.living-symbols>div.is-current{opacity:1;transform:none}.living-stage[data-layer=authority] .living-symbols{color:#f1b44c}.living-caption{position:absolute;right:var(--pad);bottom:132px;z-index:5;max-width:230px;text-align:right;color:#99b8a7;font-size:12px}.living-steps{position:absolute;z-index:5;left:var(--pad);right:var(--pad);bottom:38px;display:flex;gap:0;border-top:1px solid #8fb9a838}.living-steps button{flex:1;background:transparent;border:none;border-top:2px solid transparent;color:#9eb3a6;min-height:58px;display:flex;gap:12px;align-items:center;font-size:15px;justify-content:center}.living-steps button b{font-size:12px;font-weight:400;color:#7c9485}.living-steps button[aria-pressed=true]{color:#f2efe8;border-color:#f1b44c}.living-steps button:hover{background:#b2bda80c}.living-stage[data-unavailable=true] .living-copy{width:70%;max-width:800px}
/* Restore the scale of the original cinematic sections without placing a card over every scene. */
.purpose{background:#14281d;padding-block:110px}.purpose h2{font-size:clamp(50px,5.5vw,92px);line-height:1.04}.community-copy h2,.places-heading h2{font-size:clamp(52px,5.6vw,94px);letter-spacing:-.04em}.community-chapter .community-shade{background:linear-gradient(90deg,#0a160ded,transparent 77%)!important}.place-copy h3{font-size:clamp(44px,5vw,76px)}.platform-copy h2{font-size:clamp(46px,4.5vw,76px)}.founders-intro h2,.landing-additions-heading h2{font-size:clamp(45px,4.8vw,78px)}.build-chapter h2{font-size:clamp(55px,6.2vw,108px)}.capability-links>a{position:relative;padding-top:38px}.capability-links .restored-symbol{display:block;width:100px;height:100px;color:#8fb9a8;margin-bottom:25px}.capability-links h3{font-size:28px}.mechanism-explanation h2,.addition-section h2{font-size:clamp(34px,3.6vw,58px)}
@media(max-width:1100px){.connected-copy{left:6%;right:6%}.connected-copy h1{font-size:9vw}.living-copy{width:42%}.living-copy h2{font-size:48px}.retained-world{left:14%;right:-16%}.living-symbols{width:100px;height:100px}.connected-scope{gap:16px;font-size:12px}}
@media(max-width:760px){
 .connected-world{height:280svh}.connected-copy{top:24svh;left:22px;right:22px}.connected-copy h1{font-size:clamp(46px,11.6vw,80px);line-height:1.02;letter-spacing:-.045em}.connected-copy>p{font-size:16px;line-height:1.5;max-width:400px;margin-top:22px}.connected-actions{gap:22px;margin-top:25px}.connected-actions .button{font-size:14px;padding:12px 15px}.connected-actions .text-link{font-size:14px}.connected-purpose{left:22px;right:22px;top:15svh}.connected-purpose h2{font-size:48px;line-height:1.05}.connected-purpose p{font-size:16px}.connected-bottom{bottom:36px;gap:14px}.connected-scope{flex-wrap:wrap;gap:5px 14px;max-width:180px;font-size:12px}.connected-scroll{font-size:12px;max-width:105px}.connected-evidence{bottom:12px;font-size:12px}.connected-fallback{grid-template-columns:1fr 1fr;gap:80px 60px;transform:rotate(-7deg) scale(1.5)}
 #school-stage .story-copy,#school-stage:is([data-phase=reality],[data-phase=observe]) .story-copy,#school-stage .hero-copy{top:55px!important;left:22px!important;right:22px!important;width:auto!important;max-width:580px!important}#school-stage .story-copy h2,#school-stage .hero-copy h2{font-size:clamp(34px,9vw,52px);line-height:1.05;max-width:480px}#school-stage .story-copy p,#school-stage .hero-copy p{font-size:15px!important;max-width:350px!important}.school-chapter-label{margin-bottom:16px;font-size:12px}#school-stage .story-shade,#school-stage:is([data-phase=reality],[data-phase=observe]) .story-shade{background:linear-gradient(180deg,#07100bea 0,#07100b80 27%,transparent 62%)!important}.story-stage{min-height:600px}
 .living-world{height:490svh}.living-stage{min-height:760px;height:100svh}.living-copy{top:46px;left:22px;right:22px;width:auto;max-width:540px}.living-copy .eyebrow{font-size:12px;margin-bottom:16px}.living-copy h2{font-size:clamp(35px,8.5vw,50px);max-width:490px}.living-copy>p{font-size:15px;max-width:360px;margin-top:18px}.retained-world{left:0;right:0;top:29%;height:58%}.living-symbols{display:none}.living-caption{left:22px;right:22px;bottom:128px;max-width:none;text-align:left;font-size:12px}.living-steps{left:22px;right:22px;bottom:27px;flex-wrap:wrap}.living-steps button{min-height:44px;font-size:12px;gap:5px;flex:1 0 30%}.living-steps button b{font-size:12px}.living-steps button:nth-child(n+4){flex-basis:40%}.living-stage[data-unavailable=true] .living-copy{width:auto}
 .purpose{padding-block:70px}.purpose h2{font-size:45px}.community-copy h2,.places-heading h2{font-size:46px}.place-copy h3{font-size:40px}.platform-copy h2{font-size:41px}.founders-intro h2,.landing-additions-heading h2{font-size:42px}.build-chapter h2{font-size:53px}.capability-links .restored-symbol{width:75px;height:75px}.capability-links h3{font-size:24px}.mechanism-explanation h2,.addition-section h2{font-size:34px}
}
@media(max-height:700px) and (min-width:761px){.connected-copy{top:17svh}.connected-copy h1{font-size:clamp(62px,6.5vw,95px)}.connected-copy>p{font-size:16px;max-width:640px;margin-top:18px}.connected-actions{margin-top:18px}.living-copy{top:55px}.living-copy h2{font-size:49px}.living-symbols{width:90px;height:90px;bottom:110px}}
.immersive-reduced .connected-world{height:100svh;min-height:730px}.immersive-reduced .connected-stage{position:absolute;inset:0}.immersive-reduced .living-world{height:auto}.immersive-reduced .living-stage{position:relative}.immersive-reduced .living-symbols>div{transition:none}.immersive-reduced .connected-scroll{display:none}
@media(prefers-reduced-motion:reduce){.connected-world{height:100svh;min-height:730px}.connected-stage{position:absolute}.living-world{height:auto}.living-stage{position:relative}.living-symbols>div{transition:none}.connected-scroll{display:none}}

.connected-stage::before{content:"";position:absolute;z-index:3;inset:0 0 auto;height:15svh;background:linear-gradient(#09110df5,transparent);pointer-events:none;opacity:var(--intro-copy,1)}
.connected-stakes{position:absolute;right:var(--pad);top:13svh;width:43vw;z-index:8;opacity:var(--intro-stakes,0);pointer-events:none;color:#f2efe8;text-shadow:0 2px 24px #0008}.connected-stakes h2{font-size:clamp(49px,5.4vw,92px);line-height:1.01;letter-spacing:-.04em;font-weight:500}.connected-stakes p{font-size:18px;line-height:1.5;max-width:450px;margin-top:24px;color:#e0e6dc}
.connected-world:has([data-unavailable=true]){height:100svh;min-height:730px}.connected-stage[data-unavailable=true]{position:absolute}.connected-stage[data-unavailable=true] .connected-stakes{display:none}
@media(max-width:760px){.connected-stakes{top:55px;left:22px;right:22px;width:auto}.connected-stakes h2{font-size:clamp(34px,9vw,52px);line-height:1.05;max-width:480px}.connected-stakes p{font-size:15px;max-width:350px;margin-top:16px}}

/* The workflow illustration is light even inside the cinematic theme. */
.workflow-illustration .workflow-input{color:#20342a;}

@media(max-height:600px) and (min-width:650px){
 .living-stage{min-height:0;height:100svh}.living-copy{left:28px;top:25px;width:39%}.living-copy .eyebrow{font-size:12px;margin-bottom:12px}.living-copy h2{font-size:32px;line-height:1.06}.living-copy>p{font-size:13px;margin-top:14px}.retained-world{left:32%;right:0;top:0;height:82%}.living-symbols{display:none}.living-caption{bottom:66px;right:28px;font-size:12px}.living-steps{bottom:10px;left:28px;right:28px}.living-steps button{min-height:38px;font-size:12px}
}

/* Without a script the landing's opening is read top to bottom, not watched. The hero was a layer fixed over the whole
   page (a reader without a script met its first screen at every scroll position, and what the skip link jumped to lay
   under it), and the school story a frame held over a track 3.6 screens long, its later chapters never shown. Here the
   hero's words stand in flow, its second beat included, and the story's five chapters are read in order beside its
   source frame; the films, the scene's annotations and every control that needs a script are left out (LM5). The
   selectors outrank the scripted layout's own (hero-loop.css, hero-framing.css, school-refinement.css), so these win. */
@media (scripting: none) {
 html body .connected-world{height:auto;min-height:0}
 html body #connected-stage{position:relative;inset:auto;height:auto;min-height:100svh;overflow:visible;padding:23svh var(--pad) 48px;display:flex;flex-direction:column}
 html body #connected-stage :is(.connected-copy,.connected-purpose,.connected-bottom){position:relative;inset:auto;opacity:1}
 html body #connected-stage .connected-purpose{margin-top:18svh;pointer-events:auto}
 html body #connected-stage .connected-bottom{margin-top:auto;padding-top:12svh}
 html body #connected-stage :is(.camera-field,.connected-fallback,.connected-grain,.connected-stakes,.connected-selected,.connected-motion){display:none}
 html body #school-story.story-scroll{height:auto;min-height:0}
 html body #school-stage.story-stage{position:relative;top:auto;height:auto;min-height:100svh;padding:18svh 0 12svh}
 html body #school-stage.story-stage .scene-visual{height:100%}
 /* The scripted story places its copy with !important rules and hides a chapter with the site's [hidden]{display:none
    !important}; the static story answers in kind, from a selector more specific than either. Its column stands on the
    left in either direction, over the shade, as the scripted story's does. */
 html body #school-stage.story-stage .story-copy,html body #school-stage.story-stage .story-copy[hidden]{display:block!important;position:relative!important;inset:auto!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;width:36%!important;max-width:560px!important;margin:0 auto 9svh var(--pad)!important;opacity:1!important;transform:none!important}
 html body #school-stage.story-stage :is(.story-copy button,.story-footer,.agent-constellation,.school-evidence-preview){display:none!important}
 /* The source frame keeps its class, as every surface does: a script fades the bar in as the story settles. */
 html body #school-stage.story-stage .school-shot-heading{opacity:1}
 /* The shade is drawn solid to just past the column's edge, so the copy stands on the page's ground in either
    direction: set to the right (Arabic), it ran past the shade's solid band, which ends at 34 %, onto the lit
    forecourt. */
 @media (min-width:1101px){
  html body #school-stage.story-stage .story-shade{background:linear-gradient(90deg,#071018 0,#071018 calc(var(--pad) + min(36%,560px) + 32px),transparent calc(var(--pad) + min(36%,560px) + 128px))!important}
 }
 /* A phone or a tablet reads the frame first and the chapters under it, on the page's ground rather than over the
    picture: at a tablet's width the shade's band left the column less than a third of the screen. */
 @media (max-width:1100px){
  html body #school-stage.story-stage{padding:0 0 6svh}
  html body #school-stage.story-stage .scene-visual{position:relative;inset:auto;height:56svh;margin-bottom:12px}
  html body #school-stage.story-stage .story-shade{display:none}
  html body #school-stage.story-stage .school-shot-heading{display:flex;flex-wrap:wrap;gap:6px 14px;position:relative;inset:auto;margin:0 var(--pad) 6svh;font:450 12px/1.3 var(--sans);letter-spacing:.035em;color:#fff}
  html body #school-stage.story-stage .story-copy,html body #school-stage.story-stage .story-copy[hidden]{width:auto!important;max-width:none!important;margin:0 var(--pad) 6svh!important}
 }
}
/* motion-refinement.css */
/* Motion compositions share the retained type scale; colours are owned by main-identity.css. */
.connected-grain{backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);mask-image:radial-gradient(ellipse 47% 44% at 50% 44%,#000 37%,transparent 95%);-webkit-mask-image:radial-gradient(ellipse 47% 44% at 50% 44%,#000 37%,transparent 95%)}
/* The converging school view crosses the support line; the reading shade follows copy opacity. */
.connected-stage .connected-purpose p{position:relative;isolation:isolate;color:var(--ink)}
.connected-purpose p::before{content:"";position:absolute;inset:-10px -16px;z-index:-1;background:var(--main-charcoal);opacity:.92;filter:blur(14px);pointer-events:none}
.connected-copy h1{font-weight:550}.connected-evidence{font-size:12px}.connected-scope{font-size:13px}
.motion-chapter{position:relative;display:block;overflow:hidden;padding:110px var(--pad) 60px;isolation:isolate}
.motion-heading{display:grid;grid-template-columns:1.25fr .65fr;align-items:end;gap:7vw;position:relative;z-index:2}
.motion-heading h2{font-size:clamp(48px,5.4vw,90px);line-height:1.02;max-width:980px;letter-spacing:-.045em}.motion-heading>p{font-size:18px;line-height:1.6;max-width:380px;color:var(--muted)}
.motion-composition{display:grid;grid-template-columns:1.55fr .7fr;gap:5vw;align-items:center;margin-top:35px;min-height:520px}

.chapter-work{position:relative;z-index:2}.chapter-work h3{font-size:clamp(30px,2.8vw,45px);line-height:1.08;max-width:470px}.chapter-work>p{font-size:17px;line-height:1.55;margin-top:20px;max-width:380px;color:var(--muted)}.chapter-work>.text-link{display:inline-block;margin-top:28px}
.chapter-steps{display:flex;flex-wrap:wrap;gap:10px 24px;margin-top:40px;border-top:1px solid var(--rule);padding-top:16px}.chapter-steps button{font-size:14px;padding:10px 0;border-bottom:2px solid transparent;color:var(--muted);text-align:left}.chapter-steps button[aria-pressed=true]{border-color:var(--copper);color:var(--ink)}
.chapter-control{display:flex;gap:20px;justify-content:space-between;align-items:center;border-top:1px solid var(--rule);padding-top:18px;color:var(--muted)}.chapter-control small{font-size:12px}.chapter-control button{font-size:13px;padding:7px 0;border-bottom:1px solid currentColor}.motion-tail-link{display:inline-block;margin-top:30px}
.engineering-footnote p{font-size:14px;max-width:700px;color:var(--muted)}.engineering-footnote a{font-size:14px;white-space:nowrap}
.evidence-stage{max-width:1300px;margin:30px auto 0;position:relative;display:grid;grid-template-columns:1.15fr .75fr;align-items:center;gap:4vw}.evidence-context{display:flex;justify-content:space-between;gap:5vw;padding-top:30px;align-items:center}.evidence-context p{font-size:14px;max-width:740px;color:var(--muted)}.evidence-context button{white-space:nowrap}
@media(max-width:900px){.motion-chapter{padding-top:75px}.motion-heading{grid-template-columns:1fr;gap:25px}.motion-heading h2{font-size:clamp(43px,7vw,68px)}.motion-heading>p{max-width:580px}.motion-composition{grid-template-columns:1.3fr 1fr;gap:24px}.chapter-work h3{font-size:34px}.evidence-context{align-items:start;flex-direction:column;gap:20px}}
@media(max-width:650px){.connected-grain{mask-image:radial-gradient(ellipse 71% 44% at 50% 43%,#000 42%,transparent 94%);-webkit-mask-image:radial-gradient(ellipse 71% 44% at 50% 43%,#000 42%,transparent 94%)}.motion-chapter{padding:65px 22px 38px}.motion-heading h2{font-size:44px}.motion-heading>p{font-size:16px;line-height:1.55}.motion-composition,.evidence-stage{display:flex;flex-direction:column;gap:6px;margin-top:15px;min-height:0}.chapter-work{order:1;width:100%;padding:14px 0 25px;border:0}.chapter-work h3{font-size:32px;max-width:450px}.chapter-work>p{font-size:16px;margin-top:14px}.chapter-work>.text-link{margin-top:18px}.chapter-steps{display:flex;flex-direction:row;margin:25px 0 0;gap:18px;padding-top:12px;border-top:1px solid var(--rule);flex-wrap:wrap}.chapter-steps button{font-size:14px;padding:8px 0}.chapter-control{gap:15px;align-items:start}.chapter-control small{font-size:12px;max-width:170px;line-height:1.5}.chapter-control button{font-size:12px;white-space:nowrap}.evidence-context p{font-size:13px}.engineering-footnote p{font-size:13px}.motion-tail-link{font-size:14px}.connected-evidence{font-size:12px}}


.connected-motion{font:400 12px/1.4 var(--sans);color:inherit;border-bottom:1px solid currentColor;padding:8px 0;align-self:end}.immersive-reduced .connected-motion{display:none}.sector-entry [data-icon] svg{width:90px;height:90px;margin-bottom:25px}.sector-entry [data-icon]{display:block}.sector-entry:hover [data-icon] svg{transform:translateY(-5px);transition:transform .4s ease}.sector-entry [data-icon] svg{transition:transform .4s ease}
@media(prefers-reduced-motion:reduce){.connected-motion{display:none}.sector-entry [data-icon] svg{transform:none!important;transition:none!important}}

.platform-flow{display:contents}
@media(max-width:760px){.platform-flow{position:absolute;z-index:3;inset:auto 22px 28px;display:flex;flex-direction:column;gap:16px}.platform-flow .platform-layers,.platform-flow .platform-detail{position:relative;inset:auto;width:100%;margin:0}.platform-flow .platform-detail{padding-right:45px}.platform-flow .platform-detail .icon-button{right:0;top:0}}

@media(min-width:761px) and (max-height:540px){
 .connected-copy{top:104px;left:8%;right:8%}
 .connected-copy h1{font-size:clamp(34px,11svh,54px);line-height:1}
 .connected-copy>p{font-size:15px;line-height:1.4;max-width:670px;margin:16px auto 0}
 .connected-actions{margin-top:16px}.connected-actions .button{min-height:40px;padding:9px 16px;font-size:14px}
 .connected-bottom{bottom:34px}.connected-scope{font-size:12px}.connected-motion{font-size:12px;padding:6px 0}
}
/* The model-room stage (LM1): a pinned track whose sticky frame holds the lamp-lit model behind the copy.
   The track's height is the scroll the reader spends; overflow is clipped, not hidden, because a hidden
   overflow is a scroll container and a sticky frame inside one never sticks. */
.model-stage-section{position:relative;padding:0;overflow:clip}
.stage-track{position:relative;height:300svh}
.stage-sticky{position:sticky;top:0;height:100svh;min-height:560px;overflow:hidden;isolation:isolate;background:#1d1c1a}
.stage-canvas{position:absolute;inset:0}
.stage-canvas canvas{display:block;width:100%;height:100%}
.stage-canvas img{display:block;width:100%;height:100%;object-fit:cover;object-position:70% 50%}
:root[dir="rtl"] .stage-canvas img{object-position:30% 50%}
.stage-copy{position:absolute;z-index:2;inset-inline-start:var(--pad);bottom:clamp(28px,7svh,72px);width:min(420px,31vw);color:var(--ink);--muted:#c9ced3}
/* The copy sits over a lamp-lit table, not over the page's flat ground: the muted grey is a step lighter here so
   body text keeps 4.5:1 against the brightest table the authored cameras put behind it (measured, LM1). */
.stage-copy .motion-heading{display:block}
.stage-copy .motion-heading h2{font-size:clamp(34px,3.25vw,54px);line-height:1.04;letter-spacing:-.035em;max-width:none}
.stage-copy .motion-heading>p{font-size:17px;line-height:1.5;margin-top:16px;max-width:380px}
.stage-copy .chapter-steps{margin-top:28px}
.stage-captions{list-style:none;margin:16px 0 0;padding:0}
.stage-captions>li+li{margin-top:22px}
.stage-captions h3{font-size:clamp(22px,1.75vw,27px);line-height:1.15;letter-spacing:-.02em}
.stage-captions p{font-size:16px;line-height:1.5;margin-top:8px;color:var(--muted);max-width:380px}
.stage-captions .text-link{display:inline-block;margin-top:12px}
[data-stage-mounted] .stage-captions{display:grid}
/* A caption hands over in sequence, out then in, so two captions never overlap mid-change. */
[data-stage-mounted] .stage-captions>li{grid-area:1/1;margin:0;opacity:0;visibility:hidden;transition:opacity .14s linear,visibility 0s linear .14s}
[data-stage-mounted] .stage-captions>li[data-current]{opacity:1;visibility:visible;transition:opacity .24s cubic-bezier(.4,0,.2,1) .14s,visibility 0s linear .14s}
.model-stage-section .motion-tail-link{display:inline-block;margin:44px var(--pad) 72px}
@media(max-width:760px){
 .stage-track{height:280svh}
 .stage-sticky{min-height:600px}
 .stage-canvas{inset:0 0 auto;height:52%}
 .stage-copy{inset:52% 22px auto;bottom:auto;width:auto;padding-top:18px}
 .stage-copy .motion-heading h2{font-size:28px}
 .stage-copy .motion-heading>p{font-size:15px;line-height:1.45;margin-top:10px}
 .stage-copy .chapter-steps{margin-top:14px;padding-top:8px;gap:4px 20px}
 .stage-captions{margin-top:8px}
 .stage-captions h3{font-size:20px}
 .stage-captions p{font-size:15px;line-height:1.45;margin-top:6px}
 .stage-captions .text-link{margin-top:8px}
}
@media(prefers-reduced-motion:reduce){[data-stage-mounted] .stage-captions>li{transition:none}}
/* A static plate when the stage cannot run: the authored still, then the heading and every caption in flow. Keyed to
   the two states that need it, no script (`scripting: none`) and a module that failed to load (`data-stage-error`, set
   by the loader), and never to "not mounted yet": that keyed the plate to every reader for as long as the page's
   scripts were still loading, and the section changed shape under them when the loader ran. */
@media(scripting:none){
.model-stage-section .stage-track{height:auto}
.model-stage-section .stage-sticky{position:relative;height:auto;min-height:0;overflow:visible}
.model-stage-section .stage-canvas{position:relative;inset:auto;height:auto;aspect-ratio:1470/725}
.model-stage-section .stage-copy{position:relative;inset:auto;width:auto;max-width:760px;padding:36px var(--pad) 0}
.model-stage-section .chapter-steps{display:none}
}
.model-stage-section[data-stage-error] .stage-track{height:auto}
.model-stage-section[data-stage-error] .stage-sticky{position:relative;height:auto;min-height:0;overflow:visible}
.model-stage-section[data-stage-error] .stage-canvas{position:relative;inset:auto;height:auto;aspect-ratio:1470/725}
.model-stage-section[data-stage-error] .stage-copy{position:relative;inset:auto;width:auto;max-width:760px;padding:36px var(--pad) 0}
.model-stage-section[data-stage-error] .chapter-steps{display:none}
/* The engineering stage (LM2) is the same pinned frame. Its footnote, the measured conditions' link, follows the pin
   in normal flow, as the section above's tail link does, so it reads in every edition: moving, still and plate. */
.model-stage-section .engineering-footnote{display:flex;gap:5vw;justify-content:space-between;align-items:center;margin:44px var(--pad) 72px}
@media(max-width:900px){.model-stage-section .engineering-footnote{align-items:start;flex-direction:column;gap:20px}}
/* "See what runs today. See what comes next." (LM3): the same table and lamp as the stage above, now as the record. The
   context note that qualifies every scene on the page follows the pinned track, in flow, where it always was. */
.evidence-stage-section .evidence-context{padding:44px var(--pad) 72px}
/* "Build the next stage with us." (LM4): the page's last section on the same stage. The pin is modest because this is the
   end of the page, 150svh of scroll while the stage holds (the section above holds for 200svh); after it the four calls and
   the footer sit in normal flow, inside the section's own padding as before
   (the title, which used to open that padding, is now the stage's). The section's diagonal copper line goes: it would
   cross the lamp-lit model, it is a glow the direction refuses (§8), and this section uses no orange. On a phone the
   copy is the title alone, so the canvas takes more of the frame than the section above gives it. */
#build.model-stage-section::before{content:none}
#build .stage-track{height:250svh}
#build .build-tail{padding:0 var(--pad) 55px}
@media(max-width:760px){
 #build .stage-canvas{height:76%}
 #build .stage-copy{inset:76% 22px auto}
 #build .build-tail{padding-bottom:45px}
}
/* The static plate, as the section above has it: these undo the rules just above, which outrank the plate's own. */
@media(scripting:none){#build .stage-track{height:auto}#build .stage-canvas{height:auto}#build .stage-copy{inset:auto}}
#build[data-stage-error] .stage-track{height:auto}
#build[data-stage-error] .stage-canvas{height:auto}
#build[data-stage-error] .stage-copy{inset:auto}
