/* =====================================================================
   TIER1 MARKETER — assets/css/elevate.css
   The elevation layer. Everything here is NEW craft added on top of the
   approved V3 Heavyweight system in site.css. Same tokens, same palette,
   same type stack. Nothing here changes the brand; it raises the build.

   Contents
     A · intro curtain            H · sticky card stack
     B · custom cursor            I · pinned horizontal track
     C · page wipe transition     J · ledger / data visuals
     D · mobile nav drawer        K · pull quote + beam divider
     E · hero canvas field        L · contact form
     F · char-split headlines     M · prose (legal) + 404
     G · card spotlight           N · oversized footer mark
     Z · reduced motion
   ===================================================================== */

/* =====================================================
   A · INTRO CURTAIN  (once per session)
===================================================== */
.intro{
  position:fixed; inset:0; z-index:2000;
  display:flex; align-items:center; justify-content:center;
  background:var(--bg);
  transition:opacity .6s ease, visibility .6s ease;
}
.intro__inner{
  display:flex; flex-direction:column; align-items:center; gap:22px;
  transform:translateY(0);
  transition:transform .7s cubic-bezier(.7,0,.2,1), opacity .45s ease;
}
.intro__mark{
  width:44px; height:60px;
  opacity:0;
  transform:translateY(14px);
  animation:intro-mark .9s cubic-bezier(.22,1,.36,1) .1s forwards;
}
@keyframes intro-mark{ to{ opacity:1; transform:translateY(0); } }
.intro__rule{
  width:min(280px, 52vw); height:1px;
  background:var(--hairline);
  position:relative; overflow:hidden;
}
.intro__rule::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(90deg, var(--accent), #f0cf8e);
  transform:scaleX(0); transform-origin:0 50%;
  animation:intro-rule 1.15s cubic-bezier(.65,0,.35,1) .25s forwards;
}
@keyframes intro-rule{ to{ transform:scaleX(1); } }
.intro__word{
  font-family:var(--mono);
  font-size:.68rem; letter-spacing:.34em; text-transform:uppercase;
  color:var(--ink-faint);
  opacity:0;
  animation:intro-word .7s ease .45s forwards;
}
@keyframes intro-word{ to{ opacity:1; } }
.intro.is-out{ opacity:0; visibility:hidden; pointer-events:none; }
.intro.is-out .intro__inner{ transform:translateY(-18px); opacity:0; }
body.intro-lock{ overflow:hidden; }

/* =====================================================
   B · CUSTOM CURSOR  (fine pointers only)
===================================================== */
.cursor,
.cursor-dot{
  position:fixed; top:0; left:0;
  z-index:1900;
  pointer-events:none;
  border-radius:50%;
  opacity:0;
  transition:opacity .3s ease;
  will-change:transform;
}
.cursor{
  width:34px; height:34px;
  margin:-17px 0 0 -17px;
  border:1px solid var(--accent-dim);
  transition:opacity .3s ease, width .28s cubic-bezier(.22,1,.36,1),
             height .28s cubic-bezier(.22,1,.36,1),
             margin .28s cubic-bezier(.22,1,.36,1),
             background-color .28s ease, border-color .28s ease;
}
.cursor-dot{
  width:4px; height:4px;
  margin:-2px 0 0 -2px;
  background:var(--accent);
}
body.cursor-on .cursor,
body.cursor-on .cursor-dot{ opacity:1; }
body.cursor-on.cursor-hot .cursor{
  width:62px; height:62px; margin:-31px 0 0 -31px;
  background:var(--accent-glow);
  border-color:var(--accent);
}
body.cursor-on.cursor-hot .cursor-dot{ opacity:0; }
.cursor__label{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--mono); font-size:.52rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--accent);
  opacity:0; transition:opacity .2s ease;
}
body.cursor-hot .cursor__label{ opacity:1; }
@media (hover:none), (pointer:coarse){ .cursor, .cursor-dot{ display:none; } }

