/* ═══════════════════════════════════════════════════════════════
   TIER 1 TACTICAL — APPLE-GRADE VARIANT
   Same markup, same words. Pure black stage, #1d1d1f panels,
   silver-blue gradient keywords, SF-style type, pill buttons.
   ═══════════════════════════════════════════════════════════════ */

:root{
  --void:#000; --ink:#000; --ink-2:#161617; --ink-3:#1d1d1f;
  --wine-dk:#000; --wine:#0a0a0b; --wine-lt:#111112;

  --brass:#a1a1a6;           /* legacy accent slots → neutral gray */
  --brass-hi:#f5f5f7;
  --brass-lo:#424245;
  --copper:#a1a1a6; --amber:#a1a1a6;

  --bone:#f5f5f7; --bone-2:#e8e8ed; --bone-3:#d2d2d7;

  --tx:#f5f5f7; --tx-2:#a1a1a6; --tx-3:#86868b;
  --line:#1d1d1f; --line-2:#2c2c2e;

  --blue:#2997ff; --blue-fill:#0071e3; --green:#30d158;
  --panel:#1d1d1f; --panel-2:#161617; --hair:#424245;
  --r:28px;

  --max:1080px;
  --gut:clamp(22px,4.4vw,60px);

  --f-disp:-apple-system,BlinkMacSystemFont,'SF Pro Display','SF Pro Text','Helvetica Neue','Segoe UI',Roboto,Arial,sans-serif;
  --f-text:-apple-system,BlinkMacSystemFont,'SF Pro Text','Helvetica Neue','Segoe UI',Roboto,Arial,sans-serif;
  --f-lab:-apple-system,BlinkMacSystemFont,'SF Pro Text','Helvetica Neue','Segoe UI',Roboto,Arial,sans-serif;

  --ease:cubic-bezier(.28,.11,.32,1);
  --foil:linear-gradient(108deg,#f5f5f7 4%,#b9cee8 52%,#7d9cc0 96%);
}

/* ── RESET ─────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0; background:#000; color:var(--tx);
  font-family:var(--f-text); font-size:17px; line-height:1.47;
  letter-spacing:-.012em;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
img{max-width:100%; display:block; height:auto}
a{color:inherit; text-decoration:none}
button{font:inherit; color:inherit}
h1,h2,h3,h4{margin:0; font-family:var(--f-disp); font-weight:700;
  line-height:1.05; letter-spacing:-.015em; text-wrap:balance}
p{margin:0; text-wrap:pretty}
ul,ol{margin:0; padding:0; list-style:none}
hr{border:0; height:1px; background:var(--line-2); margin:0}
::selection{background:#2997ff; color:#000}
:focus-visible{outline:2px solid var(--blue); outline-offset:3px; border-radius:4px}

html{scrollbar-width:thin; scrollbar-color:#424245 #000}
::-webkit-scrollbar{width:11px}
::-webkit-scrollbar-track{background:#000}
::-webkit-scrollbar-thumb{background:#424245; border:3px solid #000; border-radius:6px}

@view-transition{ navigation:auto }
::view-transition-old(root),::view-transition-new(root){animation-duration:.25s}
@media (prefers-reduced-motion:reduce){
  ::view-transition-old(root),::view-transition-new(root){animation:none}
}

.skip{position:absolute; left:-9999px; top:0; z-index:300;
  background:var(--blue-fill); color:#fff; padding:12px 20px; border-radius:980px}
.skip:focus{left:12px; top:12px}

/* ── TYPE ──────────────────────────────────────────────── */
.lab{
  font-family:var(--f-lab); font-size:17px; font-weight:600;
  letter-spacing:-.01em; text-transform:none; color:var(--tx-3);
  display:inline-flex; align-items:center; gap:0;
}
.lab::before{display:none}
.lab--bare::before{display:none}

.d1{font-size:clamp(2.9rem,6.8vw,6rem); line-height:1.02; letter-spacing:-.02em; font-weight:700}
.d2{font-size:clamp(2.1rem,4.4vw,4rem); line-height:1.06; letter-spacing:-.018em}
.d3{font-size:clamp(1.6rem,2.8vw,2.4rem)}
.d4{font-size:1.4rem; line-height:1.2}

.foil{
  background:var(--foil); -webkit-background-clip:text; background-clip:text;
  color:transparent; -webkit-text-fill-color:transparent;
}
.italic{font-style:normal}

.lede{font-size:clamp(1.12rem,1.5vw,1.44rem); line-height:1.4; color:var(--tx-2);
  font-weight:500; letter-spacing:-.014em}
.sm{font-size:.94rem; line-height:1.5}
.xs{font-size:.8rem; line-height:1.45; color:var(--tx-3)}
.muted{color:var(--tx-3)}
.brass{color:var(--blue)}
.measure{max-width:60ch}
.measure-s{max-width:46ch}
.center{text-align:center}

.dropcap::first-letter{
  float:none; font-size:inherit; line-height:inherit; padding:0;
  font-family:inherit; background:none; color:inherit; -webkit-text-fill-color:currentColor;
}

/* ── LAYOUT ────────────────────────────────────────────── */
.wrap{max-width:var(--max); margin-inline:auto; padding-inline:var(--gut)}
.sec{padding-block:clamp(72px,9vw,140px); position:relative}
.sec--tight{padding-block:clamp(44px,5vw,76px)}

.leaf,.leaf--deep{background:#000}
.leaf--wine{background:#000}
.leaf--paper{background:var(--bone); color:#1d1d1f}
.leaf--paper h1,.leaf--paper h2,.leaf--paper h3,.leaf--paper h4{color:#1d1d1f}
.leaf--paper .lede{color:#515154}
.leaf--paper .muted,.leaf--paper .xs{color:#86868b}
.leaf--paper .lab{color:#86868b}

.orn{display:flex; align-items:center; gap:14px; margin-bottom:clamp(26px,3vw,40px)}
.orn::after{content:''; flex:1; height:1px; background:var(--line-2)}

.grid{display:grid; gap:clamp(16px,1.8vw,24px)}
.grid>*{min-width:0}
.g2{grid-template-columns:1fr 1fr; gap:clamp(24px,3vw,48px)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
@media (max-width:940px){ .g3,.g4{grid-template-columns:repeat(2,1fr)} }
@media (max-width:700px){ .g2,.g3,.g4{grid-template-columns:1fr} }

.stack{display:flex; flex-direction:column; gap:20px}
.stack>*{min-width:0}
.mt{margin-top:clamp(30px,3.6vw,52px)}
.mt-s{margin-top:16px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}

.head{margin-bottom:clamp(36px,4.4vw,60px); text-align:center}
.head .lab{margin-bottom:14px}
.head h2{margin-bottom:18px}
.head .lede{max-width:62ch; margin-inline:auto}

/* ── MASTHEAD → Apple-style local header ───────────────── */
.masthead{background:rgba(0,0,0,.9); border-bottom:1px solid var(--line);
  position:relative; backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px)}
.masthead::after{display:none}
.masthead .wrap{padding-block:10px 0; text-align:center}
.mast__over{display:flex; justify-content:space-between; align-items:center; gap:16px;
  font-size:11px; font-weight:400; letter-spacing:0; text-transform:none;
  color:var(--tx-3); padding-bottom:8px}
.mast__over a:hover{color:var(--tx)}
@media (max-width:800px){ .mast__over span:first-child{display:none} .mast__over{justify-content:center} }

.mast__name{font-family:var(--f-disp); font-size:clamp(1.5rem,3.2vw,2.1rem);
  font-weight:700; letter-spacing:-.02em; line-height:1; padding-block:10px 0;
  display:block; color:var(--tx)}
.mast__name b{font-weight:700; background:var(--foil);
  -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent}
.mast__sub{font-size:12px; font-weight:400; letter-spacing:0; text-transform:none;
  color:var(--tx-3); margin-top:5px}
.mast__rule{height:0; margin-top:12px}
.mast__nav{display:flex; justify-content:center; flex-wrap:wrap; gap:6px; padding-block:10px 14px}
.mast__nav a{font-size:12px; font-weight:400; letter-spacing:0; text-transform:none;
  color:var(--tx-2); padding:6px 14px; border-radius:980px; transition:color .2s, background .2s}
.mast__nav a+a{border-left:0}
.mast__nav a:hover{color:var(--tx); background:rgba(255,255,255,.08)}
.mast__nav a[aria-current="page"]{color:#000; background:var(--tx)}

.railbar{position:fixed; top:0; left:0; right:0; z-index:120;
  background:rgba(22,22,23,.8); backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid rgba(66,66,69,.6);
  transform:translateY(-101%); transition:transform .4s var(--ease)}
.railbar.is-on{transform:none}
.railbar .wrap{display:flex; align-items:center; justify-content:space-between; gap:18px; height:48px}
.railbar__name{font-family:var(--f-disp); font-size:19px; font-weight:600;
  letter-spacing:-.02em; white-space:nowrap; color:var(--tx)}
.railbar__nav{display:flex; align-items:center; gap:22px}
.railbar__nav a{font-size:12px; font-weight:400; letter-spacing:0; text-transform:none; color:var(--tx-2)}
.railbar__nav a:hover{color:var(--tx)}
@media (max-width:800px){ .railbar__nav a:not(.btn){display:none} }
@media (prefers-reduced-motion:reduce){ .railbar{transition:none} }

/* ── BUTTONS — pills ───────────────────────────────────── */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:12px 24px; border-radius:980px;
  font-family:var(--f-text); font-size:17px; font-weight:400;
  letter-spacing:-.01em; text-transform:none; cursor:pointer; position:relative;
  background:var(--blue-fill); color:#fff; border:0; overflow:visible;
  box-shadow:none; transition:background .25s var(--ease), transform .25s var(--ease);
}
.btn:hover{background:#0077ed; transform:none; box-shadow:none; background-position:0 0}
.btn--line{background:transparent; color:var(--blue); border:1px solid var(--blue)}
.btn--line:hover{background:var(--blue); color:#000; border-color:var(--blue); transform:none}
.btn--wide{width:100%; padding-block:14px}
.btn--sm{padding:7px 16px; font-size:14px}
.btns{display:flex; flex-wrap:wrap; gap:14px; align-items:center}

/* ── FACTS — clean stat row ────────────────────────────── */
.facts{display:flex; flex-wrap:wrap; gap:0; border:0; background:transparent;
  max-width:var(--max); margin-inline:auto; padding-inline:var(--gut);
  padding-block:clamp(34px,4vw,56px)}
.facts div{flex:1 1 190px; padding:10px 22px; border-right:1px solid var(--line-2)}
.facts div:last-child{border-right:0}
.facts dt{font-size:12px; font-weight:400; letter-spacing:0; text-transform:none;
  color:var(--tx-3); margin-bottom:6px}
.facts dd{margin:0; font-size:1.02rem; color:var(--tx-2)}
.facts dd b{font-family:var(--f-disp); font-size:1.7rem; font-weight:700; color:var(--tx)}
@media (max-width:700px){ .facts div{border-right:0; border-bottom:1px solid var(--line-2)} .facts div:last-child{border-bottom:0} }

/* ── MARQUEE ───────────────────────────────────────────── */
.marquee{overflow:hidden; border-block:1px solid var(--line); background:#000; padding-block:14px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee__t{display:flex; gap:0; width:max-content; animation:slide 46s linear infinite}
@keyframes slide{ to{transform:translateX(-50%)} }
@media (prefers-reduced-motion:reduce){ .marquee__t{animation:none} }
.marquee:hover .marquee__t{animation-play-state:paused}
.marquee span{font-size:14px; font-weight:500; letter-spacing:-.01em; text-transform:none;
  color:var(--tx-3); padding-inline:22px; white-space:nowrap}
.marquee span::after{content:'·'; color:var(--tx-3); margin-left:22px; font-size:14px; vertical-align:0}

/* ── ANNOUNCEMENT ──────────────────────────────────────── */
.notice{background:var(--panel-2); border:0; border-block:0}
.notice .wrap{display:flex; align-items:center; gap:clamp(14px,2.4vw,28px);
  padding-block:16px; flex-wrap:wrap}
.notice__d{font-size:12px; font-weight:600; letter-spacing:0; text-transform:none;
  color:#000; flex:none; background:var(--tx); padding:6px 14px; border-radius:980px}
.notice p{flex:1 1 320px; font-size:15px; line-height:1.45; color:var(--tx-2)}
.notice a{color:var(--blue); border-bottom:0; white-space:nowrap}
.notice a:hover{text-decoration:underline}

/* ── STATS — rounded panels ────────────────────────────── */
.stats{display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(12px,1.6vw,20px); border:0}
@media (max-width:860px){ .stats{grid-template-columns:repeat(2,1fr)} }
@media (max-width:480px){ .stats{grid-template-columns:1fr} }
.stat{padding:clamp(26px,3vw,38px); border:0; border-radius:var(--r);
  background:var(--panel); transition:transform .45s var(--ease)}
.stat:hover{transform:translateY(-3px)}
.stat:nth-child(2n){border-right:0}
.stat b{display:block; font-family:var(--f-disp); font-size:clamp(2.6rem,4.6vw,3.8rem);
  font-weight:700; background:var(--foil); -webkit-background-clip:text; background-clip:text;
  color:transparent; -webkit-text-fill-color:transparent;
  line-height:1; margin-bottom:12px}
.stat span{display:block; font-size:15px; color:var(--tx-2); line-height:1.45}

/* ── PHOTO CARDS — rounded panels ──────────────────────── */
.pcard{position:relative; overflow:hidden; border:0; border-radius:var(--r);
  display:block; background:var(--panel); height:100%;
  transition:transform .5s var(--ease)}
.pcard:hover{transform:translateY(-4px)}
.pcard::after{display:none}
.pcard__img{aspect-ratio:4/3; overflow:hidden; position:relative}
.pcard__img img{width:100%; height:100%; object-fit:cover;
  filter:none; transition:transform 1s var(--ease)}
.pcard:hover .pcard__img img{transform:scale(1.04)}
.pcard__img::after{content:''; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(29,29,31,.55), transparent 40%); opacity:1;
  transition:opacity .6s var(--ease)}
.pcard:hover .pcard__img::after{opacity:.5}
.pcard__body{padding:clamp(22px,2.4vw,30px); position:relative}
.pcard__body::before{display:none}
.pcard__body::after{display:none}
.pcard h3{font-size:21px; font-weight:600; letter-spacing:-.014em; margin:8px 0 8px}
.pcard p{color:var(--tx-2); font-size:15px; line-height:1.5}
.pcard .lab{font-size:13px; font-weight:500; color:var(--tx-3); letter-spacing:0}

/* ── FULL-BLEED BAND ───────────────────────────────────── */
.band{position:relative; overflow:hidden; background:#000;
  max-width:min(1400px,calc(100% - 2*var(--gut))); margin-inline:auto; border-radius:var(--r)}
.band__img{height:clamp(300px,42vw,560px); overflow:hidden}
.band__img img{width:100%; height:100%; object-fit:cover; filter:none}
.band::after{content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(to right, rgba(0,0,0,.82) 0%, rgba(0,0,0,.35) 50%, rgba(0,0,0,.4) 100%)}
.band__cap{position:absolute; inset:0; z-index:2; display:flex; align-items:center}
.band__cap .wrap{width:100%}
.band__cap p{font-family:var(--f-disp); font-size:clamp(1.6rem,3.4vw,2.9rem);
  font-weight:700; letter-spacing:-.018em; line-height:1.08; max-width:24ch; color:var(--tx)}
.band__cap .lab{margin-bottom:12px}

/* framed plate → clean rounded image */
figure.plate-fig{margin:0}
.plate-fig__frame{border:0; padding:0; background:transparent; position:relative;
  overflow:hidden; border-radius:var(--r);
  transition:transform .5s var(--ease)}
.plate-fig__frame::after,.plate-fig__frame::before{display:none}
figure.plate-fig:hover .plate-fig__frame{transform:translateY(-4px); box-shadow:none}
figure.plate-fig img{width:100%; filter:none}
figure.plate-fig figcaption{margin-top:12px; font-size:12px; font-weight:400;
  letter-spacing:0; text-transform:none; color:var(--tx-3); display:flex; gap:8px}
figure.plate-fig figcaption b{color:var(--tx-2); flex:none; font-weight:600}

/* ── LEDGER — spec panel ───────────────────────────────── */
.ledger{border:0; border-image:none; background:var(--panel); border-radius:var(--r);
  overflow:hidden}
.ledger__head{display:flex; justify-content:space-between; align-items:baseline;
  gap:18px; padding:20px clamp(20px,2.4vw,28px); border-bottom:1px solid var(--line-2)}
.ledger__head h3{font-size:21px; font-weight:600; letter-spacing:-.014em}
.ledger__head span{font-size:12px; font-weight:400; letter-spacing:0; text-transform:none; color:var(--tx-3)}
.line{display:flex; align-items:baseline; gap:14px;
  padding:16px clamp(20px,2.4vw,28px); border-bottom:1px solid var(--line-2);
  transition:background .25s var(--ease)}
.line:hover{background:#232326}
.line::before{display:none}
.line:last-child{border-bottom:0}
.line__t{flex:0 1 auto; min-width:0}
.line__t b{display:block; font-weight:600; font-size:17px; letter-spacing:-.012em}
.line__t i{display:block; font-style:normal; color:var(--tx-3); font-size:14px;
  line-height:1.4; margin-top:2px}
.line__d{flex:1 1 24px; min-width:12px; margin-bottom:.32em; height:0; background:none}
@media (max-width:540px){ .line__d{display:none} }
.line__p{flex:none; font-family:var(--f-disp); font-size:21px; font-weight:600;
  color:var(--tx); white-space:nowrap; line-height:1;
  transition:transform .3s var(--ease)}
.line:hover .line__p{transform:none; text-shadow:none}
.line__p em{font-style:normal; font-family:var(--f-text); font-size:.65em; color:var(--tx-3)}
.line--incl .line__p{font-family:var(--f-text); font-style:normal; font-size:15px; color:var(--green)}
.line--lead{padding-block:22px; background:transparent}
.line--lead .line__t b{font-family:var(--f-disp); font-size:21px; font-weight:700}
.line--lead .line__p{font-size:34px; font-weight:700; background:var(--foil);
  -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent}
.ledger__foot{padding:16px clamp(20px,2.4vw,28px)}

/* ── COMPARISON — rounded panel ────────────────────────── */
.cmp{border:0; border-image:none; background:var(--panel); border-radius:var(--r);
  padding:clamp(10px,1.4vw,18px) clamp(20px,2.4vw,30px)}
.cmp__hd{display:grid; grid-template-columns:1fr 1fr; gap:clamp(20px,3.4vw,52px);
  padding-block:14px; border-bottom:1px solid var(--line-2)}
.cmp__hd span{font-size:12px; font-weight:500; letter-spacing:0; text-transform:none; color:var(--tx-3)}
.cmp__hd span:last-child{color:var(--tx)}
.cmp__row{display:grid; grid-template-columns:1fr 1fr; gap:clamp(20px,3.4vw,52px);
  padding-block:18px; border-bottom:1px solid var(--line-2); align-items:baseline;
  transition:background .25s}
.cmp__row:last-child{border-bottom:0}
.cmp__row:hover{background:transparent}
.cmp__row i{font-style:normal; color:var(--tx-3); font-size:15px; line-height:1.5}
.cmp__row b{font-weight:600; font-size:16px; line-height:1.5; transition:none}
.cmp__row:hover b{transform:none}
@media (max-width:740px){
  .cmp__hd{display:none}
  .cmp__row{grid-template-columns:1fr; gap:8px; padding-block:16px}
  .cmp__row i::before{content:'“'} .cmp__row i::after{content:'”'}
  .cmp__row b::before{content:'→ '; color:var(--blue)}
}

/* ── STEPS ─────────────────────────────────────────────── */
.steps{counter-reset:s; border:0; border-image:none}
.step{counter-increment:s; display:grid; grid-template-columns:88px 1fr;
  gap:clamp(16px,3vw,44px); padding:clamp(26px,3vw,38px) clamp(20px,2.4vw,30px);
  border:0; border-radius:var(--r); background:var(--panel);
  align-items:start; margin-bottom:clamp(12px,1.6vw,20px)}
@media (max-width:620px){ .step{grid-template-columns:52px 1fr; gap:16px} }
.step__n{font-family:var(--f-disp); font-size:clamp(2rem,3.6vw,3rem); font-weight:700;
  line-height:.9; background:var(--foil); -webkit-background-clip:text; background-clip:text;
  color:transparent; -webkit-text-fill-color:transparent}
.step__n::before{content:counter(s)}
.step h3{font-size:22px; font-weight:600; letter-spacing:-.015em; margin-bottom:9px}
.step p{color:var(--tx-2); max-width:60ch; font-size:16px}
.step .aside{margin-top:12px; padding-left:14px; border-left:2px solid var(--line-2);
  font-style:normal; color:var(--tx-3); font-size:14px; line-height:1.45}

/* ── ENTRY / NOTE ──────────────────────────────────────── */
.entry{border-top:0; padding:clamp(22px,2.4vw,30px); border-radius:var(--r); background:var(--panel-2)}
.entry .lab{margin-bottom:10px; font-size:13px}
.entry h3{font-size:20px; font-weight:600; margin-bottom:10px; letter-spacing:-.014em}
.entry p{color:var(--tx-2); font-size:15px; line-height:1.5}
.entry p+p{margin-top:8px}

.note{border:0; border-left:0; border-radius:var(--r);
  padding:clamp(22px,2.4vw,30px); background:var(--panel);
  transition:transform .45s var(--ease)}
.note:hover{border-left-color:transparent; background:var(--panel); transform:translateY(-3px)}
.note h4{font-family:var(--f-disp); font-size:19px; font-weight:600;
  letter-spacing:-.014em; margin-bottom:10px}
.note p{color:var(--tx-2); font-size:15px; line-height:1.5}
.note p+p{margin-top:9px}
.cite{display:block; margin-top:12px; font-size:11px; font-weight:500;
  letter-spacing:0; text-transform:none; color:var(--tx-3); line-height:1.6}

/* ── ZIPS — chip grid ──────────────────────────────────── */
.zips{display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr));
  gap:clamp(10px,1.2vw,14px); border:0}
.zips li{padding:16px 18px; border:0; border-radius:18px; background:var(--panel-2);
  transition:background .25s, transform .35s var(--ease); position:relative}
.zips li:hover{background:var(--panel); transform:translateY(-2px)}
.zips li::after{display:none}
.zips b{display:block; font-weight:600; font-size:16px; letter-spacing:-.012em; margin-bottom:2px}
.zips span{font-size:12px; letter-spacing:0; color:var(--tx-3)}

/* ── FORM ──────────────────────────────────────────────── */
.form{display:grid; gap:18px}
.field{display:flex; flex-direction:column; gap:7px}
.field label{font-size:13px; font-weight:500; letter-spacing:0; text-transform:none; color:var(--tx-2)}
.field label .rq{color:var(--blue)}
.field input,.field select,.field textarea{
  font-family:var(--f-text); font-size:17px; color:var(--tx);
  background:var(--panel-2); border:1px solid var(--hair);
  padding:12px 14px; width:100%; appearance:none; border-radius:12px;
  transition:border-color .2s, background .2s}
.field textarea{min-height:110px; resize:vertical; line-height:1.45}
.field select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7'%3E%3Cpath d='M1 1l4.5 4.5L10 1' stroke='%23a1a1a6' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; padding-right:38px}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none; border-color:var(--blue); background:var(--panel)}
.field input::placeholder,.field textarea::placeholder{color:#6e6e73; font-style:normal}
.field small{font-size:12px; color:var(--tx-3); font-style:normal}
.frow{display:grid; grid-template-columns:1fr 1fr; gap:18px}
@media (max-width:620px){ .frow{grid-template-columns:1fr} }
.consent{display:flex; gap:12px; align-items:flex-start}
.consent input{width:16px; height:16px; margin-top:4px; flex:none; accent-color:var(--blue-fill)}
.consent label{font-size:13px; letter-spacing:0; text-transform:none;
  color:var(--tx-3); line-height:1.45; font-style:normal}
.result{border:1px solid var(--blue); border-left-width:1px; border-radius:14px;
  padding:16px 18px; font-size:14px; line-height:1.5; color:var(--tx-2); background:rgba(41,151,255,.08)}

.copyblock{border:1px solid var(--hair); border-radius:14px; display:flex; align-items:stretch;
  background:var(--panel-2); overflow:hidden}
.copyblock code{font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:12px; font-weight:400;
  letter-spacing:0; padding:13px 15px; flex:1 1 auto; min-width:0; line-height:1.7; color:var(--tx-2);
  white-space:normal; overflow-wrap:anywhere}
.copyblock button{flex:none; background:transparent; border:0; border-left:1px solid var(--hair);
  padding:0 18px; cursor:pointer; font-size:13px; font-weight:500;
  letter-spacing:0; text-transform:none; color:var(--blue); transition:background .2s,color .2s}
.copyblock button:hover{background:var(--blue-fill); color:#fff}

/* ── FAQ ───────────────────────────────────────────────── */
.faq{border:0; border-image:none; background:var(--panel); border-radius:var(--r);
  padding-inline:clamp(20px,2.4vw,30px)}
.faq details{border-bottom:1px solid var(--line-2)}
.faq details:last-child{border-bottom:0}
.faq summary{cursor:pointer; list-style:none; padding:20px 44px 20px 0; position:relative;
  font-family:var(--f-disp); font-size:19px; font-weight:600; letter-spacing:-.014em;
  line-height:1.3; transition:color .2s}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--tx-2)}
.faq details[open] summary{color:var(--tx)}
.faq summary::after{content:''; position:absolute; right:6px; top:50%; width:13px; height:2px;
  border-radius:2px; background:var(--tx-2)}
.faq summary::before{content:''; position:absolute; right:11.5px; top:50%; width:2px; height:13px;
  border-radius:2px; margin-top:-5.5px; background:var(--tx-2);
  transition:transform .3s var(--ease), opacity .25s}
.faq details[open] summary::before{transform:rotate(90deg); opacity:0}
.faq .ans{padding-bottom:22px; max-width:66ch}
.faq .ans p{color:var(--tx-2); font-size:15px; line-height:1.55}
.faq .ans p+p{margin-top:10px}
.faq .ans{animation:ansin .4s var(--ease)}
@keyframes ansin{from{opacity:0; transform:translateY(-6px)} to{opacity:1; transform:none}}
@media (prefers-reduced-motion:reduce){ .faq .ans{animation:none} }

/* ── COLOPHON — Apple footer ───────────────────────────── */
.colophon{background:var(--panel-2); border-top:1px solid var(--line-2); position:relative}
.colophon::before{display:none}
.colophon .wrap{padding-block:clamp(40px,4.6vw,60px) 22px}
.colo__top{display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:clamp(24px,3vw,46px);
  padding-bottom:30px; border-bottom:1px solid var(--line-2)}
@media (max-width:880px){ .colo__top{grid-template-columns:1fr 1fr} }
@media (max-width:520px){ .colo__top{grid-template-columns:1fr} }
.colo__top h4{font-size:12px; font-weight:600; letter-spacing:0; text-transform:none;
  color:var(--tx); margin-bottom:12px}
.colo__top li{margin-bottom:7px; font-size:12px; color:var(--tx-3)}
.colo__top li a:hover{color:var(--tx); text-decoration:underline}
.colo__mark{font-family:var(--f-disp); font-size:19px; font-weight:600;
  letter-spacing:-.014em; line-height:1.25; margin-bottom:10px; color:var(--tx)}
.colo__disc{padding-top:22px; font-size:11px; line-height:1.6; color:var(--tx-3); font-style:normal}
.colo__foot{margin-top:18px; padding-top:16px; border-top:1px solid var(--line-2);
  display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap;
  font-size:11px; font-weight:400; letter-spacing:0; text-transform:none; color:var(--tx-3)}

/* ── REVEAL ────────────────────────────────────────────── */
.rv{opacity:0; transform:translateY(22px);
  transition:opacity .8s var(--ease), transform .8s var(--ease)}
.rv.in{opacity:1; transform:none}
@media (prefers-reduced-motion:reduce){ .rv{opacity:1!important; transform:none!important; transition:none} }

/* ── SCROLL-SCRUB HERO ─────────────────────────────────── */
.scrub{position:relative; background:#000}
.scrub__track{height:340vh}
.scrub__stage{position:sticky; top:0; height:100svh; overflow:hidden; background:#000}
.scrub__media{position:absolute; inset:0}
.scrub__media video,.scrub__media img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:none}
.scrub__media video{opacity:0; transition:opacity .6s var(--ease)}
.scrub.is-live .scrub__media video{opacity:1}
.scrub.is-live .scrub__media img{opacity:0; transition:opacity .6s var(--ease)}
.scrub__veil{position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(to top, #000 4%, rgba(0,0,0,.6) 30%, rgba(0,0,0,.12) 60%, rgba(0,0,0,.5) 100%)}
.scrub__copy{position:absolute; inset:0; z-index:3; display:flex; align-items:center}
.scrub__copy .wrap{width:100%; position:relative}
.beat{opacity:0; transform:translateY(26px); pointer-events:none;
  transition:opacity .6s var(--ease), transform .6s var(--ease)}
.beat:not(:first-child){position:absolute; inset:0}
.beat.is-on{opacity:1; transform:none; pointer-events:auto}
.beat h1,.beat h2{margin-block:12px 18px; clip-path:none}
.beat.is-on h1,.beat.is-on h2{clip-path:none}
.beat .lab{font-size:clamp(17px,1.6vw,21px); font-weight:600; color:var(--tx)}
.beat p{max-width:44ch; font-size:clamp(1.05rem,1.5vw,1.35rem); line-height:1.45;
  color:var(--tx-2); font-style:normal; font-weight:500}
.beat .btns{margin-top:clamp(22px,2.6vw,34px)}
.beat .lab, .beat h1, .beat h2, .beat p, .beat .btns{
  opacity:0; transform:translateY(12px);
  transition:opacity .5s var(--ease), transform .5s var(--ease)}
.beat.is-on .lab{opacity:1; transform:none; transition-delay:.04s}
.beat.is-on h1,.beat.is-on h2{opacity:1; transform:none; transition-delay:.12s}
.beat.is-on p{opacity:1; transform:none; transition-delay:.22s}
.beat.is-on .btns{opacity:1; transform:none; transition-delay:.3s}
@media (max-width:760px), (prefers-reduced-motion:reduce){
  .beat .lab,.beat h1,.beat h2,.beat p,.beat .btns{opacity:1; transform:none; transition:none}
}

.scrub__rail{position:absolute; left:0; right:0; bottom:0; height:2px; z-index:4;
  background:rgba(255,255,255,.12)}
.scrub__rail i{display:block; height:100%; width:0; background:var(--tx)}
.scrub__rail em{position:absolute; top:-3px; width:1px; height:8px; background:rgba(255,255,255,.25)}
.scrub__rail em:nth-of-type(1){left:33.33%}
.scrub__rail em:nth-of-type(2){left:66.66%}
.scrub__cue{position:absolute; z-index:4; bottom:24px; left:50%; transform:translateX(-50%);
  font-size:11px; font-weight:500; letter-spacing:.12em; text-transform:uppercase;
  color:var(--tx-3); display:flex; flex-direction:column; align-items:center; gap:8px;
  transition:opacity .5s}
.scrub__cue::after{content:''; width:1px; height:24px;
  background:linear-gradient(180deg,var(--tx-2),transparent); animation:cue 2.2s var(--ease) infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}
  51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.scrub.is-past .scrub__cue{opacity:0}
@media (prefers-reduced-motion:reduce){ .scrub__cue::after{animation:none} }

/* spec readouts / register marks: not part of this language */
.scrub__meta,.scrub__reg{display:none}

@media (max-width:760px), (prefers-reduced-motion:reduce){
  .scrub__track{height:auto}
  .scrub__stage{position:relative; height:auto; min-height:86svh}
  .scrub__copy{position:relative; padding-block:clamp(70px,18vw,120px)}
  .beat:not(:first-child){position:relative; inset:auto; margin-top:clamp(34px,8vw,56px)}
  .beat{opacity:1; transform:none}
  .scrub__cue{display:none}
}

/* ── PAGE HERO ─────────────────────────────────────────── */
.phero{position:relative; overflow:hidden; background:#000;
  min-height:clamp(480px,68vh,720px); display:flex; align-items:flex-end}
.phero__bg{position:absolute; inset:0; z-index:1}
.phero__bg img{width:100%; height:100%; object-fit:cover; filter:none}
.phero__veil{position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(to top, #000 3%, rgba(0,0,0,.62) 30%, rgba(0,0,0,.15) 62%, rgba(0,0,0,.45) 100%)}
.phero__wrap{position:relative; z-index:3; width:100%;
  padding-block:clamp(44px,5.6vw,80px) clamp(38px,4.6vw,66px)}
@media (max-width:700px){
  .phero{min-height:auto}
  .phero__wrap{padding-top:clamp(150px,42vw,230px)}
}

/* page scroll progress */
.pageline{position:fixed; top:0; left:0; right:0; height:2px; z-index:130;
  pointer-events:none; background:transparent}
.pageline i{display:block; height:100%; width:0; background:var(--blue); box-shadow:none}
@media (prefers-reduced-motion:reduce){ .pageline{display:none} }

/* open-hours chip */
.openchip{display:inline-flex; align-items:center; gap:7px;
  font-size:12px; font-weight:500; letter-spacing:0; text-transform:none;
  color:var(--tx-3); white-space:nowrap}
.openchip i{width:7px; height:7px; border-radius:50%; background:var(--tx-3); flex:none}
.openchip.is-open{color:var(--tx-2)}
.openchip.is-open i{background:var(--green); box-shadow:none; animation:none}
@media (max-width:800px){ .railbar .openchip{display:none} }

/* keep the count-up steady */
.stat b{font-variant-numeric:tabular-nums}