/* ═══════════════════════════════════════════════════════════
   IBSU — Study at IBSU / international admission landing
   Aesthetic: Byzantine codex. Lapis ground, gold tesserae,
   ivory vellum glass. Motion is scroll-owned, never automatic.
   ═══════════════════════════════════════════════════════════ */

/* ── tokens ─────────────────────────────────────────────── */
:root{
  --ink:        #04090f;
  --lapis-900:  #071224;
  --lapis-800:  #0a1a30;
  --lapis-700:  #0e2440;
  --lapis-500:  #1b4a7a;
  --sky:        #5ba3d0;

  --gold-900:   #7d5f1d;
  --gold-600:   #b08a34;
  --gold:       #c9a24d;
  --gold-300:   #ecd08a;
  --gold-100:   #f7e8c2;

  --ivory:      #f3ebdc;
  --parch:      #ddd0b6;
  --verdigris:  #7aa79a;

  --txt:        #ece4d6;
  --txt-dim:    rgba(236,228,214,.72);
  --txt-faint:  rgba(236,228,214,.42);

  --display: "Cormorant Garamond", "Iowan Old Style", Georgia, serif;
  --sans:    "Jost", "Avenir Next", "Segoe UI", sans-serif;
  --ka:      "Noto Serif Georgian", var(--display);

  --shell: 1180px;
  --gut: clamp(1.25rem, 4vw, 4rem);

  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-out: cubic-bezier(.16,1,.3,1);

  --glass-bg: linear-gradient(152deg,
              rgba(246,240,228,.155) 0%,
              rgba(246,240,228,.058) 46%,
              rgba(10,26,48,.26) 100%);
  --glass-brd: rgba(236,208,138,.24);
  --glass-shadow: 0 28px 70px -30px rgba(0,0,0,.9),
                  0 2px 10px -4px rgba(0,0,0,.5);
}

/* A fixed 1180px column reads as a thin ribbon on a large display, so the
   content column grows once the screen genuinely has room for it. */
@media (min-width:1700px){ :root{ --shell:1300px; } }
@media (min-width:2200px){ :root{ --shell:1420px; } }

