/* ============================================================
   HEART SOCCER ACADEMY — 2026 Design System
   ----------------------------------------------------------------
   01  Tokens & reset
   02  Base
   03  Typography
   04  Utilities (container, section, kicker, heads)
   05  Buttons
   06  Navigation + mobile menu
   07  Hero (home)
   08  Page hero (inner pages)
   09  Marquee
   10  Feature cards
   11  Audience (who we train) + pathway
   12  Flagship program + tiles
   13  Experience collage
   14  Founder section
   15  Bands (red statement + final CTA)
   16  Footer
   17  About page blocks
   18  Programs page blocks
   19  Development page blocks
   20  Coaching page blocks
   21  Contact page + form
   22  Merch page
   23  Reveal / motion
   24  Responsive
   ============================================================ */

/* ---------- 01 · TOKENS & RESET ---------- */
:root{
  /* surfaces */
  --ink:        #0B0F14;
  --ink-2:      #10151C;
  --ink-3:      #161D26;
  --ink-line:   rgba(255,255,255,.10);
  --ink-line-2: rgba(255,255,255,.18);
  --paper:      #EFF1EE;
  --paper-2:    #E2E6E1;
  --paper-line: rgba(11,15,20,.14);

  /* text */
  --t-on-dark:   #E9EDEF;
  --dim-on-dark: #9AA5B1;
  --t-on-light:  #12171D;
  --dim-on-light:#54606C;

  /* brand */
  --red:        #E3372C;
  --red-bright: #FF4B3A;
  --red-deep:   #AE2118;
  --red-soft:   rgba(227,55,44,.12);
  --red-line:   rgba(227,55,44,.38);

  /* type */
  --font-display: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --font-body:    "Inter", "Helvetica Neue", Arial, sans-serif;
  --font-mono:    ui-monospace, "SF Mono", "Cascadia Mono", "Roboto Mono", Menlo, monospace;

  /* layout */
  --container: 1240px;
  --gutter: clamp(20px, 4vw, 48px);
  --sec-pad: clamp(76px, 10vw, 148px);
  --ease: cubic-bezier(.22,.61,.21,1);
  --nav-h: 76px;
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; overflow-x:hidden; overflow-x:clip; }
@media (prefers-reduced-motion: no-preference){ html{ scroll-behavior:smooth; } }
body{
  font-family:var(--font-body);
  font-size:1rem;
  line-height:1.65;
  background:var(--ink);
  color:var(--t-on-dark);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg,video{ display:block; max-width:100%; }
img{ height:auto; }
ul[role="list"],.no-bullets{ list-style:none; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
::selection{ background:var(--red); color:#fff; }

:focus-visible{
  outline:2px solid var(--red-bright);
  outline-offset:3px;
  border-radius:2px;
}

/* ---------- 02 · BASE ---------- */
.skip-link{
  position:fixed; top:-100px; left:16px; z-index:300;
  background:var(--red); color:#fff;
  font-family:var(--font-display); font-weight:700; font-size:.8rem;
  letter-spacing:.1em; text-transform:uppercase;
  padding:12px 20px; transition:top .25s;
}
.skip-link:focus{ top:12px; }

.container{
  width:100%;
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:var(--gutter);
}
/* grid items must not force tracks wider than the viewport */
.feature-grid, .pillars, .access-grid, .prog-tiles, .steps, .stream-grid,
.cred-list, .philosophy-grid, .audience-grid, .poster-wrap, .story-split,
.mentoring, .collage, .pathway__steps, .specs, .stats, .dim, .founder,
.coach-profile, .contact-grid, .merch-split, .flagship, .field__row,
.image-pair, .cred-clubs, .hero__meta, .footer__top{
  min-width:0;
}
.feature-grid > *, .pillars > *, .access-grid > *, .prog-tiles > *,
.steps > *, .stream-grid > *, .cred-list > *, .philosophy-grid > *,
.audience-grid > *, .poster-wrap > *, .story-split > *, .mentoring > *,
.collage > *, .pathway__steps > *, .specs > *, .stats > *, .dim > *,
.founder > *, .coach-profile > *, .contact-grid > *, .merch-split > *,
.flagship > *, .field__row > *, .image-pair > *, .cred-clubs > *,
.hero__meta > *, .footer__top > *{
  min-width:0;
}
[id]{ scroll-margin-top:calc(var(--nav-h) + 18px); }

/* ---------- 03 · TYPOGRAPHY ---------- */
.h-display, .h-xl, .h-lg, .h-md{
  font-family:var(--font-display);
  text-transform:uppercase;
  line-height:.96;
  letter-spacing:-.005em;
  font-weight:800;
  font-stretch:116%;
  text-wrap:balance;
}
.h-xl{ font-size:clamp(2.5rem, 5.6vw, 4.9rem); }
.h-lg{ font-size:clamp(2rem, 4.2vw, 3.4rem); }
.h-md{ font-size:clamp(1.25rem, 2.2vw, 1.7rem); font-weight:750; font-stretch:108%; }
.lead{
  font-size:clamp(1.06rem, 1.4vw, 1.22rem);
  line-height:1.62;
  font-weight:450;
  color:var(--dim-on-dark);
  max-width:62ch;
}
.section--light .lead{ color:var(--dim-on-light); }
.mono{
  font-family:var(--font-mono);
  letter-spacing:.16em;
  text-transform:uppercase;
}
em.accent{ font-style:normal; color:var(--red-bright); }
.section--light em.accent{ color:var(--red-deep); }

/* ---------- 04 · UTILITIES ---------- */
.section{ padding-block:var(--sec-pad); position:relative; }
.section--dark { background:var(--ink); color:var(--t-on-dark); }
.section--dark-2{ background:var(--ink-2); color:var(--t-on-dark); }
.section--light{ background:var(--paper); color:var(--t-on-light); }
.section--light-2{ background:var(--paper-2); color:var(--t-on-light); }

.kicker{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--font-mono);
  font-size:.72rem; font-weight:500;
  letter-spacing:.24em; text-transform:uppercase;
  color:var(--red-bright);
  margin-bottom:22px;
}
.kicker::before{
  content:"";
  width:9px; height:9px; flex:0 0 auto;
  background:var(--red);
  clip-path:polygon(50% 0, 100% 38%, 81% 100%, 19% 100%, 0 38%);
}
.section--light .kicker{ color:var(--red-deep); }
.section--light .kicker::before{ background:var(--red); }

.section-head{ margin-bottom:clamp(40px, 5vw, 68px); max-width:820px; }
.section-head .h-xl{ margin-bottom:24px; }
.section-head--tight{ margin-bottom:34px; }
.section-head--center{ margin-inline:auto; text-align:center; max-width:720px; }
.section-head--center .lead{ margin-inline:auto; }

.img-frame{
  position:relative; overflow:hidden;
  background:var(--ink-3);
  border:1px solid var(--ink-line);
}
.section--light .img-frame{ border-color:var(--paper-line); }
.img-frame img{
  width:100%; height:100%; object-fit:cover;
  transition:transform 1.1s var(--ease);
}
.img-frame:hover img{ transform:scale(1.05); }
.img-frame--portrait{ aspect-ratio:4/5; }
.img-frame--landscape{ aspect-ratio:16/10; }
.img-frame--wide{ aspect-ratio:21/9; }

.chip{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--font-mono);
  font-size:.66rem; letter-spacing:.18em; text-transform:uppercase;
  border:1px solid var(--ink-line-2);
  color:var(--t-on-dark);
  padding:8px 14px;
}
.section--light .chip{ border-color:var(--paper-line); color:var(--t-on-light); }
.chip--red{ border-color:var(--red-line); color:var(--red-bright); background:var(--red-soft); }

/* grain overlay for cinematic blocks */
.grain{ position:relative; }
.grain::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  opacity:.05; mix-blend-mode:overlay;
  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='160' height='160' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
}

