/* ==========================================================================
   THE 26 CLUB — private members' hub for the Montana Institute of Sport.
   Dark, cinematic: near-black ground, white type, bright yellow accents.
   Display: Bricolage Grotesque · Body: Inter · Labels: Space Mono.
   ========================================================================== */
:root{
  --bg:#0A0B0D;            /* near-black ground */
  --bg-2:#101216;          /* elevated surface */
  --bg-3:#15171C;          /* cards / cells */
  --ink:#F5F6F8;           /* near-white text */
  --muted:#9AA1AD;         /* secondary text */
  --faint:#6B7280;         /* tertiary */
  --line:#23262E;          /* hairline on dark */
  --line-2:#2E323C;
  --yellow:#F2C230;        /* accent */
  --yellow-2:#FFD24D;
  --yellow-ink:#0A0B0D;    /* text on yellow */
  --navy:#122049;

  --display:'Oswald', system-ui, sans-serif;
  --sans:'Inter', system-ui, sans-serif;
  --ui:'Poppins', system-ui, sans-serif;
  /* Small uppercase labels/eyebrows now use Poppins too (was Space Mono). */
  --mono:'Poppins', system-ui, sans-serif;

  --radius:4px;
  --ease:cubic-bezier(.22,.61,.36,1);
  color-scheme:dark;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%; text-size-adjust:100%;}
body{font-family:var(--sans); color:var(--ink); background:var(--bg); -webkit-font-smoothing:antialiased; overflow-x:hidden;}
.nowrap{white-space:nowrap;}
h1,h2,h3,.disp{font-family:var(--display); font-weight:700; letter-spacing:-0.02em; color:var(--ink);}
img{max-width:100%;}
.wrap{max-width:1200px; margin:0 auto; padding:0 40px;}
ul{list-style:none;}
a{color:inherit; transition:color .2s ease, opacity .15s ease;}
a:focus-visible, button:focus-visible, input:focus-visible{outline:2px solid var(--yellow); outline-offset:3px; border-radius:1px;}
::selection{background:var(--yellow); color:var(--yellow-ink);}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.01ms !important; transition-duration:.01ms !important; scroll-behavior:auto !important;}
}

/* ---------- Motion system ---------- */
.reveal{opacity:0; transform:translateY(28px); transition:opacity .85s var(--ease), transform .85s var(--ease);}
.reveal.reveal-l{transform:translateX(-40px);}
.reveal.reveal-r{transform:translateX(40px);}
.reveal.is-visible{opacity:1; transform:none;}
/* staggered children (delays set per-index in JS) */
.stagger > *{opacity:0; transform:translateY(28px); transition:opacity .7s var(--ease), transform .7s var(--ease);}
.stagger.is-visible > *{opacity:1; transform:none;}
/* image push-in reveal */
.reveal-img{overflow:hidden;}
.reveal-img img{transform:scale(1.14); transition:transform 1.3s var(--ease);}
.reveal-img.is-visible img{transform:scale(1);}

/* hero entrance sequence (city text handles its own fade per montage cut) */
.mhero-logo,.mhero .kicker{opacity:0; animation:heroIn 1s var(--ease) forwards;}
.mhero-logo{animation-delay:.08s;}
.mhero .kicker{animation-delay:.24s;}
@keyframes heroIn{from{opacity:0; transform:translateY(24px);} to{opacity:1; transform:none;}}

/* scroll progress bar */
.scroll-progress{position:fixed; top:0; left:0; height:2px; width:0; background:linear-gradient(90deg,var(--yellow),var(--yellow-2)); z-index:60; transition:width .08s linear; pointer-events:none;}

@media (prefers-reduced-motion: reduce){
  .reveal,.stagger > *{opacity:1 !important; transform:none !important;}
  .reveal-img img{transform:none !important;}
  .mhero-logo,.mhero .kicker{opacity:1 !important; animation:none !important;}
  .hero-city{opacity:1 !important; transform:none !important; filter:none !important;}
  .hero-note{opacity:1 !important;}
  .hero-video,.hero-fallback{animation:none !important; transform:none !important;}
  .cine-bar{animation:none !important; height:6.5vh;}
  .scroll-progress{display:none;}
}

/* Technical label (mono) */
.mono-label{font-family:var(--mono); font-size:11px; font-weight:400; letter-spacing:0.14em; text-transform:uppercase; color:var(--yellow); display:inline-flex; align-items:center; gap:10px;}
.mono-label::before{content:""; width:22px; height:1px; background:var(--yellow);}
.mono-label.center{justify-content:center;}
.h2{font-family:var(--display); font-size:clamp(1.9rem, 1.4rem + 1.8vw, 2.9rem); font-weight:700; line-height:1.06; letter-spacing:-0.03em; color:var(--ink);}
.lede{font-size:16.5px; color:var(--muted); line-height:1.8;}

/* Buttons */
.btn{display:inline-flex; align-items:center; gap:10px; font-family:var(--mono); font-weight:400; font-size:12px; letter-spacing:0.08em; text-transform:uppercase; padding:14px 26px; border-radius:var(--radius); cursor:pointer; border:1px solid transparent; transition:background .22s var(--ease), border-color .22s var(--ease), color .22s var(--ease); text-decoration:none; line-height:1;}
.btn::after{content:"\2197"; font-size:13px; transition:transform .22s var(--ease);}
.btn:hover::after{transform:translate(2px,-2px);}
.btn.no-arrow::after{content:""; display:none;}
.btn-yellow{background:var(--yellow); color:var(--yellow-ink); font-weight:700;}
.btn-yellow:hover{background:var(--yellow-2);}
.btn-line{border-color:var(--line-2); color:var(--ink);}
.btn-line:hover{border-color:var(--yellow); color:var(--yellow);}

/* ==========================================================================
   GATE
   ========================================================================== */