/* ── reset ──────────────────────────────────────────────── */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0;
  background:
    radial-gradient(120% 80% at 50% -10%, #10294a 0%, transparent 60%),
    linear-gradient(180deg, var(--lapis-900) 0%, var(--ink) 100%);
  background-attachment: fixed;
  color:var(--txt);
  font-family:var(--sans);
  font-weight:300;
  font-size:clamp(15px,.2vw + 14.2px,16.5px);
  line-height:1.7;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img,video,svg{ display:block; max-width:100%; }
a{ color:inherit; }
h1,h2,h3{ margin:0; font-family:var(--display); font-weight:400; line-height:1.04; letter-spacing:-.012em; }
p{ margin:0; }
ul,ol{ margin:0; padding:0; list-style:none; }
::selection{ background:var(--gold); color:var(--ink); }
:focus-visible{ outline:2px solid var(--gold-300); outline-offset:3px; border-radius:2px; }

/* ── atmosphere layers ──────────────────────────────────── */
.tessera,.grain,.vignette{
  position:fixed; inset:0; pointer-events:none; z-index:3;
}
/* mosaic tesserae — a faint stone grid over everything */
.tessera{
  background-image:
    linear-gradient(rgba(236,208,138,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(236,208,138,.045) 1px, transparent 1px);
  background-size:34px 34px;
  mask-image: radial-gradient(130% 95% at 50% 42%, #000 15%, transparent 78%);
  opacity:.5;
  z-index:2;
}
.grain{
  z-index:9;
  opacity:.16; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.vignette{
  z-index:2;
  background:
    radial-gradient(115% 78% at 50% 44%, transparent 42%, rgba(4,9,15,.62) 100%),
    linear-gradient(180deg, rgba(4,9,15,.55) 0%, transparent 22%, transparent 74%, rgba(4,9,15,.72) 100%);
}

/* ── the scroll-driven stage ────────────────────────────── */
.stage{ position:fixed; inset:0; z-index:0; overflow:hidden; }
.scene{
  position:absolute; inset:0;
  opacity:0; transition:opacity .75s var(--ease);
  will-change:opacity;
}
.scene.is-active{ opacity:1; }
.scene video{
  width:100%; height:100%; object-fit:cover;
  transform:scale(1.06);
  filter:saturate(.95) contrast(1.02) brightness(.88);
}
/* scrim keeps every glass panel legible over the mosaic */
.stage__scrim{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(4,9,15,.70) 0%, rgba(6,14,26,.30) 28%, rgba(6,14,26,.32) 68%, rgba(4,9,15,.76) 100%),
    linear-gradient(100deg, rgba(7,18,36,.60) 0%, rgba(7,18,36,.06) 56%, rgba(7,18,36,.46) 100%);
}

/* ── layout ─────────────────────────────────────────────── */
.shell{
  position:relative; z-index:4;
  width:min(100% - (var(--gut) * 2), var(--shell));
  margin-inline:auto;
}
.chapter{
  position:relative; z-index:4;
  scroll-margin-top:88px;
  padding-block:clamp(6rem,13vh,10.5rem);
  min-height:100svh;
  display:flex; flex-direction:column; justify-content:center;
  /* Scroll runway. Composition is untouched — the margin simply buys
     scroll distance after each section so the mosaic advances slowly.
     Segment durations are cut to match these bands, which is what keeps
     the pace even from the first screen to the last. */
  margin-bottom:var(--runway, 100svh);
}
/* the footer already supplies trailing scroll for the closing scene */
#apply{ --runway:34svh; }
.chapter--hero{ padding-block:clamp(6rem,13vh,8.5rem) clamp(4.5rem,9vh,6rem); }

/* text that sits straight on the video, with no glass beneath it,
   carries its own shadow so the mosaic can never eat it */
.chapter > .shell > .head,
.chapter > .shell > .head *,
.hero__title, .hero__lede, .hero__meta, .scroll-cue, .note{
  text-shadow:0 1px 16px rgba(4,9,15,.72), 0 1px 3px rgba(4,9,15,.5);
}
.glass, .glass *{ text-shadow:none; }

/* ── typography atoms ───────────────────────────────────── */
.eyebrow{
  display:flex; align-items:center; gap:.85rem;
  font-size:.66rem; font-weight:400; letter-spacing:.26em; text-transform:uppercase;
  color:var(--gold-300);
}
.eyebrow__rule{
  width:clamp(28px,5vw,58px); height:1px; flex:none;
  background:linear-gradient(90deg, var(--gold), transparent);
}
.head{ max-width:56ch; margin-bottom:clamp(2.75rem,6vw,4.25rem); }
.head h2, .cta h2{
  margin-top:1.1rem;
  font-size:clamp(2rem,4.4vw,3.3rem);
  font-weight:300;
}
.head h2 em, .cta h2 em, .hero__title em{
  font-style:italic; font-weight:400;
  background:linear-gradient(102deg, var(--gold-100), var(--gold) 42%, var(--gold-600) 78%, var(--gold-300));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.head__sub{ margin-top:1.25rem; color:var(--txt-dim); max-width:50ch; font-size:.98em; }
.head__sub b, .hero__lede b{ color:var(--ivory); font-weight:400; }

/* the chapter numeral, parallaxed */
.numeral{
  position:absolute; top:clamp(1rem,5vh,4rem); right:0;
  font-family:var(--display); font-size:clamp(7rem,20vw,16rem);
  line-height:.72; font-weight:300; letter-spacing:-.04em;
  color:transparent; -webkit-text-stroke:1px rgba(236,208,138,.14);
  pointer-events:none; user-select:none; z-index:-1;
}

/* ── buttons ────────────────────────────────────────────── */
.btn{
  --pad:.95rem 1.9rem;
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  padding:var(--pad); border-radius:2px;
  font-family:var(--sans); font-size:.72rem; font-weight:400; line-height:1;
  letter-spacing:.15em; text-transform:uppercase; text-decoration:none;
  overflow:hidden; isolation:isolate;
  transition:transform .5s var(--ease-out), box-shadow .5s var(--ease-out), color .35s;
}
.btn--sm{ --pad:.66rem 1.3rem; font-size:.65rem; }
.btn span{ position:relative; z-index:2; }
.btn::before{
  content:""; position:absolute; inset:0; z-index:1; transition:transform .55s var(--ease-out);
}
.btn--gold{ color:#20160a; box-shadow:0 14px 34px -16px rgba(201,162,77,.85); }
.btn--gold::before{
  background:linear-gradient(104deg, var(--gold-300), var(--gold) 46%, var(--gold-600) 100%);
}
.btn--gold::after{
  content:""; position:absolute; inset:0; z-index:2;
  background:linear-gradient(104deg, transparent 30%, rgba(255,255,255,.55) 48%, transparent 66%);
  transform:translateX(-120%); transition:transform .8s var(--ease-out);
}
.btn--gold:hover::after{ transform:translateX(120%); }
.btn--glass{
  color:var(--ivory);
  border:1px solid rgba(236,208,138,.28);
  background:rgba(243,235,220,.05);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.btn--glass:hover{ border-color:var(--gold-300); background:rgba(243,235,220,.1); }
.btn:hover{ transform:translateY(-2px); }
.btn:active{ transform:translateY(0); }

/* ── navigation ─────────────────────────────────────────── */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:20;
  display:flex; align-items:center; gap:2rem;
  padding-block:1.35rem;
  padding-inline:max(var(--gut), calc((100% - var(--shell)) / 2));
  transition:padding .5s var(--ease), background .5s var(--ease), backdrop-filter .5s;
  border-bottom:1px solid transparent;
}
.nav.is-stuck{
  padding-block:.8rem;
  background:linear-gradient(180deg, rgba(5,11,22,.86), rgba(5,11,22,.60));
  backdrop-filter:blur(20px) saturate(140%);
  -webkit-backdrop-filter:blur(20px) saturate(140%);
  border-bottom-color:rgba(236,208,138,.14);
}
.brand{ display:flex; align-items:center; gap:.8rem; text-decoration:none; margin-right:auto; }
.brand__mark{ width:34px; color:var(--gold); flex:none; }
.brand__mark svg{ width:100%; }
.brand__text{ display:flex; flex-direction:column; line-height:1.15; }
.brand__text b{
  font-family:var(--display); font-size:1.25rem; font-weight:500;
  letter-spacing:.13em; color:var(--ivory);
}
.brand__text i{
  font-style:normal; font-size:.575rem; letter-spacing:.2em;
  text-transform:uppercase; color:var(--txt-faint);
}
.nav__links{ display:flex; gap:2.1rem; }
.nav__links a{
  position:relative; font-size:.72rem; letter-spacing:.12em;
  text-transform:uppercase; text-decoration:none; color:var(--txt-dim);
  padding-block:.35rem; transition:color .35s;
}
.nav__links a::after{
  content:""; position:absolute; left:0; bottom:0; height:1px; width:100%;
  background:var(--gold); transform:scaleX(0); transform-origin:right;
  transition:transform .45s var(--ease-out);
}
.nav__links a:hover{ color:var(--ivory); }
.nav__links a:hover::after{ transform:scaleX(1); transform-origin:left; }
.nav__toggle{ display:none; }
.nav__cta{ display:none; }   /* mobile menu only — the bar has its own */

/* ── progress rail (the golden road) ────────────────────── */
.rail{
  position:fixed; right:clamp(.9rem,2.2vw,1.9rem); top:50%;
  transform:translateY(-50%); z-index:15;
  display:flex; align-items:center; gap:.85rem;
}
.rail__line{
  position:relative; width:1px; height:min(38vh,290px);
  background:rgba(236,208,138,.16);
}
.rail__line i{
  position:absolute; inset:0 0 auto; height:0;
  background:linear-gradient(180deg, var(--gold-300), var(--gold-600));
  box-shadow:0 0 12px rgba(201,162,77,.6);
  transition:height .18s linear;
}
.rail__dots{
  position:absolute; right:0; top:50%; transform:translateY(-50%);
  display:flex; flex-direction:column; justify-content:space-between;
  height:min(38vh,290px);
}
.rail__dots li{
  display:flex; align-items:center; justify-content:flex-end;
  transform:translateX(-1.35rem);
}
.rail__dots em{
  font-family:var(--display); font-style:normal; font-size:.72rem;
  letter-spacing:.08em; color:var(--txt-faint);
  transition:color .4s, transform .4s var(--ease-out);
}
.rail__dots li.on em{ color:var(--gold-300); transform:scale(1.35); }

/* ── glass system ───────────────────────────────────────── */
.glass{
  position:relative;
  background:var(--glass-bg);
  backdrop-filter:blur(20px) saturate(155%);
  -webkit-backdrop-filter:blur(20px) saturate(155%);
  border:1px solid var(--glass-brd);
  border-radius:3px;
  box-shadow:var(--glass-shadow), inset 0 1px 0 rgba(255,255,255,.16);
  overflow:hidden;
}
/* the tessera sheen inside every panel */
.glass::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(148deg, rgba(255,255,255,.20) 0%, transparent 36%);
  opacity:.9;
}
/* cursor-tracked gold bloom */
.tilt::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%),
             rgba(236,208,138,.16), transparent 66%);
  opacity:0; transition:opacity .45s var(--ease);
}
.tilt:hover::after{ opacity:1; }
.tilt{ transition:transform .55s var(--ease-out), border-color .55s, box-shadow .55s; }
.tilt:hover{
  transform:translateY(-6px);
  border-color:rgba(236,208,138,.36);
  box-shadow:0 40px 90px -34px rgba(0,0,0,.95), inset 0 1px 0 rgba(255,255,255,.24);
}

/* ── grids ──────────────────────────────────────────────── */
.grid{ display:grid; gap:clamp(1.1rem,1.9vw,1.75rem); }
.grid--4{ grid-template-columns:repeat(4,1fr); }
.grid--2{ grid-template-columns:repeat(2,1fr); align-items:start; }

/* ── generic card ───────────────────────────────────────── */
.card{ padding:clamp(1.75rem,2.6vw,2.4rem); }
.card__num{
  display:block; font-family:var(--display); font-size:.85rem;
  letter-spacing:.22em; color:var(--gold); margin-bottom:1.5rem;
}
.card__tag{
  display:inline-block; margin-bottom:1rem; padding:.28rem .7rem;
  border:1px solid rgba(236,208,138,.28); border-radius:99px;
  font-size:.62rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-300);
}
.card h3{ font-size:clamp(1.08rem,1.45vw,1.22rem); margin-bottom:.6rem; color:var(--ivory); }
.card p{ color:var(--txt-dim); font-size:.9em; }
.card p b{ color:var(--ivory); font-weight:400; }
.card--accent{ border-color:rgba(236,208,138,.34); }
.card--accent::after{
  content:""; position:absolute; left:0; top:0; bottom:0; width:2px;
  background:linear-gradient(180deg, var(--gold-300), transparent);
}

