:root{
  --bg:#080808;--fg:#F2F0EA;--muted:rgba(242,240,234,.56);--hairline:rgba(242,240,234,.17);
  --light-bg:#EFEDE6;--light-fg:#111111;--light-muted:rgba(17,17,17,.56);--light-hairline:rgba(17,17,17,.18);
  --surface:var(--bg);--ink:var(--fg);--soft:var(--muted);--line:var(--hairline);
  --display:"Helvetica Neue",Helvetica,Arial,-apple-system,BlinkMacSystemFont,sans-serif;
  --mono:ui-monospace,"SFMono-Regular",Menlo,Monaco,Consolas,"Liberation Mono",monospace;
  --micro:clamp(10px,.75vw,12px);--reading:clamp(15px,1.15vw,19px);--monumental:clamp(4.25rem,11vw,12.5rem);
  --pad-x:clamp(1.35rem,3.2vw,3rem);--pad-y:clamp(1.35rem,3vw,2.75rem);
}
html{background:var(--bg);scrollbar-color:rgba(242,240,234,.35) var(--bg)}
body{background:var(--surface);color:var(--ink);font-family:var(--display);font-size:var(--reading);font-weight:400;line-height:1.35;overflow-x:hidden;overflow-x:clip;transition:background-color .7s cubic-bezier(.22,1,.36,1),color .7s cubic-bezier(.22,1,.36,1)}
body.is-inverted{--surface:var(--light-bg);--ink:var(--light-fg);--soft:var(--light-muted);--line:var(--light-hairline)}
::selection{background:var(--ink);color:var(--surface)}
.skip-link{position:fixed;left:1rem;top:1rem;z-index:5000;background:var(--ink);color:var(--surface);padding:.65rem .9rem;transform:translateY(-180%);transition:transform .2s}.skip-link:focus{transform:translateY(0)}
.micro,.brand,.index-btn,.progress-indicator,.index-close,.index-item span,.form-group label,.form-status,.direct-email,.site-footer{font-family:var(--mono);font-size:var(--micro);letter-spacing:.09em;text-transform:uppercase}
.monumental{font-size:var(--monumental);font-weight:400;line-height:.84;letter-spacing:-.052em;text-transform:uppercase;white-space:nowrap}
.supporting-text{max-width:none;color:var(--soft);font-size:var(--reading);line-height:1.5;text-align:center;white-space:nowrap}
.fixed-ui{position:fixed;inset:0 0 auto;z-index:300;display:flex;align-items:center;justify-content:space-between;padding:var(--pad-y) var(--pad-x);pointer-events:none;mix-blend-mode:difference;color:#fff}
.fixed-ui>*{pointer-events:auto}.brand{font-weight:600;color:inherit}.index-btn,.index-close{color:inherit;padding:.35rem 0;border-bottom:1px solid currentColor}
.progress-indicator{position:fixed;right:var(--pad-x);bottom:var(--pad-y);z-index:300;display:flex;gap:.55rem;align-items:center;color:#fff;mix-blend-mode:difference;pointer-events:none}.progress-separator{opacity:.45}
#webgl-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}.particle-fallback{position:fixed;left:50%;top:50%;z-index:2;transform:translate(-50%,-50%);font-size:2rem;color:var(--soft);opacity:.32;pointer-events:none}.webgl-ready .particle-fallback{display:none}
#main-content{position:relative;z-index:10}.scene{position:relative;min-height:180vh;min-height:180svh;padding:0 var(--pad-x)}.scene-stage{position:sticky;top:0;height:100vh;height:100svh;display:flex;align-items:center;justify-content:center;overflow:hidden}.centered-stage{flex-direction:column;gap:2rem;text-align:center}.scene-arrival{min-height:220vh;min-height:220svh}.scene-arrival .scene-stage{flex-direction:column;text-align:center}.hello-text{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:var(--soft);letter-spacing:.2em}.name-wrapper{display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:1}.name-line{display:block}.scene:nth-of-type(2){min-height:190vh;min-height:190svh}.scene:nth-of-type(3){min-height:220vh;min-height:220svh}.scene:nth-of-type(4){min-height:220vh;min-height:220svh}.scene:nth-of-type(5){min-height:165vh;min-height:165svh}.scene:nth-of-type(6){min-height:195vh;min-height:195svh}.scene:nth-of-type(7){min-height:160vh;min-height:160svh}.scene:nth-of-type(8){min-height:180vh;min-height:180svh}.scene:nth-of-type(9){min-height:240vh;min-height:240svh}
.certainty-residue{position:absolute;bottom:18%;font-size:clamp(2rem,4vw,4.5rem);opacity:0;color:var(--soft)}
.noise-stage{position:sticky}.noise-fragments{position:absolute;inset:0;pointer-events:none}.noise-fragments span{position:absolute;font-family:var(--display);font-size:clamp(1.8rem,5vw,6.5rem);font-weight:400;line-height:1;letter-spacing:-.04em;color:var(--ink);opacity:0;white-space:nowrap}
/* Fragments ring the statement: the centre band (x 26-74%, y 39-61%) is kept
   clear so the statement resolves out of the noise instead of colliding with it. */
.noise-fragments span:nth-child(1){left:6%;top:13%;transform:rotate(-7deg)}.noise-fragments span:nth-child(2){left:auto;right:7%;top:16%;transform:rotate(4deg)}.noise-fragments span:nth-child(3){left:5%;top:41%;transform:rotate(2deg)}.noise-fragments span:nth-child(4){left:auto;right:5%;top:45%;transform:rotate(-5deg)}.noise-fragments span:nth-child(5){left:11%;top:69%;transform:rotate(6deg)}.noise-fragments span:nth-child(6){left:auto;right:8%;top:73%;transform:rotate(-3deg)}.noise-fragments span:nth-child(7){left:34%;top:84%;transform:rotate(3deg)}.noise-fragments span:nth-child(8){left:44%;top:24%;transform:rotate(-2deg)}.noise-statement{position:relative;z-index:2;max-width:25ch;font-size:clamp(1.6rem,3.4vw,4rem);line-height:1.05;letter-spacing:-.035em;font-weight:400;text-transform:uppercase;text-align:center}.scene-dot{position:absolute;bottom:15%;font-size:2rem;color:var(--soft)}
.attention-stage{gap:2.5rem}.notice-support{position:absolute;bottom:16%}
.between-stage{flex-direction:column;gap:0}.between-layout{position:relative;z-index:4;width:min(100%,1380px);display:grid;grid-template-columns:minmax(0,1fr) clamp(8rem,14vw,13rem) minmax(0,1fr);align-items:center;gap:0;margin-inline:auto}.between-left,.between-right{font-size:clamp(2.55rem,4.7vw,5.55rem);line-height:.9;letter-spacing:-.046em;white-space:nowrap}.between-left{justify-self:end;text-align:right}.between-right{justify-self:start;text-align:left}.between-center{width:100%;display:grid;place-items:center;font-size:clamp(1.35rem,1.8vw,2rem);color:var(--soft);text-align:center}.between-center::before,.between-center::after{display:none}.between-support{position:absolute;left:50%;bottom:8.5%;transform:translateX(-50%);z-index:6;width:max-content;max-width:min(90vw,42rem);background:var(--surface);padding:.22rem .8rem;box-shadow:0 0 0 .45rem var(--surface)}
.knowing-stage{gap:1.5rem}.knowing-stack{position:relative;width:min(100%,1500px);height:62vh;min-height:34rem}.knowing-stack h2{position:absolute;font-size:clamp(3rem,6.5vw,7.6rem);line-height:.86;letter-spacing:-.048em;white-space:nowrap}.knowing-1{left:5%;top:12%;text-align:left;z-index:2}.knowing-2{right:5%;bottom:12%;text-align:right;z-index:1}.knowing-support{opacity:1;margin-top:-.5rem}
.time-display{font-family:var(--mono);font-size:clamp(2.6rem,7vw,7rem);letter-spacing:.08em;font-weight:300;color:var(--ink)}
.question-sequence{position:relative;width:min(100%,1000px);height:45vh;display:grid;place-items:center}.question-sequence>*{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:100%;text-align:center}.question-line{font-family:var(--mono);font-size:var(--micro);letter-spacing:.12em;text-transform:uppercase;color:var(--soft)}
.scene-contact{min-height:115vh;min-height:115svh;display:flex;flex-direction:column;justify-content:space-between;padding-top:14vh}.contact-stage{width:min(100%,660px);margin:0 auto}.contact-heading{font-size:clamp(2.9rem,7vw,7rem);line-height:.9;letter-spacing:-.045em;font-weight:400;text-transform:uppercase;margin-bottom:5rem}.contact-form{display:flex;flex-direction:column;gap:2.25rem}.form-group{display:flex;flex-direction:column;gap:.55rem;border-bottom:1px solid var(--line);padding-bottom:.85rem;transition:border-color .25s}.form-group:focus-within{border-color:var(--ink)}.form-group label{color:var(--soft)}.form-group input,.form-group textarea{width:100%;min-height:2.2rem;color:var(--ink);font-size:max(16px,var(--reading));outline:none}.form-group textarea{min-height:7rem}.submit-btn{align-self:flex-start;margin-top:.7rem;padding:.75rem 0;border-bottom:1px solid var(--ink);font-family:var(--mono);font-size:var(--micro);letter-spacing:.09em;text-transform:uppercase}.submit-btn[disabled]{opacity:.45;cursor:wait}.form-status{min-height:1.5rem;color:var(--soft);text-transform:none;letter-spacing:.02em}.form-success h2{font-size:clamp(3rem,8vw,8rem);line-height:.9;letter-spacing:-.04em;font-weight:400}.form-success p{margin-top:2rem;color:var(--soft)}.final-dot{display:block;margin-top:3rem;font-size:2rem;color:var(--soft)}.direct-email{margin-top:3rem;color:var(--soft);text-transform:none}.direct-email a{border-bottom:1px solid var(--line)}.honeypot{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(1px,1px,1px,1px)!important;white-space:nowrap!important}.site-footer{padding:5rem 0 var(--pad-y);text-align:center;color:var(--soft);width:100%}
.index-overlay{position:fixed;inset:0;z-index:1000;background:#080808;color:#F2F0EA;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .42s cubic-bezier(.22,1,.36,1),visibility .42s}.index-overlay.active{opacity:1;visibility:visible;pointer-events:auto}.index-shell{height:100%;padding:var(--pad-y) var(--pad-x);display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.index-header{display:flex;justify-content:space-between;align-items:center}.index-header .micro{color:rgba(242,240,234,.55)}.index-list{margin:auto 0;display:flex;flex-direction:column;gap:clamp(.5rem,1.3vh,1.1rem);width:min(100%,1000px)}.index-item{display:grid;grid-template-columns:4rem 1fr;align-items:baseline;text-align:left;color:#F2F0EA;opacity:.48;transition:opacity .2s}.index-item:hover,.index-item:focus-visible{opacity:1}.index-item span{color:rgba(242,240,234,.5)}.index-item strong{font-size:clamp(1.45rem,3.7vw,3.9rem);font-weight:400;letter-spacing:-.035em;line-height:1.05}
.custom-cursor{position:fixed;left:0;top:0;width:16px;height:16px;border:1px solid #fff;border-radius:50%;z-index:2000;pointer-events:none;opacity:0;transform:translate(-50%,-50%);mix-blend-mode:difference;display:grid;place-items:center;transition:width .25s,height .25s,opacity .2s}.custom-cursor span{font-size:0;line-height:1}.custom-cursor.visible{opacity:1}.custom-cursor.hover{width:34px;height:34px}.custom-cursor.send-hover span{font-size:10px}.custom-cursor-active,.custom-cursor-active button,.custom-cursor-active a,.custom-cursor-active input,.custom-cursor-active textarea{cursor:none!important}
:focus-visible{outline:2px solid currentColor;outline-offset:5px}
body.index-open{overflow:hidden}
@media(max-width:1024px){:root{--monumental:clamp(3.5rem,11.4vw,8rem)}.between-layout{grid-template-columns:minmax(0,1fr) clamp(6.5rem,13vw,9rem) minmax(0,1fr)}.between-left,.between-right{font-size:clamp(2.2rem,4.35vw,4.4rem)}.between-support{bottom:8.5%}.knowing-stack{height:58vh;min-height:30rem}.knowing-stack h2{font-size:clamp(2.75rem,6.5vw,6.2rem)}.knowing-1{left:3%}.knowing-2{right:3%}}
@media(max-width:768px){:root{--monumental:clamp(3rem,15vw,7rem)}.fixed-ui{padding:1.4rem 1.35rem}.progress-indicator{right:1.35rem;bottom:1.35rem}.scene{padding:0 1.35rem}.monumental{white-space:normal;overflow-wrap:normal}.supporting-text{max-width:32ch;white-space:normal}.name-line{white-space:nowrap;font-size:clamp(2.75rem,14.5vw,6.25rem)}#certainty-text{font-size:clamp(2.55rem,13vw,5.5rem);white-space:nowrap}.noise-fragments span{font-size:clamp(1.45rem,9vw,3.4rem)}.between-stage{gap:0}.between-layout{height:50vh;display:grid;grid-template-columns:1fr;grid-template-rows:1fr minmax(6.5rem,12vh) 1fr;align-items:center;justify-items:center;gap:0}.between-left,.between-right{font-size:clamp(2.15rem,9vw,4rem);white-space:nowrap;text-align:center;justify-self:center;align-self:center}.between-center{align-self:stretch;justify-self:center;width:auto;height:auto;display:grid;place-items:center}.between-center::before,.between-center::after{display:none}.between-support{bottom:7.5%;max-width:30ch;width:auto;white-space:normal;padding:.22rem .55rem}.knowing-stack{height:48vh;min-height:24rem}.knowing-stack h2{font-size:clamp(2.25rem,9.4vw,4.5rem)}.knowing-1{left:0;top:10%}.knowing-2{right:0;bottom:10%}.knowing-support{max-width:30ch;margin-top:0}.question-sequence{height:50vh}.contact-heading{font-size:clamp(3rem,15vw,5.7rem)}.index-item{grid-template-columns:2.8rem 1fr}.index-item strong{font-size:clamp(1.55rem,7vw,2.5rem)}.scene-contact{padding-top:16vh}}
@media(max-width:430px){:root{--pad-x:1rem}.fixed-ui{padding:1.15rem 1rem}.progress-indicator{right:1rem;bottom:1rem}.scene{padding:0 1rem}.name-line{font-size:clamp(2.55rem,14vw,4.4rem)}#certainty-text{font-size:clamp(2.35rem,12.4vw,4rem)}.supporting-text{font-size:clamp(14px,3.8vw,16px);max-width:29ch}.noise-statement{font-size:clamp(1.35rem,6.4vw,2.05rem);max-width:22ch}.between-layout{height:48vh;grid-template-rows:1fr minmax(5.5rem,10vh) 1fr}.between-left,.between-right{font-size:clamp(1.95rem,8.8vw,3.4rem)}.between-center{font-size:1.4rem}.between-support{bottom:6.5%}.knowing-stack{height:44vh;min-height:21rem}.knowing-stack h2{font-size:clamp(2rem,8.7vw,3.7rem)}.time-display{font-size:clamp(2.15rem,11vw,4rem)}.contact-heading{font-size:clamp(2.7rem,14vw,4.6rem)}}
/* The custom cursor is hidden by pointer capability only, never by width — hiding
   it on a narrow desktop window used to leave no cursor at all. */
@media(hover:none),(pointer:coarse){.custom-cursor{display:none!important}.custom-cursor-active,.custom-cursor-active button,.custom-cursor-active a,.custom-cursor-active input,.custom-cursor-active textarea{cursor:auto!important}}


/* =========================================================
   RESPONSIVE PERFECTION PASS — phone / tablet / orientation
   These rules intentionally come last and override earlier
   generic responsive rules scene by scene.
   ========================================================= */
.fixed-ui{
  padding-top:max(var(--pad-y),env(safe-area-inset-top));
  padding-left:max(var(--pad-x),env(safe-area-inset-left));
  padding-right:max(var(--pad-x),env(safe-area-inset-right));
}
.progress-indicator{
  right:max(var(--pad-x),env(safe-area-inset-right));
  bottom:max(var(--pad-y),env(safe-area-inset-bottom));
}
.name-wrapper{width:100%;max-width:100%;padding-inline:.25rem}
#certainty-text,#becoming-text{white-space:nowrap}

/* Portrait tablets, small tablets and large phones. */
@media (max-width:899px){
  :root{--pad-x:clamp(1rem,3.4vw,1.75rem);--pad-y:clamp(1rem,2.8vw,1.6rem)}
  .fixed-ui{padding-top:max(1.15rem,env(safe-area-inset-top));padding-bottom:1rem}
  .scene-stage{height:100vh;height:100svh}

  /* Shorter, intentional mobile/tablet pacing. */
  .scene-arrival{min-height:175vh;min-height:175svh}
  .scene:nth-of-type(2){min-height:150vh;min-height:150svh}
  .scene:nth-of-type(3){min-height:175vh;min-height:175svh}
  .scene:nth-of-type(4){min-height:165vh;min-height:165svh}
  .scene:nth-of-type(5){min-height:140vh;min-height:140svh}
  .scene:nth-of-type(6){min-height:165vh;min-height:165svh}
  .scene:nth-of-type(7){min-height:135vh;min-height:135svh}
  .scene:nth-of-type(8){min-height:150vh;min-height:150svh}
  .scene:nth-of-type(9){min-height:185vh;min-height:185svh}

  /* HERO — each line sized independently so both always fit. */
  .arrival-stage{padding-inline:clamp(.75rem,3vw,2rem)}
  .name-wrapper{gap:.28rem}
  .name-line{line-height:.88;letter-spacing:-.045em;white-space:nowrap}
  .name-line:first-child{font-size:clamp(3.8rem,15vw,7.25rem)}
  .name-line:nth-child(2){font-size:clamp(2.15rem,8.8vw,4.5rem);letter-spacing:-.035em}
  .hello-text{font-size:clamp(10px,1.7vw,12px)}

  /* CERTAINTY — keep the whole word intact while allowing visible tracking. */
  #certainty-text{font-size:clamp(2.75rem,10.8vw,5.4rem);line-height:.9;letter-spacing:-.035em}
  .certainty-support{max-width:32ch;white-space:normal;margin-inline:auto}
  .certainty-residue{bottom:16%}

  /* NOISE — narrow viewports have no horizontal room to dodge the statement, so
     the fragments split above/below it and leave the y 38-62% band empty. */
  .noise-fragments span{font-size:clamp(1.35rem,6.5vw,3.6rem)}
  .noise-fragments span:nth-child(1){left:5%;top:11%}.noise-fragments span:nth-child(2){left:auto;right:5%;top:17%}
  .noise-fragments span:nth-child(3){left:7%;top:30%}.noise-fragments span:nth-child(4){left:auto;right:6%;top:66%}
  .noise-fragments span:nth-child(5){left:6%;top:73%}.noise-fragments span:nth-child(6){left:auto;right:5%;top:79%}
  .noise-fragments span:nth-child(7){left:26%;top:86%}.noise-fragments span:nth-child(8){left:38%;top:23%}
  .noise-statement{font-size:clamp(1.35rem,5.4vw,2.7rem);max-width:24ch;padding-inline:.25rem}

  /* ATTENTION — still exceeds the viewport, but deliberately rather than clipping wildly. */
  #notice-text{font-size:clamp(3.8rem,16vw,8rem);line-height:.86}
  .notice-support{bottom:12%;max-width:30ch;white-space:normal}

  /* BETWEEN — portrait composition: text / slash / text. */
  .between-layout{height:62vh;height:62svh;grid-template-columns:1fr;grid-template-rows:1fr minmax(7rem,18vh) 1fr;place-items:center;width:100%;max-width:38rem}
  .between-left,.between-right{font-size:clamp(2.25rem,8.2vw,4.25rem);line-height:.9;letter-spacing:-.04em;justify-self:center;text-align:center;white-space:nowrap}
  .between-left{align-self:end;padding-bottom:1.1rem}.between-right{align-self:start;padding-top:1.1rem}
  .between-center{align-self:stretch;display:grid;place-items:center;font-size:1.35rem}
  /* Percentage offsets alone let the support text sit ~30px off the bottom on a
     667px phone; the floor keeps it clear of the edge and the home indicator. */
  .between-support{bottom:max(5.5%,calc(3.25rem + env(safe-area-inset-bottom)));max-width:31ch;width:auto;white-space:normal;font-size:clamp(14px,2.2vw,17px);line-height:1.45;padding:.18rem .48rem}

  /* KNOWING — preserve diagonal tension without allowing collision. */
  .knowing-stage{gap:.75rem}
  .knowing-stack{height:54vh;height:54svh;min-height:27rem;width:100%;max-width:46rem}
  .knowing-stack h2{font-size:clamp(2.6rem,8.2vw,5.2rem);line-height:.88;letter-spacing:-.035em}
  .knowing-1{left:3%;top:11%}.knowing-2{right:3%;bottom:11%}
  .knowing-support{max-width:31ch;white-space:normal;margin-top:-.5rem}

  /* TIME */
  .time-display{font-size:clamp(2.45rem,8.5vw,5rem);letter-spacing:.065em}
  .time-stage .supporting-text{max-width:30ch;white-space:normal}

  /* BECOMING — its own scale and tracking; never inherits oversized generic mobile type. */
  #becoming-text{font-size:clamp(2.8rem,10.7vw,5.7rem);line-height:.9;letter-spacing:-.012em}
  .becoming-stage .supporting-text{max-width:31ch;white-space:normal}

  /* QUESTION */
  .question-sequence{height:48vh;height:48svh;max-width:34rem}
  .q-seq-3{font-size:clamp(3.1rem,13vw,6.4rem);white-space:nowrap}

  /* CONTACT */
  .scene-contact{padding-top:12vh;padding-top:12svh}
  .contact-stage{width:min(100%,38rem)}
  .contact-heading{font-size:clamp(2.8rem,11vw,5.4rem);margin-bottom:3.5rem}
  .form-group{margin:0;gap:.45rem}.form-group input,.form-group textarea{font-size:16px}
}

/* Phones. */
@media (max-width:599px){
  :root{--pad-x:max(1rem,env(safe-area-inset-left));--pad-y:1rem}
  .scene{padding-inline:max(1rem,env(safe-area-inset-left));padding-right:max(1rem,env(safe-area-inset-right))}
  .name-line:first-child{font-size:clamp(3.35rem,15.6vw,5.25rem)}
  .name-line:nth-child(2){font-size:clamp(1.95rem,8.9vw,3rem)}
  #certainty-text{font-size:clamp(2.25rem,11.2vw,3.85rem)}
  .noise-statement{font-size:clamp(1.25rem,5.8vw,2rem);max-width:22ch}
  #notice-text{font-size:clamp(3.6rem,17vw,5.7rem)}
  .between-layout{height:58vh;height:58svh;grid-template-rows:1fr minmax(6rem,16vh) 1fr}
  .between-left,.between-right{font-size:clamp(2rem,9.6vw,3.2rem)}
  .between-support{bottom:max(4.5%,calc(3.5rem + env(safe-area-inset-bottom)));font-size:clamp(13px,3.7vw,15px);max-width:28ch}
  .knowing-stack{height:49vh;height:49svh;min-height:23rem}
  .knowing-stack h2{font-size:clamp(2.05rem,9.5vw,3.45rem)}
  /* was flush to the page gutter — NOT KNOWING sat ~17px from the screen edge. */
  .knowing-1{left:3%;top:10%}.knowing-2{right:3%;bottom:10%}
  .knowing-support{font-size:clamp(13px,3.7vw,15px);max-width:28ch}
  .time-display{font-size:clamp(2.1rem,10.5vw,3.4rem)}
  #becoming-text{font-size:clamp(2.45rem,11.7vw,4.05rem);letter-spacing:-.006em}
  .q-seq-3{font-size:clamp(2.8rem,14vw,4.8rem)}
  .contact-heading{font-size:clamp(2.65rem,13.5vw,4.4rem)}
}

/* iPad / tablet landscape: keep horizontal BETWEEN but reduce scale. */
@media (min-width:900px) and (max-width:1024px){
  .name-line:first-child{font-size:clamp(5.5rem,11.5vw,7.4rem)}
  .name-line:nth-child(2){font-size:clamp(3.25rem,6.6vw,4.4rem)}
  #certainty-text{font-size:clamp(4.5rem,8.5vw,6.6rem)}
  .between-layout{grid-template-columns:minmax(0,1fr) clamp(7rem,12vw,9rem) minmax(0,1fr)}
  .between-left,.between-right{font-size:clamp(2.7rem,4.7vw,4.2rem)}
  .knowing-stack h2{font-size:clamp(3.8rem,6vw,5.8rem)}
  #becoming-text{font-size:clamp(4.5rem,8vw,6.6rem);letter-spacing:-.01em}
}

/* Short landscape screens (phones turned sideways). */
@media (max-height:600px) and (orientation:landscape){
  .fixed-ui{padding-top:.7rem;padding-bottom:.7rem}
  .progress-indicator{bottom:.7rem}
  .name-line:first-child{font-size:clamp(3rem,10vw,5rem)}
  .name-line:nth-child(2){font-size:clamp(1.8rem,5.7vw,3rem)}
  #certainty-text{font-size:clamp(2.8rem,8vw,4.5rem)}
  #becoming-text{font-size:clamp(2.8rem,8vw,4.5rem)}
  #notice-text{font-size:clamp(3rem,9vw,5rem)}
  .time-display{font-size:clamp(2rem,6vw,3.4rem)}
  .q-seq-3{font-size:clamp(2.4rem,7.5vw,4.2rem)}
  .contact-heading{font-size:clamp(2.4rem,7.5vw,4.2rem);margin-bottom:2.5rem}
  .scene-contact{padding-top:9vh;padding-top:9svh}

  /* NOISE — a short viewport gives the statement no vertical room, so the
     statement is scaled down and the fragments use the wide left/right columns. */
  .noise-statement{font-size:clamp(1.05rem,2.7vw,1.55rem);max-width:26ch}
  .noise-fragments span{font-size:clamp(1.05rem,3vw,2rem)}
  .noise-fragments span:nth-child(1){left:4%;top:12%}.noise-fragments span:nth-child(2){left:auto;right:5%;top:9%}
  .noise-fragments span:nth-child(3){left:3%;top:44%}.noise-fragments span:nth-child(4){left:auto;right:3%;top:47%}
  .noise-fragments span:nth-child(5){left:6%;top:76%}.noise-fragments span:nth-child(6){left:auto;right:6%;top:79%}
  .noise-fragments span:nth-child(7){left:30%;top:86%}.noise-fragments span:nth-child(8){left:34%;top:4%}
  .scene-dot{bottom:9%;font-size:1.4rem}

  /* KNOWING — the portrait stack height left ~19px under the support line. */
  .knowing-stage{gap:.5rem}
  .knowing-stack{height:60vh;height:60svh;min-height:14rem;max-width:52rem}
  .knowing-stack h2{font-size:clamp(1.9rem,5.2vw,3.1rem)}
  .knowing-1{left:2%;top:6%}.knowing-2{right:2%;bottom:6%}
  .knowing-support{font-size:clamp(13px,1.7vw,15px);max-width:44ch;margin-top:0}

  /* INDEX — ten chapters do not fit in 390px; keep them reachable. */
  .index-list{gap:.28rem;padding-block:.5rem}
  .index-item{grid-template-columns:2.4rem 1fr}
  .index-item strong{font-size:clamp(1.1rem,3.2vw,1.7rem)}
}

/* Landscape phones are wide and short: BETWEEN reads far better as the
   horizontal composition than as the portrait three-row stack. */
@media (min-width:700px) and (max-width:899px) and (orientation:landscape) and (max-height:600px){
  .between-layout{height:auto;grid-template-columns:minmax(0,1fr) clamp(4.5rem,9vw,7rem) minmax(0,1fr);grid-template-rows:auto;place-items:center;max-width:100%}
  .between-left,.between-right{font-size:clamp(1.5rem,4.2vw,2.3rem);letter-spacing:-.042em;padding:0}
  .between-left{justify-self:end;text-align:right;align-self:center}
  .between-right{justify-self:start;text-align:left;align-self:center}
  .between-center{align-self:center;font-size:1.1rem}
  .between-support{bottom:max(8%,2.75rem);max-width:44ch;font-size:clamp(13px,1.7vw,15px)}
}


/* Reduced motion comes last so no later breakpoint block can re-impose a
   fixed scene/stack height on the static layout. */
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.custom-cursor,#webgl-canvas{display:none!important}.particle-fallback{display:block!important}.scene{min-height:100vh!important;min-height:100svh!important}.scene-stage{position:relative;height:auto!important;min-height:100vh;min-height:100svh;overflow:visible}.hello-text{position:static;transform:none;margin-bottom:3rem}.name-wrapper{opacity:1!important}.certainty-residue{display:none}.noise-fragments{display:none}.noise-statement{opacity:1!important;transform:none!important}.knowing-stack h2{position:static;transform:none!important}.knowing-stack{height:auto!important;min-height:0!important;display:flex;flex-direction:column;gap:1rem}.question-sequence{height:auto!important;min-height:0;display:flex;flex-direction:column;gap:4rem}.question-sequence>*{position:static;transform:none!important;opacity:1!important}.scene-contact{min-height:100vh!important;min-height:100svh!important}}