/* =====================================================
   C · PAGE WIPE TRANSITION
===================================================== */
.wipe{
  position:fixed; inset:0; z-index:1800;
  pointer-events:none;
  background:var(--bg);
  transform:scaleY(0); transform-origin:0 100%;
  transition:transform .5s cubic-bezier(.7,0,.3,1);
}
.wipe::after{
  content:"";
  position:absolute; left:0; right:0; top:0; height:1px;
  background:linear-gradient(90deg, transparent, var(--accent), transparent);
  opacity:0; transition:opacity .3s ease;
}
body.is-leaving .wipe{ transform:scaleY(1); transform-origin:0 100%; }
body.is-leaving .wipe::after{ opacity:1; }

/* =====================================================
   D · MOBILE NAV DRAWER
===================================================== */
.nav__toggle{
  display:none;
  position:relative;
  width:42px; height:42px;
  background:none; border:1px solid var(--hairline-hi);
  cursor:pointer;
  flex:none;
}
.nav__toggle span{
  position:absolute; left:11px; right:11px; height:1px;
  background:var(--ink);
  transition:transform .34s cubic-bezier(.22,1,.36,1), opacity .2s ease;
}
.nav__toggle span:nth-child(1){ top:16px; }
.nav__toggle span:nth-child(2){ top:21px; }
.nav__toggle span:nth-child(3){ top:26px; }
body.menu-open .nav__toggle span:nth-child(1){ transform:translateY(5px) rotate(45deg); }
body.menu-open .nav__toggle span:nth-child(2){ opacity:0; }
body.menu-open .nav__toggle span:nth-child(3){ transform:translateY(-5px) rotate(-45deg); }

.drawer{
  position:fixed; inset:0; z-index:1500;
  background:var(--bg);
  display:flex; flex-direction:column; justify-content:center;
  padding:var(--pad);
  clip-path:inset(0 0 100% 0);
  transition:clip-path .6s cubic-bezier(.7,0,.2,1);
  visibility:hidden;
}
body.menu-open .drawer{ clip-path:inset(0 0 0 0); visibility:visible; }
.drawer__aurora{
  position:absolute; left:-10%; bottom:-20%;
  width:80vw; height:60vh;
  background:radial-gradient(50% 50% at 50% 50%, var(--accent-glow), transparent 70%);
  filter:blur(50px);
  pointer-events:none;
}
.drawer__links{ list-style:none; position:relative; z-index:2; }
.drawer__links li{
  overflow:hidden;
  border-bottom:1px solid var(--hairline);
}
.drawer__links a{
  display:flex; align-items:baseline; gap:18px;
  padding:clamp(14px, 2.6vh, 22px) 0;
  font-weight:700;
  font-size:clamp(2rem, 9vw, 3.4rem);
  letter-spacing:-.03em;
  line-height:1;
  color:var(--ink);
  text-decoration:none;
  transform:translateY(110%);
  transition:transform .6s cubic-bezier(.22,1,.36,1), color .25s ease;
  transition-delay:var(--dd, 0ms);
}
body.menu-open .drawer__links a{ transform:translateY(0); }
.drawer__links a:hover{ color:var(--accent); }
.drawer__links .n{
  font-family:var(--mono);
  font-size:.7rem; font-weight:500; letter-spacing:.2em;
  color:var(--accent);
  flex:none;
}
.drawer__foot{
  position:relative; z-index:2;
  margin-top:clamp(28px, 5vh, 52px);
  display:flex; flex-wrap:wrap; align-items:center; gap:18px 28px;
  font-family:var(--mono); font-size:.7rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--ink-faint);
}
.drawer__foot a{ color:var(--ink-dim); text-decoration:none; }
.drawer__foot a:hover{ color:var(--accent); }
body.menu-open{ overflow:hidden; }
@media (max-width:980px){ .nav__toggle{ display:block; } }
@media (min-width:981px){ .drawer{ display:none; } }

/* =====================================================
   E · HERO CANVAS FIELD  (spend-signal grid)
===================================================== */
.hero__canvas{
  position:absolute; inset:0;
  z-index:0;
  width:100%; height:100%;
  opacity:0;
  transition:opacity 1.6s ease .3s;
  pointer-events:none;
}
.hero.is-lit .hero__canvas{ opacity:.85; }