/* ── hero ───────────────────────────────────────────────── */
.hero__title{
  margin:clamp(1.5rem,3vw,2.2rem) 0 0;
  font-size:clamp(2.55rem,7vw,6.1rem);
  font-weight:300; line-height:.92; letter-spacing:-.028em;
  color:var(--ivory);
}
.hero__title .line{ display:block; overflow:hidden; padding-bottom:.06em; }
.hero__title .w{
  display:inline-block;
  transform:translateY(105%) rotate(3deg); opacity:0;
  animation:riseWord 1.15s var(--ease-out) forwards;
  animation-delay:calc(var(--i) * 105ms + 140ms);
}
@keyframes riseWord{ to{ transform:none; opacity:1; } }

.hero__lede{
  margin-top:clamp(1.5rem,2.6vw,2rem);
  max-width:44ch; font-size:clamp(1rem,1.05vw,1.12rem);
  color:var(--txt-dim);
}
.hero__actions{ display:flex; flex-wrap:wrap; gap:.9rem; margin-top:clamp(2rem,3.4vw,2.8rem); }

.hero__meta{
  display:flex; flex-wrap:wrap; gap:clamp(1.8rem,5vw,3.6rem);
  margin-top:clamp(2.2rem,4.4vw,3.4rem);
  padding-top:1.5rem; border-top:1px solid rgba(236,208,138,.15);
  max-width:640px;
}
.hero__meta div{ display:flex; flex-direction:column; gap:.15rem; }
.hero__meta b{
  font-family:var(--display); font-size:clamp(1.6rem,2.5vw,2.1rem);
  font-weight:400; line-height:1; color:var(--gold-300);
}
.hero__meta i{
  font-style:normal; font-size:.66rem; letter-spacing:.19em;
  text-transform:uppercase; color:var(--txt-faint);
}

