/* =============================================================
   ODDS LONGEVITY — Design System
   Inspired by the clinical-editorial language of modern
   longevity clinics. Brand: deep indigo + warm ivory + gold.
   Typeface: Geogrotesque (brand) paired with Fraunces (editorial).
   ============================================================= */

/* ---------- Brand font (Geogrotesque) ---------- */
@font-face{font-family:'Geogrotesque';src:url('../fonts/GeogrotesqueTRIAL-UltLt.otf') format('opentype');font-weight:100;font-style:normal;font-display:swap}
@font-face{font-family:'Geogrotesque';src:url('../fonts/GeogrotesqueTRIAL-Th.otf') format('opentype');font-weight:200;font-style:normal;font-display:swap}
@font-face{font-family:'Geogrotesque';src:url('../fonts/GeogrotesqueTRIAL-Lt.otf') format('opentype');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Geogrotesque';src:url('../fonts/GeogrotesqueTRIAL-Rg.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Geogrotesque';src:url('../fonts/GeogrotesqueTRIAL-Md.otf') format('opentype');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Geogrotesque';src:url('../fonts/GeogrotesqueTRIAL-SmBd.otf') format('opentype');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Geogrotesque';src:url('../fonts/GeogrotesqueTRIAL-Bd.otf') format('opentype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Geogrotesque';src:url('../fonts/GeogrotesqueTRIAL-LtIt.otf') format('opentype');font-weight:300;font-style:italic;font-display:swap}
@font-face{font-family:'Geogrotesque';src:url('../fonts/GeogrotesqueTRIAL-RgIt.otf') format('opentype');font-weight:400;font-style:italic;font-display:swap}

/* ---------- Tokens ---------- */
:root{
  /* color */
  --ink:#14172b;
  --ink-soft:#2a2e44;
  --indigo:#252f69;
  --indigo-700:#1c2454;
  --indigo-300:#5360a3;
  --paper:#f6f8f9;
  --paper-2:#ffffff;
  --paper-3:#eef1f4;
  --white:#ffffff;
  --gold:#b88a3a;
  --gold-soft:#cdab63;
  --gold-bright:#e3bd6a;
  --sage:#4c6b61;
  --sage-soft:#6f8a80;
  --mist:#e4e8ec;
  --mist-2:#cfd5db;
  --line:rgba(20,23,43,.10);
  --line-strong:rgba(20,23,43,.16);
  --muted:#6b6f80;
  --muted-2:#8a8e9d;

  /* dark surfaces — neon high-tech navy */
  --night:#080c1a;
  --night-2:#0d1224;
  --night-card:#131a33;

  /* type */
  --sans:'Geogrotesque','Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --serif:'Fraunces','Georgia',ui-serif,serif;

  /* spacing scale */
  --container:1240px;
  --gutter:clamp(20px,5vw,72px);
  --section-y:clamp(72px,9vw,148px);
  --radius:18px;
  --radius-sm:12px;
  --radius-lg:28px;

  /* motion */
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
}

/* fix gold var typo safety */
:root{--gold-soft:#cdab63;}

/* ---------- Official Odds brand colours (Neon brandbook) ---------- */
:root{
  --odds-orange:#ff8c1a;     /* neon orange */
  --odds-blue:#4d7aff;       /* electric blue */
  --electric:#4d7aff;
  --electric-light:#7fa4ff;
  --neon-gold:#ffd020;       /* neon gold — dark surfaces only (low contrast on white) */
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{margin:0;font-family:var(--sans);font-weight:400;color:var(--ink);background:var(--paper);font-size:17px;line-height:1.6;overflow-x:hidden}
img,svg,video{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none}
ul{margin:0;padding:0;list-style:none}
h1,h2,h3,h4,p{margin:0}
::selection{background:var(--indigo);color:var(--paper-2)}

/* ---------- Type ---------- */
.display{font-family:var(--sans);font-weight:300;letter-spacing:-.02em;line-height:1.02;color:var(--ink)}
.serif{font-family:var(--serif);font-optical-sizing:auto}
em.accent,.accent-serif{font-family:var(--serif);font-style:italic;font-weight:400}

.h1{font-size:clamp(2.7rem,6.6vw,5.4rem);font-weight:300;letter-spacing:-.025em;line-height:1.01}
.h2{font-size:clamp(2rem,4.4vw,3.5rem);font-weight:300;letter-spacing:-.02em;line-height:1.05}
.h3{font-size:clamp(1.4rem,2.4vw,2.05rem);font-weight:400;letter-spacing:-.015em;line-height:1.12}
.h4{font-size:clamp(1.12rem,1.6vw,1.32rem);font-weight:500;letter-spacing:-.01em;line-height:1.25}
.lead{font-size:clamp(1.12rem,1.65vw,1.4rem);line-height:1.5;font-weight:300;color:var(--ink-soft)}
.body-lg{font-size:1.12rem;line-height:1.62;color:var(--ink-soft)}
.small{font-size:.92rem;line-height:1.55}
.muted{color:var(--muted)}

.eyebrow{
  font-size:.84rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold);display:inline-flex;align-items:center;gap:.65em;
}
/* trademark superscript */
.tm{font-size:.5em;vertical-align:.62em;font-weight:500;letter-spacing:.02em;margin-left:1px}
.eyebrow::before{content:"";width:26px;height:1px;background:currentColor;opacity:.7}
.eyebrow.no-rule::before{display:none}
.eyebrow.sage{color:var(--sage)}

/* ---------- Layout ---------- */
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
.container-wide{max-width:1440px}
.container-narrow{max-width:880px}
.section{padding-block:var(--section-y)}
.section-sm{padding-block:clamp(48px,6vw,88px)}
.grid{display:grid;gap:clamp(20px,2.4vw,34px)}
.cols-2{grid-template-columns:repeat(2,1fr)}
.cols-3{grid-template-columns:repeat(3,1fr)}
.cols-4{grid-template-columns:repeat(4,1fr)}
.flex{display:flex}
.items-center{align-items:center}
.justify-between{justify-content:space-between}
.gap-sm{gap:12px}.gap-md{gap:20px}.gap-lg{gap:32px}
.text-center{text-align:center}
.mx-auto{margin-inline:auto}
.divider{height:1px;background:var(--line);border:0;margin:0}

@media(max-width:980px){
  .cols-4{grid-template-columns:repeat(2,1fr)}
  .cols-3{grid-template-columns:1fr}
}
@media(max-width:680px){
  .cols-2,.cols-4{grid-template-columns:1fr}
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  font-weight:500;font-size:.97rem;letter-spacing:.005em;
  padding:.92em 1.5em;border-radius:100px;line-height:1;
  transition:transform .35s var(--ease),background .3s var(--ease),color .3s var(--ease),box-shadow .35s var(--ease),border-color .3s;
  will-change:transform;white-space:nowrap;
}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn-primary{background:var(--indigo);color:var(--paper-2);box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 14px 30px -14px rgba(37,47,105,.7)}
.btn-primary:hover{background:var(--indigo-700);box-shadow:0 18px 38px -14px rgba(37,47,105,.85)}
.btn-gold{background:var(--gold);color:#1c1606;box-shadow:0 14px 30px -14px rgba(184,138,58,.75)}
.btn-gold:hover{background:var(--gold-bright)}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--line-strong)}
.btn-ghost:hover{border-color:var(--ink);background:rgba(20,23,43,.03)}
.btn-light{background:var(--paper-2);color:var(--ink)}
.btn-light:hover{background:#fff}
.btn-on-dark{background:transparent;color:var(--paper);border:1px solid rgba(255,255,255,.28)}
.btn-on-dark:hover{border-color:#fff;background:rgba(255,255,255,.06)}
.btn-lg{padding:1.06em 1.85em;font-size:1.02rem}
.btn .arr{transition:transform .35s var(--ease)}
.btn:hover .arr{transform:translateX(3px)}

.link-arrow{display:inline-flex;align-items:center;gap:.5em;font-weight:500;color:var(--indigo);border-bottom:1px solid transparent;transition:gap .3s var(--ease),border-color .3s}
.link-arrow:hover{gap:.85em;border-color:currentColor}
.link-arrow.gold{color:var(--gold)}
.link-arrow.on-dark{color:var(--paper)}

/* ---------- Tag / pill ---------- */
.pill{display:inline-flex;align-items:center;gap:.5em;font-size:.78rem;font-weight:500;letter-spacing:.04em;
  padding:.5em .9em;border-radius:100px;border:1px solid var(--line-strong);color:var(--ink-soft);background:rgba(255,255,255,.5)}
.pill .dot{width:6px;height:6px;border-radius:50%;background:var(--sage)}
.pill.gold .dot{background:var(--gold)}

/* ============================================================
   ANNOUNCEMENT BAR
   ============================================================ */
.topbar{background:var(--ink);color:rgba(246,244,242,.86);font-size:.82rem;letter-spacing:.01em}
.topbar .container{display:flex;align-items:center;justify-content:center;gap:.7em;height:42px;text-align:center}
.topbar a{color:var(--gold-bright);font-weight:500;display:inline-flex;align-items:center;gap:.4em}
.topbar a:hover{text-decoration:underline}
.topbar .tb-dot{width:6px;height:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(227,189,106,.18)}
@media(max-width:620px){.topbar .tb-hide{display:none}}

/* ============================================================
   NAVIGATION
   ============================================================ */
.nav{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.72);backdrop-filter:saturate(150%) blur(14px);-webkit-backdrop-filter:saturate(150%) blur(14px);border-bottom:1px solid transparent;transition:background .4s var(--ease),border-color .4s,box-shadow .4s}
.nav.scrolled{background:rgba(255,255,255,.9);border-color:var(--line);box-shadow:0 10px 30px -22px rgba(20,23,43,.28)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:72px;gap:24px}
.brand{display:flex;align-items:center;gap:11px;font-weight:600}
.brand .logo-mark{width:34px;height:34px;flex:none}
.brand .wordmark{display:flex;flex-direction:column;line-height:1}
.brand .wordmark b{font-size:1.34rem;font-weight:700;letter-spacing:-.005em;color:var(--odds-blue)}
.brand .wordmark span{font-size:.58rem;font-weight:600;letter-spacing:.32em;color:var(--odds-orange);text-transform:uppercase;margin-top:2px}
.nav-links{display:flex;align-items:center;gap:6px}
.nav-links a{position:relative;font-size:.95rem;font-weight:500;color:var(--ink-soft);padding:.55em .85em;border-radius:8px;transition:color .25s}
.nav-links a::after{content:"";position:absolute;left:.85em;right:.85em;bottom:.35em;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.nav-links a:hover{color:var(--ink)}
.nav-links a:hover::after{transform:scaleX(1)}
.nav-cta{display:flex;align-items:center;gap:14px}
.nav-cta .btn{padding:.72em 1.25em;font-size:.92rem}
.nav-burger{display:none;flex-direction:column;gap:5px;width:44px;height:44px;align-items:center;justify-content:center;border-radius:10px}
.nav-burger span{width:22px;height:2px;background:var(--ink);border-radius:2px;transition:transform .35s var(--ease),opacity .25s}
.nav.menu-open .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav.menu-open .nav-burger span:nth-child(2){opacity:0}
.nav.menu-open .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media(max-width:940px){
  .nav-links,.nav-cta .btn-ghost{display:none}
  .nav-burger{display:flex}
}

/* mobile drawer */
.mobile-menu{position:fixed;inset:0 0 0 auto;width:min(420px,86vw);background:var(--paper-2);z-index:70;transform:translateX(100%);transition:transform .5s var(--ease);padding:96px var(--gutter) 40px;display:flex;flex-direction:column;box-shadow:-30px 0 70px -40px rgba(20,23,43,.5);overflow-y:auto}
.mobile-menu.open{transform:translateX(0)}
.mobile-menu a.m-link{font-size:1.5rem;font-weight:300;letter-spacing:-.01em;padding:.55em 0;border-bottom:1px solid var(--line);color:var(--ink);display:flex;justify-content:space-between;align-items:center}
.mobile-menu a.m-link span{color:var(--gold);font-size:.9rem}
.mobile-backdrop{position:fixed;inset:0;background:rgba(20,23,43,.42);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:opacity .4s,visibility .4s;z-index:65}
.mobile-backdrop.open{opacity:1;visibility:visible}
.m-close{position:absolute;top:24px;right:24px;width:44px;height:44px;border-radius:50%;border:1px solid var(--line-strong);display:flex;align-items:center;justify-content:center;font-size:1.3rem;color:var(--ink)}

/* ============================================================
   HERO
   ============================================================ */
.hero{position:relative;overflow:hidden;background:linear-gradient(180deg,#ffffff 0%,#f6f8fa 62%,#eef1f4 100%)}
.hero::before{content:"";position:absolute;inset:0;background:
  radial-gradient(1100px 620px at 80% -8%,rgba(61,92,196,.08),transparent 60%),
  radial-gradient(720px 520px at 6% 110%,rgba(37,47,105,.05),transparent 60%);
  pointer-events:none}
.hero-inner{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,4vw,60px);align-items:center;padding-block:clamp(56px,8vw,104px) clamp(40px,6vw,72px)}
.hero-copy{max-width:620px}
.hero h1{margin-top:22px}
.hero .lead{margin-top:26px;max-width:520px}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px}
.hero-trust{display:flex;align-items:center;gap:22px;margin-top:42px;flex-wrap:wrap}
.hero-trust .avatars{display:flex}
.hero-trust .avatars span{width:38px;height:38px;border-radius:50%;border:2px solid var(--paper);margin-left:-12px;background-size:cover;background-position:center;box-shadow:0 4px 10px -4px rgba(20,23,43,.4)}
.hero-trust .avatars span:first-child{margin-left:0}
.hero-trust .t-meta{font-size:.9rem;color:var(--muted);line-height:1.4}
.hero-trust .t-meta b{color:var(--ink);font-weight:600}
.stars{color:var(--gold);letter-spacing:1px;font-size:.85rem}

/* hero visual */
.hero-visual{position:relative;aspect-ratio:4/5;border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 50px 90px -50px rgba(20,23,43,.55);background:#dfe4e7}
.hero-visual img{width:100%;height:100%;object-fit:cover}
.hero-visual .glass-card{position:absolute;left:18px;right:18px;bottom:18px;background:rgba(255,255,255,.78);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.6);border-radius:16px;padding:16px 18px;display:flex;align-items:center;gap:14px}
.hero-visual .glass-card .gc-num{font-size:1.9rem;font-weight:300;color:var(--indigo);line-height:1}
.hero-visual .glass-card .gc-meta{font-size:.82rem;color:var(--ink-soft);line-height:1.35}
.hero-visual .float-tag{position:absolute;top:18px;left:18px;background:rgba(20,23,43,.78);color:var(--paper-2);font-size:.74rem;font-weight:500;letter-spacing:.04em;padding:.5em .85em;border-radius:100px;display:flex;align-items:center;gap:.5em;backdrop-filter:blur(6px)}
.hero-visual .float-tag .dot{width:7px;height:7px;border-radius:50%;background:#7ee0a6;box-shadow:0 0 0 4px rgba(126,224,166,.25)}

@media(max-width:920px){
  .hero-inner{grid-template-columns:1fr;gap:40px}
  .hero-visual{aspect-ratio:5/4;max-height:520px}
}

/* logo / trust strip */
.trust-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(255,255,255,.35)}
.trust-strip .container{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:26px;flex-wrap:wrap}
.trust-strip .ts-label{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:600}
.trust-strip .ts-logos{display:flex;align-items:center;gap:clamp(22px,4vw,52px);flex-wrap:wrap}
.trust-strip .ts-logos span{font-weight:600;letter-spacing:.02em;color:var(--ink-soft);opacity:.62;font-size:1.05rem;transition:opacity .3s}
.trust-strip .ts-logos span:hover{opacity:1}

/* ============================================================
   STAT BAND
   ============================================================ */
.statband{background:var(--night);color:var(--paper);position:relative;overflow:hidden}
.statband::before{content:"";position:absolute;inset:0;background:
  radial-gradient(800px 400px at 85% 120%,rgba(184,138,58,.16),transparent 60%),
  radial-gradient(700px 500px at 5% -20%,rgba(83,96,163,.22),transparent 60%)}
.statband .grid{position:relative;z-index:2}
.stat{padding:8px 0}
.stat .num{font-size:clamp(2.6rem,5vw,4rem);font-weight:200;letter-spacing:-.02em;line-height:1;background:linear-gradient(180deg,#fff,#cdd2e6);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat .num .unit{font-size:.42em;color:var(--gold-bright);-webkit-text-fill-color:var(--gold-bright);font-weight:400;margin-left:.15em}
.stat .lbl{margin-top:12px;font-size:.96rem;color:rgba(246,244,242,.62);max-width:230px;line-height:1.45}
.stat .lbl b{color:var(--paper);font-weight:600;display:block;margin-bottom:2px;font-size:1rem;letter-spacing:.01em}

/* ============================================================
   SECTION HEAD
   ============================================================ */
.section-head{max-width:760px}
.section-head.center{margin-inline:auto;text-align:center}
.section-head .eyebrow{margin-bottom:20px}
.section-head .lead{margin-top:22px}
.section-head.center .eyebrow{justify-content:center}

/* ============================================================
   EDITORIAL SPLIT
   ============================================================ */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,76px);align-items:center}
.split.reverse .split-media{order:2}
.split-media{position:relative;border-radius:var(--radius-lg);overflow:hidden;aspect-ratio:1/1;box-shadow:0 40px 80px -50px rgba(20,23,43,.5)}
.split-media img{width:100%;height:100%;object-fit:cover}
.split-media.tall{aspect-ratio:4/5}
@media(max-width:880px){.split{grid-template-columns:1fr}.split.reverse .split-media{order:0}}

/* numbered list */
.numlist{margin-top:36px;display:flex;flex-direction:column;gap:4px}
.numlist li{display:grid;grid-template-columns:auto 1fr;gap:20px;padding:22px 0;border-top:1px solid var(--line);align-items:start}
.numlist li:last-child{border-bottom:1px solid var(--line)}
.numlist .nl-num{font-family:var(--serif);font-style:italic;font-size:1.2rem;color:var(--gold);width:34px}
.numlist .nl-title{font-size:1.18rem;font-weight:500;letter-spacing:-.01em;color:var(--ink)}
.numlist .nl-desc{margin-top:7px;color:var(--muted);font-size:1rem;line-height:1.55}

/* ============================================================
   METHOD / PILLAR CARDS
   ============================================================ */
.card{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);padding:32px;position:relative;transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .4s,background .4s}
.card:hover{transform:translateY(-6px);box-shadow:0 40px 70px -44px rgba(20,23,43,.42);border-color:var(--mist-2)}
.card .card-ico{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:linear-gradient(150deg,#eef0f8,#e3e7f4);color:var(--indigo);margin-bottom:24px}
.card .card-ico svg{width:26px;height:26px}
.card .card-step{position:absolute;top:30px;right:32px;font-family:var(--serif);font-style:italic;color:var(--mist-2);font-size:1.5rem}
.card h3{font-size:1.32rem;font-weight:500;letter-spacing:-.01em}
.card p{margin-top:12px;color:var(--muted);line-height:1.58;font-size:1.02rem}
.card .card-link{margin-top:20px;display:inline-flex}
.card.dark{background:var(--night-card);border-color:rgba(255,255,255,.08);color:var(--paper)}
.card.dark h3{color:#fff}
.card.dark p{color:rgba(246,244,242,.66)}
.card.dark .card-ico{background:rgba(255,255,255,.07);color:var(--gold-bright)}

/* feature row (icon left) */
.feature{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;padding:8px 0}
.feature .f-ico{width:44px;height:44px;border-radius:12px;background:rgba(76,107,97,.1);color:var(--sage);display:flex;align-items:center;justify-content:center;flex:none}
.feature .f-ico svg{width:22px;height:22px}
.feature h4{font-size:1.1rem;font-weight:500}
.feature p{margin-top:6px;color:var(--muted);font-size:.98rem;line-height:1.5}

/* ============================================================
   DIAGNOSTICS GRID (bento)
   ============================================================ */
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(16px,1.6vw,22px);grid-auto-rows:minmax(180px,auto)}
.bento .b-card{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);padding:28px;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-start;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.bento .b-card:not(.row-2):not(.has-img){align-self:start}
.bento .b-card:hover{transform:translateY(-5px);box-shadow:0 40px 70px -46px rgba(20,23,43,.4)}
.bento .b-card .b-eyebrow{font-size:.78rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.bento .b-card h3{margin-top:10px;font-size:1.3rem;font-weight:500;letter-spacing:-.01em}
.bento .b-card p{margin-top:10px;color:var(--muted);font-size:.96rem;line-height:1.5}
.bento .span-3{grid-column:span 3}
.bento .span-2{grid-column:span 2}
.bento .span-4{grid-column:span 4}
.bento .row-2{grid-row:span 2}
.bento .b-dark{background:var(--night-card);color:var(--paper);border-color:rgba(255,255,255,.08)}
.bento .b-dark h3{color:#fff}.bento .b-dark p{color:rgba(246,244,242,.66)}
.bento .b-img{position:absolute;inset:0;z-index:0}
.bento .b-img img{width:100%;height:100%;object-fit:contain;object-position:center}
.bento .b-img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,23,43,0) 30%,rgba(20,23,43,.82))}
.bento .b-card.has-img *{position:relative;z-index:1}
.bento .b-card.has-img > .b-img{position:absolute;z-index:0}
.bento .b-card.has-img h3,.bento .b-card.has-img .b-eyebrow{color:#fff}
.bento .b-card.has-img p{color:rgba(255,255,255,.8)}
.bento .b-metric{font-size:2.6rem;font-weight:200;color:var(--indigo);letter-spacing:-.02em}
.bento .b-dark .b-metric{color:var(--gold-bright)}
@media(max-width:980px){.bento{grid-template-columns:repeat(2,1fr)}.bento .span-3,.bento .span-2,.bento .span-4{grid-column:span 1}.bento .span-4{grid-column:span 2}}
@media(max-width:560px){.bento{grid-template-columns:1fr}.bento .span-4{grid-column:span 1}}

/* ============================================================
   TIMELINE / PROTOCOL
   ============================================================ */
.timeline{position:relative;margin-top:48px}
.timeline::before{content:"";position:absolute;left:18px;top:8px;bottom:8px;width:1px;background:linear-gradient(180deg,var(--gold),var(--mist) 70%)}
.tl-step{position:relative;padding:0 0 44px 60px}
.tl-step:last-child{padding-bottom:0}
.tl-dot{position:absolute;left:9px;top:4px;width:19px;height:19px;border-radius:50%;background:var(--paper-2);border:2px solid var(--gold);display:flex;align-items:center;justify-content:center}
.tl-dot::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--gold)}
.tl-step .tl-when{font-size:.78rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--sage)}
.tl-step h4{margin-top:8px;font-size:1.25rem;font-weight:500;letter-spacing:-.01em}
.tl-step p{margin-top:8px;color:var(--muted);max-width:560px;line-height:1.55}

/* ============================================================
   MEMBERSHIP / PRICING
   ============================================================ */
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch}
.tier{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius-lg);padding:36px 32px;display:flex;flex-direction:column;position:relative;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.tier:hover{transform:translateY(-6px);box-shadow:0 50px 80px -50px rgba(20,23,43,.45)}
.tier.featured{background:var(--night);color:var(--paper);border-color:rgba(255,255,255,.1);box-shadow:0 50px 90px -50px rgba(20,23,43,.7)}
.tier.featured h3,.tier.featured .t-price{color:#fff}
.tier .t-badge{position:absolute;top:-13px;left:32px;background:var(--gold);color:#1c1606;font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:.45em .85em;border-radius:100px}
.tier .t-name{font-size:.8rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.tier.featured .t-name{color:var(--gold-bright)}
.tier h3{margin-top:8px;font-size:1.7rem;font-weight:400;letter-spacing:-.01em}
.tier .t-desc{margin-top:10px;color:var(--muted);font-size:.98rem;line-height:1.5;min-height:48px}
.tier.featured .t-desc{color:rgba(246,244,242,.6)}
.tier .t-price{margin-top:24px;font-size:2.4rem;font-weight:300;letter-spacing:-.02em;display:flex;align-items:baseline;gap:.25em}
.tier .t-price .per{font-size:.95rem;color:var(--muted);font-weight:400}
.tier.featured .t-price .per{color:rgba(246,244,242,.55)}
.tier .t-features{margin-top:26px;display:flex;flex-direction:column;gap:13px;flex:1}
.tier .t-features li{display:grid;grid-template-columns:auto 1fr;gap:12px;font-size:.97rem;color:var(--ink-soft);line-height:1.45}
.tier.featured .t-features li{color:rgba(246,244,242,.82)}
.tier .t-features li svg{width:18px;height:18px;color:var(--sage);margin-top:3px;flex:none}
.tier.featured .t-features li svg{color:var(--gold-bright)}
.tier .btn{margin-top:30px;width:100%}
@media(max-width:920px){.tiers{grid-template-columns:1fr;max-width:460px;margin-inline:auto}}

/* ============================================================
   TEAM
   ============================================================ */
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2vw,28px)}
.member{position:relative}
.member .m-photo{aspect-ratio:3/4;border-radius:var(--radius);overflow:hidden;background:var(--mist);position:relative}
.member .m-photo img{width:100%;height:100%;object-fit:cover;object-position:center top;transform-origin:center top;transition:transform .8s var(--ease)}
.member .m-photo img[src*="head-of-performance"],
.member .m-photo img[src*="lead-longevity-coach"],
.member .m-photo img[src*="dr-anjali-kumar"],
.member .m-photo img[src*="dr-jasjeet-wasir"]{transform:scale(1.28)}
.member:hover .m-photo img{transform:scale(1.05)}
.member:hover .m-photo img[src*="head-of-performance"],
.member:hover .m-photo img[src*="lead-longevity-coach"],
.member:hover .m-photo img[src*="dr-anjali-kumar"],
.member:hover .m-photo img[src*="dr-jasjeet-wasir"]{transform:scale(1.33)}
.member .m-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(20,23,43,.55))}
.member .m-name{position:absolute;left:18px;right:18px;bottom:16px;z-index:2;color:#fff}
.member .m-name b{display:block;font-size:1.12rem;font-weight:500}
.member .m-name span{font-size:.84rem;color:rgba(255,255,255,.8);font-weight:400}
@media(max-width:880px){.team-grid{grid-template-columns:repeat(2,1fr)}}

/* ============================================================
   QUOTE / TESTIMONIAL
   ============================================================ */
.quote-block{background:var(--night);color:var(--paper);position:relative;overflow:hidden}
.quote-block::before{content:"";position:absolute;inset:0;background:radial-gradient(700px 460px at 80% -10%,rgba(83,96,163,.26),transparent 60%),radial-gradient(600px 400px at 0% 120%,rgba(184,138,58,.16),transparent 60%)}
.quote-block .container{position:relative;z-index:2}
.bigquote{font-family:var(--serif);font-weight:300;font-size:clamp(1.6rem,3.6vw,2.7rem);line-height:1.28;letter-spacing:-.01em;max-width:980px}
.bigquote em{font-style:italic;color:var(--gold-bright)}
.quote-cite{margin-top:34px;display:flex;align-items:center;gap:16px}
.quote-cite .qc-photo{width:54px;height:54px;border-radius:50%;object-fit:cover;border:2px solid rgba(255,255,255,.2)}
.quote-cite b{display:block;font-weight:500}
.quote-cite span{font-size:.9rem;color:rgba(246,244,242,.6)}

.tcards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.tcard{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);padding:30px;display:flex;flex-direction:column}
.tcard .stars{margin-bottom:16px}
.tcard p{color:var(--ink-soft);line-height:1.6;font-size:1.04rem;flex:1}
.tcard .tc-who{margin-top:22px;display:flex;align-items:center;gap:12px;padding-top:20px;border-top:1px solid var(--line)}
.tcard .tc-who img{width:42px;height:42px;border-radius:50%;object-fit:cover}
.tcard .tc-who b{font-weight:500;font-size:.98rem}
.tcard .tc-who span{font-size:.84rem;color:var(--muted)}
@media(max-width:880px){.tcards{grid-template-columns:1fr}}

