/* ==========================================================================
   businessgrowth.my — Business Growth Masterclass
   Palette: navy #011F47 · gold #EEBA2B · white · light grey
   Type:    Montserrat (display) + Inter (body)
   ========================================================================== */

:root{
  --navy:#011F47;
  --navy-800:#052a5c;
  --navy-700:#0b3a78;
  --gold:#EEBA2B;
  --gold-600:#d9a81f;
  --gold-dark:#856407;   /* AA-compliant gold for text/icons on white */
  --white:#FFFFFF;
  --grey-50:#F6F7F9;
  --grey-100:#ECEFF3;
  --grey-300:#CBD2DC;
  --ink:#16202F;
  --ink-muted:#5A6779;

  --shell:1220px;
  --gutter:clamp(1.25rem, 4vw, 2.5rem);
  --sec-y:clamp(4rem, 8vw, 7rem);
  --r-sm:8px;
  --r-md:14px;
  --r-lg:22px;

  --shadow-sm:0 2px 10px rgba(1,31,71,.06);
  --shadow-md:0 12px 32px rgba(1,31,71,.10);
  --shadow-lg:0 24px 60px rgba(1,31,71,.16);

  --font-display:'Montserrat',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
}

/* --- reset ------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px}
body{
  margin:0;
  font-family:var(--font-body);
  font-size:clamp(1rem,.96rem + .2vw,1.125rem);
  line-height:1.65;
  color:var(--ink);
  background:var(--white);
  -webkit-font-smoothing:antialiased;
}
img,svg{max-width:100%;display:block}
a{color:inherit}
button{font:inherit}
ul{margin:0;padding:0;list-style:none}
h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:800;
  line-height:1.1;
  letter-spacing:-.02em;
  margin:0;
  text-wrap:balance;
}
h1{font-size:clamp(2.1rem,1.3rem + 3.6vw,4.1rem)}
h2{font-size:clamp(1.75rem,1.15rem + 2.6vw,3.1rem)}
h3{font-size:clamp(1.15rem,1.02rem + .6vw,1.5rem)}
p{margin:0 0 1rem}
p:last-child{margin-bottom:0}

:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:4px}

.skip{position:absolute;left:-9999px;top:0;background:var(--gold);color:var(--navy);
  padding:.75rem 1.25rem;font-weight:700;z-index:200}
.skip:focus{left:1rem;top:1rem}

/* --- layout ------------------------------------------------------------ */
.shell{width:min(100% - (var(--gutter) * 2),var(--shell));margin-inline:auto}
.section{padding-block:var(--sec-y)}
.section--navy{background:var(--navy);color:#E8EDF5}
.section--navy h2,.section--navy h3{color:var(--white)}
.section--grey{background:var(--grey-50)}
.center{text-align:center}
.lede{
  font-size:clamp(1.05rem,1rem + .35vw,1.25rem);
  color:var(--ink-muted);
  max-width:58ch;
}
.center .lede{margin-inline:auto}
.section--navy .lede{color:#B9C6DA}

/* Signature motif: an ascending three-bar growth mark before every eyebrow. */
.eyebrow{
  display:inline-flex;align-items:center;gap:.7rem;
  font-family:var(--font-display);
  font-size:.75rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--gold-dark);
  margin-bottom:1rem;
}
.section--navy .eyebrow{color:var(--gold)}
.eyebrow::before{
  content:"";width:22px;height:14px;flex:none;
  background:
    linear-gradient(var(--gold),var(--gold)) 0 100%/4px 5px no-repeat,
    linear-gradient(var(--gold),var(--gold)) 9px 100%/4px 10px no-repeat,
    linear-gradient(var(--gold),var(--gold)) 18px 100%/4px 14px no-repeat;
}
.section-head{margin-bottom:clamp(2rem,4vw,3.25rem)}

/* --- buttons ----------------------------------------------------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  font-family:var(--font-display);font-weight:800;
  font-size:clamp(.85rem,.8rem + .18vw,1rem);
  letter-spacing:.04em;text-transform:uppercase;text-decoration:none;
  padding:1.05rem 1.9rem;border-radius:var(--r-sm);border:2px solid transparent;
  cursor:pointer;text-align:center;
  transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease,color .18s ease;
}
.btn--primary{background:var(--gold);color:var(--navy);box-shadow:0 8px 22px rgba(238,186,43,.32)}
.btn--primary:hover{background:var(--gold-600);transform:translateY(-2px);box-shadow:0 12px 28px rgba(238,186,43,.42)}
.btn--outline{background:transparent;color:var(--navy);border-color:var(--navy)}
.btn--outline:hover{background:var(--navy);color:var(--white);transform:translateY(-2px)}
.section--navy .btn--outline{color:var(--white);border-color:rgba(255,255,255,.5)}
.section--navy .btn--outline:hover{background:var(--white);color:var(--navy);border-color:var(--white)}
.btn--ghost{background:rgba(255,255,255,.08);color:var(--white);border-color:rgba(255,255,255,.35)}
.btn--ghost:hover{background:var(--white);color:var(--navy)}
.btn--lg{padding:1.25rem 2.6rem;font-size:clamp(.95rem,.88rem + .25vw,1.15rem)}
.btn--block{display:flex;width:100%}
.cta-row{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2rem}
.center .cta-row{justify-content:center}
.reassure{margin-top:1rem;font-size:.9rem;color:var(--ink-muted)}
.section--navy .reassure{color:#9FB2CC}

/* --- nav --------------------------------------------------------------- */
.nav{
  position:sticky;top:0;z-index:90;
  background:rgba(1,31,71,.97);
  backdrop-filter:saturate(140%) blur(8px);
  border-bottom:1px solid rgba(255,255,255,.09);
}
.nav__inner{display:flex;align-items:center;gap:1.5rem;min-height:72px}
.nav__logo{display:flex;align-items:center;gap:.6rem;text-decoration:none;flex:none}
.nav__logo img{height:38px;width:auto}
.nav__logo-text{font-family:var(--font-display);font-weight:800;color:var(--white);
  letter-spacing:-.01em;font-size:1.15rem}
.nav__links{display:none;margin-left:auto;align-items:center;gap:clamp(.9rem,1.6vw,1.9rem)}
.nav__links a{
  color:#D5DEEC;text-decoration:none;font-size:.92rem;font-weight:500;
  padding:.4rem 0;border-bottom:2px solid transparent;transition:color .15s,border-color .15s;
}
.nav__links a:hover{color:var(--white);border-color:var(--gold)}
.nav__cta{padding:.8rem 1.4rem;font-size:.8rem}
.nav__toggle{
  margin-left:auto;display:inline-flex;align-items:center;justify-content:center;
  width:46px;height:46px;background:transparent;border:1px solid rgba(255,255,255,.25);
  border-radius:var(--r-sm);color:var(--white);cursor:pointer;
}
.nav__toggle svg{width:24px;height:24px}
.nav__drawer{
  display:none;padding:1rem 0 1.5rem;border-top:1px solid rgba(255,255,255,.09);
  max-height:calc(100dvh - 72px);overflow-y:auto;overscroll-behavior:contain;
}
.nav__drawer.is-open{display:block}
.nav__drawer a{
  display:block;color:#D5DEEC;text-decoration:none;font-weight:600;
  padding:.9rem .25rem;border-bottom:1px solid rgba(255,255,255,.07);
}
.nav__drawer .btn{margin-top:1.25rem}
@media (min-width:1024px){
  .nav__links{display:flex}
  .nav__toggle{display:none}
  .nav__drawer{display:none !important}
}

/* --- hero -------------------------------------------------------------- */
.hero{
  position:relative;overflow:hidden;color:var(--white);
  background:
    radial-gradient(120% 90% at 88% 8%,rgba(238,186,43,.20),transparent 55%),
    linear-gradient(165deg,#02275a 0%,var(--navy) 55%,#01152f 100%);
  padding-block:clamp(3rem,7vw,5.5rem) clamp(3rem,7vw,5rem);
}
.hero::after{ /* ambient ascending rule, echoes the eyebrow motif */
  content:"";position:absolute;inset:auto 0 0 0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(238,186,43,.55),transparent);
}
.hero__grid{display:grid;gap:clamp(2.5rem,5vw,4rem);align-items:center}
.hero h1{color:var(--white)}
.hero__copy p{color:#C4D2E6;max-width:52ch;margin-top:1.25rem}
.hero__facts{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;
  margin-top:2rem;max-width:34rem;
}
.fact{
  display:flex;align-items:center;gap:.7rem;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-sm);padding:.85rem 1rem;
}
.fact svg{width:20px;height:20px;color:var(--gold);flex:none}
.fact span{font-size:.88rem;font-weight:600;color:#E6EDF7;line-height:1.3}
.fact--price{background:rgba(238,186,43,.14);border-color:rgba(238,186,43,.45)}
.fact--price span{color:var(--gold)}

.hero__coaches{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:end}
.coach-cut{position:relative;text-align:center}
.coach-cut__frame{
  position:relative;border-radius:var(--r-lg) var(--r-lg) 0 0;overflow:hidden;
  background:linear-gradient(180deg,rgba(238,186,43,.16),rgba(238,186,43,0));
  border:1px solid rgba(238,186,43,.3);border-bottom:none;aspect-ratio:3/4;
  display:flex;align-items:flex-end;justify-content:center;
}
.coach-cut__frame img{width:100%;height:100%;object-fit:cover;object-position:top center}
.coach-cut__name{
  font-family:var(--font-display);font-weight:800;font-size:.95rem;
  color:var(--white);margin-top:.85rem;
}
.coach-cut__role{font-size:.76rem;color:var(--gold);letter-spacing:.05em;text-transform:uppercase}
.asset-slot{
  width:100%;height:100%;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:.5rem;padding:1rem;text-align:center;
  background:rgba(255,255,255,.05);border:1px dashed rgba(238,186,43,.5);
  color:#9FB2CC;font-size:.72rem;line-height:1.4;
}
.asset-slot code{color:var(--gold);font-size:.68rem;word-break:break-all}
@media (min-width:900px){
  .hero__grid{grid-template-columns:1.15fr .85fr}
  .hero__facts{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* --- generic cards ----------------------------------------------------- */
.grid{display:grid;gap:1.25rem}
.grid--2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.grid--3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.grid--4{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}

.card{
  background:var(--white);border:1px solid var(--grey-100);border-radius:var(--r-md);
  padding:1.6rem;box-shadow:var(--shadow-sm);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--grey-300)}
.card__icon{
  width:48px;height:48px;border-radius:12px;display:grid;place-items:center;
  background:rgba(238,186,43,.15);color:var(--gold-dark);margin-bottom:1rem;
}
.card__icon svg{width:24px;height:24px}
.card h3{margin-bottom:.5rem}
.card p{color:var(--ink-muted);font-size:.95rem}

/* pain points */
.pain .card{padding:1.35rem}
.pain .card h3{font-size:1.02rem;font-weight:700;letter-spacing:-.01em}
.pain__close{
  margin-top:2.5rem;padding:1.5rem;border-left:4px solid var(--gold);
  background:var(--white);border-radius:0 var(--r-md) var(--r-md) 0;
  font-size:1.05rem;font-weight:600;box-shadow:var(--shadow-sm);
}

/* pillars — numbered because the four pillars are a genuine sequence:
   build the owner, attract the market, convert the enquiry, grow the business. */
.pillar{
  position:relative;background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);border-radius:var(--r-md);
  padding:2rem 1.6rem 1.6rem;
}
.pillar::before{
  content:"";position:absolute;top:0;left:1.6rem;width:44px;height:3px;background:var(--gold);
}
.pillar__no{
  font-family:var(--font-display);font-weight:800;font-size:.8rem;
  color:var(--gold);letter-spacing:.14em;
}
.pillar__icon{color:var(--gold);margin:.9rem 0 1rem}
.pillar__icon svg{width:38px;height:38px}
.pillar h3{margin-bottom:.4rem}
.pillar__hook{color:var(--gold);font-weight:600;font-size:.95rem;margin-bottom:.75rem}
.pillar p{color:#B9C6DA;font-size:.94rem}
.tagline{
  margin-top:clamp(2rem,4vw,3rem);padding:1.25rem;text-align:center;
  background:var(--gold);color:var(--navy);border-radius:var(--r-md);
  font-family:var(--font-display);font-weight:800;
  letter-spacing:.22em;font-size:clamp(.85rem,.75rem + .4vw,1.15rem);
}

/* outcomes */
.outcomes{display:grid;gap:.85rem;grid-template-columns:1fr}
@media (min-width:760px){.outcomes{grid-template-columns:1fr 1fr;column-gap:2.5rem}}
.outcome{
  display:flex;gap:.9rem;align-items:flex-start;
  padding:.95rem 0;border-bottom:1px solid var(--grey-100);
}
.outcome svg{width:22px;height:22px;flex:none;color:var(--gold-dark);margin-top:.15rem}
.outcome span{font-weight:600}

/* audience */
.aud{
  display:flex;flex-direction:column;align-items:center;gap:.7rem;text-align:center;
  background:var(--white);border:1px solid var(--grey-100);border-radius:var(--r-md);
  padding:1.4rem .9rem;box-shadow:var(--shadow-sm);
  transition:transform .18s ease,border-color .18s ease;
}
.aud:hover{transform:translateY(-3px);border-color:var(--gold)}
.aud svg{width:28px;height:28px;color:var(--gold-dark)}
.aud span{font-weight:600;font-size:.88rem;line-height:1.35}
.aud-grid{display:grid;gap:1rem;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:640px){.aud-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1000px){.aud-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}

/* story */
.story__grid{display:grid;gap:2.5rem;align-items:start}
@media (min-width:900px){.story__grid{grid-template-columns:.85fr 1.15fr;gap:3.5rem}}
.story__media{border-radius:var(--r-lg);overflow:hidden;background:var(--grey-100);
  min-height:320px;display:flex}
.story__media img{width:100%;height:100%;object-fit:cover}
.story__before{margin:1.5rem 0}
.story__before li{display:flex;gap:.7rem;align-items:flex-start;padding:.5rem 0;
  color:var(--ink-muted);font-size:.95rem}
.story__before svg{width:18px;height:18px;flex:none;color:var(--grey-300);margin-top:.3rem}
.quote{
  margin:2rem 0 0;padding:1.75rem;background:var(--navy);color:var(--white);
  border-radius:var(--r-md);border-left:5px solid var(--gold);
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(1.05rem,.95rem + .5vw,1.4rem);line-height:1.4;
}
.badge{
  display:inline-block;background:var(--navy);color:var(--gold);
  font-family:var(--font-display);font-weight:800;font-size:.72rem;
  letter-spacing:.14em;text-transform:uppercase;padding:.45rem .85rem;border-radius:99px;
}

/* coaches */
.coach{
  background:var(--white);border:1px solid var(--grey-100);border-radius:var(--r-lg);
  overflow:hidden;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;
}
.coach__photo{aspect-ratio:4/3;background:var(--grey-100);display:flex}
.coach__photo img{width:100%;height:100%;object-fit:cover;object-position:top center}
.coach__body{padding:1.75rem}
.coach__name{font-size:1.4rem}
.coach__title{color:var(--gold-dark);font-weight:700;font-size:.9rem;margin:.35rem 0 1rem;
  line-height:1.4}
.coach__body p{color:var(--ink-muted);font-size:.95rem}
.chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.25rem}
.chip{
  background:var(--grey-50);border:1px solid var(--grey-100);border-radius:99px;
  padding:.4rem .85rem;font-size:.8rem;font-weight:600;color:var(--navy);
}

/* why */
.why{display:flex;gap:1rem;align-items:flex-start;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r-md);padding:1.5rem}
.why svg{width:26px;height:26px;color:var(--gold);flex:none}
.why strong{display:block;color:var(--white);font-family:var(--font-display);
  font-weight:700;font-size:1rem;line-height:1.35}

/* event card + countdown */
.event-card{
  background:var(--white);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);
  overflow:hidden;max-width:820px;margin-inline:auto;border:1px solid var(--grey-100);
}
.event-card__top{background:var(--navy);color:var(--white);padding:1.75rem;text-align:center}
.event-card__top h3{font-size:clamp(1.2rem,1rem + .8vw,1.7rem)}
.countdown{display:flex;justify-content:center;gap:clamp(.35rem,1.5vw,.6rem);
  margin-top:1.25rem;flex-wrap:wrap}
