/* ═══════════════════════════════════════════════════════════════
   TCC HOME — VISUAL REDESIGN LAYER  (v1)
   Loads AFTER main.css on index.html only. Scoped to body.home.
   Re-skins presentation only — every ID / JS-generated class
   from main.js keeps its layout contract.

   CONTENTS
   01 Tokens & base
   02 The Seam (signature scroll-progress rail)
   03 Grain + ghost watermarks
   04 Section header system (tag / title / divider)
   05 Buttons
   06 Hero
   07 Values strip
   08 Live banner
   09 Fixtures dashboard
   10 Featured player
   11 Fantasy panel
   12 Youth & age cards
   13 Sponsors spotlight
   14 News editorial
   15 Social
   16 Membership gold band
   17 Executive
   18 Contact
   19 Footer + back-to-top
   20 Motion & accessibility
═══════════════════════════════════════════════════════════════ */

/* ── 01 · TOKENS & BASE ────────────────────────────────────── */
body.home {
  --ink:        #141412;
  --ink-2:      #181815;
  --ink-3:      #1d1c18;
  --panel:      #211f1a;
  --gold-hi:    #e8c96a;
  --gold-deep:  #8f7430;
  --gold-04:    rgba(201,168,76,0.04);
  --gold-08:    rgba(201,168,76,0.08);
  --gold-15:    rgba(201,168,76,0.15);
  --gold-30:    rgba(201,168,76,0.30);
  --live-red:   #e05548;
  --serif:      'DM Serif Display', serif;
  --display:    'Bebas Neue', sans-serif;
  --stitch:     repeating-linear-gradient(115deg,
                  var(--gold) 0 2px, transparent 2px 7px);
  background: var(--ink);
}

body.home section { position: relative; }

/* Alternating warm tones so the page breathes as you scroll */
body.home #about           { background: radial-gradient(1100px 540px at 12% 0%, var(--gold-04), transparent 60%), var(--ink-2); }
body.home #fixtures        { background:
  repeating-linear-gradient(90deg, rgba(242,237,227,0.014) 0 1px, transparent 1px 120px),
  var(--ink); }
body.home #featured-player { background: var(--ink-2); }
body.home #home-fantasy    { background: #121210; }
body.home #youth           { background: var(--ink); }
body.home #home-sponsors   { background: var(--ink-2); }
body.home #home-news       { background: var(--ink); }
body.home #home-social     { background: var(--ink-2); }
body.home #membership      { background: var(--ink); }
body.home #home-exec       { background: var(--ink-2); }
body.home #contact         { background: linear-gradient(180deg, var(--ink) 0%, #111110 100%); }

/* Seam-stitch connector ornament at the top of key sections */
body.home #fixtures::before,
body.home #home-fantasy::before,
body.home #home-news::before,
body.home #home-exec::before {
  content: "";
  position: absolute;
  top: 0; left: 50%;
  transform: translateX(-50%);
  width: min(420px, 60vw);
  height: 8px;
  background: var(--stitch);
  opacity: 0.5;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 25% 75%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 25% 75%, transparent);
}

/* ── 02 · THE SEAM — scroll-progress rail ──────────────────── */
.seam-rail {
  position: fixed;
  left: 26px; top: 0; bottom: 0;
  width: 3px;
  z-index: 60;
  background: rgba(242,237,227,0.06);
  pointer-events: none;
}
.seam-rail::before {            /* stitch ticks along the rail */
  content: "";
  position: absolute;
  left: -5px; top: 0; bottom: 0;
  width: 13px;
  background: repeating-linear-gradient(180deg,
    transparent 0 26px, rgba(242,237,227,0.07) 26px 28px);
}
.seam-fill {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, var(--gold-hi), var(--gold) 60%, var(--gold-deep));
  box-shadow: 0 0 12px rgba(201,168,76,0.55);
  transform-origin: top;
  transform: scaleY(var(--scroll-p, 0));
}
.seam-fill::after {             /* the "ball" travelling the seam */
  content: "";
  position: absolute;
  bottom: -5px; left: 50%;
  width: 11px; height: 11px;
  transform: translateX(-50%);
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, var(--gold-hi), var(--gold-deep));
  box-shadow: 0 0 14px rgba(232,201,106,0.8);
}
@media (max-width: 1180px) {    /* collapses to a top progress bar */
  .seam-rail { left: 0; right: 0; top: 0; bottom: auto; width: auto; height: 3px; z-index: 1200; }
  .seam-rail::before { display: none; }
  .seam-fill { transform-origin: left; transform: scaleX(var(--scroll-p, 0)); }
  .seam-fill::after { bottom: auto; top: 50%; left: auto; right: -4px; width: 7px; height: 7px; transform: translateY(-50%); }
}

/* ── 03 · GRAIN + GHOST WATERMARKS ─────────────────────────── */
.home-grain {
  position: fixed; inset: 0;
  z-index: 70;
  pointer-events: none;
  opacity: 0.05;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E");
}
body.home section[data-ghost] { overflow: hidden; }
body.home section[data-ghost]::after {
  content: attr(data-ghost);
  position: absolute;
  top: 16px;
  right: -0.06em;
  z-index: 0;
  font-family: var(--display);
  font-size: clamp(6rem, 17vw, 15rem);
  line-height: 0.8;
  letter-spacing: 0.02em;
  color: transparent;
  -webkit-text-stroke: 1px rgba(242,237,227,0.05);
  pointer-events: none;
  user-select: none;
  transform: translateY(var(--ghost-y, 0px));
  transition: transform 0.1s linear;
  white-space: nowrap;
}
body.home section[data-ghost] > * { position: relative; z-index: 1; }
@media (max-width: 760px) {
  body.home section[data-ghost]::after { font-size: 5.2rem; opacity: 0.8; }
}