/* ============================================================
   FAQ
   ============================================================ */
.faq{max-width:880px;margin-inline:auto}
.faq-item{border-top:1px solid var(--line)}
.faq-item:last-child{border-bottom:1px solid var(--line)}
.faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:24px;text-align:left;padding:28px 4px;font-size:clamp(1.1rem,1.7vw,1.32rem);font-weight:400;letter-spacing:-.01em;color:var(--ink)}
.faq-q .faq-ico{flex:none;width:30px;height:30px;border-radius:50%;border:1px solid var(--line-strong);display:flex;align-items:center;justify-content:center;position:relative;transition:background .3s,border-color .3s}
.faq-q .faq-ico::before,.faq-q .faq-ico::after{content:"";position:absolute;background:var(--ink);transition:transform .35s var(--ease),background .3s}
.faq-q .faq-ico::before{width:12px;height:1.5px}
.faq-q .faq-ico::after{width:1.5px;height:12px}
.faq-item.open .faq-ico{background:var(--indigo);border-color:var(--indigo)}
.faq-item.open .faq-ico::before,.faq-item.open .faq-ico::after{background:#fff}
.faq-item.open .faq-ico::after{transform:scaleY(0)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .45s var(--ease)}
.faq-a-inner{padding:0 4px 30px;color:var(--muted);line-height:1.65;max-width:680px;font-size:1.04rem}

/* ============================================================
   CTA BAND
   ============================================================ */
.cta-band{position:relative;overflow:hidden;background:linear-gradient(135deg,#1b2150,#252f69 55%,#2c2150)}
.cta-band::before{content:"";position:absolute;inset:0;background:radial-gradient(700px 500px at 90% 0%,rgba(184,138,58,.25),transparent 55%)}
.cta-band .container{position:relative;z-index:2;text-align:center;color:var(--paper);padding-block:clamp(64px,9vw,120px)}
.cta-band h2{color:#fff}
.cta-band .lead{color:rgba(246,244,242,.74);margin:24px auto 0;max-width:560px}
.cta-band .hero-cta{justify-content:center;margin-top:38px}

/* ============================================================
   FOOTER
   ============================================================ */
.footer{background:var(--ink);color:rgba(246,244,242,.7);padding-block:clamp(56px,7vw,88px) 36px}
.footer-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}
.footer .f-brand .brand .wordmark b{color:#fff}
.footer .f-brand p{margin-top:20px;max-width:300px;color:rgba(246,244,242,.55);font-size:.96rem;line-height:1.6}
.footer .f-social{display:flex;gap:12px;margin-top:24px}
.footer .f-social a{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;color:rgba(246,244,242,.75);transition:background .3s,border-color .3s,transform .3s}
.footer .f-social a:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.3);transform:translateY(-2px)}
.footer .f-col h5{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(246,244,242,.45);font-weight:600;margin-bottom:18px}
.footer .f-col a{display:block;padding:7px 0;color:rgba(246,244,242,.72);font-size:.97rem;transition:color .25s,padding-left .25s}
.footer .f-col a:hover{color:#fff;padding-left:4px}
.footer-bottom{margin-top:56px;padding-top:26px;border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;font-size:.86rem;color:rgba(246,244,242,.45)}
.footer-bottom .fb-links{display:flex;gap:22px;flex-wrap:wrap}
.footer-bottom a:hover{color:#fff}
@media(max-width:880px){.footer-top{grid-template-columns:1fr 1fr}.footer .f-brand{grid-column:span 2}}
@media(max-width:520px){.footer-top{grid-template-columns:1fr}.footer .f-brand{grid-column:span 1}}

/* disclaimer note */
.disclaimer{font-size:.82rem;color:var(--muted-2);line-height:1.55;max-width:760px}

/* ============================================================
   PAGE HEADER (interior pages)
   ============================================================ */
.page-head{position:relative;overflow:hidden;background:linear-gradient(180deg,#ffffff,#eef1f4);padding-block:clamp(56px,8vw,112px) clamp(40px,5vw,64px)}
.page-head::before{content:"";position:absolute;inset:0;background:radial-gradient(800px 400px at 88% -10%,rgba(37,47,105,.1),transparent 60%)}
.page-head .container{position:relative;z-index:2}
.page-head .crumbs{font-size:.85rem;color:var(--muted);margin-bottom:22px}
.page-head .crumbs a:hover{color:var(--ink)}
.page-head h1{max-width:880px;margin-top:14px}
.page-head .lead{margin-top:24px;max-width:620px}

/* prose for content pages */
.prose{max-width:720px}
.prose p{margin-top:20px;color:var(--ink-soft);line-height:1.72;font-size:1.08rem}
.prose h2{margin-top:54px;font-size:clamp(1.6rem,2.6vw,2.2rem);font-weight:300;letter-spacing:-.02em}
.prose h3{margin-top:38px;font-size:1.3rem;font-weight:500}
.prose ul.bullets{margin-top:20px;display:flex;flex-direction:column;gap:12px}
.prose ul.bullets li{display:grid;grid-template-columns:auto 1fr;gap:14px;color:var(--ink-soft);line-height:1.6}
.prose ul.bullets li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--gold);margin-top:10px}

/* ============================================================
   REVEAL ANIMATION
   ============================================================ */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}.reveal.d3{transition-delay:.24s}.reveal.d4{transition-delay:.32s}.reveal.d5{transition-delay:.4s}
@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
  *{animation:none!important}
}

/* marquee */
.marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee-track{display:flex;gap:clamp(34px,5vw,72px);width:max-content;animation:marquee 36s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee-track span{font-size:clamp(1.1rem,2vw,1.45rem);font-weight:500;color:var(--ink-soft);opacity:.6;display:flex;align-items:center;gap:clamp(34px,5vw,72px);white-space:nowrap}
.marquee-track span::after{content:"✦";color:var(--gold);font-size:.7em}
@keyframes marquee{to{transform:translateX(-50%)}}

/* small helpers */
.mt-0{margin-top:0}.mt-sm{margin-top:14px}.mt-md{margin-top:26px}.mt-lg{margin-top:44px}
.maxw-560{max-width:560px}.maxw-640{max-width:640px}
.pad-card{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius-lg);padding:clamp(28px,4vw,56px)}

/* ============================================================
   INTERIOR PAGE COMPONENTS
   ============================================================ */

/* value / principle grid */
.value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.4vw,32px)}
.value{padding:30px 28px;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper-2);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.value:hover{transform:translateY(-5px);box-shadow:0 36px 64px -46px rgba(20,23,43,.4)}
.value .v-num{font-family:var(--serif);font-style:italic;font-size:1.3rem;color:var(--gold)}
.value h4{margin-top:14px;font-size:1.22rem;font-weight:500;letter-spacing:-.01em}
.value p{margin-top:10px;color:var(--muted);line-height:1.58}
@media(max-width:880px){.value-grid{grid-template-columns:1fr}}

