/* ==========================================================================
   ATHYLEON — DESIGN SYSTEM v2
   "Controlled performance energy." Black is the environment. Green creates
   impact and state change. Paper provides relief. Fixed brand colours below.
   ========================================================================== */
:root{
  --acid: #C7FF00;
  --acid-soft: #EFFFBD;
  --deep-teal: #1D4E57;
  --ink: #111613;
  --ink-soft: #3D4741;
  --paper: #F7F8F3;
  --paper-deep: #EDF1EC;
  --mist: #E8F0ED;
  --stone: #AAB4AD;

  --serif: "Inter", "Segoe UI", -apple-system, "Helvetica Neue", Arial, sans-serif;
  --sans: "Inter", "Segoe UI", -apple-system, "Helvetica Neue", Arial, sans-serif;

  --max: 1440px;
  --content: 1240px;
  --gutter: clamp(20px, 5vw, 64px);

  --ease: cubic-bezier(.4,0,.2,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --dur: 600ms;
}

*,*::before,*::after{ box-sizing:border-box; }
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

h1,h2,h3{ font-family:var(--serif); margin:0; font-weight:600; }
p{ margin:0; }
a{ color:inherit; text-decoration:none; }
img{ display:block; max-width:100%; }
button{ font-family:inherit; }

::selection{ background:var(--acid); color:var(--ink); }
:focus-visible{ outline:2px solid var(--acid); outline-offset:3px; }

.container{ max-width:var(--content); margin:0 auto; padding:0 var(--gutter); width:100%; }
.container-wide{ max-width:var(--max); margin:0 auto; padding:0 var(--gutter); width:100%; }
.section{ padding:clamp(88px,10vw,150px) 0; }
.rule{ border-top:1px solid rgba(17,22,19,.14); }
.ch-black.rule{ border-top-color:rgba(247,248,243,.14); }

.ch-black{ background:var(--ink); color:var(--paper); }
.ch-black .eyebrow{ color:var(--stone); }
.ch-black .lede{ color:rgba(247,248,243,.72); }
.ch-green{ background:var(--acid); color:var(--ink); }
.ch-paper{ background:var(--paper); color:var(--ink); }
.ch-paper-deep{ background:var(--paper-deep); color:var(--ink); }

/* TYPE SYSTEM */
.eyebrow{
  display:flex; align-items:center; gap:10px;
  font-size:12.5px; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink-soft); margin:0 0 22px;
}
.eyebrow::before{ content:""; width:18px; height:2px; background:var(--acid); }

.h-hero{ font-size:clamp(40px, 5.8vw, 78px); line-height:1.04; letter-spacing:-.015em; font-weight:600; }
.h-display{ font-size:clamp(38px, 6vw, 76px); line-height:1.04; letter-spacing:-.015em; font-weight:600; }
.h-section{ font-size:clamp(30px, 3.8vw, 48px); line-height:1.1; letter-spacing:-.01em; font-weight:600; }
.h-mega{ font-size:clamp(46px, 9vw, 128px); line-height:0.98; letter-spacing:-.02em; font-weight:600; text-transform:uppercase; }
.accent{ color:var(--acid); }
.ch-green .accent{ color:var(--ink); }

.lede{ font-size:clamp(17px, 1.5vw, 19px); color:var(--ink-soft); max-width:52ch; line-height:1.65; }
.lede.center{ margin-inline:auto; text-align:center; }

.mask-line{ overflow:hidden; display:block; padding-bottom:0.18em; margin-bottom:-0.18em; }
.mask-line > span{ display:inline-block; will-change:transform; transform:translateY(105%); transition:transform 820ms var(--ease-out); }
.mask-line.is-in > span{ transform:translateY(0); }

/* HEADER */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between;
  padding:22px var(--gutter); color:var(--paper);
  transition:background-color .4s var(--ease), padding .4s var(--ease), color .4s var(--ease);
}
.site-header.is-solid{ background:rgba(17,22,19,.92); backdrop-filter:blur(8px); padding-top:16px; padding-bottom:16px; }
.site-header.on-light{ color:var(--ink); }
.site-header.on-light.is-solid{ background:rgba(247,248,243,.92); }

.wordmark{ display:flex; align-items:baseline; gap:8px; font-family:var(--serif); font-weight:600; font-size:19px; letter-spacing:.01em; }
.wordmark .accelerated{ font-family:var(--sans); font-weight:600; font-size:10px; letter-spacing:.14em; text-transform:uppercase; opacity:.6; }

.primary-nav{ display:flex; gap:34px; }
.primary-nav a{ position:relative; font-size:14px; font-weight:500; padding-bottom:4px; white-space:nowrap; }
.primary-nav a::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--acid); transform:scaleX(0); transform-origin:left; transition:transform .25s var(--ease-out); }
.primary-nav a:hover::after{ transform:scaleX(1); }

.header-actions{ display:flex; align-items:center; gap:16px; }
.menu-toggle{ display:none; background:none; border:0; cursor:pointer; font-size:14px; font-weight:600; letter-spacing:.04em; color:inherit; }

.nav-login{ font-size:14px; font-weight:500; opacity:.72; transition:opacity .2s var(--ease); white-space:nowrap; cursor:pointer; }
.nav-login:hover{ opacity:1; }
.header-actions .nav-login:first-of-type{ padding-left:14px; border-left:1px solid rgba(247,248,243,.2); }
.site-header.on-light .header-actions .nav-login:first-of-type{ border-left-color:rgba(17,22,19,.2); }

@media (max-width: 980px){
  .primary-nav{ display:none; }
  .header-actions .btn{ display:none; }
  .header-actions .nav-login{ display:none; }
  .menu-toggle{ display:inline-flex; }
}

.mobile-nav{
  position:fixed; inset:0; z-index:200; background:var(--ink); color:var(--paper);
  display:flex; flex-direction:column; justify-content:flex-start; padding:96px var(--gutter) 32px;
  overflow-y:auto; -webkit-overflow-scrolling:touch;
  transform:translateY(-100%); transition:transform .5s var(--ease-out);
}
.mobile-nav.is-open{ transform:translateY(0); }
.mobile-nav-close{ position:fixed; top:22px; right:var(--gutter); background:none; border:0; color:var(--paper); font-size:14px; font-weight:600; cursor:pointer; }
.mobile-nav-links{ display:flex; flex-direction:column; gap:22px; }
.mobile-nav-links a{ font-family:var(--serif); font-size:clamp(32px,9vw,48px); font-weight:600; text-transform:uppercase; }
.mobile-nav-cta{ margin-top:40px; }
.mobile-nav-cta ~ .mobile-nav-cta{ margin-top:14px; }
.mobile-nav-login{ display:block; margin-top:22px; text-align:center; font-size:14px; }

/* BUTTONS + LINKS */
.btn{
  position:relative; overflow:hidden;
  display:inline-flex; align-items:center; gap:10px;
  padding:15px 26px; font-size:14px; font-weight:600; letter-spacing:.01em;
  border:1px solid transparent; isolation:isolate;
}
.btn-primary{ background:var(--acid); color:var(--ink); }
.btn-primary::before{ content:""; position:absolute; inset:0; background:var(--ink); transform:scaleX(0); transform-origin:left; transition:transform .25s var(--ease); z-index:-1; }
.btn-primary span, .btn-primary svg{ position:relative; transition:color .25s var(--ease), stroke .25s var(--ease); }
.btn-primary:hover::before{ transform:scaleX(1); }
.btn-primary:hover{ color:var(--acid); }
.btn-primary:hover svg{ stroke:var(--acid); }

.btn-ghost{ border-color:rgba(247,248,243,.32); color:inherit; }
.ch-paper .btn-ghost, .ch-paper-deep .btn-ghost{ border-color:rgba(17,22,19,.24); }
.btn-ghost:hover{ border-color:var(--acid); }

.btn svg{ width:14px; height:14px; transition:transform .2s var(--ease); }
.btn:hover svg{ transform:translate(4px,-4px); }

.text-link{
  display:inline-flex; align-items:center; gap:6px; font-size:14px; font-weight:600;
  background-image:linear-gradient(currentColor,currentColor);
  background-position:0 100%; background-repeat:no-repeat; background-size:0% 1px;
  transition:background-size .3s var(--ease-out); padding-bottom:2px;
}
.text-link:hover{ background-size:100% 1px; }
.text-link svg{ width:12px; height:12px; transition:transform .2s var(--ease); }
.text-link:hover svg{ transform:translate(3px,-3px); }

/* REVEAL SYSTEM */
[data-reveal]{ opacity:0; transform:translateY(22px); transition:opacity var(--dur) var(--ease-out), transform var(--dur) var(--ease-out); }
[data-reveal].is-in{ opacity:1; transform:translateY(0); }
.eyebrow[data-reveal]::before{ transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease-out) .1s; }
.eyebrow[data-reveal].is-in::before{ transform:scaleX(1); }

/* HERO */
.hero{ min-height:100vh; display:flex; align-items:flex-end; position:relative; padding-top:140px; padding-bottom:clamp(56px,7vw,96px); }
.hero-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(32px,5vw,72px); align-items:end; width:100%; }
.hero-copy{ max-width:660px; }
.hero-copy .lede{ margin-top:26px; }
.hero-statement{ margin-top:40px; font-family:var(--serif); font-size:22px; line-height:1.3; font-weight:600; color:var(--acid); border-left:2px solid var(--acid); padding-left:18px; }
.hero-actions{ display:flex; gap:16px; flex-wrap:wrap; margin-top:44px; }