/* ── 04 · SECTION HEADER SYSTEM ────────────────────────────── */
body.home .section-tag {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 0.7rem;
  letter-spacing: 5px;
  color: var(--gold-hi);
}
body.home .section-tag::before {
  content: "";
  width: 30px; height: 6px;
  background: var(--stitch);
  opacity: 0.9;
}
body.home .section-title {
  font-size: clamp(2.9rem, 6.6vw, 5.4rem);
  letter-spacing: 1px;
}
body.home .section-title .accent {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  font-size: 0.82em;
  letter-spacing: 0;
  color: var(--gold-hi);
  background: linear-gradient(110deg, var(--gold-deep), var(--gold-hi) 45%, var(--gold) 80%);
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
}
body.home .divider {
  width: 86px; height: 7px;
  background: var(--stitch);
  border-radius: 0;
}

/* ── 05 · BUTTONS ──────────────────────────────────────────── */
body.home .btn {
  position: relative;
  overflow: hidden;
  text-transform: uppercase;
  letter-spacing: 1.6px;
  font-weight: 700;
  font-size: 0.78rem;
  padding: 14px 28px;
  border-radius: 3px;
  transition: transform 0.28s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.28s ease,
              color 0.28s ease, background 0.28s ease, border-color 0.28s ease;
}
body.home .btn:hover { transform: translateY(-2px); }
body.home .btn:active { transform: translateY(0); }
body.home .btn-primary {
  background: linear-gradient(120deg, var(--gold) 0%, var(--gold-hi) 55%, var(--gold) 100%);
  color: #161410;
  box-shadow: 0 4px 18px rgba(201,168,76,0.22);
}
body.home .btn-primary:hover { box-shadow: 0 8px 26px rgba(201,168,76,0.38); }
body.home .btn-primary::after {           /* sheen sweep */
  content: "";
  position: absolute;
  top: 0; left: -80%;
  width: 50%; height: 100%;
  background: linear-gradient(105deg, transparent, rgba(255,255,255,0.45), transparent);
  transform: skewX(-20deg);
  transition: left 0.55s ease;
}
body.home .btn-primary:hover::after { left: 130%; }
body.home .btn-outline {
  border: 1px solid var(--gold-30);
  color: var(--gold-hi);
  background: transparent;
}
body.home .btn-outline::before {           /* gold fill wipe */
  content: "";
  position: absolute;
  inset: 0;
  background: var(--gold);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s ease;
  z-index: -1;
}
body.home .btn-outline:hover { color: #161410; border-color: var(--gold); }
body.home .btn-outline:hover::before { transform: scaleX(1); }

/* ── 06 · HERO ─────────────────────────────────────────────── */
body.home #main-content { background: var(--ink); }
.hero-photo-frame {
  position: absolute;
  inset: 0;
  overflow: hidden;
  animation: heroKenBurns 26s ease-in-out infinite alternate;
  will-change: transform;
}
@keyframes heroKenBurns {
  from { transform: scale(1); }
  to   { transform: scale(1.045); }
}
body.home .hero-photo-overlay {
  background:
    linear-gradient(115deg, rgba(15,14,12,0.92) 0%, rgba(15,14,12,0.55) 48%, rgba(15,14,12,0.25) 100%),
    radial-gradient(1200px 600px at 80% 20%, rgba(201,168,76,0.10), transparent 60%),
    linear-gradient(180deg, transparent 62%, var(--ink) 100%);
}
/* Entrance choreography — staggered rise on first paint */
@keyframes heroRise {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}
body.home .hero-eyebrow,
body.home .hero-headline,
body.home .hero-rule,
body.home .hero-sub,
body.home .hero-actions { animation: heroRise 0.9s cubic-bezier(0.22,1,0.36,1) both; }
body.home .hero-eyebrow  { animation-delay: 0.10s; }
body.home .hero-headline { animation-delay: 0.22s; }
body.home .hero-rule     { animation-delay: 0.38s; }
body.home .hero-sub      { animation-delay: 0.50s; }
body.home .hero-actions  { animation-delay: 0.62s; }

body.home .hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 9px 18px;
  border: 1px solid var(--gold-15);
  border-radius: 100px;
  background: rgba(20,20,18,0.45);
  backdrop-filter: blur(8px);
  font-size: 0.72rem;
  letter-spacing: 3.5px;
  text-transform: uppercase;
  color: var(--white);
}
body.home .hero-eyebrow-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--gold-hi);
  box-shadow: 0 0 0 0 rgba(232,201,106,0.6);
  animation: eyebrowPulse 2.2s infinite;
}
@keyframes eyebrowPulse {
  0%   { box-shadow: 0 0 0 0 rgba(232,201,106,0.55); }
  70%  { box-shadow: 0 0 0 9px rgba(232,201,106,0); }
  100% { box-shadow: 0 0 0 0 rgba(232,201,106,0); }
}
body.home .hero-headline {
  font-size: clamp(4.2rem, 11vw, 9.2rem);
  line-height: 0.88;
  text-shadow: 0 24px 60px rgba(0,0,0,0.55);
}
body.home .hero-headline .line-gold {
  background: linear-gradient(110deg, var(--gold-deep) 0%, var(--gold-hi) 35%, var(--gold) 60%, var(--gold-hi) 85%);
  background-size: 220% 100%;
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: goldSheen 7s ease-in-out infinite;
}
@keyframes goldSheen {
  0%, 100% { background-position: 0% 0; }
  50%      { background-position: 100% 0; }
}
body.home .hero-headline .line-outline {
  color: transparent;
  -webkit-text-stroke: 2px rgba(242,237,227,0.85);
  transition: color 0.45s ease, -webkit-text-stroke-color 0.45s ease;
}
body.home .hero-headline:hover .line-outline {
  color: var(--white);
  -webkit-text-stroke-color: transparent;
}
body.home .hero-rule-text {
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.05rem;
  letter-spacing: 2px;
  color: var(--gold-hi);
}
body.home .hero-rule-line { background: var(--gold-30); }
body.home .hero-sub { max-width: 480px; font-size: 1.02rem; line-height: 1.75; }