.gate{position:fixed; inset:0; z-index:1000; display:flex; align-items:center; justify-content:center; padding:40px 24px; background:radial-gradient(120% 90% at 50% 10%, #16181F 0%, var(--bg) 60%);}
.gate::after{content:""; position:absolute; inset:0; background:radial-gradient(50% 40% at 50% 34%, rgba(242,194,48,0.10), transparent 70%); pointer-events:none;}
.gate-card{position:relative; z-index:2; width:100%; max-width:420px; text-align:center; padding:20px;}
.gate-logo{height:78px; width:auto; margin:0 auto 26px; display:block;}
.gate-card h1{font-family:var(--display); color:var(--ink); font-size:36px; font-weight:700; letter-spacing:-0.03em; line-height:1;}
.gate-tag{font-family:var(--mono); font-size:10.5px; letter-spacing:0.24em; text-transform:uppercase; color:var(--yellow); margin-top:14px;}
.gate-card .lead{color:var(--muted); font-size:14px; line-height:1.7; margin-top:18px; max-width:300px; margin-left:auto; margin-right:auto;}
.gate-form{margin-top:30px; display:flex; flex-direction:column; gap:13px;}
.gate-form input{width:100%; padding:15px 18px; border:1px solid var(--line-2); border-radius:var(--radius); background:var(--bg-2); color:var(--ink); font-family:var(--sans); font-size:15px; text-align:center;}
.gate-form input::placeholder{color:var(--faint); font-family:var(--mono); font-size:12px; letter-spacing:0.14em; text-transform:uppercase;}
.gate-form input:focus{outline:none; border-color:var(--yellow); background:#14161B;}
.gate-form .btn{justify-content:center; padding:15px 24px;}
.gate-error{min-height:18px; color:#F2938F; font-size:12.5px; font-weight:500;}
.gate-foot{margin-top:28px; font-family:var(--mono); font-size:10px; letter-spacing:0.2em; text-transform:uppercase; color:var(--faint);}
.gate.shake .gate-card{animation:shake .45s var(--ease);}
@keyframes shake{10%,90%{transform:translateX(-2px);}20%,80%{transform:translateX(4px);}30%,50%,70%{transform:translateX(-8px);}40%,60%{transform:translateX(8px);}}
@media (prefers-reduced-motion: reduce){ .gate.shake .gate-card{animation:none;} }
body.locked{overflow:hidden;}
body.locked .site{display:none;}
.gate[hidden]{display:none !important;}

/* ==========================================================================
   NAV
   ========================================================================== */
.siteheader{background:rgba(10,11,13,0.72); -webkit-backdrop-filter:saturate(1.3) blur(14px); backdrop-filter:saturate(1.3) blur(14px); position:sticky; top:0; z-index:50; border-bottom:1px solid var(--line); transition:background .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);}
.siteheader.scrolled{background:rgba(10,11,13,0.94); box-shadow:0 12px 34px rgba(0,0,0,0.4); border-bottom-color:var(--line-2);}
.nav{display:flex; align-items:center; justify-content:space-between; padding:16px 40px; max-width:1200px; margin:0 auto; width:100%;}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none;}
.brand img{height:32px; width:auto; display:block;}
.brand-name{font-family:var(--display); font-weight:700; font-size:17px; letter-spacing:-0.02em; color:var(--ink);}
.navlinks{display:flex; align-items:center; gap:30px;}
.navlinks a{font-family:var(--ui); color:var(--muted); font-size:12px; font-weight:500; letter-spacing:0.04em; text-transform:uppercase; text-decoration:none; padding-bottom:4px; border-bottom:1px solid transparent; cursor:pointer;}
.navlinks a:hover{color:var(--ink); border-bottom-color:var(--yellow);}
.navlinks a.active{color:var(--ink); border-bottom-color:var(--yellow);}

/* Tabs */
.tab-panel{display:none;}
.tab-panel.active{display:block;}
.signout{background:none; border:1px solid var(--line-2); color:var(--muted); font-family:var(--ui); font-weight:500; font-size:11px; letter-spacing:0.06em; text-transform:uppercase; cursor:pointer; padding:9px 16px; border-radius:var(--radius);}
.signout:hover{color:var(--ink); border-color:var(--yellow);}

/* ==========================================================================
   HERO — cinematic looping video montage (LA -> Chicago -> Baltimore)
   ========================================================================== */
.mhero{position:relative; overflow:hidden; background:#000; height:88vh; min-height:560px; display:flex; border-bottom:1px solid var(--line);}
.mhero-full{height:100vh; height:100svh; min-height:560px; border-bottom:0;}
.hero-video,.hero-fallback{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; transform-origin:center; animation:kenburns 28s ease-out both;}
.hero-video{opacity:0; transition:opacity .6s var(--ease); z-index:1;}
.hero-video.show{opacity:1;}
.hero-fallback{z-index:0; opacity:.6; filter:saturate(.92) contrast(1.03);}
.hero-fallback.hide{opacity:0; transition:opacity .8s var(--ease);}
@keyframes kenburns{from{transform:scale(1.04);} to{transform:scale(1.18);}}
/* cinematic overlay: vignette + bottom gradient */
.mhero::after{content:""; position:absolute; inset:0; z-index:2; pointer-events:none; background:radial-gradient(130% 110% at 50% 42%, transparent 44%, rgba(0,0,0,0.55) 100%), linear-gradient(180deg, rgba(8,9,12,0.42) 0%, rgba(8,9,12,0.22) 45%, rgba(8,9,12,0.82) 100%);}
/* letterbox bars */
.cine-bar{position:absolute; left:0; right:0; height:0; background:#000; z-index:5; pointer-events:none; animation:cinein 1s var(--ease) .15s forwards;}
.cine-top{top:0;} .cine-bot{bottom:0;}
@keyframes cinein{to{height:6.5vh;}}
.mhero-inner{position:relative; z-index:4; max-width:1200px; margin:auto; padding:40px; text-align:center; width:100%;}
.mhero-logo{height:56px; width:auto; margin:0 auto 18px; display:block; filter:drop-shadow(0 6px 20px rgba(0,0,0,0.5));}
.mhero .kicker{font-family:var(--mono); font-size:12px; letter-spacing:0.28em; text-transform:uppercase; color:var(--yellow); margin-bottom:26px;}
/* GIANT white city name — focus-in title-card, changing per montage cut */
.hero-city{font-family:var(--display); color:#fff; font-weight:900; font-size:clamp(3.2rem, 15vw, 12rem); line-height:0.86; letter-spacing:-0.05em; text-transform:uppercase; margin:0; text-shadow:0 8px 50px rgba(0,0,0,0.6); opacity:0; transform:scale(1.08); filter:blur(12px); transition:opacity .9s var(--ease), transform 1.2s var(--ease), filter .9s var(--ease);}
.hero-city.show{opacity:1; transform:none; filter:none;}
.hero-note{margin-top:22px; font-family:var(--mono); font-size:12.5px; letter-spacing:0.34em; text-transform:uppercase; color:rgba(255,255,255,0.82); opacity:0; transition:opacity .8s var(--ease) .2s;}
.hero-note.show{opacity:1;}
.hero-note::before{content:"— "; color:var(--yellow);}

/* ==========================================================================
   SCROLL SCENES (home) — black -> city + video -> up & black -> next
   ========================================================================== */
.scenes{position:relative; background:#000;}
.scene{position:relative; height:160vh;}
.scene-stage{position:sticky; top:0; height:100vh; height:100svh; overflow:hidden; background:#000;}
.scene-poster,.scene-video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center;}
/* footage is deliberately dark so the white letters are the highlight */
.scene-poster{z-index:0; opacity:1; filter:brightness(.5) saturate(.9) contrast(1.05);}
.scene-video{z-index:1; filter:brightness(.55) saturate(.95);}
.scene-dim{position:absolute; inset:0; z-index:2; pointer-events:none; background:radial-gradient(120% 100% at 50% 45%, rgba(0,0,0,0.35) 25%, rgba(0,0,0,0.72) 100%), linear-gradient(180deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.3) 45%, rgba(0,0,0,0.78) 100%);}
.scene-cap{position:absolute; inset:0; z-index:4; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:24px; will-change:transform,opacity; transform-origin:center;}
.scene-note{font-family:var(--mono); font-size:12.5px; letter-spacing:0.34em; text-transform:uppercase; color:rgba(255,255,255,0.9); margin-bottom:20px;}
.scene-note::before{content:"— "; color:var(--yellow);}
.scene-city{font-family:var(--display); color:#fff; font-weight:900; font-size:clamp(2.6rem, 10.5vw, 8rem); line-height:0.88; letter-spacing:-0.04em; text-transform:uppercase; margin:0; text-shadow:0 2px 4px rgba(0,0,0,0.5), 0 14px 60px rgba(0,0,0,0.6);}
.scroll-hint{position:fixed; left:50%; bottom:26px; transform:translateX(-50%); z-index:20; display:flex; flex-direction:column; align-items:center; gap:9px; transition:opacity .4s var(--ease); pointer-events:none;}
.scroll-hint .lbl{font-family:var(--mono); font-size:9px; letter-spacing:0.24em; text-transform:uppercase; color:rgba(255,255,255,0.7);}
.scroll-hint .ln{width:1px; height:40px; background:rgba(255,255,255,0.25); position:relative; overflow:hidden;}
.scroll-hint .ln::after{content:""; position:absolute; left:0; top:-60%; width:1px; height:60%; background:var(--yellow); animation:cue 2s var(--ease) infinite;}
.scroll-hint.hide{opacity:0;}
@media (prefers-reduced-motion: reduce){ .scroll-hint{display:none;} .scene-black{opacity:0 !important;} }

/* ==========================================================================
   SECTIONS
   ========================================================================== */
.section{padding:104px 0;}
.section.tight{padding:76px 0;}
.section.elev{background:var(--bg-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.section-head{margin-bottom:54px; max-width:720px;}
.section-head.center{margin-left:auto; margin-right:auto; text-align:center;}
.section-head .mono-label{margin-bottom:18px;}
.section-head p{font-size:16px; color:var(--muted); line-height:1.8; margin-top:16px;}

/* ---------- FEATURED (the reference vibe) ---------- */
.featured-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:16px;}
.feat-item{position:relative; display:block; border:1px solid var(--line); padding:0; margin:0; text-align:left; cursor:pointer; text-decoration:none; border-radius:var(--radius); overflow:hidden; background:var(--bg-3); aspect-ratio:4/5; color:#fff; transition:border-color .25s var(--ease), transform .25s var(--ease);}
.feat-item.feat-primary{grid-column:1 / -1; aspect-ratio:21/9;}
.feat-primary .feat-body{padding:34px;}
.feat-primary .feat-title{font-size:clamp(28px, 2rem + 1.4vw, 46px); letter-spacing:-0.035em;}
.feat-primary .feat-desc{font-size:15px; max-width:46ch; color:#D3D8E4;}
.feat-primary .feat-play{width:60px; height:60px; font-size:20px;}
.feat-item:hover{border-color:var(--line-2); transform:translateY(-3px);}
.feat-item img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s var(--ease);}
.feat-item:hover img{transform:scale(1.05);}
.feat-item::after{content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(6,7,10,0.94) 0%, rgba(6,7,10,0.3) 46%, rgba(6,7,10,0.05) 100%);}
.feat-body{position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; justify-content:flex-end; padding:24px;}
.feat-kicker{font-family:var(--mono); font-size:10.5px; letter-spacing:0.12em; text-transform:uppercase; color:var(--yellow); margin-bottom:10px;}
.feat-title{font-family:var(--display); font-weight:700; font-size:23px; line-height:1.02; letter-spacing:-0.03em; color:#fff;}
.feat-desc{font-size:13px; color:#C4CADA; line-height:1.5; margin-top:9px; max-width:34ch;}
.feat-play{position:absolute; top:22px; right:22px; z-index:2; width:46px; height:46px; border-radius:50%; background:var(--yellow); color:var(--yellow-ink); display:flex; align-items:center; justify-content:center; font-size:16px; padding-left:3px; transition:transform .2s var(--ease);}
.feat-item:hover .feat-play{transform:scale(1.08);}
.feat-item .go{margin-top:14px; font-family:var(--mono); font-size:11px; letter-spacing:0.06em; text-transform:uppercase; color:var(--yellow); display:inline-flex; align-items:center; gap:8px;}
.feat-item .go::after{content:"\2197"; transition:transform .2s var(--ease);}
.feat-item:hover .go::after{transform:translate(2px,-2px);}

/* ---------- MISSION ---------- */
.mission-split{display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center;}
.mission-img{width:100%; height:460px; border-radius:var(--radius); overflow:hidden; position:relative; border:1px solid var(--line);}
.mission-img img{width:100%; height:100%; object-fit:cover; display:block;}
.mission-copy p{font-size:15.5px; color:var(--muted); line-height:1.9; margin-bottom:18px; max-width:52ch;}
.mission-copy p strong{color:var(--ink); font-weight:600;}

/* ---------- IMPACT STATS ---------- */
.impact-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
.impact-cell{background:var(--bg-3); padding:36px 26px; transition:background .22s var(--ease);}
.impact-cell:hover{background:#181A20;}
.impact-cell .num{font-family:var(--display); font-weight:700; font-size:46px; color:var(--ink); line-height:1; letter-spacing:-0.04em; font-variant-numeric:tabular-nums;}
.impact-cell .lab{font-family:var(--mono); font-size:10.5px; font-weight:400; color:var(--yellow); letter-spacing:0.1em; text-transform:uppercase; margin-top:16px;}
.impact-cell .sub{font-size:13px; color:var(--muted); line-height:1.65; margin-top:11px;}

/* ---------- SUPPORT LIST ---------- */
.problem-list{border-top:1px solid var(--line);}
.support-row{display:grid; grid-template-columns:64px 1fr; gap:30px; padding:34px 0; border-bottom:1px solid var(--line);}
.support-row .ghost-num{font-family:var(--mono); font-weight:400; font-size:14px; line-height:1.6; color:var(--yellow); align-self:start;}
.support-row .p-title{font-family:var(--display); font-weight:700; font-size:21px; color:var(--ink); line-height:1.2; margin-bottom:11px; letter-spacing:-0.03em; max-width:34ch;}
.support-row .p-body{font-size:14.5px; color:var(--muted); line-height:1.8; max-width:58ch;}

/* ---------- CALENDAR ---------- */
.events{border-top:1px solid var(--line);}
.ev-row{display:grid; grid-template-columns:160px 1fr; gap:28px; align-items:baseline; padding:26px 0; border-bottom:1px solid var(--line); transition:padding-left .22s var(--ease);}
.ev-row:hover{padding-left:8px;}
.ev-date{font-family:var(--mono); font-size:12px; letter-spacing:0.06em; text-transform:uppercase; color:var(--yellow);}
.ev-title{font-family:var(--display); font-weight:700; font-size:21px; color:var(--ink); line-height:1.15; letter-spacing:-0.03em; display:flex; align-items:center; gap:12px; flex-wrap:wrap;}
.ev-place{font-size:14px; color:var(--muted); line-height:1.6; margin-top:7px;}
.ev-status{font-family:var(--mono); font-size:9.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted); border:1px solid var(--line-2); padding:4px 10px; border-radius:20px;}
.ev-status.up{color:var(--yellow-ink); background:var(--yellow); border-color:var(--yellow);}

/* ---------- GALLERY ---------- */
.gallery-block + .gallery-block{margin-top:84px;}
.gallery{display:grid; grid-template-columns:repeat(4,1fr); gap:10px;}
.g-item{position:relative; display:block; padding:0; border:0; margin:0; cursor:pointer; background:var(--bg-3); border-radius:var(--radius); overflow:hidden; aspect-ratio:1/1;}
.g-item img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s var(--ease);}
.g-item:hover img{transform:scale(1.06);}
.g-item:focus-visible{outline:2px solid var(--yellow); outline-offset:2px;}
.g-play{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:linear-gradient(0deg, rgba(6,7,10,0.45), rgba(6,7,10,0.05));}
.g-play span{width:46px; height:46px; border-radius:50%; background:var(--yellow); color:var(--yellow-ink); display:flex; align-items:center; justify-content:center; font-size:16px; padding-left:3px;}

/* ---------- LIGHTBOX ---------- */
.lightbox{position:fixed; inset:0; z-index:900; display:flex; align-items:center; justify-content:center; padding:40px; background:rgba(4,5,8,0.96);}
.lightbox[hidden]{display:none !important;}
.lb-stage{max-width:92vw; max-height:86vh; display:flex; align-items:center; justify-content:center;}
.lb-stage img, .lb-stage video{max-width:92vw; max-height:86vh; width:auto; height:auto; border-radius:var(--radius); box-shadow:0 30px 90px rgba(0,0,0,0.7); background:#000;}
.lb-stage iframe{width:min(92vw, 1360px); aspect-ratio:16/9; max-height:86vh; height:auto; border:0; border-radius:var(--radius); box-shadow:0 30px 90px rgba(0,0,0,0.7); background:#000;}
.lb-close{position:absolute; top:22px; right:26px; width:44px; height:44px; border:0; border-radius:50%; background:rgba(255,255,255,0.08); color:#fff; font-size:24px; cursor:pointer;}
.lb-close:hover{background:var(--yellow); color:var(--yellow-ink);}
.lb-nav{position:absolute; top:50%; transform:translateY(-50%); width:52px; height:52px; border:0; border-radius:50%; background:rgba(255,255,255,0.08); color:#fff; font-size:28px; cursor:pointer; display:flex; align-items:center; justify-content:center;}
.lb-nav:hover{background:var(--yellow); color:var(--yellow-ink);}
.lb-nav[hidden]{display:none !important;}
.lb-prev{left:20px;} .lb-next{right:20px;}

/* ---------- DISPATCHES ---------- */
.feed{display:flex; flex-direction:column; gap:1px; background:var(--line); border:1px solid var(--line);}
.post{background:var(--bg-3); display:grid; grid-template-columns:220px 1fr; gap:0; text-decoration:none; transition:background .22s var(--ease);}
.post:hover{background:#181A20;}
.post-media{position:relative; overflow:hidden; min-height:200px; background:var(--bg-2);}
.post-media img{width:100%; height:100%; object-fit:cover; display:block; position:absolute; inset:0;}
.post-media .ph{position:absolute; inset:0; background:repeating-linear-gradient(45deg, #14161B, #14161B 10px, #191C22 10px, #191C22 20px); display:flex; align-items:center; justify-content:center; color:var(--faint); font-size:24px;}
.post-body{padding:32px 36px;}
.post-meta{display:flex; align-items:center; gap:14px; margin-bottom:13px;}
.post-tag{font-family:var(--mono); font-size:9.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--yellow-ink); background:var(--yellow); padding:5px 10px; border-radius:20px;}
.post-date{font-family:var(--mono); font-size:11px; color:var(--muted); letter-spacing:0.04em; text-transform:uppercase;}
.post h3{font-family:var(--display); font-size:23px; font-weight:700; color:var(--ink); line-height:1.12; letter-spacing:-0.03em; margin-bottom:11px;}
.post p{font-size:14.5px; color:var(--muted); line-height:1.8; max-width:62ch;}
.post .more{margin-top:16px; font-family:var(--mono); font-size:11px; letter-spacing:0.05em; text-transform:uppercase; color:var(--yellow); display:inline-flex; align-items:center; gap:8px;}
.post .more::after{content:"\2197"; transition:transform .22s var(--ease);}
.post:hover .more::after{transform:translate(2px,-2px);}

/* ---------- FOOTER ---------- */
.footer{background:var(--bg); padding:58px 0 30px; color:var(--muted); position:relative; border-top:1px solid var(--line);}
.footer::before{content:""; position:absolute; top:-1px; left:0; right:0; height:2px; background:linear-gradient(90deg, transparent, var(--yellow), transparent);}
.footer-top{display:flex; align-items:center; justify-content:space-between; gap:36px; flex-wrap:wrap; padding-bottom:34px; border-bottom:1px solid var(--line);}
.footer-brand{display:flex; align-items:center; gap:12px;}
.footer-brand img{height:34px;}
.footer-brand span{color:var(--ink); font-family:var(--display); font-weight:700; font-size:17px; letter-spacing:-0.02em;}
.footer-links{display:flex; gap:26px; flex-wrap:wrap;}
.footer-links a{font-family:var(--ui); font-weight:500; color:var(--muted); font-size:12px; letter-spacing:0.03em; text-transform:uppercase; text-decoration:none;}
.footer-links a:hover{color:var(--yellow);}
.footer-bottom{padding-top:24px; font-family:var(--mono); font-size:10.5px; letter-spacing:0.06em; color:var(--faint); display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; text-transform:uppercase;}
.back-to-top{color:var(--muted); font-family:var(--mono); font-size:10.5px; letter-spacing:0.06em; text-transform:uppercase; text-decoration:none;}
.back-to-top:hover{color:var(--yellow);}

/* ==========================================================================
   ROADMAP — What's Next timeline
   ========================================================================== */
.roadmap{position:relative; max-width:920px; margin:0 auto; padding:10px 0 30px;}
.roadmap::before{content:""; position:absolute; left:50%; top:0; bottom:0; width:2px; transform:translateX(-50%); background:linear-gradient(180deg, transparent, var(--line-2) 6%, var(--line-2) 94%, transparent);}
.rm-item{position:relative; width:50%; padding:22px 46px; box-sizing:border-box;}
.rm-item.left{left:0; text-align:right;}
.rm-item.right{left:50%; text-align:left;}
.rm-node{position:absolute; top:32px; width:14px; height:14px; border-radius:50%; background:var(--bg); border:2px solid var(--yellow); z-index:2;}
.rm-item.left .rm-node{right:-7px;}
.rm-item.right .rm-node{left:-7px;}
/* connector stub from the centre line to each card */
.rm-item::after{content:""; position:absolute; top:38px; width:34px; height:2px; background:var(--line-2);}
.rm-item.left::after{right:0;}
.rm-item.right::after{left:0;}
.rm-item.future::after{background:var(--yellow); opacity:.5;}
.rm-item.past .rm-node{border-color:var(--line-2);}
.rm-item.future .rm-node{background:var(--yellow); border-color:var(--yellow); box-shadow:0 0 12px rgba(242,194,48,0.4);}
.rm-card{display:inline-block; text-align:left; background:var(--bg-3); border:1px solid var(--line); border-radius:var(--radius); padding:20px 22px; max-width:360px; transition:border-color .25s var(--ease), transform .25s var(--ease);}
.rm-item:hover .rm-card{border-color:var(--line-2); transform:translateY(-2px);}
.rm-item.past .rm-card{opacity:0.7;}
.rm-when{font-family:var(--mono); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--yellow-ink);}
.rm-item.future .rm-when{color:var(--yellow);}
.rm-logos{display:flex; gap:10px; margin:14px 0 12px; flex-wrap:wrap;}
.rm-item.left .rm-logos{justify-content:flex-end;}
.rm-logo{width:58px; height:58px; border-radius:10px; background:#f3f4f6; border:1px solid var(--line-2); display:inline-flex; align-items:center; justify-content:center; overflow:hidden; position:relative;}
.rm-logo img{max-width:78%; max-height:78%; object-fit:contain;}
.rm-logo.ph{background:var(--bg-2);}
.rm-logo.ph::after{content:attr(data-name); font-family:var(--mono); font-size:8.5px; letter-spacing:0.04em; text-transform:uppercase; color:var(--muted); text-align:center; padding:4px; line-height:1.25;}
.rm-title{font-family:var(--display); font-weight:700; font-size:20px; letter-spacing:-0.02em; color:var(--ink); line-height:1.15;}
.rm-now{position:relative; z-index:3; display:flex; flex-direction:column; align-items:center; gap:8px; padding:30px 0;}
.rm-now-dot{width:20px; height:20px; border-radius:50%; background:var(--yellow); box-shadow:0 0 0 6px rgba(242,194,48,0.18), 0 0 24px rgba(242,194,48,0.5);}
.rm-now-label{font-family:var(--mono); font-size:11px; letter-spacing:0.2em; text-transform:uppercase; color:var(--yellow);}

/* ==========================================================================
   TEXTURE & DETAILS
   ========================================================================== */
.grain{position:fixed; inset:0; z-index:3; pointer-events:none; opacity:.05; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); background-size:140px 140px;}

.feat-index{position:absolute; top:20px; left:22px; z-index:2; font-family:var(--mono); font-size:10.5px; letter-spacing:0.1em; color:rgba(255,255,255,0.7);}

.scroll-cue{position:absolute; left:50%; bottom:24px; transform:translateX(-50%); z-index:3; display:flex; flex-direction:column; align-items:center; gap:10px;}
.scroll-cue .lbl{font-family:var(--mono); font-size:9px; letter-spacing:0.24em; text-transform:uppercase; color:var(--muted);}
.scroll-cue .ln{width:1px; height:44px; background:var(--line-2); position:relative; overflow:hidden;}
.scroll-cue .ln::after{content:""; position:absolute; left:0; top:-60%; width:1px; height:60%; background:var(--yellow); animation:cue 2s var(--ease) infinite;}
@keyframes cue{0%{top:-60%;} 55%,100%{top:100%;}}

.mobile-tabs{display:none;}

@media (prefers-reduced-motion: reduce){ .scroll-cue .ln::after{animation:none !important;} }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 900px){
  .mobile-tabs{display:flex; position:fixed; left:0; right:0; bottom:0; z-index:70; gap:4px; padding:7px 6px; padding-bottom:calc(7px + env(safe-area-inset-bottom)); background:rgba(10,11,13,0.95); -webkit-backdrop-filter:saturate(1.3) blur(16px); backdrop-filter:saturate(1.3) blur(16px); border-top:1px solid var(--line-2);}
  .mobile-tabs a{flex:1; text-align:center; font-family:var(--ui); font-weight:500; font-size:11px; letter-spacing:0.02em; text-transform:uppercase; color:var(--muted); text-decoration:none; padding:9px 4px; border-radius:var(--radius);}
  .mobile-tabs a.active{color:var(--yellow); background:rgba(242,194,48,0.10);}
  .site{padding-bottom:62px;}
  .scroll-cue{display:none;}
  .wrap{padding:0 22px;}
  .nav{padding:14px 22px; gap:12px;}
  .navlinks{display:none;}
  .mhero{height:82vh; min-height:460px;}
  .mhero-inner{padding:22px;}
  .mhero-logo{height:52px;}
  /* roadmap -> single column, line on the left */
  .roadmap::before{left:19px;}
  .rm-item, .rm-item.left, .rm-item.right{width:100%; left:0; text-align:left; padding:16px 0 16px 52px;}
  .rm-item.left .rm-logos{justify-content:flex-start;}
  .rm-item.left .rm-node, .rm-item.right .rm-node{left:13px; right:auto;}
  .rm-item::after{display:none;}
  .rm-now{align-items:flex-start; padding-left:8px;}
  .hero-meta > div{padding:10px 22px;}
  .hero-meta > div + div::before{display:none;}
  .section{padding:60px 0;}
  .featured-grid{grid-template-columns:1fr 1fr; gap:10px;}
  .feat-item{aspect-ratio:1/1;}
  .feat-item.feat-primary{aspect-ratio:16/10; grid-column:1 / -1;}
  .mission-split{grid-template-columns:1fr; gap:32px;}
  .mission-img{height:300px; order:-1;}
  .impact-grid{grid-template-columns:1fr;}
  .gallery{grid-template-columns:repeat(2,1fr); gap:8px;}
  .lightbox{padding:16px;}
  .lb-prev{left:8px;} .lb-next{right:8px;}
  .support-row{grid-template-columns:1fr; gap:8px; padding:26px 0;}
  .ev-row{grid-template-columns:1fr; gap:6px; padding:20px 0;}
  .post{grid-template-columns:1fr;}
  .post-media{min-height:200px; aspect-ratio:16/9;}
  .footer-top{flex-direction:column; align-items:flex-start;}
}

/* ============================ OCT 5 REDESIGN ============================ */
/* Oswald is tall/condensed — ease the tight tracking inherited from Sora. */
h1,h2,h3,.disp,.h2,.rm-title,.feat-title{letter-spacing:-0.005em;}
.h2{line-height:1.08;}

/* Nav: Sign Up CTA beside Sign out */
.nav-actions{display:flex; align-items:center; gap:12px;}
.nav-cta{padding:9px 18px; font-size:12px;}

/* ---- MONTAGE HERO (one looping video, full screen) ---- */
.vhero{position:relative; height:100vh; height:100svh; min-height:560px; overflow:hidden; background:#000;}
.vhero-video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; filter:brightness(.82) saturate(1.03) contrast(1.02); opacity:0; transition:opacity 1s ease;}
.vhero-video.active{opacity:1;}
.vhero-img{position:absolute; inset:0; z-index:0; background-size:cover; background-position:center; opacity:0; filter:brightness(.82) saturate(1.03); will-change:transform; transition:opacity .35s ease;}
.vhero-img.show{opacity:1;}
@keyframes kenburns{ from{transform:scale(1.12);} to{transform:scale(1.6);} }
.vhero-img.kb{ animation:kenburns var(--kbdur,4.5s) ease-out both; }
@media (prefers-reduced-motion: reduce){ .vhero-img.kb{animation:none; transform:scale(1.04);} }
.vhero-scrim{position:absolute; inset:0; z-index:1; pointer-events:none;
  background:radial-gradient(120% 90% at 50% 42%, rgba(0,0,0,.25) 20%, rgba(0,0,0,.72) 100%),
             linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.25) 40%, rgba(0,0,0,.8) 100%);}
.vhero-inner{position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:0 24px;}
.vhero-kicker{font-family:var(--ui); font-weight:600; font-size:13px; letter-spacing:.32em; text-transform:uppercase; color:var(--yellow); margin-bottom:22px;}
.vhero-title{font-family:var(--display); font-weight:700; color:#fff; text-transform:uppercase;
  font-size:clamp(2.6rem, 8.2vw, 6.6rem); line-height:.96; letter-spacing:.005em; margin:0;
  text-shadow:0 2px 6px rgba(0,0,0,.45), 0 16px 60px rgba(0,0,0,.5);}
.vhero-actions{margin-top:34px;}
.vhero-cta{font-size:14px; padding:16px 38px;}

/* Animated city caption: slides up on entry, slides back down between cities */
.vhero-cap{position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:0 24px; pointer-events:none;
  opacity:0; transform:translateY(52px); transition:opacity .6s var(--ease), transform .8s var(--ease);}
.vhero-cap.in{opacity:1; transform:translateY(0);}
.vhero-cap.out{opacity:0; transform:translateY(52px);}
.vhero-note{font-family:var(--ui); font-weight:600; font-size:13px; letter-spacing:.32em; text-transform:uppercase; color:var(--yellow); margin-bottom:18px; text-shadow:0 2px 12px rgba(0,0,0,.6);}
.vhero-city{font-family:var(--display); font-weight:700; color:#fff; text-transform:uppercase; margin:0;
  font-size:clamp(3rem, 12vw, 9rem); line-height:.9; letter-spacing:.005em;
  text-shadow:0 2px 8px rgba(0,0,0,.5), 0 18px 70px rgba(0,0,0,.6);}
@media (prefers-reduced-motion: reduce){ .vhero-cap{transition:none; opacity:1; transform:none;} }

/* ---- PUNCHY IMPACT TILES ---- */
.impact-cell{padding:42px 30px;}
.impact-cell .num{font-size:clamp(3.4rem, 7.5vw, 6rem); line-height:.95; letter-spacing:-0.03em;}
.impact-cell .lab{font-size:12px; margin-top:14px;}
.impact-cell.hero{grid-column:1 / -1; text-align:center; padding:48px 24px 40px;}
.impact-cell.hero .num{font-size:clamp(5rem, 17vw, 12rem); color:var(--yellow); line-height:.9; letter-spacing:-0.04em;}
.impact-cell.hero .lab{font-size:clamp(13px, 2.2vw, 17px); color:var(--ink); letter-spacing:.14em; margin-top:10px;}

/* ---- INITIATIVES GRID ---- */
.init-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:8px;}
.init-card{background:var(--bg-2); padding:28px 22px;}
.init-name{font-family:var(--display); font-weight:600; font-size:18px; text-transform:uppercase; letter-spacing:.01em; color:var(--yellow); line-height:1.12; margin-bottom:11px;}
.init-desc{font-size:14px; color:var(--muted); line-height:1.5;}

/* ---- Mobile "Member" CTA tab ---- */
.mobile-tabs a.mtab-cta{color:var(--yellow-ink); background:var(--yellow); font-weight:700;}

/* ---- BECOME A MEMBER (pricing) ---- */
.join-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px; margin:8px auto 0; max-width:760px;}
.join-card{background:var(--bg-2); border:1px solid var(--line-2); border-radius:var(--radius); padding:38px 30px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:10px;}
.join-plan{font-family:var(--ui); font-weight:600; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--yellow);}
.join-price{font-family:var(--display); font-weight:700; font-size:clamp(2.1rem, 5vw, 3.1rem); color:var(--ink); line-height:1; letter-spacing:-0.02em;}
.join-price span{font-family:var(--sans); font-weight:400; font-size:15px; color:var(--muted); letter-spacing:0;}
.join-desc{font-size:14px; color:var(--muted); margin-bottom:10px;}
.join-card .btn{width:100%; justify-content:center;}
.join-fine{text-align:center; font-size:12.5px; color:var(--faint); margin-top:24px;}
.btn-outline{background:transparent; border:1px solid var(--line-2); color:var(--ink);}
.btn-outline:hover{border-color:var(--yellow); color:var(--yellow);}
@media (max-width:620px){ .join-grid{grid-template-columns:1fr;} }

/* ---- HOW DO WE DO THIS ---- */
.how-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:8px;}
.how-card{background:var(--bg-2); padding:30px 24px;}
.how-num{font-family:var(--display); font-weight:700; font-size:34px; color:var(--yellow); line-height:1; margin-bottom:16px;}
.how-title{font-family:var(--display); font-weight:600; font-size:19px; color:var(--ink); line-height:1.15; margin-bottom:10px; text-transform:uppercase; letter-spacing:.01em;}
.how-body{font-size:14.5px; color:var(--muted); line-height:1.5;}

/* ---- WATCH (YouTube tiles) ---- */
.film-grid{display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:8px;}
.film-item{display:block; cursor:pointer; text-align:left; background:none; border:0; padding:0;}
.film-thumb{position:relative; aspect-ratio:16/9; border:1px solid var(--line-2); border-radius:var(--radius); overflow:hidden; background:#000;}
.film-thumb img{width:100%; height:100%; object-fit:cover; opacity:.9; transition:opacity .25s var(--ease), transform .4s var(--ease);}
.film-item:hover .film-thumb img, .film-item:focus-visible .film-thumb img{opacity:1; transform:scale(1.03);}
.film-play{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:2; width:66px; height:66px; border-radius:50%; background:rgba(242,194,48,.92); color:var(--yellow-ink); display:flex; align-items:center; justify-content:center; font-size:23px; padding-left:4px; box-shadow:0 8px 30px rgba(0,0,0,.45); transition:transform .25s var(--ease);}
.film-item:hover .film-play{transform:translate(-50%,-50%) scale(1.08);}
.film-cap{display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-top:14px; flex-wrap:wrap;}
.film-title{font-family:var(--display); font-weight:600; font-size:20px; color:var(--ink); text-transform:uppercase; letter-spacing:.01em; line-height:1.1;}
.film-watch{font-family:var(--ui); font-weight:600; font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--yellow); white-space:nowrap;}

/* ---- CLOSING CTA BAND ---- */
.cta-band{text-align:center;}
.cta-band .h2{margin-bottom:12px; text-transform:uppercase; letter-spacing:.01em;}
.cta-band p{max-width:46ch; margin:0 auto 26px;}
.section .wrap.center{text-align:center;}

@media (max-width: 900px){
  .how-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width: 620px){
  .how-grid{grid-template-columns:1fr;}
  .film-grid{grid-template-columns:1fr;}
  .nav-cta{padding:8px 14px; font-size:11px;}
  .vhero{min-height:520px;}
}

/* ============ WHY JOIN: mission / initiatives / impact ============ */
/* Highlighted section headers (Mission + Impact) */
.section-pill{display:inline-block; font-family:var(--display); font-weight:700; font-size:clamp(1.5rem, 4.2vw, 2.4rem); letter-spacing:.14em; text-transform:uppercase; color:var(--yellow-ink); background:var(--yellow); padding:.3em .9em; border-radius:var(--radius); margin-bottom:28px; line-height:1.1;}

/* Mission statement */
.mission-section{padding:clamp(70px, 11vw, 130px) 0;}
.mission-statement{font-family:var(--display); font-weight:700; text-transform:uppercase; color:#fff; line-height:1.04; letter-spacing:.005em; font-size:clamp(2rem, 6.4vw, 4.6rem); max-width:18ch; margin:0 auto;}
.mission-statement u{text-decoration-color:var(--yellow); text-decoration-thickness:.07em; text-underline-offset:.12em;}
@media (min-width:900px){ .mission-statement{max-width:22ch;} }

/* Initiatives showcase: big, independent cards */
.init-showcase{display:grid; grid-template-columns:repeat(6,1fr); gap:16px; margin-top:12px;}
.init-feature{grid-column:span 2; background:var(--bg-2); border:1px solid var(--line-2); border-top:3px solid var(--yellow); border-radius:var(--radius); padding:clamp(28px,4vw,44px) clamp(22px,3vw,34px); min-height:190px; display:flex; flex-direction:column; gap:14px; justify-content:flex-start;}
.init-feature:nth-child(4), .init-feature:nth-child(5){grid-column:span 3;}
.init-feature-name{font-family:var(--display); font-weight:700; font-size:clamp(1.6rem, 3.2vw, 2.4rem); text-transform:uppercase; color:#fff; line-height:1.02; letter-spacing:.005em;}
.init-feature-desc{font-size:15.5px; color:var(--muted); line-height:1.5; max-width:38ch;}
@media (max-width:900px){
  .init-showcase{grid-template-columns:1fr 1fr;}
  .init-feature, .init-feature:nth-child(4), .init-feature:nth-child(5){grid-column:span 1;}
  .init-feature:nth-child(5){grid-column:1 / -1;}
}
@media (max-width:560px){
  .init-showcase{grid-template-columns:1fr;}
  .init-feature:nth-child(5){grid-column:auto;}
  .init-feature{min-height:0;}
}

/* Impact: compact block under a highlighted header */
.impact-compact{padding:clamp(48px,7vw,80px) 0;}
.impact-compact .impact-grid{max-width:860px; margin:0 auto; text-align:center;}
.impact-compact .impact-cell{padding:22px 16px; text-align:center;}
.impact-compact .impact-cell .num{font-size:clamp(2.2rem, 6vw, 3.4rem);}
.impact-compact .impact-cell .lab{font-size:11px; margin-top:8px;}
.impact-compact .impact-cell.hero{padding:30px 16px 26px;}
.impact-compact .impact-cell.hero .num{font-size:clamp(3.4rem, 13vw, 7rem); color:var(--yellow);}
.impact-compact .impact-cell.hero .lab{font-size:clamp(12px, 2.2vw, 15px); margin-top:8px;}
.impact-compact .impact-cell:not(.hero){display:flex; flex-direction:column; align-items:center;}

/* ---- Why Join, no-yellow revision ---- */
.section-title{font-family:var(--display); font-weight:700; text-transform:uppercase; letter-spacing:.12em; color:#fff; font-size:clamp(1.9rem, 5.4vw, 3.4rem); line-height:1.05; margin:0 auto 26px; padding-bottom:18px; border-bottom:2px solid rgba(255,255,255,.85); display:inline-block;}
.section-head .section-title{margin-bottom:6px;}
.mission-statement u{text-decoration-color:#fff;}

/* Initiatives: one column, in order, each a step smaller than the one above */
.init-list{display:flex; flex-direction:column; gap:0; max-width:980px; margin:10px auto 0;}
.init-list .init-feature{grid-column:auto; background:transparent; border:0; border-top:1px solid var(--line-2); border-radius:0; min-height:0; padding:clamp(22px,3.4vw,38px) 4px; gap:10px;}
.init-list .init-feature:last-child{border-bottom:1px solid var(--line-2);}
.init-list .init-feature-name{color:#fff;}
.init-list .init-feature:nth-child(1) .init-feature-name{font-size:clamp(2.8rem, 9vw, 6.4rem);}
.init-list .init-feature:nth-child(2) .init-feature-name{font-size:clamp(2.4rem, 7.6vw, 5.2rem);}
.init-list .init-feature:nth-child(3) .init-feature-name{font-size:clamp(2.1rem, 6.4vw, 4.3rem);}
.init-list .init-feature:nth-child(4) .init-feature-name{font-size:clamp(1.8rem, 5.2vw, 3.5rem);}
.init-list .init-feature:nth-child(5) .init-feature-name{font-size:clamp(1.55rem, 4.2vw, 2.8rem);}
.init-list .init-feature-desc{font-size:clamp(14px, 1.6vw, 17px); max-width:60ch;}

/* Impact: no gold */
.impact-compact .impact-cell.hero .num{color:#fff;}
.impact-compact .impact-cell .lab{color:var(--muted);}
.impact-compact .impact-cell.hero .lab{color:var(--muted);}

/* ---- Initiatives: uniform size, name beside a longer blurb ---- */
.init-list{max-width:1040px;}
.init-list .init-feature{display:grid; grid-template-columns:minmax(200px, 1fr) 2fr; column-gap:clamp(24px,5vw,64px); align-items:start; padding:clamp(24px,3.2vw,40px) 4px;}
.init-list .init-feature:nth-child(n) .init-feature-name{font-size:clamp(1.35rem, 2.6vw, 1.9rem); line-height:1.1;}
.init-list .init-feature-desc{font-size:clamp(14.5px, 1.5vw, 16.5px); line-height:1.65; max-width:none; color:var(--muted);}
@media (max-width:760px){ .init-list .init-feature{grid-template-columns:1fr; row-gap:10px;} }

/* ---- Our Mission: smaller, with the yellow back ---- */
.mission-section{padding:clamp(44px, 7vw, 84px) 0;}
.mission-section .section-title{color:var(--yellow); border-bottom-color:var(--yellow); font-size:clamp(1.15rem, 2.6vw, 1.6rem); letter-spacing:.2em; padding-bottom:12px; margin-bottom:20px;}
.mission-statement{font-size:clamp(1.5rem, 4vw, 2.7rem); max-width:24ch;}
.mission-statement u{text-decoration-color:var(--yellow);}
@media (min-width:900px){ .mission-statement{max-width:30ch;} }
.mission-statement{text-wrap:balance;}

/* ============ WHY JOIN v3: four chapters ============ */
.mission-statement b{font-weight:700; color:var(--yellow);}
.mission-sub{margin:22px auto 0; max-width:46ch; color:var(--muted); font-size:clamp(14.5px,1.7vw,17px); line-height:1.55;}


/* Programs: one list, photo + name + one line; blurb opens on tap */
.prog-list{max-width:1040px; margin:6px auto 0; border-top:1px solid var(--line-2);}
.prog{border-bottom:1px solid var(--line-2);}
.prog summary{list-style:none; cursor:pointer; display:grid; grid-template-columns:clamp(120px,20vw,210px) 1fr 28px; gap:clamp(16px,3vw,32px); align-items:center; padding:clamp(16px,2.4vw,24px) 4px;}
.prog summary::-webkit-details-marker{display:none;}
.prog-photo{position:relative; display:block; aspect-ratio:4/3; border-radius:var(--radius); overflow:hidden; background:var(--bg-3);}
.prog-photo img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s var(--ease);}
.prog summary:hover .prog-photo img{transform:scale(1.05);}
.prog-badge{position:absolute !important; right:8px; bottom:8px; width:clamp(40px,6vw,58px) !important; height:auto !important; aspect-ratio:1; border-radius:50%; background:#fff; object-fit:contain !important; padding:2px; box-shadow:0 2px 10px rgba(0,0,0,.4);}
.prog-text{display:block; min-width:0;}
.prog-name{display:block; font-family:var(--display); font-weight:700; text-transform:uppercase; color:#fff; font-size:clamp(1.35rem,2.8vw,2rem); line-height:1.08; letter-spacing:.005em;}
.prog-short{display:block; margin-top:8px; color:var(--muted); font-size:clamp(14px,1.5vw,16.5px); line-height:1.45;}
.prog-plus{position:relative; width:22px; height:22px; justify-self:end;}
.prog-plus::before,.prog-plus::after{content:""; position:absolute; left:50%; top:50%; width:16px; height:2px; background:#fff; transform:translate(-50%,-50%); transition:transform .3s var(--ease);}
.prog-plus::after{transform:translate(-50%,-50%) rotate(90deg);}
.prog[open] .prog-plus::after{transform:translate(-50%,-50%) rotate(0deg);}
.prog-long{padding:0 4px clamp(20px,3vw,30px); margin-left:calc(clamp(120px,20vw,210px) + clamp(16px,3vw,32px)); max-width:68ch; color:var(--muted); font-size:clamp(14.5px,1.55vw,16.5px); line-height:1.7;}
.prog summary:focus-visible{outline:2px solid #fff; outline-offset:2px;}
@media (max-width:640px){
  .prog summary{grid-template-columns:96px 1fr 22px; gap:14px;}
  .prog-long{margin-left:0;}
  .prog-name{font-size:1.2rem;}
  .prog-short{font-size:13.5px; margin-top:5px;}
}

/* Impact extras */
.impact-sub{margin:-6px 0 22px; color:var(--muted); font-size:15px;}
.impact-bar{width:min(220px,80%); height:6px; border-radius:3px; background:var(--line-2); margin:12px auto 0; overflow:hidden;}
.impact-bar i{display:block; height:100%; background:#fff; border-radius:3px;}

/* Closing ask */
.join-price-line{font-family:var(--ui); font-weight:500; color:var(--ink); letter-spacing:.03em; margin:0 auto 24px !important;}

/* Mission: keep the three key words white (yellow stays on the title and Varsity underline only) */
.mission-statement b{color:inherit; font-weight:inherit;}

/* Logo-only program image (Tackle Montana) */
.prog-photo-logo{background:#fff;}
.prog-photo-logo img{object-fit:contain; padding:6px;}
.prog summary:hover .prog-photo-logo img{transform:none;}

/* ---- Impact: three equal-size numbers, each its own colour ---- */
.impact-compact .impact-grid{grid-template-columns:1fr; max-width:760px;}
.impact-compact .impact-cell, .impact-compact .impact-cell.hero{padding:clamp(22px,3.6vw,34px) 16px; text-align:center;}
.impact-compact .impact-cell .num, .impact-compact .impact-cell.hero .num{font-size:clamp(3.4rem,13vw,7rem); line-height:.95;}
.impact-compact .impact-cell .lab, .impact-compact .impact-cell.hero .lab{font-size:clamp(12px,2vw,15px); margin-top:10px;}
.impact-compact .impact-cell:nth-child(1) .num{color:#5BB8FF;}
.impact-compact .impact-cell:nth-child(2) .num{color:#4ADE9A;}
.impact-compact .impact-cell:nth-child(3) .num{color:#FF8A4C;}
.impact-compact .impact-cell:nth-child(3) .impact-bar i{background:#FF8A4C;}

/* ---- Lock the page to vertical scrolling only (no sideways drag on iPhone) ---- */
html, body{overscroll-behavior-x:none; touch-action:pan-y pinch-zoom;}
html{max-width:100%;}
.site{overflow-x:clip; max-width:100vw;}

/* Phones: reveal from below, never from the side (a sideways start lets iOS pan left/right) */
@media (max-width:900px){
  .reveal.reveal-l, .reveal.reveal-r{transform:translateY(24px);}
  .reveal.reveal-l.is-visible, .reveal.reveal-r.is-visible{transform:none;}
}

/* ---- Home: Who We Are + scroll cue ---- */
.who-section{padding:clamp(64px,10vw,120px) 0;}
.who-statement{max-width:24ch; font-size:clamp(1.6rem,4.6vw,3.3rem);}
@media (min-width:900px){ .who-statement{max-width:28ch;} }
.scroll-hint{position:absolute; bottom:26px; z-index:3;}
.scroll-hint .ln::after{background:#fff;}
@media (max-width:900px){ .scroll-hint{bottom:84px;} }
.vhero{height:calc(100vh - var(--hdr,65px)); height:calc(100svh - var(--hdr,65px)); min-height:480px;}
.who-section, .who-section.elev{background:#040506;}

/* ---- Home: more about us + explore links ---- */
.who-more{max-width:62ch; margin:clamp(22px,3vw,34px) auto 0; color:var(--muted); font-size:clamp(15px,1.7vw,18px); line-height:1.7;}
.explore{max-width:960px; margin:clamp(44px,6vw,72px) auto 0; display:grid; grid-template-columns:repeat(3,1fr); gap:0 clamp(16px,3vw,36px); text-align:left;}
.explore-head{grid-column:1 / -1; font-family:var(--ui); font-weight:500; font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); text-align:center; margin-bottom:22px;}
.explore-item{position:relative; display:flex; flex-direction:column; gap:8px; padding:22px 4px 24px; border-top:1px solid rgba(255,255,255,.28); text-decoration:none; color:inherit; transition:border-color .25s var(--ease);}
.explore-item:hover, .explore-item:focus-visible{border-top-color:#fff;}
.explore-name{font-family:var(--display); font-weight:700; text-transform:uppercase; letter-spacing:.01em; color:#fff; font-size:clamp(1.3rem,2.4vw,1.75rem); line-height:1.1;}
.explore-desc{color:var(--muted); font-size:14.5px; line-height:1.45; padding-right:28px;}
.explore-arrow{position:absolute; right:4px; bottom:24px; color:#fff; font-size:20px; transition:transform .25s var(--ease);}
.explore-item:hover .explore-arrow{transform:translateX(5px);}
@media (max-width:760px){
  .explore{grid-template-columns:1fr;}
  .explore-item{padding:18px 4px 20px;}
  .explore-arrow{bottom:20px;}
}