.hero-visual{ position:relative; aspect-ratio:4/5; overflow:hidden; background:#0b0e0c; border:1px solid rgba(247,248,243,.1); }
.hero-visual .hv-frame{
  position:absolute; inset:0;
  background:
    linear-gradient(160deg, rgba(199,255,0,.14), transparent 55%),
    repeating-linear-gradient(115deg, rgba(247,248,243,.05) 0 1px, transparent 1px 34px);
}
.hero-visual .hv-label{ position:absolute; bottom:24px; left:24px; right:24px; display:flex; justify-content:space-between; align-items:flex-end; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:rgba(247,248,243,.55); }
.hero-visual .hv-label strong{ color:var(--acid); font-weight:600; }

.scroll-cue{ position:absolute; left:var(--gutter); bottom:28px; display:flex; align-items:center; gap:12px; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:rgba(247,248,243,.6); }
.scroll-cue .rule{ width:1px; height:34px; background:rgba(247,248,243,.25); position:relative; overflow:hidden; }
.scroll-cue .rule::after{ content:""; position:absolute; top:-100%; left:0; width:100%; height:100%; background:var(--acid); animation:scrollcue 2.2s var(--ease) infinite; }
@keyframes scrollcue{ 0%{ transform:translateY(0);} 60%,100%{ transform:translateY(200%);} }

@media (max-width: 900px){
  .hero{ min-height:auto; align-items:flex-start; padding-top:120px; }
  .hero-grid{ grid-template-columns:1fr; }
  .hero-visual{ aspect-ratio:4/3; order:-1; }
  .scroll-cue{ display:none; }
}

/* BIG STATEMENT / CHAPTER BRIDGE */
.statement{ min-height:70vh; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:80px var(--gutter); }
.statement .h-mega{ max-width:20ch; }
.statement .h-mega .accent{ display:block; }

.problem-scale{ display:inline-block; transition:letter-spacing .9s var(--ease-out); }
.problem-scale.is-in{ letter-spacing:.01em; }

.problem-symptoms{ margin-top:80px; display:flex; flex-direction:column; }
.symptom{ font-family:var(--serif); font-weight:600; font-size:clamp(22px,3vw,34px); padding:26px 0; border-top:1px solid rgba(247,248,243,.14); max-width:24ch; }
.problem-symptoms .symptom:last-child{ border-bottom:1px solid rgba(247,248,243,.14); }
.symptom:nth-child(2), .symptom:nth-child(4){ margin-left:auto; text-align:right; }

/* CIRCLE */
.circle-grid{ margin-top:64px; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(17,22,19,.14); }
.circle-part{ padding:44px 30px 44px 0; border-right:1px solid rgba(17,22,19,.14); position:relative; transition:padding-left .35s var(--ease-out); }
.circle-part:last-child{ border-right:none; }
.circle-part::before{ content:""; position:absolute; top:0; left:0; width:2px; height:0; background:var(--acid); transition:height .35s var(--ease-out); }
.circle-part:hover::before{ height:100%; }
.circle-part:hover{ padding-left:20px; }
.circle-part h3{ font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:var(--deep-teal); margin-bottom:20px; }
.circle-part .claim{ font-family:var(--serif); font-size:clamp(22px,2.4vw,28px); font-weight:600; margin-bottom:14px; line-height:1.28; }
.circle-part p.support{ color:var(--ink-soft); font-size:15px; max-width:32ch; }

@media (max-width: 820px){
  .circle-grid{ grid-template-columns:1fr; }
  .circle-part{ border-right:none; border-bottom:1px solid rgba(17,22,19,.14); padding:32px 0 !important; }
}

/* PINNED PROCESS */
.pinned-process{ position:relative; }
.pinned-process-inner{ display:grid; grid-template-columns:1fr 1fr; gap:60px; }
.pin-frame{ position:sticky; top:120px; align-self:start; height:min(56vh, 480px); border:1px solid rgba(247,248,243,.14); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.pin-frame-index{ font-family:var(--serif); font-weight:600; color:var(--acid); font-size:clamp(80px,11vw,160px); line-height:1; transition:opacity .4s var(--ease); }

.process-steps-pin{ display:flex; flex-direction:column; }
.pstep{ min-height:42vh; display:flex; flex-direction:column; justify-content:center; border-top:1px solid rgba(247,248,243,.14); padding:32px 0; opacity:.32; transition:opacity .4s var(--ease); }
.pstep:last-child{ border-bottom:1px solid rgba(247,248,243,.14); }

/* compact standards (replaces the old 4-screen sequence) */
.standards-compact{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:rgba(247,248,243,.14); border-top:1px solid rgba(247,248,243,.14); border-bottom:1px solid rgba(247,248,243,.14); }
.standard-row{ background:var(--ink); padding:36px; }
.standard-row h3{ font-family:var(--serif); font-size:clamp(19px,2.2vw,23px); font-weight:600; margin-bottom:12px; line-height:1.3; }
.standard-row p{ color:rgba(247,248,243,.65); font-size:14.5px; max-width:32ch; }
@media (max-width: 700px){ .standards-compact{ grid-template-columns:1fr; } }
.pstep.is-active{ opacity:1; }
.pstep .process-index{ font-size:13px; font-weight:600; color:var(--acid); letter-spacing:.08em; }
.pstep h4{ font-family:var(--serif); font-size:clamp(26px,3vw,36px); font-weight:600; margin:14px 0 16px; }
.pstep p{ font-size:16px; color:rgba(247,248,243,.7); max-width:44ch; line-height:1.6; }

@media (max-width: 900px){
  .pinned-process-inner{ grid-template-columns:1fr; }
  .pin-frame{ position:relative; top:auto; height:220px; margin-bottom:24px; }
}

/* CHAMPIONS */
.champions-band{ padding:120px 0 40px; }
.champions-lede{ max-width:640px; margin-top:24px; }
.principles-scroll{ margin-top:72px; display:flex; gap:1px; background:rgba(247,248,243,.14); overflow-x:auto; scroll-snap-type:x mandatory; border-top:1px solid rgba(247,248,243,.14); border-bottom:1px solid rgba(247,248,243,.14); }
.principles-scroll::-webkit-scrollbar{ display:none; }
.principle-panel{ scroll-snap-align:start; min-width:min(78vw, 360px); background:var(--ink); padding:44px 32px; flex:1; }
.principle-panel .pi{ font-size:12px; color:var(--acid); font-weight:600; letter-spacing:.08em; margin-bottom:60px; }
.principle-panel h4{ font-family:var(--serif); font-size:26px; font-weight:600; margin-bottom:14px; text-transform:uppercase; }
.principle-panel p{ color:rgba(247,248,243,.68); font-size:15px; max-width:30ch; }

/* TAB COMPONENT (replaces some multi-item grids to reduce on-screen density) */
.tab-block{ margin-top:56px; }
.tab-nav{ display:flex; flex-wrap:wrap; gap:0; border-bottom:1px solid rgba(17,22,19,.14); }
.ch-black .tab-nav{ border-bottom-color:rgba(247,248,243,.14); }
.tab-btn{
  background:none; border:0; cursor:pointer; text-align:left;
  padding:14px 22px 14px 0; margin-right:28px;
  font-family:var(--sans); font-size:13px; font-weight:600; letter-spacing:.04em; text-transform:uppercase;
  color:var(--ink-soft); position:relative;
}
.ch-black .tab-btn{ color:rgba(247,248,243,.55); }
.tab-btn::after{
  content:""; position:absolute; left:0; right:22px; bottom:-1px; height:2px;
  background:var(--acid); transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease-out);
}
.tab-btn.is-active{ color:var(--ink); }
.ch-black .tab-btn.is-active{ color:var(--paper); }
.tab-btn.is-active::after{ transform:scaleX(1); }
.tab-btn:hover{ color:var(--ink); }
.ch-black .tab-btn:hover{ color:var(--paper); }

.tab-panels{ position:relative; padding-top:40px; }
.tab-panel{ display:none; }
.tab-panel.is-active{ display:block; animation:tabfade .35s var(--ease-out); }
@keyframes tabfade{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:translateY(0); } }
.tab-panel .q{ font-family:var(--serif); font-size:clamp(20px,2.4vw,26px); font-weight:600; margin-bottom:14px; line-height:1.3; }
.tab-panel p{ color:var(--ink-soft); max-width:52ch; font-size:16px; line-height:1.65; }
.ch-black .tab-panel p{ color:rgba(247,248,243,.72); }
.tab-panel ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.tab-panel li{ font-size:16px; color:var(--ink-soft); }
.ch-black .tab-panel li{ color:rgba(247,248,243,.72); }

/* CHAPTER INDEX (homepage) */
.index-grid{ margin-top:56px; display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid rgba(17,22,19,.14); border-left:1px solid rgba(17,22,19,.14); }
.index-card{ padding:34px 26px; border-right:1px solid rgba(17,22,19,.14); border-bottom:1px solid rgba(17,22,19,.14); display:flex; flex-direction:column; min-height:220px; transition:background-color .25s var(--ease); }
.index-card:hover{ background:var(--paper-deep); }
.index-no{ font-family:var(--serif); font-weight:600; color:var(--acid-soft); background:var(--ink); display:inline-flex; padding:2px 8px; font-size:12px; width:fit-content; margin-bottom:20px; }
.index-card h3{ font-size:19px; font-weight:600; margin-bottom:10px; }
.index-card p{ font-size:14px; color:var(--ink-soft); flex:1; }
.index-link{ display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:600; margin-top:18px; color:var(--deep-teal); }
.index-link svg{ width:12px; height:12px; transition:transform .2s var(--ease); }
.index-card:hover .index-link svg{ transform:translate(3px,-3px); }

@media (max-width: 900px){ .index-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width: 560px){ .index-grid{ grid-template-columns:1fr; } }
.process{ margin-top:56px; }
.process-line{ position:relative; height:1px; background:rgba(17,22,19,.14); }
.ch-black .process-line{ background:rgba(247,248,243,.14); }
.process-line-fill{ position:absolute; left:0; top:0; height:1px; width:0%; background:var(--acid); transition:width 1s var(--ease); }
.process-steps{ display:grid; grid-template-columns:repeat(5,1fr); gap:28px; margin-top:36px; }
.process-step{ padding-top:22px; position:relative; }
.process-step::before{ content:""; position:absolute; top:-4px; left:0; width:9px; height:9px; border-radius:50%; background:var(--paper); border:1.5px solid var(--ink-soft); }
.ch-black .process-step::before{ background:var(--ink); border-color:rgba(247,248,243,.4); }
.process-step.is-in::before{ background:var(--acid); border-color:var(--acid); }
.process-step .process-index{ font-size:12px; font-weight:600; color:var(--stone); letter-spacing:.06em; }
.process-step h4{ font-family:var(--serif); font-size:17px; font-weight:600; margin:8px 0 8px; }
.process-step p{ font-size:14px; color:var(--ink-soft); line-height:1.55; }
.ch-black .process-step p{ color:rgba(247,248,243,.68); }

@media (max-width: 900px){
  .process-steps{ grid-template-columns:1fr; gap:0; }
  .process-step{ padding:24px 0 24px 22px; border-left:1px solid rgba(17,22,19,.14); }
  .ch-black .process-step{ border-left-color:rgba(247,248,243,.14); }
  .process-step::before{ top:22px; left:-5.5px; }
  .process-line{ display:none; }
}

/* CAPABILITY INDEX */
.cap-wrap{ margin-top:64px; display:grid; grid-template-columns:.9fr 1.1fr; gap:56px; }
.cap-list{ border-top:1px solid rgba(247,248,243,.14); }
.cap-item{ width:100%; text-align:left; background:none; border:0; border-bottom:1px solid rgba(247,248,243,.14); padding:22px 0; color:rgba(247,248,243,.55); font-family:var(--serif); font-size:clamp(18px,2vw,23px); font-weight:600; cursor:pointer; display:flex; align-items:center; gap:16px; transition:color .25s var(--ease); }
.cap-item .dot{ width:6px; height:6px; border-radius:50%; background:transparent; transition:background .25s var(--ease); flex:none; }
.cap-item.is-active{ color:var(--paper); }
.cap-item.is-active .dot{ background:var(--acid); }
.cap-item:hover{ color:var(--paper); }
.cap-detail p{ font-size:17px; line-height:1.7; color:rgba(247,248,243,.75); max-width:44ch; }

@media (max-width: 760px){ .cap-wrap{ grid-template-columns:1fr; } }

/* OUTCOME */
.outcome-band{ padding:140px 0; }
.outcome-band .h-mega{ max-width:18ch; }
.outcome-list-green{ margin-top:64px; display:flex; flex-direction:column; }
.outcome-line{ font-family:var(--serif); font-size:clamp(20px,2.8vw,32px); font-weight:600; padding:20px 0; border-top:1px solid rgba(17,22,19,.18); }
.outcome-list-green .outcome-line:last-child{ border-bottom:1px solid rgba(17,22,19,.18); }
.outcome-final{ margin-top:72px; font-family:var(--serif); font-weight:600; font-size:clamp(30px,5vw,58px); line-height:1.12; text-transform:uppercase; }

/* WHO IT'S FOR */
.qualify-grid{ margin-top:56px; display:grid; grid-template-columns:1fr 1fr; border:1px solid rgba(17,22,19,.14); }
.qualify-col{ padding:44px; }
.qualify-col + .qualify-col{ border-left:1px solid rgba(17,22,19,.14); }
.qualify-col h4{ font-size:12.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--deep-teal); margin-bottom:24px; }
.qualify-col ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:16px; }
.qualify-col li{ font-family:var(--serif); font-size:17px; font-weight:600; line-height:1.4; padding-left:20px; position:relative; }
.qualify-col li::before{ content:"—"; position:absolute; left:0; color:var(--stone); }