/* scroll invitation — the page is inert until you scroll, so say so */
.scroll-cue{
  position:absolute; bottom:clamp(1.6rem,4vh,2.8rem);
  left:max(var(--gut), calc((100% - var(--shell)) / 2));
  display:flex; align-items:center; gap:.9rem; z-index:4;
}
.scroll-cue__track{
  position:relative; width:1px; height:52px; background:rgba(236,208,138,.22); overflow:hidden;
}
.scroll-cue__track i{
  position:absolute; left:0; width:1px; height:18px; background:var(--gold-300);
  animation:cue 2.3s var(--ease) infinite;
}
@keyframes cue{ 0%{top:-20px} 55%,100%{top:56px} }
.scroll-cue__label{
  font-size:.645rem; letter-spacing:.24em; text-transform:uppercase; color:var(--txt-faint);
}

/* ── school cards ───────────────────────────────────────── */
.school{ padding:clamp(1.85rem,2.7vw,2.5rem); display:flex; flex-direction:column; }
.school__ord{
  font-size:.63rem; letter-spacing:.24em; text-transform:uppercase; color:var(--gold);
}
.school h3{ margin:.55rem 0 1.25rem; font-size:clamp(1.2rem,1.7vw,1.45rem); color:var(--ivory); }
.school ul{ display:flex; flex-direction:column; gap:.05rem; }
.school li{
  padding:.5rem 0 .5rem 1.4rem; position:relative;
  border-top:1px solid rgba(236,228,214,.08);
  color:var(--txt-dim); font-size:.9em;
  transition:color .35s, padding-left .35s var(--ease-out);
}
.school li::before{
  content:""; position:absolute; left:.2rem; top:.95rem;
  width:5px; height:5px; background:var(--gold-600);
  transform:rotate(45deg); transition:background .35s, transform .45s var(--ease-out);
}
.school li:hover{ color:var(--ivory); padding-left:1.75rem; }
.school li:hover::before{ background:var(--gold-300); transform:rotate(135deg); }
.school footer{
  margin-top:1.4rem; padding-top:1.1rem; border-top:1px solid rgba(236,208,138,.18);
  font-size:.66rem; letter-spacing:.24em; text-transform:uppercase; color:var(--gold-300);
}