/* Scoreboard stat chips */
body.home .hps-card {
  background: linear-gradient(160deg, rgba(33,31,26,0.82), rgba(20,20,18,0.72));
  border: 1px solid var(--gold-15);
  border-top: 3px solid var(--gold);
  border-radius: 4px;
  padding: 18px 30px;
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 40px rgba(0,0,0,0.4);
  animation: heroRise 0.9s cubic-bezier(0.22,1,0.36,1) both,
             chipFloat 7s ease-in-out infinite;
}
body.home .hps-card:nth-child(1) { animation-delay: 0.65s, 1.6s; }
body.home .hps-card:nth-child(2) { animation-delay: 0.76s, 2.4s; }
body.home .hps-card:nth-child(3) { animation-delay: 0.87s, 3.2s; }
body.home .hps-card:nth-child(4) { animation-delay: 0.98s, 4.0s; }
@keyframes chipFloat {
  0%, 100% { translate: 0 0; }
  50%      { translate: 0 -7px; }
}
body.home .hps-card:hover {
  border-color: var(--gold);
  box-shadow: 0 22px 50px rgba(0,0,0,0.5), 0 0 30px rgba(201,168,76,0.14);
}
body.home .hps-num {
  font-family: var(--display);
  font-size: 3rem;
  line-height: 1;
  color: var(--gold-hi);
  font-variant-numeric: tabular-nums;
}
body.home .hps-label {
  font-size: 0.66rem;
  letter-spacing: 2.6px;
  text-transform: uppercase;
  color: var(--muted);
}
body.home .hero-scroll-hint {
  font-size: 0.64rem;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--gold-hi);
  animation: heroRise 1s 1.2s both;
}

/* ── 07 · VALUES STRIP ─────────────────────────────────────── */
body.home .values-strip {
  background: #121210;
  border-top: 1px solid var(--gold-15);
  border-bottom: 1px solid var(--gold-15);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8% 92%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 8% 92%, transparent);
}
body.home .values-track { padding: 22px 0; }
body.home .values-track:hover { animation-play-state: paused; }
body.home .values-item {
  font-family: var(--display);
  font-size: 1.9rem;
  letter-spacing: 3px;
  color: var(--white);
}
body.home .values-item:nth-child(even) {
  color: transparent;
  -webkit-text-stroke: 1px var(--gold);
}
body.home .values-dot {
  width: 22px; height: 6px;
  border-radius: 0;
  background: var(--stitch);
  margin: 0 22px;
}

/* ── 08 · LIVE BANNER ──────────────────────────────────────── */
body.home #home-live-banner {
  background: linear-gradient(90deg, rgba(224,85,72,0.12), rgba(20,20,18,0.9) 35%);
  border-top: 1px solid rgba(224,85,72,0.35);
  border-bottom: 1px solid rgba(224,85,72,0.35);
}
body.home .hlb-dot { animation: eyebrowPulse 1.4s infinite; background: var(--live-red); }
body.home .hlb-text { letter-spacing: 3px; text-transform: uppercase; font-weight: 800; color: var(--live-red); }
body.home .hlb-match {
  background: rgba(242,237,227,0.04);
  border: 1px solid rgba(242,237,227,0.08);
  border-radius: 4px;
}

