/* ST8 shared page components - layered on base.css (journey + discipline pages). */
/* Closing band */
#closing{background:linear-gradient(150deg,var(--indigo) 0%,#241f52 60%,var(--black) 130%);z-index:3;text-align:center;--section-bg:linear-gradient(150deg,var(--indigo) 0%,#241f52 60%,var(--black) 130%)}
#closing .wrapc{position:relative;z-index:2;padding:20px 0}
#closing .cline{color:var(--iv60);font-size:16px;max-width:560px;margin:0 auto 10px}
#closing .cbig{font-family:var(--display);font-weight:900;font-style:italic;text-transform:uppercase;
  font-size:clamp(40px,6vw,88px);line-height:.92;transform:skewX(var(--slant));margin:8px auto 30px}
#closing .cbig em{font-style:normal;color:var(--lime)}

/* first-move video by the form */
.book-loop{margin-top:30px}
.book-loop .video-slot-tag{display:none}

/* footer — content pack v8 contact */
.foot-contact li{display:flex;gap:8px;align-items:flex-start;margin-bottom:2px}
.foot-legal{font-size:11px;color:var(--iv35);line-height:1.7;margin-top:14px}
.foot-legal b{color:var(--iv60);font-weight:400}
.tofill{border-bottom:1px dashed rgba(248,249,218,.28);color:var(--iv35);font-style:italic}

/* ═══════════════ INNER PAGE — ABOUT & MEMBERSHIPS ═══════════════ */
.page-hero{position:relative;padding:150px 0 60px;overflow:hidden;z-index:3}
.page-hero .wrapc{position:relative;z-index:2}
.page-hero .eyebrow{margin-bottom:20px}
.page-hero h1{font-family:var(--display);font-weight:900;text-transform:uppercase;
  font-size:clamp(56px,9vw,140px);line-height:.84;letter-spacing:-.01em;transform:skewX(var(--slant));transform-origin:left bottom}
.page-hero h1 em{font-style:normal;color:var(--lime)}
.page-hero .page-sub{color:var(--iv60);font-size:16px;max-width:560px;margin-top:26px;line-height:1.7}
.page-hero::before{content:'';position:absolute;z-index:1;top:-20%;right:-8%;width:60%;height:80%;
  background:radial-gradient(ellipse,rgba(61,52,139,.5),transparent 70%);pointer-events:none}
.page-hero .breadcrumb{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--iv35);margin-bottom:22px}
.page-hero .breadcrumb a{color:var(--lime)}

.prose-section{padding:70px 0;z-index:3;position:relative}
.prose-section.alt{background:var(--black3)}
.prose-grid{display:grid;grid-template-columns:.7fr 1fr;gap:56px;align-items:start}
.prose-grid .h2{margin-top:14px}
.prose-body p{color:var(--iv60);font-size:15px;line-height:1.8;max-width:640px}
.prose-body p + p{margin-top:18px}
.prose-body b{color:var(--ivory);font-weight:400}
@media(max-width:860px){.prose-grid{grid-template-columns:1fr;gap:24px}}

/* What ST8 means */
.mean-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:44px}
.mean{border:1px solid var(--iv08);background:var(--black2);padding:36px 32px}
.mean .big{font-family:var(--display);font-weight:900;font-style:italic;font-size:80px;line-height:.9;color:var(--lime);transform:skewX(var(--slant))}
.mean h3{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:22px;margin:14px 0 12px}
.mean p{color:var(--iv60);font-size:14px;line-height:1.7}
@media(max-width:700px){.mean-grid{grid-template-columns:1fr}}