/* ---------- 05 · BUTTONS ---------- */
.btn{
  position:relative;
  display:inline-flex; align-items:center; justify-content:center; gap:12px;
  padding:18px 32px;
  font-family:var(--font-display);
  font-weight:700; font-stretch:110%;
  font-size:.8rem; letter-spacing:.14em; text-transform:uppercase;
  border:1px solid transparent;
  transition:background .28s var(--ease), color .28s var(--ease), border-color .28s var(--ease), transform .28s var(--ease);
  white-space:nowrap;
}
.btn:active{ transform:translateY(1px); }
.btn__arrow{ transition:transform .3s var(--ease); }
.btn:hover .btn__arrow{ transform:translateX(5px); }

.btn--primary{ background:var(--red); color:#fff; }
.btn--primary:hover{ background:var(--red-bright); }
.btn--ghost{ border-color:rgba(255,255,255,.3); color:#fff; background:transparent; }
.btn--ghost:hover{ border-color:rgba(255,255,255,.75); background:rgba(255,255,255,.06); }
.btn--ink{ background:var(--ink); color:#fff; }
.btn--ink:hover{ background:#222B36; }
.btn--ghost-light{ border-color:rgba(255,255,255,.55); color:#fff; }
.btn--ghost-light:hover{ background:rgba(255,255,255,.12); }
.btn--light{ background:var(--ink); color:#fff; }
.btn--light:hover{ background:#222B36; }

.btn--sm{ padding:12px 22px; font-size:.7rem; }
.btn--lg{ padding:22px 40px; font-size:.86rem; }
.btn-block{ width:100%; }

.cta-row{ display:flex; flex-wrap:wrap; gap:16px; }

/* ---------- 06 · NAVIGATION ---------- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:200;
  border-bottom:1px solid transparent;
  transition:background .35s var(--ease), border-color .35s var(--ease);
}
.nav--scrolled{
  background:rgba(9,12,16,.85);
  -webkit-backdrop-filter:blur(14px) saturate(1.3);
  backdrop-filter:blur(14px) saturate(1.3);
  border-bottom-color:var(--ink-line);
}
.nav__inner{
  display:flex; align-items:center; justify-content:space-between; gap:28px;
  height:var(--nav-h);
}
.brand{ display:inline-flex; align-items:center; gap:12px; color:#fff; }
.brand__mark{ width:34px; height:32px; object-fit:contain; }
.brand__word{
  font-family:var(--font-display);
  font-weight:800; font-stretch:112%;
  font-size:1.06rem; letter-spacing:.05em;
  line-height:1; text-transform:uppercase;
}
.brand__word small{
  display:block; margin-top:4px;
  font-family:var(--font-mono);
  font-weight:400; font-size:.5rem;
  letter-spacing:.34em; text-transform:uppercase;
  color:var(--dim-on-dark);
}
.nav__menu{ display:flex; align-items:center; gap:clamp(20px, 2.6vw, 36px); }
.nav__link{
  position:relative;
  font-family:var(--font-display);
  font-weight:650; font-stretch:106%;
  font-size:.74rem; letter-spacing:.16em; text-transform:uppercase;
  color:rgba(255,255,255,.68);
  padding:8px 0;
  transition:color .25s;
}
.nav__link::after{
  content:""; position:absolute; left:0; right:0; bottom:2px; height:2px;
  background:var(--red);
  transform:scaleX(0); transform-origin:left;
  transition:transform .3s var(--ease);
}
.nav__link:hover{ color:#fff; }
.nav__link:hover::after{ transform:scaleX(1); }
.nav__link[aria-current="page"]{ color:#fff; }
.nav__link[aria-current="page"]::after{ transform:scaleX(1); }
.nav__actions{ display:flex; align-items:center; gap:14px; }

.nav__burger{
  display:none;
  width:44px; height:44px;
  position:relative; z-index:210;
  flex-direction:column; align-items:center; justify-content:center; gap:7px;
}
.nav__burger-line{
  display:block; width:24px; height:2px; background:#fff;
  transition:transform .3s var(--ease), opacity .25s;
}
body.menu-open .nav__burger-line:nth-child(1){ transform:translateY(4.5px) rotate(45deg); }
body.menu-open .nav__burger-line:nth-child(2){ transform:translateY(-4.5px) rotate(-45deg); }

/* mobile menu */
.m-menu{
  position:fixed; inset:0; z-index:190;
  background:rgba(8,11,15,.98);
  display:flex; flex-direction:column;
  padding:calc(var(--nav-h) + 28px) var(--gutter) 36px;
  opacity:0; pointer-events:none;
  transition:opacity .35s var(--ease);
}
body.menu-open .m-menu{ opacity:1; pointer-events:auto; }
body.menu-open{ overflow:hidden; }
.m-menu nav{ display:flex; flex-direction:column; }
.m-menu__link{
  font-family:var(--font-display);
  font-weight:800; font-stretch:114%;
  font-size:clamp(2rem, 8.4vw, 3rem);
  text-transform:uppercase; line-height:1.15;
  padding:14px 0;
  border-bottom:1px solid var(--ink-line);
  color:rgba(255,255,255,.85);
  opacity:0; transform:translateY(16px);
  transition:opacity .45s var(--ease) var(--md,0ms), transform .45s var(--ease) var(--md,0ms), color .25s, padding-left .25s;
}
body.menu-open .m-menu__link{ opacity:1; transform:none; }
.m-menu__link:hover{ color:var(--red-bright); padding-left:10px; }
.m-menu__link--cta{ color:var(--red-bright); }
.m-menu__foot{
  margin-top:auto;
  font-family:var(--font-mono);
  font-size:.78rem; letter-spacing:.1em;
  color:var(--dim-on-dark); line-height:2;
}
.m-menu__foot a:hover{ color:#fff; }

/* ---------- 07 · HERO (HOME) ---------- */
.hero{
  position:relative;
  min-height:100svh;
  min-height:660px;
  display:flex; align-items:flex-end;
  background:var(--ink);
  color:#fff;
  overflow:hidden;
}
.hero__bg, .hero__scrim{ position:absolute; inset:0; }
.hero__bg img{
  width:100%; height:100%; object-fit:cover;
  object-position:62% center;
  transform:scale(1.07);
}
.hero__scrim{
  background:
    linear-gradient(90deg, rgba(8,11,15,.94) 0%, rgba(8,11,15,.62) 40%, rgba(8,11,15,.18) 68%, rgba(8,11,15,.5) 100%),
    linear-gradient(0deg, rgba(8,11,15,.96) 4%, rgba(8,11,15,.25) 34%, rgba(8,11,15,.08) 55%, rgba(8,11,15,.35) 100%),
    linear-gradient(180deg, rgba(8,11,15,.75), rgba(8,11,15,.1) 26%);
}
.hero__inner{
  position:relative; z-index:3;
  width:100%;
  padding-top:calc(var(--nav-h) + 40px);
  padding-bottom:clamp(56px, 8vh, 96px);
}
.hero__kicker{ color:var(--red-bright); }
.hero h1{
  font-family:var(--font-display);
  font-weight:850; font-stretch:120%;
  font-size:clamp(3.1rem, 9.2vw, 8.2rem);
  line-height:.92; text-transform:uppercase;
  letter-spacing:-.01em;
  max-width:11ch;
  margin-bottom:26px;
}
.hero h1 .stroke{
  color:transparent;
  -webkit-text-stroke:1.5px rgba(255,255,255,.85);
}
.hero__lead{
  max-width:560px;
  font-size:clamp(1.02rem, 1.35vw, 1.18rem);
  color:rgba(233,237,239,.82);
  margin-bottom:38px;
}
.hero__meta{
  margin-top:clamp(48px, 7vh, 84px);
  display:grid; grid-template-columns:repeat(3, 1fr);
  border-top:1px solid var(--ink-line-2);
}
.hero__meta-item{
  padding:22px 26px 0 0;
}
.hero__meta-item + .hero__meta-item{ padding-left:26px; border-left:1px solid var(--ink-line); }
.hero__meta-num{
  font-family:var(--font-display);
  font-weight:800; font-stretch:112%;
  font-size:clamp(1.7rem, 3vw, 2.5rem);
  line-height:1;
}
.hero__meta-num b{ color:var(--red-bright); font-weight:800; }
.hero__meta-label{
  margin-top:8px;
  font-family:var(--font-mono);
  font-size:.62rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--dim-on-dark);
}
.hero__lines{
  position:absolute; right:var(--gutter); bottom:clamp(56px,8vh,96px);
  z-index:2; display:flex; flex-direction:column; align-items:flex-end; gap:9px;
  opacity:.5;
}
.hero__lines span{ display:block; height:1px; background:rgba(255,255,255,.4); }
.hero__lines span:nth-child(1){ width:150px; }
.hero__lines span:nth-child(2){ width:100px; }
.hero__lines span:nth-child(3){ width:60px; }
.hero__lines span::after{
  content:""; position:absolute; right:0; top:-3.5px;
  width:8px; height:8px; background:var(--red);
  clip-path:polygon(50% 0, 100% 38%, 81% 100%, 19% 100%, 0 38%);
  animation:pulse-dot 2.6s var(--ease) infinite;
}
.hero__lines span:nth-child(2)::after{ animation-delay:.5s; }
.hero__lines span:nth-child(3)::after{ animation-delay:1s; }
.hero__lines span{ position:relative; }
@keyframes pulse-dot{ 0%,100%{ opacity:.35; } 50%{ opacity:1; } }

/* ---------- 08 · PAGE HERO (INNER) ---------- */
.page-hero{
  position:relative;
  min-height:min(62svh, 620px);
  display:flex; align-items:flex-end;
  background:var(--ink);
  color:#fff;
  overflow:hidden;
}
.page-hero__bg img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:center 30%;
  transform:scale(1.05);
}
.page-hero__scrim{
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(8,11,15,.9) 0%, rgba(8,11,15,.55) 55%, rgba(8,11,15,.3) 100%),
    linear-gradient(0deg, rgba(8,11,15,.98) 8%, rgba(8,11,15,.35) 45%, rgba(8,11,15,.3) 100%);
}
.page-hero__inner{
  position:relative; z-index:2;
  padding-top:calc(var(--nav-h) + 60px);
  padding-bottom:clamp(44px, 7vh, 76px);
  width:100%;
}
.page-hero h1{
  font-family:var(--font-display);
  font-weight:850; font-stretch:120%;
  font-size:clamp(2.7rem, 7.4vw, 6.2rem);
  line-height:.94; text-transform:uppercase;
  max-width:16ch;
  margin-bottom:20px;
}
.page-hero .lead{ max-width:60ch; }
.page-hero__crumb{
  font-family:var(--font-mono);
  font-size:.62rem; letter-spacing:.24em; text-transform:uppercase;
  color:var(--dim-on-dark);
  margin-bottom:26px;
  display:block;
}

/* ---------- 09 · MARQUEE ---------- */
.marquee{
  overflow:hidden;
  background:var(--ink-2);
  border-block:1px solid var(--ink-line);
  padding-block:18px;
}
.marquee__track{
  display:flex; align-items:center;
  width:max-content;
  animation:marquee 34s linear infinite;
}
.marquee:hover .marquee__track{ animation-play-state:paused; }
.marquee__item{
  display:flex; align-items:center; gap:44px;
  padding-right:44px;
  font-family:var(--font-display);
  font-weight:700; font-stretch:116%;
  font-size:1.05rem; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(255,255,255,.75);
  white-space:nowrap;
}
.marquee__dot{
  width:9px; height:9px; flex:0 0 auto;
  background:var(--red);
  clip-path:polygon(50% 0, 100% 38%, 81% 100%, 19% 100%, 0 38%);
}
@keyframes marquee{ to{ transform:translateX(-50%); } }

/* ---------- 10 · FEATURE CARDS ---------- */
.feature-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:14px;
}
.feature-card{
  position:relative;
  background:var(--ink-2);
  border:1px solid var(--ink-line);
  padding:34px 30px 38px;
  transition:border-color .3s var(--ease), transform .35s var(--ease), background .3s;
}
.feature-card:hover{
  border-color:var(--red-line);
  transform:translateY(-5px);
  background:var(--ink-3);
}
.feature-card__icon{
  width:48px; height:48px;
  display:grid; place-items:center;
  background:var(--red-soft);
  border:1px solid var(--red-line);
  color:var(--red-bright);
  margin-bottom:24px;
  transition:background .3s, color .3s;
}
.feature-card:hover .feature-card__icon{ background:var(--red); color:#fff; }
.feature-card__icon svg{ width:24px; height:24px; }
.feature-card h3{
  font-family:var(--font-display);
  font-weight:750; font-stretch:108%;
  font-size:1.02rem; letter-spacing:.05em; text-transform:uppercase;
  margin-bottom:12px;
}
.feature-card p{ font-size:.95rem; color:var(--dim-on-dark); }
.feature-card__num{
  position:absolute; top:26px; right:26px;
  font-family:var(--font-mono); font-size:.62rem; letter-spacing:.2em;
  color:rgba(255,255,255,.28);
}
/* light variant */
.section--light .feature-card{
  background:#fff;
  border-color:var(--paper-line);
}
.section--light .feature-card:hover{ background:#fff; transform:translateY(-5px); border-color:var(--red-line); }
.section--light .feature-card p{ color:var(--dim-on-light); }
.section--light .feature-card__icon{ color:var(--red-deep); }
.section--light .feature-card:hover .feature-card__icon{ color:#fff; }
.section--light .feature-card__num{ color:rgba(11,15,20,.22); }

/* ---------- 11 · AUDIENCE + PATHWAY ---------- */
.audience-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:14px;
  margin-bottom:clamp(48px, 6vw, 72px);
}
.audience-card{
  position:relative;
  border:1px solid var(--ink-line);
  background:var(--ink-2);
  padding:clamp(30px, 3.4vw, 46px);
  overflow:hidden;
  transition:border-color .3s;
}
.audience-card:hover{ border-color:var(--red-line); }
.audience-card__tag{
  font-family:var(--font-mono); font-size:.62rem; letter-spacing:.24em;
  text-transform:uppercase; color:var(--red-bright);
  display:block; margin-bottom:18px;
}
.audience-card h3{
  font-family:var(--font-display);
  font-weight:800; font-stretch:112%;
  font-size:clamp(1.5rem, 2.4vw, 2rem);
  text-transform:uppercase; line-height:1.05;
  margin-bottom:16px;
}
.audience-card p{ color:var(--dim-on-dark); font-size:.98rem; max-width:44ch; }
.audience-card__ghost{
  position:absolute; right:-10px; bottom:-30px;
  font-family:var(--font-display);
  font-weight:850; font-stretch:120%;
  font-size:7rem; line-height:1;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.07);
  pointer-events:none; user-select:none;
}

.pathway{
  border:1px solid var(--ink-line);
  background:var(--ink-2);
}
.pathway__head{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:18px 26px;
  border-bottom:1px solid var(--ink-line);
}
.pathway__head span{
  font-family:var(--font-mono); font-size:.64rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--dim-on-dark);
}
.pathway__head b{ color:var(--red-bright); }
.pathway__steps{
  display:grid; grid-template-columns:repeat(4, 1fr);
}
.pathway__step{
  position:relative;
  padding:26px 26px 30px;
  border-right:1px solid var(--ink-line);
}
.pathway__step:last-child{ border-right:0; }
.pathway__step::before{
  content:""; position:absolute; top:0; left:0;
  width:100%; height:2px; background:var(--red);
  transform:scaleX(0); transform-origin:left;
  transition:transform .8s var(--ease);
}
.pathway.in .pathway__step::before{ transform:scaleX(1); }
.pathway__step:nth-child(2)::before{ transition-delay:.15s; }
.pathway__step:nth-child(3)::before{ transition-delay:.3s; }
.pathway__step:nth-child(4)::before{ transition-delay:.45s; }
.pathway__num{
  font-family:var(--font-mono); font-size:.64rem; letter-spacing:.2em;
  color:var(--red-bright); display:block; margin-bottom:14px;
}
.pathway__step h4{
  font-family:var(--font-display);
  font-weight:800; font-stretch:112%;
  font-size:1.05rem; text-transform:uppercase;
  margin-bottom:8px;
}
.pathway__step p{ font-size:.85rem; color:var(--dim-on-dark); line-height:1.5; }

/* ---------- 12 · FLAGSHIP + TILES ---------- */
.flagship{
  display:grid; grid-template-columns:1.05fr .95fr;
  border:1px solid var(--ink-line);
  background:var(--ink-2);
}
.flagship__media{ position:relative; min-height:380px; overflow:hidden; }
.flagship__media img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:transform 1.2s var(--ease);
}
.flagship:hover .flagship__media img{ transform:scale(1.05); }
.flagship__media::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, transparent 60%, rgba(16,21,28,.65));
}
.flagship__badge{
  position:absolute; z-index:2; top:22px; left:22px;
  display:inline-flex; align-items:center; gap:8px;
  background:var(--red); color:#fff;
  font-family:var(--font-mono); font-size:.62rem; letter-spacing:.22em; text-transform:uppercase;
  padding:9px 14px;
}
.flagship__badge::before{
  content:""; width:7px; height:7px; background:#fff;
  clip-path:polygon(50% 0, 100% 38%, 81% 100%, 19% 100%, 0 38%);
}
.flagship__body{
  padding:clamp(32px, 4vw, 56px);
  display:flex; flex-direction:column; justify-content:center;
}
.flagship__body h3{
  font-family:var(--font-display);
  font-weight:850; font-stretch:118%;
  font-size:clamp(1.9rem, 3.4vw, 3rem);
  text-transform:uppercase; line-height:.98;
  margin-bottom:18px;
}
.flagship__body > p{ color:var(--dim-on-dark); max-width:52ch; margin-bottom:28px; }
.specs{
  display:grid; grid-template-columns:repeat(4, 1fr);
  border:1px solid var(--ink-line);
  margin-bottom:28px;
}
.spec{
  padding:16px 18px;
  border-right:1px solid var(--ink-line);
}
.spec:last-child{ border-right:0; }
.spec b{
  display:block;
  font-family:var(--font-display);
  font-weight:800; font-stretch:112%;
  font-size:1.02rem; text-transform:uppercase;
  line-height:1.15;
}
.spec b i{ font-style:normal; color:var(--red-bright); }
.spec span{
  display:block; margin-top:6px;
  font-family:var(--font-mono); font-size:.58rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--dim-on-dark);
}
.price-line{
  display:flex; align-items:baseline; gap:14px; flex-wrap:wrap;
  margin-bottom:28px;
}
.price-line__amount{
  font-family:var(--font-display);
  font-weight:850; font-stretch:116%;
  font-size:clamp(2rem, 3vw, 2.7rem);
  line-height:1;
}
.price-line__amount sup{ font-size:.45em; font-weight:700; top:-.9em; }
.price-line__per{
  font-family:var(--font-mono); font-size:.66rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--dim-on-dark);
}

