/* Cinematic layer: same brand, true geometry, reserved space for the living mark. */
.world{position:fixed;inset:0;z-index:8;pointer-events:none;width:100%;height:100svh}
.world canvas{position:absolute;inset:0;width:100%;height:100%}
.hero{isolation:auto;background:radial-gradient(ellipse at 55% 42%,#27302e 0,#111817 34%,#090b0d 70%)}
.hero-vignette{z-index:3;background:linear-gradient(180deg,#090b0d55,transparent 30%,transparent 65%,#090b0daa)}
.header{position:fixed;height:88px;z-index:30;background:linear-gradient(#090b0dec,#090b0d55);backdrop-filter:blur(12px)}
.header .brand img{width:45px}
.header nav{gap:30px}
.hero-heading,.chapter-copy,.finish-copy,.location,.side-note,.hero-bottom{z-index:12}
.hero-heading{top:auto;bottom:16%;left:7%}
.hero-heading h1{font-size:var(--t-heading);line-height:var(--lh-head)}
.hero-heading .eyebrow{margin-bottom:16px;color:#cbd0ca}
.location{top:103px}
.side-note{top:auto;bottom:18%;right:9%;text-align:right}
.side-note p{line-height:var(--lh)}
.chapter-copy{top:25%;left:7%}
.chapter-copy h2{font-size:var(--t-heading)}
.finished{clip-path:circle(0% at 60% 55%);will-change:clip-path,transform}
.photo-shade{background:linear-gradient(90deg,#0009,transparent 75%),linear-gradient(0deg,#0009,transparent 50%,#0006)}
.hero-bottom{right:9%;bottom:30px}
.journey-rail{position:fixed;right:20px;top:32%;bottom:15%;z-index:9;display:flex;flex-direction:column;align-items:center;gap:24px;pointer-events:none;opacity:0;color:#b6bcb6}
.journey-rail>span:first-child{writing-mode:vertical-rl;font-size:var(--t-caption);letter-spacing:var(--track)}
.journey-rail i{width:1px;flex:1;background:#8885;min-height:35px}
.journey-percent{font-size:var(--t-caption);font-variant-numeric:tabular-nums}
.motion-toggle{position:fixed;bottom:18px;left:20px;z-index:35;background:#090b0dcc;border:1px solid #ffffff38;border-radius:30px;padding:8px 13px;font-size:var(--t-caption);color:#d1d5cf;backdrop-filter:blur(8px)}
.motion-toggle:hover{color:var(--amber);border-color:var(--amber)}
.contact{position:relative;min-height:700px;display:flex;flex-direction:column;justify-content:center}
.contact h2{max-width:65%;font-size:var(--t-hero)}
.contact h2 span{color:#665600}
.project-image{transform-style:preserve-3d;transition:box-shadow .4s}
.project:focus-visible .image-action{background:var(--amber)}
.school-photo,.approach-image{border-radius:2px}
.commercial-proof{padding-right:25px}
.footer{padding-bottom:75px}
.fallback .world,.fallback .journey-rail{display:none}
.fallback .finished{clip-path:none;transform:none!important}
.fallback .motion-toggle{display:none}
.fallback .header .brand img{visibility:visible!important}
@media(max-width:700px){.webgl-ready .world{z-index:31}}
@media(min-width:1000px){.section{padding-right:max(8%,95px)}.work-heading{max-width:1000px}.contact h2{max-width:70%}}
@media(max-width:900px){.header{height:78px}.hero-heading{bottom:17%;top:auto}.location{top:105px}.side-note{bottom:19%;right:9%}.contact h2{max-width:80%;font-size:var(--t-heading)}}
@media(max-width:700px){.header{height:76px}.header .brand img{width:42px;height:30px}.webgl-ready .header .brand img{visibility:hidden}.world{height:100svh}.hero{min-height:680px}.hero-heading{left:6%;bottom:20%;top:auto}.hero-heading h1{font-size:var(--t-heading)}.hero-heading .eyebrow{max-width:265px}.location{top:99px;font-size:var(--t-caption)}.side-note,.journey-rail{display:none}.chapter-copy{top:24%;left:6%}.chapter-copy h2{font-size:var(--t-heading)}.hero-bottom{left:6%;right:6%;bottom:25px}.motion-toggle{bottom:10px;left:auto;right:12px;padding:6px 10px}.model-note{max-width:190px}.contact{min-height:0}.contact h2{max-width:100%}.commercial-proof{padding-right:0}.footer{padding-bottom:75px}}
@media(prefers-reduced-motion:reduce){.world,.journey-rail,.motion-toggle{display:none}.finished{clip-path:none}.header .brand img{visibility:visible!important}.contact h2{max-width:100%}}

/* Travelling identity: navigation is a movable capsule, not a fixed masthead. */
.header{top:0;left:0;width:188px;height:60px;padding:0 18px;gap:20px;border:1px solid #f5c40055;border-radius:40px;background:#0d110feb;box-shadow:0 12px 45px #0005;z-index:40;will-change:transform;transform:translate3d(22px,22px,0)}
.header .brand>span{display:none}
.header .brand img,.footer .brand img{visibility:visible!important;filter:invert(79%) sepia(96%) saturate(1600%) hue-rotate(2deg) brightness(106%) contrast(104%);width:44px;height:30px}
.menu-toggle{display:flex;align-items:center;gap:12px;padding:10px 0;background:none;border:0;color:var(--paper);font-size:var(--t-small);cursor:pointer}
.menu-toggle span{color:var(--amber);font-size:var(--t-sub);transition:transform .3s}
.menu-open .menu-toggle span{transform:rotate(45deg)}
.header nav{position:absolute;display:flex;flex-direction:column;gap:0;left:0;top:72px;width:min(300px,calc(100vw - 28px));padding:12px 22px;border:1px solid #f5c40055;border-radius:20px;background:#101613fa;box-shadow:0 20px 70px #0009}
.header nav[hidden]{display:none}
.header nav{overflow-y:auto}
.header.menu-right nav{left:auto;right:0}
.header.menu-up nav{top:auto;bottom:72px}
.header nav a{display:flex;justify-content:space-between;gap:18px;padding:17px 0;border-bottom:1px solid #ffffff15;font-size:var(--t-small)}
.header nav a:last-child{border:0}
.header nav a span{color:var(--amber);font-size:var(--t-caption)}
.header:focus-within{border-color:var(--amber)}
.brand-touch{position:fixed;left:0;top:0;z-index:32;display:block;background:transparent;border:0;padding:0;cursor:grab;touch-action:none;-webkit-tap-highlight-color:transparent}
.brand-touch:active{cursor:grabbing}
.brand-touch:focus-visible{outline:1px dashed var(--amber);outline-offset:8px;border-radius:20px}
.journey-rail{display:none!important}
.brand-flight{height:48vh;min-height:390px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 60% 45%,#34311a55,transparent 65%),#090b0d;border-top:1px solid #f5c40030;border-bottom:1px solid #f5c40030}
.brand-flight{height:76vh;min-height:520px;background:radial-gradient(ellipse at 50% 40%,#40331455,transparent 67%),#090b0d}
.brand-flight>.eyebrow{position:absolute;left:7%;top:30px;color:var(--amber)}
.flight-caption{position:absolute;bottom:28px;left:7%;font-family:Bodoni,Georgia,serif;font-size:var(--t-sub);color:var(--paper)}
.flight-caption span{display:block;font-family:Satoshi,Arial,sans-serif;font-size:var(--t-caption);letter-spacing:var(--track);color:var(--muted);margin-top:10px}
.contact{background:#111613;color:var(--paper);border-top:1px solid #f5c40044}
.contact h2 span{color:var(--amber)}
.contact .pill{background:var(--amber);color:var(--ink)}
.contact .pill:hover{background:#ffdd49}
.contact-row>a:not(.pill){color:var(--paper)}
.footer{padding-bottom:115px}
.motion-toggle{left:auto;right:20px;bottom:12px}
.fallback .brand-touch,.fallback .brand-flight{display:none}
.fallback .header{transform:translate3d(22px,22px,0)!important}
@media(max-width:700px){
  .section{padding-left:32px;padding-right:32px}
  .header{width:174px;height:56px;padding:0 15px;gap:14px;transform:translate3d(14px,14px,0)}
  .header .brand img{width:42px;height:30px}
  .menu-toggle{font-size:var(--t-caption)}
  .brand-flight{height:62vh;min-height:440px}
  .brand-flight>.eyebrow{top:24px;left:6%;max-width:85%}
  .flight-caption{left:6%;bottom:22px}
  .motion-toggle{right:12px;bottom:9px}
  .fallback .header{transform:translate3d(14px,14px,0)!important}
}
@media(prefers-reduced-motion:reduce){.brand-touch,.brand-flight{display:none}.header{will-change:auto}}

/* Reference-led membrane composition: a fine material, not a spinning masthead. */
.hero{background:radial-gradient(ellipse at 70% 42%,#142329 0,#0c151b 45%,#080d12 85%)}
.hero-heading{top:29%;bottom:auto;left:7%;max-width:44%}
.hero-heading h1{font-size:var(--t-heading);line-height:1.04}
.hero-heading h1 span{color:#f1e6c8}
.hero-intro{font-size:var(--t-small);line-height:1.65;color:#aab7b9;margin-top:27px}
.hero-heading .eyebrow{color:#f5c400}
.location{top:112px;left:7%}
.material-copy{position:absolute;z-index:12;top:20%;left:7%;opacity:0;visibility:hidden;pointer-events:none}
.material-copy h2{font-family:Bodoni,Georgia,serif;font-weight:400;font-size:var(--t-heading);line-height:1.05;margin-top:16px}
.material-copy .eyebrow{color:#f5c400}
.side-note{bottom:18%;right:7%}
.side-note p{color:#afbabd}
.brand-flight{background:radial-gradient(ellipse at center,#18252b,#080d12 72%)}
.brand-touch{pointer-events:none!important;display:none!important}
.fallback .material-copy{display:none}
@media(max-width:700px){
  .webgl-ready .world{z-index:8}
  .hero-heading{top:auto;bottom:18%;left:7%;max-width:86%}
  .hero-heading h1{font-size:var(--t-heading)}
  .hero-heading h1 br{display:block!important}
  .hero-intro{margin-top:14px}
  .hero-intro br{display:none}
  .location{top:91px;font-size:var(--t-caption)}
  .material-copy{top:17%;left:7%}
  .material-copy h2{font-size:var(--t-heading)}
}