/* /coaching/ (templates/coaching.html), scoped under .cch.

   A recreation of the owner's design handoff (design_handoff_coaching_page,
   2026-10-23, "Coaching Page.dc.html"): every inline style of the prototype is a
   class here, and every hover the prototype drove through JS state is a plain CSS
   :hover (the comparison uses :has()). Tokens are the prototype's own:

     ground #05080f · ink #f4f7fc · body #d6deeb · dim #a3afc6 · muted #6f7c96
     blue #5bc3f9 (91,195,249) · light blue #8fd6fb · brand blue #2f6bff
     gold #f5c542 (245,197,66) · gold light #f7e3a1 · deep #d9a52a · amber #e0975a
     easing cubic-bezier(.2,.7,.2,1)

   Breakpoints are the prototype's: 720px (hero photo, stats), 760px (step and area
   offsets, the session curve, as the same clamp(…, 100vw - 760px, …) it used) and
   960px (each coach stacks name -> photo -> details). */

/* ===== The site nav, over the hero (desktop) =====
   Sticky like every public page (owner 2026-10-23: the handoff's nav scrolled away
   with the hero, and that read as broken). <main> slides up under it by
   --cch-navh (coaching.js measures the bar; 70px until it does), and while the page
   is at the very top (html.cch-at-top: set in the head before the first paint, kept
   in step with the scroll by coaching.js) the bar is transparent over the photo, as
   drawn. Scrolled, it is the site's own glass bar. Phones keep the site's sticky
   bar as it is. */
/* base.html makes <body> h-full: let this page grow with its content (as about,
   guides and the homepage do), or the flex column squeezes <main>, whose overflow
   is hidden, down to one screen. */