.prog-tiles{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:14px;
  margin-top:14px;
}
.prog-tile{
  display:flex; flex-direction:column;
  border:1px solid var(--ink-line);
  background:var(--ink-2);
  padding:32px 30px 34px;
  transition:border-color .3s, transform .35s var(--ease);
}
.prog-tile:hover{ border-color:var(--red-line); transform:translateY(-5px); }
.prog-tile h3{
  font-family:var(--font-display);
  font-weight:800; font-stretch:112%;
  font-size:1.2rem; text-transform:uppercase;
  margin-bottom:12px;
}
.prog-tile p{ font-size:.94rem; color:var(--dim-on-dark); flex:1; margin-bottom:22px; }
.prog-tile__link{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--font-display);
  font-weight:700; font-stretch:110%;
  font-size:.74rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--red-bright);
}
.prog-tile__link svg{ transition:transform .3s var(--ease); }
.prog-tile:hover .prog-tile__link svg{ transform:translateX(5px); }

/* poster (authentic REC TO PRO flyer) */
.poster-wrap{
  display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(32px, 5vw, 72px);
  align-items:center;
}
.poster{
  position:relative;
  max-width:430px; margin-inline:auto;
  border:1px solid var(--ink-line-2);
  background:var(--ink-2);
  padding:14px;
  transform:rotate(1.2deg);
  transition:transform .5s var(--ease), box-shadow .5s;
}
.poster:hover{ transform:rotate(0deg) translateY(-6px); box-shadow:0 30px 60px -20px rgba(0,0,0,.6); }
.poster img{ width:100%; }
.poster__tag{
  position:absolute; top:-14px; left:24px;
  background:var(--red); color:#fff;
  font-family:var(--font-mono); font-size:.6rem; letter-spacing:.22em; text-transform:uppercase;
  padding:8px 14px;
}

