:root{
  --void:#05090D;
  --navy:#0A1622;
  --navy2:#0E2033;
  --panel: rgba(16,32,48,0.55);
  --line: rgba(200,214,228,0.10);
  --chrome-1:#C9D3DC;
  --chrome-2:#F5F8FA;
  --chrome-3:#7C8896;
  --ice:#EFF3F6;
  --accent:#3D8BFF;
  --accent-dim: rgba(61,139,255,0.16);
  --mono:'IBM Plex Mono', monospace;
  --display:'Anton', sans-serif;
  --body:'IBM Plex Sans', sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{ background:var(--navy); color:var(--ice); font-family:var(--body); overflow-x:hidden; position:relative;}
a{color:inherit; text-decoration:none;}
button{ font:inherit; color:inherit; background:none; border:none; cursor:pointer; }

/* ambient backdrop */
#bg-canvas{
  position:fixed; inset:0; z-index:0; pointer-events:none; width:100%; height:100%; display:block;
}
.bg-glow{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(ellipse 45% 35% at 85% 5%, rgba(61,139,255,0.16), transparent),
    radial-gradient(ellipse 50% 40% at 5% 90%, rgba(124,136,150,0.12), transparent),
    radial-gradient(ellipse 60% 45% at 50% 100%, rgba(61,139,255,0.08), transparent);
}
main, nav, footer{ position:relative; z-index:1; }