/* hairline architectural grid behind the hero */
.hero__grid{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(90deg, rgba(244,247,248,.045) 1px, transparent 1px),
    linear-gradient(rgba(244,247,248,.028) 1px, transparent 1px);
  background-size:clamp(80px, 9vw, 140px) 100%, 100% clamp(80px, 9vw, 140px);
  -webkit-mask-image:radial-gradient(120% 90% at 50% 40%, #000 25%, transparent 78%);
  mask-image:radial-gradient(120% 90% at 50% 40%, #000 25%, transparent 78%);
}

/* =====================================================
   F · CHAR / LINE SPLIT HEADLINES
===================================================== */
.chars{ display:inline-block; }
.chars .ch{
  display:inline-block;
  opacity:0;
  transform:translateY(.5em) rotate(2deg);
  transition:opacity .5s ease, transform .7s cubic-bezier(.22,1,.36,1);
  transition-delay:var(--cd, 0ms);
}
.chars.is-in .ch{ opacity:1; transform:translateY(0) rotate(0); }

/* gold underline that draws under a phrase on reveal */
.draw{
  position:relative;
  display:inline-block;
}
.draw::after{
  content:"";
  position:absolute; left:0; right:0; bottom:-.12em;
  height:2px; background:var(--accent);
  transform:scaleX(0); transform-origin:0 50%;
  transition:transform .9s cubic-bezier(.22,1,.36,1) .25s;
}
.reveal.in-view .draw::after,
.draw.in-view::after{ transform:scaleX(1); }

/* =====================================================
   G · CARD SPOTLIGHT  (cursor-follow radial)
===================================================== */
.spot{ position:relative; isolation:isolate; }
.spot::before{
  content:"";
  position:absolute; inset:0;
  z-index:0;
  pointer-events:none;
  opacity:0;
  transition:opacity .35s ease;
  background:radial-gradient(360px circle at var(--mx,50%) var(--my,50%),
             rgba(212,169,85,.13), transparent 62%);
}
.spot:hover::before{ opacity:1; }
.spot > *{ position:relative; z-index:1; }

/* =====================================================
   H · STICKY CARD STACK
===================================================== */
.stack{
  position:relative;
  display:flex; flex-direction:column;
  gap:clamp(18px, 3vw, 32px);
}
.stack__card{
  position:sticky;
  top:calc(var(--nav-h) + clamp(16px, 4vh, 56px));
  background:var(--bg-alt);
  border:1px solid var(--hairline);
  padding:clamp(28px, 4vw, 56px);
  overflow:hidden;
  transition:border-color .3s ease;
}
.stack__card:hover{ border-color:var(--hairline-hi); }
.stack__card::after{
  content:"";
  position:absolute; left:0; top:0; height:2px; width:100%;
  background:linear-gradient(90deg, var(--accent), transparent);
  transform:scaleX(0); transform-origin:0 50%;
  transition:transform .9s cubic-bezier(.22,1,.36,1);
}
.stack__card.in-view::after{ transform:scaleX(1); }
.stack__head{
  display:flex; align-items:baseline; justify-content:space-between;
  gap:24px; flex-wrap:wrap;
  padding-bottom:clamp(16px, 2vw, 24px);
  border-bottom:1px solid var(--hairline);
}
.stack__num{
  font-family:var(--mono); font-size:.68rem; font-weight:500;
  letter-spacing:.28em; color:var(--accent);
}
.stack__title{
  font-weight:700;
  font-size:clamp(1.7rem, 3.6vw, 2.9rem);
  letter-spacing:-.03em; line-height:1.02;
}
.stack__body{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:clamp(24px, 4vw, 64px);
  padding-top:clamp(22px, 3vw, 34px);
}
@media(max-width:860px){ .stack__body{ grid-template-columns:1fr; gap:28px; } }
.stack__copy{ color:var(--ink-dim); font-size:clamp(.95rem,1.3vw,1.08rem); line-height:1.7; }
.stack__list{ list-style:none; }
.stack__list li{
  display:flex; gap:14px;
  padding:11px 0;
  border-bottom:1px solid var(--hairline);
  font-family:var(--mono); font-size:clamp(.68rem,1vw,.78rem);
  letter-spacing:.06em; text-transform:uppercase; color:var(--ink-dim);
}
.stack__list li::before{
  content:"";
  flex:none; width:6px; height:6px; margin-top:.45em;
  background:var(--accent);
  transform:rotate(45deg);
}

/* =====================================================
   I · PINNED HORIZONTAL TRACK
===================================================== */
.pin{ position:relative; }
.pin__sticky{
  position:sticky;
  top:0;
  height:100svh;
  display:flex; flex-direction:column; justify-content:center;
  overflow:hidden;
}
.pin__rail{
  display:flex;
  gap:clamp(20px, 3vw, 40px);
  padding-left:var(--pad);
  padding-right:var(--pad);
  will-change:transform;
}

/* fixed window the rail slides behind: panels dissolve at the edges instead
   of being guillotined by the viewport */
.pin__viewport{
  position:relative;
  overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 var(--pad),
                     #000 calc(100% - var(--pad)), transparent 100%);
  mask-image:linear-gradient(90deg, transparent 0, #000 var(--pad),
             #000 calc(100% - var(--pad)), transparent 100%);
}
.pin__panel{
  flex:none;
  width:min(460px, 78vw);
  border:1px solid var(--hairline);
  background:var(--bg-alt);
  padding:clamp(26px, 3vw, 42px);
  display:flex; flex-direction:column; gap:18px;
  position:relative;
  overflow:hidden;
}
.pin__panel::before{
  content:"";
  position:absolute; left:0; top:0; bottom:0; width:2px;
  background:linear-gradient(180deg, var(--accent), transparent);
}
.pin__step{
  font-family:var(--mono); font-size:.66rem; font-weight:500;
  letter-spacing:.28em; color:var(--accent);
}
.pin__panel h3{
  font-weight:700; font-size:clamp(1.35rem, 2.4vw, 1.85rem);
  letter-spacing:-.02em; line-height:1.1;
}
.pin__panel p{ color:var(--ink-dim); font-size:.95rem; line-height:1.7; }
.pin__out{
  margin-top:auto;
  padding-top:16px;
  border-top:1px solid var(--hairline);
  font-family:var(--mono); font-size:.66rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--ink-faint);
}
.pin__out b{ color:var(--ink); font-weight:500; }
.pin__bar{
  position:absolute; left:var(--pad); right:var(--pad); bottom:clamp(24px, 5vh, 56px);
  height:1px; background:var(--hairline);
}
.pin__bar i{
  position:absolute; left:0; top:-1px; height:3px; width:100%;
  background:var(--accent);
  transform:scaleX(0); transform-origin:0 50%;
}
.pin__hint{
  position:absolute; right:var(--pad); bottom:calc(clamp(24px, 5vh, 56px) + 14px);
  font-family:var(--mono); font-size:.62rem; letter-spacing:.2em;
  text-transform:uppercase; color:var(--ink-faint);
}
/* fallback: on small screens the track becomes a normal swipe row */
@media(max-width:820px){
  .pin{ height:auto !important; }
  .pin__sticky{ position:static; height:auto; padding:clamp(40px,8vw,72px) 0; }
  .pin__viewport{ overflow:visible; -webkit-mask-image:none; mask-image:none; }
  .pin__rail{
    transform:none !important;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
  }
  .pin__panel{ scroll-snap-align:start; width:min(340px, 84vw); }
  .pin__bar, .pin__hint{ display:none; }
}

/* =====================================================
   J · LEDGER / DATA VISUALS
===================================================== */
.ledger{
  border:1px solid var(--hairline);
  background:var(--bg-alt);
}
.ledger__row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center; gap:20px;
  padding:clamp(14px, 1.8vw, 20px) clamp(16px, 2.2vw, 26px);
  border-bottom:1px solid var(--hairline);
}
.ledger__row:last-child{ border-bottom:none; }
.ledger__row--head{
  background:rgba(244,247,248,.02);
  font-family:var(--mono); font-size:.62rem; letter-spacing:.24em;
  text-transform:uppercase; color:var(--ink-faint);
}
.ledger__label{
  font-family:var(--mono); font-size:clamp(.68rem,1vw,.76rem);
  letter-spacing:.08em; text-transform:uppercase; color:var(--ink-dim);
}
.ledger__meter{
  grid-column:1 / -1;
  height:6px; background:rgba(244,247,248,.06);
  position:relative; overflow:hidden;
}
.ledger__meter i{
  position:absolute; inset:0 auto 0 0;
  width:var(--w, 0%);
  background:var(--accent);
  transform:scaleX(0); transform-origin:0 50%;
  transition:transform 1s cubic-bezier(.22,1,.36,1);
  transition-delay:var(--sd, 0ms);
}
.ledger.in-view .ledger__meter i{ transform:scaleX(1); }
.ledger__val{
  font-family:var(--mono); font-size:clamp(.8rem,1.3vw,1rem);
  color:var(--ink); font-weight:500; letter-spacing:.02em;
}
.ledger__val--accent{ color:var(--accent); }

/* number ticker band */
.ticker{
  border-top:1px solid var(--hairline);
  border-bottom:1px solid var(--hairline);
  overflow:hidden;
  padding:clamp(14px, 2vw, 22px) 0;
  background:var(--bg);
}
.ticker__track{
  display:flex; width:max-content;
  animation:tick 42s linear infinite;
}
.ticker:hover .ticker__track{ animation-play-state:paused; }
.ticker__item{
  display:flex; align-items:center; gap:14px;
  padding:0 clamp(22px, 3.4vw, 48px);
  font-family:var(--mono); font-size:clamp(.68rem, 1vw, .8rem);
  letter-spacing:.16em; text-transform:uppercase;
  color:var(--ink-faint);
  white-space:nowrap;
}
.ticker__item b{ color:var(--ink); font-weight:500; }
.ticker__item::after{
  content:""; width:5px; height:5px; background:var(--accent-dim);
  transform:rotate(45deg); flex:none;
}
@keyframes tick{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* =====================================================
   K · PULL QUOTE + BEAM DIVIDER
===================================================== */
.beam{
  position:relative; height:1px;
  background:var(--hairline);
  overflow:visible;
}
.beam::after{
  content:"";
  position:absolute; left:0; top:-1px; height:3px; width:34%;
  background:linear-gradient(90deg, transparent, var(--accent), transparent);
  filter:blur(.4px);
  animation:beam-run 7s ease-in-out infinite;
}
@keyframes beam-run{
  0%,100%{ transform:translateX(-20%); opacity:.15; }
  50%{ transform:translateX(220%); opacity:.85; }
}

.pull{
  position:relative;
  padding-left:clamp(20px, 3vw, 40px);
  border-left:2px solid var(--accent);
  max-width:60ch;
}
.pull p{
  font-family:var(--serif);
  font-style:italic;
  font-weight:500;
  font-size:clamp(1.35rem, 3vw, 2.1rem);
  line-height:1.28;
  letter-spacing:-.01em;
  color:var(--ink);
}
.pull cite{
  display:block;
  margin-top:16px;
  font-family:var(--mono); font-style:normal;
  font-size:.68rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--ink-faint);
}

/* =====================================================
   L · CONTACT FORM
===================================================== */
.form-wrap{
  display:grid;
  grid-template-columns:1fr .85fr;
  gap:clamp(32px, 5vw, 84px);
  align-items:start;
}
@media(max-width:900px){ .form-wrap{ grid-template-columns:1fr; gap:44px; } }
.form{ display:flex; flex-direction:column; gap:clamp(18px, 2.4vw, 26px); }
.field{ position:relative; display:flex; flex-direction:column; gap:9px; }
.field > label{
  font-family:var(--mono); font-size:.64rem; font-weight:500;
  letter-spacing:.22em; text-transform:uppercase; color:var(--ink-faint);
}
.field input,
.field select,
.field textarea{
  font-family:var(--sans);
  font-size:1rem;
  color:var(--ink);
  background:transparent;
  border:none;
  border-bottom:1px solid var(--hairline-hi);
  padding:12px 2px;
  width:100%;
  transition:border-color .25s ease;
  border-radius:0;
  -webkit-appearance:none; appearance:none;
}
.field select{
  background-image:linear-gradient(45deg, transparent 50%, var(--accent) 50%),
                   linear-gradient(135deg, var(--accent) 50%, transparent 50%);
  background-position:calc(100% - 14px) calc(1em + 4px), calc(100% - 9px) calc(1em + 4px);
  background-size:5px 5px, 5px 5px;
  background-repeat:no-repeat;
  padding-right:32px;
  cursor:pointer;
}
.field select option{ background:var(--bg-alt); color:var(--ink); }
.field textarea{ resize:vertical; min-height:120px; line-height:1.6; }
.field input:focus,
.field select:focus,
.field textarea:focus{ outline:none; border-bottom-color:var(--accent); }
.field input::placeholder,
.field textarea::placeholder{ color:rgba(244,247,248,.28); }
.field__hint{
  font-family:var(--mono); font-size:.62rem; letter-spacing:.1em;
  color:var(--ink-faint);
}
.form__row{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(18px,2.4vw,26px); }
@media(max-width:620px){ .form__row{ grid-template-columns:1fr; } }
.form__submit{ margin-top:6px; display:flex; align-items:center; gap:20px; flex-wrap:wrap; }
.form__note{
  font-family:var(--mono); font-size:.64rem; letter-spacing:.1em;
  color:var(--ink-faint); max-width:34ch; line-height:1.7;
}
.form__aside{
  border:1px solid var(--hairline);
  background:var(--bg-alt);
  padding:clamp(24px, 3vw, 38px);
  display:flex; flex-direction:column; gap:22px;
}
.form__aside h3{
  font-weight:700; font-size:1.15rem; letter-spacing:-.02em;
}
.form__aside dl{ display:flex; flex-direction:column; gap:16px; }
.form__aside dt{
  font-family:var(--mono); font-size:.62rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--accent); margin-bottom:5px;
}
.form__aside dd{ color:var(--ink-dim); font-size:.92rem; line-height:1.65; }
.form__aside a{ color:var(--ink); text-decoration:none; border-bottom:1px solid var(--accent-dim); }
.form__aside a:hover{ color:var(--accent); }