/* includes list */
.includes{ display:grid; grid-template-columns:1fr 1fr; gap:10px 26px; margin-bottom:30px; }
.includes li{
  display:flex; align-items:flex-start; gap:12px;
  font-size:.95rem; color:var(--t-on-dark);
  padding:9px 0;
  border-bottom:1px solid var(--ink-line);
}
.includes li::before{
  content:""; flex:0 0 auto; margin-top:8px;
  width:7px; height:7px; background:var(--red);
  clip-path:polygon(50% 0, 100% 38%, 81% 100%, 19% 100%, 0 38%);
}

/* how enrollment works */
.steps{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:14px;
}
.step-card{
  position:relative;
  border:1px solid var(--paper-line);
  background:#fff;
  padding:34px 30px 38px;
}
.step-card__num{
  font-family:var(--font-display);
  font-weight:850; font-stretch:118%;
  font-size:2.6rem; line-height:1;
  color:transparent;
  -webkit-text-stroke:1.4px var(--red);
  display:block; margin-bottom:20px;
}
.step-card h3{
  font-family:var(--font-display);
  font-weight:800; font-stretch:110%;
  font-size:1.08rem; text-transform:uppercase;
  margin-bottom:10px;
}
.step-card p{ font-size:.94rem; color:var(--dim-on-light); }

