/* ═══════════════════════════════════════════════════════════
   FanFundU  ·  Marketing Homepage
   Rally Red #E12727 · Cream #F2E4B1 · Navy #1C2130 · Yellow #F99D20
   ═══════════════════════════════════════════════════════════ */

/* ── Tokens ── */
:root {
  /* Brand-family tokens alias to program theme tokens (--brand-*, set by
     shared/program-config.js). Fallbacks = FanFundU defaults. */
  --red:      var(--brand-primary, #E12727);
  --red-deep: var(--brand-primary-hover, #B81E1E);
  --red-soft: rgba(225,39,39,.10);
  --cream:    var(--brand-text-on-primary, #F2E4B1);
  --cream-s:  var(--brand-surface, #FAF4DC);
  --paper:    var(--brand-background, #FBF7E9);
  --navy:     var(--brand-secondary, #1C2130);
  --navy-2:   #2e3648;
  --ink:      #1C2130;
  --ink-2:    #5a6170;
  --ink-3:    #9aa0ac;
  --yellow:   var(--brand-accent, #F99D20);
  --white:    #ffffff;
  --line:     var(--brand-border, rgba(28,33,48,.10));
  --line-s:   rgba(28,33,48,.18);
  --r:        12px;
  --r-lg:     20px;
  --r-xl:     28px;
  --sh:       0 2px 4px rgba(28,33,48,.05), 0 16px 40px -16px rgba(28,33,48,.18);
  --sh-lg:    0 4px 8px rgba(28,33,48,.06), 0 32px 64px -24px rgba(28,33,48,.28);
  /* theme */
  --hero-bg:     #1C2130;
  --hero-fg:     #FBF7E9;
  --hero-muted:  rgba(251,247,233,.62);
  --nav-h:       72px;
}
[data-theme="stadium"] {
  --hero-bg:    #FBF7E9;
  --hero-fg:    #1C2130;
  --hero-muted: rgba(28,33,48,.58);
}

/* ── Reset ── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body {
  font-family:'REM',ui-sans-serif,system-ui,-apple-system,sans-serif;
  font-size:16px; line-height:1.5;
  background:var(--paper); color:var(--ink);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
a { text-decoration:none; color:inherit; }
button { font-family:inherit; }
img,svg { display:block; max-width:100%; }

/* ── Nav ── */
.hn {
  position:fixed; top:0; left:0; right:0; height:var(--nav-h);
  z-index:200; transition:background .28s, box-shadow .28s;
}
.hn.scrolled { background:var(--navy); box-shadow:0 2px 24px rgba(0,0,0,.22); }
[data-theme="stadium"] .hn.scrolled { background:var(--paper); box-shadow:0 1px 0 var(--line); }
.hn-inner {
  max-width:1280px; margin:0 auto; padding:0 36px;
  height:100%; display:flex; align-items:center; justify-content:space-between; gap:24px;
}
.hn-logo { height:34px; display:flex; align-items:center; }
.hn-logo img { height:100%; width:auto; }
.hn-links { display:flex; align-items:center; gap:28px; }
.hn-link {
  font-size:14px; font-weight:500; color:rgba(251,247,233,.78);
  transition:color .15s;
}
.hn-link:hover { color:var(--cream); }
.hn.scrolled .hn-link { color:rgba(251,247,233,.78); }
[data-theme="stadium"] .hn-link { color:var(--ink-2); }
[data-theme="stadium"] .hn-link:hover { color:var(--red); }
[data-theme="stadium"] .hn.scrolled .hn-link { color:var(--ink-2); }
.hn-sign { color:rgba(251,247,233,.58) !important; }
.hn-sign:hover { color:var(--cream) !important; }
[data-theme="stadium"] .hn-sign { color:var(--ink-2) !important; }
[data-theme="stadium"] .hn-sign:hover { color:var(--red) !important; }
.hn-cta {
  background:var(--red); color:var(--cream) !important;
  border-radius:999px; padding:10px 22px;
  font-size:12.5px; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
  box-shadow:0 3px 0 var(--red-deep);
  transition:transform .15s, box-shadow .15s;
}
.hn-cta:hover { transform:translateY(-1px); box-shadow:0 5px 0 var(--red-deep); }
@media(max-width:760px) { .hn-link:not(.hn-cta):not(.hn-sign) { display:none; } }

/* ── Hero ── */
.hh {
  background-color:var(--hero-bg);
  background-image:
    linear-gradient(to right, rgba(28,33,48,.97) 0%, rgba(28,33,48,.96) 42%, rgba(28,33,48,.55) 64%, rgba(28,33,48,.22) 100%),
    url('https://images.pexels.com/photos/1618200/pexels-photo-1618200.jpeg?auto=compress&cs=tinysrgb&w=1920');
  background-size:100% 100%, cover;
  background-position:0 0, center 40%;
  padding-top:var(--nav-h);
  min-height:72vh; display:flex; align-items:center;
  position:relative; overflow:hidden;
}
.hh::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background-image:repeating-linear-gradient(
    135deg, transparent 0, transparent 28px,
    rgba(255,255,255,.022) 28px, rgba(255,255,255,.022) 29px);
}
[data-theme="stadium"] .hh::before {
  background-image:repeating-linear-gradient(
    135deg, transparent 0, transparent 28px,
    rgba(28,33,48,.014) 28px, rgba(28,33,48,.014) 29px);
}
.hh::after {
  content:''; position:absolute; left:0; top:0; bottom:0;
  width:6px; background:var(--red);
}
[data-theme="stadium"] .hh::after { display:none; }
[data-theme="stadium"] .hh {
  background-image:
    linear-gradient(to right, rgba(251,247,233,.99) 0%, rgba(251,247,233,.98) 42%, rgba(251,247,233,.62) 64%, rgba(251,247,233,.30) 100%),
    url('https://images.pexels.com/photos/1618200/pexels-photo-1618200.jpeg?auto=compress&cs=tinysrgb&w=1920');
  background-size:100% 100%, cover;
  background-position:0 0, center 40%;
}

.hh-inner {
  max-width:1280px; width:100%; margin:0 auto;
  padding:56px 36px 48px;
  display:grid; grid-template-columns:1.1fr .9fr; gap:72px; align-items:center;
  position:relative; z-index:1;
}
.hh-inner > * { min-width:0; }
@media(max-width:960px) { .hh-inner { grid-template-columns:1fr; gap:44px; } .hh { min-height:auto; } }

/* Hero left */
.hh-ey {
  display:inline-flex; align-items:center; gap:10px;
  font-size:11.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--red); margin-bottom:22px;
}
.hh-ey .pill {
  background:var(--red); color:var(--cream);
  padding:4px 10px; border-radius:999px; font-size:10px; font-weight:700;
}
.hh-h1 {
  font-size:clamp(42px,5vw,70px); font-weight:900;
  line-height:.96; letter-spacing:-.03em;
  color:var(--hero-fg); margin-bottom:26px; text-wrap:balance;
}
.hh-h1 em {
  font-style:normal; color:var(--red);
  position:relative; display:inline-block; padding-bottom:10px;
}
.hh-h1 em::after {
  content:''; position:absolute; left:-2%; right:-8%; bottom:1px;
  height:13px; background:var(--red);
  clip-path:polygon(0% 38%, 100% 0%, 100% 55%, 100% 100%, 3% 100%);
  border-radius:2px;
}
.hh-sub {
  font-size:17.5px; line-height:1.62; color:var(--hero-muted);
  max-width:50ch; text-wrap:pretty; margin-bottom:36px;
}
.hh-trust { list-style:none; display:flex; flex-direction:column; gap:13px; }
.hh-trust li {
  display:flex; align-items:center; gap:10px;
  color:var(--hero-muted); font-size:14.5px; font-weight:500;
}
.hh-trust .icn {
  width:26px; height:26px; border-radius:999px; flex-shrink:0;
  background:rgba(225,39,39,.22); color:var(--red);
  display:inline-flex; align-items:center; justify-content:center;
}
[data-theme="stadium"] .hh-trust .icn { background:var(--red-soft); }

/* Hero right: CTA card */
.hh-card {
  background:#fff; border-radius:var(--r-xl);
  box-shadow:var(--sh-lg); padding:36px; position:relative;
}
.hh-card::before {
  content:''; position:absolute; top:-1px; left:36px;
  width:56px; height:5px; background:var(--red);
  border-bottom-left-radius:3px; border-bottom-right-radius:3px;
}
.hh-card-ey {
  font-size:11px; font-weight:700; letter-spacing:.13em;
  text-transform:uppercase; color:var(--red); margin-bottom:8px;
}
.hh-card-title {
  font-size:26px; font-weight:700; letter-spacing:-.02em;
  line-height:1.1; color:var(--ink); margin-bottom:6px;
}
.hh-card-sub { font-size:14px; color:var(--ink-2); margin-bottom:22px; }

.hh-email {
  display:flex; border:1.5px solid var(--line); border-radius:999px;
  overflow:hidden; background:#faf7ef; margin-bottom:12px;
  transition:border-color .15s, box-shadow .15s;
}
.hh-email:focus-within { border-color:var(--red); box-shadow:0 0 0 4px rgba(225,39,39,.10); }
.hh-email input {
  flex:1; min-width:0; width:100%; border:none; background:transparent;
  padding:14px 18px; font-family:'REM',sans-serif; font-size:15px; color:var(--ink);
}
.hh-email input:focus { outline:none; }
.hh-email input::placeholder { color:var(--ink-3); }
.hh-email button {
  border:none; background:var(--red); color:var(--cream);
  padding:10px 18px; margin:4px;
  font-family:'REM',sans-serif; font-size:12.5px; font-weight:700;
  letter-spacing:.05em; text-transform:uppercase;
  border-radius:999px; white-space:nowrap;
  transition:background .15s; cursor:pointer;
}
.hh-email button:hover { background:var(--red-deep); }
.hh-supp {
  display:block; text-align:center; font-size:13px;
  color:var(--ink-2); margin-bottom:20px;
}
.hh-supp a { color:var(--red); font-weight:700; }
.hh-badges {
  display:flex; gap:14px; justify-content:center; flex-wrap:wrap;
  padding-top:18px; border-top:1px solid var(--line);
}
.hh-badge {
  display:flex; align-items:center; gap:5px;
  font-size:12px; color:var(--ink-2); font-weight:600;
}
.hh-badge svg { color:var(--red); }

/* ── Card brand logos row ── */
.hh-card-brands {
  margin-top:16px; padding-top:16px;
  border-top:1px solid var(--line);
}
.hh-card-brands-lbl {
  font-size:10px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--ink-3); margin-bottom:10px;
}
.hh-card-brands-row {
  display:flex; align-items:center; justify-content:space-between; flex-wrap:nowrap; gap:8px; width:100%;
}
.hh-card-brand-item { display:inline-flex; flex-direction:column; align-items:center; gap:5px; width:56px; flex:0 0 auto; }
.hh-card-brand-tile {
  display:inline-flex; align-items:center; justify-content:center;
  width:52px; height:52px; padding:8px;
  background:#fff; border:1px solid #e2e6ef; border-radius:10px;
}
.hh-card-brand-name {
  font-size:9px; font-weight:600; color:var(--ink-3);
  max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  line-height:1; text-align:center;
}
@media(max-width:420px) {
  .hh-card-brands-row { flex-wrap:wrap; justify-content:flex-start; gap:8px 10px; }
}
.hh-card-brand-logo { width:100%; height:100%; object-fit:contain; }
.hh-card-brand-logo-fallback {
  font-family:'REM',sans-serif; font-size:10px; font-weight:800;
  line-height:1.1; text-align:center; overflow:hidden;
}
.hh-card-brand-more {
  font-size:11.5px; font-weight:700; color:var(--red);
  white-space:nowrap; flex:0 0 auto; text-align:center;
}

/* ── Hero brand strip (inside hero section, above fold) ── */
.hh-brand-strip {
  position:absolute; bottom:0; left:0; right:0;
  z-index:2;
  border-top:1px solid rgba(255,255,255,.10);
  background:rgba(16,20,32,.68);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  padding:20px 36px 24px;
}
.hh-bs-label {
  text-align:center;
  font-size:10.5px; font-weight:700; letter-spacing:.15em; text-transform:uppercase;
  color:rgba(242,228,177,.40); margin-bottom:18px;
}
.hh-bs-scroll { position:relative; }
.hh-bs-scroll::before,
.hh-bs-scroll::after {
  content:''; position:absolute; top:0; bottom:0;
  width:60px; z-index:2; pointer-events:none;
}
.hh-bs-scroll::before { left:0;  background:linear-gradient(to right, rgba(16,20,32,.8), transparent); }
.hh-bs-scroll::after  { right:0; background:linear-gradient(to left,  rgba(16,20,32,.8), transparent); }
.hh-bs-row {
  display:flex; align-items:center; justify-content:center;
  flex-wrap:wrap; gap:8px; padding:0 48px;
}
.hh-bs-chip {
  display:inline-flex; align-items:center; gap:9px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.11);
  border-radius:999px; padding:7px 16px 7px 7px;
  cursor:default;
  transition:background .18s, border-color .18s, transform .18s;
}
.hh-bs-chip:hover {
  background:rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.24);
  transform:translateY(-1px);
}
.hh-bs-dot {
  width:26px; height:26px; border-radius:50%; flex-shrink:0;
  display:inline-flex; align-items:center; justify-content:center;
  font-family:'REM',sans-serif; font-size:11px; font-weight:800;
  color:#fff; letter-spacing:0;
  text-shadow:0 1px 3px rgba(0,0,0,.45);
}
.hh-bs-name {
  font-family:'REM',sans-serif; font-size:13px; font-weight:700;
  color:rgba(242,228,177,.88); white-space:nowrap;
}
.hh-bs-more {
  border-style:dashed; border-color:rgba(225,39,39,.38);
  background:rgba(225,39,39,.07);
}
.hh-bs-more:hover { background:rgba(225,39,39,.14); border-color:rgba(225,39,39,.58); }
.hh-bs-plus { background:var(--red) !important; font-size:16px; font-weight:700; }
.hh-bs-more .hh-bs-name { color:var(--red); }

/* mobile: horizontal scroll */
@media(max-width:700px) {
  .hh-brand-strip { padding:20px 0 24px; }
  .hh-bs-scroll { overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .hh-bs-scroll::-webkit-scrollbar { display:none; }
  .hh-bs-row {
    flex-wrap:nowrap; justify-content:flex-start;
    padding:0 28px; width:max-content;
  }
}

/* stadium (light) theme */
[data-theme="stadium"] .hh-brand-strip {
  background:rgba(240,235,220,.80);
  border-color:rgba(28,33,48,.10);
  backdrop-filter:blur(14px);
}
[data-theme="stadium"] .hh-bs-label { color:rgba(28,33,48,.38); }
[data-theme="stadium"] .hh-bs-scroll::before { background:linear-gradient(to right, rgba(240,235,220,.9), transparent); }
[data-theme="stadium"] .hh-bs-scroll::after  { background:linear-gradient(to left,  rgba(240,235,220,.9), transparent); }
[data-theme="stadium"] .hh-bs-chip { background:rgba(28,33,48,.06); border-color:rgba(28,33,48,.12); }
[data-theme="stadium"] .hh-bs-chip:hover { background:rgba(28,33,48,.12); border-color:rgba(28,33,48,.22); }
[data-theme="stadium"] .hh-bs-name { color:var(--ink); }
[data-theme="stadium"] .hh-bs-more { background:rgba(225,39,39,.07); border-color:rgba(225,39,39,.30); }

/* ── Stats bar ── */
.hs { background:var(--navy); padding:28px 36px; }
.hs-in {
  max-width:1280px; margin:0 auto;
  display:grid; grid-template-columns:repeat(4,1fr);
}
@media(max-width:640px) { .hs-in { grid-template-columns:repeat(2,1fr); gap:24px 0; } }
.hs-stat {
  text-align:center; padding:0 12px;
  border-right:1px solid rgba(251,247,233,.1);
}
.hs-stat:last-child { border-right:none; }
.hs-num { font-size:34px; font-weight:900; letter-spacing:-.03em; color:var(--red); line-height:1; }
.hs-lbl { font-size:11px; color:rgba(251,247,233,.48); text-transform:uppercase; letter-spacing:.1em; font-weight:600; margin-top:5px; }

/* ── Generic section ── */
.sect { padding:96px 36px; }
.sect-a { background:var(--paper); }
.sect-b { background:#fff; }
.sect-c { background:var(--navy); }
.sect-in { max-width:1280px; margin:0 auto; }
.sect-hd { text-align:center; margin-bottom:60px; }
.sect-ey {
  display:inline-flex; align-items:center; gap:8px;
  font-size:11.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--red); margin-bottom:14px;
}
.sect-ey .pill {
  background:var(--red); color:var(--cream);
  padding:3px 9px; border-radius:999px; font-size:10px; font-weight:700;
}
.sect-c .sect-ey { color:rgba(242,228,177,.6); }
.sect-c .sect-ey .pill { background:rgba(225,39,39,.5); color:var(--cream); }
.sect-title {
  font-size:clamp(30px,3.2vw,48px); font-weight:700;
  letter-spacing:-.025em; line-height:1.05; color:var(--ink); text-wrap:balance;
}
.sect-c .sect-title { color:var(--cream); }
.sect-sub {
  margin-top:14px; font-size:17px; color:var(--ink-2);
  max-width:56ch; margin-left:auto; margin-right:auto;
  text-wrap:pretty; line-height:1.62;
}
.sect-c .sect-sub { color:rgba(242,228,177,.58); }

/* ── How it works ── */
.hw-grid {
  display:grid; grid-template-columns:repeat(4,1fr); gap:20px;
  position:relative;
}
@media(max-width:840px) { .hw-grid { grid-template-columns:repeat(2,1fr); } }
@media(max-width:440px) { .hw-grid { grid-template-columns:1fr; } }
.hw-connector {
  position:absolute; top:34px; left:calc(12.5% + 18px); right:calc(12.5% + 18px);
  height:2px;
  background:repeating-linear-gradient(90deg,var(--red) 0,var(--red) 8px,transparent 8px,transparent 16px);
  opacity:.22; pointer-events:none;
}
@media(max-width:840px) { .hw-connector { display:none; } }
.hw-card {
  background:#fff; border:1px solid var(--line);
  border-radius:var(--r-lg); padding:28px 22px; text-align:center;
}
.sect-a .hw-card { background:var(--paper); }
.hw-n {
  width:40px; height:40px; border-radius:999px;
  background:var(--red); color:var(--cream);
  font-size:15px; font-weight:700;
  display:inline-flex; align-items:center; justify-content:center;
  margin:0 auto 16px;
}
.hw-icon { color:var(--ink); margin:0 auto 12px; }
.hw-t { font-size:15.5px; font-weight:700; color:var(--ink); margin-bottom:8px; letter-spacing:-.01em; }
.hw-d { font-size:13.5px; color:var(--ink-2); line-height:1.55; }

/* ── Who we serve ── */
.org-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
@media(max-width:1040px) { .org-grid { grid-template-columns:repeat(2,1fr); } }
@media(max-width:480px)  { .org-grid { grid-template-columns:1fr; } }
.org-card {
  background:var(--paper); border:1px solid var(--line);
  border-radius:var(--r-lg); padding:24px;
  display:flex; flex-direction:column; gap:12px;
  transition:transform .18s, box-shadow .18s, border-color .18s;
}
.sect-b .org-card { background:var(--paper); }
.org-card:hover { transform:translateY(-3px); box-shadow:var(--sh); border-color:var(--red); }
.org-ico {
  width:46px; height:46px; border-radius:11px;
  background:var(--red); color:var(--cream);
  display:inline-flex; align-items:center; justify-content:center; flex-shrink:0;
}
.org-t { font-size:15px; font-weight:700; color:var(--ink); letter-spacing:-.01em; }
.org-d { font-size:13px; color:var(--ink-2); line-height:1.52; }

/* ── Partners ── */
.pt-wrap { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.pt-badge {
  background:rgba(251,247,233,.06); border:1px solid rgba(251,247,233,.12);
  border-radius:999px; padding:9px 20px;
  font-size:13.5px; font-weight:600; color:rgba(251,247,233,.72);
  transition:all .15s; white-space:nowrap;
}
.pt-badge:hover { background:rgba(225,39,39,.18); border-color:rgba(225,39,39,.35); color:var(--cream); }
.pt-more { text-align:center; margin-top:24px; font-size:13.5px; color:rgba(251,247,233,.38); }

/* ── FAQ ── */
.fq-list {
  max-width:760px; margin:0 auto;
  border:1px solid var(--line); border-radius:var(--r-lg);
  overflow:hidden; background:#fff;
}
.fq-item { border-bottom:1px solid var(--line); }
.fq-item:last-child { border-bottom:none; }
.fq-btn {
  width:100%; background:none; border:none;
  padding:20px 24px; text-align:left; cursor:pointer;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  transition:background .15s;
}
.fq-btn:hover { background:var(--cream-s,#FAF4DC); }
.fq-q { font-size:15.5px; font-weight:600; color:var(--ink); line-height:1.35; }
.fq-arr { color:var(--red); flex-shrink:0; transition:transform .22s; }
.fq-item.open .fq-arr { transform:rotate(180deg); }
.fq-body { max-height:0; overflow:hidden; transition:max-height .3s cubic-bezier(.2,.7,.2,1); }
.fq-item.open .fq-body { max-height:300px; }
.fq-a { padding:0 24px 20px; font-size:14.5px; color:var(--ink-2); line-height:1.68; }

/* ── CTA band ── */
.cta-band {
  background:var(--red); padding:88px 36px; text-align:center;
  position:relative; overflow:hidden;
}
.cta-band::before {
  content:''; position:absolute; inset:0;
  background-image:repeating-linear-gradient(
    135deg, transparent 0, transparent 24px,
    rgba(255,255,255,.05) 24px, rgba(255,255,255,.05) 25px);
}
.cta-band-in { position:relative; z-index:1; }
.cta-band h2 {
  font-size:clamp(30px,4vw,56px); font-weight:900; color:var(--cream);
  letter-spacing:-.03em; margin-bottom:14px; text-wrap:balance; line-height:1.0;
}
.cta-band p {
  font-size:18px; color:rgba(242,228,177,.8);
  margin:0 auto 36px; max-width:50ch; line-height:1.62;
}
.cta-btns { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.btn-cream {
  display:inline-flex; align-items:center; gap:8px;
  background:var(--cream); color:var(--red); border:none;
  border-radius:999px; padding:17px 32px;
  font-family:'REM',sans-serif; font-size:14px; font-weight:700;
  letter-spacing:.04em; text-transform:uppercase;
  box-shadow:0 4px 0 rgba(0,0,0,.18); cursor:pointer;
  transition:transform .15s, box-shadow .15s;
}
.btn-cream:hover { transform:translateY(-2px); box-shadow:0 6px 0 rgba(0,0,0,.18); }
.btn-ghost-wt {
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(255,255,255,.14); color:var(--cream);
  border:1.5px solid rgba(255,255,255,.38);
  border-radius:999px; padding:16px 28px;
  font-family:'REM',sans-serif; font-size:14px; font-weight:600;
  transition:background .15s; cursor:pointer;
}
.btn-ghost-wt:hover { background:rgba(255,255,255,.24); }

/* ── Footer ── */
.ft { background:var(--navy); padding:60px 36px 32px; color:rgba(251,247,233,.55); }
.ft-in { max-width:1280px; margin:0 auto; }
.ft-top {
  display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:40px;
  padding-bottom:48px; border-bottom:1px solid rgba(251,247,233,.08); margin-bottom:28px;
}
@media(max-width:840px) { .ft-top { grid-template-columns:1fr 1fr; } }
@media(max-width:480px) { .ft-top { grid-template-columns:1fr; } }
.ft-brand img { height:34px; width:auto; margin-bottom:14px; }
.ft-brand p { font-size:13.5px; line-height:1.65; color:rgba(251,247,233,.42); max-width:28ch; }
.ft-col h4 {
  font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(251,247,233,.35); margin-bottom:14px;
}
.ft-col ul { list-style:none; display:flex; flex-direction:column; gap:10px; }
.ft-col a { font-size:13.5px; color:rgba(251,247,233,.58); transition:color .15s; }
.ft-col a:hover { color:var(--cream); }
.ft-bot { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.ft-copy { font-size:12.5px; color:rgba(251,247,233,.3); }
.ft-legal { display:flex; gap:20px; }
.ft-legal a { font-size:12.5px; color:rgba(251,247,233,.3); transition:color .15s; }
.ft-legal a:hover { color:rgba(251,247,233,.65); }
.ft-cookie-link { font-family:inherit; font-size:12.5px; color:rgba(251,247,233,.3); background:none; border:none; padding:0; cursor:pointer; transition:color .15s; }
.ft-cookie-link:hover { color:rgba(251,247,233,.65); }

/* ── Launch confidence bar ── */
.hc { background:var(--navy); padding:36px; }
.hc-in { max-width:1100px; margin:0 auto; display:grid; grid-template-columns:repeat(4,1fr); gap:24px 28px; }
@media(max-width:880px) { .hc-in { grid-template-columns:repeat(2,1fr); } }
@media(max-width:480px) { .hc-in { grid-template-columns:1fr; } }
.hc-item { display:flex; align-items:flex-start; gap:10px; }
.hc-ico { flex-shrink:0; width:22px; height:22px; border-radius:50%; background:rgba(225,39,39,.18); color:var(--red); display:flex; align-items:center; justify-content:center; margin-top:1px; }
.hc-txt { font-size:15px; font-weight:600; color:rgba(251,247,233,.9); line-height:1.4; }

/* ── Testimonials ── */
.tst-wrap { background:var(--navy); padding:72px 36px; }
.tst-in { max-width:1280px; margin:0 auto; }
.tst-eyebrow {
  text-align:center;
  font-size:11.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(242,228,177,.38); margin-bottom:44px;
}
.tst-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
@media(max-width:880px) { .tst-grid { grid-template-columns:1fr; max-width:520px; margin:0 auto; } }
.tst-card {
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08);
  border-radius:20px; padding:30px 26px;
  display:flex; flex-direction:column; gap:18px;
  transition:background .2s, border-color .2s;
}
.tst-card:hover { background:rgba(255,255,255,.085); border-color:rgba(225,39,39,.3); }
.tst-earned {
  display:inline-flex; align-items:baseline; gap:8px;
  background:rgba(225,39,39,.16); border:1px solid rgba(225,39,39,.22);
  border-radius:999px; padding:6px 16px; align-self:flex-start;
}
.tst-num { font-size:22px; font-weight:900; color:var(--red); letter-spacing:-.03em; line-height:1; }
.tst-per { font-size:12px; color:rgba(242,228,177,.48); font-weight:500; }
.tst-q {
  font-size:15px; line-height:1.68; color:rgba(251,247,233,.76);
  font-style:italic; flex:1;
}
.tst-person { display:flex; align-items:center; gap:14px; padding-top:4px; }
.tst-avatar {
  width:44px; height:44px; border-radius:999px; flex-shrink:0;
  background:var(--red); color:var(--cream);
  font-size:14px; font-weight:700; letter-spacing:.02em;
  display:inline-flex; align-items:center; justify-content:center;
}
.tst-name { font-size:14px; font-weight:700; color:rgba(251,247,233,.9); margin-bottom:3px; }
.tst-role { font-size:12px; color:rgba(251,247,233,.4); line-height:1.45; }

/* ── Sports Moment photo strip ── */
.spm-wrap {
  display:grid; grid-template-columns:repeat(4,1fr);
  height:280px; overflow:hidden;
}
@media(max-width:760px) {
  .spm-wrap { grid-template-columns:repeat(2,1fr); height:340px; }
}
.spm-cell {
  position:relative; overflow:hidden;
  background-color:var(--navy);
  background-position:center; background-size:cover; background-repeat:no-repeat;
  transition:transform .4s cubic-bezier(.2,.7,.2,1);
  cursor:default;
}
.spm-cell:hover { transform:scale(1.04); z-index:1; }
.spm-overlay {
  position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(to top,
    rgba(28,33,48,.88) 0%,
    rgba(28,33,48,.38) 55%,
    rgba(28,33,48,.12) 100%);
  transition:background .4s;
}
.spm-cell:hover .spm-overlay {
  background:linear-gradient(to top,
    rgba(225,39,39,.75) 0%,
    rgba(28,33,48,.30) 60%,
    rgba(28,33,48,.05) 100%);
}
.spm-label {
  position:absolute; bottom:18px; left:18px; right:18px;
  font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:rgba(251,247,233,.92); line-height:1.3;
}

:focus-visible { outline:2px solid var(--red); outline-offset:3px; }

/* ── EN/ES Language toggle — see lang-switch.css for the .lang-seg
   component itself; .hn-lang here only carries nav-specific placement ── */
.hn-lang { margin-left: 2px; }

/* ── Hero: dual CTAs (left column) ── */
.hh-dual-cta {
  display:flex; flex-direction:column; gap:12px; margin-top:36px;
}
.hh-cta-primary {
  display:inline-flex; align-items:center; gap:10px;
  background:var(--red); color:var(--cream);
  border-radius:999px; padding:17px 30px;
  font-family:'REM',sans-serif; font-size:15px; font-weight:700;
  letter-spacing:.03em; text-transform:uppercase;
  box-shadow:0 4px 0 var(--red-deep);
  transition:transform .15s, box-shadow .15s;
  align-self:flex-start;
}
.hh-cta-primary:hover { transform:translateY(-2px); box-shadow:0 6px 0 var(--red-deep); }
.hh-cta-tag {
  background:var(--cream); color:var(--red);
  font-size:10px; font-weight:800; letter-spacing:.1em;
  text-transform:uppercase; border-radius:999px; padding:3px 10px;
}
.hh-cta-secondary {
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(255,255,255,.10); color:var(--hero-fg);
  border:1.5px solid rgba(255,255,255,.30); border-radius:999px;
  padding:15px 28px; font-family:'REM',sans-serif;
  font-size:14px; font-weight:600;
  transition:background .15s, border-color .15s;
  align-self:flex-start;
}
.hh-cta-secondary:hover { background:rgba(255,255,255,.20); border-color:rgba(255,255,255,.52); }
[data-theme="stadium"] .hh-cta-secondary {
  background:rgba(28,33,48,.07); color:var(--ink);
  border-color:rgba(28,33,48,.22);
}
[data-theme="stadium"] .hh-cta-secondary:hover { background:rgba(28,33,48,.14); }
@media(max-width:640px) {
  .hh-cta-primary, .hh-cta-secondary { align-self:stretch; justify-content:center; }
}

/* ── Hero card: supporter row (replaces hh-supp) ── */
.hh-supp-row {
  display:flex; align-items:center; justify-content:center;
  gap:8px; flex-wrap:wrap;
  background:rgba(225,39,39,.06); border:1px solid rgba(225,39,39,.16);
  border-radius:999px; padding:10px 20px; margin-bottom:20px;
}
.hh-supp-label { font-size:13px; color:var(--ink-2); }
.hh-supp-btn {
  font-size:13px; font-weight:700; color:var(--red);
  transition:text-decoration .1s;
}
.hh-supp-btn:hover { text-decoration:underline; }

/* ── Supporter Section ── */
.supp-sect { background:var(--navy); padding:96px 36px; }
.supp-in { max-width:1280px; margin:0 auto; }
.supp-layout {
  display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center;
}
.supp-layout > * { min-width:0; }
@media(max-width:960px) { .supp-layout { grid-template-columns:1fr; gap:48px; } }

.supp-ey {
  display:inline-flex; align-items:center; gap:10px;
  font-size:11.5px; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:rgba(242,228,177,.58); margin-bottom:18px;
}
.supp-pill {
  background:rgba(225,39,39,.38); color:var(--cream);
  padding:4px 10px; border-radius:999px; font-size:10px; font-weight:700;
}
.supp-h2 {
  font-size:clamp(30px,3.2vw,48px); font-weight:900;
  letter-spacing:-.025em; line-height:1.05;
  color:var(--cream); margin-bottom:16px; text-wrap:balance;
}
.supp-sub {
  font-size:17px; line-height:1.65; color:rgba(242,228,177,.58);
  margin-bottom:36px; max-width:48ch; text-wrap:pretty;
}
.supp-bens { display:flex; flex-direction:column; gap:22px; margin-bottom:40px; }
.supp-ben { display:flex; align-items:flex-start; gap:16px; }
.supp-ben-ico {
  width:46px; height:46px; border-radius:12px; flex-shrink:0;
  background:rgba(225,39,39,.18); border:1px solid rgba(225,39,39,.28);
  color:var(--red); display:inline-flex; align-items:center; justify-content:center;
}
.supp-ben-t { font-size:15px; font-weight:700; color:var(--cream); margin-bottom:4px; }
.supp-ben-d { font-size:13.5px; color:rgba(242,228,177,.52); line-height:1.55; }
.supp-cta-btn {
  display:inline-flex; align-items:center; gap:8px;
  background:var(--red); color:var(--cream); border-radius:999px;
  padding:17px 30px; font-family:'REM',sans-serif;
  font-size:14px; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  box-shadow:0 4px 0 var(--red-deep);
  transition:transform .15s, box-shadow .15s;
}
.supp-cta-btn:hover { transform:translateY(-2px); box-shadow:0 6px 0 var(--red-deep); }

/* Supporter card (right) */
.supp-card {
  background:#fff; border-radius:24px; padding:36px;
  box-shadow:0 4px 8px rgba(0,0,0,.08), 0 32px 64px -24px rgba(0,0,0,.36);
}
.supp-card-ey {
  font-size:11px; font-weight:700; letter-spacing:.13em;
  text-transform:uppercase; color:var(--red); margin-bottom:6px;
}
.supp-card-title {
  font-size:22px; font-weight:700; letter-spacing:-.02em;
  color:var(--ink); margin-bottom:20px; line-height:1.2;
}
.supp-search {
  display:flex; align-items:center; gap:10px;
  background:var(--paper); border:1.5px solid var(--line-s);
  border-radius:999px; padding:12px 18px; margin-bottom:14px;
  transition:border-color .15s, box-shadow .15s;
}
.supp-search:focus-within { border-color:var(--red); box-shadow:0 0 0 3px rgba(225,39,39,.10); }
.supp-search svg { color:var(--ink-3); flex-shrink:0; }
.supp-search input {
  flex:1; min-width:0; width:100%; border:none; background:transparent;
  font-family:'REM',sans-serif; font-size:14.5px; color:var(--ink);
}
.supp-search input:focus { outline:none; }
.supp-search input::placeholder { color:var(--ink-3); }
.supp-team-list { display:flex; flex-direction:column; gap:6px; margin-bottom:20px; }
.supp-team-row {
  display:flex; align-items:center; gap:12px;
  padding:11px 14px; border-radius:10px;
  text-decoration:none;
  border:1px solid var(--line); cursor:pointer;
  transition:background .15s, border-color .15s;
}
.supp-team-row:hover { background:var(--cream-s); border-color:var(--red); }
.supp-team-row:focus-visible { outline:2px solid var(--red); outline-offset:2px; }
.supp-team-ico {
  width:32px; height:32px; border-radius:8px; flex-shrink:0;
  background:var(--red); color:var(--cream);
  display:inline-flex; align-items:center; justify-content:center;
}
.supp-team-ico svg { width:15px; height:15px; }
.supp-team-name { flex:1; font-size:14px; font-weight:600; color:var(--ink); }
.supp-team-join { font-size:12.5px; font-weight:700; color:var(--red); }
.supp-no-results {
  text-align:center; padding:20px 0;
  font-size:14px; color:var(--ink-3);
}
.supp-card-note {
  display:flex; flex-direction:column; align-items:center; gap:7px;
  text-align:center; font-size:12.5px; color:var(--ink-3);
  padding-top:14px; border-top:1px solid var(--line);
}
.supp-start-link {
  font-size:12.5px; font-weight:700; color:var(--red);
  transition:text-decoration .1s;
}
.supp-start-link:hover { text-decoration:underline; }

/* ── CTA Band: dual layout ── */
.cta-dual {
  display:flex; align-items:center; justify-content:center;
  gap:28px; flex-wrap:wrap;
}
.cta-side { display:flex; flex-direction:column; align-items:center; gap:10px; }
.cta-side-label {
  font-size:11.5px; font-weight:600; text-transform:uppercase;
  letter-spacing:.1em; color:rgba(242,228,177,.48);
}
.cta-divider {
  font-size:15px; font-weight:600; color:rgba(242,228,177,.3); padding:0 4px;
}
@media(max-width:640px) { .cta-divider { display:none; } }
@media(max-width:540px) { .cta-side { width:100%; } .cta-side .btn-cream, .cta-side .btn-ghost-wt { width:100%; justify-content:center; } }

/* ── Hero Retail Strip ── */
.rt-strip {
  background:var(--navy);
  border-top:1px solid rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.06);
  padding:56px 36px 60px;
}
.rt-strip-hd {
  text-align:center;
  margin-bottom:40px;
}
.rt-eyebrow {
  font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--red); margin-bottom:10px;
}
.rt-headline {
  font-size:clamp(20px,2.2vw,30px); font-weight:800;
  letter-spacing:-.02em; line-height:1.25;
  color:var(--cream); text-wrap:balance;
}
.rt-br { display:block; }
@media(max-width:540px){ .rt-br { display:none; } }

/* scroll wrapper with edge fades on desktop */
.rt-scroll-wrap { position:relative; }
.rt-scroll-wrap::before,
.rt-scroll-wrap::after {
  content:''; position:absolute; top:0; bottom:0;
  width:80px; z-index:2; pointer-events:none;
}
.rt-scroll-wrap::before { left:0;  background:linear-gradient(to right, var(--navy), transparent); }
.rt-scroll-wrap::after  { right:0; background:linear-gradient(to left,  var(--navy), transparent); }

.rt-row {
  display:flex; align-items:stretch; justify-content:center;
  flex-wrap:wrap; gap:22px;
  padding:0 24px;
}

/* brand logo tile — white ground, consistent height, real mark centered */
.rt-logo {
  display:inline-flex; flex-direction:column; align-items:center; justify-content:center; gap:7px;
  width:118px; height:126px; padding:16px 14px 13px;
  background:#fff; border:1px solid rgba(255,255,255,.14); border-radius:14px;
  box-shadow:0 2px 12px rgba(0,0,0,.22);
  transition:transform .18s, box-shadow .18s;
}
.rt-logo:hover { transform:translateY(-2px); box-shadow:0 6px 18px rgba(0,0,0,.28); }
.rt-logo-mark { flex:1; min-height:0; width:100%; display:flex; align-items:center; justify-content:center; }
.rt-logo-img { width:100%; height:100%; max-height:66px; object-fit:contain; }
.rt-logo-name {
  font-size:11px; font-weight:600; color:rgba(28,33,48,.58); letter-spacing:.01em;
  max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  line-height:1; text-align:center;
}
.rt-logo-img-fallback {
  font-family:'REM',sans-serif; font-size:13px; font-weight:800;
  line-height:1.15; text-align:center; letter-spacing:-.01em;
}
.rt-logo-more {
  background:transparent; box-shadow:none;
  border:1.5px dashed rgba(225,39,39,.5);
  width:auto; padding:0 24px;
}
.rt-logo-more:hover { border-color:rgba(225,39,39,.8); box-shadow:none; }
.rt-logo-more-txt {
  font-family:'REM',sans-serif; font-size:14px; font-weight:700;
  color:var(--red); white-space:nowrap;
}
.rt-note {
  text-align:center; margin:24px auto 0; max-width:560px;
  font-size:11px; line-height:1.5; color:rgba(255,255,255,.4);
}

/* mobile: single-row horizontal scroll */
@media(max-width:700px) {
  .rt-strip { padding:40px 0 44px; }
  .rt-scroll-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .rt-scroll-wrap::-webkit-scrollbar { display:none; }
  .rt-row {
    flex-wrap:nowrap; justify-content:flex-start;
    padding:0 32px; width:max-content; min-width:100%;
  }
  .rt-logo { width:94px; height:104px; padding:13px 11px 10px; gap:6px; }
  .rt-row { gap:14px; }
  .rt-logo-name { font-size:9.5px; }
  .rt-logo-more { width:auto; padding:0 20px; }
  .rt-note { padding:0 32px; }
}

/* stadium (light) theme */
[data-theme="stadium"] .rt-strip {
  background:var(--paper);
  border-color:var(--line-s);
}
[data-theme="stadium"] .rt-headline { color:var(--ink); }
[data-theme="stadium"] .rt-scroll-wrap::before { background:linear-gradient(to right, var(--paper), transparent); }
[data-theme="stadium"] .rt-scroll-wrap::after  { background:linear-gradient(to left,  var(--paper), transparent); }
[data-theme="stadium"] .rt-logo {
  border-color:var(--line-s); box-shadow:0 2px 10px rgba(28,33,48,.08);
}
[data-theme="stadium"] .rt-logo:hover { box-shadow:0 6px 16px rgba(28,33,48,.12); }
[data-theme="stadium"] .rt-logo-more { background:transparent; box-shadow:none; border-color:rgba(225,39,39,.4); }
[data-theme="stadium"] .rt-note { color:rgba(28,33,48,.42); }

/* ── Multi-team note · Hero ── */
.hh-multi-note {
  display:flex; align-items:center; gap:7px;
  font-size:.8125rem; font-weight:500; letter-spacing:.01em;
  color:var(--hero-muted); margin:14px 0 0;
}
.hh-multi-ico { color:var(--red); display:flex; align-items:center; flex-shrink:0; }

/* ── Multi-team note · Supporter card ── */
.supp-multi-note {
  display:flex; align-items:center; gap:8px;
  font-size:.8125rem; font-weight:600;
  color:var(--red);
  background:var(--red-soft);
  border-radius:8px;
  padding:8px 12px;
  margin:8px 0 0;
  line-height:1.4;
}
.supp-multi-note svg { flex-shrink:0; }

/* ═══ Mobile polish (≤700px) — EN + ES ═══ */
@media(max-width:700px) {
  html, body { overflow-x:clip; }
}
/* Condensed header: logo shrinks, lang menu collapses to globe icon,
   actions stay on one row with no wrap/overlap */
@media(max-width:640px) {
  .hn-inner { padding:0 14px; gap:10px; }
  .hn-links { gap:9px; flex-shrink:0; }
  .hn-link { white-space:nowrap; font-size:13px; }
  .hn-cta { padding:9px 14px; font-size:10.5px; letter-spacing:.04em; }
  .hn-logo { height:26px; min-width:0; }
  .hn-logo img { max-width:108px; object-fit:contain; object-position:left center; }
  .hn-lang .lang-menu-label, .hn-lang .lang-menu-trigger svg:last-child { display:none; }
  .hn-lang .lang-menu-trigger { min-height:38px; padding:0 11px; gap:0; }
}
/* Hero */
@media(max-width:640px) {
  .hh-inner { padding:36px 20px 44px; gap:36px; }
  .hh-ey { margin-bottom:16px; }
  .hh-h1 { font-size:clamp(33px,9.5vw,42px); line-height:1.02; overflow-wrap:normal; word-break:normal; }
  .hh-h1 em { max-width:100%; padding-bottom:8px; }
  .hh-sub { font-size:15.5px; margin-bottom:28px; }
  .hh-trust li { align-items:flex-start; }
  .hh-trust .icn { margin-top:-2px; }
  .hh-dual-cta { margin-top:28px; }
  .hh-cta-primary, .hh-cta-secondary {
    white-space:normal; text-align:center; flex-wrap:wrap;
    padding-left:20px; padding-right:20px; line-height:1.3;
  }
  .hh-card { padding:26px 20px 22px; }
  .hh-card::before { left:20px; }
  .hh-supp-row { padding:10px 14px; }
}
/* Stack email form when the row gets tight (long ES button label) */
@media(max-width:460px) {
  .hh-email { flex-direction:column; border-radius:18px; padding:5px; }
  .hh-email input { padding:12px 14px; }
  .hh-email button { margin:0; width:100%; padding:13px 16px; }
}
/* Sections: consistent 20px gutters, calmer vertical rhythm */
@media(max-width:640px) {
  .sect { padding:60px 20px; }
  .sect-hd { margin-bottom:40px; }
  .sect-sub { font-size:15.5px; }
  .hs { padding:24px 20px; }
  .hc { padding:28px 20px; }
  .tst-wrap { padding:56px 20px; }
  .supp-sect { padding:60px 20px; }
  .supp-layout { gap:40px; }
  .supp-sub { font-size:15.5px; margin-bottom:28px; }
  .supp-card { padding:26px 20px; }
  .supp-cta-btn { display:flex; width:100%; justify-content:center; white-space:normal; text-align:center; line-height:1.3; }
  .cta-band { padding:64px 20px; }
  .cta-band p { font-size:16px; }
  .btn-cream, .btn-ghost-wt { white-space:normal; text-align:center; line-height:1.3; justify-content:center; }
  .ft { padding:48px 20px 28px; }
  .fq-btn { padding:16px 18px; }
  .fq-a { padding:0 18px 16px; }
}