body.cch-page{ height:auto; min-height:100vh; background:#05080f; }
/* (this sheet is only on /coaching/) focus and anchors stop below the sticky bar */
html{ scroll-padding-top:88px; background:#05080f; }
.cch-page .landing-nav{ position:sticky; top:0; z-index:50; }
@media (min-width:761px){
  .cch-page .landing-nav{ transition:background-color .3s,border-color .3s,box-shadow .3s; }
  html.cch-at-top body.cch-page .landing-nav{
    background:transparent; border-bottom-color:transparent; box-shadow:none;
    -webkit-backdrop-filter:none; backdrop-filter:none;
  }
  .cch{ margin-top:calc(-1 * var(--cch-navh)); }
}

/* ===== Root ===== */
.cch{
  --cch-navh:70px;
  --cch-ease:cubic-bezier(.2,.7,.2,1);
  /* One family, Inter, as the handoff sets it. The base layer gives every h1-h4
     var(--font-display), Orbitron on public pages; redefining it here keeps the
     page's headings in Inter (the nav's wordmark is outside .cch and keeps its own). */
  --font-display:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  position:relative; overflow:hidden; flex-shrink:0;
  /* The prototype runs on the browser's default line-height (normal); the site's
     1.5 made every heading without its own line-height taller than drawn. */
  line-height:normal;
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  color:#e7ecf6; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  background:
    radial-gradient(ellipse 70% 40% at 15% 0%,rgba(47,107,255,.14),transparent 70%),
    radial-gradient(ellipse 50% 30% at 90% 6%,rgba(245,197,66,.08),transparent 70%),
    #05080f;
}
.cch :where(h1,h2,h3,p,ul,ol,dl,dd,figure,blockquote){ margin:0; }
.cch :where(ul,ol){ padding:0; list-style:none; }
.cch :where(a){ color:#5bc3f9; text-decoration:none; }
.cch :where(a:hover){ color:#8fd6fb; }
.cch :where(button){ font:inherit; color:inherit; }
.cch-sr{ position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }

/* Text gradients. --gs moves the gold midpoint (40-50% across the prototype). */
.cch-grad-gold{ background:linear-gradient(90deg,#f7e3a1,#f5c542 var(--gs,50%),#e0975a); -webkit-background-clip:text; background-clip:text; color:transparent; }
.cch-grad-blue{ background:linear-gradient(90deg,#8fd6fb,#5bc3f9 50%,#2f6bff); -webkit-background-clip:text; background-clip:text; color:transparent; }

/* Eyebrow: 11.5px caps with a 28px rule in the section's colour. */
.cch-eyebrow{ display:inline-flex; align-items:center; gap:12px; font-size:11.5px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; }
.cch-eyebrow--blue{ color:#5bc3f9; }
.cch-eyebrow--gold{ color:#f5c542; }
.cch-rule{ flex:none; width:28px; height:1px; background:currentColor; }
.cch-rule--blue{ background:#5bc3f9; }

.cch-h2{ margin-top:18px; color:#f4f7fc; font-size:clamp(32px,4.4vw,54px); font-weight:700; letter-spacing:-.035em; line-height:1.04; }
.cch-intro{ max-width:560px; margin-top:16px; color:#a3afc6; font-size:16px; line-height:1.6; }
.cch-center{ text-align:center; }
.cch-intro--center{ margin-left:auto; margin-right:auto; }
.cch-label{ color:#6f7c96; font-size:11px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; }

.cch-sec{ position:relative; max-width:1280px; margin:0 auto; padding:clamp(90px,11vw,150px) clamp(20px,4vw,48px) 40px; }

/* ===== Buttons ===== */
.cch-btn{ display:inline-flex; align-items:center; min-height:52px; padding:0 26px; border-radius:12px; font-size:15px; font-weight:700; transition:transform .35s var(--cch-ease),box-shadow .35s; }
.cch-btn--gold{ background:linear-gradient(180deg,#f7d97a,#f5c542 55%,#d9a52a); color:#1a1204; box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 14px 36px -8px rgba(245,197,66,.5); }
.cch-btn--gold:hover{ color:#1a1204; transform:translateY(-1px); }
.cch-btn--blue{ background:linear-gradient(180deg,#4a80ff,#2f6bff); color:#fff; font-weight:600; box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 12px 32px rgba(47,107,255,.4); }
.cch-btn--blue:hover{ color:#fff; transform:translateY(-1px); }
.cch-btn--hero{ padding:0 28px; box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 14px 36px -8px rgba(245,197,66,.55); }
.cch-btn--outline{ border:1px solid rgba(91,195,249,.4); color:#f4f7fc; font-weight:600; transition:background .3s,color .3s; }
.cch-btn--outline:hover{ color:#fff; background:rgba(91,195,249,.08); }
.cch-btn--cmp{ min-height:48px; padding:0 22px; font-size:14.5px; box-shadow:none; }
.cch-btn--cmp:hover{ transform:none; }

/* ===== 1. Hero ===== */
.cch-hero{ position:relative; min-height:max(640px,100vh); display:flex; flex-direction:column; overflow:hidden; isolation:isolate; }
.cch-hero-photo{ position:absolute; inset:0; z-index:-2; }
.cch-hero-photo img{ display:block; width:100%; height:100%; object-fit:cover; object-position:72% 22%; }
.cch-hero-shade-x{ position:absolute; top:0; bottom:0; left:0; width:100%; z-index:-1; background:linear-gradient(90deg,#05080f 0%,rgba(5,8,15,.92) 22%,rgba(7,12,24,.55) 44%,rgba(7,12,24,0) 64%); }
.cch-hero-shade-y{ position:absolute; top:0; left:0; right:0; height:100%; z-index:-1; background:linear-gradient(180deg,rgba(5,8,15,.9) 0%,rgba(5,8,15,.66) 8%,rgba(5,8,15,0) 22%,rgba(5,8,15,0) 52%,#05080f 100%); }
.cch-hero-glow{ position:absolute; inset:0; z-index:-1; background:radial-gradient(ellipse 50% 70% at 0% 70%,rgba(47,107,255,.28),transparent 70%); }
.cch-hero-inner{
  position:relative; z-index:2; flex:1; display:flex; flex-direction:column; justify-content:flex-end;
  width:100%; max-width:1280px; margin:0 auto;
  padding:calc(var(--cch-navh) + clamp(40px,8vh,100px)) clamp(20px,4vw,48px) clamp(48px,9vh,110px);
}
.cch-hero-inner > .flash-banner{ margin:0 0 auto; max-width:620px; padding:0; }
.cch-hero-copy{ max-width:620px; }
.cch-hero-tags{ display:flex; align-items:center; flex-wrap:wrap; gap:14px 18px; }
.cch-live{ display:inline-flex; align-items:center; gap:8px; color:#d6deeb; font-size:12.5px; }
.cch-live-dot{ width:7px; height:7px; border-radius:50%; background:#2bd17e; animation:cchPulse 1.8s infinite; }
@keyframes cchPulse{ 0%{ box-shadow:0 0 0 0 rgba(43,209,126,.55); } 70%{ box-shadow:0 0 0 8px rgba(43,209,126,0); } 100%{ box-shadow:0 0 0 0 rgba(43,209,126,0); } }
.cch-h1{ margin-top:22px; color:#f4f7fc; font-size:clamp(56px,9vw,128px); font-weight:700; letter-spacing:-.045em; line-height:.9; text-shadow:0 10px 40px rgba(0,0,0,.4); }
.cch-h1 .cch-grad-gold{ --gs:40%; }
.cch-hero-lede{ max-width:500px; margin-top:26px; color:#d6deeb; font-size:18px; line-height:1.6; text-wrap:pretty; }
.cch-hero-actions{ display:flex; flex-wrap:wrap; align-items:center; gap:12px 22px; margin-top:32px; }
.cch .cch-watch{ display:inline-flex; align-items:center; gap:10px; min-height:52px; color:#f4f7fc; font-size:15px; font-weight:600; transition:color .3s; }
.cch .cch-watch:hover{ color:#8fd6fb; }
.cch-watch-ring{ display:grid; place-items:center; width:36px; height:36px; border-radius:50%; border:1.5px solid rgba(91,195,249,.7); background:rgba(5,8,15,.4); }
.cch-watch-tri{ width:0; height:0; margin-left:3px; border-left:9px solid #5bc3f9; border-top:6px solid transparent; border-bottom:6px solid transparent; }
.cch-sims{ display:flex; align-items:center; flex-wrap:wrap; gap:14px 28px; margin-top:30px; }
.cch-sims-label{ color:#a3afc6; font-size:11px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
.cch-sim{ display:block; width:auto; opacity:.85; }
.cch-sim--acc{ height:29px; }
.cch-sim--lmu{ height:25px; }
.cch-sim--ams2{ height:33px; }
@media (max-width:760px){
  /* The bar is in the flow above the hero here, not over it. */
  .cch-hero-inner{ padding-top:clamp(40px,8vh,100px); }
  .cch-hero{ min-height:max(640px,calc(100vh - var(--cch-navh))); }
}
@media (max-width:720px){
  .cch-hero{ min-height:640px; }
  .cch-hero-photo,.cch-hero-shade-x,.cch-hero-shade-y{ display:none; }
}

/* ===== 2. Stats ===== */
.cch-stats{ max-width:1280px; margin:0 auto; padding:40px clamp(20px,4vw,48px) 20px; }
.cch-stats-row{ display:flex; flex-wrap:wrap; gap:28px 0; }
.cch-stat{ flex:1 1 220px; padding:4px 28px; cursor:default; transition:transform .4s var(--cch-ease); }
.cch-stat--gold{ --rgb:245,197,66; }
.cch-stat--blue{ --rgb:91,195,249; }
.cch-stat:nth-child(2){ border-left:1px solid; border-image:linear-gradient(180deg,transparent,rgba(245,197,66,.4),transparent) 1; }
.cch-stat:nth-child(3){ border-left:1px solid; border-image:linear-gradient(180deg,transparent,rgba(91,195,249,.45),transparent) 1; }
.cch-stat:nth-child(4){ border-left:1px solid; border-image:linear-gradient(180deg,transparent,rgba(160,180,220,.25),transparent) 1; }
.cch-stat-n{ color:#f4f7fc; font-size:clamp(40px,4.6vw,60px); font-weight:600; letter-spacing:-.045em; line-height:1; transform-origin:left bottom; transition:transform .45s var(--cch-ease),filter .45s; }
.cch-stat-n.cch-grad-gold,.cch-stat-n.cch-grad-blue{ color:transparent; } /* the gradient, not the plain colour above */
.cch-stat p{ max-width:200px; margin-top:10px; color:#a3afc6; font-size:14px; line-height:1.45; transition:color .35s; }
.cch-stat--muted p{ max-width:220px; color:#6f7c96; }
.cch-stat:hover{ transform:translateY(-4px); }
.cch-stat:hover .cch-stat-n{ transform:scale(1.08); filter:drop-shadow(0 6px 22px rgba(var(--rgb),.55)); }
.cch-stat:hover p{ color:#f4f7fc; }
.cch-hairline{ height:1px; margin-top:36px; background:linear-gradient(90deg,rgba(245,197,66,.6),rgba(160,180,220,.18) 50%,rgba(91,195,249,.6)); }
@media (max-width:720px){
  .cch-stat{ padding:4px 0; text-align:center; }
  .cch-stat:nth-child(n){ border-left-width:0; }
  .cch-stat p{ margin-left:auto; margin-right:auto; }
  .cch-stat-n{ transform-origin:center bottom; }
}

/* ===== 3. Sound familiar ===== */
.cch-familiar{ padding-top:clamp(80px,10vw,140px); }
.cch-familiar-h2{ max-width:820px; text-wrap:balance; }
.cch-plateau{ position:relative; margin-top:56px; }
.cch-plateau-labels{ display:flex; justify-content:space-between; color:#6f7c96; font-size:10.5px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
.cch-plateau-svg{ display:block; width:100%; height:140px; margin-top:8px; }
.cch-pains{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); gap:36px 44px; margin-top:28px; }
.cch-pain{ padding-left:18px; border-left:1px solid rgba(91,195,249,.35); }
.cch-pain--neutral{ margin-top:24px; border-left-color:rgba(160,180,220,.25); }
.cch-pain--gold{ margin-top:48px; border-left-color:rgba(245,197,66,.45); }
.cch-pain h3{ color:#f4f7fc; font-size:19px; font-weight:600; letter-spacing:-.015em; line-height:1.3; }
.cch-pain p{ margin-top:10px; color:#a3afc6; font-size:15px; line-height:1.6; }

.cch-earns{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr)); gap:40px 64px; align-items:center; margin-top:110px; }
.cch-earns-big{ color:#f4f7fc; font-size:clamp(28px,3.2vw,42px); font-weight:700; letter-spacing:-.03em; line-height:1.1; text-wrap:balance; }
.cch-earns-big .cch-grad-gold{ --gs:45%; }
.cch-earns-sub{ max-width:440px; margin-top:20px; color:#a3afc6; font-size:17px; line-height:1.6; text-wrap:pretty; }

/* The breakthrough chart: a dashed plateau, a glowing dot, then the drop. */
.cch-break{ position:relative; aspect-ratio:16/10; cursor:default; }
.cch-break svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.cch-break-trace{ stroke-dasharray:1; stroke-dashoffset:1; opacity:0; filter:drop-shadow(0 0 6px rgba(245,197,66,.9)); transition:stroke-dashoffset 1.2s cubic-bezier(.4,0,.2,1),opacity .4s; }
.cch-break-dot{ position:absolute; left:33.3%; top:16%; width:16px; height:16px; border-radius:50%; background:#f5c542; transform:translate(-50%,-50%) scale(1); box-shadow:0 0 0 6px rgba(245,197,66,.15),0 0 24px rgba(245,197,66,.7); transition:transform .4s var(--cch-ease),box-shadow .4s; }
.cch-break-plateau,.cch-break-session{ position:absolute; top:16%; font-size:10.5px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
.cch-break-plateau{ left:0; transform:translateY(60%); color:#6f7c96; }
.cch-break-session{ left:33.3%; transform:translate(-50%,-190%); color:#f5c542; white-space:nowrap; }
.cch-break-what,.cch-break-how{ position:absolute; font-size:clamp(16px,2.2vw,28px); font-weight:600; letter-spacing:-.02em; white-space:nowrap; }
.cch-break-what{ left:54%; top:30%; color:#f5c542; transition:transform .5s var(--cch-ease) .15s,text-shadow .5s .15s; }
.cch-break-how{ left:38%; top:62%; color:#5bc3f9; transition:transform .5s var(--cch-ease) .45s,text-shadow .5s .45s; }
.cch-break-and{ position:absolute; left:30%; top:56%; color:#a3afc6; font-size:15px; }
@media (max-width:400px){ .cch-break-and{ left:calc(30% - 12px); } } /* clear of "how to practise it," */
.cch-break-end{ position:absolute; right:0; top:94%; color:#d6deeb; font-size:15px; white-space:nowrap; transition:color .4s .8s; }
.cch-break:hover .cch-break-trace{ stroke-dashoffset:0; opacity:1; }
.cch-break:hover .cch-break-dot{ transform:translate(-50%,-50%) scale(1.35); box-shadow:0 0 0 10px rgba(245,197,66,.18),0 0 36px rgba(245,197,66,.9); }
.cch-break:hover .cch-break-what{ transform:translateX(8px) scale(1.06); text-shadow:0 0 24px rgba(245,197,66,.55); }
.cch-break:hover .cch-break-how{ transform:translateX(8px) scale(1.06); text-shadow:0 0 24px rgba(91,195,249,.55); }
.cch-break:hover .cch-break-end{ color:#fff; }

/* ===== 4. Coaches ===== */
.cch-coaches .cch-intro{ margin-left:auto; margin-right:auto; text-wrap:pretty; }
.cch-coach{ position:relative; margin-top:70px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 56px; align-items:center; }
.cch-coach + .cch-coach{ margin-top:60px; }
.cch-coach--gold{ --c:#f5c542; --rgb:245,197,66; }
.cch-coach--blue{ --c:#5bc3f9; --rgb:91,195,249; }
.cch-coach--flip .cch-coach-text{ order:1; }
.cch-coach--flip .cch-portrait{ order:2; }

.cch-portrait{ position:relative; min-height:540px; }
.cch-portrait-glow{ position:absolute; inset:6% 0 0 0; opacity:.75; transition:opacity .5s,transform .7s var(--cch-ease); }
.cch-coach--gold .cch-portrait-glow{ background:radial-gradient(circle at 50% 46%,rgba(245,197,66,.26),rgba(245,197,66,.06) 38%,transparent 64%); }
.cch-coach--blue .cch-portrait-glow{ background:radial-gradient(circle at 50% 46%,rgba(47,107,255,.3),rgba(91,195,249,.06) 38%,transparent 64%); }
.cch-portrait-ring,.cch-portrait-dash{ position:absolute; left:50%; top:44%; aspect-ratio:1; border-radius:50%; translate:-50% -50%; }
.cch-portrait-ring{ width:min(460px,90%); border:1px solid rgba(var(--rgb),.22); transition:scale .6s var(--cch-ease),border-color .4s,box-shadow .4s; }
.cch-portrait-dash{ width:min(520px,96%); border:1px dashed rgba(var(--rgb),.1); transition:rotate 1.4s var(--cch-ease),scale .8s var(--cch-ease); }
.cch-coach--blue .cch-portrait-dash{ border-color:rgba(91,195,249,.12); }
.cch-portrait-img{
  position:relative; display:block; width:min(420px,88%); height:auto; margin:0 auto;
  -webkit-mask:linear-gradient(180deg,#000 70%,transparent 98%),linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
  -webkit-mask-composite:source-in;
  mask:linear-gradient(180deg,#000 70%,transparent 98%) intersect,linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
  transition:transform .6s var(--cch-ease),filter .5s;
}
.cch-portrait:hover .cch-portrait-glow{ opacity:1; transform:scale(1.12); }
.cch-portrait:hover .cch-portrait-ring{ scale:1.05; border-color:rgba(var(--rgb),.6); box-shadow:0 0 40px rgba(var(--rgb),.25),inset 0 0 40px rgba(var(--rgb),.12); }
.cch-portrait:hover .cch-portrait-dash{ rotate:90deg; scale:1.08; }
.cch-portrait:hover .cch-portrait-img{ transform:translateY(-10px) scale(1.04); filter:brightness(1.08) drop-shadow(0 24px 40px rgba(var(--rgb),.3)); }

.cch-coach-eyebrow{ color:var(--c); font-size:11.5px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; }
.cch-coach-name{ margin-top:12px; color:#f4f7fc; font-size:clamp(36px,4vw,50px); font-weight:700; letter-spacing:-.04em; line-height:1; }
.cch-coach-sub{ margin-top:8px; color:#6f7c96; font-size:14.5px; }
.cch-coach-bio{ max-width:540px; margin-top:20px; color:#a3afc6; font-size:16px; line-height:1.65; text-wrap:pretty; }
.cch-creds{ display:flex; flex-direction:column; gap:11px; margin-top:22px; color:#d6deeb; font-size:14.5px; line-height:1.45; }
.cch-creds li{ display:flex; gap:12px; align-items:baseline; }
.cch-creds li::before{ content:""; flex:none; width:7px; height:7px; background:var(--c); transform:translateY(-2px) rotate(45deg); }
/* The facts (owner's mock, 2026-10-23): under a hairline, the sims as logos, the
   classes as chips and the languages as badges, in the coach's colour. */
.cch-facts{ display:flex; flex-direction:column; align-items:flex-start; gap:20px; max-width:540px; margin-top:28px; padding-top:26px; border-top:1px solid rgba(160,180,220,.14); }
.cch-fsims{ display:flex; flex-wrap:wrap; align-items:center; gap:14px 24px; }
.cch-fsims li{ display:flex; }
.cch-fsim{ display:block; width:auto; opacity:.9; }
.cch-fsim--iracing{ height:20px; }
.cch-fsim--acc{ height:23px; }
.cch-fsim--lmu{ height:19px; }
.cch-fsim--ams2{ height:22px; }
.cch-fsim--acevo{ color:#f4f7fc; font-size:14.5px; font-style:italic; font-weight:800; letter-spacing:.01em; line-height:1; white-space:nowrap; }
.cch-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.cch-chips li{ display:flex; align-items:center; min-height:28px; padding:0 12px; border:1px solid rgba(var(--rgb),.28); border-radius:999px; background:rgba(var(--rgb),.06); color:#e6ebf5; font-size:13px; font-weight:500; line-height:1; white-space:nowrap; }
.cch-langs{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; color:#a3afc6; font-size:13.5px; }
.cch-lang{ display:grid; place-items:center; width:26px; height:26px; border:1px solid rgba(var(--rgb),.55); border-radius:50%; background:rgba(var(--rgb),.08); color:var(--c); font-size:9.5px; font-weight:700; letter-spacing:.04em; }
.cch-langs-names{ margin-left:6px; }
/* Phones: the five logos a little smaller, so they stay one row from 360px. */
@media (max-width:480px){
  .cch-fsims{ gap:12px 14px; }
  .cch-fsim--iracing{ height:17px; }
  .cch-fsim--acc{ height:20px; }
  .cch-fsim--lmu{ height:16px; }
  .cch-fsim--ams2{ height:19px; }
  .cch-fsim--acevo{ font-size:12.5px; }
}
.cch-coach-prices{ display:flex; align-items:flex-end; flex-wrap:wrap; gap:18px 36px; margin-top:30px; }
/* Each price is a link to its own session (owner's links, 2026-10-23); it looks
   exactly as drawn and lifts a little under the pointer. */
.cch .cch-coach-price,.cch .cch-prow-price{ display:flex; flex-direction:column; color:inherit; }
.cch-coach-price .cch-label,.cch-prow-label{ transition:color .3s; }
.cch-coach-amt{ margin-top:6px; color:#f4f7fc; font-size:44px; font-weight:600; letter-spacing:-.04em; line-height:1; transition:transform .35s var(--cch-ease); }
.cch-coach-price:hover .cch-coach-amt{ transform:translateY(-2px); }
.cch-coach-price:hover .cch-label,.cch-prow-price:hover .cch-prow-label{ color:#a3afc6; }
.cch-coach--gold .cch-coach-price--accent .cch-coach-amt{ background:linear-gradient(90deg,#f7e3a1,#f5c542 50%,#e0975a); -webkit-background-clip:text; background-clip:text; color:transparent; }
.cch-coach--blue .cch-coach-price--accent .cch-coach-amt{ background:linear-gradient(90deg,#8fd6fb,#5bc3f9 50%,#2f6bff); -webkit-background-clip:text; background-clip:text; color:transparent; }
.cch-coach-div{ width:1px; height:48px; background:linear-gradient(180deg,transparent,rgba(var(--rgb),.5),transparent); }
.cch-coach-cta{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px; margin-top:26px; }
.cch-coach-cta .cch-btn--gold{ box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 14px 36px -8px rgba(245,197,66,.5); }
.cch-coach-note{ color:#6f7c96; font-size:13px; }
.cch-member-note{ display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:12px; margin-top:50px; color:#a3afc6; font-size:15px; text-align:center; }
.cch-member-note > span{ color:#f5c542; font-size:17px; font-weight:700; }
/* Phones and tablets: every coach reads name -> photo -> details. The text block
   dissolves (display:contents) so its two halves sit either side of the photo. */
@media (max-width:960px){
  .cch-coach{ grid-template-columns:minmax(0,1fr); }
  .cch-coach-text{ display:contents; }
  .cch-coach-head{ order:-1; }
  .cch-coach .cch-portrait,.cch-coach--flip .cch-portrait{ order:0; min-height:0; }
  .cch-coach-body{ order:1; }
  .cch-coach-bio{ margin-top:0; }
}

/* ===== 5. Reviews ===== */
.cch-rev-h2{ max-width:780px; text-wrap:balance; }
.cch-rev-intro{ max-width:620px; }
.cch-stories{ display:flex; flex-direction:column; gap:clamp(90px,10vw,140px); margin-top:80px; }
.cch-story{ position:relative; display:flex; flex-direction:column; align-items:flex-start; text-align:left; --side:clamp(0px,8vw,140px); }
.cch-story--gold{ --c:#f5c542; --rgb:245,197,66; }
.cch-story--blue{ --c:#5bc3f9; --rgb:91,195,249; }
.cch-story--right{ align-items:flex-end; text-align:right; }
.cch-story-glow{ position:absolute; left:-6%; top:-10%; width:min(720px,80%); aspect-ratio:1.6; background:radial-gradient(ellipse at 30% 40%,rgba(var(--rgb),.13),transparent 65%); pointer-events:none; }
.cch-story--right .cch-story-glow{ left:auto; right:-6%; background:radial-gradient(ellipse at 70% 40%,rgba(var(--rgb),.13),transparent 65%); }
.cch-story-fig{ position:relative; font-size:clamp(150px,24vw,320px); font-weight:800; letter-spacing:-.07em; line-height:.8; -webkit-user-select:none; user-select:none; -webkit-background-clip:text; background-clip:text; color:transparent; }
.cch-story--gold .cch-story-fig{ background-image:linear-gradient(90deg,#f7e3a1,#f5c542 45%,#e0975a); }
.cch-story--blue .cch-story-fig{ background-image:linear-gradient(90deg,#8fd6fb,#5bc3f9 50%,#2f6bff); }
.cch-story-fig span{ font-size:.36em; letter-spacing:-.02em; }
.cch-story--word .cch-story-fig{ font-size:clamp(36px,10vw,160px); }
.cch-story-quote{ position:relative; max-width:820px; margin-top:clamp(-70px,calc(-10vw + 60px),0px); margin-left:var(--side); color:#f4f7fc; font-size:clamp(26px,3.2vw,42px); font-weight:600; letter-spacing:-.025em; line-height:1.18; text-wrap:balance; text-shadow:0 0 30px #05080f,0 0 60px #05080f; }
.cch-story--word .cch-story-quote{ margin-top:18px; }
.cch-story-who{ position:relative; display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; margin-top:22px; margin-left:var(--side); }
.cch-story-journey,.cch-journey{ position:relative; width:min(900px,calc(100% - var(--side))); margin-top:44px; margin-left:var(--side); text-align:left; }
.cch-story--right .cch-story-quote,.cch-story--right .cch-story-who,.cch-story--right .cch-journey{ margin-left:0; margin-right:var(--side); }
.cch-story--right .cch-story-who{ justify-content:flex-end; }
.cch-pill{ display:inline-flex; align-items:center; gap:8px; padding:6px 12px 6px 8px; border-radius:99px; background:rgba(var(--rgb),.1); box-shadow:inset 0 0 0 1px rgba(var(--rgb),.35); color:#f4f7fc; font-size:13.5px; font-weight:600; }
.cch-pill-dot{ width:8px; height:8px; border-radius:50%; background:var(--c); box-shadow:0 0 10px var(--c); }
.cch-story-meta{ color:#6f7c96; font-size:13px; }
.cch-journey-line{ position:absolute; left:7px; right:0; top:7px; height:2px; background:linear-gradient(90deg,rgba(160,180,220,.35),rgba(var(--rgb),.9) 55%,rgba(var(--rgb),0)); }
.cch-journey-arrow{ position:absolute; right:0; top:-1px; width:0; height:0; border-left:10px solid rgba(var(--rgb),.5); border-top:9px solid transparent; border-bottom:9px solid transparent; }
.cch-journey-steps{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)); gap:24px 40px; }
.cch-jstep{ position:relative; }
.cch-jdot{ display:block; width:16px; height:16px; border-radius:50%; background:#05080f; border:2px solid rgba(160,180,220,.55); }
.cch-jlabel{ margin-top:16px; color:#6f7c96; font-size:10.5px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
.cch-jstep p{ max-width:320px; margin-top:8px; color:#a3afc6; font-size:14.5px; line-height:1.55; }
.cch-jstep--on .cch-jdot{ background:var(--c); border-color:var(--c); box-shadow:0 0 0 5px rgba(var(--rgb),.15),0 0 18px rgba(var(--rgb),.6); }
.cch-jstep--on .cch-jlabel{ color:var(--c); }
.cch-jstep--on p{ color:#d6deeb; }
.cch-jstep--end{ display:flex; flex-direction:column; align-items:flex-end; text-align:right; }
.cch-jstep--end .cch-jdot{ width:auto; height:16px; background:none; border:0; }
.cch-jstep--end .cch-jlabel{ color:#f4f7fc; }

/* The spotlight rotator, "More from the Discord". */
.cch-spot{ position:relative; display:flex; flex-wrap:wrap; align-items:center; gap:48px clamp(40px,6vw,96px); margin-top:130px; }
.cch-spot-glow{ position:absolute; left:30%; top:50%; width:900px; height:520px; transform:translate(-30%,-50%); background:radial-gradient(ellipse 45% 50% at 55% 50%,rgba(245,197,66,.08),transparent 70%),radial-gradient(ellipse 40% 45% at 80% 60%,rgba(47,107,255,.1),transparent 70%); pointer-events:none; }
.cch-spot-list{ position:relative; display:flex; flex-direction:column; flex:1 1 260px; min-width:0; }
.cch-spot-label{ padding-bottom:14px; color:#6f7c96; font-size:10.5px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; }
.cch-spot-row{ position:relative; display:grid; grid-template-columns:28px minmax(0,1fr) auto; align-items:center; gap:12px; min-height:48px; padding:0 0 0 14px; border:0; border-top:1px solid rgba(160,180,220,.08); background:transparent; text-align:left; cursor:pointer; }
.cch-spot-row.is-on{ background:linear-gradient(90deg,rgba(245,197,66,.08),transparent); }
.cch-spot-row:hover{ background:rgba(160,180,220,.05); }
.cch-spot-bar{ position:absolute; left:0; top:10px; bottom:10px; width:2px; border-radius:2px; background:transparent; }
.cch-spot-num{ color:#6f7c96; font-size:12px; font-weight:700; font-variant-numeric:tabular-nums; }
.cch-spot-name{ overflow:hidden; color:#a3afc6; font-size:15px; font-weight:600; white-space:nowrap; text-overflow:ellipsis; }
.cch-spot-date{ padding-right:4px; color:#6f7c96; font-size:12px; }
.cch-spot-row.is-on .cch-spot-bar{ background:#f5c542; }
.cch-spot-row.is-on .cch-spot-num{ color:#f5c542; }
.cch-spot-row.is-on .cch-spot-name{ color:#f4f7fc; }
.cch-spot-stage{ position:relative; flex:2 1 420px; min-width:0; min-height:340px; display:grid; grid-template-columns:minmax(0,1fr); }
.cch-spot-mark{ height:70px; font-size:160px; font-weight:800; line-height:1; letter-spacing:-.05em; background:linear-gradient(180deg,#f7e3a1,#f5c542 45%,#e0975a); -webkit-background-clip:text; background-clip:text; color:transparent; opacity:.9; }
/* Every quote shares one cell: the stage keeps the longest quote's height, so
   nothing below moves when one replaces another (it jumped up to 166px). Each
   quote is centred in it beside the list, and starts at its top once the
   list sits above it. */
.cch-spot-q{ grid-row:1; grid-column:1; align-self:center; }
.cch-spot-q:not(.is-on){ visibility:hidden; }
@media (max-width:790px){ .cch-spot-q{ align-self:start; } }
.cch-spot-q blockquote{ margin-top:14px; color:#f4f7fc; font-size:clamp(26px,3vw,40px); font-weight:500; line-height:1.25; letter-spacing:-.028em; text-wrap:pretty; }
.cch-spot-q blockquote b{ font-weight:700; background:linear-gradient(90deg,#f7e3a1,#f5c542 40%,#5bc3f9); -webkit-background-clip:text; background-clip:text; color:transparent; }
.cch-spot-q figcaption{ display:flex; align-items:center; flex-wrap:wrap; gap:10px 16px; margin-top:30px; }
.cch-spot-who{ color:#f4f7fc; font-size:15px; font-weight:600; }
.cch-spot-sep{ width:4px; height:4px; border-radius:50%; background:#6f7c96; }
.cch-spot-when{ color:#a3afc6; font-size:14px; }
.cch-spot-src{ margin-left:auto; color:#6f7c96; font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; }
.cch-spot-track{ position:relative; height:1px; margin-top:22px; overflow:hidden; background:rgba(160,180,220,.12); }
.cch-spot-prog{ position:absolute; inset:0; transform:scaleX(0); transform-origin:left; background:linear-gradient(90deg,#f5c542,#5bc3f9); }
.cch-spot-prog.is-run{ animation:cchProg 7s linear forwards; }
.cch-spot.is-paused .cch-spot-prog{ animation-play-state:paused; }
@keyframes cchProg{ from{ transform:scaleX(0); } to{ transform:scaleX(1); } }
.cch .cch-more{ display:inline-flex; align-items:center; gap:8px; min-height:44px; margin-top:10px; color:#5bc3f9; font-size:15px; font-weight:600; }

/* ===== Full-bleed photo sections (the session, what we work on) ===== */
.cch-session,.cch-areas-sec{ isolation:isolate; }
.cch-bleed{ position:absolute; top:0; bottom:0; left:calc(50% - 50vw); z-index:-1; width:100vw; overflow:hidden; pointer-events:none; }
.cch-bleed-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.cch-bleed-shade{ position:absolute; inset:0; }
.cch-session .cch-bleed-img{ object-position:50% 60%; filter:blur(6px) saturate(.75) brightness(.7); transform:scale(1.05); }
.cch-session .cch-bleed-shade{ background:linear-gradient(180deg,#05080f 0%,rgba(5,8,15,.72) 25%,rgba(5,8,15,.78) 75%,#05080f 100%),linear-gradient(90deg,rgba(5,8,15,.7) 0%,rgba(5,8,15,.4) 60%,rgba(5,8,15,.55) 100%),radial-gradient(ellipse 60% 50% at 80% 70%,rgba(47,107,255,.18),transparent 70%); }
.cch-areas-sec .cch-bleed-img{ object-position:50% 65%; filter:blur(10px) saturate(.75) brightness(.65); transform:scale(1.08); }
.cch-areas-sec .cch-bleed-shade{ background:linear-gradient(180deg,#05080f 0%,rgba(5,8,15,.74) 22%,rgba(5,8,15,.8) 78%,#05080f 100%),linear-gradient(90deg,rgba(5,8,15,.6),rgba(5,8,15,.35) 60%,rgba(5,8,15,.55)); }

/* ===== 6. The session ===== */
.cch-session-h2{ max-width:760px; text-wrap:balance; }
.cch-steps-wrap{ position:relative; margin-top:60px; }
.cch-steps-curve{ position:absolute; left:0; top:0; width:100%; height:clamp(0px,calc(100vw - 760px),260px); pointer-events:none; }
.cch-steps{ position:relative; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr)); gap:40px 36px; }
.cch-step{ cursor:default; transition:transform .4s var(--cch-ease); }
.cch-step:nth-child(1){ --c:#5bc3f9; --rgb:91,195,249; }
.cch-step:nth-child(2){ --c:#8fb8f0; --rgb:143,184,240; padding-top:clamp(0px,calc(100vw - 760px),90px); }
.cch-step:nth-child(3){ --c:#d4c08a; --rgb:212,192,138; padding-top:clamp(0px,calc(100vw - 760px),20px); }
.cch-step:nth-child(4){ --c:#f5c542; --rgb:245,197,66; padding-top:clamp(0px,calc(100vw - 760px),120px); }
.cch-step-n{ display:grid; place-items:center; width:44px; height:44px; border-radius:50%; background:#05080f; border:1.5px solid var(--c); color:var(--c); font-size:14px; font-weight:700; box-shadow:0 0 0 6px rgba(var(--rgb),.08); transition:all .35s var(--cch-ease); }
.cch-step h3{ margin-top:18px; color:#fff; font-size:20px; font-weight:600; letter-spacing:-.015em; }
.cch-step p{ margin-top:10px; color:#d6deeb; font-size:15px; line-height:1.6; text-shadow:0 1px 12px rgba(5,8,15,.9); transition:color .3s; }
.cch-step:hover{ transform:translateY(-6px); }
.cch-step:hover .cch-step-n{ background:var(--c); color:#05080f; transform:scale(1.12); box-shadow:0 0 0 8px rgba(var(--rgb),.16),0 0 30px rgba(var(--rgb),.6); }
.cch-step:hover p{ color:#f4f7fc; }

/* ===== 7. Videos ===== */
.cch-vids{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr)); gap:40px 64px; align-items:start; margin-top:56px; }
.cch-vfeat{ position:relative; }
.cch-vthumb{ position:relative; aspect-ratio:16/10; }
.cch-vimg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; -webkit-mask:radial-gradient(ellipse 70% 72% at 50% 50%,#000 45%,transparent 100%); mask:radial-gradient(ellipse 70% 72% at 50% 50%,#000 45%,transparent 100%); }
.cch-vplay{ position:absolute; left:50%; top:50%; display:grid; place-items:center; width:84px; height:84px; border-radius:50%; transform:translate(-50%,-50%); background:linear-gradient(180deg,#f7d97a,#f5c542 55%,#d9a52a); box-shadow:0 0 0 10px rgba(245,197,66,.14),0 20px 50px -10px rgba(245,197,66,.6); transition:box-shadow .35s; }
.cch-vplay:hover{ box-shadow:0 0 0 16px rgba(245,197,66,.16),0 20px 50px -10px rgba(245,197,66,.7); }
.cch-vplay-tri{ width:0; height:0; margin-left:6px; border-left:22px solid #1a1204; border-top:14px solid transparent; border-bottom:14px solid transparent; }
.cch-vlen{ position:absolute; right:8%; bottom:10%; color:#f4f7fc; font-size:13px; font-weight:600; font-variant-numeric:tabular-nums; }
.cch-vthumb iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; border-radius:12px; background:#000; }
.cch-vthumb.is-playing .cch-vimg,.cch-vthumb.is-playing .cch-vplay,.cch-vthumb.is-playing .cch-vlen{ display:none; }
.cch-vtag{ margin-top:6px; color:#5bc3f9; font-size:11px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
.cch-vtag:empty::before{ content:"\00a0"; }
.cch-vtitle{ margin-top:10px; color:#f4f7fc; font-size:clamp(24px,2.6vw,32px); font-weight:700; letter-spacing:-.03em; line-height:1.1; }
.cch-vlist{ display:flex; flex-direction:column; }
.cch-vlist-label{ padding-bottom:12px; }
.cch-vitem{ display:grid; grid-template-columns:52px minmax(0,1fr) auto; align-items:center; gap:18px; padding:22px 0; border:0; border-top:1px solid rgba(160,180,220,.12); background:none; text-align:left; cursor:pointer; transition:padding-left .3s var(--cch-ease); }
.cch-vitem:hover{ padding-left:8px; }
.cch-vnum{ color:#6f7c96; font-size:13px; font-weight:700; }
.cch-vitem-title{ display:block; color:#a3afc6; font-size:17px; font-weight:600; letter-spacing:-.01em; line-height:1.3; }
.cch-vitem-tag{ display:block; margin-top:4px; color:#6f7c96; font-size:13px; }
.cch-vitem-len{ color:#a3afc6; font-size:13px; font-variant-numeric:tabular-nums; }
.cch-vitem.is-on .cch-vnum{ color:#f5c542; }
.cch-vitem.is-on .cch-vitem-title{ color:#f4f7fc; }

/* ===== 8. What we work on ===== */
.cch-areas-orb{ position:absolute; right:-10%; top:20%; width:640px; height:640px; border-radius:50%; background:radial-gradient(circle,rgba(47,107,255,.12),transparent 65%); pointer-events:none; }
.cch-areas{ position:relative; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); gap:56px; margin-top:64px; }
.cch-area{ position:relative; margin:0 -22px; padding:20px 22px 24px; cursor:default; transition:transform .4s var(--cch-ease); }
.cch-area:nth-child(3n+2){ margin-top:clamp(0px,calc(100vw - 760px),40px); }
.cch-area:nth-child(3n){ margin-top:clamp(0px,calc(100vw - 760px),80px); }
.cch-area:nth-child(odd){ --rgb:245,197,66; --stroke-on:rgba(247,227,161,.9); --fill:linear-gradient(180deg,#f7e3a1,#f5c542 50%,#e0975a); }
.cch-area:nth-child(even){ --rgb:91,195,249; --stroke-on:rgba(143,214,251,.9); --fill:linear-gradient(180deg,#8fd6fb,#5bc3f9 50%,#2f6bff); }
/* background-image only, never the `background` shorthand: the shorthand resets
   background-clip and paints a coloured box (handoff note). */
.cch-area-n{ width:max-content; color:transparent; font-size:64px; font-weight:800; letter-spacing:-.05em; line-height:.9; -webkit-text-stroke:1px rgba(var(--rgb),.55); background-image:none; -webkit-background-clip:text; background-clip:text; transition:filter .4s; }
.cch-area-tick{ width:28px; height:2px; margin-top:16px; border-radius:2px; background:linear-gradient(90deg,rgba(var(--rgb),.9),rgba(var(--rgb),0)); transition:width .5s var(--cch-ease); }
.cch-area h3{ margin-top:14px; color:#f4f7fc; font-size:20px; font-weight:600; letter-spacing:-.015em; }
.cch-area p{ margin-top:10px; color:#d6deeb; font-size:15px; line-height:1.6; text-shadow:0 1px 12px rgba(5,8,15,.9); transition:color .3s; }
.cch-area:hover{ transform:translateY(-6px); }
.cch-area:hover .cch-area-n{ -webkit-text-stroke-color:var(--stroke-on); background-image:var(--fill); filter:drop-shadow(0 8px 24px rgba(var(--rgb),.45)); }
.cch-area:hover .cch-area-tick{ width:100%; }
.cch-area:hover p{ color:#f4f7fc; }
.cch-areas-close{ margin-top:70px; color:#d6deeb; font-size:clamp(18px,1.8vw,22px); line-height:1.5; letter-spacing:-.01em; text-align:center; text-wrap:balance; }

/* ===== 9. Pricing ===== */
.cch-prices{ margin-top:50px; }
.cch-prow{ position:relative; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)); gap:20px 40px; align-items:center; margin:0 -20px; padding:32px 20px; border-top:1px solid; transition:background .45s; }
.cch-prow--gold{ --c:#f5c542; --rgb:245,197,66; --btn-rgb:245,197,66; border-image:linear-gradient(90deg,rgba(245,197,66,.55),rgba(160,180,220,.08)) 1; }
.cch-prow--blue{ --c:#5bc3f9; --rgb:91,195,249; --btn-rgb:47,107,255; border-image:linear-gradient(90deg,rgba(91,195,249,.55),rgba(160,180,220,.08)) 1; }
.cch-prow:last-of-type{ border-bottom:1px solid; }
.cch-prow-who{ display:flex; align-items:center; gap:16px; }
.cch-ava{ flex:none; width:56px; height:56px; border-radius:50%; object-fit:cover; object-position:50% 15%; transition:transform .4s var(--cch-ease),box-shadow .4s; }
.cch-prow--gold .cch-ava{ background:radial-gradient(circle,rgba(245,197,66,.35),rgba(245,197,66,.05)); }
.cch-prow--blue .cch-ava{ background:radial-gradient(circle,rgba(47,107,255,.4),rgba(47,107,255,.05)); }
.cch-prow .cch-ava{ box-shadow:0 0 0 2px #05080f,0 0 0 3px rgba(var(--rgb),.6); }
.cch-prow-name{ color:#f4f7fc; font-size:22px; font-weight:600; letter-spacing:-.02em; }
.cch-prow-prices{ display:flex; flex-wrap:wrap; gap:36px; }
.cch-prow-label{ color:#6f7c96; font-size:12.5px; }
.cch-prow-amt{ margin-top:4px; color:#f4f7fc; font-size:36px; font-weight:600; letter-spacing:-.04em; transform-origin:left bottom; transition:transform .45s var(--cch-ease); }
.cch-prow--gold .cch-prow-price--accent .cch-prow-amt{ background:linear-gradient(90deg,#f7e3a1,#f5c542 50%,#e0975a); -webkit-background-clip:text; background-clip:text; color:transparent; }
.cch-prow--blue .cch-prow-price--accent .cch-prow-amt{ background:linear-gradient(90deg,#8fd6fb,#5bc3f9 50%,#2f6bff); -webkit-background-clip:text; background-clip:text; color:transparent; }
.cch-prow-cta{ justify-self:end; }
.cch-btn--row{ min-height:48px; padding:0 24px; font-size:14.5px; box-shadow:none; }
.cch-prow:hover{ background:linear-gradient(90deg,rgba(var(--rgb),.1),rgba(var(--rgb),.02) 60%,transparent); }
.cch-prow:hover .cch-ava{ transform:scale(1.1); box-shadow:0 0 0 2px #05080f,0 0 0 3px var(--c),0 0 0 8px rgba(var(--rgb),.14),0 10px 30px -4px rgba(var(--rgb),.7); }
.cch-prow:hover .cch-prow-amt{ transform:scale(1.08); }
.cch-prow:hover .cch-btn--row{ transform:translateY(-2px); box-shadow:0 14px 34px -6px rgba(var(--btn-rgb),.65); }
.cch-prices-note{ margin-top:14px; color:#6f7c96; font-size:13.5px; }

/* ===== 10. Coaching vs membership ===== */
.cch-compare{ max-width:1100px; }
.cch-cmp-intro{ max-width:600px; }
.cch-cmp{ position:relative; display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:0 clamp(16px,3vw,40px); margin-top:56px; }
.cch-cmp-head{ padding-bottom:20px; font-size:24px; font-weight:700; letter-spacing:-.02em; transition:opacity .35s,text-shadow .35s; }
@media (max-width:359px){ .cch-cmp-head{ font-size:20px; } } /* below 360 "membership" outgrows its column */
.cch-cmp-head.cch-cmp-l{ color:#f5c542; text-align:right; }
.cch-cmp-head.cch-cmp-r{ color:#5bc3f9; }
.cch-cmp-line{ grid-row:span 8; width:1px; background:linear-gradient(180deg,#f5c542,rgba(160,180,220,.2) 50%,#5bc3f9); transition:box-shadow .4s; }
.cch-cmp-cell{ transition:opacity .35s,background .35s; }
.cch-cmp-cell.cch-cmp-l{ margin-left:-18px; padding:14px 18px 14px 0; border-radius:12px 0 0 12px; text-align:right; }
.cch-cmp-cell.cch-cmp-r{ margin-right:-18px; padding:14px 0 14px 18px; border-radius:0 12px 12px 0; }
.cch-cmp-k{ color:#6f7c96; font-size:10.5px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; }
.cch-cmp-v{ margin-top:6px; color:#f4f7fc; font-size:15.5px; line-height:1.45; }
.cch-cmp-btn{ padding-top:22px; transition:opacity .35s; }
.cch-cmp-btn.cch-cmp-l{ text-align:right; }
.cch-cmp:has(.cch-cmp-l:hover) .cch-cmp-r,.cch-cmp:has(.cch-cmp-r:hover) .cch-cmp-l{ opacity:.35; }
.cch-cmp:has(.cch-cmp-l:hover) .cch-cmp-cell.cch-cmp-l{ background:linear-gradient(270deg,rgba(245,197,66,.09),transparent 80%); }
.cch-cmp:has(.cch-cmp-r:hover) .cch-cmp-cell.cch-cmp-r{ background:linear-gradient(90deg,rgba(91,195,249,.09),transparent 80%); }
.cch-cmp:has(.cch-cmp-l:hover) .cch-cmp-head.cch-cmp-l{ text-shadow:0 0 24px rgba(245,197,66,.55); }
.cch-cmp:has(.cch-cmp-r:hover) .cch-cmp-head.cch-cmp-r{ text-shadow:0 0 24px rgba(91,195,249,.55); }
.cch-cmp:has(.cch-cmp-l:hover) .cch-cmp-line{ background:linear-gradient(180deg,#f5c542,#f5c542 60%,rgba(245,197,66,.2)); box-shadow:0 0 14px rgba(245,197,66,.6); }
.cch-cmp:has(.cch-cmp-r:hover) .cch-cmp-line{ background:linear-gradient(180deg,#5bc3f9,#5bc3f9 60%,rgba(91,195,249,.2)); box-shadow:0 0 14px rgba(91,195,249,.6); }
.cch .lof-vat-note[hidden]{ display:none; }

/* ===== 11. FAQ ===== */
.cch-faq-sec{ max-width:900px; }
.cch-faq-h2{ font-size:clamp(30px,4vw,46px); line-height:1.06; }
.cch-faq{ margin-top:40px; border-bottom:1px solid rgba(160,180,220,.12); }
.cch-faq-item{ border-top:1px solid rgba(160,180,220,.12); }
.cch-faq-item summary{ display:flex; align-items:center; gap:20px; min-height:64px; padding:16px 0; color:#d6deeb; font-size:17px; font-weight:600; letter-spacing:-.01em; list-style:none; cursor:pointer; transition:color .2s; }
.cch-faq-item summary::-webkit-details-marker{ display:none; }
.cch-faq-item summary:hover{ color:#fff; }
.cch-faq-item[open] summary{ color:#f4f7fc; }
.cch-faq-q{ flex:1; font:inherit; color:inherit; letter-spacing:inherit; }
.cch-faq-sign{ flex:none; color:#5bc3f9; font-size:22px; font-weight:400; line-height:1; }
.cch-faq-sign::before{ content:"+"; }
.cch-faq-item[open] .cch-faq-sign{ color:#f5c542; }
.cch-faq-item[open] .cch-faq-sign::before{ content:"\2212"; }
.cch-faq-a{ display:flex; flex-direction:column; gap:12px; max-width:720px; padding:0 0 24px; }
.cch-faq-a p{ color:#a3afc6; font-size:15.5px; line-height:1.65; text-wrap:pretty; }

/* ===== 12. Final CTA ===== */
.cch-final{ position:relative; overflow:hidden; padding:clamp(110px,13vw,180px) clamp(20px,4vw,48px) clamp(90px,10vw,140px); text-align:center; }
.cch-final-glow{ position:absolute; left:50%; top:50%; width:1100px; height:600px; transform:translate(-50%,-50%); background:radial-gradient(ellipse 35% 50% at 32% 50%,rgba(245,197,66,.14),transparent 70%),radial-gradient(ellipse 35% 50% at 68% 50%,rgba(47,107,255,.2),transparent 70%); pointer-events:none; }
.cch-final-h2{ position:relative; color:#f4f7fc; font-size:clamp(44px,7vw,96px); font-weight:700; letter-spacing:-.045em; line-height:.95; text-wrap:balance; }
.cch-final-h2 span{ background:linear-gradient(90deg,#f5c542,#e0975a 40%,#5bc3f9 70%,#2f6bff); -webkit-background-clip:text; background-clip:text; color:transparent; }
.cch-final-sub{ position:relative; max-width:560px; margin:22px auto 0; color:#a3afc6; font-size:17px; line-height:1.6; }
.cch-final-links{ position:relative; display:flex; justify-content:center; flex-wrap:wrap; gap:20px 56px; margin-top:48px; }
.cch .cch-final-link{ display:flex; align-items:center; gap:16px; color:#f4f7fc; text-align:left; transition:transform .4s var(--cch-ease); }
.cch-final-link--gold{ --c:#f5c542; --rgb:245,197,66; --glow:245,197,66; }
.cch-final-link--blue{ --c:#5bc3f9; --rgb:91,195,249; --glow:47,107,255; }
.cch-ava--lg{ width:72px; height:72px; box-shadow:0 0 0 2px #05080f,0 0 0 3px var(--c),0 12px 34px -6px rgba(var(--glow),.5); }
.cch-final-link--gold .cch-ava--lg{ background:radial-gradient(circle,rgba(245,197,66,.4),rgba(245,197,66,.05)); }
.cch-final-link--blue .cch-ava--lg{ background:radial-gradient(circle,rgba(47,107,255,.45),rgba(47,107,255,.05)); box-shadow:0 0 0 2px #05080f,0 0 0 3px var(--c),0 12px 34px -6px rgba(47,107,255,.55); }
.cch-final-name{ display:block; font-size:18px; font-weight:600; letter-spacing:-.01em; }
.cch-final-price{ display:block; margin-top:3px; color:var(--c); font-size:14px; font-weight:600; letter-spacing:0; transition:letter-spacing .4s; }
.cch .cch-final-link:hover{ color:var(--c); transform:translateY(-4px); }
.cch-final-link:hover .cch-ava--lg{ transform:scale(1.08); box-shadow:0 0 0 2px #05080f,0 0 0 3px var(--c),0 0 0 10px rgba(var(--rgb),.14),0 16px 44px -4px rgba(var(--glow),.75); }
.cch-final-link--blue:hover .cch-ava--lg{ box-shadow:0 0 0 2px #05080f,0 0 0 3px var(--c),0 0 0 10px rgba(91,195,249,.14),0 16px 44px -4px rgba(47,107,255,.8); }
.cch-final-link:hover .cch-final-price{ letter-spacing:.04em; }

/* ===== Reduced motion: no progress bar, no pulse, no lifts or scales ===== */
@media (prefers-reduced-motion:reduce){
  .cch *,.cch *::before,.cch *::after{ transition:none !important; }
  .cch-live-dot,.cch-spot-prog.is-run{ animation:none; }
  .cch-spot-prog{ transform:scaleX(0); }
  .cch-stat:hover,.cch-step:hover,.cch-area:hover,.cch .cch-final-link:hover,.cch-btn--gold:hover,.cch-btn--blue:hover,.cch-prow:hover .cch-btn--row{ transform:none; }
  .cch-stat:hover .cch-stat-n,.cch-step:hover .cch-step-n,.cch-prow:hover .cch-ava,.cch-prow:hover .cch-prow-amt,.cch-final-link:hover .cch-ava--lg,.cch-portrait:hover .cch-portrait-glow,.cch-portrait:hover .cch-portrait-img{ transform:none; }
  .cch-portrait:hover .cch-portrait-ring,.cch-portrait:hover .cch-portrait-dash{ scale:none; rotate:none; }
  .cch-break:hover .cch-break-dot{ transform:translate(-50%,-50%); }
  .cch-break:hover .cch-break-what,.cch-break:hover .cch-break-how{ transform:none; }
}
