/* =================================================================
   THE DRIVEN ATHLETICS — "APEX" design system
   Motorsport-grade athletic luxury. Dark, cinematic, precise.
   ================================================================= */

/* ---------- Tokens ---------- */
:root{
  /* base */
  --ink:        #08090c;
  --ink-2:      #0c0e13;
  --surface:    #13151c;
  --surface-2:  #1a1d26;
  --surface-3:  #22262f;
  --line:       rgba(255,255,255,.08);
  --line-2:     rgba(255,255,255,.14);

  /* text */
  --chalk:      #f3f5fa;
  --fog:        #9aa2b1;
  --fog-dim:    #6b7280;

  /* brand */
  --blue:       #2f55ff;
  --blue-2:     #5a7bff;
  --blue-glow:  rgba(47,85,255,.45);
  --red:        #ff2a39;
  --red-2:      #ff5a66;
  --red-deep:   #cf0f1d;
  --gold:       #e8c869;
  --gold-2:     #f6dd97;
  --gold-deep:  #b98f33;

  /* gradients */
  --race:       linear-gradient(100deg, var(--blue) 0%, #6a3bff 42%, var(--red) 100%);
  --race-soft:  linear-gradient(100deg, rgba(47,85,255,.18), rgba(255,42,57,.18));
  --gold-grad:  linear-gradient(135deg, var(--gold-2), var(--gold-deep));

  /* type */
  --display: "Saira Condensed", "Arial Narrow", sans-serif;
  --label:   "Saira Semi Condensed", "Saira Condensed", sans-serif;
  --body:    "Sora", system-ui, sans-serif;

  /* metrics */
  --container: 1240px;
  --gutter: clamp(20px, 5vw, 64px);
  --radius: 4px;
  --radius-lg: 10px;
  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --nav-h: 76px;
}

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
}
body{
  font-family:var(--body);
  background:var(--ink);
  color:var(--chalk);
  line-height:1.65;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; cursor:pointer; background:none; border:none; }
ul{ list-style:none; }
::selection{ background:var(--blue); color:#fff; }

/* ---------- Atmospheric base ---------- */
body::before{ /* grain */
  content:""; position:fixed; inset:0; z-index:1; pointer-events:none; opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
}

/* ---------- Typography ---------- */
.display{
  font-family:var(--display);
  font-weight:800;
  line-height:.92;
  letter-spacing:-.01em;
  text-transform:uppercase;
}
h1,h2,h3,h4{ font-family:var(--display); font-weight:800; text-transform:uppercase; line-height:.94; letter-spacing:-.005em; }
.italic{ font-style:italic; }

.eyebrow{
  font-family:var(--label);
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.34em;
  font-size:.74rem;
  color:var(--fog);
  display:inline-flex; align-items:center; gap:.7em;
}
.eyebrow::before{
  content:""; width:26px; height:9px; flex:none;
  background:var(--race);
  clip-path:polygon(0 0, 100% 0, 86% 100%, 0% 100%);
}
.eyebrow.gold{ color:var(--gold-2); }
.eyebrow.gold::before{ background:var(--gold-grad); }
.eyebrow.center{ justify-content:center; }

.lead{ font-size:clamp(1.05rem, 1.6vw, 1.28rem); color:#d7dbe4; font-weight:300; }
.muted{ color:var(--fog); }

/* ---------- Layout ---------- */
.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter); }
.container-wide{ max-width:1480px; }
.section{ padding-block:clamp(72px, 11vw, 140px); position:relative; }
.section.tight{ padding-block:clamp(48px, 7vw, 84px); }
.relative{ position:relative; z-index:2; }
.grid{ display:grid; gap:clamp(18px,2.4vw,30px); }

/* checkered strip utility */
.checkers{
  --sq:10px;
  background-image:
    conic-gradient(var(--chalk) 90deg, transparent 90deg 180deg, var(--chalk) 180deg 270deg, transparent 270deg);
  background-size:calc(var(--sq)*2) calc(var(--sq)*2);
  background-position:0 0;
}

/* section number tag */
.tag-no{
  font-family:var(--display); font-style:italic; font-weight:800;
  font-size:.95rem; color:var(--blue-2); letter-spacing:.05em;
}

/* ====================================================================
   HEADER / NAV
   ==================================================================== */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:60; height:var(--nav-h);
  display:flex; align-items:center;
  transition:height .35s var(--ease), background .35s var(--ease), border-color .35s var(--ease);
  border-bottom:1px solid transparent;
}
.nav::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(to bottom, rgba(8,9,12,.85), rgba(8,9,12,0));
  transition:opacity .35s var(--ease);
}
.nav.scrolled{
  height:64px;
  background:rgba(9,10,14,.82);
  backdrop-filter:saturate(140%) blur(16px);
  -webkit-backdrop-filter:saturate(140%) blur(16px);
  border-bottom-color:var(--line);
}
.nav.scrolled::before{ opacity:0; }
.nav__inner{ width:100%; max-width:1480px; margin-inline:auto; padding-inline:var(--gutter);
  display:flex; align-items:center; justify-content:space-between; gap:24px; }