.note{
  margin-top:2.2rem; font-size:.86rem; color:var(--txt-faint); letter-spacing:.02em;
}
.note a{ color:var(--gold-300); text-underline-offset:3px; }

/* ── requirements split ─────────────────────────────────── */
.split{
  display:grid; grid-template-columns:1.15fr .85fr;
  gap:clamp(1.1rem,2.2vw,1.9rem); align-items:start;
}
.vellum{ padding:clamp(.7rem,1.3vw,1.15rem) clamp(1.6rem,2.6vw,2.4rem); }
.vellum li{
  display:flex; gap:clamp(1rem,2vw,1.6rem);
  padding:clamp(1.1rem,1.7vw,1.4rem) 0;
  border-bottom:1px solid rgba(236,228,214,.09);
}
.vellum li:last-child{ border-bottom:0; }
.vellum__i{
  flex:none; width:2.1rem; padding-top:.15rem;
  font-family:var(--display); font-size:1.02rem; letter-spacing:.1em;
  color:var(--gold); text-transform:lowercase;
}
.vellum h3{ font-size:clamp(1.05rem,1.35vw,1.16rem); color:var(--ivory); margin-bottom:.3rem; }
.vellum p{ color:var(--txt-dim); font-size:.88em; }
.aside-stack{ display:flex; flex-direction:column; gap:clamp(1.1rem,1.9vw,1.75rem); }