/* comparison table */
.compare{width:100%;border-collapse:collapse;margin-top:20px;font-size:1rem}
.compare th,.compare td{text-align:left;padding:18px 20px;border-bottom:1px solid var(--line);vertical-align:top}
.compare thead th{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600;border-bottom:1px solid var(--line-strong)}
.compare thead th.tier-col{color:var(--indigo)}
.compare thead th.tier-col.feat{color:var(--gold)}
.compare tbody td:first-child{font-weight:500;color:var(--ink)}
.compare td.center,.compare th.center{text-align:center}
.compare td.center{color:var(--sage)}
.compare .check{color:var(--sage);font-weight:600}
.compare .dash{color:var(--mist-2)}
.compare tbody tr:hover{background:rgba(255,255,255,.5)}
.compare-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper-2)}
@media(max-width:720px){.compare{font-size:.9rem}.compare th,.compare td{padding:14px 14px}}

/* biomarker / panel table */
.panel-list{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:24px}
.panel-item{border:1px solid var(--line);border-radius:var(--radius);background:var(--paper-2);padding:26px}
.panel-item .pi-head{display:flex;align-items:center;gap:12px}
.panel-item .pi-ico{width:40px;height:40px;border-radius:11px;background:rgba(37,47,105,.08);color:var(--indigo);display:flex;align-items:center;justify-content:center;flex:none}
.panel-item .pi-ico svg{width:20px;height:20px}
.panel-item h4{font-size:1.12rem;font-weight:500}
.panel-item .pi-markers{margin-top:14px;display:flex;flex-wrap:wrap;gap:8px}
.panel-item .pi-markers span{font-size:.82rem;color:var(--ink-soft);background:rgba(20,23,43,.04);border:1px solid var(--line);padding:.4em .75em;border-radius:100px}
@media(max-width:680px){.panel-list{grid-template-columns:1fr}}