/* Pillars */
.pillars{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.pillar{display:flex;align-items:center;gap:12px;padding:14px 20px;border:1px solid var(--iv08);background:var(--black2)}
.pillar b{font-family:var(--mono);font-size:11px;color:var(--lime)}
.pillar span{font-family:var(--display);font-weight:600;text-transform:uppercase;font-size:15px;letter-spacing:.02em;color:var(--ivory)}

/* Founders */
#founders{background:var(--black);z-index:3;position:relative}
.founder{display:grid;grid-template-columns:.8fr 1.2fr;gap:44px;align-items:start;margin-top:56px}
.founder:nth-child(even){grid-template-columns:1.2fr .8fr}
.founder-photo{position:relative;aspect-ratio:4/5;border:1px solid transparent;
  background:linear-gradient(170deg,#1e1d29,#17161f) padding-box,
             linear-gradient(150deg,rgba(199,239,0,.4),rgba(118,120,237,.35) 60%,rgba(248,249,218,.04)) border-box;
  display:flex;align-items:flex-end;overflow:hidden}
.founder-photo img{width:100%;height:100%;object-fit:cover;filter:grayscale(.4) contrast(1.05)}
.founder-photo .ph-tag{position:absolute;top:14px;left:14px;font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--iv35);border:1px dashed var(--iv18);padding:5px 10px;background:rgba(15,14,19,.6)}
.founder-copy .role{font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--lime);margin-bottom:10px}
.founder-copy h3{font-family:var(--display);font-weight:900;font-style:italic;text-transform:uppercase;font-size:clamp(34px,4vw,56px);line-height:.92;transform:skewX(var(--slant));margin-bottom:18px}
.founder-copy p{color:var(--iv60);font-size:14.5px;line-height:1.8;max-width:640px}
.founder-copy p + p{margin-top:16px}
.founder-copy b{color:var(--ivory);font-weight:400}
@media(max-width:820px){.founder,.founder:nth-child(even){grid-template-columns:1fr;gap:24px}}
.vision-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:52px}
.vcard{border-left:3px solid var(--lime);padding:6px 0 6px 24px}
.vcard h4{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--lime);margin-bottom:10px}
.vcard p{color:var(--iv60);font-size:14.5px;line-height:1.7}
@media(max-width:700px){.vision-grid{grid-template-columns:1fr}}

/* Coaches */
.coach-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:44px}
.coach{position:relative;aspect-ratio:3/4;overflow:hidden;border:1px solid var(--iv08);background:var(--black2)}
.coach img{width:100%;height:100%;object-fit:cover;filter:grayscale(.5) contrast(1.05);transition:filter .5s,transform .6s}
.coach:hover img{filter:grayscale(0);transform:scale(1.05)}
.coach .role{position:absolute;left:0;right:0;bottom:0;padding:16px 14px;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ivory);background:linear-gradient(180deg,transparent,rgba(15,14,19,.92))}
.coach .ph-tag{position:absolute;top:10px;left:10px;font-family:var(--mono);font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:var(--iv35);border:1px dashed var(--iv18);padding:4px 7px}
@media(max-width:820px){.coach-grid{grid-template-columns:1fr 1fr}}

/* ═══ PRICING ENGINE ═══ */
#pricing{padding:80px 0;background:var(--black);z-index:3;position:relative;scroll-margin-top:90px}
.price-intro{color:var(--iv60);font-size:15px;width:min(620px,100% - var(--gut)*2);margin:16px auto 0;text-align:center;line-height:1.7}
.ptabs{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:40px auto 8px;width:min(900px,100% - var(--gut)*2)}
.ptab{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--iv60);
  border:1px solid var(--iv18);background:var(--black2);padding:11px 18px;cursor:pointer;transition:.25s}