/* ---------- 13 · EXPERIENCE COLLAGE ---------- */
.collage{
  display:grid;
  grid-template-columns:repeat(12, 1fr);
  grid-auto-rows:minmax(230px, 34vh);
  gap:14px;
}
.collage__item{
  position:relative; overflow:hidden;
  border:1px solid var(--ink-line);
  min-height:0;
}
.collage__item img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:transform 1.1s var(--ease);
}
.collage__item:hover img{ transform:scale(1.06); }
.collage__item::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(0deg, rgba(8,11,15,.62), transparent 45%);
}
.collage__label{
  position:absolute; z-index:2; left:16px; bottom:16px;
  font-family:var(--font-mono); font-size:.64rem; letter-spacing:.2em; text-transform:uppercase;
  color:#fff;
  background:rgba(8,11,15,.7);
  border:1px solid rgba(255,255,255,.14);
  padding:8px 13px;
  -webkit-backdrop-filter:blur(4px);
  backdrop-filter:blur(4px);
}
.collage__item--a{ grid-column:span 4; }
.collage__item--b{ grid-column:span 5; }
.collage__item--c{ grid-column:span 3; }
.collage__item--quote{
  grid-column:span 4;
  display:flex; flex-direction:column; justify-content:center;
  padding:clamp(24px, 3vw, 40px);
  background:var(--ink-3);
  border:1px solid var(--ink-line);
}
.collage__item--quote p{
  font-family:var(--font-display);
  font-weight:750; font-stretch:110%;
  font-size:clamp(1.15rem, 1.8vw, 1.55rem);
  line-height:1.3; text-transform:uppercase;
}
.collage__item--quote p i{ font-style:normal; color:var(--red-bright); }
.collage__item--quote span{
  margin-top:18px;
  font-family:var(--font-mono); font-size:.6rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--dim-on-dark);
}

/* ---------- 14 · FOUNDER SECTION ---------- */
.founder{
  display:grid; grid-template-columns:5fr 6fr;
  gap:clamp(44px, 6vw, 96px);
  align-items:center;
}
.founder__portrait{ position:relative; }
.founder__portrait .img-frame{ position:relative; z-index:1; }
.founder__portrait::after{
  content:""; position:absolute; z-index:0;
  inset:18px -18px -18px 18px;
  border:1px solid var(--red-line);
}
.founder__name{
  font-family:var(--font-display);
  font-weight:850; font-stretch:118%;
  font-size:clamp(2.4rem, 4.6vw, 4rem);
  text-transform:uppercase; line-height:.95;
  margin-bottom:10px;
}
.founder__role{
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.26em; text-transform:uppercase;
  color:var(--red-bright);
  margin-bottom:26px;
  display:block;
}
.founder__body p{ color:var(--dim-on-dark); margin-bottom:18px; max-width:56ch; }
.founder__body .cta-row{ margin-top:34px; }

/* ---------- 15 · BANDS ---------- */
.band{
  position:relative; overflow:hidden;
  color:#fff;
  padding-block:clamp(96px, 13vw, 170px);
}
.band__bg{ position:absolute; inset:0; }
.band__bg img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; opacity:.42;
}
.band__scrim{
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(8,11,15,.94) 0%, rgba(8,11,15,.7) 55%, rgba(8,11,15,.45) 100%),
    linear-gradient(0deg, rgba(8,11,15,.9), rgba(8,11,15,.4));
}
.band__inner{ position:relative; z-index:3; }
.band .kicker{ margin-bottom:26px; }
.band h2{
  font-family:var(--font-display);
  font-weight:850; font-stretch:118%;
  font-size:clamp(2.5rem, 6.4vw, 5.6rem);
  text-transform:uppercase; line-height:.94;
  max-width:15ch;
  margin-bottom:26px;
}
.band__lead{ max-width:52ch; color:rgba(233,237,239,.8); margin-bottom:40px; }
.band .cta-row{ margin-bottom:44px; }
.band__contact{
  display:flex; flex-wrap:wrap; gap:14px 44px;
  font-family:var(--font-mono); font-size:.82rem; letter-spacing:.12em;
}
.band__contact a{ border-bottom:1px solid rgba(255,255,255,.3); padding-bottom:3px; transition:border-color .25s, color .25s; }
.band__contact a:hover{ color:var(--red-bright); border-color:var(--red-bright); }
.band__contact span{ color:var(--dim-on-dark); }