/* ── the path ───────────────────────────────────────────── */
.path{ position:relative; display:flex; flex-direction:column; gap:clamp(1.1rem,2vw,1.8rem); }
.path::before{
  content:""; position:absolute; left:23px; top:2.4rem; bottom:2.4rem; width:1px;
  background:linear-gradient(180deg, transparent, rgba(236,208,138,.34) 12%, rgba(236,208,138,.34) 88%, transparent);
}
.path__step{ display:flex; align-items:stretch; gap:clamp(1.1rem,2.2vw,2rem); }
.path__dot{
  position:relative; z-index:2; flex:none;
  width:47px; height:47px; margin-top:1.35rem;
  display:grid; place-items:center;
  background:linear-gradient(140deg, var(--lapis-700), var(--lapis-900));
  border:1px solid rgba(236,208,138,.42);
  transform:rotate(45deg);
  box-shadow:0 0 0 6px rgba(4,9,15,.85);
  transition:border-color .5s, box-shadow .5s;
}
.path__dot b{
  transform:rotate(-45deg);
  font-family:var(--display); font-size:1.12rem; font-weight:500; color:var(--gold-300);
}
.path__step:hover .path__dot{
  border-color:var(--gold-300);
  box-shadow:0 0 0 6px rgba(4,9,15,.85), 0 0 26px rgba(201,162,77,.45);
}
.path__card{
  flex:1; max-width:56rem;
  padding:clamp(1.55rem,2.4vw,2.05rem) clamp(1.7rem,2.6vw,2.3rem);
}
.path__card h3{ font-size:clamp(1.1rem,1.5vw,1.28rem); color:var(--ivory); margin-bottom:.45rem; }
.path__card p{ color:var(--txt-dim); font-size:.9em; }
.path__card a{ color:var(--gold-300); text-underline-offset:3px; }

/* ── closing CTA ────────────────────────────────────────── */
.cta{
  margin-top:clamp(3.5rem,7vw,5.5rem);
  padding:clamp(2.2rem,4.2vw,3.6rem);
  display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,4vw,3.4rem);
  align-items:center;
}
.cta__sub{ margin-top:1.3rem; color:var(--txt-dim); max-width:42ch; }
.contact{ display:flex; flex-direction:column; gap:.15rem; }
.contact li{
  display:flex; flex-direction:column; gap:.2rem;
  padding:1rem 0; border-top:1px solid rgba(236,228,214,.1);
}
.contact i{
  font-style:normal; font-size:.62rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--txt-faint);
}
.contact a{
  font-family:var(--display); font-size:clamp(1.05rem,1.45vw,1.24rem);
  color:var(--ivory); text-decoration:none; transition:color .35s;
}
.contact a:hover{ color:var(--gold-300); }
.contact small{ font-family:var(--sans); font-size:.68rem; color:var(--txt-faint); letter-spacing:.1em; }
.contact__cta{ border-top:0; padding-top:1.4rem; }
.contact__cta .btn{
  width:100%;
  font-family:var(--sans); font-size:.72rem; letter-spacing:.15em;
  color:#20160a;
}