.ptab:hover{color:var(--ivory);border-color:var(--iv35)}
.ptab.on{background:var(--lime);color:var(--black);border-color:var(--lime);font-weight:500}
.pcat-blurb{text-align:left;color:var(--iv60);font-size:14px;width:min(66ch,100% - var(--gut)*2);margin:24px auto 0;line-height:1.7;min-height:20px}
.pkg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:34px;width:min(1180px,100% - var(--gut)*2);margin-inline:auto}
.pkg{border:1px solid var(--iv08);background:var(--black2);padding:28px 26px 26px;display:flex;flex-direction:column;position:relative;overflow:hidden;transition:border-color .4s,transform .4s}
.pkg:hover{border-color:rgba(199,239,0,.4);transform:translateY(-4px)}
.pkg.feat{border:1px solid transparent;
  background:linear-gradient(170deg,#26243a 0%,#1B1A24 100%) padding-box,
             linear-gradient(140deg,rgba(199,239,0,.7),rgba(118,120,237,.4) 55%,rgba(118,120,237,.06)) border-box}
.pkg .pkg-code{position:absolute;top:16px;right:18px;font-family:var(--mono);font-size:9px;letter-spacing:.14em;color:var(--iv35)}
.pkg h3{font-family:var(--display);font-weight:900;font-style:italic;text-transform:uppercase;font-size:26px;line-height:.98;transform:skewX(var(--slant));margin-bottom:6px;max-width:80%}
.pkg .pkg-blurb{color:var(--iv60);font-size:12.5px;line-height:1.6;margin-bottom:20px;min-height:38px}
.pkg .plans{list-style:none;border-top:1px solid var(--iv08)}
.pkg .plans li{display:flex;justify-content:space-between;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--iv08);font-size:13px}
.pkg .plans .plabel{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--iv35)}
.pkg .plans .pamt{font-family:var(--display);font-weight:700;font-size:18px;color:var(--ivory)}
.pkg .plans li.lead-plan .pamt{color:var(--lime);font-size:26px;font-weight:900;font-style:italic}
.pkg .pnote{font-size:11.5px;color:var(--iv35);line-height:1.55;margin:16px 0 0;font-style:italic}
.pkg .pgate{display:inline-block;margin-top:14px;font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:#F0B429;border:1px solid rgba(240,180,41,.4);padding:6px 10px}
.pkg .btn{margin-top:20px;width:100%;min-height:46px;font-size:13px}
.pkg .price-solo{font-family:var(--display);font-weight:900;font-style:italic;font-size:52px;color:var(--lime);line-height:1;transform:skewX(var(--slant));margin:10px 0 6px}
.pkg .price-solo small{font-size:15px;font-weight:600;color:var(--iv60);font-style:normal}
@media(max-width:900px){.pkg-grid{grid-template-columns:1fr;max-width:520px}}

.includes{width:min(1180px,100% - var(--gut)*2);margin:56px auto 0;border:1px solid var(--iv08);background:var(--black3);padding:40px 38px}
.includes h3{font-family:var(--display);font-weight:800;font-style:italic;text-transform:uppercase;font-size:24px;color:var(--lime);transform:skewX(var(--slant));margin-bottom:24px}
.includes ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:16px 40px}
.includes li{padding-left:26px;position:relative;color:var(--iv60);font-size:14px;line-height:1.5}
.includes li::before{content:'';position:absolute;left:0;top:5px;width:12px;height:12px;background:var(--lime);clip-path:polygon(0 55%,38% 100%,100% 0,80% 0,38% 66%,15% 42%)}
@media(max-width:700px){.includes ul{grid-template-columns:1fr}}

/* Week at ST8 */
#week{padding:70px 0;background:var(--black3);z-index:3;position:relative}
.week-body p{color:var(--iv60);font-size:15px;line-height:1.8;max-width:660px}
.week-body p + p{margin-top:16px}
.week-body b{color:var(--ivory);font-weight:400}
.week-cta{margin-top:28px}

/* FAQ accordion */
#faq{padding:70px 0;background:var(--black);z-index:3;position:relative}
.faq-list{width:min(860px,100% - var(--gut)*2);margin:44px auto 0;border-top:1px solid var(--iv08)}
.faq-item{border-bottom:1px solid var(--iv08)}
.faq-q{width:100%;text-align:left;display:flex;justify-content:space-between;align-items:center;gap:20px;
  padding:24px 4px;font-family:var(--display);font-weight:600;text-transform:uppercase;font-size:clamp(17px,2.2vw,22px);letter-spacing:.01em;color:var(--ivory);cursor:pointer;transition:color .25s}
.faq-q:hover{color:var(--lime)}
.faq-q .plus{flex-shrink:0;width:22px;height:22px;position:relative}
.faq-q .plus::before,.faq-q .plus::after{content:'';position:absolute;left:50%;top:50%;background:var(--lime);transition:transform .3s}
.faq-q .plus::before{width:16px;height:2px;transform:translate(-50%,-50%)}
.faq-q .plus::after{width:2px;height:16px;transform:translate(-50%,-50%)}
.faq-item.open .plus::after{transform:translate(-50%,-50%) scaleY(0)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .4s cubic-bezier(.2,.8,.2,1)}
.faq-a p{color:var(--iv60);font-size:14.5px;line-height:1.75;padding:0 4px 26px;max-width:720px}