/* red statement band */
.band--red{
  background:var(--red);
  color:#fff;
  padding-block:clamp(84px, 11vw, 150px);
}
.band--red h2{
  max-width:18ch;
  font-size:clamp(2.3rem, 6.2vw, 5.4rem);
}
.band--red__line{
  margin-top:34px;
  display:flex; flex-wrap:wrap; gap:12px 34px;
  font-family:var(--font-display);
  font-weight:700; font-stretch:112%;
  font-size:clamp(.95rem, 1.5vw, 1.2rem);
  text-transform:uppercase; letter-spacing:.08em;
  color:rgba(255,255,255,.92);
}
.band--red__line span{ display:flex; align-items:center; gap:12px; }
.band--red__line span::before{
  content:""; width:8px; height:8px; background:#fff;
  clip-path:polygon(50% 0, 100% 38%, 81% 100%, 19% 100%, 0 38%);
}
.band--red .kicker{ color:rgba(255,255,255,.95); }
.band--red .kicker::before{ background:#fff; }
.band__bg img{ transform:scale(1.12); }
.band--red .cta-row{ margin-top:46px; }

/* ---------- 16 · FOOTER ---------- */
.footer{ background:#070A0E; color:var(--t-on-dark); }
.footer__top{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1.1fr;
  gap:clamp(32px, 4vw, 64px);
  padding-block:clamp(64px, 7vw, 96px) clamp(48px, 5vw, 72px);
  border-bottom:1px solid var(--ink-line);
}
.brand--footer .brand__word{ font-size:1.2rem; }
.brand--footer img{ width:42px; height:40px; }
.footer__brand p{
  margin:22px 0 28px;
  font-size:.94rem; color:var(--dim-on-dark);
  max-width:34ch;
}
.footer__h{
  font-family:var(--font-mono);
  font-size:.62rem; font-weight:500; letter-spacing:.26em; text-transform:uppercase;
  color:var(--dim-on-dark);
  margin-bottom:22px;
}
.footer__col{ display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
.footer__col a{
  font-size:.94rem; color:rgba(233,237,239,.72);
  transition:color .25s, padding-left .25s;
}
.footer__col a:hover{ color:#fff; padding-left:6px; }
.footer__phone{
  font-family:var(--font-display) !important;
  font-weight:800; font-stretch:112%;
  font-size:1.25rem !important;
  color:#fff !important;
  letter-spacing:.02em;
}
.footer__loc{
  margin-top:10px;
  font-family:var(--font-mono); font-size:.62rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--dim-on-dark);
}
.footer__bottom{ padding-block:26px; }
.footer__bottom-in{
  display:flex; justify-content:space-between; align-items:center; gap:14px 30px; flex-wrap:wrap;
  font-size:.8rem; color:var(--dim-on-dark);
}
.footer__ch{ color:rgba(154,165,177,.7); }

/* ---------- 17 · ABOUT BLOCKS ---------- */
.story-split{
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(44px, 6vw, 90px);
  align-items:center;
}
.story-quote{
  font-family:var(--font-display);
  font-weight:750; font-stretch:110%;
  font-size:clamp(1.5rem, 2.9vw, 2.3rem);
  line-height:1.28; text-transform:uppercase;
  margin-bottom:26px;
}
.story-quote i{ font-style:normal; color:var(--red-deep); }
.section--dark .story-quote i{ color:var(--red-bright); }
.big-statement{
  font-family:var(--font-display);
  font-weight:850; font-stretch:118%;
  font-size:clamp(2.2rem, 5.4vw, 4.6rem);
  text-transform:uppercase; line-height:1;
  max-width:20ch;
}
.pillars{
  display:grid; grid-template-columns:repeat(4, 1fr); gap:14px;
}
.pillar{
  border:1px solid var(--paper-line);
  background:#fff;
  padding:30px 26px 34px;
  transition:border-color .3s, transform .3s var(--ease);
}
.pillar:hover{ border-color:var(--red-line); transform:translateY(-4px); }
.pillar__num{
  font-family:var(--font-mono); font-size:.62rem; letter-spacing:.2em;
  color:var(--red-deep); display:block; margin-bottom:44px;
}
.pillar h3{
  font-family:var(--font-display);
  font-weight:800; font-stretch:110%;
  font-size:1.06rem; text-transform:uppercase;
  margin-bottom:12px; line-height:1.2;
}
.pillar p{ font-size:.92rem; color:var(--dim-on-light); }

.access-grid{
  display:grid; grid-template-columns:repeat(4, 1fr); gap:14px;
  margin-top:44px;
}
.access-item{
  border:1px solid var(--paper-line);
  background:#fff;
  padding:26px 24px 30px;
}
.access-item b{
  display:block;
  font-family:var(--font-display);
  font-weight:800; font-stretch:110%;
  font-size:.98rem; text-transform:uppercase;
  margin-bottom:8px;
}
.access-item span{ font-size:.88rem; color:var(--dim-on-light); }
.access-item b i{
  font-style:normal;
  font-family:var(--font-mono); font-size:.6rem; letter-spacing:.18em;
  color:var(--red-deep); display:block; margin-bottom:10px;
}

.founder-mini{
  display:grid; grid-template-columns:300px 1fr; gap:clamp(32px, 4vw, 64px);
  align-items:center;
  border:1px solid var(--ink-line);
  background:var(--ink-2);
  padding:clamp(28px, 3.4vw, 44px);
}
.founder-mini .img-frame{ aspect-ratio:1; }
.founder-mini__role{
  font-family:var(--font-mono); font-size:.66rem; letter-spacing:.24em; text-transform:uppercase;
  color:var(--red-bright); display:block; margin-bottom:14px;
}
.founder-mini p{ color:var(--dim-on-dark); margin:14px 0 24px; max-width:58ch; }

/* ---------- 18 · PROGRAMS BLOCKS ---------- */
.stream-grid{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:14px;
}
.stream{
  position:relative;
  border:1px solid var(--ink-line);
  background:var(--ink-2);
  padding:clamp(30px, 3.2vw, 44px);
  display:flex; flex-direction:column;
  transition:border-color .3s, transform .35s var(--ease);
}
.stream:hover{ border-color:var(--red-line); transform:translateY(-5px); }
.stream__tag{
  font-family:var(--font-mono); font-size:.6rem; letter-spacing:.24em; text-transform:uppercase;
  color:var(--red-bright); margin-bottom:18px; display:block;
}
.stream h3{
  font-family:var(--font-display);
  font-weight:800; font-stretch:112%;
  font-size:1.4rem; text-transform:uppercase; line-height:1.05;
  margin-bottom:16px;
}
.stream p{ font-size:.95rem; color:var(--dim-on-dark); flex:1; }
.stream__for{
  margin:22px 0;
  padding-top:18px;
  border-top:1px solid var(--ink-line);
  font-size:.86rem; color:var(--dim-on-dark);
}
.stream__for b{
  display:block;
  font-family:var(--font-mono); font-size:.58rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--t-on-dark); margin-bottom:6px;
}
.stream .prog-tile__link{ margin-top:auto; }

.focus-visual{
  border:1px solid var(--ink-line);
  background:#000;
  padding:14px;
}
.focus-visual img{ width:100%; }
.focus-visual figcaption{
  padding:14px 8px 4px;
  font-family:var(--font-mono); font-size:.6rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--dim-on-dark);
  text-align:center;
}
.focus-html{ display:none; }
.focus-cat{
  border:1px solid var(--ink-line);
  background:var(--ink-2);
  padding:22px 24px;
  margin-bottom:12px;
}
.focus-cat h3{
  font-family:var(--font-display);
  font-weight:800; font-stretch:112%;
  font-size:1rem; text-transform:uppercase;
  color:var(--red-bright);
  margin-bottom:12px;
  display:flex; align-items:center; gap:10px;
}
.focus-cat h3::before{
  content:""; width:8px; height:8px; background:var(--red);
  clip-path:polygon(50% 0, 100% 38%, 81% 100%, 19% 100%, 0 38%);
}
.focus-cat ul{ list-style:none; display:flex; flex-wrap:wrap; gap:8px; }
.focus-cat li{
  font-size:.85rem; color:var(--t-on-dark);
  border:1px solid var(--ink-line);
  padding:7px 13px;
}

/* ---------- 19 · DEVELOPMENT BLOCKS ---------- */
.dims{ border-top:1px solid var(--ink-line); }
.dim{
  display:grid; grid-template-columns:110px 1fr 1.2fr;
  gap:clamp(20px, 4vw, 56px);
  align-items:start;
  padding:clamp(28px, 3.6vw, 44px) 10px;
  border-bottom:1px solid var(--ink-line);
  transition:background .3s;
}
.dim:hover{ background:var(--ink-2); }
.dim__num{
  font-family:var(--font-display);
  font-weight:850; font-stretch:120%;
  font-size:clamp(1.8rem, 3vw, 2.6rem);
  line-height:1;
  color:transparent;
  -webkit-text-stroke:1.3px rgba(255,255,255,.4);
  transition:-webkit-text-stroke-color .3s;
}
.dim:hover .dim__num{ -webkit-text-stroke-color:var(--red-bright); }
.dim__title{
  font-family:var(--font-display);
  font-weight:800; font-stretch:112%;
  font-size:clamp(1.15rem, 2vw, 1.55rem);
  text-transform:uppercase; line-height:1.1;
}
.dim p{ font-size:.96rem; color:var(--dim-on-dark); }

.image-pair{
  display:grid; grid-template-columns:1fr 1fr; gap:14px;
  margin-top:14px;
}
.image-pair__cap{
  padding:16px 4px 0;
  font-family:var(--font-mono); font-size:.62rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--dim-on-dark);
  display:flex; gap:10px; align-items:center;
}
.image-pair__cap::before{
  content:""; width:8px; height:8px; background:var(--red);
  clip-path:polygon(50% 0, 100% 38%, 81% 100%, 19% 100%, 0 38%);
}

