/* The Credit Gym - design system. Hand-written, no framework.
   Palette: warm bone paper, deep club green, rep green, gold. */

/* ---------- tokens ---------- */
:root{
  /* primitives */
  --bone:#FAF7F0; --bone-2:#F2EDE1; --bone-3:#EAE3D2;
  --ink-raw:#0D1F16; --club-raw:#0E3222; --club-hi:#175236;
  --green-raw:#2FC666; --green-deep-raw:#0F7A3D; --gold-raw:#F6AE2D; --gold-deep-raw:#8A5B00;
  /* semantic */
  --surface:var(--bone); --surface-alt:var(--bone-2);
  --surface-dark:var(--club-raw); --surface-ink:var(--ink-raw);
  --text:#1B2A21; --text-soft:#516358; --text-inverse:#F4F8F2; --text-inverse-soft:#B9CEC0;
  --accent:var(--green-raw); --accent-text:var(--green-deep-raw);
  --accent-2:var(--gold-raw); --accent-2-text:var(--gold-deep-raw);
  /* headline colour pop: the logo's own yellow (#F8C020, sampled from logo-520.png) on dark
     surfaces - same family as the buttons - and a darkened version of it on cream so it stays legible */
  --pop:#F8C020; --pop-text:#8A5B00;
  --line:rgba(14,50,34,.16); --line-inverse:rgba(244,248,242,.16);
  /* component */
  --btn-radius:999px; --card-radius:20px; --field-radius:14px;
  --btn-grad:linear-gradient(180deg,#FFC552 0%,var(--gold-raw) 55%,#E89C14 100%);
  --btn-ink:#231802;
  --btn2-grad:linear-gradient(180deg,#1E9A4E 0%,#127A3B 60%,#0E6330 100%);
  --shadow-1:0 1px 2px rgba(13,31,22,.08),0 6px 18px rgba(13,31,22,.09);
  --shadow-2:0 2px 4px rgba(13,31,22,.10),0 16px 40px rgba(13,31,22,.16);
  --wrap:1240px;
  --sec-pad:clamp(4rem,8vw,8.75rem);
  --ease-out:cubic-bezier(.16,1,.3,1); --ease-io:cubic-bezier(.65,0,.35,1);
  --t-fast:160ms; --t-med:260ms;
}

/* ---------- fonts ---------- */
@font-face{font-family:'Orbitron';src:url('/assets/fonts/orbitron-900.woff2') format('woff2');
  font-weight:900;font-display:swap;}
@font-face{font-family:'Bricolage Grotesque';src:url('/assets/fonts/bricolage-latin.woff2') format('woff2');
  font-weight:300 800;font-stretch:75% 100%;font-display:swap;}
@font-face{font-family:'Instrument Sans';src:url('/assets/fonts/instrument-latin.woff2') format('woff2');
  font-weight:400 700;font-display:swap;}
@font-face{font-family:'Bricolage Fallback';src:local('Arial Bold'),local('Helvetica Neue Bold');size-adjust:98%;ascent-override:94%;}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{font-family:'Instrument Sans',-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  font-size:clamp(1rem,.97rem + .15vw,1.125rem);line-height:1.65;color:var(--text);
  background:var(--surface);-webkit-font-smoothing:antialiased}
img,video,svg{max-width:100%;display:block}
a{color:var(--accent-text)}
::selection{background:var(--green-raw);color:#06180E}
:focus-visible{outline:3px solid var(--green-raw);outline-offset:3px;border-radius:4px}
[id]{scroll-margin-top:118px}
button{font:inherit}

h1,h2,h3,h4,h5,h6{font-family:'Orbitron','Bricolage Grotesque','Bricolage Fallback',Arial,sans-serif;font-weight:900;
  line-height:1.12;letter-spacing:-.022em;text-wrap:balance;color:inherit;font-weight:700}
h1{font-size:clamp(2.5rem,1.6rem + 3.2vw,4.5rem);line-height:1.05}
h2{font-size:clamp(1.9rem,1.4rem + 1.8vw,3rem);line-height:1.14}
h3{font-size:clamp(1.35rem,1.15rem + .9vw,1.9rem);line-height:1.22}
h4{font-size:clamp(1.1rem,1rem + .4vw,1.3rem)}
p{max-width:66ch}
.lede{font-family:'Orbitron','Bricolage Grotesque',Arial,sans-serif;font-weight:900;
  font-size:clamp(.98rem,.92rem + .4vw,1.15rem);line-height:1.7;letter-spacing:-.015em;
  color:var(--text-soft);max-width:56ch}
.num,[data-count]{font-variant-numeric:tabular-nums}
/* Headline pop: ONE metallic gold, identical on every page and every surface, matched to the
   logo and animated. On light sections it carries the logo's own dark outline so the bright
   gold stays readable on cream instead of being dulled to brown. */
.hl,.shimmer{font-style:normal;
  background-image:linear-gradient(100deg,#D9A014 0%,#F8C020 15%,#FFF3BE 28%,#F8C020 42%,
    #D9A014 58%,#F8C020 74%,#FFF3BE 86%,#D9A014 100%);
  background-size:280% 100%;background-position:0 50%;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
  -webkit-text-stroke:0;
  filter:drop-shadow(0 1px 0 rgba(14,50,34,.28));
  animation:hl-sheen 7s linear infinite}
@keyframes hl-sheen{0%{background-position:0 50%}100%{background-position:200% 50%}}
/* Owner decision: the gold sheen and the hero videos run on every device, including when
   Reduce Motion is on. Large scroll translations still respect it (see [data-reveal]). */
@supports not ((-webkit-background-clip:text) or (background-clip:text)){
  .hl,.shimmer{background-image:none;-webkit-text-fill-color:currentColor;color:var(--pop);-webkit-text-stroke:0;filter:none}
}
.wrap{width:min(var(--wrap),100% - 2.5rem);margin-inline:auto}
.skip{position:absolute;left:-999px;top:0;background:var(--ink-raw);color:#fff;padding:.7rem 1.2rem;z-index:200;border-radius:0 0 10px 0}
.skip:focus{left:0}

/* ---------- reveal (gated behind .js so no-JS never hides content) ---------- */
@media (max-width:640px){.js [data-reveal]{transform:translateY(12px)}}
.js [data-reveal]{opacity:0;transform:translateY(18px);
  transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
.js [data-reveal][data-shown]{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .js [data-reveal]{opacity:1;transform:none;transition:none}
}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  min-height:54px;padding:.9rem 2.1rem;border-radius:var(--btn-radius);
  font-weight:600;font-size:1.02rem;text-decoration:none;border:0;cursor:pointer;
  position:relative;overflow:hidden;isolation:isolate;
  background:var(--btn-grad);color:var(--btn-ink);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 1px 2px rgba(13,31,22,.18),0 8px 22px rgba(230,156,20,.28);
  transition:transform var(--t-fast) var(--ease-out),box-shadow var(--t-fast) var(--ease-out)}
.btn svg{width:21px;height:21px;flex:none}
.btn::after{content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);
  transform:translateX(-130%);}
@media (hover:hover) and (pointer:fine){
  .btn:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 2px 4px rgba(13,31,22,.18),0 12px 28px rgba(230,156,20,.38)}
  .btn:hover::after{transition:transform .6s var(--ease-io);transform:translateX(130%)}
}
.btn:focus-visible::after{transition:transform .6s var(--ease-io);transform:translateX(130%)}
.btn:active{transform:translateY(1px);transition-duration:80ms}
.btn--green{background:var(--btn2-grad);color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 1px 2px rgba(13,31,22,.2),0 8px 22px rgba(15,90,48,.3)}
@media (hover:hover) and (pointer:fine){
  .btn--green:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 2px 4px rgba(13,31,22,.2),0 12px 28px rgba(15,90,48,.4)}
}
.btn--ghost{background:transparent;color:currentColor;
  box-shadow:inset 0 0 0 1.5px currentColor;}
@media (hover:hover) and (pointer:fine){
  .btn--ghost:hover{box-shadow:inset 0 0 0 2px currentColor;transform:translateY(-1px)}
}
.btn--sm{min-height:46px;padding:.55rem 1.4rem;font-size:.95rem}
.btn:disabled{background:var(--bone-3);color:#7d8a80;box-shadow:none;cursor:not-allowed}

/* ---------- header ---------- */
.hdr{position:fixed;inset:0 0 auto 0;z-index:100;height:96px;display:flex;align-items:center;
  color:#fff;transition:background-color var(--t-med) ease,box-shadow var(--t-med) ease,color var(--t-med) ease}
.hdr .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.hdr[data-stuck]{background:rgba(250,247,240,.86);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  color:var(--text);box-shadow:0 1px 0 var(--line)}
.hdr[data-light]{color:var(--text)}
.hdr[data-light] .hdr-tel,.hdr[data-light] .nav a{color:var(--text)}
.hdr[data-light]:not([data-stuck]){background:transparent}
.brand{display:inline-flex;align-items:center}
.brand-img{width:232px;height:auto}
.nav{display:flex;gap:1.7rem}
.nav a{font-size:15.5px;font-weight:500;text-decoration:none;color:currentColor;position:relative;padding:.4rem 0}
.nav a::after{content:'';position:absolute;left:0;right:100%;bottom:0;height:2px;background:var(--accent-2-text);
  transition:right var(--t-med) var(--ease-out)}
.nav a:hover::after,.nav a[aria-current]::after{right:0}
.hdr:not([data-light]):not([data-stuck]) .nav a::after{background:var(--accent-2)}
.hdr-cta{display:flex;align-items:center;gap:1.1rem}
/* mobile: the header CTA had an icon forcing the label onto two lines and doubling
   the button height. Icon hidden, label kept on one line. */
@media (max-width:640px){
  .hdr-cta .btn--sm svg{display:none}
  .hdr-cta .btn--sm{padding:.55rem 1.05rem;min-height:42px;gap:0;white-space:nowrap;font-size:.94rem}
  .hdr-cta{gap:.5rem}
}

.hdr-tel{display:inline-flex;align-items:center;gap:.45rem;font-weight:600;font-size:.98rem;
  color:currentColor;text-decoration:none;white-space:nowrap}
.hdr-tel svg{width:19px;height:19px}
.burger{display:none;background:none;border:0;color:currentColor;width:48px;height:48px;
  align-items:center;justify-content:center;cursor:pointer;border-radius:12px}
.burger svg{width:26px;height:26px}
@media (max-width:1120px){
  .nav{display:none}
  .burger{display:inline-flex}
  .hdr-tel{display:none}
  .hdr{height:84px}
  .brand-img{width:176px}
}
@media (max-width:430px){
  .hdr .btn--sm{display:none}
}

/* ---------- drawer ---------- */
.drawer{position:fixed;inset:0;z-index:150;background:var(--club-raw);color:var(--text-inverse);
  display:flex;flex-direction:column;transform:translateX(102%);visibility:hidden;
  transition:transform .38s var(--ease-out),visibility 0s .38s}
.drawer[data-open]{transform:none;visibility:visible;transition:transform .38s var(--ease-out)}
.drawer-top{display:flex;align-items:center;justify-content:space-between;padding:.85rem 1.25rem;
  border-bottom:1px solid var(--line-inverse)}
.drawer-top .brand-img{width:176px}
.drawer-body{flex:1;overflow:auto;display:flex;flex-direction:column;padding:.7rem 1.25rem}
.drawer-body a{color:var(--text-inverse);text-decoration:none;font-size:1.15rem;font-weight:600;
  min-height:52px;display:flex;align-items:center;border-bottom:1px solid rgba(244,248,242,.08)}
.drawer-body a[aria-current]{color:var(--green-raw)}
.drawer-foot{display:grid;gap:.7rem;padding:1rem 1.25rem calc(1.2rem + env(safe-area-inset-bottom))}

/* ---------- hero ---------- */
/* Hero: same tall size on every page, video filling it wall to wall with no border.
   object-fit:cover guarantees zero letterbox/pillarbox at any viewport ratio. */
.hero,.hero--page{position:relative;min-height:90svh;display:flex;flex-direction:column;
  justify-content:center;color:#fff;overflow:hidden;background:var(--club-raw)}
@media (max-width:767px){.hero,.hero--page{min-height:84svh}}
.vid-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;
  width:74px;height:74px;border-radius:50%;border:0;cursor:pointer;
  background:rgba(9,26,18,.62);box-shadow:0 0 0 2px rgba(248,192,32,.9),0 8px 30px rgba(0,0,0,.4)}
.vid-play span{display:block;width:0;height:0;margin:0 auto;transform:translateX(3px);
  border-left:22px solid #F8C020;border-top:14px solid transparent;border-bottom:14px solid transparent}
.hero-media{position:absolute;inset:0}
.hero-media img,.hero-media video{width:100%;height:100%;object-fit:cover;display:block}
.hero-veil{position:absolute;inset:0;
  background:
    linear-gradient(to bottom,rgba(9,26,18,.72) 0%,rgba(9,26,18,.28) 16%,rgba(9,26,18,0) 30%),
    linear-gradient(to top,rgba(9,26,18,.94) 0%,rgba(9,26,18,.74) 34%,rgba(9,26,18,.6) 62%,rgba(9,26,18,.6) 100%)}
/* Hero headline: ALWAYS contained inside the hero copy column, wrapping onto as many
   lines as it needs. No nowrap anywhere - it is what pushed long headlines off-screen.
   The skew echoes the logo's italic lean; it is scoped to the hero so no card can clip it. */
.hero h1{max-width:100%;margin-inline:auto;text-wrap:balance;overflow-wrap:break-word;
  white-space:normal;hyphens:none;transform:skewX(-8deg)}
.hero-in{position:relative;padding:132px 0 0;display:flex;flex-direction:column;align-items:center;text-align:center}
.hero--page .hero-in{padding-top:120px}
.hero-copy{max-width:56rem;display:flex;flex-direction:column;align-items:center;gap:1.5rem}
.hero-copy .lede{color:#D8E5DB;margin-inline:auto}
.actions{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center}
.hero-rail{position:relative;margin-top:clamp(2.5rem,6vh,4.5rem);border-top:1px solid rgba(244,248,242,.18);
  background:linear-gradient(to top,rgba(7,20,14,.55),rgba(7,20,14,0));-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.hero-rail .wrap{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;padding:1.1rem 0 1.25rem}
.rail-stat{display:flex;flex-direction:column;align-items:center;gap:.15rem;text-align:center}
.rail-stat b{font-family:'Orbitron','Bricolage Grotesque',Arial,sans-serif;font-weight:900;font-size:clamp(1.5rem,1.2rem + 1.4vw,2.2rem);
  font-weight:750;letter-spacing:-.02em;line-height:1;color:#fff}
.rail-stat b i{font-style:normal;color:var(--gold-raw)}
.rail-stat > span{font-size:.86rem;color:#C4D6C8;letter-spacing:.02em}
.rail-stat b i{font-size:.5em;font-weight:700;letter-spacing:.01em;margin-left:.14em;vertical-align:.06em}
@media (max-width:640px){
  .hero-rail .wrap{grid-template-columns:repeat(3,1fr);gap:.5rem;padding:1rem 0}
  .rail-stat{gap:.2rem}
  .rail-stat b{font-size:1.5rem}
  .rail-stat > span{font-size:.72rem;line-height:1.3;text-wrap:balance}
}
@media (max-width:380px){
  .hero-rail .wrap{grid-template-columns:1fr;gap:.55rem}
  .rail-stat{flex-direction:row;justify-content:center;align-items:baseline;gap:.55rem}
  .rail-stat > span{font-size:.8rem}
}
.shimmer.is-static{background-image:none;-webkit-text-fill-color:currentColor;color:var(--pop);filter:none}

/* ---------- sections ---------- */
.section{padding-block:var(--sec-pad);position:relative}
.t-paper{background:var(--bone)}
.t-shade{background:linear-gradient(180deg,var(--bone-2) 0%,var(--bone) 100%)}
.t-shade-rev{background:linear-gradient(180deg,var(--bone) 0%,var(--bone-2) 100%)}
.t-dark{background:
  radial-gradient(90% 70% at 18% 0%,rgba(47,198,102,.14) 0%,transparent 55%),
  radial-gradient(80% 60% at 90% 100%,rgba(246,174,45,.10) 0%,transparent 50%),
  linear-gradient(165deg,#11402B 0%,var(--club-raw) 55%,#0A2418 100%);
  color:var(--text-inverse)}
.t-dark .lede,.t-dark p{color:var(--text-inverse-soft)}
.t-mid{background:linear-gradient(180deg,#F5F1E6 0%,#EFE9DA 100%)}
.sec-head{max-width:47rem;margin-bottom:clamp(2.2rem,4.5vw,3.8rem)}
.sec-head--center{margin-inline:auto;text-align:center}
.sec-head .lede{margin-top:1rem}
.sec-head--center .lede{margin-inline:auto}
.edge{position:absolute;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--green-raw),var(--gold-raw));opacity:.55}
.edge--top{top:0}

/* ---------- cards & grids ---------- */
.card{background:#fff;border-radius:var(--card-radius);box-shadow:var(--shadow-1);
  padding:1.9rem;position:relative;overflow:hidden;
  transition:transform var(--t-med) var(--ease-out),box-shadow var(--t-med) var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .card--hov:hover{transform:translateY(-2px);box-shadow:var(--shadow-2)}
}
.t-dark .card{background:rgba(250,247,240,.055);box-shadow:inset 0 0 0 1px var(--line-inverse)}
.prog-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:1.4rem}
.prog-grid > *{min-width:0}
.prog-grid .card{display:flex;flex-direction:column;gap:.85rem;
  transition:transform var(--t-med) var(--ease-out),box-shadow var(--t-med) var(--ease-out),
    border-color var(--t-med) var(--ease-out)}
/* even out the row so no card leaves a dead gap under its text */
.prog-grid{align-items:stretch}
.prog-grid .card p{margin-bottom:auto}
@media (hover:hover) and (pointer:fine){
  .prog-grid .card:hover{transform:translateY(-3px);
    box-shadow:0 2px 4px rgba(13,31,22,.10),0 18px 44px rgba(13,31,22,.20)}
  .prog-grid .card:hover .ico-plate{transform:translateY(-1px) scale(1.04)}
  .prog-grid .card:hover .ico-plate svg{color:var(--pop)}
}
.prog-grid .ico-plate{transition:transform var(--t-med) var(--ease-out)}
.prog-grid .ico-plate svg{transition:color var(--t-med) var(--ease-out)}
.prog-hero{grid-column:span 7;padding:0;display:grid;grid-template-rows:auto 1fr}
.prog-hero .card-img{aspect-ratio:16/8.5;overflow:hidden}
.prog-hero .card-body{padding:1.9rem;display:flex;flex-direction:column;gap:.85rem}
.prog-side{grid-column:span 5}
.prog-wide{grid-column:span 6}
@media (max-width:900px){
  .prog-hero,.prog-side,.prog-wide{grid-column:span 12}
}
.card-img{border-radius:0;position:relative}
.card-img{min-width:0}
.card-img img{width:100%;max-width:100%;height:100%;object-fit:cover;
  transition:transform .8s var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .card--hov:hover .card-img img{transform:scale(1.05)}
}
.card h3 a{color:inherit;text-decoration:none}
.card h3 a::after{content:'';position:absolute;inset:0}
.card-link{margin-top:auto;display:inline-flex;align-items:center;gap:.4rem;font-weight:600;color:var(--accent-text);font-size:.98rem}
.card-link svg{width:18px;height:18px;transition:transform var(--t-fast) var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .card--hov:hover .card-link svg{transform:translateX(4px)}
}
.ico-plate{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;flex:none;
  background:linear-gradient(160deg,#EAF7EE 0%,#DDF0E2 100%);box-shadow:inset 0 0 0 1px rgba(15,122,61,.16);position:relative}
.ico-plate svg{width:30px;height:30px;color:var(--green-deep-raw)}
.ico-plate::after{content:'';position:absolute;right:9px;bottom:9px;width:8px;height:8px;
  background:var(--gold-raw);clip-path:polygon(0 0,55% 0,100% 50%,55% 100%,0 100%,45% 50%);opacity:.9}
.t-dark .ico-plate{background:linear-gradient(160deg,rgba(47,198,102,.16),rgba(47,198,102,.05));
  box-shadow:inset 0 0 0 1px rgba(47,198,102,.3)}
.t-dark .ico-plate svg{color:var(--green-raw)}

/* ---------- split layouts ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.split > *{min-width:0}
.split--wide-l{grid-template-columns:1.15fr .85fr}
.split--wide-r{grid-template-columns:.85fr 1.15fr}
@media (max-width:900px){.split,.split--wide-l,.split--wide-r{grid-template-columns:1fr}}
.frame{border-radius:var(--card-radius);overflow:hidden;box-shadow:var(--shadow-2);position:relative}
.split--even{align-items:stretch}
.split--even .frame{aspect-ratio:4/3}
.split--even .frame img{width:100%;height:100%;object-fit:cover}
.frame img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease-out)}
@media (hover:hover) and (pointer:fine){.frame:hover img{transform:scale(1.045)}}
.frame--tilt{transform:rotate(-1.2deg)}
.frame-tag{position:absolute;left:1rem;bottom:1rem;background:rgba(9,26,18,.78);color:#fff;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  padding:.55rem .95rem;border-radius:12px;font-size:.88rem;font-weight:600;display:flex;align-items:center;gap:.5rem}
.frame-tag svg{width:16px;height:16px;color:var(--gold-raw)}

/* ---------- checklist ---------- */
.ticks{display:grid;gap:.85rem;list-style:none}
.ticks li{display:flex;gap:.8rem;align-items:flex-start}
.ticks svg{width:22px;height:22px;flex:none;margin-top:.15rem;color:var(--green-deep-raw)}
.t-dark .ticks svg{color:var(--green-raw)}

/* ---------- process diagram ---------- */
.steps{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:1.3rem;counter-reset:step}
.steps--3{grid-template-columns:repeat(3,1fr)}
.steps--3::before{left:calc(16.6% + 30px);right:calc(16.6% + 30px)}
.step{min-width:0}
.step b,.step p,.step small{min-width:0;overflow-wrap:anywhere}
.steps::before{content:'';position:absolute;top:29px;left:calc(12.5% + 30px);right:calc(12.5% + 30px);height:2px;
  background:repeating-linear-gradient(90deg,var(--line) 0 10px,transparent 10px 18px);
  background-size:18px 100%;animation:flow-dash 1.1s linear infinite}
/* a data packet travelling along the connector, step 1 -> 3 */
.steps::after{content:'';position:absolute;top:28px;left:calc(12.5% + 30px);right:calc(12.5% + 30px);height:4px;
  border-radius:4px;pointer-events:none;
  background:linear-gradient(90deg,transparent 0%,rgba(248,192,32,0) 38%,#F8C020 46%,#FFF3BE 50%,#F8C020 54%,rgba(248,192,32,0) 62%,transparent 100%);
  background-size:260% 100%;background-repeat:no-repeat;
  filter:drop-shadow(0 0 6px rgba(248,192,32,.65));
  animation:flow-packet 3.6s cubic-bezier(.55,0,.45,1) infinite}
.steps--3::after{left:calc(16.6% + 30px);right:calc(16.6% + 30px)}
@keyframes flow-dash{to{background-position:-18px 0}}
@keyframes flow-packet{0%{background-position:-60% 0}55%,100%{background-position:160% 0}}
/* each node lights up as the packet reaches it */
.steps .step:nth-child(1) .step-dot{animation:node-pulse 3.6s ease-in-out infinite}
.steps .step:nth-child(2) .step-dot{animation:node-pulse 3.6s ease-in-out infinite .55s}
.steps .step:nth-child(3) .step-dot{animation:node-pulse 3.6s ease-in-out infinite 1.1s}
.steps .step:nth-child(4) .step-dot{animation:node-pulse 3.6s ease-in-out infinite 1.65s}
@keyframes node-pulse{
  0%,72%,100%{box-shadow:0 0 0 1.5px rgba(15,122,61,.3),var(--shadow-1)}
  8%{box-shadow:0 0 0 2px rgba(248,192,32,.95),0 0 18px 3px rgba(248,192,32,.5),var(--shadow-1)}
  22%{box-shadow:0 0 0 1.5px rgba(15,122,61,.3),0 0 26px 6px rgba(248,192,32,0),var(--shadow-1)}}

@media (max-width:820px){
  /* stacked layout: the connector runs top-to-bottom, so the packet does too */
  .steps::after,.steps--3::after{top:30px;bottom:30px;left:27px;right:auto;width:4px;height:auto;
    background:linear-gradient(180deg,transparent 0%,rgba(248,192,32,0) 38%,#F8C020 46%,#FFF3BE 50%,#F8C020 54%,rgba(248,192,32,0) 62%,transparent 100%);
    background-size:100% 260%;
    animation:flow-packet-v 3.6s cubic-bezier(.55,0,.45,1) infinite}
}
@keyframes flow-packet-v{0%{background-position:0 -60%}55%,100%{background-position:0 160%}}
.step{position:relative;display:flex;flex-direction:column;gap:.7rem;padding-top:0}
.step-dot{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;position:relative;z-index:1;
  background:linear-gradient(180deg,#fff,#F3EDE0);box-shadow:0 0 0 1.5px rgba(15,122,61,.3),var(--shadow-1)}
.step-dot svg{width:27px;height:27px;color:var(--green-deep-raw)}
.step b{font-family:'Orbitron','Bricolage Grotesque',Arial,sans-serif;font-weight:900;font-size:1.16rem;letter-spacing:-.01em}
.step p{font-size:.98rem;color:var(--text-soft)}
.step small{font-weight:700;color:var(--accent-2-text);letter-spacing:.08em;font-size:.78rem}
@media (max-width:820px){
  .steps,.steps--3{grid-template-columns:1fr;gap:1.9rem}
  .steps::before,.steps--3::before{left:29px;right:auto;top:30px;bottom:30px;width:2px;height:auto;
    background:repeating-linear-gradient(180deg,var(--line) 0 10px,transparent 10px 18px)}
  .step{display:grid;grid-template-columns:58px 1fr;grid-template-rows:auto auto;column-gap:1rem}
  .step-dot{grid-row:1 / span 3}
  .step b,.step p,.step small{grid-column:2}
}

/* ---------- signature: training block ---------- */
.tb{position:relative}
.tb-bar{position:relative;height:10px;border-radius:6px;background:rgba(14,50,34,.12);margin:2.6rem 0 2.2rem;overflow:visible}
.tb-fill{position:absolute;inset:0 auto 0 0;width:0%;border-radius:6px;
  background:linear-gradient(90deg,var(--green-raw),var(--gold-raw))}
.js .tb-fill{transition:width 1.3s var(--ease-io)}
.no-js .tb-fill,html:not(.js) .tb-fill{width:100%}
.tb-plates{position:absolute;inset:0;display:flex;justify-content:space-between;align-items:center}
.tb-plate{width:26px;height:26px;border-radius:50%;background:#fff;
  box-shadow:0 0 0 2px var(--green-deep-raw),var(--shadow-1);position:relative;top:0}
.tb-plate::after{content:'';position:absolute;inset:7px;border-radius:50%;background:var(--green-deep-raw)}
.tb-plate[data-gold]{box-shadow:0 0 0 2px var(--gold-deep-raw),var(--shadow-1)}
.tb-plate[data-gold]::after{background:var(--gold-raw)}
.tb-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.3rem}
.tb-grid > *{min-width:0}
.tb-cell{background:#fff;border-radius:var(--card-radius);box-shadow:var(--shadow-1);padding:1.5rem;
  display:flex;flex-direction:column;gap:.6rem}
.tb-cell small{font-weight:700;letter-spacing:.09em;font-size:.76rem;color:var(--accent-2-text)}
.tb-cell b{font-family:'Orbitron','Bricolage Grotesque',Arial,sans-serif;font-weight:900;font-size:1.12rem;letter-spacing:-.01em}
.tb-cell p{font-size:.95rem;color:var(--text-soft)}
.tb-cell ul{list-style:none;display:grid;gap:.4rem;font-size:.92rem;color:var(--text-soft)}
.tb-cell ul li{display:flex;gap:.5rem;align-items:flex-start}
.tb-cell ul svg{width:16px;height:16px;flex:none;margin-top:.24rem;color:var(--green-deep-raw)}
@media (max-width:980px){.tb-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.tb-grid{grid-template-columns:1fr}.tb-bar{display:none}}

/* ---------- cost bars (their published examples) ---------- */
.costbars{display:grid;gap:1.15rem}
.costrow{display:grid;grid-template-columns:186px 1fr auto;gap:1rem;align-items:center}
.costrow small{font-weight:600;font-size:.92rem}
.costrow .costval{font-weight:700;font-size:1rem;white-space:nowrap;font-variant-numeric:tabular-nums;
  min-width:7.2ch;text-align:right}
.costtrack{position:relative;height:30px;border-radius:10px;background:rgba(14,50,34,.10);overflow:hidden}
.t-dark .costtrack{background:rgba(250,247,240,.10)}
.costfill{position:absolute;inset:0 auto 0 0;width:0%;border-radius:10px}
.js [data-shown] .costfill{transition:width 1.1s var(--ease-io)}
html:not(.js) .costfill{width:var(--w)}
.costfill--good{background:linear-gradient(90deg,#31C56E,#1E9A4E)}
.costfill--bad{background:linear-gradient(90deg,#F0A62A,#C97F10)}
@media (max-width:640px){
  .costrow{grid-template-columns:1fr auto;gap:.35rem .8rem}
  .costrow small{grid-column:1}
  .costrow .costval{grid-column:2;grid-row:1}
  .costtrack{grid-column:1 / -1}
}

/* ---------- comparison ---------- */
.compare{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border-radius:var(--card-radius);
  overflow:hidden;box-shadow:var(--shadow-1);font-size:.98rem}
.compare th,.compare td{padding:1rem 1.1rem;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.compare thead th{font-family:'Orbitron','Bricolage Grotesque',Arial,sans-serif;font-weight:900;font-size:1.02rem;letter-spacing:-.01em;
  background:var(--bone-2)}
.compare tbody tr:last-child td{border-bottom:0}
.compare .win{background:linear-gradient(180deg,rgba(47,198,102,.10),rgba(47,198,102,.05));font-weight:600}
.compare thead .win{background:linear-gradient(180deg,rgba(47,198,102,.22),rgba(47,198,102,.12))}
.compare-cards{display:none}
@media (max-width:767px){
  .compare{display:none}
  .compare-cards{display:grid;gap:1rem}
  .compare-card{background:#fff;border-radius:var(--card-radius);box-shadow:var(--shadow-1);padding:1.4rem;display:grid;gap:.7rem}
  .compare-card h3{font-size:1.1rem}
  .compare-card[data-win]{box-shadow:0 0 0 2px var(--green-deep-raw),var(--shadow-1)}
  .compare-card dl{display:grid;gap:.55rem}
  .compare-card dt{font-size:.8rem;font-weight:700;letter-spacing:.06em;color:var(--text-soft)}
  .compare-card dd{font-size:.95rem}
}

/* ---------- reviews ---------- */
.reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.reviews-grid > *{min-width:0}
@media (max-width:960px){.reviews-grid{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.reviews-grid{grid-template-columns:1fr}}
.review{display:flex;flex-direction:column;gap:.9rem}
.review blockquote{font-size:.99rem;line-height:1.6}
.review-who{display:block;margin-top:auto;padding-top:.9rem;border-top:1px solid var(--line)}
.review-who b{font-size:.95rem;display:block}
.review-who span{display:block;font-size:.8rem;color:var(--text-soft)}
.vidsec .review-who span,.t-dark .review-who span{color:var(--text-inverse-soft)}
.vidsec .review-who,.t-dark .review-who{border-top-color:var(--line-inverse)}
.stars{display:inline-flex;gap:2px;color:var(--accent-2-text)}
.vidsec .stars,.t-dark .stars{color:var(--gold-raw)}
.stars svg{width:17px;height:17px}

/* ---------- FAQ ---------- */
.faq{max-width:52rem;margin-inline:auto}
.faq-i{border-bottom:1px solid var(--line)}
.faq-i[data-more]{display:none}
.faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;
  background:none;border:0;text-align:left;padding:1.15rem .2rem;cursor:pointer;
  font-family:'Bricolage Grotesque',Arial,sans-serif;font-weight:650;font-size:1.08rem;letter-spacing:-.01em;color:inherit}
.faq-q svg{width:22px;height:22px;flex:none;color:var(--green-deep-raw);transition:transform var(--t-med) var(--ease-out)}
.faq-q[aria-expanded="true"] svg{transform:rotate(45deg)}
.faq-a{overflow:hidden;transition:height .32s var(--ease-out)}
html:not(.js) .faq-a{height:auto !important}
.faq-a-in{padding:.1rem .2rem 1.3rem;color:var(--text-soft);max-width:62ch}
.faq-a-in p + p{margin-top:.7rem}
.faq-more{margin-top:1.8rem;display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap}
.faq-more [hidden]{display:none !important}
.faq-i[data-more]{display:none}

/* ---------- forms ---------- */
.field{display:grid;gap:.45rem}
.field label{font-weight:600;font-size:.95rem}
.field input,.field select,.field textarea{min-height:54px;border-radius:var(--field-radius);
  border:1.5px solid var(--line);background:#fff;padding:.8rem 1rem;font:inherit;color:var(--text);
  transition:border-color var(--t-fast) ease,box-shadow var(--t-fast) ease}
.field textarea{min-height:130px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--green-deep-raw);
  box-shadow:0 0 0 3px rgba(47,198,102,.25)}

/* ---------- embeds ---------- */
.embed-shell{background:#fff;border-radius:var(--card-radius);box-shadow:var(--shadow-1);padding:.6rem;overflow:hidden}
.embed-shell iframe{width:100%;border:0;border-radius:calc(var(--card-radius) - 6px)}

/* ---------- map ---------- */
.map-frame{border-radius:var(--card-radius);overflow:hidden;box-shadow:var(--shadow-2)}
.map-frame iframe{width:100%;height:420px;border:0;display:block}

/* ---------- footer ---------- */
.footer{background:
  radial-gradient(80% 65% at 85% 0%,rgba(47,198,102,.10) 0%,transparent 55%),
  linear-gradient(180deg,#0C2B1D 0%,#081F14 100%);
  color:var(--text-inverse);padding:clamp(3.5rem,6vw,5.5rem) 0 0}
.footer a{color:var(--text-inverse);text-decoration:none}
.footer-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr 1.2fr;gap:2.5rem;align-items:start}
@media (max-width:960px){.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.footer-grid{grid-template-columns:1fr}}
.footer-id img{width:252px;height:auto}
.footer-id p{color:var(--text-inverse-soft);font-size:.96rem;margin-top:1.1rem;max-width:34ch}
.footer .foot-h{font-size:.86rem;letter-spacing:.1em;text-transform:uppercase;color:#9FBFAC;font-weight:700;margin-bottom:1rem;font-family:'Instrument Sans',Arial,sans-serif;line-height:1.4}
.footer-col{display:grid;gap:.6rem;align-content:start}
.footer-col a{display:flex;align-items:center;gap:.62rem;font-size:.98rem;color:#D5E3D8;line-height:1.35;padding-block:.1rem}
.footer-col a svg{width:17px;height:17px;flex:none;color:var(--green-raw);opacity:.72;
  transition:opacity var(--t-fast) var(--ease-out),transform var(--t-fast) var(--ease-out)}
.footer-col a:hover{color:var(--green-raw)}
.footer-col a:hover svg{opacity:1;transform:translateX(2px)}
.footer-contact{display:grid;gap:.8rem;align-content:start}
.footer-contact a,.footer-contact span{display:flex;gap:.65rem;align-items:flex-start;font-size:.97rem;color:#D5E3D8}
.footer-contact svg{width:20px;height:20px;flex:none;margin-top:.15rem;color:var(--green-raw)}
.footer-social{display:flex;gap:.9rem;margin-top:.5rem}
.footer-social a{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;
  background:rgba(244,248,242,.07);transition:background-color var(--t-fast) ease,transform var(--t-fast) var(--ease-out)}
.footer-social a:hover{background:rgba(47,198,102,.22);transform:translateY(-2px)}
.footer-social svg{width:21px;height:21px}
.footer-base{margin-top:clamp(2.5rem,5vw,4rem);border-top:1px solid var(--line-inverse);padding:1.4rem 0 calc(1.4rem + env(safe-area-inset-bottom))}
.footer-base .wrap{display:flex;flex-wrap:wrap;gap:.8rem 1.8rem;align-items:center;justify-content:space-between;font-size:.88rem;color:#A9BFB0}
.footer-base a{display:inline-block;padding-block:.42rem}
.footer-legal{display:flex;flex-wrap:wrap;gap:.2rem .9rem;align-items:center}
.footer-base a{color:#A9BFB0}
.footer-base a:hover{color:#fff}
.footer-base .pbla{padding-block:.42rem}
.pbla{font-weight:600}
.pbla b{color:var(--green-raw);text-shadow:0 0 16px rgba(47,198,102,.65)}

/* ---------- sticky mobile CTA ---------- */
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:90;display:none;
  grid-template-columns:1fr 1fr;gap:.6rem;padding:.6rem .8rem calc(.6rem + env(safe-area-inset-bottom));
  background:rgba(9,26,18,.88);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border-top:1px solid var(--line-inverse)}
.sticky-cta .btn{min-height:48px;padding:.6rem 1rem;font-size:.95rem}
.sticky-cta .btn--ghost{color:#fff}
@media (max-width:767px){
  .sticky-cta{display:grid}
  body{padding-bottom:76px}
}

/* ---------- links page ---------- */
.links-page{max-width:31rem;margin-inline:auto;display:grid;gap:.9rem;text-align:center}
.links-page .btn{width:100%}
.links-logo{width:230px;margin-inline:auto}
.links-note{color:var(--text-soft);font-size:.98rem}
.links-qr{width:150px;margin:1.2rem auto 0;border-radius:14px;box-shadow:var(--shadow-1);background:#fff;padding:10px}

/* ---------- 404 ---------- */
.err-hero{min-height:70svh;display:flex;align-items:center;text-align:center}
.err-hero .wrap{display:grid;gap:1.4rem;justify-items:center}
.err-num{font-family:'Bricolage Grotesque',Arial,sans-serif;font-size:clamp(5rem,14vw,9rem);font-weight:800;
  line-height:1;color:var(--pop-text);-webkit-text-fill-color:currentColor;background:none}

/* ---------- hero support line + trust strip ---------- */
.hero-support{max-width:52rem;margin:1.6rem auto 0;text-align:center;color:#CFE0D5;
  font-size:clamp(.95rem,.9rem + .2vw,1.05rem);line-height:1.55}
.trust-strip{list-style:none;margin:1.25rem auto 0;padding:0;display:flex;flex-wrap:wrap;
  justify-content:center;gap:.55rem .9rem;max-width:56rem}
.trust-strip li{display:flex;align-items:center;gap:.5rem;font-size:.86rem;font-weight:600;
  letter-spacing:.01em;color:#DCEBE0;background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:.4rem .9rem;
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.trust-strip li::before{content:'';width:7px;height:7px;border-radius:50%;flex:none;background:var(--green-raw)}
@media (max-width:560px){.trust-strip li{font-size:.8rem;padding:.34rem .72rem}}

/* ---------- who we help ---------- */
.who-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:clamp(2rem,4vw,3rem)}
@media (max-width:900px){.who-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.who-grid{grid-template-columns:1fr}}
.who-card{display:flex;flex-direction:column;gap:.7rem}
.who-card h3{font-size:clamp(1.05rem,1rem + .35vw,1.25rem)}
.who-card p{font-size:.96rem;color:var(--text-soft);margin:0}

/* ---------- press row (static, replaced the scrolling marquee) ---------- */
.press{margin-top:clamp(3rem,6.5vw,5rem);display:grid;gap:1.15rem;justify-items:center;text-align:center}
.press-label{font-family:'Orbitron','Bricolage Grotesque',Arial,sans-serif;font-weight:900;font-weight:750;font-size:.8rem;
  letter-spacing:.18em;text-transform:uppercase;color:var(--text-soft)}
.press-row{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;
  justify-content:center;gap:clamp(1.5rem,4.5vw,3.4rem)}
.press-row img{display:block;height:clamp(26px,3.4vw,34px);width:auto;
  opacity:.72;filter:grayscale(1) contrast(1.05);
  transition:opacity var(--t-med) var(--ease-out),filter var(--t-med) var(--ease-out),transform var(--t-med) var(--ease-out)}
.press-row .press-abc{height:clamp(30px,3.9vw,39px)}
.press-row .press-tele{height:clamp(28px,3.6vw,36px)}
@media (hover:hover) and (pointer:fine){
  .press-row li:hover img{opacity:1;filter:none;transform:translateY(-2px)}
}


/* ---------- contact list (light surfaces - inherits colour, never the dark footer palette) ---------- */
.contact-list{list-style:none;margin:1.3rem 0 0;padding:0;display:grid;gap:.85rem}
.contact-list li{display:flex;align-items:flex-start;gap:.7rem;font-size:1rem;line-height:1.5;color:var(--text)}
.contact-list li svg{width:20px;height:20px;flex:none;margin-top:.18rem;color:var(--accent-text)}
.contact-list a{color:var(--text);text-decoration:underline;text-decoration-color:rgba(27,42,33,.28);
  text-underline-offset:3px;transition:color var(--t-fast) var(--ease-out),text-decoration-color var(--t-fast) var(--ease-out)}
.contact-list a:hover{color:var(--accent-text);text-decoration-color:currentColor}

.footer-id-cta{margin-top:1.4rem;justify-self:start}

/* ---------- footer map + credential badges ---------- */
.footer .footer-map{display:block;position:relative;margin-top:clamp(2rem,4vw,2.8rem);width:100%;
  border-radius:14px;overflow:hidden;line-height:0;isolation:isolate;
  box-shadow:inset 0 0 0 1px var(--line-inverse),0 6px 18px rgba(0,0,0,.22)}
.footer-map iframe{display:block;width:100%;height:clamp(200px,26vw,320px);border:0;pointer-events:none;
  filter:grayscale(.4) contrast(1.04) brightness(.98);
  transition:filter var(--t-med) var(--ease-out),transform var(--t-med) var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .footer-map:hover iframe{filter:none;transform:scale(1.02)}
}
.footer .footer-map-cta{position:absolute;left:.9rem;bottom:.9rem;z-index:2;
  display:inline-flex;align-items:center;gap:.4rem;padding:.42rem .75rem;border-radius:999px;
  font-size:.82rem;font-weight:600;line-height:1;color:#12291D;background:rgba(250,247,240,.95);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 2px 10px rgba(13,31,22,.3)}
.footer .footer-map-cta svg{width:15px;height:15px;margin-top:0;color:var(--green-deep-raw)}

.footer-cred{list-style:none;margin:clamp(1.8rem,3.5vw,2.6rem) 0 0;padding:clamp(1.5rem,3vw,2rem) 0 0;
  border-top:1px solid var(--line-inverse);display:flex;flex-wrap:wrap;
  align-items:center;justify-content:center;gap:clamp(1.4rem,4.5vw,3.2rem)}
.footer-cred img{display:block;height:var(--cred-h);width:auto;opacity:.95;}
.footer-cred{--cred-h:clamp(50px,6.6vw,64px)}
.footer-cred img.cred-wide{height:calc(var(--cred-h) * .44)}
.footer-cred img{aspect-ratio:auto}
.footer-cred img{opacity:.95;
  filter:drop-shadow(0 2px 7px rgba(0,0,0,.38));
  transition:opacity var(--t-fast) var(--ease-out),transform var(--t-fast) var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .footer-cred li:hover img{opacity:1;transform:translateY(-2px)}
}

/* ---------- icon + control polish ---------- */
:where(a,button,summary,[tabindex]):focus-visible{outline:2.5px solid var(--accent-text);outline-offset:3px}
/* skip-link target: focusable for keyboard users, but not a control - no ring around the whole page */
main#main:focus,main#main:focus-visible{outline:none}
.t-dark :where(a,button,summary,[tabindex]):focus-visible,.hero :where(a,button,summary,[tabindex]):focus-visible,
.footer :where(a,button,summary,[tabindex]):focus-visible,.hdr:not([data-stuck]) :where(a,button):focus-visible{outline-color:var(--green-raw)}
.btn svg{transition:transform var(--t-fast) var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .btn:hover svg{transform:translateX(1.5px)}
  .btn--ghost:hover{background:rgba(255,255,255,.06)}
}
.footer-social a{transition:background-color var(--t-fast) var(--ease-out),transform var(--t-fast) var(--ease-out),box-shadow var(--t-fast) var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .footer-social a:hover{box-shadow:0 6px 16px rgba(47,198,102,.24)}
}

/* ---------- print (contact) ---------- */
@media print{
  .hdr,.drawer,.sticky-cta,.footer-social,video,.hero-media{display:none !important}
  .hero,.t-dark{background:#fff !important;color:#000 !important;min-height:0}
  .hl,.shimmer{background:none !important;-webkit-text-fill-color:#8A5B00 !important;color:#8A5B00 !important;animation:none !important;filter:none !important}
  .footer-map,.footer-cred{display:none !important}
  body{background:#fff;color:#000}
}

/* ---------- legal pages ---------- */
.legal{max-width:50rem}
.legal p{max-width:none;margin-bottom:1.05rem;font-size:1.02rem;line-height:1.72}
.legal h2{margin:2.4rem 0 1rem;font-size:clamp(1.3rem,1.1rem + .7vw,1.65rem)}
.legal h2:first-child{margin-top:0}
.legal .legal-note{font-size:.9rem;color:var(--text-soft);letter-spacing:.02em}

/* ---------- interior background-video section ---------- */
.vidsec{position:relative;overflow:hidden;color:var(--text-inverse);background:var(--club-raw)}
.vidsec-media{position:absolute;inset:0}
.vidsec-media video,.vidsec-media img{width:100%;height:100%;object-fit:cover}
.vidsec-veil{position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(8,24,16,.95) 0%,rgba(8,24,16,.88) 45%,rgba(8,24,16,.96) 100%)}
.vidsec > .wrap{position:relative;z-index:2}
.vidsec p,.vidsec .lede{color:var(--text-inverse-soft)}
.vidsec .card{background:rgba(250,247,240,.07);box-shadow:inset 0 0 0 1px var(--line-inverse);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.vidsec .card blockquote{color:#E7F0E9}