/* CTA band (inner) */
.cta-band{padding:70px 0;text-align:center;background:linear-gradient(150deg,var(--indigo) 0%,#241f52 60%,var(--black) 130%);z-index:3;position:relative}
.cta-band .h2{margin-bottom:26px}
.cta-band .row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}


/* ═══════════════ THE ST8 JOURNEY — parent guide (warmer) ═══════════════ */
.jhero{background:linear-gradient(165deg,var(--black) 0%,#1a1836 130%);min-height:72svh}
.jhero .page-sub{font-size:17px;color:rgba(248,249,218,.82)}
.jhero .hero-media{z-index:0;
  -webkit-mask-image:linear-gradient(to bottom,#000 48%,rgba(0,0,0,.4) 80%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 48%,rgba(0,0,0,.4) 80%,transparent 100%)}
.jhero .hero-media video,.jhero .hero-media img{filter:grayscale(.2) contrast(1.06) brightness(.64)}
.jhero-scrim{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(160deg,rgba(21,20,27,.82),rgba(21,20,27,.48) 45%,rgba(26,24,54,.8))}
.jbig-lede{width:min(900px,100% - var(--gut)*2);margin:0 auto;padding:64px 0;text-align:center}
.jbig-lede p{font-size:clamp(19px,2.6vw,28px);line-height:1.5;color:var(--ivory);font-weight:300}
.jbig-lede b{color:var(--lime);font-weight:400}

/* Age stages */
#stages{padding:80px 0;background:var(--black3);z-index:3;position:relative}
.stage-card{display:grid;grid-template-columns:220px 1fr;gap:44px;align-items:start;padding:44px 0;border-top:1px solid var(--iv08)}
.stage-card:first-of-type{border-top:none}
.stage-band{position:sticky;top:100px}
.stage-band .age{font-family:var(--display);font-weight:900;font-style:italic;font-size:clamp(40px,5vw,68px);line-height:.9;color:var(--lime);transform:skewX(var(--slant))}
.stage-band .name{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--iv60);margin-top:14px;display:block}
.stage-copy h3{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:clamp(22px,3vw,32px);letter-spacing:.01em;margin-bottom:16px;color:var(--ivory)}
.stage-copy > p{color:var(--iv60);font-size:15.5px;line-height:1.8;max-width:660px}
.notice{margin-top:22px;border-left:3px solid var(--lime);background:rgba(199,239,0,.05);padding:18px 22px;max-width:660px}
.notice b{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--lime);display:block;margin-bottom:8px}
.notice p{color:var(--iv60);font-size:14px;line-height:1.7}
@media(max-width:760px){.stage-card{grid-template-columns:1fr;gap:18px}.stage-band{position:static}}

/* Pathway */
#pathway{padding:80px 0;background:var(--black);z-index:3;position:relative}
.pathway{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:48px;position:relative}
.pnode{text-align:center;padding:26px 16px;border:1px solid var(--iv08);background:var(--black2);position:relative}
.pnode .pn-i{font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--lime)}
.pnode .pn-t{font-family:var(--display);font-weight:900;font-style:italic;text-transform:uppercase;font-size:22px;line-height:.98;margin-top:10px;transform:skewX(var(--slant))}
.pnode .pn-d{font-size:12px;color:var(--iv60);margin-top:8px;line-height:1.5}
.pnode:not(:last-child)::after{content:'→';position:absolute;right:-11px;top:50%;transform:translateY(-50%);z-index:3;color:var(--lime);font-size:18px}
.disc-notes{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:36px}
.dnote{border:1px solid var(--iv08);background:var(--black2);padding:26px 24px}
.dnote h4{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:19px;color:var(--lime);margin-bottom:10px}
.dnote p{color:var(--iv60);font-size:13.5px;line-height:1.7}
.path-close{color:var(--iv60);font-size:15px;line-height:1.8;max-width:720px;margin:36px auto 0;text-align:center}
.path-close b{color:var(--ivory);font-weight:400}
@media(max-width:760px){.pathway{grid-template-columns:1fr 1fr}.pnode:nth-child(2)::after{display:none}.disc-notes{grid-template-columns:1fr}}

/* Benefits */
#benefits{padding:80px 0;background:var(--black3);z-index:3;position:relative}
.benefits{list-style:none;margin-top:44px;max-width:820px;margin-inline:auto}
.benefits li{display:flex;gap:22px;align-items:flex-start;padding:24px 0;border-top:1px solid var(--iv08)}
.benefits li:first-child{border-top:none}
.benefits .bnum{font-family:var(--display);font-weight:900;font-style:italic;font-size:30px;color:var(--lime);transform:skewX(var(--slant));flex-shrink:0;width:44px}
.benefits b{display:block;font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:18px;letter-spacing:.01em;margin-bottom:6px;color:var(--ivory)}
.benefits p{color:var(--iv60);font-size:14.5px;line-height:1.7}

/* Promises */
.promises{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:44px}
.promise{border:1px solid transparent;
  background:linear-gradient(170deg,#1e1d29,#17161f) padding-box,
             linear-gradient(150deg,rgba(199,239,0,.35),rgba(118,120,237,.3) 60%,rgba(248,249,218,.03)) border-box;
  padding:30px 28px}
.promise .pi{font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--lime)}
.promise h4{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:20px;margin:12px 0 10px;color:var(--ivory)}
.promise p{color:var(--iv60);font-size:14px;line-height:1.7}
@media(max-width:700px){.promises{grid-template-columns:1fr}}

/* Sticky book bar (mobile) */
.sticky-book{position:fixed;left:0;right:0;bottom:0;z-index:130;display:none;
  padding:12px 16px;background:rgba(15,14,19,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-top:1px solid var(--iv18)}
.sticky-book a{display:flex;width:100%;min-height:50px;align-items:center;justify-content:center;
  font-family:var(--display);font-weight:800;font-size:15px;letter-spacing:.1em;text-transform:uppercase;
  background:var(--lime);color:var(--black);
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px))}
@media(max-width:820px){.sticky-book{display:block}body{padding-bottom:74px}}


/* ═══ BRAND LOCKUP — icon | ST8 over FITNESS (+ tagline in major places) ═══ */
.nav-logo .wm,.foot-logo .wm{flex-direction:column;align-items:flex-start;gap:1px;line-height:.82}
.nav-logo .wm b{font-size:25px}
.nav-logo .wm i{font-size:7.5px;letter-spacing:.335em;margin-top:1px;color:var(--iv60)}
.foot-logo{align-items:center}
.foot-logo .wm b{font-size:30px}
.foot-logo .wm i{font-size:9px;letter-spacing:.44em;margin-top:2px;color:var(--iv60)}
.brand-tagline{display:block;margin:12px 0 4px;font-family:var(--display);font-weight:900;font-style:italic;
  font-size:16px;letter-spacing:.03em;text-transform:uppercase;transform:skewX(-8deg);color:var(--ivory)}
.brand-tagline em{font-style:normal;color:var(--lime)}

.nav-logo .wm-img{height:34px;width:auto;display:block}
.foot-logo .wm-img{height:44px;width:auto;display:block}
.enq-brand .wm-img{height:42px}

/* ═══ TYPOGRAPHY POLISH — kill awkward wraps sitewide ═══ */
.gcard h3,.pkg h3,.mean h3,.founder-copy h3,.stage-copy h3,.why-block h3,.promise h4,.dnote h4,.faq-q,.disc-body h3,.prog-copy h3{text-wrap:balance}
/* split display headlines: never break a word mid-character */
.h2 .line > i{white-space:nowrap}
.h2 .line{overflow:visible}
p,li,.lead,.lede,.page-sub,.hero-sub,.enq-tagline,.pkg-blurb,.disc-note,.path-close,
.price-intro,.pcat-blurb,.notice p,.week-body p,.prose-body p{text-wrap:pretty}
.btn span,.enq-wa,.ptab,.glink,.sticky-book a{white-space:nowrap}
.nav-links a{white-space:nowrap}

/* review fixes (journey) */
.path-close{text-align:left;max-width:66ch;margin:36px auto 0}
.promises{align-items:stretch}
.disc-notes{align-items:stretch}
.promise,.dnote{height:100%}
@media(max-width:760px){
  .pathway{grid-template-columns:1fr}
  .pnode:not(:last-child)::after{content:'↓';right:auto;left:50%;top:auto;bottom:-13px;transform:translateX(-50%)}
  .pnode:nth-child(2)::after{display:block}
}

/* ═══════════ DEPTH + REACTIVE PASS v9 — lift the flat sections, wake the cards ═══════════ */
/* 1 · woven dot-grid + blueprint lines on the content sections that read as blank black */
#intro,#why,#glance,#camps,#app,#compete{
  position:relative;overflow:hidden;
  background-image:
    radial-gradient(circle at 50% 50%, rgba(248,249,218,.028) 1px, transparent 1.4px),
    linear-gradient(rgba(118,120,237,.015) 1px, transparent 1px),
    linear-gradient(90deg, rgba(118,120,237,.015) 1px, transparent 1px),
    var(--section-bg, var(--black));
  background-size:26px 26px,130px 130px,130px 130px,cover;
}
#intro{--section-bg:var(--black)}
#why{--section-bg:var(--black)}
#glance{--section-bg:var(--black3)}
#camps{--section-bg:var(--black)}
#app{--section-bg:var(--black)}
/* enquiry-form-style decorative layer: topographic lines + two blurred floating orbs.
   Injected once per section as <div class="sec-fx">, sits behind the content. */