@media (max-width: 760px){
  .qualify-grid{ grid-template-columns:1fr; }
  .qualify-col + .qualify-col{ border-left:none; border-top:1px solid rgba(17,22,19,.14); }
}

/* FINAL CTA */
.final-cta{ min-height:100vh; display:flex; align-items:center; justify-content:center; padding:80px var(--gutter); }
.cta-frame{ position:relative; text-align:center; padding:clamp(56px,8vw,110px) clamp(28px,6vw,90px); max-width:760px; }
.cta-frame::before,.cta-frame::after{ content:""; position:absolute; border:1px solid var(--acid); transition:all .8s var(--ease-out); }
.cta-frame::before{ top:0; left:0; width:0; height:0; }
.cta-frame::after{ bottom:0; right:0; width:0; height:0; }
.cta-frame.is-in::before{ width:100%; height:100%; }
.cta-frame.is-in::after{ width:100%; height:100%; }
.cta-frame .h-display{ max-width:14ch; margin:0 auto 22px; }
.cta-frame .lede{ margin:0 auto 40px; }
.cta-frame .cta-secondary{ margin-left:14px; }
@media (max-width:600px){ .cta-frame .cta-secondary{ margin-left:0; margin-top:14px; } }

/* PLAN PAGE SYSTEM */
.value-columns{ margin-top:56px; display:grid; grid-template-columns:repeat(3,1fr); gap:40px; }
.value-col h4{ font-size:12.5px; letter-spacing:.09em; text-transform:uppercase; color:var(--deep-teal); margin-bottom:18px; }
.value-col ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.value-col li{ font-size:16px; color:var(--ink-soft); }
@media (max-width: 760px){ .value-columns{ grid-template-columns:1fr; gap:28px; } }

.dimensions{ margin-top:56px; display:grid; grid-template-columns:1fr 1fr; gap:1px; background:rgba(17,22,19,.14); border:1px solid rgba(17,22,19,.14); }
.dimension{ background:var(--paper); padding:40px; }
.dimension h4{ font-family:var(--serif); font-size:12.5px; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:16px; }
.dimension .q{ font-family:var(--serif); font-size:22px; font-weight:600; margin-bottom:14px; line-height:1.3; }
.dimension p{ color:var(--ink-soft); font-size:15px; max-width:36ch; }
@media (max-width: 760px){ .dimensions{ grid-template-columns:1fr; } }

.examples-row{ margin-top:48px; display:flex; flex-wrap:wrap; gap:12px 28px; }
.examples-row span{ font-size:13px; color:var(--stone); }
.examples-row span:not(:last-child)::after{ content:"·"; margin-left:28px; color:var(--stone); }

/* APPLICATION FORM */
.apply-hero{ padding-top:160px; }
.apply-hero .h-display{ max-width:14ch; }
.apply-hero .lede{ margin-top:22px; }
.apply-qualifier{ margin-top:20px; font-size:13px; color:var(--stone); max-width:56ch; }

/* GAME PLAN (Strategic Plan page) */
.gameplan-label{ margin-top:40px; font-size:13px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--stone); }
.gameplan-grid{ margin-top:14px; display:grid; grid-template-columns:1fr 1fr; gap:0 48px; max-width:900px; }
.gameplan-grid p{ margin:0; padding:16px 0; border-top:1px solid rgba(17,22,19,.12); font-size:17px; font-weight:500; }
@media (max-width:700px){ .gameplan-grid{ grid-template-columns:1fr; } }

.apply-callout{
  display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
  margin-top:36px; padding:22px 26px; border:1px solid rgba(247,248,243,.18); max-width:56ch;
}
.apply-callout p{ font-size:15px; color:rgba(247,248,243,.8); max-width:34ch; }
.apply-callout .btn{ flex-shrink:0; }

.app-form{ margin-top:72px; max-width:760px; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:32px; }
.field{ margin-bottom:36px; }
.field label{ display:block; font-size:12.5px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:10px; }
.field input, .field textarea{ width:100%; border:0; border-bottom:1px solid rgba(17,22,19,.24); background:transparent; padding:10px 2px; font-family:var(--sans); font-size:17px; color:var(--ink); transition:border-color .25s var(--ease); }
.field textarea{ resize:vertical; min-height:96px; line-height:1.5; }
.field input:focus, .field textarea:focus{ outline:none; border-bottom-color:var(--deep-teal); }
.field-optional{ color:var(--stone); font-weight:400; text-transform:none; letter-spacing:0; font-size:12.5px; }
.app-form .submit-row{ margin-top:16px; }

.app-success{ padding-top:160px; min-height:70vh; display:none; flex-direction:column; justify-content:center; }
.app-success.is-visible{ display:flex; }
.app-success .h-display{ max-width:12ch; }
.app-success .lede{ margin-top:20px; }
.app-success .btn{ margin-top:36px; }

/* 404 */
.error-page{ min-height:100vh; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; padding:24px; }
.error-code{ font-family:var(--serif); font-size:14px; letter-spacing:.1em; color:var(--acid); margin-bottom:20px; }
.error-page .h-display{ margin-bottom:18px; }
.error-page .lede{ text-align:center; margin:0 auto 36px; color:rgba(247,248,243,.7); }

/* FOOTER */
.site-footer{ padding:56px 0 40px; border-top:1px solid rgba(247,248,243,.14); }
.footer-top{ display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:32px; }
.footer-statement{ font-family:var(--serif); font-size:18px; max-width:26ch; color:rgba(247,248,243,.65); }
.footer-links{ display:flex; gap:32px; flex-wrap:wrap; }
.footer-links a{ font-size:14px; color:rgba(247,248,243,.65); transition:color .2s var(--ease); }
.footer-links a:hover{ color:var(--acid); }
.footer-bottom{ margin-top:48px; padding-top:24px; border-top:1px solid rgba(247,248,243,.14); display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-size:13px; color:var(--stone); }

/* SPLASH SCREEN */
.splash{ position:fixed; inset:0; z-index:1000; background:var(--ink); overflow:hidden; transition:opacity .4s var(--ease), visibility .4s var(--ease); }
.splash[hidden]{ opacity:0; visibility:hidden; pointer-events:none; }
.splash-wipe{ position:absolute; top:0; bottom:0; left:-10%; width:16%; background:var(--acid); transform:translateX(-40vw); }
.splash-lockup{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; gap:8px; opacity:0; transition:opacity .3s var(--ease); }
.splash-lockup.is-in{ opacity:1; }
.splash-mark{ font-family:var(--serif); font-weight:600; color:var(--paper); font-size:clamp(30px,5.5vw,52px); letter-spacing:.34em; transition:letter-spacing .7s var(--ease-out); }
.splash-mark.is-tight{ letter-spacing:.02em; }
.splash-sub{ font-family:var(--sans); font-weight:600; color:var(--acid); font-size:11px; letter-spacing:.24em; text-transform:uppercase; }

body.pre-reveal{ overflow:hidden; height:100vh; }
body.page-in{ animation:page-fade .5s var(--ease) both; }
@keyframes page-fade{ from{ opacity:0; } to{ opacity:1; } }

/* ==========================================================================
   v3 ADDITIONS — Life & Work wheels, health, intelligence layer, the Arena
   ========================================================================== */
.primary-nav{ gap:28px; }
@media (max-width: 1080px){ .primary-nav{ gap:20px; } .primary-nav a{ font-size:13.5px; } }
@media (max-width: 1300px){
  .header-actions{ gap:12px; }
  .header-actions .btn{ padding:13px 18px; font-size:13px; white-space:nowrap; }
}

/* select + choice fields */
.field select{ width:100%; border:0; border-bottom:1px solid rgba(17,22,19,.24); background:transparent; padding:10px 2px; font-family:var(--sans); font-size:17px; color:var(--ink); border-radius:0; }
.field select:focus{ outline:none; border-bottom-color:var(--deep-teal); }
.choice-row{ display:flex; flex-wrap:wrap; gap:10px; }
.choice{ position:relative; }
.choice input{ position:absolute; opacity:0; pointer-events:none; }
.choice span{ display:inline-flex; padding:10px 18px; border:1px solid rgba(17,22,19,.24); font-size:14px; font-weight:600; cursor:pointer; transition:background-color .2s var(--ease), border-color .2s var(--ease); }
.choice input:checked + span{ background:var(--ink); color:var(--acid); border-color:var(--ink); }
.choice input:focus-visible + span{ outline:2px solid var(--deep-teal); outline-offset:2px; }

/* index grid: 3 × 2 on the home page */
.index-grid.six{ grid-template-columns:repeat(3,1fr); }
@media (max-width: 900px){ .index-grid.six{ grid-template-columns:1fr 1fr; } }
@media (max-width: 560px){ .index-grid.six{ grid-template-columns:1fr; } }

/* TWIN WHEELS (home preview) */
.twin{ display:grid; grid-template-columns:1fr 1.1fr; gap:clamp(40px,6vw,96px); align-items:center; }
.twin.twin-stretch{ align-items:stretch; }
.problem-photos{ display:flex; flex-direction:column; gap:14px; height:100%; container-type:inline-size; }
.problem-photo{ overflow:hidden; border:1px solid rgba(247,248,243,.12); }
.problem-photo img{ display:block; width:100%; height:100%; object-fit:cover; }
.problem-photo-primary{ flex:none; aspect-ratio:4/5; }
.problem-photo-primary img{ object-position:50% 12%; }
/* min-height is set in container-query units (cqw) matching the source photo's own
   aspect ratio (1600/1066), so this can never be squashed shorter than the photo's
   native ratio relative to its own width — flex may still grow it taller to fill
   spare space, it just can't crop into the subject's head. */
.problem-photo-secondary{ flex:1 1 auto; min-height:66.7cqw; }
.problem-photo-secondary img{ object-position:100% 28%; }
.problem-photo-caption{ margin:-2px 2px 0; font-size:12.5px; letter-spacing:.02em; color:rgba(247,248,243,.48); }
@media (max-width: 900px){
  .problem-photos{ order:-1; }
  .problem-photo-primary{ aspect-ratio:4/5; }
  .problem-photo-secondary{ aspect-ratio:1600/1066; flex:none; min-height:0; }
}
.twin-visual{ position:relative; display:flex; align-items:center; justify-content:center; }
.twin-visual svg{ width:100%; max-width:620px; height:auto; overflow:visible; }
.twin-label{ font-family:var(--serif); font-weight:600; font-size:13px; letter-spacing:.12em; text-transform:uppercase; }
.thread{ stroke-dasharray:6 8; animation:thread 2.4s linear infinite; }
@keyframes thread{ to{ stroke-dashoffset:-56; } }
.pillars{ margin-top:40px; display:flex; flex-direction:column; }
.pillar{ display:grid; grid-template-columns:56px 1fr; gap:18px; padding:22px 0; border-top:1px solid rgba(247,248,243,.14); }
.pillar:last-child{ border-bottom:1px solid rgba(247,248,243,.14); }
.pillar .pn{ font-family:var(--serif); font-weight:600; color:var(--acid); font-size:13px; letter-spacing:.08em; padding-top:4px; }
.pillar h3{ font-size:21px; margin-bottom:6px; }
.pillar p{ color:rgba(247,248,243,.68); font-size:15px; max-width:46ch; }
@media (max-width: 900px){ .twin{ grid-template-columns:1fr; } }