/* =====================================================
   M · PROSE (legal pages) + 404
===================================================== */
.prose{
  max-width:74ch;
  padding-top:clamp(40px, 6vw, 72px);
  padding-bottom:clamp(64px, 9vw, 120px);
}
.prose h2{
  font-size:clamp(1.4rem, 2.6vw, 1.9rem);
  letter-spacing:-.02em;
  margin:clamp(38px, 5vw, 60px) 0 14px;
  padding-top:clamp(24px, 3vw, 34px);
  border-top:1px solid var(--hairline);
}
.prose h2:first-of-type{ margin-top:0; border-top:none; padding-top:0; }
.prose h3{
  font-size:1.02rem; font-weight:600; letter-spacing:-.01em;
  margin:26px 0 8px; color:var(--ink);
}
.prose p{ color:var(--ink-dim); line-height:1.78; margin-bottom:16px; }
.prose ul{ margin:0 0 18px 0; padding-left:20px; }
.prose li{ color:var(--ink-dim); line-height:1.78; margin-bottom:8px; }
.prose a{ color:var(--ink); border-bottom:1px solid var(--accent-dim); text-decoration:none; }
.prose a:hover{ color:var(--accent); }
.prose__meta{
  font-family:var(--mono); font-size:.66rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--ink-faint);
  padding-bottom:clamp(28px, 4vw, 44px);
  border-bottom:1px solid var(--hairline);
  margin-bottom:clamp(34px, 5vw, 54px);
}