/* ── 09 · FIXTURES DASHBOARD ───────────────────────────────── */
body.home .fixtures-tab-group {
  position: relative;
  background: var(--panel);
  border: 1px solid var(--gold-15);
  border-radius: 100px;
  padding: 4px;
  gap: 0;
}
body.home .fixtures-tab {
  border: none;
  background: transparent;
  border-radius: 100px;
  padding: 10px 26px;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--muted);
  transition: color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease;
}
body.home .fixtures-tab.active {
  background: linear-gradient(120deg, var(--gold), var(--gold-hi));
  color: #161410;
  box-shadow: 0 4px 14px rgba(201,168,76,0.3);
}
/* JS-rendered rows become scorecard panels (grid contract untouched) */
body.home .frl-wrap { display: grid; gap: 12px; }
body.home .frl-row {
  background: linear-gradient(150deg, var(--panel), var(--ink-2));
  border: 1px solid rgba(242,237,227,0.06);
  border-bottom: 1px solid rgba(242,237,227,0.06);
  border-radius: 6px;
  padding: 18px 22px;
  overflow: hidden;
  transition: transform 0.3s cubic-bezier(0.22,1,0.36,1), border-color 0.3s ease, box-shadow 0.3s ease;
}
body.home .frl-row::before {          /* gold status rail that grows on hover */
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: linear-gradient(180deg, var(--gold-hi), var(--gold-deep));
  transform: scaleY(0.35);
  transform-origin: center;
  transition: transform 0.3s ease;
}
body.home .frl-row:hover {
  transform: translateX(6px);
  border-color: var(--gold-30);
  box-shadow: 0 14px 34px rgba(0,0,0,0.35);
}
body.home .frl-row:hover::before { transform: scaleY(1); }
body.home .frl-row-empty:hover { transform: none; }
body.home .frl-date {
  background: rgba(201,168,76,0.07);
  border: 1px solid var(--gold-15);
  border-radius: 5px;
  padding: 6px 4px;
  text-align: center;
}
body.home .frl-day {
  font-family: var(--display);
  font-size: 1.55rem;
  line-height: 1;
  color: var(--gold-hi);
}
body.home .frl-mon {
  font-size: 0.6rem;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--muted);
}
body.home .frl-team {
  font-family: var(--display);
  font-size: 1.12rem;
  letter-spacing: 1.5px;
  color: var(--white);
}
body.home .frl-opp { color: var(--white); font-weight: 600; }
body.home .frl-meta { color: var(--muted); }
body.home .frl-score-num {
  font-family: var(--display);
  font-size: 1.5rem;
  color: var(--gold-hi);
  font-variant-numeric: tabular-nums;
}
body.home .badge {
  border-radius: 3px;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  font-weight: 800;
}
body.home .badge-win      { background: rgba(201,168,76,0.16); color: var(--gold-hi); border: 1px solid var(--gold-30); }
body.home .badge-loss     { background: rgba(224,85,72,0.1);  color: #e08a80;       border: 1px solid rgba(224,85,72,0.3); }
body.home .badge-upcoming { background: transparent;          color: var(--muted);  border: 1px solid rgba(242,237,227,0.15); }
body.home .frl-live-badge { animation: eyebrowPulse 1.6s infinite; }

/* ── 10 · FEATURED PLAYER ──────────────────────────────────── */
body.home .fp-card {
  background: linear-gradient(135deg, var(--panel) 0%, var(--ink-2) 70%);
  border: 1px solid rgba(242,237,227,0.06);
  border-radius: 8px;
  overflow: hidden;
}
body.home .fp-photo-wrap {
  position: relative;
  transition: transform 0.45s cubic-bezier(0.22,1,0.36,1);
}
body.home .fp-card:hover .fp-photo-wrap { transform: scale(1.025); }
body.home .fp-name {
  font-family: var(--display);
  font-size: clamp(2.4rem, 4.5vw, 3.6rem);
  letter-spacing: 1.5px;
  line-height: 0.95;
}
body.home .fp-role {
  font-family: var(--serif);
  font-style: italic;
  color: var(--gold-hi);
  font-size: 1.05rem;
}
body.home .fp-chip {
  background: rgba(201,168,76,0.06);
  border: 1px solid var(--gold-15);
  border-radius: 4px;
  transition: border-color 0.25s ease, transform 0.25s ease;
}
body.home .fp-chip:hover { border-color: var(--gold); transform: translateY(-3px); }
body.home .fp-chip-value { font-family: var(--display); font-size: 1.4rem; color: var(--gold-hi); }
body.home .fp-rotation-label {
  font-size: 0.62rem;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--gold);
  border: 1px dashed var(--gold-30);
  border-radius: 100px;
  padding: 6px 14px;
  display: inline-block;
}

/* ── 11 · FANTASY PANEL ────────────────────────────────────── */
body.home #home-fantasy .hf-inner {
  position: relative;
  background:
    radial-gradient(700px 420px at var(--mx, 75%) var(--my, 30%), rgba(201,168,76,0.09), transparent 65%),
    repeating-linear-gradient(0deg, rgba(242,237,227,0.012) 0 1px, transparent 1px 56px),
    linear-gradient(140deg, #19180f 0%, #121210 60%);
  border: 1px solid var(--gold-15);
  border-radius: 10px;
  padding: clamp(32px, 5vw, 64px);
  box-shadow: 0 30px 80px rgba(0,0,0,0.45);
}
body.home .hf-title {
  font-family: var(--display);
  font-size: clamp(2.8rem, 5.5vw, 4.6rem);
  line-height: 0.92;
}
body.home .hf-title .accent {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  color: var(--gold-hi);
}
body.home .hf-stat-num { font-family: var(--display); font-size: 2rem; color: var(--gold-hi); }
body.home .hf-lb {
  background: rgba(20,20,18,0.65);
  border: 1px solid var(--gold-15);
  border-radius: 8px;
  backdrop-filter: blur(8px);
  box-shadow: 0 20px 50px rgba(0,0,0,0.4);
}
body.home .hf-lb-row { transition: background 0.2s ease, transform 0.2s ease; }
body.home .hf-lb-row:hover { background: var(--gold-04); transform: translateX(4px); }
body.home .hf-lb-top {
  background: linear-gradient(90deg, rgba(201,168,76,0.12), transparent);
  border-left: 3px solid var(--gold);
}
body.home .hf-lb-rank.gold { color: var(--gold-hi); font-family: var(--display); }
body.home .hf-lb-pts { font-variant-numeric: tabular-nums; color: var(--gold-hi); }