/* ── footer ─────────────────────────────────────────────── */
.foot{
  position:relative; z-index:4;
  padding-block:clamp(3.5rem,7vw,5.5rem) clamp(2.2rem,4vw,3rem);
  background:linear-gradient(180deg, transparent, rgba(4,9,15,.94) 34%);
  border-top:1px solid rgba(236,208,138,.13);
}
.foot__in{ display:grid; gap:2.2rem; }
.foot__brand{ display:flex; flex-direction:column; gap:.45rem; }
.foot__brand b{
  font-family:var(--display); font-size:1.75rem; font-weight:500;
  letter-spacing:.14em; color:var(--ivory);
}
.foot__brand span{ font-family:var(--ka); font-size:.94rem; color:var(--gold-300); }
.foot__brand small{ font-size:.76rem; color:var(--txt-faint); letter-spacing:.04em; }
.foot__nav{ display:flex; flex-wrap:wrap; gap:1.6rem; }
.foot__nav a{
  font-size:.72rem; letter-spacing:.17em; text-transform:uppercase;
  text-decoration:none; color:var(--txt-dim); transition:color .35s;
}
.foot__nav a:hover{ color:var(--gold-300); }
.foot__note{
  padding-top:1.6rem; border-top:1px solid rgba(236,228,214,.09);
  font-size:.76rem; color:var(--txt-faint); max-width:70ch;
}

/* ── scroll reveals ─────────────────────────────────────── */
.reveal, .stagger > *{
  opacity:0; transform:translateY(26px);
  transition:opacity .95s var(--ease-out), transform .95s var(--ease-out);
  transition-delay:var(--rd, 0ms);
}
.reveal.in, .stagger.in > *{ opacity:1; transform:none; }
.chapter--hero .reveal{ transform:translateY(18px); }

/* ── responsive ─────────────────────────────────────────── */
@media (max-width:1080px){
  .grid--4{ grid-template-columns:repeat(2,1fr); }
  .split{ grid-template-columns:1fr; }
  .cta{ grid-template-columns:1fr; }
  .rail{ display:none; }
}
@media (max-width:820px){
  .nav__links{
    position:fixed; inset:0 0 auto; top:0; padding:6.5rem var(--gut) 2.6rem;
    flex-direction:column; gap:1.5rem;
    background:linear-gradient(180deg, rgba(5,11,22,.97), rgba(5,11,22,.93));
    backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
    border-bottom:1px solid rgba(236,208,138,.16);
    transform:translateY(-102%); transition:transform .6s var(--ease-out);
  }
  .nav.is-open .nav__links{ transform:none; }
  .nav__links a{ font-size:1.05rem; letter-spacing:.14em; }
  .nav > .btn--sm{ display:none; }
  .nav__cta{ display:inline-flex; margin-top:.6rem; align-self:flex-start; }
  .nav__toggle{
    display:flex; flex-direction:column; justify-content:center; gap:6px;
    width:42px; height:42px; padding:0 8px;
    background:none; border:1px solid rgba(236,208,138,.28); border-radius:2px;
    cursor:pointer; z-index:22;
  }
  .nav__toggle span{
    display:block; height:1px; width:100%; background:var(--gold-300);
    transition:transform .45s var(--ease-out), opacity .3s;
  }
  .nav.is-open .nav__toggle span:first-child{ transform:translateY(3.5px) rotate(45deg); }
  .nav.is-open .nav__toggle span:last-child{ transform:translateY(-3.5px) rotate(-45deg); }
}
@media (max-width:680px){
  .grid--4,.grid--2{ grid-template-columns:1fr; }
  .numeral{ font-size:clamp(7rem,34vw,12rem); opacity:.7; }
  .scroll-cue__label{ display:none; }
  .path::before{ left:18px; }
  .path__dot{ width:37px; height:37px; }
  .path__dot b{ font-size:.95rem; }
  .hero__meta{
    display:grid; grid-template-columns:repeat(3,1fr);
    gap:1rem; margin-top:1.9rem; padding-top:1.3rem;
  }
  .hero__meta b{ font-size:1.55rem; }
  .hero__meta i{ font-size:.55rem; letter-spacing:.14em; }
  .hero__lede{ font-size:1rem; }
  .chapter--hero{ padding-block:5.5rem 3.4rem; }
  .btn{ --pad:.95rem 1.6rem; font-size:.72rem; }
}

/* ── reduced motion: freeze the stage, keep the page ────── */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  .reveal,.stagger > *{ opacity:1 !important; transform:none !important; transition:none !important; }
  .hero__title .w{ animation:none; opacity:1; transform:none; }
  .scroll-cue__track i{ animation:none; top:16px; }
  .scene{ transition:none; }
  .tilt:hover{ transform:none; }
}