.err{
  min-height:calc(100svh - var(--nav-h));
  display:flex; flex-direction:column; justify-content:center;
  position:relative; overflow:hidden;
}
.err__code{
  position:absolute; right:-2vw; top:50%;
  transform:translateY(-50%);
  font-weight:700; font-size:clamp(12rem, 34vw, 32rem);
  line-height:.8; letter-spacing:-.06em;
  color:transparent;
  -webkit-text-stroke:1px rgba(244,247,248,.06);
  pointer-events:none; user-select:none;
}
.err__inner{ position:relative; z-index:2; display:flex; flex-direction:column; gap:clamp(22px,3vw,34px); }
.err__links{
  display:flex; flex-wrap:wrap; gap:0;
  border-top:1px solid var(--hairline);
  max-width:640px;
}
.err__links a{
  flex:1 1 200px;
  padding:20px 4px;
  border-bottom:1px solid var(--hairline);
  font-family:var(--mono); font-size:.72rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--ink-dim); text-decoration:none;
  transition:color .2s ease, padding-left .3s cubic-bezier(.22,1,.36,1);
}
.err__links a:hover{ color:var(--accent); padding-left:14px; }

/* =====================================================
   N · OVERSIZED FOOTER MARK + LIVE CLOCK
===================================================== */
.bigmark{
  position:relative;
  padding-top:clamp(36px, 5vw, 64px);
  overflow:hidden;
  line-height:.78;
  user-select:none;
}
.bigmark svg{ display:block; width:100%; height:auto; }
.bigmark .fill{ fill:rgba(244,247,248,.045); }
.bigmark .stroke{ fill:none; stroke:rgba(244,247,248,.10); stroke-width:1; }
.footer-meta{
  display:flex; flex-wrap:wrap; gap:12px 32px;
  padding:clamp(20px,2.6vw,28px) 0;
  border-top:1px solid var(--hairline);
  font-family:var(--mono); font-size:.64rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--ink-faint);
}
.footer-meta .dot{
  display:inline-block; width:6px; height:6px; border-radius:50%;
  background:var(--accent); margin-right:9px;
  box-shadow:0 0 0 0 var(--accent-glow);
  animation:pulse 2.6s ease-out infinite;
}
@keyframes pulse{
  0%{ box-shadow:0 0 0 0 rgba(212,169,85,.5); }
  70%{ box-shadow:0 0 0 9px rgba(212,169,85,0); }
  100%{ box-shadow:0 0 0 0 rgba(212,169,85,0); }
}