/* ── 12 · YOUTH & AGE CARDS ────────────────────────────────── */
body.home .youth-hero-text p strong { color: var(--gold-hi); }
body.home .coordinator-box {
  background: var(--panel);
  border: 1px solid var(--gold-15);
  border-top: 3px solid var(--gold);
  border-radius: 6px;
  box-shadow: 0 18px 44px rgba(0,0,0,0.3);
}
body.home .age-card {
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid rgba(242,237,227,0.06);
  background: var(--panel);
  transition: transform 0.35s cubic-bezier(0.22,1,0.36,1), border-color 0.3s ease, box-shadow 0.3s ease;
}
body.home .age-card:hover {
  transform: translateY(-8px);
  border-color: var(--gold-30);
  box-shadow: 0 24px 50px rgba(0,0,0,0.45);
}
body.home .age-card-banner {
  position: relative;
  background: linear-gradient(120deg, #2a2418, #1c1a14);
  overflow: hidden;
}
body.home .age-card-banner::after {        /* giant ghost badge in banner */
  content: "";
  position: absolute;
  right: -26px; top: 50%;
  width: 130px; height: 130px;
  transform: translateY(-50%);
  border: 2px solid var(--gold-08);
  border-radius: 50%;
  background:
    radial-gradient(circle, transparent 56%, var(--gold-08) 57% 59%, transparent 60%);
}
body.home .age-badge {
  font-family: var(--display);
  font-size: 2rem;
  color: var(--gold-hi);
  letter-spacing: 2px;
}
body.home .session-row {
  border-left: 2px solid var(--gold-30);
  padding-left: 12px;
  transition: border-color 0.25s ease;
}
body.home .age-card:hover .session-row { border-color: var(--gold); }
body.home .session-time { font-family: var(--display); letter-spacing: 1px; color: var(--gold-hi); }
body.home .age-scroller-btn {
  background: var(--panel);
  border: 1px solid var(--gold-30);
  color: var(--gold-hi);
  transition: background 0.25s ease, color 0.25s ease, transform 0.25s ease;
}
body.home .age-scroller-btn:hover { background: var(--gold); color: #161410; }
body.home .age-dot { background: rgba(242,237,227,0.15); border-radius: 0; width: 18px; height: 4px; }
body.home .age-dot.active { background: var(--gold); }

/* ── 13 · SPONSORS SPOTLIGHT ───────────────────────────────── */
body.home .sponsors-track-outer {
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 10% 90%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 10% 90%, transparent);
}
body.home .sponsors-track:hover { animation-play-state: paused; }
body.home .sponsor-card {
  position: relative;
  overflow: hidden;
  background: linear-gradient(160deg, var(--panel), var(--ink-2));
  border: 1px solid rgba(242,237,227,0.07);
  border-radius: 6px;
  height: 110px;
  transition: border-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
}
body.home .sponsor-card::after {           /* shine sweep */
  content: "";
  position: absolute;
  top: 0; left: -90%;
  width: 55%; height: 100%;
  background: linear-gradient(105deg, transparent, rgba(232,201,106,0.16), transparent);
  transform: skewX(-20deg);
  transition: left 0.6s ease;
}
body.home .sponsor-card:hover {
  border-color: var(--gold);
  box-shadow: 0 18px 40px rgba(0,0,0,0.4), 0 0 26px rgba(201,168,76,0.12);
}
body.home .sponsor-card:hover::after { left: 135%; }
body.home .sponsor-card img {
  transition: transform 0.3s ease;
}
body.home .sponsor-card:hover img { transform: scale(1.06); }
body.home .sponsors-cta a { color: var(--gold-hi); }

/* ── 14 · NEWS EDITORIAL ───────────────────────────────────── */
body.home .home-news-grid { gap: 16px; }
body.home .news-card {
  border-radius: 8px;
  border: 1px solid rgba(242,237,227,0.06);
  transition: transform 0.35s cubic-bezier(0.22,1,0.36,1), border-color 0.3s ease, box-shadow 0.3s ease;
}
body.home .news-card:hover {
  transform: translateY(-6px);
  border-color: var(--gold-30);
  box-shadow: 0 26px 56px rgba(0,0,0,0.5);
}
body.home .news-card:hover .news-card-bg { transform: scale(1.07); }
/* Lead story — first card becomes a full-width editorial banner */
body.home .home-news-grid .news-card:first-child {
  grid-column: 1 / -1;
  min-height: 420px;
}
body.home .home-news-grid .news-card:first-child .news-card-title {
  font-family: var(--serif);
  font-size: clamp(1.6rem, 3.4vw, 2.6rem);
  line-height: 1.15;
}
body.home .news-card-title { transition: color 0.25s ease; }
body.home .news-card:hover .news-card-title { color: var(--gold-hi); }
body.home .news-card-date {
  font-size: 0.64rem;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--gold-hi);
}
body.home .news-card-tag,
body.home .news-card-category {
  background: rgba(20,20,18,0.7);
  border: 1px solid var(--gold-30);
  color: var(--gold-hi);
  border-radius: 3px;
  backdrop-filter: blur(6px);
}
body.home .news-card-pinned { border-color: var(--gold); }
@media (max-width: 760px) {
  body.home .home-news-grid .news-card:first-child { min-height: 300px; }
}