.chrome-text{
  background:linear-gradient(180deg, var(--chrome-2) 0%, var(--chrome-1) 45%, var(--chrome-3) 55%, var(--chrome-2) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* ---------- NAV ---------- */
nav{
  position:sticky; top:0; z-index:50; display:flex; align-items:center; justify-content:space-between;
  padding:16px 5vw; background:rgba(5,9,13,0.72); backdrop-filter: blur(14px);
  border-bottom:1px solid var(--line);
}
.logo{ font-family:var(--display); font-weight:900; font-size:21px; letter-spacing:.5px; display:flex; align-items:center; gap:10px;}
.logo .dot{ width:9px; height:9px; border-radius:50%; background:var(--accent); box-shadow:0 0 12px var(--accent); animation:pulse 1.6s ease-in-out infinite;}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
.navlinks{ display:flex; gap:30px; font-size:12px; font-weight:600; letter-spacing:1.2px; text-transform:uppercase;}
.navlinks a{ opacity:.6; transition:opacity .2s, color .2s; position:relative; padding-bottom:4px;}
.navlinks a:hover{ opacity:1; color:var(--accent);}
.navlinks a[aria-current="page"]{ opacity:1; color:var(--accent);}
.navlinks a[aria-current="page"]::after{
  content:''; position:absolute; left:0; right:0; bottom:-2px; height:2px; background:var(--accent); box-shadow:0 0 8px var(--accent);
}
.mobile-panel a[aria-current="page"]{ color:var(--accent); }
.nav-right{ display:flex; align-items:center; gap:18px; }
.nav-cta{
  font-family:var(--mono); font-size:11px; font-weight:600; letter-spacing:1.2px;
  background:linear-gradient(135deg, var(--chrome-2), var(--chrome-1) 40%, var(--chrome-3));
  color:var(--void); padding:10px 18px; border-radius:2px; text-transform:uppercase;
  box-shadow:0 0 0 rgba(61,139,255,0); transition:box-shadow .25s, transform .15s;
  display:inline-block;
}
.nav-cta:hover{ box-shadow:0 0 24px rgba(61,139,255,.4); transform:translateY(-1px);}

.nav-burger{ display:none; width:34px; height:34px; position:relative; }
.nav-burger span{ position:absolute; left:6px; right:6px; height:2px; background:var(--ice); transition:transform .25s, opacity .2s; }
.nav-burger span:nth-child(1){ top:11px; }
.nav-burger span:nth-child(2){ top:17px; }
.nav-burger span:nth-child(3){ top:23px; }
.nav-burger.open span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.nav-burger.open span:nth-child(2){ opacity:0; }
.nav-burger.open span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

.mobile-panel{
  position:fixed; inset:0 0 auto 0; top:65px; z-index:49; background:rgba(5,9,13,0.97); backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line); padding:26px 6vw 34px; display:flex; flex-direction:column; gap:22px;
  transform:translateY(-12px); opacity:0; pointer-events:none; transition:transform .25s ease, opacity .2s ease;
}
.mobile-panel.open{ transform:translateY(0); opacity:1; pointer-events:auto; }
.mobile-panel a{ font-family:var(--display); font-weight:700; font-size:22px; text-transform:uppercase; letter-spacing:.5px; }
.mobile-panel .nav-cta{ align-self:flex-start; }

@media (max-width:820px){
  .navlinks{display:none;}
  .nav-burger{ display:block; }
  .nav-right .nav-cta{ display:none; }
}
@media (min-width:821px){ .mobile-panel{ display:none; } }

/* ---------- TICKER ---------- */
.ticker-wrap{ background:var(--navy2); border-bottom:1px solid var(--line); overflow:hidden; white-space:nowrap; padding:7px 0;}
.ticker{ display:inline-block; font-family:var(--mono); font-size:11px; letter-spacing:1.5px; color:var(--accent); animation:scroll-left 28s linear infinite;}
.ticker span{ margin:0 26px; color:var(--ice); opacity:.65;}
.ticker span b{ color:var(--accent); opacity:1;}
@keyframes scroll-left{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ---------- HERO ---------- */
.hero{ padding:96px 5vw 50px; }
.hero-grid{
  display:grid; grid-template-columns:1.35fr 1fr; gap:36px 5vw; align-items:end;
  max-width:1400px; margin:0 auto;
}
.hero-tag{
  font-family:var(--mono); font-size:11px; letter-spacing:2px; color:var(--accent); text-transform:uppercase;
  margin-bottom:20px; display:inline-flex; align-items:baseline; gap:10px;
  border-left:2px solid var(--accent); padding-left:10px;
}
.hero-title{ margin:0; }
.hero-title .flap-line{
  display:flex; flex-wrap:wrap; gap:.02em; font-family:var(--display); font-weight:400;
  font-size:clamp(72px, 12vw, 188px); line-height:.8; text-transform:uppercase; letter-spacing:0;
}
.flap{ display:inline-block; }

.hero-eyebrow{
  font-family:var(--mono); font-size:11px; letter-spacing:3px; color:var(--accent); text-transform:uppercase;
  margin-bottom:22px; display:inline-flex; align-items:center; gap:10px;
}
.hero-eyebrow::before, .hero-eyebrow::after{ content:''; width:26px; height:2px; background:var(--accent); display:inline-block;}

.hero-copy-col{ padding-bottom:6px; }
.hero-kicker{ font-family:var(--mono); font-size:13px; letter-spacing:1.5px; text-transform:uppercase; color:var(--ice); opacity:.85; margin:0 0 14px; }
.hero-sub{ margin:0; max-width:42ch; font-size:15px; line-height:1.7; color:var(--ice); opacity:.65;}
.hero-actions{ margin-top:26px; display:flex; gap:14px; flex-wrap:wrap; align-items:flex-start;}
.hero-cta-primary{ display:flex; flex-direction:column; align-items:center; }

@media (max-width:900px){
  .hero-grid{ grid-template-columns:1fr; align-items:start; }
  .hero-title .flap-line{ font-size:clamp(56px, 17vw, 100px); }
}
.btn{ font-family:var(--mono); font-size:12px; font-weight:600; letter-spacing:1px; text-transform:uppercase; padding:15px 26px; border-radius:2px; display:inline-flex; align-items:center; gap:10px; border:1px solid transparent; transition:transform .15s ease, box-shadow .25s; position:relative; overflow:hidden;}
.btn-primary{ background:linear-gradient(135deg, #5AA6FF, var(--accent) 60%, #1D5FCC); color:#fff;}
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 8px 30px rgba(61,139,255,.4);}
.btn-ghost{ border-color:var(--line); color:var(--ice);}
.btn-ghost:hover{ border-color:var(--chrome-1); transform:translateY(-2px);}

.btn::after{
  content:''; position:absolute; top:0; left:-60%; width:40%; height:100%;
  background:linear-gradient(115deg, transparent, rgba(255,255,255,.35), transparent);
  transform:skewX(-20deg); transition:left .5s ease;
}
.btn:hover::after{ left:130%; }

/* ---------- COIN BADGE ---------- */
.badge-wrap{ display:flex; justify-content:center; margin-top:18px; }
.badge-coin{ width:112px; height:112px; perspective:700px; }
.badge-coin-inner{ position:relative; width:100%; height:100%; transform-style:preserve-3d; animation:coin-spin 7s linear infinite; }
.badge-face{
  position:absolute; inset:0; border-radius:50%; backface-visibility:hidden; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:2px;
  background:conic-gradient(from 140deg, var(--chrome-2), var(--chrome-1) 25%, var(--chrome-3) 50%, var(--chrome-1) 75%, var(--chrome-2));
  border:2px solid rgba(255,255,255,.5); box-shadow:0 10px 30px rgba(0,0,0,.55), inset 0 0 18px rgba(0,0,0,.25);
}
.badge-face .mono{ font-family:var(--mono); font-size:8px; letter-spacing:1.5px; color:var(--void); opacity:.75; }
.badge-face .rg{ font-family:var(--display); font-weight:900; font-size:26px; color:var(--void); line-height:1; }
.badge-face.back{ transform:rotateY(180deg); }
.badge-face.back .laces{ display:flex; gap:5px; }
.badge-face.back .laces span{ width:3px; height:34px; background:var(--void); opacity:.6; border-radius:2px; }
@keyframes coin-spin{ from{ transform:rotateY(0deg); } to{ transform:rotateY(360deg); } }


/* ---------- INSTANT REPLAY REEL ---------- */
.field-section{ padding:80px 4vw 130px; }
.field-header{ text-align:center; margin-bottom:50px; }
.field-title{ font-family:var(--display); font-weight:900; font-size:clamp(30px,4vw,48px); text-transform:uppercase;}
.field-note{ font-family:var(--mono); font-size:12px; letter-spacing:1.5px; opacity:.55; text-transform:uppercase; margin-top:10px;}

.reel-wrap{ max-width:1080px; margin:0 auto; }
.reel-monitor{
  position:relative; border-radius:14px; border:1px solid var(--line);
  background:linear-gradient(180deg, #0C1C2C 0%, #071119 100%);
  box-shadow: 0 0 0 1px rgba(0,0,0,.5), 0 40px 110px rgba(0,0,0,.6), inset 0 0 140px rgba(0,0,0,.55);
  overflow:hidden;
}
.reel-scanline{
  position:absolute; left:0; right:0; height:150px;
  background:linear-gradient(180deg, transparent, rgba(61,139,255,0.12), transparent);
  animation: scan 5.5s linear infinite; pointer-events:none; z-index:2;
}
@keyframes scan{ 0%{ top:-150px } 100%{ top:100% } }

.reel-topbar{
  position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between;
  padding:16px 24px; border-bottom:1px solid rgba(200,214,228,0.14);
  background:linear-gradient(180deg, rgba(124,136,150,0.14), transparent);
}
.reel-live{
  display:flex; align-items:center; gap:8px; font-family:var(--mono); font-weight:600;
  font-size:13px; letter-spacing:2.5px; color:#ff4d4d; text-transform:uppercase;
}
.reel-dot{ width:8px; height:8px; border-radius:50%; background:#ff4d4d; box-shadow:0 0 10px rgba(255,77,77,.8); animation:pulse 1.6s ease-in-out infinite; }
.reel-timecode{ font-family:var(--mono); font-size:13px; letter-spacing:1px; color:var(--accent); opacity:.8; font-variant-numeric:tabular-nums; }

.reel-strip{
  position:relative; z-index:1; display:flex; padding:0 8px;
}
.frame{
  flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px;
  min-height:170px; padding:20px 14px; border:none; border-right:1px dashed rgba(200,214,228,0.18);
  background:rgba(255,255,255,0); cursor:pointer; text-align:center; transition:background .2s;
}
.frame:last-child{ border-right:none; }
.frame:hover, .frame:focus-visible{ background:rgba(61,139,255,0.12); }
.frame-num{ font-family:var(--mono); font-size:12px; font-weight:600; color:var(--accent); opacity:.8; }
.frame-name{ font-family:var(--display); font-weight:400; font-size:clamp(15px,1.6vw,20px); text-transform:uppercase; color:var(--ice); letter-spacing:.02em; line-height:1.15; }
.frame-arrow{ font-family:var(--mono); font-size:16px; color:var(--chrome-1); opacity:.35; transition:opacity .2s, transform .2s, color .2s; }
.frame:hover .frame-arrow, .frame:focus-visible .frame-arrow{ opacity:1; transform:translateY(3px); color:var(--accent); }
.frame.current{ cursor:default; background:rgba(61,139,255,0.09); }
.frame-here{ font-family:var(--mono); font-size:10.5px; font-weight:600; letter-spacing:1.5px; color:var(--accent); text-transform:uppercase; }

.reel-track{ position:relative; z-index:1; height:1px; background:rgba(200,214,228,0.16); margin:0 24px; }
.reel-playhead{
  position:absolute; top:-4px; width:2px; height:9px; background:var(--accent);
  box-shadow:0 0 8px rgba(61,139,255,.9); left:8.33%; transform:translateX(-50%);
  transition:left .18s ease-out, opacity .18s ease-out; opacity:0;
}
.reel-playhead.active{ opacity:1; }

.reel-perf{
  position:relative; z-index:1; height:14px;
  background-image:radial-gradient(circle, rgba(200,214,228,0.22) 2px, transparent 2px);
  background-size:22px 100%; background-position:11px center;
}

.field-hud{ display:flex; justify-content:space-between; font-family:var(--mono); font-size:11.5px; letter-spacing:1.5px; color:var(--accent); opacity:.65; margin-top:18px; text-transform:uppercase;}

@media (max-width:700px){
  .reel-strip{ flex-direction:column; padding:0; }
  .frame{ flex-direction:row; justify-content:flex-start; gap:18px; min-height:80px; padding:0 clamp(20px,4vw,40px); border-right:none; border-top:1px solid rgba(200,214,228,0.14); text-align:left; }
  .frame:first-child{ border-top:none; }
  .frame-name{ font-size:clamp(19px,5.5vw,26px); flex:1; }
  .frame-arrow{ transform:none; }
  .frame:hover .frame-arrow, .frame:focus-visible .frame-arrow{ transform:translateX(6px); }
  .reel-track, .reel-perf{ display:none; }
}

/* ---------- PAGE HEADER (subpages) ---------- */
.page-header{ padding:100px 5vw 30px; text-align:center; }
.page-header .hero-eyebrow{ margin-bottom:20px; }
.page-header h1{
  font-family:var(--display); font-weight:900; font-size:clamp(36px,6vw,68px); text-transform:uppercase; line-height:.98;
}
.page-header p{ margin:20px auto 0; max-width:56ch; font-size:15px; line-height:1.7; opacity:.65; }
.back-home{
  display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:11px; letter-spacing:1.5px;
  text-transform:uppercase; opacity:.55; margin-bottom:26px; transition:opacity .2s, color .2s;
}
.back-home:hover{ opacity:1; color:var(--accent); }

/* ---------- SECTIONS ---------- */
.section{ padding:100px 5vw; }
.section-head{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:56px; flex-wrap:wrap; gap:16px;}
.section-title{ font-family:var(--display); font-weight:900; font-size:clamp(28px,3.4vw,44px); text-transform:uppercase;}
.section-note{ font-family:var(--mono); font-size:12px; letter-spacing:1.5px; opacity:.5; text-transform:uppercase;}
.section-lead{ max-width:64ch; font-size:15px; line-height:1.8; opacity:.7; }

.quarters{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.quarters.three-up{ grid-template-columns:repeat(3,1fr); max-width:900px; margin:0 auto; }
.tilt-card{
  position:relative; background:var(--panel); border:1px solid var(--line); border-radius:8px;
  padding:30px 22px; overflow:hidden; backdrop-filter:blur(8px);
  transform-style:preserve-3d; will-change:transform;
  transition:transform .12s ease-out, border-color .2s;
}
.tilt-card:hover{ border-color:rgba(61,139,255,.4); }
.tilt-glow{
  position:absolute; inset:0; opacity:0; transition:opacity .3s;
  background: radial-gradient(220px circle at var(--mx,50%) var(--my,50%), rgba(61,139,255,.18), transparent 60%);
}
.tilt-card:hover .tilt-glow{ opacity:1; }
.quarter-tag{ font-family:var(--mono); font-size:11px; color:var(--accent); letter-spacing:2px; position:relative;}
.tilt-card h3{ font-family:var(--display); font-weight:700; font-size:21px; text-transform:uppercase; margin:14px 0 10px; position:relative;}
.tilt-card p{ font-size:13.5px; line-height:1.6; opacity:.65; position:relative;}
@media (max-width:900px){ .quarters{grid-template-columns:repeat(2,1fr);} .quarters.three-up{grid-template-columns:repeat(2,1fr); max-width:600px;} }
@media (max-width:520px){ .quarters{grid-template-columns:1fr;} .quarters.three-up{grid-template-columns:1fr; max-width:320px;} }

/* ---------- TRADING CARDS (Verified Moments) ---------- */
.card-series{ margin-top:70px; }
.card-series:first-of-type{ margin-top:40px; }
.card-series-head{ display:flex; align-items:baseline; gap:16px; flex-wrap:wrap; margin-bottom:26px; }
.card-series-head h3{ font-family:var(--display); font-weight:800; font-size:clamp(20px,2.4vw,28px); text-transform:uppercase; }
.card-series-head .series-note{ font-family:var(--mono); font-size:11.5px; letter-spacing:1px; opacity:.55; }

.card-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:34px 22px; }
@media (max-width:900px){ .card-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .card-grid{ grid-template-columns:1fr; max-width:280px; margin:0 auto; } }

.trading-card{ position:relative; perspective:1200px; }
.trading-card-inner{
  position:relative; border-radius:18px; padding:9px;
  background:conic-gradient(from 140deg, var(--chrome-2), var(--chrome-1) 25%, var(--chrome-3) 50%, var(--chrome-1) 75%, var(--chrome-2));
  box-shadow:0 25px 55px rgba(0,0,0,.55), 0 0 0 1px rgba(0,0,0,.4);
  transform-style:preserve-3d; will-change:transform; transition:transform .12s ease-out, box-shadow .2s;
}
.trading-card:hover .trading-card-inner{ box-shadow:0 30px 70px rgba(0,0,0,.6), 0 0 30px rgba(61,139,255,.3); }
.trading-card-face{
  position:relative; background:var(--navy2); border-radius:11px; overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.3), inset 0 0 0 3px rgba(5,9,13,.55);
}
/* holo foil sheen sweeping the full card on hover */
.trading-card-face::before{
  content:''; position:absolute; inset:0; z-index:3; pointer-events:none; opacity:0; transition:opacity .25s;
  background:linear-gradient(115deg, transparent 30%, rgba(255,80,180,.18) 42%, rgba(120,180,255,.22) 50%, rgba(255,220,120,.18) 58%, transparent 70%);
  background-size:250% 250%; background-position:0% 0%;
  mix-blend-mode:screen;
}
.trading-card:hover .trading-card-face::before{ opacity:1; background-position:100% 100%; transition:opacity .25s, background-position 1s ease; }

.card-label-bar{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:7px 12px; background:linear-gradient(115deg, #12233a, #0A1622 55%, #1a3350);
  border-bottom:1px solid rgba(255,255,255,.12);
}
.card-label-bar .brand{ font-family:var(--display); font-weight:800; font-size:11px; letter-spacing:1px; color:var(--chrome-2); text-transform:uppercase; }
.card-label-bar .verified{ font-family:var(--mono); font-size:8px; letter-spacing:1px; color:var(--accent); display:flex; align-items:center; gap:4px; }
.card-label-bar .verified::before{ content:''; width:5px; height:5px; border-radius:50%; background:var(--accent); box-shadow:0 0 6px var(--accent); }

.card-photo-window{ position:relative; aspect-ratio:3/4; overflow:hidden; border-top:1px solid rgba(255,255,255,.08); border-bottom:1px solid rgba(0,0,0,.4); }
.card-photo-window img{ width:100%; height:100%; object-fit:cover; display:block; filter:saturate(1.05) contrast(1.03); }
.card-photo-window::after{
  content:''; position:absolute; top:0; left:-60%; width:45%; height:100%;
  background:linear-gradient(115deg, transparent, rgba(255,255,255,.4), transparent);
  transform:skewX(-20deg); transition:left .6s ease; pointer-events:none;
}
.trading-card:hover .card-photo-window::after{ left:140%; }

.card-cert-strip{ padding:10px 12px 13px; background:linear-gradient(180deg, rgba(255,255,255,.02), transparent); }
.card-cert-strip .serial{ font-family:var(--mono); font-size:9px; letter-spacing:1.2px; color:var(--accent); opacity:.85; text-transform:uppercase; }
.card-cert-strip .caption{ font-family:var(--body); font-size:12.5px; line-height:1.4; opacity:.85; margin-top:4px; }

/* Team profile variant of the trading card */
.card-grid.profiles{ grid-template-columns:repeat(3,1fr); }
@media (max-width:900px){ .card-grid.profiles{ grid-template-columns:1fr; max-width:340px; margin:0 auto; } }
.trading-card.profile-card .card-photo-window{ aspect-ratio:1/1; }
.card-cert-strip.profile{ padding:14px 16px 18px; }
.profile-name{ font-family:var(--display); font-weight:800; font-size:19px; text-transform:uppercase; letter-spacing:.3px; }
.profile-role{ font-family:var(--mono); font-size:11px; letter-spacing:1.5px; color:var(--accent); text-transform:uppercase; margin-top:3px; }
.profile-bio{ font-size:13px; line-height:1.6; opacity:.7; margin-top:10px; }
.profile-placeholder{
  width:100%; height:100%; display:flex; align-items:center; justify-content:center;
  font-family:var(--mono); font-size:11px; letter-spacing:1.5px; color:var(--chrome-3); text-transform:uppercase; text-align:center; padding:20px;
  background:linear-gradient(135deg, rgba(200,214,228,.06), rgba(200,214,228,.02));
}

/* ---------- TEAM COINS (Meet the Team) ---------- */
.team-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:56px 30px; max-width:820px; margin:54px auto 0; }
@media (max-width:800px){ .team-grid{ grid-template-columns:1fr; max-width:260px; gap:64px; } }

.team-card{ position:relative; perspective:1300px; width:100%; max-width:230px; margin:0 auto; cursor:pointer; }
.team-card-inner{
  position:relative; width:100%; aspect-ratio:1/1; transform-style:preserve-3d;
  transition:transform .6s cubic-bezier(.3,.7,.3,1);
}
.team-card.flipped .team-card-inner{ transform:rotateY(180deg); }
.team-card:focus-visible{ outline:2px solid var(--accent); outline-offset:8px; border-radius:50%; }

.team-face{
  position:absolute; inset:0; border-radius:50%; backface-visibility:hidden;
  background:conic-gradient(from 140deg, var(--chrome-2), var(--chrome-1) 25%, var(--chrome-3) 50%, var(--chrome-1) 75%, var(--chrome-2));
  padding:5px; box-shadow:0 22px 46px rgba(0,0,0,.5), inset 0 0 0 1px rgba(255,255,255,.15);
}
.team-face-inner{ position:relative; width:100%; height:100%; border-radius:50%; overflow:hidden; background:var(--navy2); }
.team-face.front .team-face-inner img{ width:100%; height:100%; object-fit:cover; display:block; filter:saturate(1.05) contrast(1.03); }
.team-face.front .team-face-inner::after{
  content:''; position:absolute; top:0; left:-70%; width:55%; height:100%;
  background:linear-gradient(115deg, transparent, rgba(255,255,255,.4), transparent);
  transform:skewX(-20deg); transition:left .7s ease; pointer-events:none;
}
.team-card:hover .team-face.front .team-face-inner::after{ left:150%; }
.team-face.back{ transform:rotateY(180deg); }
.team-face.back .team-face-inner{ display:flex; align-items:center; justify-content:center; padding:24px; text-align:center; }
.team-bio{ font-size:11.5px; line-height:1.55; opacity:.85; }
.team-monogram{ font-family:var(--display); font-weight:900; font-size:34px; color:var(--void); opacity:.65; }

.team-caption{ text-align:center; margin-top:22px; }
.team-name{ font-family:var(--display); font-weight:800; font-size:19px; text-transform:uppercase; }
.team-role{ font-family:var(--mono); font-size:11px; letter-spacing:1.5px; color:var(--accent); text-transform:uppercase; margin-top:4px; }
.team-hint{ font-family:var(--mono); font-size:9px; letter-spacing:1px; opacity:.4; text-transform:uppercase; margin-top:9px; }

/* ---------- FLIP CARDS (Get Involved roster) ---------- */
.flip-card{ background:none; border:none; padding:0; perspective:1400px; height:220px; width:100%; text-align:left; cursor:pointer; }
.flip-card:focus-visible{ outline:2px solid var(--accent); outline-offset:4px; border-radius:8px; }
.flip-card-inner{
  position:relative; width:100%; height:100%; transform-style:preserve-3d;
  transition:transform .55s cubic-bezier(.3,.7,.3,1);
}
.flip-card.flipped .flip-card-inner{ transform:rotateY(180deg); }
.flip-face{
  position:absolute; inset:0; backface-visibility:hidden; border-radius:8px; border:1px solid var(--line);
  background:var(--panel); padding:26px 22px; backdrop-filter:blur(8px); display:flex; flex-direction:column;
}
.flip-face.back{ transform:rotateY(180deg); justify-content:space-between; border-color:rgba(61,139,255,.35); }
.flip-face .quarter-tag{ display:block; }
.flip-face h3{ font-family:var(--display); font-weight:700; font-size:21px; text-transform:uppercase; margin:14px 0 10px; }
.flip-face p{ font-size:13.5px; line-height:1.6; opacity:.7; }
.flip-hint{ margin-top:auto; font-family:var(--mono); font-size:10px; letter-spacing:1.5px; text-transform:uppercase; opacity:.4; }
.flip-face.back .roster-cta{ font-family:var(--mono); font-size:12px; letter-spacing:1.5px; color:var(--accent); text-transform:uppercase; }
@media (max-width:520px){ .flip-card{ height:250px; } }

.impact{ background:var(--navy2); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.impact-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.impact-cell{ padding:34px 22px; position:relative; overflow:hidden; transform-style:preserve-3d;}
.impact-num{ font-family:var(--display); font-weight:900; font-size:clamp(32px,3.6vw,50px); line-height:1; position:relative;}
.impact-label{ font-family:var(--mono); font-size:11px; letter-spacing:1.5px; text-transform:uppercase; opacity:.6; margin-top:10px; position:relative;}
@media (max-width:900px){ .impact-grid{grid-template-columns:repeat(2,1fr);} }

/* ---------- FAQ ---------- */
.faq-list{ max-width:760px; margin:0 auto; display:flex; flex-direction:column; gap:12px; }
.faq-item{ border:1px solid var(--line); border-radius:8px; background:var(--panel); overflow:hidden; }
.faq-q{
  width:100%; text-align:left; padding:20px 22px; display:flex; align-items:center; justify-content:space-between; gap:16px;
  font-family:var(--display); font-weight:700; font-size:17px; text-transform:uppercase; letter-spacing:.3px;
}
.faq-q .num{ font-family:var(--mono); color:var(--accent); font-size:12px; margin-right:14px; }
.faq-q .chevron{ font-family:var(--mono); color:var(--chrome-1); transition:transform .25s; flex-shrink:0; }
.faq-item.open .chevron{ transform:rotate(135deg); }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .3s ease; }
.faq-a p{ padding:0 22px 20px 58px; font-size:14px; line-height:1.7; opacity:.7; max-width:60ch; }
.faq-item.open .faq-a{ max-height:220px; }

/* ---------- DONATE FORM ---------- */
.cta{ padding:120px 5vw; text-align:center; background:linear-gradient(180deg, var(--navy), var(--void)); }
.cta h2{ font-family:var(--display); font-weight:900; text-transform:uppercase; font-size:clamp(30px,5vw,60px); max-width:16ch; margin:0 auto 24px; line-height:1.02;}
.cta h2 em{ font-style:normal;}
.cta > p{ opacity:.65; max-width:52ch; margin:0 auto 36px; font-size:15px; line-height:1.7;}

.donate-panel{
  max-width:560px; margin:0 auto; background:var(--panel); border:1px solid var(--line); border-radius:10px;
  padding:36px; text-align:left; backdrop-filter:blur(10px);
}
.donate-field{ margin-bottom:16px; }
.donate-field label{ display:block; font-family:var(--mono); font-size:10.5px; letter-spacing:1.5px; text-transform:uppercase; opacity:.55; margin-bottom:8px; }
.contact-links{ display:flex; flex-wrap:wrap; gap:10px 22px; margin-top:14px; }
.contact-links a{ font-family:var(--mono); font-size:13px; letter-spacing:.5px; color:var(--accent); text-decoration:none; border-bottom:1px solid transparent; transition:border-color .2s, opacity .2s; }
.contact-links a:hover{ border-color:var(--accent); }
.btn:focus-visible, .faq-q:focus-visible, .nav-burger:focus-visible{
  outline:2px solid var(--accent); outline-offset:2px;
}

/* ---------- DONATE EMBED (real HCB form) ---------- */
.donate-embed-panel{
  max-width:640px; margin:36px auto 0; border-radius:14px; padding:3px;
  background:conic-gradient(from 140deg, var(--chrome-2), var(--chrome-1) 25%, var(--chrome-3) 50%, var(--chrome-1) 75%, var(--chrome-2));
  box-shadow:0 35px 90px rgba(0,0,0,.6);
}
.donate-embed-inner{ background:var(--navy2); border-radius:11px; overflow:hidden; }
.donate-embed-inner iframe{ display:block; width:100%; height:min(80vh, 780px); border:0; background:#fff; }
.donate-embed-note{ margin-top:16px; font-family:var(--mono); font-size:10.5px; opacity:.45; letter-spacing:.5px; text-align:center; }

footer{ padding:34px 5vw; border-top:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; font-family:var(--mono); font-size:11px; opacity:.45; letter-spacing:1px; flex-wrap:wrap; gap:10px;}
.footer-contact{ display:flex; gap:14px; flex-wrap:wrap; }
.footer-contact a{ color:inherit; text-decoration:none; }
.footer-contact a:hover{ color:var(--accent); opacity:1; }

@media (prefers-reduced-motion: reduce){ *{ animation:none !important; transition:none !important; } }