/* big number callouts */
.callouts{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.5vw,40px);text-align:center}
.callout .co-num{font-size:clamp(2.8rem,5vw,4.2rem);font-weight:200;letter-spacing:-.02em;color:var(--indigo);line-height:1}
.callout .co-num em{font-family:var(--serif);font-style:italic;color:var(--gold);font-weight:400}
.callout p{margin-top:14px;color:var(--muted);max-width:280px;margin-inline:auto;line-height:1.5}
@media(max-width:760px){.callouts{grid-template-columns:1fr;gap:40px}}

/* contact form */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:start}
@media(max-width:880px){.contact-grid{grid-template-columns:1fr}}
.form{display:flex;flex-direction:column;gap:20px}
.field{display:flex;flex-direction:column;gap:8px}
.field label{font-size:.86rem;font-weight:500;color:var(--ink-soft);letter-spacing:.01em}
.field input,.field select,.field textarea{
  font-family:inherit;font-size:1rem;color:var(--ink);background:var(--paper-2);
  border:1px solid var(--line-strong);border-radius:12px;padding:.85em 1em;transition:border-color .25s,box-shadow .25s;width:100%
}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--indigo);box-shadow:0 0 0 4px rgba(37,47,105,.1)}
.field textarea{resize:vertical;min-height:120px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media(max-width:520px){.field-row{grid-template-columns:1fr}}
.form-note{font-size:.84rem;color:var(--muted);line-height:1.5}
.contact-aside{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius-lg);padding:clamp(28px,4vw,44px)}
.contact-aside h3{font-size:1.4rem;font-weight:400;letter-spacing:-.01em}
.ca-item{display:grid;grid-template-columns:auto 1fr;gap:16px;padding:18px 0;border-top:1px solid var(--line)}
.ca-item:first-of-type{border-top:none}
.ca-item .ca-ico{width:42px;height:42px;border-radius:11px;background:rgba(76,107,97,.1);color:var(--sage);display:flex;align-items:center;justify-content:center;flex:none}
.ca-item .ca-ico svg{width:20px;height:20px}
.ca-item b{display:block;font-weight:500;font-size:1rem}
.ca-item span{color:var(--muted);font-size:.95rem}
.form-success{display:none;padding:18px 20px;border-radius:12px;background:rgba(76,107,97,.1);border:1px solid rgba(76,107,97,.3);color:#33503f;font-size:.96rem}
.form-success.show{display:block}

/* steps (what happens next) */
.steps{display:flex;flex-direction:column;gap:4px;margin-top:14px}
.step-row{display:grid;grid-template-columns:auto 1fr;gap:18px;padding:18px 0;border-top:1px solid var(--line)}
.step-row .sr-num{width:34px;height:34px;border-radius:50%;background:var(--indigo);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.95rem;font-weight:500;flex:none}
.step-row b{font-weight:500}
.step-row p{color:var(--muted);margin-top:4px;font-size:.97rem;line-height:1.5}

/* two-col stat row (about) */
.about-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,2.5vw,40px);text-align:center}
.about-stats .as-num{font-size:clamp(2.4rem,4vw,3.4rem);font-weight:200;color:var(--ink);letter-spacing:-.02em;line-height:1}
.about-stats .as-lbl{margin-top:10px;color:var(--muted);font-size:.95rem}
@media(max-width:760px){.about-stats{grid-template-columns:repeat(2,1fr);gap:32px}}