.mentoring{
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(44px, 6vw, 90px);
  align-items:center;
}

/* ---------- 20 · COACHING BLOCKS ---------- */
.coach-profile{
  display:grid; grid-template-columns:5fr 6fr;
  gap:clamp(44px, 6vw, 96px);
  align-items:center;
}
.coach-profile .img-frame{ aspect-ratio:4/5; }
.coach-profile__name{
  font-family:var(--font-display);
  font-weight:850; font-stretch:118%;
  font-size:clamp(2.6rem, 5vw, 4.4rem);
  text-transform:uppercase; line-height:.95;
  margin-bottom:12px;
}
.coach-profile__role{
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.26em; text-transform:uppercase;
  color:var(--red-bright);
  display:block; margin-bottom:28px;
}
.coach-profile__bio p{ color:var(--dim-on-dark); margin-bottom:18px; max-width:58ch; }

.stats{
  display:grid; grid-template-columns:repeat(3, 1fr);
  border:1px solid var(--ink-line);
  background:var(--ink-2);
}
.stat{
  padding:clamp(28px, 3.4vw, 44px) clamp(24px, 3vw, 40px);
  border-right:1px solid var(--ink-line);
}
.stat:last-child{ border-right:0; }
.stat__num{
  font-family:var(--font-display);
  font-weight:850; font-stretch:118%;
  font-size:clamp(2.6rem, 4.6vw, 4rem);
  line-height:1;
}
.stat__num i{ font-style:normal; color:var(--red-bright); }
.stat__label{
  margin-top:12px;
  font-family:var(--font-mono); font-size:.62rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--dim-on-dark);
}

.cred-visual{
  border:1px solid var(--ink-line);
  background:#000;
  padding:14px;
  margin-bottom:14px;
}
.cred-visual img{ width:100%; }
.cred-list{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:14px;
}
.cred-item{
  border:1px solid var(--ink-line);
  background:var(--ink-2);
  padding:22px 24px;
}
.cred-item b{
  display:block;
  color:#fff;
  font-family:var(--font-display);
  font-weight:800; font-stretch:110%;
  font-size:.95rem; text-transform:uppercase;
  margin-bottom:8px; line-height:1.25;
}
.cred-item span{
  font-family:var(--font-mono); font-size:.6rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--red-bright);
}
.cred-clubs{
  margin-top:14px;
  display:grid; grid-template-columns:1fr 1fr; gap:14px;
}
.cred-club{
  display:flex; gap:18px; align-items:center;
  border:1px solid var(--ink-line);
  background:var(--ink-2);
  padding:20px 24px;
}
.cred-club b{
  display:block;
  color:#fff;
  font-family:var(--font-display);
  font-weight:800; font-stretch:112%;
  font-size:1rem; text-transform:uppercase;
}
.cred-club span{
  font-family:var(--font-mono); font-size:.58rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--dim-on-dark);
}

.philosophy-grid{
  display:grid; grid-template-columns:repeat(2, 1fr); gap:14px;
}
.philosophy{
  border:1px solid var(--paper-line);
  background:#fff;
  padding:30px 28px 34px;
}
.philosophy b{
  display:flex; align-items:center; gap:12px;
  font-family:var(--font-display);
  font-weight:800; font-stretch:112%;
  font-size:1.05rem; text-transform:uppercase;
  margin-bottom:10px;
}
.philosophy b::before{
  content:""; width:8px; height:8px; background:var(--red);
  clip-path:polygon(50% 0, 100% 38%, 81% 100%, 19% 100%, 0 38%);
}
.philosophy p{ font-size:.93rem; color:var(--dim-on-light); }

/* ---------- 21 · CONTACT + FORM ---------- */
.contact-grid{
  display:grid; grid-template-columns:5fr 6fr;
  gap:clamp(40px, 5.5vw, 84px);
  align-items:start;
}
.info-stack{ display:flex; flex-direction:column; gap:30px; }
.info-item__label{
  font-family:var(--font-mono); font-size:.62rem; letter-spacing:.24em; text-transform:uppercase;
  color:var(--dim-on-light);
  display:block; margin-bottom:10px;
}
.info-item__big{
  font-family:var(--font-display);
  font-weight:850; font-stretch:116%;
  font-size:clamp(1.7rem, 3.4vw, 2.7rem);
  line-height:1.05;
  color:var(--t-on-light);
  transition:color .25s;
  word-break:break-word;
}
a.info-item__big:hover{ color:var(--red-deep); }
.info-item__mid{
  font-size:1.05rem; font-weight:500; color:var(--t-on-light);
  border-bottom:1px solid var(--paper-line); padding-bottom:4px;
  transition:color .25s, border-color .25s;
  word-break:break-word;
}
a.info-item__mid:hover{ color:var(--red-deep); border-color:var(--red-deep); }
.info-notes{ list-style:none; display:flex; flex-direction:column; gap:0; }
.info-notes li{
  display:flex; gap:12px; align-items:flex-start;
  padding:13px 0;
  border-bottom:1px solid var(--paper-line);
  font-size:.94rem; color:var(--dim-on-light);
}
.info-notes li::before{
  content:""; flex:0 0 auto; margin-top:9px;
  width:7px; height:7px; background:var(--red);
  clip-path:polygon(50% 0, 100% 38%, 81% 100%, 19% 100%, 0 38%);
}
.info-notes li b{ color:var(--t-on-light); font-weight:600; }

.form-card{
  background:#fff;
  border:1px solid var(--paper-line);
  padding:clamp(28px, 3.6vw, 50px);
}
.form-card__head{ margin-bottom:30px; }
.form-card__head h2{
  font-family:var(--font-display);
  font-weight:800; font-stretch:112%;
  font-size:1.5rem; text-transform:uppercase;
  margin-bottom:8px;
}
.form-card__head p{ font-size:.94rem; color:var(--dim-on-light); }
.field{ margin-bottom:20px; }
.field__row{
  display:grid; grid-template-columns:1fr 1fr; gap:18px;
}
.field label{
  display:block;
  font-family:var(--font-mono);
  font-size:.62rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--dim-on-light);
  margin-bottom:9px;
}
.field label i{ font-style:normal; color:var(--red-deep); }
.input, .select, .textarea{
  width:100%;
  padding:14px 16px;
  border:1px solid rgba(11,15,20,.2);
  background:#fff;
  border-radius:2px;
  font-family:var(--font-body);
  font-size:.96rem; font-weight:450;
  color:var(--t-on-light);
  transition:border-color .2s, box-shadow .2s;
  appearance:none;
}
.select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2312171D' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 16px center;
  padding-right:40px;
}
.textarea{ min-height:120px; resize:vertical; }
.input:focus, .select:focus, .textarea:focus{
  outline:none;
  border-color:var(--red);
  box-shadow:0 0 0 3px rgba(227,55,44,.14);
}
.field--hp{
  position:absolute !important;
  left:-9999px !important;
  width:1px; height:1px; overflow:hidden;
}
.form__status{
  display:none;
  margin-top:22px;
  padding:16px 18px;
  border:1px solid var(--red-line);
  background:var(--red-soft);
  font-size:.92rem;
  color:var(--t-on-light);
}
.form__status.show{ display:block; }
.form__status a{ color:var(--red-deep); font-weight:600; }
.form__fine{
  margin-top:18px;
  font-size:.8rem; color:var(--dim-on-light);
}