/* ── 15 · SOCIAL ───────────────────────────────────────────── */
body.home .social-feed-wrap {
  background: var(--panel);
  border: 1px solid rgba(242,237,227,0.06);
  border-radius: 8px;
  padding: clamp(14px, 2.5vw, 28px);
  box-shadow: 0 20px 50px rgba(0,0,0,0.3);
}

/* ── 16 · MEMBERSHIP GOLD BAND ─────────────────────────────── */
body.home #membership .membership-cta-strip {
  background:
    repeating-linear-gradient(115deg, rgba(20,20,18,0.05) 0 2px, transparent 2px 14px),
    linear-gradient(120deg, var(--gold-deep) 0%, var(--gold) 35%, var(--gold-hi) 70%, var(--gold) 100%);
  border: none;
  border-radius: 10px;
  padding: clamp(36px, 5vw, 60px);
  box-shadow: 0 30px 70px rgba(201,168,76,0.18);
  transform: rotate(-0.4deg);
}
body.home #membership .membership-cta-strip > * { transform: rotate(0.4deg); }
body.home #membership .section-tag { color: #161410; }
body.home #membership .section-tag::before { background: repeating-linear-gradient(115deg, #161410 0 2px, transparent 2px 7px); }
body.home #membership .section-title { color: #161410; }
body.home #membership .section-title .accent {
  background: none;
  -webkit-text-fill-color: currentColor;
  color: #161410;
}
body.home #membership .membership-cta-text p { color: rgba(22,20,16,0.75) !important; }
body.home #membership .membership-cta-text p strong { color: #161410 !important; }
body.home #membership .btn-primary {
  background: #161410;
  color: var(--gold-hi);
  box-shadow: 0 8px 24px rgba(0,0,0,0.3);
}
body.home #membership .btn-outline { border-color: rgba(22,20,16,0.55); color: #161410; }
body.home #membership .btn-outline::before { background: #161410; }
body.home #membership .btn-outline:hover { color: var(--gold-hi); border-color: #161410; }

/* ── 17 · EXECUTIVE ────────────────────────────────────────── */
body.home .exec-featured-card {
  background: linear-gradient(150deg, var(--panel), var(--ink-2));
  border: 1px solid rgba(242,237,227,0.06);
  border-radius: 8px;
  overflow: hidden;
  transition: transform 0.3s ease, border-color 0.3s ease;
}
body.home .exec-featured-card:hover { border-color: var(--gold-30); }
body.home .exec-featured-photo { transition: transform 0.45s ease; }
body.home .exec-featured-card:hover .exec-featured-photo { transform: scale(1.05); }
body.home .exec-featured-index,
body.home .exec-index {
  font-family: var(--display);
  color: transparent;
  -webkit-text-stroke: 1px var(--gold-30);
  font-size: 1.5rem;
  transition: -webkit-text-stroke-color 0.25s ease, color 0.25s ease;
}
body.home .exec-row {
  background: transparent;
  border-bottom: 1px solid rgba(242,237,227,0.05);
  border-radius: 4px;
  transition: background 0.25s ease, padding-left 0.25s ease;
}
body.home .exec-row:hover { background: var(--gold-04); padding-left: 34px; }
body.home .exec-row:hover .exec-index { color: var(--gold-hi); -webkit-text-stroke-color: transparent; }
body.home .exec-avatar-wrap {
  border-radius: 50%;
  outline: 1px solid var(--gold-15);
  outline-offset: 2px;
  transition: outline-color 0.25s ease, transform 0.25s ease;
}
body.home .exec-row:hover .exec-avatar-wrap { outline-color: var(--gold); transform: scale(1.12); }
body.home .exec-featured-role,
body.home .exec-role { font-family: var(--serif); font-style: italic; color: var(--gold-hi); }
body.home .exec-featured-name { font-family: var(--display); letter-spacing: 1.5px; }

/* ── 18 · CONTACT ──────────────────────────────────────────── */
body.home .contact-form .form-control {
  background: transparent;
  border: none;
  border-bottom: 1px solid rgba(242,237,227,0.15);
  border-radius: 0;
  padding-left: 2px;
  transition: border-color 0.3s ease;
}
body.home .contact-form .form-control:focus {
  border-bottom-color: var(--gold);
  box-shadow: 0 1px 0 0 var(--gold);
  outline: none;
}
body.home .form-label {
  font-size: 0.66rem;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--gold-hi);
}
body.home .info-group h3 {
  font-family: var(--display);
  letter-spacing: 1.5px;
  font-size: 1.3rem;
}
body.home .map-container {
  border: 1px solid var(--gold-15);
  border-radius: 8px;
  overflow: hidden;
  filter: saturate(0.55);
  transition: filter 0.4s ease, border-color 0.3s ease;
}
body.home .map-container:hover { filter: saturate(1); border-color: var(--gold-30); }