/* HEALTH band */
.health-band{ padding:clamp(100px,12vw,170px) 0; }
.health-quote{ font-family:var(--serif); font-weight:600; text-transform:uppercase; font-size:clamp(34px,6.4vw,92px); line-height:1; letter-spacing:-.02em; max-width:17ch; }
.health-quote em{ font-style:normal; display:block; -webkit-text-stroke:1.5px var(--ink); -webkit-text-fill-color:transparent; color:transparent; paint-order:stroke fill; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
.health-grid{ margin-top:72px; display:grid; grid-template-columns:repeat(4,1fr); border-top:2px solid var(--ink); }
.health-cell{ padding:26px 24px 0 0; }
.health-cell b{ display:block; font-family:var(--serif); font-size:20px; margin-bottom:8px; }
.health-cell p{ font-size:15px; max-width:26ch; }
@media (max-width: 900px){ .health-grid{ grid-template-columns:1fr 1fr; row-gap:28px; } }
@media (max-width: 520px){ .health-grid{ grid-template-columns:1fr; } }

/* FACTS band */
.facts-grid{ margin-top:64px; display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(17,22,19,.14); border:1px solid rgba(17,22,19,.14); }
.fact-card{ background:var(--paper); padding:36px 30px; display:flex; flex-direction:column; gap:12px; min-height:240px; }
.fact-card .tagline{ font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--deep-teal); }
.fact-card h3{ font-size:24px; }
.fact-card p{ color:var(--ink-soft); font-size:15px; }
@media (max-width: 900px){ .facts-grid{ grid-template-columns:1fr; } }

/* INTELLIGENCE */
.intel{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,96px); align-items:start; }
.signal-stack{ display:flex; flex-direction:column; gap:12px; }
.signal{ border:1px solid rgba(247,248,243,.16); padding:20px 22px; display:grid; grid-template-columns:auto 1fr; gap:6px 16px; align-items:start; background:rgba(247,248,243,.02); }
.signal .from{ grid-column:1/-1; font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--stone); font-weight:600; display:flex; align-items:center; gap:8px; }
.signal .from i{ width:8px; height:8px; background:var(--acid); display:inline-block; }
.signal .from i.work{ background:var(--paper); }
.signal p{ grid-column:1/-1; font-size:16px; color:var(--paper); }
.signal .arrow{ grid-column:1/-1; font-size:13.5px; color:var(--acid); }
@media (max-width: 900px){ .intel{ grid-template-columns:1fr; } }