/* =====================================================
   misc utilities used by the new pages
===================================================== */
.section{
  position:relative;
  padding-top:clamp(72px, 11vw, 150px);
  padding-bottom:clamp(72px, 11vw, 150px);
}
.section--alt{ background:var(--bg-alt); border-top:1px solid var(--hairline); }
.section--tight{ padding-top:clamp(52px, 7vw, 96px); padding-bottom:clamp(52px, 7vw, 96px); }
.grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,64px); }
.grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,2.6vw,36px); }
@media(max-width:900px){ .grid-2{ grid-template-columns:1fr; } .grid-3{ grid-template-columns:1fr; } }
.lede{
  font-size:clamp(1.05rem, 1.8vw, 1.35rem);
  line-height:1.62;
  color:var(--ink-dim);
  max-width:56ch;
}
.lede em{ font-family:var(--serif); font-style:italic; color:var(--accent); }
.mono-note{
  font-family:var(--mono); font-size:.66rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--ink-faint);
}
.fact{
  border-top:1px solid var(--hairline);
  padding-top:18px;
  display:flex; flex-direction:column; gap:6px;
}
.fact b{
  font-weight:700; font-size:clamp(1.6rem, 3vw, 2.4rem);
  letter-spacing:-.03em; color:var(--ink);
}
.fact b .u{ color:var(--accent); }
.fact span{
  font-family:var(--mono); font-size:.64rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--ink-faint);
}