/* pull image band */
.image-band{height:clamp(280px,40vw,460px);border-radius:var(--radius-lg);overflow:hidden;position:relative}
.image-band img{width:100%;height:100%;object-fit:cover}
.image-band .ib-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,23,43,.66),rgba(20,23,43,.12));display:flex;align-items:center}
.image-band .ib-overlay .container{color:var(--paper)}
.image-band .ib-overlay h2{color:#fff;max-width:560px}

/* note card */
.note-card{border-left:3px solid var(--gold);background:var(--paper-2);border-radius:0 14px 14px 0;padding:24px 28px}
.note-card h4{font-size:1.1rem;font-weight:600}
.note-card p{margin-top:8px;color:var(--muted);line-height:1.6}

/* =============================================================
   FANCIER MOTION LAYER  (added on request)
   ============================================================= */

/* scroll progress bar */
.scroll-progress{position:fixed;top:0;left:0;right:0;height:3px;transform:scaleX(0);transform-origin:0 50%;
  background:linear-gradient(90deg,var(--odds-orange),var(--gold-bright));z-index:200;will-change:transform;pointer-events:none}

/* nav auto-hide on scroll-down */
.nav{transition:background .4s var(--ease),border-color .4s,box-shadow .4s,transform .55s var(--ease)}
.nav.nav-hidden{transform:translateY(-100%)}

/* hero aurora drift (no markup needed) */
.hero::before{animation:auroraDrift 19s ease-in-out infinite alternate}
.hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(440px 340px at 16% 28%,rgba(245,130,32,.12),transparent 60%),
             radial-gradient(520px 420px at 92% 88%,rgba(61,92,196,.10),transparent 62%);
  animation:auroraDrift2 24s ease-in-out infinite alternate}