/* ---------- 22 · MERCH ---------- */
.merch-split{
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(44px, 6vw, 90px);
  align-items:center;
}
.merch-img{
  position:relative;
  border:1px solid var(--ink-line);
  background:var(--ink-2);
  padding:20px;
}
.merch-img img{ width:100%; }
.merch-img::after{
  content:""; position:absolute;
  inset:-14px 14px 14px -14px;
  border:1px solid var(--red-line);
  z-index:0;
}
.merch-img{ z-index:1; }
.merch-copy h2{
  font-family:var(--font-display);
  font-weight:850; font-stretch:118%;
  font-size:clamp(2rem, 4.4vw, 3.6rem);
  text-transform:uppercase; line-height:.98;
  margin-bottom:22px;
}
.merch-copy > p{ color:var(--dim-on-dark); margin-bottom:20px; max-width:52ch; }
.charity{
  border:1px solid var(--red-line);
  background:var(--red-soft);
  padding:22px 26px;
  margin:28px 0 34px;
}
.charity b{
  display:flex; align-items:center; gap:10px;
  font-family:var(--font-display);
  font-weight:800; font-stretch:110%;
  font-size:.95rem; text-transform:uppercase;
  color:var(--red-bright);
  margin-bottom:8px;
}
.charity b::before{
  content:""; width:8px; height:8px; background:var(--red);
  clip-path:polygon(50% 0, 100% 38%, 81% 100%, 19% 100%, 0 38%);
}
.charity p{ font-size:.92rem; color:var(--t-on-dark); }

/* ---------- 23 · REVEAL / MOTION ---------- */
html.js [data-reveal]{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .85s var(--ease), transform .85s var(--ease);
  transition-delay:var(--d, 0ms);
}
html.js [data-reveal].in{
  opacity:1;
  transform:none;
}
html.js [data-reveal="left"]{ transform:translateX(-36px); }
html.js [data-reveal="right"]{ transform:translateX(36px); }
html.js [data-reveal="left"].in,
html.js [data-reveal="right"].in{ transform:none; }

/* stagger helper */
html.js [data-stagger] > *{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .8s var(--ease), transform .8s var(--ease);
  transition-delay:var(--d, 0ms);
}
html.js [data-stagger].in > *{ opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce){
  html.js [data-reveal],
  html.js [data-stagger] > *{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }
  .marquee__track{ animation:none; flex-wrap:wrap; }
  .hero__bg img, .page-hero__bg img, .band__bg img{ transform:none; }
  .img-frame img, .collage__item img, .flagship__media img{ transition:none; }
  .img-frame:hover img, .collage__item:hover img, .flagship:hover .flagship__media img{ transform:none; }
  .hero__lines span::after{ animation:none; }
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; }
}

/* ---------- 24 · RESPONSIVE ---------- */
@media (max-width: 1080px){
  .feature-grid{ grid-template-columns:repeat(2, 1fr); }
  .pillars, .access-grid{ grid-template-columns:repeat(2, 1fr); }
  .collage{ grid-auto-rows:minmax(220px, 30vh); }
  .collage__item--a, .collage__item--b, .collage__item--c{ grid-column:span 6; }
  .collage__item--quote{ grid-column:span 12; }
  .cred-list{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width: 940px){
  .nav__menu{ display:none; }
  .nav__actions .btn{ display:none; }
  .nav__burger{ display:flex; }
  .flagship{ grid-template-columns:1fr; }
  .flagship__media{ min-height:300px; }
  .flagship__media::after{ background:linear-gradient(0deg, transparent 55%, rgba(16,21,28,.7)); }
  .poster-wrap{ grid-template-columns:1fr; }
  .poster{ order:-1; }
  .founder, .coach-profile, .story-split, .mentoring, .contact-grid, .merch-split{ grid-template-columns:1fr; }
  .founder__portrait, .coach-profile .img-frame{ max-width:560px; margin-inline:auto; width:100%; }
  .founder-mini{ grid-template-columns:1fr; }
  .founder-mini .img-frame{ max-width:300px; }
  .steps, .prog-tiles, .stream-grid{ grid-template-columns:1fr; }
  .hero__meta{ grid-template-columns:1fr 1fr 1fr; }
  .hero__meta-item{ padding-right:14px; }
  .hero__meta-item + .hero__meta-item{ padding-left:14px; }
  .stats{ grid-template-columns:1fr; }
  .stat{ border-right:0; border-bottom:1px solid var(--ink-line); }
  .stat:last-child{ border-bottom:0; }
  .footer__top{ grid-template-columns:1fr 1fr; }
  .footer__brand{ grid-column:span 2; }
  .dim{ grid-template-columns:70px 1fr; }
  .dim p{ grid-column:2; }
  .dim__num{ font-size:1.5rem; }
  .philosophy-grid{ grid-template-columns:1fr; }
  .cred-clubs{ grid-template-columns:1fr; }
  .hero__lines{ display:none; }
}
@media (max-width: 720px){
  :root{ --sec-pad:clamp(60px, 12vw, 90px); }
  .audience-grid{ grid-template-columns:1fr; }
  .feature-grid{ grid-template-columns:1fr; }
  .pathway__steps{ grid-template-columns:1fr; }
  .pathway__step{ border-right:0; border-bottom:1px solid var(--ink-line); padding-left:24px; }
  .pathway__step:last-child{ border-bottom:0; }
  .pathway__step::before{
    width:2px; height:100%;
    top:0; left:0;
    transform:scaleY(0); transform-origin:top;
  }
  .pathway.in .pathway__step::before{ transform:scaleY(1); }
  .specs{ grid-template-columns:1fr 1fr; }
  .spec{ border-bottom:1px solid var(--ink-line); }
  .spec:nth-child(2n){ border-right:0; }
  .spec:nth-child(n+3){ border-bottom:0; }
  .collage{ grid-auto-rows:240px; }
  .collage__item--a, .collage__item--b, .collage__item--c{ grid-column:span 12; }
  .includes{ grid-template-columns:1fr; }
  .field__row{ grid-template-columns:1fr; }
  .image-pair{ grid-template-columns:1fr; }
  .footer__top{ grid-template-columns:1fr; }
  .footer__brand{ grid-column:span 1; }
  .footer__bottom-in{ flex-direction:column; align-items:flex-start; }
  .hero h1{ font-size:clamp(2.7rem, 12.5vw, 4rem); }
  .hero__meta{ grid-template-columns:1fr; border-top:0; }
  .hero__meta-item{ padding:14px 0; border-top:1px solid var(--ink-line) !important; border-left:0 !important; }
  .hero__meta-item + .hero__meta-item{ padding-left:0; }
  .hero__meta-item:first-child{ border-top:1px solid var(--ink-line) !important; }
  .focus-visual{ display:none; }
  .focus-html{ display:block; }
  .cred-visual{ display:none; }
  .band__contact{ flex-direction:column; gap:14px; }
  .page-hero h1{ font-size:clamp(2.3rem, 9.5vw, 3.6rem); }
}
@media (max-width: 460px){
  .cta-row .btn{ width:100%; }
  .btn{ padding:17px 24px; }
  .brand__word{ font-size:.98rem; }
}