.sec-fx{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.sec-fx::before{content:'';position:absolute;inset:-3%;opacity:.6;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 600' preserveAspectRatio='none'%3E%3Cg fill='none' stroke='%23F8F9DA' stroke-width='1' opacity='0.07'%3E%3Cpath d='M-20 100 Q 260 55 520 100 T 1040 100 T 1560 100'/%3E%3Cpath d='M-20 200 Q 260 245 520 200 T 1040 200 T 1560 200'/%3E%3Cpath d='M-20 300 Q 260 255 520 300 T 1040 300 T 1560 300'/%3E%3Cpath d='M-20 400 Q 260 445 520 400 T 1040 400 T 1560 400'/%3E%3Cpath d='M-20 500 Q 260 455 520 500 T 1040 500 T 1560 500'/%3E%3C/g%3E%3C/svg%3E") center/cover no-repeat;
  -webkit-mask-image:radial-gradient(100% 92% at 50% 42%,#000 42%,transparent 100%);
  mask-image:radial-gradient(100% 92% at 50% 42%,#000 42%,transparent 100%)}
.fx-orb{display:none;position:absolute;border-radius:50%;filter:blur(70px);will-change:transform}
.fx-orb-1{width:440px;height:440px;background:rgba(118,120,237,.05);top:-150px;right:-120px;animation:fxfloat 17s ease-in-out infinite}
.fx-orb-2{width:360px;height:360px;background:rgba(199,239,0,.04);bottom:-160px;left:-120px;animation:fxfloat 21s ease-in-out infinite reverse}
#why .fx-orb-1,#camps .fx-orb-1{background:rgba(199,239,0,.11)}
#why .fx-orb-2,#camps .fx-orb-2{background:rgba(118,120,237,.19)}
@keyframes fxfloat{0%,100%{transform:translate(0,0)}50%{transform:translate(26px,-32px)}}
/* giant ghost watermark words in the empty stretches */
#closing{position:relative;overflow:hidden}
#intro::after,#camps::after,#glance::after,#closing::after{content:attr(data-ghost);position:absolute;z-index:0;pointer-events:none;
  font-family:var(--display);font-weight:900;font-style:italic;text-transform:uppercase;
  font-size:clamp(120px,18vw,300px);line-height:.8;color:transparent;-webkit-text-stroke:1px rgba(248,249,218,.028);
  white-space:nowrap;user-select:none}
#intro::after{right:-3vw;bottom:-2%}
#camps::after{left:-2vw;bottom:2%}
#glance::after{right:-3vw;top:2%}
#closing::after{left:50%;top:50%;transform:translate(-50%,-50%);-webkit-text-stroke-color:rgba(248,249,218,.05)}
/* keep the content above the ambient layers */
#intro .wrapc,#why .wrapc,#glance .wrapc,#camps .wrapc,#app .wrapc{position:relative;z-index:1}
/* KILL THE LETTERBOX GREY: the pinned .stage is 80vh inside a 100svh pinwrap, so a
   ~20vh slab of flat black showed above/below the video. Bleed the bg video to full
   viewport height (choreographed content stays in the 80vh stage, untouched). */
#sit .chapter-bgvid,#turn .chapter-bgvid{height:100svh;top:50%;bottom:auto;transform:translate(-50%,-50%)}
/* soften the video's top & bottom edges into the section so seams read intentional */
#sit .stage::before,#turn .stage::before{content:'';position:absolute;left:50%;transform:translateX(-50%);
  width:100vw;height:26vh;z-index:1;pointer-events:none}
#sit .stage::before{top:-10vh;background:linear-gradient(180deg,var(--black) 8%,transparent)}
#turn .stage::before{top:-10vh;background:linear-gradient(180deg,var(--black) 8%,transparent)}

/* 2 · WHY blocks — dead flat before, now reactive */
.why-block{position:relative;overflow:hidden;transition:background .4s,transform .4s}
.why-block::after{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--lime);
  transform:scaleX(0);transform-origin:left;transition:transform .55s cubic-bezier(.2,.8,.2,1)}
.why-block .n{transition:color .4s,text-shadow .4s}
.why-block:hover{background:rgba(118,120,237,.07)}
.why-block:hover::after{transform:scaleX(1)}
.why-block:hover .n{text-shadow:0 0 34px rgba(199,239,0,.55)}

/* 3 · GLANCE cards — gradient border + hover glow */
.gcard{position:relative;overflow:hidden;border:1px solid transparent;
  background:linear-gradient(170deg,#1c1b28,#141320) padding-box,
             linear-gradient(150deg,rgba(248,249,218,.12),rgba(118,120,237,.16) 55%,rgba(248,249,218,.03)) border-box;
  transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s}
.gcard::after{content:'';position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .5s;
  background:radial-gradient(120% 80% at 50% -10%,rgba(199,239,0,.09),transparent 60%)}
.gcard:hover{transform:translateY(-7px);box-shadow:0 34px 80px -36px rgba(61,52,139,.7)}
.gcard:hover::after{opacity:1}

/* 4 · CAMPS — price glow + reactive list rows */
.camp-price{text-shadow:0 0 60px rgba(199,239,0,.28)}
.camp-list li{transition:transform .35s,color .35s;cursor:default}
.camp-list li::before{transition:transform .35s,box-shadow .35s}
.camp-list li:hover{transform:translateX(8px);color:var(--ivory)}
.camp-list li:hover::before{transform:rotate(45deg) scale(1.25);box-shadow:0 0 12px rgba(199,239,0,.7)}

/* 5 · COMPETE — reactive discipline tags (leaderboard already lives) */
.compete-tags span{transition:border-color .3s,color .3s,transform .3s,background .3s}
.compete-tags span:hover{border-color:var(--lime);transform:translateY(-3px);background:rgba(199,239,0,.05)}

/* 6 · APP — reactive feature rows + phone lift on hover */
.app-feats li{transition:transform .35s}
.app-feats li b{transition:color .35s}
.app-feats li:hover{transform:translateX(7px)}
.app-feats li:hover b{color:var(--lime)}
.phone{transition:transform .6s cubic-bezier(.2,.8,.2,1),box-shadow .6s}
.phone-row:hover .phone:not(.back){transform:translateY(-8px) rotate(-1deg)}
.phone-row:hover .phone.back{transform:rotate(3deg) translateY(-4px)}

/* 7 · FOOTER "Move with us" — multi-colour shimmer on hover (restored + richer) */
.foot-big a:hover{
  background:linear-gradient(115deg,#C7EF00 0%,#7678ED 38%,#FF7A6B 66%,#C7EF00 100%);
  background-size:230% 100%;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;-webkit-text-stroke-color:transparent;
  animation:footsheen 3s linear infinite}
@keyframes footsheen{to{background-position:230% 0}}

/* ═══ FOOTER background video (moved from the enquiry column) + readability scrim ═══ */
footer#site-footer{overflow:hidden}
.foot-bgvid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;pointer-events:none;
  opacity:.42;filter:grayscale(.12) saturate(1) contrast(1.06)}
footer#site-footer::after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(15,14,19,.7),rgba(15,14,19,.42) 45%,rgba(15,14,19,.82))}
footer .foot-big,footer .foot-inner,footer .foot-base{position:relative;z-index:1}

/* ═══ SCROLL DOCK — jump to top / bottom ═══ */
.scroll-dock{position:fixed;right:20px;bottom:22px;z-index:45;display:flex;flex-direction:column;gap:9px}
.sd-btn{width:44px;height:44px;display:flex;align-items:center;justify-content:center;
  background:rgba(15,14,19,.66);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:1px solid var(--iv18);border-radius:50%;color:var(--lime);
  transition:transform .25s,background .25s,color .25s,border-color .25s}
.sd-btn svg{width:19px;height:19px}
.sd-btn:hover{background:var(--lime);color:#15141B;border-color:var(--lime);transform:translateY(-3px)}
@media(max-width:600px){.scroll-dock{right:12px;bottom:14px;gap:7px}.sd-btn{width:39px;height:39px}.sd-btn svg{width:17px;height:17px}}

/* WhatsApp secondary CTA moved inside the form + 'or' divider */
.form-card .enq-wa{display:flex;justify-content:center;align-items:center;width:100%;margin:0 auto;font-size:14px}
.f-or{display:flex;align-items:center;gap:12px;margin:13px 0 11px;color:var(--iv35);
  font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase}
.f-or span{flex:0 0 auto}
.f-or::before,.f-or::after{content:'';flex:1;height:1px;background:var(--iv08)}

/* 04 · What we train — lift the flat intro panel */
.prog-intro > *{position:relative;z-index:1}

@media(prefers-reduced-motion:reduce){
  .foot-big a:hover{animation:none}
  .fx-orb{animation:none}
  .phone-row:hover .phone:not(.back),.phone-row:hover .phone.back{transform:none}
}

/* ═══════════ JOURNEY DEPTH + REACTIVE — parity with home for THIS page's sections ═══════════ */
/* subtle alternating dark gradients (kept in the #0F0E13 / #141320 / #15141B range) + full-section ambient depth */
#first-sport{background:linear-gradient(180deg,#141320 0%,#0F0E13 100%);overflow:hidden}
#stages{background:linear-gradient(180deg,#0F0E13 0%,#15141B 100%)} /* NO overflow:hidden — protects the sticky .stage-band (top:100px) */
#pathway{background:linear-gradient(180deg,#15141B 0%,#141320 100%);overflow:hidden}
#benefits{background:linear-gradient(180deg,#0F0E13 0%,#141320 100%);overflow:hidden}
#adults{background:linear-gradient(180deg,#141320 0%,#15141B 100%);overflow:hidden}
#progress{background:linear-gradient(180deg,#15141B 0%,#0F0E13 100%);overflow:hidden}
#faq{background:linear-gradient(180deg,#141320 0%,#0F0E13 100%);overflow:hidden}
.cta-band{overflow:hidden} /* keeps its signature indigo gradient; just clips the ambient layer */
/* keep the real content above each section's injected .sec-fx depth layer */
#first-sport .wrapc,#stages .wrapc,#pathway .wrapc,#benefits .wrapc,#adults .wrapc,#progress .wrapc,#faq .wrapc,.cta-band .wrapc{position:relative;z-index:1}

/* scroll-dock must clear the mobile sticky-book bar (it shows ≤820px and is ~74px tall) */
@media(max-width:820px){.scroll-dock{bottom:86px}}

/* ═══ REACTIVE CARDS — echo home's .gcard / .why-block energy ═══ */
/* boxed cards get a real lift; GSAP leaves an inline transform after the reveal, so hover uses !important to win */
.pnode,.dnode,.promise{transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s,border-color .45s}
.pnode:hover,.dnode:hover,.promise:hover{transform:translateY(-6px)!important;box-shadow:0 32px 80px -36px rgba(61,52,139,.7)}
.pnode:hover,.dnode:hover{border-color:rgba(199,239,0,.45)}
.promise:hover{box-shadow:0 34px 90px -30px rgba(61,52,139,.6),0 10px 40px -18px rgba(199,239,0,.18)}
/* row cards: tint + soft shadow + a lime top-accent sweep (transform-free — no GSAP/sticky conflicts) */
.stage-card,.benefits li,.faq-item{position:relative;transition:background .4s,box-shadow .4s}
.stage-card::after,.benefits li::after,.faq-item::after{content:'';position:absolute;top:-1px;left:0;right:0;height:2px;
  background:var(--lime);transform:scaleX(0);transform-origin:left;transition:transform .55s cubic-bezier(.2,.8,.2,1);pointer-events:none;z-index:2}
.stage-card:hover::after,.benefits li:hover::after,.faq-item:hover::after{transform:scaleX(1)}
.stage-card:hover,.benefits li:hover,.faq-item:hover{background:rgba(118,120,237,.06)}
.benefits li:hover,.faq-item:hover{box-shadow:0 24px 60px -40px rgba(61,52,139,.7)}

/* ═══ MOBILE HARDENING — client review ═══ */
html{overflow-x:clip}
@supports not (overflow:clip){html{overflow-x:hidden}}