@keyframes auroraDrift{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(-2.5%,2%,0) scale(1.07)}}
@keyframes auroraDrift2{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(4%,-3%,0) scale(1.05)}}

/* floating hero overlay cards */
.hero-visual .float-tag{animation:floaty 5.5s ease-in-out infinite}
.hero-visual .glass-card{animation:floaty 7s ease-in-out infinite .5s}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}

/* shimmering italic accent words */
.accent{
  background:linear-gradient(100deg,var(--gold) 16%,var(--gold-bright) 36%,var(--odds-orange) 56%,var(--gold) 82%);
  background-size:230% auto;-webkit-background-clip:text;background-clip:text;
  color:transparent;-webkit-text-fill-color:transparent;animation:shine 7.5s linear infinite}
@keyframes shine{0%{background-position:180% center}100%{background-position:-90% center}}

/* gold pill float on the topbar dot */
.topbar .tb-dot{animation:pulseDot 2.6s ease-in-out infinite}
@keyframes pulseDot{0%,100%{box-shadow:0 0 0 4px rgba(227,189,106,.18)}50%{box-shadow:0 0 0 7px rgba(227,189,106,.05)}}

/* tilt + magnetic helpers (JS-driven) */
.card,.tier{will-change:transform}
.tilt-active{transition:transform .1s ease-out!important}