/* =====================================================
   Z · REDUCED MOTION
===================================================== */
@media (prefers-reduced-motion: reduce){
  .intro{ display:none; }
  .cursor, .cursor-dot{ display:none; }
  .wipe{ display:none; }
  .beam::after{ animation:none; opacity:.6; }
  .ticker__track{ animation:none; }
  .chars .ch{ opacity:1 !important; transform:none !important; }
  .draw::after{ transform:scaleX(1) !important; }
  .ledger__meter i{ transform:scaleX(1) !important; }
  .stack__card{ position:static; }
  .stack__card::after{ transform:scaleX(1) !important; }
  .pin__sticky{ position:static; height:auto; padding:48px 0; }
  .pin__viewport{ overflow:visible; -webkit-mask-image:none; mask-image:none; }
  .pin__rail{ transform:none !important; overflow-x:auto; }
  .footer-meta .dot{ animation:none; }
  .drawer{ transition:none; }
  .drawer__links a{ transform:none !important; }
}

/* =====================================================
   late additions used by the built pages
===================================================== */
.nav__end{ display:flex; align-items:center; gap:12px; flex:none; }

/* inline booking calendar (contact page) */
.calendar-frame{
  border:1px solid var(--hairline);
  background:var(--bg-alt);
  overflow:hidden;
}
.calendar-frame__head{
  display:flex; align-items:center; justify-content:space-between;
  gap:16px;
  padding:14px clamp(16px,2vw,22px);
  border-bottom:1px solid var(--hairline);
}
.calendar-frame__body{
  position:relative;
  display:flex; flex-direction:column; align-items:stretch; justify-content:center;
}
.calendar-frame__fallback{ padding:40px; text-align:center; }
.calendar-frame__iframe{
  display:block;
  width:100%;
  min-height:690px;
  border:0;
  opacity:0;
  transition:opacity .45s ease;
}
.calendar-frame.is-loaded .calendar-frame__fallback,
#cal-mount.is-loaded .calendar-frame__fallback{ display:none; }
#cal-mount.is-loaded .calendar-frame__iframe{ opacity:1; }
@media(max-width:600px){ .calendar-frame__body{ min-height:640px; } }