/* ── 19 · FOOTER + BACK-TO-TOP ─────────────────────────────── */
body.home footer {
  background: #101010;
  border-top: 1px solid var(--gold-15);
  position: relative;
}
body.home footer::before {
  content: "";
  position: absolute;
  top: -1px; left: 50%;
  transform: translateX(-50%);
  width: min(520px, 70vw);
  height: 8px;
  background: var(--stitch);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 25% 75%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 25% 75%, transparent);
}
body.home .footer-motto {
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.5rem;
  color: var(--gold-hi);
  letter-spacing: 1px;
}
body.home .back-to-top {
  background: linear-gradient(140deg, var(--gold), var(--gold-hi));
  color: #161410;
  box-shadow: 0 8px 26px rgba(201,168,76,0.35);
  transition: transform 0.25s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.25s ease;
}
body.home .back-to-top:hover { transform: translateY(-4px) scale(1.06); }

/* ── 20 · MOTION & ACCESSIBILITY ───────────────────────────── */
body.home :focus-visible {
  outline: 2px solid var(--gold-hi);
  outline-offset: 3px;
}
@media (max-width: 760px) {
  body.home .hps-num { font-size: 2.2rem; }
  body.home .values-item { font-size: 1.4rem; }
  body.home #membership .membership-cta-strip { transform: none; }
  body.home #membership .membership-cta-strip > * { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  body.home *,
  body.home *::before,
  body.home *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .hero-photo-frame { animation: none; }
  .seam-fill::after { display: none; }
}

/* ═══════════════════════════════════════════════════════════════
   LEVEL 2  (v2) — living hero, countdown, seam arcs, sculpted
   transitions, dimensional cards, match-day state, hero ticker
═══════════════════════════════════════════════════════════════ */

/* ── 21 · LIVING HERO — slideshow ──────────────────────────── */
.hero-slide {
  position: absolute;
  top: -15%; left: 0; right: 0;
  width: 100%; height: 115%;   /* just enough headroom for the gentler 0.15 drift —
                                  not the base image's 140% (sized for main.js's 0.4) */
  object-fit: cover;
  object-position: center center;
  opacity: 0;
  transition: opacity 1.8s ease;
  will-change: opacity, transform;
}
.hero-slide.active { opacity: 1; }

/* ── 22 · HERO TICKER ──────────────────────────────────────── */
.hero-ticker {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  z-index: 3;
  overflow: hidden;
  border-top: 1px solid var(--gold-15);
  background: rgba(16,16,14,0.55);
  backdrop-filter: blur(8px);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6% 94%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 6% 94%, transparent);
  animation: heroRise 1s 1.1s both;
}
.hero-ticker-track {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  padding: 11px 0;
  animation: htScroll 34s linear infinite;
}
.hero-ticker:hover .hero-ticker-track { animation-play-state: paused; }
@keyframes htScroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.ht-item {
  font-family: var(--display);
  font-size: 0.92rem;
  letter-spacing: 3.5px;
  color: var(--white);
  opacity: 0.85;
}
.ht-item:nth-child(4n+3) { color: var(--gold-hi); }
.ht-sep {
  width: 22px; height: 5px;
  margin: 0 26px;
  background: var(--stitch);
  opacity: 0.7;
}
body.home .hero-scroll-hint { bottom: 66px; }