/* richer reveal: blur + lift + slight scale (overrides the base rule above) */
.reveal{opacity:0;transform:translateY(32px) scale(.985);filter:blur(9px);
  transition:opacity 1s var(--ease-out),transform 1.05s var(--ease-out),filter 1s var(--ease-out)}
.reveal.in{opacity:1;transform:none;filter:none}

/* clip-wipe reveal variant */
.reveal-clip{clip-path:inset(0 0 100% 0);opacity:0;transition:clip-path 1.15s var(--ease-out),opacity 1.15s var(--ease-out)}
.reveal-clip.in{clip-path:inset(0 0 0 0);opacity:1}

@media(prefers-reduced-motion:reduce){
  .reveal,.reveal-clip{opacity:1!important;transform:none!important;filter:none!important;clip-path:none!important;transition:none!important}
  .accent{animation:none}
  .hero::before,.hero::after,.float-tag,.glass-card,.tb-dot{animation:none!important}
}

/* logo: preserve real aspect ratio (no squishing), no text wordmark */
.brand{gap:0}
.brand .logo-mark{height:40px;width:auto;max-width:210px;object-fit:contain}
.footer .brand .logo-mark{height:38px}
@media(max-width:520px){.brand .logo-mark{height:34px;max-width:170px}}

/* ============================================================
   WEARABLES COMPARISON + JOURNAL
   ============================================================ */
.compare th.odds-col,.compare td.odds-col{background:rgba(61,92,196,.05)}
.compare th.odds-col{color:var(--odds-blue)}
.compare td.odds-col{color:var(--ink);font-weight:500}
.compare td.wear{color:var(--muted)}
.compare thead th.center{text-align:left}

/* point cards (icon-free) */
.point-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(16px,2vw,24px)}
.point{padding:26px 28px;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper-2);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.point:hover{transform:translateY(-4px);box-shadow:0 30px 60px -46px rgba(20,23,43,.4)}
.point .p-k{font-size:.74rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--odds-orange)}
.point h4{margin-top:10px;font-size:1.14rem;font-weight:500;letter-spacing:-.01em}
.point p{margin-top:9px;color:var(--muted);line-height:1.55;font-size:.99rem}
@media(max-width:680px){.point-grid{grid-template-columns:1fr}}

/* section head with a trailing link */
.section-head.row{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;max-width:none}
.section-head.row .link-arrow{flex:none;margin-bottom:6px}
@media(max-width:680px){.section-head.row{flex-direction:column;align-items:flex-start}}

/* journal teaser cards */
.art-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2vw,28px)}
.art-card{display:flex;flex-direction:column;background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);padding:28px;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.art-card:hover{transform:translateY(-5px);box-shadow:0 36px 64px -46px rgba(20,23,43,.4)}
.art-tag{align-self:flex-start;font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--odds-blue);background:rgba(61,92,196,.08);padding:.42em .8em;border-radius:100px}
.art-card h3{margin-top:18px;font-size:1.24rem;font-weight:500;letter-spacing:-.01em;line-height:1.22}
.art-card p{margin-top:12px;color:var(--muted);line-height:1.55;font-size:.99rem;flex:1}
.art-meta{margin-top:20px;padding-top:16px;border-top:1px solid var(--line);font-size:.84rem;color:var(--muted-2);display:flex;justify-content:space-between;align-items:center}
@media(max-width:880px){.art-grid{grid-template-columns:1fr;max-width:520px;margin-inline:auto}}

/* journal reading layout */
.article{max-width:720px;margin-inline:auto}
.article + .article{margin-top:clamp(56px,8vw,96px);padding-top:clamp(56px,8vw,96px);border-top:1px solid var(--line)}
.article .art-tag{margin-bottom:18px}
.article h2{font-size:clamp(1.7rem,3vw,2.5rem);font-weight:300;letter-spacing:-.02em;line-height:1.1}
.article .art-dek{margin-top:16px;font-size:1.16rem;line-height:1.5;color:var(--ink-soft);font-weight:300}
.article .art-byline{margin-top:18px;font-size:.86rem;color:var(--muted-2);letter-spacing:.02em}
.article .art-body{margin-top:8px}
.article .art-body p{margin-top:20px;color:var(--ink-soft);line-height:1.74;font-size:1.1rem}

/* ============================================================
   FOUNDER VIDEO + BIOMARKER IMAGE ICONS
   ============================================================ */