/* form success banner */
.form-status{
  border:1px solid var(--accent-dim);
  background:rgba(212,169,85,.07);
  padding:clamp(18px,2.4vw,26px) clamp(20px,2.6vw,30px);
  margin-bottom:clamp(28px,4vw,44px);
}
.form-status p{ color:var(--ink-dim); font-size:.95rem; line-height:1.6; }
.form-status strong{ color:var(--accent); }

/* the pinned track sits on the alt background */
.pin.section--alt{ background:var(--bg-alt); border-top:1px solid var(--hairline); }

/* =====================================================
   fixes found in QA
===================================================== */
/* lightbox: give the stage an explicit width so flex centring is stable
   (shrink-to-fit + percentage max-width on the image left it left-aligned) */
.lightbox__stage{ width:min(1200px, 94vw); margin:0 auto; }
.lightbox__imgwrap{ width:100%; }
.lightbox__img{ width:auto; max-width:100%; max-height:80vh; object-fit:contain; margin:0 auto; }

/* five nav links plus a CTA need more room than the original three */
@media (max-width:1120px){
  .nav__links{ display:none; }
  .nav__toggle{ display:block; }
}
@media (min-width:1121px){
  .nav__links{ display:flex; }
  .nav__toggle{ display:none; }
  .drawer{ display:none; }
}

/* the inline calendar: let the GHL embed script size its own iframe, the same
   way it does inside the booking modal, so no white gutter is left underneath */
.calendar-frame__body{ background:var(--bg-alt); }
.calendar-frame__body:not(.is-loaded){ min-height:690px; }
@media(max-width:600px){ .calendar-frame__iframe{ min-height:78vh; } }

/* the drawer must not bury its own close button */
body.menu-open .nav{
  z-index:1600;
  background:transparent;
  border-bottom-color:transparent;
  transform:none !important;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}
body.menu-open .nav .btn--nav{ opacity:0; pointer-events:none; }
.drawer{ padding-top:calc(var(--nav-h) + 24px); }

/* =====================================================
   sticky repair
   The base system guards against horizontal overflow with
   `html,body{ overflow-x:hidden }`. That makes the body a scroll
   container, which silently kills every `position:sticky` on the
   page: the pinned Method track and the Services card stack both
   scrolled straight past instead of pinning. `overflow-x:clip`
   does the same visual job WITHOUT creating a scroll container,
   so sticky works again. Hidden stays as the fallback.
===================================================== */
@supports (overflow-x: clip){
  html, body{ overflow-x:clip; }
}