/* ARENA */
.arena-hero{ position:relative; min-height:100vh; display:flex; align-items:flex-end; padding:160px 0 80px; overflow:hidden; }
.arena-lights{ position:absolute; inset:0; pointer-events:none; }
.arena-lights span{ position:absolute; top:-30%; width:38vw; height:120%; background:linear-gradient(180deg, rgba(199,255,0,.22), rgba(199,255,0,0) 70%); filter:blur(8px); transform-origin:top center; }
.arena-lights span:nth-child(1){ left:-6vw; transform:rotate(-24deg); animation:sweep 9s ease-in-out infinite alternate; }
.arena-lights span:nth-child(2){ right:-6vw; transform:rotate(24deg); animation:sweep2 11s ease-in-out infinite alternate; }
@keyframes sweep{ to{ transform:rotate(-12deg); } }
@keyframes sweep2{ to{ transform:rotate(12deg); } }
.arena-tiers{ position:absolute; left:0; right:0; bottom:0; height:44%; background:repeating-linear-gradient(180deg, rgba(247,248,243,.05) 0 2px, transparent 2px 34px); mask-image:linear-gradient(0deg,#000,transparent); -webkit-mask-image:linear-gradient(0deg,#000,transparent); }
.arena-hero .container-wide{ position:relative; }
.arena-formats{ margin-top:64px; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(17,22,19,.14); }
.arena-format{ padding:36px 28px 36px 0; border-bottom:1px solid rgba(17,22,19,.14); }
.arena-format + .arena-format{ padding-left:28px; border-left:1px solid rgba(17,22,19,.14); }
.arena-format .fmt{ font-family:var(--serif); font-weight:600; font-size:12px; letter-spacing:.1em; background:var(--ink); color:var(--acid); padding:3px 8px; display:inline-block; margin-bottom:22px; }
.arena-format h3{ font-size:26px; margin-bottom:10px; }
.arena-format p{ color:var(--ink-soft); font-size:15px; }
@media (max-width: 900px){ .arena-formats{ grid-template-columns:1fr; } .arena-format + .arena-format{ padding-left:0; border-left:0; } }
.stage-split{ margin-top:64px; display:grid; grid-template-columns:1fr 1fr; gap:1px; background:rgba(247,248,243,.14); }
.stage-side{ background:var(--ink); padding:clamp(28px,4vw,56px); }
.stage-side .h-section{ margin:14px 0 14px; }
.stage-side p{ color:rgba(247,248,243,.7); max-width:40ch; }
@media (max-width: 800px){ .stage-split{ grid-template-columns:1fr; } }
.interest{ display:flex; gap:12px; flex-wrap:wrap; margin-top:32px; max-width:560px; }
.interest input{ flex:1 1 240px; background:transparent; border:0; border-bottom:1px solid rgba(17,22,19,.35); padding:12px 2px; font-size:17px; font-family:var(--sans); color:var(--ink); }
.interest input:focus{ outline:none; border-bottom-color:var(--ink); }
.interest-done{ display:none; margin-top:24px; font-family:var(--serif); font-weight:600; font-size:22px; }
.interest-done.is-visible{ display:block; }

/* WHEEL LAB (life-and-work page) */
.lab{ display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:56px; }
.lab-wheel{ border:1px solid rgba(247,248,243,.14); padding:28px; display:flex; flex-direction:column; gap:20px; }
.lab-head{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.lab-head h3{ font-size:26px; }
.lab-score{ font-family:var(--serif); font-weight:600; font-size:34px; color:var(--acid); line-height:1; }
.lab-score small{ font-size:13px; color:var(--stone); margin-left:4px; }
.lab-wheel svg{ width:100%; max-width:560px; margin:0 auto; display:block; height:auto; touch-action:manipulation; }
.lab-wheel svg .seg{ cursor:pointer; }
.lab-wheel svg .seg:hover .seg-hit{ fill:rgba(247,248,243,.05); }
.sliders{ display:grid; grid-template-columns:1fr 1fr; gap:6px 22px; }
.slider{ display:grid; grid-template-columns:1fr 28px; gap:2px 10px; align-items:center; }
.slider label{ font-size:13px; color:rgba(247,248,243,.78); }
.slider label.key{ color:var(--acid); font-weight:600; }
.slider output{ font-family:var(--serif); font-weight:600; text-align:right; font-size:14px; }
.slider input[type=range]{ grid-column:1/-1; width:100%; accent-color:#C7FF00; margin:0 0 6px; }
@media (max-width: 1000px){ .lab{ grid-template-columns:1fr; } }
@media (max-width: 460px){ .sliders{ grid-template-columns:1fr; } }
.lab-read{ margin-top:24px; border:1px solid var(--acid); padding:clamp(24px,3vw,40px); display:grid; grid-template-columns:260px 1fr; gap:32px; }
.lab-read .tag{ font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--acid); display:flex; align-items:center; gap:10px; }
.lab-read .tag::before{ content:""; width:10px; height:10px; background:var(--acid); animation:pulse 2s ease-in-out infinite; }
@keyframes pulse{ 50%{ opacity:.25; } }
.lab-read h3{ font-size:26px; margin-top:14px; }
.lab-read .note{ margin-top:14px; font-size:13px; color:var(--stone); }
.read-list{ display:flex; flex-direction:column; }
.read-item{ padding:16px 0; border-top:1px solid rgba(247,248,243,.14); }
.read-item:first-child{ border-top:0; padding-top:0; }
.read-item b{ display:block; font-family:var(--serif); font-size:18px; margin-bottom:4px; }
.read-item p{ color:rgba(247,248,243,.72); font-size:15px; }
@media (max-width: 900px){ .lab-read{ grid-template-columns:1fr; } }
.lab-actions{ display:flex; gap:12px; flex-wrap:wrap; margin-top:24px; }

/* 90-DAY ROADMAP */
.roadmap{ margin-top:56px; display:grid; grid-template-columns:repeat(3,1fr); gap:0; border-top:2px solid var(--ink); }
.leg{ padding:28px 28px 0 0; }
.leg + .leg{ padding-left:28px; border-left:1px solid rgba(17,22,19,.14); }
.leg .day{ font-family:var(--serif); font-weight:600; font-size:clamp(40px,5vw,64px); line-height:1; }
.leg .day span{ font-size:14px; letter-spacing:.1em; margin-left:6px; color:var(--deep-teal); }
.leg h4{ font-family:var(--serif); font-size:20px; margin:14px 0 10px; }
.leg ul{ margin:0; padding:0; list-style:none; }
.leg li{ padding:8px 0; border-top:1px solid rgba(17,22,19,.1); font-size:15px; color:var(--ink-soft); }
@media (max-width: 900px){ .roadmap{ grid-template-columns:1fr; } .leg + .leg{ padding-left:0; border-left:0; } .leg{ padding-bottom:24px; } }

/* MEASURES */
.measures{ margin-top:48px; display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(17,22,19,.14); border:1px solid rgba(17,22,19,.14); }
.measure{ background:var(--paper); padding:30px 26px; }
.measure b{ font-family:var(--serif); font-size:13px; letter-spacing:.1em; text-transform:uppercase; color:var(--deep-teal); }
.measure h4{ font-family:var(--serif); font-size:22px; margin:10px 0 8px; }
.measure p{ color:var(--ink-soft); font-size:15px; }
@media (max-width: 800px){ .measures{ grid-template-columns:1fr; } }
@media (max-width: 460px){ .lab-wheel{ padding:18px; } }

/* SLOGAN */
.brandlock{ flex-direction:column; align-items:flex-start; gap:3px; }
.brandlock .wm-row{ display:flex; align-items:baseline; gap:8px; }
.brandlock .tagline{ font-family:var(--sans); font-size:10.5px; font-weight:500; letter-spacing:.04em; opacity:.7; white-space:nowrap; }
.site-header .brandlock .tagline{ color:inherit; }
.site-footer .brandlock .tagline{ font-size:13px; color:var(--acid); opacity:1; margin-top:4px; }
@media (max-width: 420px){ .site-header .brandlock .tagline{ font-size:9.5px; } }
.splash-tag{ font-family:var(--sans); font-size:13px; font-weight:500; color:rgba(247,248,243,.8); letter-spacing:.03em; opacity:0; animation:tagIn .45s ease .85s forwards; white-space:nowrap; }
@keyframes tagIn{ to{ opacity:1; } }
.mobile-tagline{ position:absolute; top:24px; left:var(--gutter); font-size:12.5px; color:var(--acid); font-weight:500; }

/* SLOGAN — larger */
.site-header .brandlock{ gap:5px; }
.site-header .brandlock .tagline{ font-family:var(--serif); font-size:15px; font-weight:500; letter-spacing:0; opacity:1; color:var(--acid); }
.site-header.on-light .brandlock .tagline{ color:var(--deep-teal); }
.splash-tag{ font-family:var(--serif); font-size:clamp(16px,2vw,22px); color:var(--paper); margin-top:6px; }
.site-footer .brandlock .tagline{ font-family:var(--serif); font-size:17px; }
@media (max-width: 1080px){ .site-header .brandlock .tagline{ font-size:13.5px; } }
@media (max-width: 420px){ .site-header .brandlock .tagline{ font-size:12px; } }

/* FIX — Circle Challenge / Build / Access: text off the dividers, no jump on hover */
.circle-part{ padding:44px 40px; transition:opacity var(--dur) var(--ease-out), transform var(--dur) var(--ease-out); }
.circle-part:hover{ padding-left:40px; }
.circle-part::before{ left:-1px; width:3px; z-index:1; }
.circle-part:first-child::before{ left:0; }
.circle-part > *{ transition:transform .35s var(--ease-out); }
.circle-part:hover > *{ transform:translateX(6px); }
@media (max-width: 820px){
  .circle-part{ padding:32px 0 32px 20px !important; }
  .circle-part::before, .circle-part:first-child::before{ left:0; }
}
@media (hover: none){ .circle-part:hover > *{ transform:none; } }

/* ==========================================================================
   LIGHT-SECTION PALETTE — acid is reserved for dark grounds.
   On paper we use a teal family: deep teal, sea teal and a mist tint.
   ========================================================================== */
:root{
  --sea:#2F9C8F;        /* bright teal for highlights on paper */
  --sea-soft:#D6ECE7;   /* tint for hover fills */
  --mist-bg:#E8F0ED;
  --teal-deep:#163F47;
}
.ch-paper .eyebrow::before, .ch-paper-deep .eyebrow::before, .ch-mist .eyebrow::before{ background:var(--sea); height:3px; }
.ch-paper .accent, .ch-paper-deep .accent, .ch-mist .accent{ color:var(--sea); }
.ch-paper .tab-btn::after, .ch-paper-deep .tab-btn::after, .ch-mist .tab-btn::after{ background:var(--sea); }
.ch-paper .process-line-fill, .ch-paper-deep .process-line-fill{ background:var(--sea); }
.ch-paper .process-step.is-in::before, .ch-paper-deep .process-step.is-in::before{ background:var(--sea); border-color:var(--sea); }
.ch-paper .circle-part::before{ background:linear-gradient(180deg,var(--sea),var(--deep-teal)); }
.ch-paper .cta-frame::before, .ch-paper .cta-frame::after{ border-color:var(--sea); }
.site-header.on-light .primary-nav a::after{ background:var(--sea); }
.site-header.on-light .brandlock .accelerated{ color:var(--deep-teal); }

/* buttons on light grounds: teal, then ink on hover with a sea sweep */
.ch-paper .btn-primary, .ch-paper-deep .btn-primary, .ch-mist .btn-primary, .site-header.on-light .btn-primary{ background:var(--deep-teal); color:var(--paper); }
.ch-paper .btn-primary::before, .ch-paper-deep .btn-primary::before, .ch-mist .btn-primary::before, .site-header.on-light .btn-primary::before{ background:var(--sea); }
.ch-paper .btn-primary:hover, .ch-paper-deep .btn-primary:hover, .ch-mist .btn-primary:hover, .site-header.on-light .btn-primary:hover{ color:var(--paper); }
.ch-paper .btn-primary:hover svg, .ch-paper-deep .btn-primary:hover svg, .site-header.on-light .btn-primary:hover svg{ stroke:var(--paper); }

/* cards on paper get a tinted, lifting hover */
.index-card{ transition:background-color .3s var(--ease), transform .3s var(--ease-out), box-shadow .3s var(--ease-out); position:relative; }
.index-card:hover{ background:var(--sea-soft); transform:translateY(-4px); box-shadow:0 18px 40px -24px rgba(22,63,71,.45); z-index:1; }
.index-card .index-no{ background:var(--deep-teal); color:var(--paper); }
.index-card:hover .index-no{ background:var(--sea); }
.index-card .index-link{ color:var(--deep-teal); }
.fact-card{ transition:background-color .3s var(--ease); position:relative; }
.fact-card::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:3px; background:linear-gradient(90deg,var(--sea),var(--deep-teal)); transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease-out); }
.fact-card:hover{ background:#fff; }
.fact-card:hover::after{ transform:scaleX(1); }
.fact-card .tagline{ color:var(--sea); }
.measure b, .leg .day span{ color:var(--sea); }
.ch-mist{ background:var(--mist-bg); color:var(--ink); }

/* ==========================================================================
   TEAL GROUND + VALUE ROADMAP
   ========================================================================== */
.ch-teal{ background:radial-gradient(120% 90% at 85% 0%, #25616B 0%, var(--deep-teal) 45%, var(--teal-deep) 100%); color:var(--paper); position:relative; overflow:hidden; }
.ch-teal .eyebrow{ color:rgba(247,248,243,.7); }
.ch-teal .lede{ color:rgba(247,248,243,.78); }
.ch-teal::before{ content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(247,248,243,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(247,248,243,.05) 1px, transparent 1px); background-size:64px 64px; mask-image:radial-gradient(80% 70% at 50% 40%, #000, transparent); -webkit-mask-image:radial-gradient(80% 70% at 50% 40%, #000, transparent); pointer-events:none; }
.ch-teal > *{ position:relative; }

.rm-head{ display:grid; grid-template-columns:1.2fr 1fr; gap:40px; align-items:end; }
@media (max-width: 900px){ .rm-head{ grid-template-columns:1fr; } }

.rm-track{ margin-top:64px; position:relative; }
.rm-rail{ position:absolute; left:0; right:0; top:27px; height:4px; background:rgba(247,248,243,.14); border-radius:4px; }
.rm-rail i{ position:absolute; left:0; top:0; bottom:0; width:0; border-radius:4px; background:linear-gradient(90deg,var(--sea),var(--acid)); transition:width .6s var(--ease-out); box-shadow:0 0 18px rgba(199,255,0,.45); }
.rm-stages{ display:grid; grid-template-columns:repeat(5,1fr); position:relative; }
.rm-stage{ background:none; border:0; color:inherit; text-align:left; padding:0 12px 0 0; cursor:pointer; display:flex; flex-direction:column; gap:14px; }
.rm-node{ width:58px; height:58px; border-radius:50%; display:grid; place-items:center; font-family:var(--serif); font-weight:600; font-size:15px; background:var(--teal-deep); border:2px solid rgba(247,248,243,.28); transition:all .35s var(--ease-out); }
.rm-stage:hover .rm-node{ border-color:var(--paper); transform:scale(1.06); }
.rm-stage.is-done .rm-node{ background:var(--sea); border-color:var(--sea); }
.rm-stage.is-active .rm-node{ background:var(--acid); border-color:var(--acid); color:var(--ink); box-shadow:0 0 0 8px rgba(199,255,0,.16); transform:scale(1.1); }
.rm-stage b{ font-family:var(--serif); font-size:18px; }
.rm-stage small{ font-size:13px; color:rgba(247,248,243,.62); max-width:18ch; }
.rm-stage:focus-visible{ outline:none; }
.rm-stage:focus-visible .rm-node{ outline:2px solid var(--acid); outline-offset:4px; }

.rm-panel{ margin-top:44px; display:grid; grid-template-columns:1.1fr 1fr; gap:1px; background:rgba(247,248,243,.14); border:1px solid rgba(247,248,243,.14); }
.rm-panel > div{ background:rgba(22,63,71,.72); backdrop-filter:blur(6px); padding:clamp(24px,3vw,40px); }
.rm-kicker{ font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--acid); }
.rm-panel h3{ font-size:clamp(24px,2.6vw,34px); margin:12px 0; line-height:1.1; }
.rm-panel p{ color:rgba(247,248,243,.78); }
.rm-list{ list-style:none; padding:0; margin:18px 0 0; }
.rm-list li{ padding:10px 0 10px 26px; border-top:1px solid rgba(247,248,243,.12); position:relative; font-size:15px; }
.rm-list li::before{ content:""; position:absolute; left:0; top:17px; width:12px; height:2px; background:var(--acid); }
.rm-fade{ animation:rmIn .45s var(--ease-out); }
@keyframes rmIn{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
@media (max-width: 900px){
  .rm-panel{ grid-template-columns:1fr; }
  .rm-stages{ grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:150px; overflow-x:auto; padding-bottom:10px; scroll-snap-type:x mandatory; }
  .rm-stage{ scroll-snap-align:start; }
  .rm-rail{ display:none; }
}

/* value beyond the numbers */
.vb{ margin-top:72px; display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,72px); align-items:center; }
.vb h3{ font-size:clamp(26px,3vw,40px); line-height:1.08; }
.vb-chips{ display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; }
.vb-chip{ border:1px solid rgba(247,248,243,.3); background:transparent; color:var(--paper); border-radius:999px; padding:10px 16px; font-size:14px; font-weight:600; cursor:pointer; display:inline-flex; gap:8px; align-items:center; transition:all .25s var(--ease); }
.vb-chip::before{ content:"+"; font-size:16px; line-height:1; color:var(--acid); transition:transform .25s var(--ease); }
.vb-chip:hover{ border-color:var(--paper); }
.vb-chip[aria-pressed="true"]{ background:var(--paper); color:var(--teal-deep); border-color:var(--paper); }
.vb-chip[aria-pressed="true"]::before{ content:"✓"; color:var(--sea); }
.vb-meter{ background:rgba(22,63,71,.72); border:1px solid rgba(247,248,243,.14); padding:clamp(24px,3vw,40px); }
.vb-meter .row{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.vb-meter .label{ font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:rgba(247,248,243,.7); }
.vb-meter .level{ font-family:var(--serif); font-weight:600; font-size:clamp(28px,3.4vw,44px); color:var(--acid); line-height:1; }
.gauge{ margin:22px 0 10px; height:14px; border-radius:999px; background:rgba(247,248,243,.12); overflow:hidden; }
.gauge i{ display:block; height:100%; width:12%; border-radius:999px; background:linear-gradient(90deg,var(--sea),var(--acid)); transition:width .6s var(--ease-out); }
.gauge-ends{ display:flex; justify-content:space-between; font-size:12px; color:rgba(247,248,243,.55); }
.vb-note{ margin-top:18px; font-size:14px; color:rgba(247,248,243,.78); min-height:44px; }
.vb-small{ margin-top:12px; font-size:12px; color:rgba(247,248,243,.5); }
@media (max-width: 900px){ .vb{ grid-template-columns:1fr; } }

/* exit options */
.options{ margin-top:72px; }
.options-grid{ margin-top:28px; display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.option{ position:relative; padding:30px 26px 28px; border:1px solid rgba(247,248,243,.18); background:rgba(22,63,71,.5); cursor:pointer; text-align:left; color:var(--paper); transition:transform .35s var(--ease-out), border-color .3s, background-color .3s; overflow:hidden; }
.option::after{ content:""; position:absolute; inset:auto -20% -60% -20%; height:120%; background:radial-gradient(closest-side, rgba(199,255,0,.22), transparent); opacity:0; transition:opacity .4s; pointer-events:none; }
.option:hover, .option.is-open{ transform:translateY(-6px); border-color:var(--acid); }
.option:hover::after, .option.is-open::after{ opacity:1; }
.option .otag{ font-family:var(--serif); font-weight:600; font-size:12px; letter-spacing:.12em; color:var(--teal-deep); background:var(--acid); padding:3px 8px; display:inline-block; }
.option h4{ font-family:var(--serif); font-size:clamp(26px,2.8vw,36px); margin:18px 0 8px; line-height:1; }
.option p{ color:rgba(247,248,243,.75); font-size:15px; }
.option .more{ max-height:0; overflow:hidden; transition:max-height .45s var(--ease-out); }
.option.is-open .more{ max-height:260px; }
.option .more ul{ list-style:none; padding:14px 0 0; margin:14px 0 0; border-top:1px solid rgba(247,248,243,.16); }
.option .more li{ font-size:14px; padding:5px 0; color:rgba(247,248,243,.85); }
.option .more li::before{ content:"→ "; color:var(--acid); }
.option .toggle{ margin-top:16px; font-size:13px; font-weight:600; color:var(--acid); }
.options.is-locked .option{ opacity:.55; }
@media (max-width: 900px){ .options-grid{ grid-template-columns:1fr; } }
.option{ display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-start; font:inherit; }
.rm-rail{ left:29px; right:auto; width:80%; }

/* ==========================================================================
   TEAM DYNAMICS — five stages, one behavioural shift
   ========================================================================== */
.tp{ padding:clamp(88px,10vw,150px) 0; }
.tp-intro{ display:grid; grid-template-columns:minmax(0,1.2fr) minmax(18rem,.8fr); gap:clamp(32px,6vw,96px); align-items:end; }
.tp-intro h2{ max-width:15ch; font-size:clamp(40px,6vw,88px); line-height:.95; letter-spacing:-.04em; text-transform:uppercase; font-family:var(--serif); }
.tp-intro h2 span{ display:block; color:var(--acid); }
.tp-intro .lede{ max-width:38rem; }
@media (max-width: 900px){ .tp-intro{ grid-template-columns:1fr; gap:24px; } .tp-intro h2{ max-width:13ch; } }

.tp-track{ margin-top:clamp(48px,7vw,88px); position:relative; }
.tp-rail{ position:absolute; top:7px; left:7px; right:7px; height:2px; background:rgba(247,248,243,.16); }
.tp-rail i{ position:absolute; inset:0 auto 0 0; width:0; background:var(--acid); transition:width 1.4s var(--ease-out); box-shadow:0 0 12px rgba(199,255,0,.5); }
.tp-stages{ display:grid; grid-template-columns:repeat(5,1fr); gap:0; }
.tp-stage{ background:none; border:0; color:inherit; text-align:left; cursor:pointer; padding:0 24px 0 0; font:inherit; display:block; }
.tp-dot{ width:16px; height:16px; border-radius:50%; background:var(--ink); border:2px solid rgba(247,248,243,.35); display:block; position:relative; z-index:1; transition:all .3s var(--ease-out); }
.tp-stage.is-lit .tp-dot{ background:var(--acid); border-color:var(--acid); }
.tp-stage.is-active .tp-dot{ box-shadow:0 0 0 7px rgba(199,255,0,.18); transform:scale(1.15); }
.tp-num{ display:block; font-family:var(--serif); font-weight:600; font-size:clamp(28px,3vw,40px); line-height:1; color:var(--acid); margin:34px 0 6px; }
.tp-name{ display:block; font-family:var(--serif); font-weight:600; font-size:clamp(20px,2.2vw,30px); line-height:1; text-transform:uppercase; letter-spacing:-.01em; margin-bottom:14px; }
.tp-copy{ display:block; font-size:15px; color:rgba(247,248,243,.7); max-width:24ch; }
.tp-stage:hover .tp-name, .tp-stage.is-active .tp-name{ color:var(--acid); }
.tp-stage:focus-visible{ outline:none; }
.tp-stage:focus-visible .tp-dot{ outline:2px solid var(--acid); outline-offset:4px; }
.tp-detail{ margin-top:clamp(36px,5vw,64px); border:1px solid rgba(247,248,243,.16); background:rgba(247,248,243,.03); padding:clamp(24px,3vw,40px); display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(24px,4vw,56px); }
.tp-detail .kicker{ font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--acid); }
.tp-detail h3{ font-size:clamp(22px,2.4vw,30px); margin:12px 0 10px; }
.tp-detail p{ color:rgba(247,248,243,.75); }
.tp-detail ul{ list-style:none; margin:0; padding:0; }
.tp-detail li{ padding:11px 0 11px 26px; border-top:1px solid rgba(247,248,243,.12); position:relative; font-size:15px; }
.tp-detail li:first-child{ border-top:0; }
.tp-detail li::before{ content:""; position:absolute; left:0; top:19px; width:12px; height:2px; background:var(--acid); }
.tp-foot{ margin-top:26px; font-size:13px; color:var(--stone); }
@media (max-width: 900px){
  .tp-track{ margin-inline:calc(var(--gutter) * -1); padding-inline:var(--gutter); overflow-x:auto; scroll-snap-type:x mandatory; }
  .tp-rail{ display:none; }
  .tp-stages{ grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:230px; }
  .tp-stage{ scroll-snap-align:start; padding-right:20px; }
  .tp-stage .tp-dot{ display:inline-block; }
  .tp-detail{ grid-template-columns:1fr; }
  .tp-swipe{ display:block; }
}
.tp-swipe{ display:none; margin-top:14px; font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ink); background:var(--acid); padding:7px 10px; width:max-content; }

/* ==========================================================================
   v5 — GREEN BACK ON LIGHT GROUNDS (as a marker, not as text) + more texture
   Acid is used as a block/graphic on paper; text accents use moss green.
   ========================================================================== */
:root{
  --moss:#41610A;         /* dark green: readable on paper */
  --moss-deep:#2C420A;
  --lime-tint:#F1F8DA;    /* hover fill on paper */
  --mist-bg:#EDF3E2;      /* green-tinted section ground */
}

/* eyebrows and rules go back to lime */
.ch-paper .eyebrow::before, .ch-paper-deep .eyebrow::before, .ch-mist .eyebrow::before{ background:var(--acid); width:26px; height:4px; }
.ch-paper .eyebrow, .ch-paper-deep .eyebrow, .ch-mist .eyebrow{ color:var(--moss); }

/* accent words get a highlighter block instead of coloured type */
.ch-paper .accent, .ch-paper-deep .accent, .ch-mist .accent{
  color:var(--ink); background:linear-gradient(180deg, transparent 12%, var(--acid) 12%, var(--acid) 92%, transparent 92%);
  padding:0 .1em; box-decoration-break:clone; -webkit-box-decoration-break:clone;
}
.ch-paper .tab-btn::after, .ch-paper-deep .tab-btn::after, .ch-mist .tab-btn::after{ background:var(--acid); height:4px; }
.ch-paper .process-line-fill, .ch-paper-deep .process-line-fill{ background:var(--acid); height:3px; }
.ch-paper .process-step.is-in::before, .ch-paper-deep .process-step.is-in::before{ background:var(--acid); border-color:var(--moss); }
.ch-paper .cta-frame::before, .ch-paper .cta-frame::after{ border-color:var(--moss); }
.site-header.on-light .primary-nav a::after{ background:var(--acid); height:4px; }
.site-header.on-light .brandlock .tagline{ color:var(--moss); }
.site-header.on-light .brandlock .accelerated{ color:var(--moss); }

/* buttons on light: lime with ink type, ink sweep on hover */
.ch-paper .btn-primary, .ch-paper-deep .btn-primary, .ch-mist .btn-primary, .site-header.on-light .btn-primary{ background:var(--acid); color:var(--ink); }
.ch-paper .btn-primary::before, .ch-paper-deep .btn-primary::before, .ch-mist .btn-primary::before, .site-header.on-light .btn-primary::before{ background:var(--ink); }
.ch-paper .btn-primary:hover, .ch-paper-deep .btn-primary:hover, .ch-mist .btn-primary:hover, .site-header.on-light .btn-primary:hover{ color:var(--acid); }
.ch-paper .btn-primary:hover svg, .ch-paper-deep .btn-primary:hover svg, .site-header.on-light .btn-primary:hover svg{ stroke:var(--acid); }
.ch-paper .btn-ghost:hover, .ch-mist .btn-ghost:hover{ border-color:var(--moss); background:var(--lime-tint); }

/* paper grounds get a faint grid so they are not flat */
.ch-paper, .ch-paper-deep, .ch-mist{ position:relative; }
.ch-paper > *, .ch-paper-deep > *, .ch-mist > *{ position:relative; z-index:1; }
.ch-paper::after, .ch-paper-deep::after, .ch-mist::after{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:linear-gradient(rgba(17,22,19,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(17,22,19,.045) 1px, transparent 1px);
  background-size:72px 72px;
  mask-image:radial-gradient(90% 80% at 50% 30%, #000 20%, transparent 85%);
  -webkit-mask-image:radial-gradient(90% 80% at 50% 30%, #000 20%, transparent 85%);
}

/* cards on paper */
.index-card:hover{ background:var(--lime-tint); box-shadow:0 18px 40px -26px rgba(17,22,19,.35); }
.index-card .index-no{ background:var(--ink); color:var(--acid); }
.index-card:hover .index-no{ background:var(--acid); color:var(--ink); }
.index-card .index-link{ color:var(--moss); }
.fact-card{ background:transparent; }
.fact-card::after{ background:var(--acid); height:4px; }
.fact-card:hover{ background:var(--lime-tint); }
.fact-card .tagline{ color:var(--moss); }
.measure b, .leg .day span{ color:var(--moss); }
.measure{ transition:background-color .3s var(--ease); }
.measure:hover{ background:var(--lime-tint); }

/* THE CIRCLE — numbered, tinted, less flat */
.circle-grid{ counter-reset:cpart; }
.circle-part{ counter-increment:cpart; transition:background-color .3s var(--ease), opacity var(--dur) var(--ease-out), transform var(--dur) var(--ease-out); }
.circle-part h3{ color:var(--moss); display:flex; align-items:center; gap:12px; }
.circle-part h3::before{
  content:counter(cpart,decimal-leading-zero);
  font-family:var(--serif); font-size:12px; letter-spacing:.06em;
  background:var(--ink); color:var(--acid); padding:3px 7px;
}
.ch-paper .circle-part::before{ background:var(--acid); width:4px; }
.circle-part:hover{ background:var(--lime-tint); }
.circle-part .claim{ transition:none; }
.circle-part:hover .claim{ color:var(--ink); }

/* moving keyword band — breaks up the long light stretches */
.band{ background:var(--ink); color:var(--paper); overflow:hidden; padding:20px 0; border-top:1px solid rgba(247,248,243,.12); border-bottom:1px solid rgba(247,248,243,.12); }
.band-row{ display:flex; gap:0; width:max-content; animation:bandmove 38s linear infinite; }
.band:hover .band-row{ animation-play-state:paused; }
.band-row span{ font-family:var(--serif); font-weight:600; font-size:clamp(18px,2.2vw,30px); text-transform:uppercase; letter-spacing:-.01em; padding:0 28px; display:flex; align-items:center; gap:28px; white-space:nowrap; }
.band-row span::after{ content:""; width:9px; height:9px; background:var(--acid); display:inline-block; }
@keyframes bandmove{ to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion: reduce){ .band-row{ animation:none; } }

/* ==========================================================================
   v6 — dotted paper instead of gridlines, with a slow breath
   ========================================================================== */
.ch-paper::after, .ch-paper-deep::after, .ch-mist::after{
  background-image:radial-gradient(rgba(17,22,19,.20) 1.4px, transparent 1.5px);
  background-size:26px 26px;
  background-position:center;
  mask-image:radial-gradient(75% 65% at 50% 45%, #000 10%, rgba(0,0,0,.35) 55%, transparent 88%);
  -webkit-mask-image:radial-gradient(75% 65% at 50% 45%, #000 10%, rgba(0,0,0,.35) 55%, transparent 88%);
  transform-origin:50% 45%;
  animation:breathe-dots 14s ease-in-out infinite;
  will-change:opacity, transform;
}
.ch-mist::after{ background-image:radial-gradient(rgba(17,22,19,.16) 1.4px, transparent 1.5px); }
@keyframes breathe-dots{
  0%,100%{ opacity:.55; transform:scale(1); }
  50%{ opacity:.95; transform:scale(1.035); }
}
/* the teal ground gets the same dotted paper, in light ink */
.ch-teal::before{
  background-image:radial-gradient(rgba(247,248,243,.26) 1.4px, transparent 1.5px);
  background-size:28px 28px;
  background-position:center;
  mask-image:radial-gradient(80% 70% at 50% 40%, #000 8%, rgba(0,0,0,.4) 55%, transparent 90%);
  -webkit-mask-image:radial-gradient(80% 70% at 50% 40%, #000 8%, rgba(0,0,0,.4) 55%, transparent 90%);
  transform-origin:50% 40%;
  animation:breathe-dots 16s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce){
  .ch-paper::after, .ch-paper-deep::after, .ch-mist::after, .ch-teal::before{ animation:none; opacity:.7; transform:none; }
}
/* softer dots */
.ch-paper::after, .ch-paper-deep::after{ background-image:radial-gradient(rgba(17,22,19,.13) 1.3px, transparent 1.4px); }
.ch-mist::after{ background-image:radial-gradient(rgba(17,22,19,.11) 1.3px, transparent 1.4px); }
@keyframes breathe-dots{
  0%,100%{ opacity:.45; transform:scale(1); }
  50%{ opacity:.8; transform:scale(1.03); }
}

/* ==========================================================================
   v7 — graphics instead of paragraphs (Circle, Who We Are, Who It's For, Plan)
   ========================================================================== */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,6vw,88px); align-items:center; }
@media (max-width: 900px){ .split{ grid-template-columns:1fr; gap:32px; } }
.diagram svg{ width:100%; height:auto; max-width:520px; display:block; margin-inline:auto; overflow:visible; }
.diagram .ring{ transform-origin:center; animation:ringspin 60s linear infinite; }
.diagram .ring.rev{ animation-duration:80s; animation-direction:reverse; }
@keyframes ringspin{ to{ transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce){ .diagram .ring{ animation:none; } }
.dg-cap{ margin-top:18px; font-size:12.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--moss); text-align:center; }

/* balance bars (Who We Are) */
.balance{ display:grid; gap:0; }
.bal{ display:grid; grid-template-columns:1fr 132px; gap:18px; align-items:center; padding:22px 0; border-top:1px solid rgba(247,248,243,.14); }
.bal:last-child{ border-bottom:1px solid rgba(247,248,243,.14); }
.bal h3{ font-size:clamp(20px,2.2vw,28px); }
.bal h3 span{ color:var(--acid); }
.bal-meter{ display:flex; flex-direction:column; gap:6px; }
.bal-meter i{ display:block; height:8px; background:var(--acid); width:100%; transform:scaleX(0); transform-origin:left; transition:transform 1s var(--ease-out); }
.bal.is-in .bal-meter i{ transform:scaleX(1); }
.bal-meter u{ display:block; height:8px; background:rgba(247,248,243,.16); width:46%; text-decoration:none; }
@media (max-width: 620px){ .bal{ grid-template-columns:1fr; gap:10px; } .bal-meter{ max-width:160px; } }

/* fit check (Who It's For) */
.fit{ margin-top:48px; display:grid; grid-template-columns:1.15fr 1fr; gap:clamp(28px,5vw,64px); align-items:start; }
@media (max-width: 900px){ .fit{ grid-template-columns:1fr; } }
.fit-list{ display:flex; flex-direction:column; }
.fit-item{ display:grid; grid-template-columns:34px 1fr; gap:14px; align-items:center; text-align:left; background:none; border:0; border-top:1px solid rgba(17,22,19,.12); padding:16px 0; font:inherit; cursor:pointer; color:inherit; }
.fit-item:first-child{ border-top:0; }
.fit-box{ width:34px; height:34px; border:1.5px solid rgba(17,22,19,.3); display:grid; place-items:center; transition:all .25s var(--ease); }
.fit-box::after{ content:""; width:13px; height:7px; border-left:2.5px solid var(--ink); border-bottom:2.5px solid var(--ink); transform:rotate(-45deg) scale(0); transition:transform .25s var(--ease-out); }
.fit-item[aria-pressed="true"] .fit-box{ background:var(--acid); border-color:var(--acid); }
.fit-item[aria-pressed="true"] .fit-box::after{ transform:rotate(-45deg) scale(1); }
.fit-item span{ font-size:17px; }
.fit-item[aria-pressed="true"] span{ font-weight:600; }
.fit-panel{ border:1px solid rgba(17,22,19,.16); background:#fff; padding:clamp(24px,3vw,36px); position:sticky; top:110px; }
.fit-score{ font-family:var(--serif); font-weight:600; font-size:clamp(44px,6vw,72px); line-height:1; }
.fit-score small{ font-size:16px; color:var(--moss); margin-left:6px; }
.fit-dots{ display:flex; gap:6px; margin:18px 0 20px; }
.fit-dots i{ width:100%; height:8px; background:rgba(17,22,19,.12); }
.fit-dots i.on{ background:var(--acid); }
.fit-verdict{ font-family:var(--serif); font-size:22px; font-weight:600; }
.fit-note{ margin-top:10px; color:var(--ink-soft); font-size:15px; }
.nots{ margin-top:64px; }
.nots-row{ display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; }
.not{ display:inline-flex; align-items:center; gap:9px; border:1px solid rgba(17,22,19,.2); padding:10px 16px; font-size:15px; color:var(--ink-soft); background:rgba(17,22,19,.02); }
.not::before{ content:"✕"; color:#B4461A; font-size:13px; font-weight:700; }
.ch-black .diagram svg{ max-width:660px; }
.form-error{ margin-top:18px; color:#B4461A; font-size:15px; }
.btn.is-sending{ opacity:.6; pointer-events:none; }

/* ==========================================================================
   GLOBAL REACH — rotating globe + connections
   ========================================================================== */
.globe-wrap{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,6vw,88px); align-items:center; }
@media (max-width: 900px){ .globe-wrap{ grid-template-columns:1fr; } }
.globe{ position:relative; }
.globe svg{ width:100%; max-width:560px; height:auto; display:block; margin-inline:auto; overflow:visible; }
.globe .grid-line{ fill:none; stroke:rgba(247,248,243,.18); stroke-width:1; }
.globe .spin{ transform-origin:260px 260px; animation:globespin 44s linear infinite; }
@keyframes globespin{ to{ transform:rotate(360deg); } }
.globe .city{ fill:var(--acid); }
.globe .halo{ fill:none; stroke:var(--acid); opacity:.8; transform-box:fill-box; transform-origin:center; animation:ping 3.2s ease-out infinite; }
@keyframes ping{ 0%{ r:4; opacity:.9; } 70%,100%{ r:19; opacity:0; } }
.globe .arc{ fill:none; stroke:var(--acid); stroke-width:1.4; stroke-dasharray:240; stroke-dashoffset:240; animation:draw 5s ease-in-out infinite; }
@keyframes draw{ 0%{ stroke-dashoffset:240; opacity:0; } 20%{ opacity:1; } 55%{ stroke-dashoffset:0; opacity:1; } 90%,100%{ stroke-dashoffset:-240; opacity:0; } }
@media (prefers-reduced-motion: reduce){ .globe .spin, .globe .halo, .globe .arc{ animation:none; } .globe .arc{ stroke-dashoffset:0; } }
.cities{ display:flex; flex-wrap:wrap; gap:8px; margin-top:28px; }
.city-chip{ border:1px solid rgba(247,248,243,.24); padding:8px 14px; font-size:14px; font-weight:600; display:inline-flex; gap:8px; align-items:center; }
.city-chip::before{ content:""; width:7px; height:7px; background:var(--acid); }
.gov{ margin-top:36px; display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(247,248,243,.14); border:1px solid rgba(247,248,243,.14); }
.gov div{ background:var(--ink); padding:22px 20px; }
.gov b{ display:block; font-family:var(--serif); font-size:17px; margin-bottom:6px; }
.gov p{ font-size:14px; color:rgba(247,248,243,.68); }
@media (max-width: 760px){ .gov{ grid-template-columns:1fr; } }

/* PHOTOGRAPHY */
.shot{ position:relative; overflow:hidden; background:var(--ink); }
.shot img{ display:block; width:100%; height:100%; object-fit:cover; filter:grayscale(1) contrast(1.12) brightness(.82); transition:filter .6s var(--ease), transform 1.2s var(--ease-out); }
.shot::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(17,22,19,.15), rgba(17,22,19,.75)); mix-blend-mode:multiply; pointer-events:none; }
.shot:hover img{ filter:grayscale(.55) contrast(1.08) brightness(.9); transform:scale(1.03); }
.shot-cap{ position:absolute; left:0; bottom:0; z-index:2; padding:16px 20px; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--paper); background:rgba(17,22,19,.55); backdrop-filter:blur(4px); }
.shot-tall{ aspect-ratio:4/5; }
.shot-wide{ aspect-ratio:16/9; }
.photo-split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,56px); align-items:center; }
@media (max-width: 800px){ .photo-split{ grid-template-columns:1fr; } }
.shot-tall{ aspect-ratio:7/10; }
.shot-tall img{ object-position:50% 35%; }

/* hero photo */
.hero-visual .hv-photo{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 42%; filter:grayscale(1) contrast(1.15) brightness(.78); transform:scale(1.02); transition:filter .8s var(--ease), transform 1.4s var(--ease-out); }
.hero-visual:hover .hv-photo{ filter:grayscale(.5) contrast(1.1) brightness(.88); transform:scale(1.05); }
.hero-visual .hv-frame{ background:
    linear-gradient(160deg, rgba(199,255,0,.16), transparent 45%),
    linear-gradient(0deg, rgba(17,22,19,.85) 0%, rgba(17,22,19,.15) 55%, rgba(17,22,19,.35) 100%),
    repeating-linear-gradient(115deg, rgba(247,248,243,.04) 0 1px, transparent 1px 34px);
  mix-blend-mode:normal; }
.hero-visual .hv-label{ z-index:2; }
@media (max-width: 900px){ .hero-visual .hv-photo{ object-position:52% 24%; } }

/* ==========================================================================
   MOBILE / TABLET OPTIMISATION
   ========================================================================== */
html{ -webkit-text-size-adjust:100%; }
@media (hover: none){
  *{ -webkit-tap-highlight-color:rgba(199,255,0,.25); }
  .shot:hover img, .hero-visual:hover .hv-photo{ transform:none; }
}
/* minimum legible type */
.splash-sub{ font-size:12px; }
.brandlock .accelerated{ font-size:12px; }
.hv-label, .hv-label strong{ font-size:12px; }
.tp-swipe{ font-size:12px; }
.shot-cap{ font-size:12px; }

/* touch targets */
@media (max-width: 1080px){
  .menu-toggle{ padding:12px; margin:-12px; min-height:44px; min-width:44px; align-items:center; justify-content:center; }
  .mobile-nav-close{ padding:12px 16px; min-height:44px; }
  .mobile-nav-links a{ padding:10px 0; }
  .footer-links a{ display:inline-flex; align-items:center; min-height:44px; }
  .interest button, .fit-item, .vb-chip, .rm-stage, .tp-stage{ min-height:44px; }
}
@media (max-width: 560px){
  .hero-actions{ width:100%; }
  .hero-actions .btn{ flex:1 1 100%; justify-content:center; }
  .lab-actions .btn{ flex:1 1 100%; justify-content:center; }
  .interest{ flex-direction:column; align-items:stretch; }
  .interest button{ width:100%; justify-content:center; }
  .band-row span{ font-size:17px; padding:0 18px; gap:18px; }
  .health-quote{ font-size:clamp(28px,8.4vw,44px); }
  .fit-panel{ position:static; }
  .tp-detail{ padding:22px; }
  .rm-panel > div{ padding:22px; }
  .gov div{ padding:18px; }
  .dep, .lab-read{ padding:22px; }
}
/* tablet: two columns rather than one where it reads better */
@media (min-width: 640px) and (max-width: 1000px){
  .kpis, .cards3, .arena-formats, .facts-grid, .measures, .gov{ grid-template-columns:1fr 1fr; }
  .health-grid{ grid-template-columns:1fr 1fr; }
}
/* stop long words breaking the grid on narrow screens */
@media (max-width: 560px){
  h1, h2, h3, .h-hero, .h-display, .h-mega, .h-section{ overflow-wrap:anywhere; hyphens:auto; }
}
.hero-visual .hv-label span, .hero-visual .hv-label strong{ font-size:12px; }
@media (max-width: 1080px){
  .text-link{ display:inline-flex; align-items:center; min-height:44px; }
  .mobile-nav-cta{ min-height:48px; }
}

/* photos: alive by default, no hover needed; fit the whole frame */
.hero-visual .hv-photo{ object-fit:cover; object-position:50% 46%; filter:grayscale(.35) contrast(1.06) brightness(.95) saturate(.9); transform:none; }
.hero-visual:hover .hv-photo{ filter:grayscale(.15) contrast(1.06) brightness(1) saturate(1); transform:none; }
.hero-visual .hv-frame{ background:
    linear-gradient(160deg, rgba(199,255,0,.10), transparent 42%),
    linear-gradient(0deg, rgba(17,22,19,.78) 0%, rgba(17,22,19,0) 48%),
    repeating-linear-gradient(115deg, rgba(247,248,243,.03) 0 1px, transparent 1px 34px); }
.shot img{ filter:grayscale(.35) contrast(1.06) brightness(.95) saturate(.9); transform:none; }
.shot:hover img{ filter:grayscale(.15) contrast(1.06) brightness(1) saturate(1); transform:none; }
.shot::after{ background:linear-gradient(180deg, rgba(17,22,19,.05), rgba(17,22,19,.6)); }
@media (max-width: 900px){ .hero-visual .hv-photo{ object-position:50% 34%; } }
.hero-visual .hv-photo{ filter:grayscale(.45) contrast(1.06) brightness(.92) saturate(.85); }
.hero-visual:hover .hv-photo{ filter:grayscale(.2) contrast(1.06) brightness(1) saturate(1); }

/* THE ROOM diagram */
.room-diagram svg{ width:100%; max-width:760px; height:auto; display:block; margin-inline:auto; overflow:visible; font-family:"Inter",Arial,sans-serif; }
.room-diagram .node text{ fill:var(--ink-soft); }
.room-diagram .node.in text{ fill:var(--ink); font-weight:600; }
.room-diagram .node.out text{ fill:var(--moss); }
.room-lists{ display:none; }
.room-head{ font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--moss); margin:24px 0 12px; }
.room-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.rc{ border:1px solid rgba(17,22,19,.2); padding:8px 13px; font-size:14px; font-weight:600; }
.rc.in{ background:var(--acid); border-color:var(--acid); color:var(--ink); }
.rc.out{ color:var(--ink-soft); font-weight:500; }
@media (max-width: 860px){
  .room-diagram{ display:none; }
  .room-lists{ display:block; }
  .dg-cap{ text-align:left; }
}

/* platform strip */
.platform{ margin-top:clamp(48px,6vw,80px); display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(17,22,19,.14); border:1px solid rgba(17,22,19,.14); }
.ch-black .platform, .ch-teal .platform{ background:rgba(247,248,243,.14); border-color:rgba(247,248,243,.14); }
.platform > div{ background:var(--paper); padding:28px 24px; }
.ch-black .platform > div{ background:var(--ink); }
.platform b{ display:block; font-family:var(--serif); font-size:19px; margin-bottom:8px; }
.platform p{ font-size:14.5px; color:var(--ink-soft); }
.ch-black .platform p{ color:rgba(247,248,243,.68); }
@media (max-width: 860px){ .platform{ grid-template-columns:1fr; } }
.room{ margin:clamp(40px,6vw,72px) 0 0; }
.room-diagram svg{ max-width:1000px; }
.circle-intro-h1, #the-circle h1{ max-width:22ch; }

/* rotating rings; each dot+label is one rigid unit that counter-rotates together,
   so a label's position relative to its own dot never drifts as the ring turns */
.room-diagram .ring{ transform-origin:450px 450px; }
.room-diagram .lbl{ font-size:15px; }
.room-diagram .ring-in .lbl{ font-size:17px; font-weight:600; }
.room-diagram .ring-in{ animation:ringspin-cw 60s linear infinite; }
.room-diagram .ring-out{ animation:ringspin-ccw 90s linear infinite; }
.room-diagram .ring-in .ring-item{ animation:ringspin-ccw 60s linear infinite; }
.room-diagram .ring-out .ring-item{ animation:ringspin-cw 90s linear infinite; }
.room-diagram .avatar circle{ stroke:var(--paper); stroke-width:2; }
@keyframes ringspin-cw{ from{ transform:rotate(0deg); } to{ transform:rotate(360deg); } }
@keyframes ringspin-ccw{ from{ transform:rotate(0deg); } to{ transform:rotate(-360deg); } }
@media (prefers-reduced-motion: reduce){ .room-diagram .ring, .room-diagram .ring-item{ animation:none; } }

/* headlines: never hyphenate or split words mid-way on small screens */
@media (max-width: 560px){
  h1, h2, h3, .h-hero, .h-display, .h-mega, .h-section, .health-quote{
    overflow-wrap:normal; word-break:normal; hyphens:none; -webkit-hyphens:none;
  }
  .health-quote{ font-size:clamp(26px,7.2vw,40px); line-height:1.04; }
}

/* ==========================================================================
   VENUES — where the circle meets
   ========================================================================== */
.venues{ margin-top:clamp(40px,5vw,64px); display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
@media (max-width: 1100px){ .venues{ grid-template-columns:1fr 1fr; } }
@media (max-width: 620px){ .venues{ grid-template-columns:1fr; } }
.venue{ position:relative; display:flex; flex-direction:column; background:var(--ink); color:var(--paper); border:1px solid rgba(247,248,243,.14); overflow:hidden; transition:transform .4s var(--ease-out), border-color .3s; }
.venue:hover{ transform:translateY(-6px); border-color:var(--acid); }
.venue-shot{ position:relative; aspect-ratio:4/3; overflow:hidden; background:linear-gradient(150deg,#1B241E,#0C120E); }
.venue-shot img{ width:100%; height:100%; object-fit:cover; display:block; filter:grayscale(.4) brightness(.85) contrast(1.06); transition:filter .5s var(--ease), transform 1s var(--ease-out); }
.venue:hover .venue-shot img{ filter:grayscale(.15) brightness(.95); transform:scale(1.04); }
.venue-shot .placeholder{ position:absolute; inset:0; display:grid; place-items:center; }
.venue-shot .placeholder svg{ width:100%; height:100%; }
.venue-shot::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(17,22,19,0) 40%, rgba(17,22,19,.8)); }
.venue-tag{ position:absolute; top:14px; left:14px; z-index:2; font-family:var(--serif); font-weight:600; font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; background:rgba(17,22,19,.72); border:1px solid rgba(247,248,243,.24); color:var(--paper); padding:5px 10px; backdrop-filter:blur(4px); }
.venue.is-elite .venue-tag{ background:var(--acid); color:var(--ink); border-color:var(--acid); }
.venue-body{ padding:22px 22px 24px; display:flex; flex-direction:column; gap:10px; flex:1; }
.venue-body h3{ font-size:22px; line-height:1.1; }
.venue-body .addr{ font-size:14px; color:rgba(247,248,243,.66); font-style:normal; line-height:1.6; }
.venue-body .note{ font-size:14px; color:rgba(247,248,243,.78); }
.venue-body .venue-link{ margin-top:auto; padding-top:16px; display:inline-flex; align-items:center; gap:8px; font-size:13.5px; font-weight:600; color:var(--acid); min-height:44px; }
.venue-body .venue-link svg{ width:14px; height:14px; stroke:currentColor; }
.venue.is-elite{ background:linear-gradient(180deg, #16281C 0%, var(--ink) 55%); }
.venue.is-elite h3 span{ display:block; color:var(--acid); }

/* ==========================================================================
   CHALLENGE YOURSELF
   ========================================================================== */
.challenge{ position:relative; overflow:hidden; background:var(--ink); color:var(--paper); padding:clamp(80px,10vw,150px) 0; }
.challenge::before{ content:""; position:absolute; inset:-20% -10%; background:
    repeating-linear-gradient(-58deg, rgba(199,255,0,.06) 0 2px, transparent 2px 26px);
  pointer-events:none; }
.challenge > *{ position:relative; }
.challenge-head{ display:grid; grid-template-columns:1.1fr 1fr; gap:clamp(28px,5vw,80px); align-items:end; }
@media (max-width: 900px){ .challenge-head{ grid-template-columns:1fr; } }
.challenge h2{ font-family:var(--serif); text-transform:uppercase; font-size:clamp(38px,6.4vw,90px); line-height:.94; letter-spacing:-.04em; max-width:12ch; }
.challenge h2 span{ display:block; color:var(--acid); }
.proofs{ margin-top:clamp(40px,5vw,72px); display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
@media (max-width: 900px){ .proofs{ grid-template-columns:1fr; } }
.proof{ border:1px solid rgba(247,248,243,.16); background:rgba(247,248,243,.03); overflow:hidden; display:flex; flex-direction:column; }
.proof-shot{ aspect-ratio:3/2; position:relative; background:linear-gradient(150deg,#1B241E,#0C120E); overflow:hidden; }
.proof-shot img{ width:100%; height:100%; object-fit:cover; display:block; filter:grayscale(.35) brightness(.9); }
.proof-shot svg{ width:100%; height:100%; }
.proof-body{ padding:22px; }
.proof-body b{ display:block; font-family:var(--serif); font-size:20px; margin-bottom:8px; }
.proof-body p{ font-size:14.5px; color:rgba(247,248,243,.7); }
.proof-body .kick{ font-size:11.5px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--acid); display:block; margin-bottom:10px; }
.challenge-lines{ margin-top:clamp(36px,4vw,56px); display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(247,248,243,.14); border:1px solid rgba(247,248,243,.14); }
.challenge-lines div{ background:var(--ink); padding:24px 22px; font-size:15px; color:rgba(247,248,243,.75); }
.challenge-lines b{ display:block; font-family:var(--serif); font-size:17px; color:var(--paper); margin-bottom:6px; }
@media (max-width: 760px){ .challenge-lines{ grid-template-columns:1fr; } }

/* apply page: close the gap between the hero and the form */
.apply-hero{ padding-bottom:clamp(48px,6vw,80px); }
.apply-form-section{ padding-top:clamp(40px,5vw,64px); }
.app-form{ margin-top:0; }
.app-success{ padding-top:clamp(64px,8vw,120px); }

/* mobile nav: never rely on transform alone to hide the panel */
.mobile-nav{ visibility:hidden; opacity:0; pointer-events:none;
  transition:transform .5s var(--ease-out), opacity .3s var(--ease-out), visibility 0s linear .5s; }
.mobile-nav.is-open{ visibility:visible; opacity:1; pointer-events:auto;
  transition:transform .5s var(--ease-out), opacity .3s var(--ease-out), visibility 0s; }
/* contain any stray horizontal overflow without clipping the page itself */
main, .site-footer{ overflow-x:clip; }
/* keep every label at a legible size */
.venue-tag, .proof-body .kick, .challenge-lines b, .dg-cap{ font-size:12px; }

/* mobile hero: headline first, and show the whole photo */
@media (max-width: 900px){
  .hero-visual{ aspect-ratio:4/5; order:0; margin-top:36px; }
  .hero-visual .hv-photo{ object-position:50% 50%; }
  .hero-copy{ order:-1; }
  .hero-visual .hv-label{ bottom:18px; left:18px; right:18px; }
}
@media (max-width: 560px){
  .hero{ padding-top:104px; }
  .hero-visual{ aspect-ratio:3/4; }
}