.cd{
  min-width:clamp(64px,19vw,76px);background:rgba(255,255,255,.08);border:1px solid rgba(238,186,43,.35);
  border-radius:var(--r-sm);padding:.7rem .5rem;
}
.cd b{display:block;font-family:var(--font-display);font-weight:800;
  font-size:clamp(1.4rem,1.1rem + 1vw,2.1rem);color:var(--gold);line-height:1;
  font-variant-numeric:tabular-nums}
.cd span{display:block;font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;
  color:#A9BAD2;margin-top:.35rem}
.event-rows{padding:.5rem 1.75rem}
.event-row{display:flex;justify-content:space-between;gap:1rem;padding:1rem 0;
  border-bottom:1px solid var(--grey-100)}
.event-row:last-child{border-bottom:none}
.event-row dt{color:var(--ink-muted);font-size:.9rem;font-weight:600}
.event-row dd{margin:0;font-family:var(--font-display);font-weight:700;text-align:right}
.event-row--price dd{color:var(--gold-dark);font-size:1.25rem}
.event-card__foot{padding:0 1.75rem 2rem;text-align:center}

/* comparison */
.compare{display:grid;gap:1.5rem}
@media (min-width:820px){.compare{grid-template-columns:1fr 1fr}}
.col{border-radius:var(--r-lg);padding:1.9rem}
.col--without{background:var(--grey-50);border:1px solid var(--grey-100)}
.col--with{background:var(--navy);color:var(--white);box-shadow:var(--shadow-lg)}
.col h3{font-size:1.15rem;margin-bottom:1.25rem}
.col--with h3{color:var(--gold)}
.col li{display:flex;gap:.8rem;align-items:flex-start;padding:.7rem 0;font-size:.96rem}
.col svg{width:20px;height:20px;flex:none;margin-top:.2rem}
.col--without svg{color:var(--grey-300)}
.col--without li{color:var(--ink-muted)}
.col--with svg{color:var(--gold)}
.invest{
  margin-top:2rem;background:var(--gold);color:var(--navy);border-radius:var(--r-md);
  padding:1.5rem;text-align:center;
}
.invest b{display:block;font-family:var(--font-display);font-weight:800;
  font-size:clamp(1.5rem,1.2rem + 1.4vw,2.4rem);line-height:1.1}
.invest span{font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700}

/* faq */
.faq{max-width:820px;margin-inline:auto}
.faq details{
  background:var(--white);border:1px solid var(--grey-100);border-radius:var(--r-md);
  margin-bottom:.75rem;box-shadow:var(--shadow-sm);
}
.faq summary{
  cursor:pointer;list-style:none;padding:1.15rem 3rem 1.15rem 1.35rem;position:relative;
  font-family:var(--font-display);font-weight:700;font-size:1rem;color:var(--navy);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";position:absolute;right:1.35rem;top:50%;width:10px;height:10px;
  border-right:2px solid var(--gold-dark);border-bottom:2px solid var(--gold-dark);
  transform:translateY(-70%) rotate(45deg);transition:transform .2s ease;
}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq__body{padding:0 1.35rem 1.35rem;color:var(--ink-muted);font-size:.96rem}
.pending{
  display:inline-block;background:#FFF4D6;border:1px dashed var(--gold-dark);
  color:#7A5A00;font-size:.82rem;padding:.5rem .8rem;border-radius:var(--r-sm);
}

/* final cta */
.final{
  position:relative;overflow:hidden;color:var(--white);text-align:center;
  background:
    radial-gradient(90% 120% at 50% 0%,rgba(238,186,43,.22),transparent 60%),
    linear-gradient(180deg,#02275a,#01152f);
}
.final h2{color:var(--white)}
.final__lines{display:grid;gap:.5rem;margin:2.25rem 0;justify-items:center}
.final__lines span{
  font-family:var(--font-display);font-weight:800;letter-spacing:.1em;
  font-size:clamp(.85rem,.75rem + .5vw,1.2rem);color:#DCE6F3;
}
.final__lines span:first-child{color:var(--gold);letter-spacing:.18em}
.final__lines .price{
  color:var(--navy);background:var(--gold);padding:.5rem 1.25rem;border-radius:99px;
  font-size:clamp(1rem,.85rem + .7vw,1.5rem);letter-spacing:.06em;
}
.final__close{margin-top:1.5rem;color:#B9C6DA;font-weight:600}

/* footer */
.footer{background:#01152f;color:#93A6C2;font-size:.9rem;padding-block:3rem 6rem}
.footer a{color:#C6D3E6;text-decoration:none}
.footer a:hover{color:var(--gold);text-decoration:underline}
.footer__top{display:grid;gap:2rem;margin-bottom:2rem}
@media (min-width:820px){.footer__top{grid-template-columns:1.4fr 1fr 1fr}}
.footer h4{color:var(--white);font-size:.85rem;letter-spacing:.14em;text-transform:uppercase;
  margin-bottom:1rem}
.footer li{padding:.15rem 0}
.footer li a{display:flex;align-items:center;min-height:44px;padding:.35rem 0}
.footer__disclaimer{
  border-top:1px solid rgba(255,255,255,.1);padding-top:1.75rem;
  font-size:.78rem;line-height:1.6;color:#7E90AC;
}
.footer__disclaimer strong{color:#A9BAD2}

/* sticky CTAs */
.sticky-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:95;
  background:rgba(1,31,71,.98);border-top:1px solid rgba(238,186,43,.35);
  padding:.7rem var(--gutter);
  display:flex;align-items:center;gap:1rem;
  transform:translateY(110%);transition:transform .25s ease;
  padding-bottom:calc(.7rem + env(safe-area-inset-bottom));
}
.sticky-bar.is-visible{transform:none}
.sticky-bar__price{color:var(--white);font-family:var(--font-display);font-weight:800;
  line-height:1.15;font-size:.9rem;flex:none}
.sticky-bar__price small{display:block;font-weight:500;font-size:.7rem;color:#A9BAD2;
  letter-spacing:.06em}
.sticky-bar .btn{flex:1;padding:.9rem 1rem;font-size:.8rem}
@media (min-width:1024px){.sticky-bar{display:none}}

.wa-float{
  position:fixed;right:1rem;bottom:5.5rem;z-index:94;
  width:54px;height:54px;border-radius:50%;background:#25D366;color:#fff;
  display:grid;place-items:center;box-shadow:var(--shadow-md);text-decoration:none;
}
.wa-float svg{width:28px;height:28px}
@media (min-width:1024px){.wa-float{bottom:1.5rem}}

/* exit intent */
.exit{
  position:fixed;inset:0;z-index:120;display:none;place-items:center;
  background:rgba(1,21,47,.6);padding:1.5rem;
}
.exit.is-open{display:grid}
.exit__panel{
  background:var(--white);border-radius:var(--r-lg);max-width:440px;width:100%;
  padding:2.25rem;text-align:center;box-shadow:var(--shadow-lg);position:relative;
}
.exit__panel h3{margin-bottom:.75rem}
.exit__panel p{color:var(--ink-muted);font-size:.95rem}
.exit__close{
  position:absolute;top:.75rem;right:.75rem;width:38px;height:38px;border-radius:50%;
  border:none;background:var(--grey-50);color:var(--ink-muted);cursor:pointer;
  display:grid;place-items:center;
}
.exit__close svg{width:18px;height:18px}

/* cookie consent */
.cookie{
  position:fixed;left:1rem;right:1rem;bottom:5.5rem;z-index:110;
  background:var(--white);border:1px solid var(--grey-100);border-radius:var(--r-md);
  box-shadow:var(--shadow-lg);padding:1.25rem;display:none;gap:1rem;
  flex-direction:column;font-size:.88rem;
}
.cookie.is-open{display:flex}
.cookie__actions{display:flex;gap:.6rem;flex-wrap:wrap}
.cookie .btn{padding:.7rem 1.1rem;font-size:.75rem}
@media (min-width:820px){
  .cookie{left:auto;right:1.5rem;bottom:1.5rem;max-width:420px}
}

/* --- motion ------------------------------------------------------------ */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s ease}
.reveal.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;transition-duration:.001ms !important}
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none}
}

/* --- very large screens (65" TV) --------------------------------------- */
@media (min-width:1800px){
  :root{--shell:1520px;--sec-y:clamp(6rem,7vw,9rem)}
  body{font-size:1.2rem}
}

/* --- long-form policy pages --------------------------------------------- */
.page-head{background:var(--navy);color:var(--white);padding-block:clamp(3rem,6vw,4.5rem)}
.page-head h1{color:var(--white);font-size:clamp(1.9rem,1.3rem + 2.4vw,3rem)}
.page-head p{color:#B9C6DA;margin-top:.75rem}
.prose{max-width:74ch;margin-inline:auto}
.prose h2{font-size:clamp(1.25rem,1.1rem + .8vw,1.7rem);margin:2.5rem 0 .85rem}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:1.05rem;margin:1.75rem 0 .5rem}
.prose p,.prose li{color:var(--ink-muted)}
.prose ul{list-style:disc;padding-left:1.35rem;margin:0 0 1rem}
.prose li{margin-bottom:.45rem}
.prose a{color:var(--navy-700);font-weight:600}
.prose table{width:100%;border-collapse:collapse;margin:1rem 0;font-size:.92rem}
.prose th,.prose td{text-align:left;padding:.7rem .5rem;border-bottom:1px solid var(--grey-100);
  vertical-align:top}
.prose th{font-family:var(--font-display);color:var(--navy)}
.todo{background:#FFF4D6;border-left:4px solid var(--gold-dark);padding:1rem 1.25rem;
  border-radius:0 var(--r-sm) var(--r-sm) 0;font-size:.9rem;color:#6B4F00;margin:1.25rem 0}

/* --- checkout page ------------------------------------------------------ */
.checkout{display:grid;gap:2rem;align-items:start}
@media (min-width:960px){.checkout{grid-template-columns:1.55fr .95fr;gap:2.5rem}}
.checkout__form{
  background:var(--white);border:1px solid var(--grey-100);border-radius:var(--r-lg);
  padding:clamp(1.5rem,3vw,2.25rem);box-shadow:var(--shadow-md);
}
.checkout__side{display:grid;gap:1.25rem}
.summary{
  background:var(--white);border:1px solid var(--grey-100);border-radius:var(--r-md);
  padding:1.5rem;box-shadow:var(--shadow-sm);
}
.summary h3{font-size:1.02rem;margin-bottom:.75rem}
.summary .event-row{padding:.7rem 0}
.summary .outcome{padding:.6rem 0;font-size:.92rem}
/* keep the embedded OnPay form inside our container on small screens */
#onpay-order-form{max-width:100%;overflow-x:auto}
#onpay-order-form iframe{width:100% !important;max-width:100%;border:0}

/* <picture> wrappers must fill their frame exactly as a bare <img> would */
.coach-cut__frame picture,.story__media picture,.coach__photo picture{
  display:block;width:100%;height:100%;
}

/* --- small-phone corrections -------------------------------------------- */

/* The WhatsApp button and the cookie sheet both anchored to the same offset
   and overlapped. The sheet now sits directly above the sticky CTA bar, and
   the float lifts out of its way only while the sheet is open. */
.cookie{bottom:4.75rem}
body.has-consent .wa-float{bottom:calc(4.75rem + 190px)}
@media (min-width:820px){
  .cookie{bottom:1.5rem}
  body.has-consent .wa-float{bottom:1.5rem}
}

@media (max-width:520px){
  /* wide letter-spacing pushed these past the viewport edge */
  .tagline{letter-spacing:.12em;line-height:1.5}
  .final__lines span{letter-spacing:.08em;text-align:center}
  .final__lines span:first-child{letter-spacing:.12em}

  /* long uppercase CTA labels need the horizontal room back */
  .btn{padding:1rem 1.25rem;letter-spacing:.02em}
  .btn--lg{padding:1.15rem 1.4rem}

  /* event rows: let a long value wrap under its label rather than squeeze */
  .event-row{flex-direction:column;gap:.2rem}
  .event-row dd{text-align:left}

  /* keep the two coaches side by side but give them a little more room */
  .hero__coaches{gap:.6rem}
  .coach-cut__name{font-size:.85rem}
  .coach-cut__role{font-size:.68rem}
}

@media (max-width:380px){
  .hero__facts{grid-template-columns:1fr}
}