/* ── 23 · NEXT-MATCH COUNTDOWN ─────────────────────────────── */
.fx-countdown {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 18px 28px;
  margin: 6px 0 26px;
  padding: 18px 26px;
  background:
    repeating-linear-gradient(90deg, rgba(242,237,227,0.016) 0 1px, transparent 1px 36px),
    linear-gradient(140deg, var(--panel), var(--ink-2));
  border: 1px solid var(--gold-15);
  border-left: 3px solid var(--gold);
  border-radius: 6px;
}
.fxc-info { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.fxc-label {
  font-size: 0.62rem;
  letter-spacing: 3.5px;
  text-transform: uppercase;
  color: var(--gold-hi);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.fxc-label::before {
  content: "";
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--gold-hi);
  animation: eyebrowPulse 2.4s infinite;
}
.fxc-match {
  font-family: var(--display);
  font-size: clamp(1.2rem, 2.4vw, 1.7rem);
  letter-spacing: 1.5px;
  color: var(--white);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fxc-date {
  font-family: var(--serif);
  font-style: italic;
  font-size: 0.95rem;
  color: var(--gold-hi);
}
.fxc-timer { display: flex; align-items: stretch; gap: 10px; }
.fxc-seg {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  min-width: 64px;
  padding: 10px 8px 8px;
  background: rgba(16,16,14,0.6);
  border: 1px solid rgba(242,237,227,0.07);
  border-top: 2px solid var(--gold);
  border-radius: 4px;
}
.fxc-num {
  font-family: var(--display);
  font-size: 1.9rem;
  line-height: 1;
  color: var(--gold-hi);
  font-variant-numeric: tabular-nums;
}
.fxc-num.flip { animation: fxcFlip 0.45s ease; }
@keyframes fxcFlip {
  0%   { transform: rotateX(0);     opacity: 1; }
  45%  { transform: rotateX(86deg); opacity: 0.25; }
  55%  { transform: rotateX(-86deg);opacity: 0.25; }
  100% { transform: rotateX(0);     opacity: 1; }
}
.fxc-unit {
  font-size: 0.56rem;
  letter-spacing: 2.4px;
  text-transform: uppercase;
  color: var(--muted);
}
.fxc-live {
  font-family: var(--display);
  font-size: 1.9rem;
  letter-spacing: 3px;
  color: var(--gold-hi);
  padding: 10px 22px;
  border: 1px dashed var(--gold-30);
  border-radius: 4px;
  animation: eyebrowPulse 2s infinite;
}
@media (max-width: 600px) {
  .fx-countdown { justify-content: center; text-align: center; }
  .fxc-info { align-items: center; }
  .fxc-seg { min-width: 56px; }
}

/* ── 24 · SEAM ARCS — drawn on scroll ──────────────────────── */
.seam-arc {
  position: relative;
  height: 0;
  z-index: 2;
  pointer-events: none;
}
.seam-arc svg {
  position: absolute;
  left: 0; right: 0; top: -44px;
  width: 100%; height: 90px;
  overflow: visible;
}
.seam-arc .arc-line {
  fill: none;
  stroke: var(--gold);
  stroke-width: 1.6;
  opacity: 0.55;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
}
.seam-arc .arc-stitch {
  fill: none;
  stroke: var(--gold-hi);
  stroke-width: 11;
  stroke-dasharray: 0.0022 0.0146;   /* stitch ticks along the curve */
  opacity: 0;
}
/* Scroll-linked draw where supported… */
@supports (animation-timeline: view()) {
  .seam-arc .arc-line {
    animation: arcDraw linear both;
    animation-timeline: view();
    animation-range: entry 0% cover 42%;
  }
  .seam-arc .arc-line:nth-child(2) { animation-range: entry 5% cover 50%; }
  .seam-arc .arc-stitch {
    animation: arcStitch linear both;
    animation-timeline: view();
    animation-range: cover 25% cover 55%;
  }
}
@keyframes arcDraw   { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes arcStitch { from { opacity: 0; } to { opacity: 0.5; } }
/* …IntersectionObserver fallback elsewhere */
@supports not (animation-timeline: view()) {
  .seam-arc .arc-line   { transition: stroke-dashoffset 1.2s cubic-bezier(0.22,1,0.36,1); }
  .seam-arc .arc-line:nth-child(2) { transition-delay: 0.15s; }
  .seam-arc .arc-stitch { transition: opacity 0.7s ease 0.7s; }
  .seam-arc.in .arc-line   { stroke-dashoffset: 0; }
  .seam-arc.in .arc-stitch { opacity: 0.5; }
}

/* ── 25 · SCULPTED SECTION TRANSITIONS ─────────────────────── */
body.home #featured-player {
  margin-top: -3vw;
  padding-top: 3.4vw;
  clip-path: polygon(0 3vw, 100% 0, 100% 100%, 0 100%);
}
body.home #home-sponsors {
  margin-top: -3vw;
  padding-top: 3.4vw;
  clip-path: polygon(0 0, 100% 3vw, 100% 100%, 0 100%);
}

/* ── 26 · DIMENSIONAL CARDS ────────────────────────────────── */
body.home #featured-player .section-inner { perspective: 1200px; }
body.home .fp-card {
  transform-style: preserve-3d;
  will-change: transform;
  transition: transform 0.5s cubic-bezier(0.22,1,0.36,1), border-color 0.3s ease;
}
body.home .fp-card.tilting { transition: border-color 0.3s ease; }
body.home .sponsor-card::before {       /* pointer-tracked glare */
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(220px circle at var(--gx, 50%) var(--gy, 50%),
              rgba(232,201,106,0.14), transparent 65%);
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
}
body.home .sponsor-card:hover::before { opacity: 1; }

/* ── 27 · MATCH-DAY STATE ──────────────────────────────────── */
body.home.match-live .hero-eyebrow-dot {
  background: var(--live-red);
  animation: livePulse 1.1s infinite;
}
body.home.match-live .seam-fill {
  background: linear-gradient(180deg, #ff8a7d, var(--live-red) 60%, #8f2e25);
  box-shadow: 0 0 14px rgba(224,85,72,0.6);
}
body.home.match-live .seam-fill::after {
  background: radial-gradient(circle at 35% 30%, #ff9d92, #8f2e25);
  box-shadow: 0 0 16px rgba(224,85,72,0.85);
}
body.home.match-live .fxc-label { color: var(--live-red); }
body.home.match-live .fxc-label::before {
  background: var(--live-red);
  animation: livePulse 1.1s infinite;
}
@keyframes livePulse {
  0%   { box-shadow: 0 0 0 0 rgba(224,85,72,0.55); }
  70%  { box-shadow: 0 0 0 9px rgba(224,85,72,0); }
  100% { box-shadow: 0 0 0 0 rgba(224,85,72,0); }
}

/* ── 28 · LEVEL-2 ACCESSIBILITY ────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .hero-ticker-track { animation: none; }
  .hero-slide { transition: none; }
  body.home #featured-player,
  body.home #home-sponsors { clip-path: none; margin-top: 0; padding-top: 0; }
  .seam-arc .arc-line { stroke-dashoffset: 0; animation: none; }
  .seam-arc .arc-stitch { opacity: 0.5; animation: none; }
}