/* wordmark logo (CSS-built, crisp & on-brand) */
.brand{ display:inline-flex; align-items:center; gap:12px; flex:none; }
.brand__flag{
  width:30px; height:22px; flex:none; transform:skewX(-12deg);
  background-image:
    conic-gradient(#fff 90deg, #0000 90deg 180deg, #fff 180deg 270deg, #0000 270deg);
  background-size:11px 11px;
  border:1px solid rgba(255,255,255,.25);
  box-shadow:0 0 0 1px rgba(0,0,0,.4);
}
.brand__text{ display:flex; flex-direction:column; line-height:.84; }
.brand__1{ font-family:var(--display); font-style:italic; font-weight:800; font-size:1.32rem;
  letter-spacing:.01em; color:#fff; }
.brand__1 b{ color:var(--blue-2); -webkit-text-stroke:0; }
.brand__2{ font-family:var(--label); font-weight:700; font-size:.62rem; letter-spacing:.46em;
  color:var(--red-2); text-transform:uppercase; padding-left:2px; }

/* primary menu */
.menu{ display:flex; align-items:center; gap:4px; }
.menu__item{ position:relative; }
.menu__link{
  font-family:var(--label); font-weight:600; text-transform:uppercase; letter-spacing:.13em;
  font-size:.82rem; color:#cfd4de; padding:10px 14px; border-radius:var(--radius);
  display:inline-flex; align-items:center; gap:6px; transition:color .25s; white-space:nowrap;
}
.menu__link:hover, .menu__item.active > .menu__link{ color:#fff; }
.menu__link .caret{ width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor;
  transform:rotate(45deg) translateY(-2px); opacity:.6; transition:transform .3s; }
.menu__item:hover .caret{ transform:rotate(225deg) translateY(-1px); }
/* active underline */
.menu__link::after{
  content:""; position:absolute; left:14px; right:14px; bottom:4px; height:2px;
  background:var(--race); transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease);
}
.menu__link:hover::after, .menu__item.active > .menu__link::after{ transform:scaleX(1); }

/* dropdown */
.submenu{
  position:absolute; top:calc(100% + 10px); left:0; min-width:248px;
  background:rgba(16,18,24,.96); backdrop-filter:blur(18px);
  border:1px solid var(--line-2); border-radius:8px; padding:8px;
  box-shadow:0 28px 60px -20px rgba(0,0,0,.8);
  opacity:0; visibility:hidden; transform:translateY(8px); transition:.28s var(--ease);
}
.submenu::before{ content:""; position:absolute; top:-4px; left:24px; width:8px; height:8px;
  background:inherit; border-left:1px solid var(--line-2); border-top:1px solid var(--line-2); transform:rotate(45deg); }
.menu__item:hover .submenu{ opacity:1; visibility:visible; transform:translateY(0); }
.submenu a{
  display:flex; align-items:center; gap:10px; padding:11px 14px; border-radius:6px;
  font-family:var(--label); font-weight:500; letter-spacing:.06em; font-size:.86rem; color:#c4cad4;
  transition:background .2s, color .2s, padding .25s;
}
.submenu a::before{ content:""; width:14px; height:2px; background:var(--blue); transition:width .25s; flex:none; }
.submenu a:hover{ background:rgba(255,255,255,.05); color:#fff; padding-left:18px; }
.submenu a:hover::before{ width:20px; background:var(--red); }

.nav__cta{ display:flex; align-items:center; gap:14px; flex:none; }

/* burger */
.burger{ display:none; width:44px; height:44px; position:relative; z-index:80; }
.burger span{ position:absolute; left:9px; right:9px; height:2px; background:#fff; transition:.3s var(--ease); }
.burger span:nth-child(1){ top:15px; } .burger span:nth-child(2){ top:21px; } .burger span:nth-child(3){ top:27px; }
.menu-open .burger span:nth-child(1){ top:21px; transform:rotate(45deg); }
.menu-open .burger span:nth-child(2){ opacity:0; }
.menu-open .burger span:nth-child(3){ top:21px; transform:rotate(-45deg); }

/* ---------- Buttons ---------- */
.btn{
  --bg:var(--blue);
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--label); font-weight:700; text-transform:uppercase; letter-spacing:.16em;
  font-size:.82rem; line-height:1; padding:17px 34px; color:#fff; isolation:isolate;
  clip-path:polygon(9px 0, 100% 0, calc(100% - 9px) 100%, 0 100%);
  background:var(--bg); transition:transform .25s var(--ease), box-shadow .3s;
  overflow:hidden; white-space:nowrap;
}
.btn::after{ /* sweep */
  content:""; position:absolute; inset:0; z-index:-1; background:var(--race);
  transform:translateX(-101%); transition:transform .42s var(--ease);
}
.btn:hover{ transform:translateY(-2px); box-shadow:0 16px 34px -14px var(--blue-glow); }
.btn:hover::after{ transform:translateX(0); }
.btn .arrow{ transition:transform .3s; }
.btn:hover .arrow{ transform:translateX(4px); }

.btn--ghost{ background:transparent; color:#fff; border:1px solid var(--line-2);
  clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%); }
.btn--ghost::after{ background:#fff; }
.btn--ghost:hover{ color:var(--ink); border-color:#fff; box-shadow:none; }
.btn--gold{ background:transparent; color:var(--gold-2); border:1px solid rgba(232,200,105,.4); }
.btn--gold::after{ background:var(--gold-grad); }
.btn--gold:hover{ color:#1a1406; box-shadow:0 16px 34px -16px rgba(232,200,105,.4); }
.btn--lg{ padding:20px 38px; font-size:.9rem; }
.btn--ghost.btn--lg, .btn--gold.btn--lg{ }

.btn-text{ display:inline-flex; align-items:center; gap:9px; font-family:var(--label); font-weight:600;
  text-transform:uppercase; letter-spacing:.14em; font-size:.8rem; color:#fff; }
.btn-text .line{ width:30px; height:1px; background:var(--red); transition:width .3s; }
.btn-text:hover .line{ width:48px; }

/* ====================================================================
   HERO
   ==================================================================== */
.hero{ position:relative; min-height:100svh; display:flex; align-items:flex-end;
  padding-top:var(--nav-h); padding-bottom:clamp(48px,8vh,96px); overflow:hidden; }
.hero__media{ position:absolute; inset:0; z-index:0; }
.hero__media img{ width:100%; height:100%; object-fit:cover; object-position:center 28%;
  animation:slowzoom 18s ease-out forwards; }
@keyframes slowzoom{ from{ transform:scale(1.12); } to{ transform:scale(1); } }
.hero__scrim{ position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(180deg, rgba(8,9,12,.55) 0%, rgba(8,9,12,.12) 32%, rgba(8,9,12,.72) 78%, var(--ink) 100%),
    linear-gradient(90deg, rgba(8,9,12,.85) 0%, rgba(8,9,12,.15) 60%);
}
.hero__grain{ position:absolute; inset:0; z-index:1; opacity:.5;
  background:radial-gradient(120% 80% at 80% 10%, rgba(47,85,255,.18), transparent 55%),
             radial-gradient(90% 70% at 0% 100%, rgba(255,42,57,.12), transparent 55%); }
.hero__inner{ position:relative; z-index:3; width:100%; }
.hero__title{ font-size:clamp(3.4rem, 12vw, 10.5rem); color:#fff; letter-spacing:-.02em; }
.hero__title .ln{ display:block; overflow:hidden; }
.hero__title .ln > span{ display:block; }
.hero__title em{ font-style:italic; color:transparent;
  -webkit-text-stroke:2px rgba(255,255,255,.85); }
.hero__title .accent{ background:var(--race); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero__sub{ max-width:560px; margin-top:26px; font-size:clamp(1rem,1.5vw,1.18rem); color:#cdd2dc; font-weight:300; }
.hero__actions{ display:flex; flex-wrap:wrap; gap:16px; margin-top:36px; }

/* hero meta rail */
.hero__rail{ position:absolute; z-index:4; right:var(--gutter); bottom:clamp(48px,8vh,96px);
  display:flex; flex-direction:column; align-items:flex-end; gap:18px; }
.hero__rail .soc{ display:flex; flex-direction:column; gap:14px; }
.hero__rail .soc a{ color:var(--fog); transition:color .25s, transform .25s; }
.hero__rail .soc a:hover{ color:#fff; transform:translateY(-2px); }
.hero__rail .vline{ width:1px; height:70px; background:linear-gradient(var(--line-2), transparent); margin-right:11px; }

.hero__est{ position:absolute; z-index:4; left:var(--gutter); top:calc(var(--nav-h) + 28px);
  writing-mode:vertical-rl; font-family:var(--label); font-weight:600; letter-spacing:.4em;
  text-transform:uppercase; font-size:.72rem; color:var(--fog); display:flex; align-items:center; gap:16px; }
.hero__est::after{ content:""; height:60px; width:1px; background:linear-gradient(var(--fog-dim), transparent); }

.scroll-cue{ position:absolute; left:50%; bottom:22px; transform:translateX(-50%); z-index:4;
  font-family:var(--label); letter-spacing:.3em; font-size:.62rem; color:var(--fog); text-transform:uppercase;
  display:flex; flex-direction:column; align-items:center; gap:8px; }
.scroll-cue .dot{ width:5px; height:5px; border-radius:50%; background:var(--red);
  animation:cue 1.6s var(--ease) infinite; }
@keyframes cue{ 0%{ transform:translateY(0); opacity:1;} 70%{ transform:translateY(16px); opacity:0;} 100%{opacity:0;} }

/* ---------- Achievement ticker ---------- */
.ticker{ border-block:1px solid var(--line); background:var(--ink-2); overflow:hidden; padding-block:18px; position:relative; }
.ticker::before,.ticker::after{ content:""; position:absolute; top:0; bottom:0; width:120px; z-index:2; pointer-events:none; }
.ticker::before{ left:0; background:linear-gradient(90deg, var(--ink-2), transparent); }
.ticker::after{ right:0; background:linear-gradient(270deg, var(--ink-2), transparent); }
.ticker__track{ display:flex; gap:0; width:max-content; animation:marq 38s linear infinite; }
.ticker:hover .ticker__track{ animation-play-state:paused; }
@keyframes marq{ to{ transform:translateX(-50%); } }
.ticker__item{ display:inline-flex; align-items:center; gap:24px; padding-inline:24px;
  font-family:var(--display); font-style:italic; font-weight:800; text-transform:uppercase;
  font-size:clamp(1.1rem,2vw,1.7rem); color:#e9ecf2; letter-spacing:.01em; }
.ticker__item .star{ color:var(--gold); font-style:normal; }
.ticker__item.is-dim{ color:transparent; -webkit-text-stroke:1px var(--line-2); }

/* ====================================================================
   GENERIC SECTION PIECES
   ==================================================================== */
.section-head{ display:grid; gap:18px; max-width:760px; }
.section-head h2{ font-size:clamp(2.2rem,5.2vw,4.2rem); color:#fff; }
.section-head.center{ margin-inline:auto; text-align:center; justify-items:center; }
.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,72px); align-items:center; }
.split.wide-left{ grid-template-columns:1.1fr .9fr; }

/* framed media */
.framed{ position:relative; border-radius:var(--radius-lg); overflow:hidden; }
.framed img{ width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease-out); }
.framed::after{ content:""; position:absolute; inset:0; box-shadow:inset 0 0 0 1px var(--line);
  border-radius:inherit; pointer-events:none; }
.framed .corner{ position:absolute; width:30px; height:30px; z-index:2; }
.framed .corner.tl{ top:14px; left:14px; border-top:2px solid var(--red); border-left:2px solid var(--red); }
.framed .corner.br{ bottom:14px; right:14px; border-bottom:2px solid var(--blue-2); border-right:2px solid var(--blue-2); }

/* stats */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line);
  border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden; }
.stat{ background:var(--ink-2); padding:clamp(26px,3.4vw,42px) clamp(18px,2.4vw,30px); position:relative; }
.stat::before{ content:""; position:absolute; top:0; left:0; width:36px; height:3px; background:var(--race); }
.stat__num{ font-family:var(--display); font-weight:800; font-style:italic; line-height:1;
  font-size:clamp(2.8rem,5vw,4.4rem); color:#fff; }
.stat__num .u{ color:var(--blue-2); }
.stat__lbl{ font-family:var(--label); text-transform:uppercase; letter-spacing:.16em; font-size:.74rem;
  color:var(--fog); margin-top:12px; }

/* program cards */
.cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2vw,24px); }
.pcard{ position:relative; border-radius:var(--radius-lg); overflow:hidden; min-height:440px;
  display:flex; flex-direction:column; justify-content:flex-end; isolation:isolate;
  border:1px solid var(--line); transition:transform .5s var(--ease), border-color .4s; }
.pcard img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2;
  transition:transform .8s var(--ease-out); }
.pcard::after{ content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg, rgba(8,9,12,.05) 0%, rgba(8,9,12,.55) 55%, rgba(8,9,12,.95) 100%); }
.pcard:hover{ transform:translateY(-6px); border-color:var(--line-2); }
.pcard:hover img{ transform:scale(1.07); }
.pcard__no{ position:absolute; top:20px; left:22px; font-family:var(--display); font-style:italic;
  font-weight:800; font-size:1.1rem; color:rgba(255,255,255,.5); letter-spacing:.05em; }
.pcard__flag{ position:absolute; top:24px; right:22px; width:30px; height:20px; transform:skewX(-12deg);
  --sq:7px; opacity:.85; }
.pcard__body{ padding:26px 24px 28px; position:relative; }
.pcard__body h3{ font-size:clamp(1.5rem,2.4vw,2rem); color:#fff; }
.pcard__body p{ color:var(--fog); font-size:.95rem; margin-top:10px; font-weight:300; }
.pcard__link{ margin-top:18px; display:inline-flex; align-items:center; gap:9px; font-family:var(--label);
  font-weight:600; text-transform:uppercase; letter-spacing:.14em; font-size:.74rem; color:#fff; }
.pcard__link .line{ width:24px; height:1px; background:var(--red); transition:width .3s; }
.pcard:hover .pcard__link .line{ width:40px; }

/* feature list */
.flist{ display:grid; gap:2px; }
.frow{ display:grid; grid-template-columns:auto 1fr; gap:20px; align-items:start;
  padding:24px 0; border-top:1px solid var(--line); }
.frow:last-child{ border-bottom:1px solid var(--line); }
.frow__no{ font-family:var(--display); font-style:italic; font-weight:800; font-size:1.4rem;
  color:var(--blue-2); }
.frow h3{ font-size:1.5rem; color:#fff; }
.frow p{ color:var(--fog); margin-top:8px; font-weight:300; }

/* pill chips */
.chips{ display:flex; flex-wrap:wrap; gap:8px; }
.chip{ font-family:var(--label); text-transform:uppercase; letter-spacing:.1em; font-size:.68rem;
  color:#cdd2dc; padding:7px 13px; border:1px solid var(--line-2); border-radius:100px; background:rgba(255,255,255,.02); }
.chip.blue{ border-color:rgba(47,85,255,.5); color:var(--blue-2); }
.chip.red{ border-color:rgba(255,42,57,.45); color:var(--red-2); }
.chip.gold{ border-color:rgba(232,200,105,.45); color:var(--gold-2); }

/* ====================================================================
   AWARDS / PODIUM
   ==================================================================== */
.award-band{ position:relative; overflow:hidden; }
.medal{ width:64px; height:64px; flex:none; border-radius:50%; display:grid; place-items:center;
  background:var(--gold-grad); color:#1a1406; font-family:var(--display); font-weight:800; font-style:italic;
  box-shadow:0 0 0 6px rgba(232,200,105,.12), 0 18px 40px -18px rgba(232,200,105,.5); position:relative; }
.medal::after{ content:""; position:absolute; inset:-3px; border-radius:50%; border:1px dashed rgba(232,200,105,.4); }
.award-row{ display:grid; grid-template-columns:auto 1fr; gap:22px; align-items:center;
  padding:26px 0; border-top:1px solid rgba(232,200,105,.16); }
.award-row:last-child{ border-bottom:1px solid rgba(232,200,105,.16); }
.award-row h3{ font-size:clamp(1.4rem,2.2vw,1.9rem); color:#fff; }
.award-row p{ color:var(--fog); font-weight:300; margin-top:4px; }

/* ====================================================================
   COACHES / ROSTER
   ==================================================================== */
.roster{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(14px,1.6vw,22px); }
.coach{ position:relative; border-radius:var(--radius-lg); overflow:hidden; background:var(--surface);
  border:1px solid var(--line); transition:transform .45s var(--ease), border-color .4s; }
.coach:hover{ transform:translateY(-5px); border-color:var(--line-2); }
.coach__img{ position:relative; aspect-ratio:3/4; overflow:hidden; background:var(--surface-2); }
.coach__img img{ width:100%; height:100%; object-fit:cover; object-position:center 20%; transition:transform .8s var(--ease-out); }
.coach:hover .coach__img img{ transform:scale(1.06); }
.coach__img::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 45%, rgba(15,17,22,.92) 100%); }
.coach__mono{ position:absolute; inset:0; display:grid; place-items:center;
  font-family:var(--display); font-style:italic; font-weight:800; font-size:4rem; color:var(--surface-3);
  background:radial-gradient(circle at 50% 35%, var(--surface-2), var(--surface)); }
.coach__role{ position:absolute; left:14px; bottom:14px; z-index:2; font-family:var(--label);
  text-transform:uppercase; letter-spacing:.12em; font-size:.64rem; color:#fff;
  padding:6px 11px; background:rgba(47,85,255,.85); border-radius:3px; backdrop-filter:blur(4px); }
.coach__body{ padding:18px 18px 22px; }
.coach__body h3{ font-size:1.35rem; color:#fff; }
.coach__body p{ color:var(--fog); font-size:.86rem; font-weight:300; margin-top:8px; line-height:1.55; }
.coach.founder{ grid-column:span 2; }
@media(min-width:861px){
  .coach.founder .coach__img{ aspect-ratio:auto; height:100%; }
  .coach.founder{ display:grid; grid-template-columns:1fr 1.1fr; }
}

/* ====================================================================
   SCHEDULE
   ==================================================================== */
.sched{ display:grid; grid-template-columns:repeat(5,1fr); gap:14px; }
.day{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:20px 18px; }
.day__h{ font-family:var(--display); font-weight:800; text-transform:uppercase; font-size:1.3rem;
  color:#fff; padding-bottom:14px; margin-bottom:6px; border-bottom:2px solid; border-image:var(--race) 1;
  display:flex; align-items:center; justify-content:space-between; }
.day__h span{ font-family:var(--label); font-size:.6rem; letter-spacing:.2em; color:var(--fog); }
.slot{ display:flex; justify-content:space-between; gap:12px; padding:11px 0; border-top:1px solid var(--line); }
.slot:first-of-type{ border-top:none; }
.slot__t{ font-family:var(--label); font-weight:600; font-size:.72rem; letter-spacing:.06em; color:var(--blue-2);
  white-space:nowrap; padding-top:2px; }
.slot__c{ font-size:.88rem; color:#dfe3ea; text-align:right; font-weight:300; }

/* ====================================================================
   PRICING / TIERS
   ==================================================================== */
.tiers{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(14px,1.6vw,20px); align-items:stretch; }
.tier{ display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius-lg); overflow:hidden; transition:transform .4s var(--ease), border-color .4s; position:relative; }
.tier:hover{ transform:translateY(-6px); }
.tier__top{ padding:26px 24px 22px; border-bottom:1px solid var(--line); position:relative; }
.tier__bar{ height:4px; }
.tier__name{ font-family:var(--display); font-weight:800; text-transform:uppercase; font-size:1.7rem; }
.tier__price{ font-family:var(--label); font-weight:600; letter-spacing:.05em; color:var(--fog);
  font-size:.9rem; margin-top:4px; }
.tier__list{ padding:22px 24px 26px; display:grid; gap:12px; flex:1; }
.tier__list li{ display:grid; grid-template-columns:auto 1fr; gap:11px; font-size:.86rem; color:#d4d9e1;
  font-weight:300; line-height:1.45; }
.tier__list li .ck{ width:16px; height:16px; flex:none; margin-top:3px; }
.tier__list li .ck::before{ content:""; display:block; width:9px; height:5px; margin:4px auto 0;
  border-left:2px solid var(--blue-2); border-bottom:2px solid var(--blue-2); transform:rotate(-45deg); }
.tier.bronze .tier__bar{ background:linear-gradient(90deg,#a86b3c,#cd9b6a); }
.tier.bronze .tier__name{ color:#d6a374; }
.tier.silver .tier__bar{ background:linear-gradient(90deg,#9aa3b2,#dde3ee); }
.tier.silver .tier__name{ color:#cdd3df; }
.tier.gold .tier__bar{ background:var(--gold-grad); }
.tier.gold .tier__name{ color:var(--gold-2); }
.tier.platinum{ border-color:rgba(232,200,105,.3); }
.tier.platinum .tier__bar{ background:linear-gradient(90deg,#dfe7ff,#9fb4ff,#e8c869); }
.tier.platinum .tier__name{ background:linear-gradient(100deg,#e8eeff,#e8c869); -webkit-background-clip:text; background-clip:text; color:transparent; }
.tier__flag{ position:absolute; top:18px; right:20px; font-family:var(--label); font-size:.6rem;
  letter-spacing:.18em; text-transform:uppercase; color:var(--gold-2); }

/* ====================================================================
   GALLERY / MOSAIC
   ==================================================================== */
.mosaic{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:15.5vw; gap:12px; }
.mosaic .m{ overflow:hidden; border-radius:8px; position:relative; grid-row:span 2; }
.mosaic .m img{ width:100%; height:100%; object-fit:cover; object-position:center 16%;
  transition:transform .9s var(--ease-out); filter:saturate(1.02); }
.mosaic .m:hover img{ transform:scale(1.06); }
.mosaic .m::after{ content:""; position:absolute; inset:0; box-shadow:inset 0 0 0 1px var(--line); border-radius:inherit; }
.mosaic .m.feat{ grid-column:span 2; grid-row:span 2; }
.mosaic .m.feat img{ object-position:center 32%; }

/* ====================================================================
   CTA BAND
   ==================================================================== */
.cta-band{ position:relative; overflow:hidden; border-radius:var(--radius-lg); isolation:isolate; }
.cta-band img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
.cta-band::after{ content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(110deg, rgba(8,9,12,.92) 0%, rgba(8,9,12,.6) 55%, rgba(47,85,255,.28) 100%); }
.cta-band__in{ padding:clamp(48px,7vw,96px) clamp(28px,6vw,80px); max-width:720px; }
.cta-band h2{ font-size:clamp(2.4rem,5.5vw,4.6rem); color:#fff; }

/* contact form */
.field{ display:grid; gap:9px; margin-bottom:18px; }
.field label{ font-family:var(--label); text-transform:uppercase; letter-spacing:.16em; font-size:.68rem; color:var(--fog); }
.field input,.field textarea,.field select{ background:var(--surface); border:1px solid var(--line-2);
  border-radius:6px; padding:14px 16px; color:#fff; font-family:var(--body); font-size:.95rem; transition:border-color .25s, box-shadow .25s; }
.field input:focus,.field textarea:focus,.field select:focus{ outline:none; border-color:var(--blue);
  box-shadow:0 0 0 3px rgba(47,85,255,.18); }
.field textarea{ min-height:140px; resize:vertical; }
.row-2{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }

.info-card{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:22px 24px; display:flex; gap:16px; align-items:flex-start; transition:border-color .3s, transform .3s; }
.info-card:hover{ border-color:var(--line-2); transform:translateY(-3px); }
.info-card .ic{ width:42px; height:42px; flex:none; border-radius:8px; display:grid; place-items:center;
  background:rgba(47,85,255,.12); color:var(--blue-2); }
.info-card h4{ font-family:var(--label); font-weight:700; letter-spacing:.1em; font-size:.74rem; color:var(--fog); text-transform:uppercase; }
.info-card a,.info-card p{ color:#fff; font-size:1.02rem; margin-top:4px; font-family:var(--display); font-weight:600; letter-spacing:.01em; }
.info-card.span{ }

/* ====================================================================
   PAGE HERO (interior)
   ==================================================================== */
.phero{ position:relative; padding-top:calc(var(--nav-h) + clamp(60px,9vw,120px));
  padding-bottom:clamp(48px,7vw,90px); overflow:hidden; }
.phero__media{ position:absolute; inset:0; z-index:0; }
.phero__media img{ width:100%; height:100%; object-fit:cover; object-position:center 30%; }
.phero__scrim{ position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(8,9,12,.7), rgba(8,9,12,.55) 40%, var(--ink) 100%),
            linear-gradient(90deg, rgba(8,9,12,.8), transparent 70%); }
.phero__in{ position:relative; z-index:2; }
.phero h1{ font-size:clamp(2.8rem,8vw,7rem); color:#fff; letter-spacing:-.02em; }
.phero h1 em{ font-style:italic; color:transparent; -webkit-text-stroke:1.5px rgba(255,255,255,.8); }
.phero h1 .accent{ background:var(--race); -webkit-background-clip:text; background-clip:text; color:transparent; }
.phero__sub{ max-width:620px; margin-top:20px; font-size:clamp(1rem,1.5vw,1.18rem); color:#cdd2dc; font-weight:300; }
.crumbs{ display:flex; gap:10px; align-items:center; font-family:var(--label); text-transform:uppercase;
  letter-spacing:.16em; font-size:.7rem; color:var(--fog); margin-bottom:24px; }
.crumbs a:hover{ color:#fff; }
.crumbs .sep{ width:14px; height:1px; background:var(--fog-dim); }

/* prose */
.prose p{ color:#c9ced7; font-weight:300; font-size:1.05rem; margin-bottom:18px; }
.prose p:last-child{ margin-bottom:0; }
.prose strong{ color:#fff; font-weight:600; }

/* DRIVEN acronym */
.acro{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line);
  border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden; }
.acro__i{ background:var(--ink-2); padding:26px 24px; transition:background .35s; }
.acro__i:hover{ background:var(--surface); }
.acro__l{ font-family:var(--display); font-weight:800; font-size:2.6rem; line-height:1; }
.acro__l b{ display:inline-block; transform:skewX(-9deg); padding:0 .12em 0 .02em;
  background:var(--race); -webkit-background-clip:text; background-clip:text; color:transparent; }
.acro__w{ font-family:var(--label); text-transform:uppercase; letter-spacing:.18em; font-size:.78rem; color:#fff; margin-top:8px; }
.acro__d{ color:var(--fog); font-size:.85rem; font-weight:300; margin-top:6px; }

/* sponsor logos */
.logos{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.logo-chip{ background:#fff; border-radius:var(--radius-lg); aspect-ratio:3/2; display:grid; place-items:center;
  padding:26px; transition:transform .4s var(--ease), box-shadow .4s; position:relative; overflow:hidden; }
.logo-chip::before{ content:""; position:absolute; inset:0; background:var(--race); opacity:0; transition:opacity .4s; mix-blend-mode:multiply; }
.logo-chip img{ max-height:100%; max-width:100%; width:auto; object-fit:contain; }
.logo-chip:hover{ transform:translateY(-5px); box-shadow:0 22px 44px -22px rgba(0,0,0,.7); }

/* note / callout */
.note{ display:grid; grid-template-columns:auto 1fr; gap:16px; padding:22px 24px;
  background:rgba(47,85,255,.06); border:1px solid rgba(47,85,255,.22); border-radius:var(--radius-lg); }
.note.red{ background:rgba(255,42,57,.06); border-color:rgba(255,42,57,.25); }
.note .ic{ color:var(--blue-2); flex:none; }
.note.red .ic{ color:var(--red-2); }
.note h4{ font-family:var(--display); font-size:1.15rem; color:#fff; }
.note p{ color:var(--fog); font-size:.9rem; font-weight:300; margin-top:4px; }

/* ====================================================================
   FOOTER
   ==================================================================== */
.footer{ position:relative; background:var(--ink-2); border-top:1px solid var(--line); padding-top:0; }
.finish{ height:18px; --sq:9px; opacity:.9; }
.footer__main{ padding-block:clamp(56px,7vw,90px); display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:clamp(28px,4vw,56px); }
.footer__brand .brand{ margin-bottom:20px; }
.footer__brand p{ color:var(--fog); font-weight:300; font-size:.92rem; max-width:300px; }
.footer h5{ font-family:var(--label); text-transform:uppercase; letter-spacing:.2em; font-size:.72rem;
  color:var(--fog); margin-bottom:20px; }
.footer__col a{ display:block; color:#cdd2dc; padding:7px 0; font-size:.92rem; transition:color .2s, padding .25s; }
.footer__col a:hover{ color:#fff; padding-left:6px; }
.fcontact{ display:grid; gap:14px; }
.fcontact a,.fcontact p{ color:#cdd2dc; font-size:.92rem; display:flex; gap:11px; align-items:flex-start; }
.fcontact .ic{ color:var(--blue-2); flex:none; margin-top:2px; }
.fsoc{ display:flex; gap:12px; margin-top:20px; }
.fsoc a{ width:40px; height:40px; border:1px solid var(--line-2); border-radius:8px; display:grid; place-items:center;
  color:#cdd2dc; transition:.25s; }
.fsoc a:hover{ background:var(--race); border-color:transparent; color:#fff; transform:translateY(-2px); }
.footer__bar{ border-top:1px solid var(--line); padding-block:24px; display:flex; flex-wrap:wrap;
  justify-content:space-between; gap:14px; align-items:center; }
.footer__bar p{ color:var(--fog-dim); font-size:.8rem; }
.footer__bar .made{ font-family:var(--label); letter-spacing:.1em; text-transform:uppercase; font-size:.68rem; }
.footer__watermark{ font-family:var(--display); font-style:italic; font-weight:800; text-transform:uppercase;
  font-size:clamp(3rem,13vw,11rem); line-height:.8; color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.05);
  text-align:center; padding-bottom:18px; pointer-events:none; user-select:none; white-space:nowrap; overflow:hidden; }

/* ====================================================================
   SCROLL REVEAL
   ==================================================================== */
[data-reveal]{ opacity:0; transform:translateY(28px); transition:opacity .9s var(--ease-out), transform .9s var(--ease-out); }
[data-reveal].in{ opacity:1; transform:none; }
[data-reveal][data-d="1"]{ transition-delay:.08s; }
[data-reveal][data-d="2"]{ transition-delay:.16s; }
[data-reveal][data-d="3"]{ transition-delay:.24s; }
[data-reveal][data-d="4"]{ transition-delay:.32s; }
[data-reveal][data-d="5"]{ transition-delay:.4s; }
.hero [data-reveal]{ transition-duration:1s; }

/* hero line stagger */
.hero__title .ln > span{ transform:translateY(110%); transition:transform 1s var(--ease-out); }
.hero.loaded .hero__title .ln > span{ transform:translateY(0); }
.hero__title .ln:nth-child(2) > span{ transition-delay:.12s; }
.hero__title .ln:nth-child(3) > span{ transition-delay:.24s; }
.hero.loaded .hero__sub, .hero.loaded .hero__actions{ opacity:1; transform:none; }
.hero__sub,.hero__actions{ opacity:0; transform:translateY(20px); transition:opacity 1s .5s var(--ease-out), transform 1s .5s var(--ease-out); }

/* utility */
.mt-s{ margin-top:18px; } .mt-m{ margin-top:32px; } .mt-l{ margin-top:52px; }
.center{ text-align:center; } .maxw{ max-width:720px; } .mx-auto{ margin-inline:auto; }
.divider{ height:1px; background:var(--line); }

/* ====================================================================
   RESPONSIVE
   ==================================================================== */
@media (max-width:1080px){
  .roster{ grid-template-columns:repeat(2,1fr); }
  .tiers{ grid-template-columns:repeat(2,1fr); }
  .footer__main{ grid-template-columns:1fr 1fr; }
}
@media (max-width:980px){
  .cards{ grid-template-columns:1fr 1fr; }
  .stats{ grid-template-columns:1fr 1fr; }
  .sched{ grid-template-columns:1fr 1fr; }
  .menu, .nav__cta .btn{ display:none; }
  .burger{ display:block; }
}
@media (max-width:860px){
  .split, .split.wide-left{ grid-template-columns:1fr; }
  .split .order-first{ order:-1; }
  .coach.founder{ grid-column:span 2; }
  .mosaic{ grid-template-columns:repeat(2,1fr); grid-auto-rows:30vw; }
  .mosaic .m.feat{ grid-column:span 2; grid-row:span 1; }
  .hero__rail, .hero__est{ display:none; }
  .row-2{ grid-template-columns:1fr; }
}
@media (max-width:620px){
  .cards{ grid-template-columns:1fr; }
  .stats{ grid-template-columns:1fr 1fr; }
  .sched{ grid-template-columns:1fr; }
  .roster{ grid-template-columns:1fr 1fr; }
  .tiers{ grid-template-columns:1fr; }
  .logos{ grid-template-columns:1fr 1fr; }
  .footer__main{ grid-template-columns:1fr; }
  .acro{ grid-template-columns:1fr; }
  .coach.founder{ grid-column:span 2; grid-template-columns:1fr; display:block; }
  .coach.founder .coach__img{ aspect-ratio:3/4; }
}

/* ---------- Mobile drawer ---------- */
.drawer{ position:fixed; inset:0; z-index:70; visibility:hidden; }
.drawer__scrim{ position:absolute; inset:0; background:rgba(5,6,9,.6); opacity:0; transition:opacity .4s; }
.drawer__panel{ position:absolute; top:0; right:0; bottom:0; width:min(86vw,400px);
  background:var(--ink-2); border-left:1px solid var(--line); padding:96px 32px 40px;
  transform:translateX(100%); transition:transform .45s var(--ease); overflow-y:auto; }
.menu-open .drawer{ visibility:visible; }
.menu-open .drawer__scrim{ opacity:1; }
.menu-open .drawer__panel{ transform:translateX(0); }
.drawer a{ display:block; font-family:var(--display); text-transform:uppercase; font-weight:800;
  font-size:1.9rem; color:#e7eaf0; padding:11px 0; border-bottom:1px solid var(--line); transition:color .2s, padding .25s; }
.drawer a:hover{ color:var(--blue-2); padding-left:8px; }
.drawer a.sub{ font-family:var(--label); font-size:.95rem; font-weight:600; letter-spacing:.08em;
  color:var(--fog); padding-left:18px; border-bottom:none; padding-block:8px; }
.drawer a.sub::before{ content:"— "; color:var(--red); }
.drawer .btn{ margin-top:28px; width:100%; }
.drawer__soc{ display:flex; gap:12px; margin-top:28px; }
.drawer__soc a{ border:1px solid var(--line-2); width:46px; height:46px; border-radius:8px; display:grid;
  place-items:center; padding:0; font-size:0; }
.drawer__soc a svg{ width:20px; height:20px; }

/* ====================================================================
   TEAM / "STARTING GRID" CARDS
   ==================================================================== */
.teams{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(12px,1.4vw,16px); }
.tcard{ position:relative; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:24px 22px 20px; overflow:hidden; transition:transform .4s var(--ease), border-color .4s; }
.tcard::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--race);
  transform:scaleY(0); transform-origin:top; transition:transform .45s var(--ease); }
.tcard::after{ content:""; position:absolute; top:14px; right:16px; width:26px; height:17px; transform:skewX(-12deg);
  --sq:6px; opacity:.5; transition:opacity .4s;
  background-image:conic-gradient(var(--chalk) 90deg,#0000 90deg 180deg,var(--chalk) 180deg 270deg,#0000 270deg);
  background-size:calc(var(--sq)*2) calc(var(--sq)*2); }
.tcard:hover{ transform:translateY(-5px); border-color:var(--line-2); }
.tcard:hover::before{ transform:scaleY(1); }
.tcard:hover::after{ opacity:.95; }
.tcard__no{ font-family:var(--display); font-style:italic; font-weight:800; font-size:1rem; color:var(--blue-2); letter-spacing:.05em; }
.tcard h3{ font-family:var(--display); font-style:italic; font-weight:800; text-transform:uppercase;
  font-size:clamp(1.3rem,2vw,1.75rem); color:#fff; line-height:.94; margin-top:6px; }
.tcard__tag{ display:inline-block; margin-top:14px; font-family:var(--label); text-transform:uppercase;
  letter-spacing:.14em; font-size:.62rem; color:var(--fog); padding:5px 11px; border:1px solid var(--line-2); border-radius:100px; }
@media (max-width:980px){ .teams{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:680px){ .teams{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:400px){ .teams{ grid-template-columns:1fr; } }