.founder-video-section{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 80% 20%,rgba(77,122,255,.12),transparent 34%),
    radial-gradient(circle at 18% 88%,rgba(255,140,26,.10),transparent 30%),
    var(--paper);
}
.founder-video-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,72px);align-items:center}
.founder-points{display:grid;gap:12px;margin-top:28px}
.founder-points li{position:relative;padding-left:26px;color:var(--ink-soft);font-weight:500}
.founder-points li::before{
  content:"";position:absolute;left:0;top:.68em;width:9px;height:9px;border-radius:50%;
  background:var(--odds-orange,#ff8c1a);box-shadow:0 0 0 6px rgba(255,140,26,.12)
}
.founder-video-card{
  min-height:clamp(280px,36vw,460px);border-radius:var(--radius-lg,28px);position:relative;overflow:hidden;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,rgba(37,47,105,.92),rgba(8,12,26,.96)),radial-gradient(circle at 80% 20%,rgba(77,122,255,.35),transparent 34%);
  box-shadow:0 30px 80px -45px rgba(20,23,43,.6)
}
.founder-video-card::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 25% 20%,rgba(255,255,255,.18),transparent 28%),linear-gradient(120deg,rgba(255,255,255,.12),transparent 42%);
  pointer-events:none
}
.founder-play{
  width:82px;height:82px;border-radius:50%;background:rgba(255,255,255,.92);color:var(--indigo,#252f69);
  display:inline-flex;align-items:center;justify-content:center;box-shadow:0 18px 50px -20px rgba(0,0,0,.45);
  transition:transform .35s var(--ease,ease),box-shadow .35s var(--ease,ease);z-index:2
}
.founder-play:hover{transform:translateY(-3px) scale(1.04);box-shadow:0 22px 60px -18px rgba(0,0,0,.55)}
.founder-play:focus-visible{outline:3px solid var(--odds-orange,#ff8c1a);outline-offset:5px}
.founder-play span{transform:translateX(2px);font-size:1.25rem}
.founder-video-meta{position:absolute;left:28px;right:28px;bottom:24px;z-index:2;color:#fff}
.founder-video-meta b{display:block;font-size:1.1rem}
.founder-video-meta span{display:block;margin-top:4px;color:rgba(255,255,255,.72);font-size:.95rem}
.biomarker-img-ico{
  width:96px;height:96px;overflow:hidden;border-radius:18px;background:rgba(255,255,255,.65);
  border:1px solid var(--line);display:flex;align-items:center;justify-content:center;
  margin-left:auto;margin-right:auto
}
.biomarker-img-ico img{width:100%;height:100%;object-fit:contain;padding:6px}
.biomarker-icon-pair{display:flex;gap:10px;margin-bottom:18px;justify-content:center}
.biomarker-svg-ico{
  width:96px;height:96px;border-radius:18px;background:linear-gradient(150deg,#eef0f8,#e3e7f4);
  color:var(--indigo);display:flex;align-items:center;justify-content:center
}
.biomarker-svg-ico svg{width:44px;height:44px}
@media(max-width:860px){.founder-video-grid{grid-template-columns:1fr}}

/* ============================================================
   NEON HIGH-TECH LAYER (Odds Neon brandbook)
   Light base stays clinical; dark surfaces go electric.
   ============================================================ */

/* faint blueprint grid on dark surfaces */
.statband::after,.cta-band::after,.quote-block::after,.story::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background-image:linear-gradient(rgba(77,122,255,.05) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(77,122,255,.05) 1px,transparent 1px);
  background-size:48px 48px;
  -webkit-mask-image:radial-gradient(circle at 50% 35%,#000,transparent 82%);
          mask-image:radial-gradient(circle at 50% 35%,#000,transparent 82%)}

/* STAT BAND — electric glow + neon numbers */
.statband::before{background:
  radial-gradient(720px 400px at 85% 120%,rgba(255,140,26,.18),transparent 60%),
  radial-gradient(720px 480px at 4% -20%,rgba(77,122,255,.30),transparent 60%)}
.stat .num{background:linear-gradient(180deg,#fff,#bcd0ff);-webkit-background-clip:text;background-clip:text;
  color:transparent;filter:drop-shadow(0 0 16px rgba(77,122,255,.35))}
.stat .num .unit{-webkit-text-fill-color:var(--neon-gold);color:var(--neon-gold)}

/* PRIMARY BUTTONS — electric edge + glow */
.btn-primary{background:var(--indigo);box-shadow:0 0 0 1px rgba(77,122,255,.28) inset,0 14px 34px -16px rgba(77,122,255,.6)}
.btn-primary:hover{background:#2b3a82;box-shadow:0 0 0 1px rgba(77,122,255,.55) inset,0 16px 42px -12px rgba(77,122,255,.85)}

/* electric interactive accents */
.link-arrow{color:var(--electric)}
.pill .dot{background:var(--electric)}
.eyebrow.sage{color:var(--electric)}

/* DARK BENTO CARD — neon-gold metric glow + electric edge */
.bento .b-dark{box-shadow:inset 0 0 0 1px rgba(77,122,255,.14)}
.bento .b-dark .b-metric{color:var(--neon-gold);text-shadow:0 0 24px rgba(255,208,32,.42)}
.bento .b-dark .b-eyebrow{color:var(--electric-light)}

/* CTA BAND — neon navy + dual glow */
.cta-band{background:linear-gradient(135deg,#0a0f22,#0c1430 55%,#11102c)}
.cta-band::before{background:
  radial-gradient(760px 540px at 90% 0%,rgba(255,140,26,.28),transparent 55%),
  radial-gradient(640px 480px at 0% 110%,rgba(77,122,255,.32),transparent 55%)}

/* FEATURED TIER — electric ring */
.tier.featured{box-shadow:0 0 0 1px rgba(77,122,255,.3),0 50px 90px -50px rgba(77,122,255,.45)}
.tier.featured .t-badge{background:var(--electric);color:#06122e}
.tier.featured .t-name{color:var(--electric-light)}
.tier.featured .t-features li svg{color:var(--electric-light)}

/* QUOTE / STORY — electric wash */
.quote-block::before{background:
  radial-gradient(720px 460px at 80% -10%,rgba(77,122,255,.34),transparent 60%),
  radial-gradient(620px 420px at 0% 120%,rgba(255,140,26,.2),transparent 60%)}
.bigquote em{color:var(--electric-light)}

/* FOOTER — deep neon navy */
.footer{background:var(--night)}

/* HERO — cool electric wash (stays light) */
.hero::before{background:
  radial-gradient(1100px 620px at 80% -8%,rgba(77,122,255,.11),transparent 60%),
  radial-gradient(720px 520px at 6% 110%,rgba(255,140,26,.07),transparent 60%)}

/* scroll progress + topbar dot to electric→orange */
.scroll-progress{background:linear-gradient(90deg,var(--electric),var(--odds-orange))}
