/* styles.css | npmm-lto-funnel v2 - Oct 2026 | External Marketing brand (navy-forward, red CTA)
   v2: typefaces come from --font-head / --font-body so the admin Fonts picker can swap them;
       [[b: ]] bold tag; [[u: ]] is now bold + underline, not italic */
:root{
  --navy:#0A2A47; --navy-mid:#0d3558; --navy-deep:#071d33; --navy-light:#1a4a6e;
  --teal:#32C0C4; --teal-dark:#01888E; --teal-light:#E1F7F8;
  --orange:#FF9840; --orange-light:#FFB46A; --orange-bg:#FDF6EE;
  --brown-primary:#392524; --brown-alt:#5A3B2E; --cream:#F7F3F1;
  --red:#CC0000; --red-hover:#E53333; --white:#FFFFFF;
  --glass-bg:rgba(255,255,255,0.82);
  /* Admin > Fonts overrides these two by injecting a :root rule after this sheet. */
  --font-head:var(--font-head); --font-body:var(--font-body);
  --shadow-soft:0 4px 24px rgba(10,42,71,0.10),0 1px 4px rgba(10,42,71,0.05);
  --shadow-card:0 8px 32px rgba(10,42,71,0.12),0 2px 8px rgba(10,42,71,0.07);
  --shadow-navy:0 8px 32px rgba(10,42,71,0.28),0 2px 8px rgba(10,42,71,0.15);
}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:var(--font-body);font-size:16px;line-height:1.6;color:var(--brown-primary);
  background:#F0F4F8;min-height:100vh;}
.container{max-width:1080px;margin:0 auto;padding:0 1.5rem;}
.narrow{max-width:720px;}

@keyframes cta-glow{0%{box-shadow:0 0 0 0 rgba(204,0,0,0.7),0 4px 16px rgba(204,0,0,0.4);}
  50%{box-shadow:0 0 0 12px rgba(204,0,0,0),0 4px 24px rgba(204,0,0,0.5);}
  100%{box-shadow:0 0 0 0 rgba(204,0,0,0),0 4px 16px rgba(204,0,0,0.4);}}
@keyframes teal-glow{0%{box-shadow:0 0 0 0 rgba(50,192,196,0.6),0 4px 16px rgba(50,192,196,0.3);}
  50%{box-shadow:0 0 0 10px rgba(50,192,196,0),0 4px 24px rgba(50,192,196,0.4);}
  100%{box-shadow:0 0 0 0 rgba(50,192,196,0),0 4px 16px rgba(50,192,196,0.3);}}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}

/* NAV */
nav{position:sticky;top:0;z-index:100;background:var(--navy);border-bottom:2px solid var(--teal-dark);
  padding:0 1.5rem;display:flex;align-items:center;height:56px;}
nav .brand{display:flex;align-items:center;gap:10px;margin-right:auto;text-decoration:none;}
nav .brand img{height:26px;width:auto;display:block;}
nav .secure{font-size:11px;font-weight:700;letter-spacing:.5px;color:rgba(255,255,255,0.6);
  display:flex;align-items:center;gap:6px;}
nav .secure::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--teal);}

/* HERO */
.hero{background:var(--navy);
  padding:64px 1.5rem 60px;text-align:center;position:relative;overflow:hidden;}
.hero::before{content:"";position:absolute;top:-90px;right:-60px;width:340px;height:340px;border-radius:50%;
  background:none;}
.hero::after{content:"";position:absolute;bottom:-110px;left:-50px;width:320px;height:320px;border-radius:50%;
  background:none;}
.hero .inner{position:relative;max-width:760px;margin:0 auto;}
.hero-logo{height:44px;width:auto;margin-bottom:22px;}
.hero-badge{display:inline-block;background:#FFD400;border:none;
  border-radius:10px;padding:9px 24px;font-size:clamp(13px,1.6vw,17px);font-weight:900;letter-spacing:1.5px;
  text-transform:uppercase;color:#0A2A47;margin-bottom:22px;box-shadow:0 4px 14px rgba(0,0,0,.18);}
.hero h1{font-family:var(--font-head);font-weight:400;font-size:clamp(2rem,5vw,3.2rem);color:#fff;
  line-height:1.12;letter-spacing:-1px;}
.hero h1 em{font-style:italic;font-weight:900;color:var(--teal);text-shadow:0 0 28px rgba(50,192,196,0.55);}
.hero p.sub{font-size:17px;color:rgba(255,255,255,0.68);max-width:560px;margin:16px auto 0;font-weight:300;}

/* SECTIONS + TYPE */
section{padding:52px 0 44px;}
.section-label{font-size:11px;font-weight:700;letter-spacing:3.5px;text-transform:uppercase;
  color:var(--teal-dark);margin-bottom:8px;text-align:center;}
.section-title{font-family:var(--font-head);font-size:clamp(1.5rem,3vw,2.1rem);font-weight:400;
  color:var(--navy);line-height:1.2;letter-spacing:-1px;text-align:center;}
.section-title em{font-style:italic;font-weight:900;color:var(--teal-dark);}
h2{font-family:var(--font-head);font-weight:900;color:var(--navy);font-size:1.4rem;margin-bottom:10px;}
h3{font-family:var(--font-head);font-weight:900;color:var(--navy);font-size:1.1rem;margin-bottom:6px;}
p{margin-bottom:12px;}
.lead{font-size:18px;color:var(--brown-alt);font-weight:300;}

/* CARDS */
.glass-card{background:var(--glass-bg);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,0.5);
  border-radius:20px;box-shadow:var(--shadow-card);padding:26px 28px;margin-bottom:18px;}
.navy-card{background:var(--navy);border-radius:20px;padding:28px;
  box-shadow:var(--shadow-navy);color:#fff;margin-bottom:18px;}
.navy-card h2,.navy-card h3{color:#fff;}
.teal-card{background:var(--teal-dark);border-radius:20px;padding:26px;color:#fff;}
.red-card{background:var(--red);border-radius:20px;padding:24px;color:#fff;}

/* BUTTONS */
.btn{border-radius:100px;font-family:var(--font-body);font-weight:900;font-size:15px;padding:15px 32px;
  border:none;cursor:pointer;transition:transform .15s;display:inline-flex;align-items:center;justify-content:center;
  gap:8px;text-decoration:none;line-height:1;}
.btn:hover{transform:translateY(-1px);}
.btn-primary{background:var(--red);color:#fff;animation:cta-glow 2.2s ease-in-out infinite;}
.btn-primary:hover{background:var(--red-hover);}
.btn-teal{background:var(--teal-dark);color:#fff;}
.btn-block{display:flex;width:100%;}
.btn-lg{font-size:17px;padding:18px 36px;}
.btn-decline{background:none;border:none;color:var(--brown-alt);font-size:15px;text-decoration:underline;
  cursor:pointer;margin-top:16px;opacity:1;}
.btn-decline:hover{opacity:1;}

/* FORM + CHECKOUT */
.field{margin-bottom:14px;}
.field label{display:block;font-size:12px;font-weight:700;color:var(--navy);margin-bottom:5px;letter-spacing:.3px;}
.field input{width:100%;padding:13px 14px;border:1.5px solid #d5dee8;border-radius:12px;font-size:15px;
  font-family:inherit;color:var(--brown-primary);background:#fff;}
.field input:focus{outline:none;border-color:var(--teal-dark);box-shadow:0 0 0 3px rgba(1,136,142,0.12);}
.bump{display:flex;gap:12px;align-items:flex-start;border:2px dashed var(--orange);background:var(--orange-bg);
  border-radius:14px;padding:14px 16px;margin-bottom:12px;cursor:pointer;}
.bump input{margin-top:3px;width:18px;height:18px;accent-color:var(--red);flex-shrink:0;}
.bump .bt{font-weight:900;color:var(--navy);font-size:14px;}
.bump .bd{font-size:12.5px;color:var(--brown-alt);}
.bump .bp{font-weight:900;color:var(--red);white-space:nowrap;margin-left:auto;}
.summary{display:flex;justify-content:space-between;padding:8px 0;font-size:14px;border-bottom:1px solid rgba(10,42,71,0.08);}
.summary.total{font-weight:900;color:var(--navy);font-size:17px;border-bottom:none;padding-top:12px;}
#payment-element{margin:16px 0;}
.pay-note{font-size:12px;color:var(--brown-alt);text-align:center;margin-top:10px;}
.err{color:var(--red);font-size:13px;font-weight:700;margin-top:8px;min-height:18px;}
/* A field the visitor has filled in wrongly. Only applied after they leave it,
   never while they are still typing... nobody wants to be corrected mid-word. */
.field input.invalid,.optin input.invalid{border:1.5px solid var(--red);box-shadow:0 0 0 3px rgba(204,0,0,0.10);}
.field input.invalid:focus,.optin input.invalid:focus{outline:none;border-color:var(--red);}

/* VALUE LISTS */
ul.checks{list-style:none;padding:0;margin:8px 0;}
ul.checks li{position:relative;padding:7px 0 7px 30px;font-size:15px;border-bottom:1px solid rgba(10,42,71,0.07);}
ul.checks li:last-child{border-bottom:none;}
ul.checks li::before{content:"\2713";position:absolute;left:2px;top:7px;width:20px;height:20px;border-radius:50%;
  background:var(--teal-dark);color:#fff;font-size:12px;font-weight:900;display:flex;align-items:center;justify-content:center;}

/* GRID + LOCK STATES (welcome) */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;}
.prod{background:#fff;border-radius:14px;box-shadow:var(--shadow-soft);padding:18px;border:1px solid #e6edf4;}
.prod.locked{opacity:.6;filter:grayscale(0.4);}
.prod .tagline{font-size:12px;color:var(--brown-alt);}
.prod .status{font-size:11px;font-weight:900;letter-spacing:.5px;text-transform:uppercase;margin-top:8px;}
.prod.unlocked .status{color:var(--teal-dark);}
.prod.locked .status{color:var(--brown-alt);}
.embed-frame{width:100%;min-height:640px;border:none;border-radius:16px;background:#fff;box-shadow:var(--shadow-card);}

footer{background:var(--navy);color:rgba(255,255,255,0.6);text-align:center;padding:28px 1.5rem;font-size:12px;}
footer a{color:var(--teal);text-decoration:none;}
.optin{display:flex;flex-direction:column;gap:10px;max-width:440px;margin:24px auto 0;text-align:left;}
.optin input{padding:14px 16px;border-radius:12px;border:none;font-size:15px;font-family:inherit;width:100%;color:var(--brown-primary);}
.optin input:focus{outline:3px solid rgba(50,192,196,0.55);}
.center{text-align:center;}
.mt24{margin-top:24px;} .mt16{margin-top:16px;}
.fade{animation:fadeUp .5s ease both;}

/* ===== v2 attract-page components (July 2026) ===== */
/* Wider hero shell to hold the 2-column video + CTA layout */
.hero-wide{max-width:1000px;}
.hero-split{display:grid;grid-template-columns:1.05fr 0.95fr;gap:32px;align-items:center;margin-top:28px;text-align:left;}
.hero-split .optin{margin:0;max-width:none;}

/* Video (left) */
.hero-video{width:100%;}
.video-frame{position:relative;width:100%;aspect-ratio:16/9;border-radius:18px;overflow:hidden;
  background:#0b3a5f;border:1px solid rgba(50,192,196,0.35);
  box-shadow:var(--shadow-navy);display:flex;flex-direction:column;align-items:center;justify-content:center;}
.video-play{width:66px;height:66px;border-radius:50%;background:rgba(255,255,255,0.95);
  display:flex;align-items:center;justify-content:center;box-shadow:0 6px 22px rgba(0,0,0,0.35);}
.video-play::after{content:"";display:block;width:0;height:0;margin-left:5px;
  border-left:20px solid var(--red);border-top:12px solid transparent;border-bottom:12px solid transparent;}
.video-cap{margin-top:16px;font-size:13px;font-weight:700;letter-spacing:.3px;color:rgba(255,255,255,0.85);
  padding:0 20px;text-align:center;}

/* CTA column (right) */
.hero-cta{width:100%;}
.cta-note{font-size:13px;color:rgba(255,255,255,0.72);margin:12px 2px 0;font-weight:300;}
.cta-note s{color:rgba(255,255,255,0.5);}
.cta-note strong{color:var(--teal);font-weight:900;}

/* Avatar stack */
.avatar-stack{display:flex;align-items:center;gap:12px;margin-top:20px;
  background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.12);border-radius:100px;padding:8px 16px 8px 10px;}
.avatar-stack .faces{display:flex;flex-shrink:0;}
.avatar-stack .faces img{width:38px;height:38px;border-radius:50%;object-fit:cover;
  border:2px solid #fff;margin-left:-12px;background:#0b3a5f;}
.avatar-stack .faces img:first-child{margin-left:0;}
.avatar-text{margin:0;font-size:13.5px;font-weight:500;color:rgba(255,255,255,0.9);line-height:1.35;}
.avatar-text #joined-count{font-weight:900;color:var(--teal);}

/* Price card */
.price-card{text-align:center;}
.price-line{display:flex;align-items:baseline;justify-content:center;gap:16px;margin-bottom:8px;}
.price-was{font-family:var(--font-head);font-size:2rem;color:var(--brown-alt);text-decoration:line-through;
  text-decoration-color:var(--red);text-decoration-thickness:2px;opacity:.75;}
.price-now{font-family:var(--font-head);font-weight:900;font-size:3.6rem;color:var(--navy);line-height:1;}
.price-sub{font-size:15px;color:var(--brown-alt);max-width:460px;margin:0 auto 20px;}

/* Why-Tom stat row */
.stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:940px;margin:0 auto;}
.stat{background:#fff;border:1px solid #e6edf4;border-radius:16px;box-shadow:var(--shadow-soft);
  padding:22px 16px;text-align:center;}
.stat-num{display:block;font-family:var(--font-head);font-weight:900;font-size:2.1rem;color:var(--teal-dark);line-height:1;}
.stat-cap{display:block;margin-top:8px;font-size:13px;color:var(--brown-alt);line-height:1.35;}

/* Guarantee card with badge */
.guarantee-card{display:flex;align-items:center;gap:24px;}
.guarantee-badge{width:120px;height:auto;flex-shrink:0;filter:drop-shadow(0 4px 12px rgba(0,0,0,0.25));}

/* Responsive */
@media(max-width:760px){
  .hero-split{grid-template-columns:1fr;gap:22px;text-align:center;}
  .hero-split .optin{max-width:440px;margin:0 auto;}
  .avatar-stack{justify-content:center;}
  .stat-row{grid-template-columns:repeat(2,1fr);}
  .guarantee-card{flex-direction:column;text-align:center;gap:16px;}
  .price-now{font-size:3rem;}
}

/* ===== v3 Meet-Tom bio block (July 2026) ===== */
.bio-row{display:grid;grid-template-columns:auto 1fr;gap:28px;align-items:center;max-width:840px;margin:0 auto 26px;}
.bio-photo{width:180px;height:180px;border-radius:20px;object-fit:cover;object-position:top center;
  box-shadow:var(--shadow-card);border:3px solid #fff;flex-shrink:0;}
.bio-copy p{margin-bottom:12px;font-size:15.5px;}
.bio-copy p:last-child{margin-bottom:0;}
@media(max-width:760px){
  .bio-row{grid-template-columns:1fr;text-align:center;justify-items:center;gap:18px;}
  .bio-copy{text-align:left;}
}

/* ===== v3 order-bump tightening + why/nudge copy (July 2026) ===== */
.bump-intro{font-size:12.5px;color:var(--brown-alt);margin:2px 0 12px;font-weight:500;}
.bump{padding:11px 14px;margin-bottom:9px;gap:11px;align-items:flex-start;}
.bump .btxt{display:block;line-height:1.32;}
.bump .bt{display:block;font-weight:900;color:var(--navy);font-size:14px;margin-bottom:2px;}
.bump .bd{display:block;font-size:12.5px;color:var(--brown-alt);margin-bottom:3px;}
.bump .bnudge{display:block;font-size:11.5px;font-weight:900;color:var(--red);letter-spacing:.1px;}

/* ===== v2 one-time-offer (upsell/downsell) blocks (July 2026) ===== */
.oto-reason{background:var(--teal-light);border-left:4px solid var(--teal-dark);border-radius:10px;
  padding:12px 16px;font-size:14px;color:var(--navy);margin:16px 0;line-height:1.5;}
.oto-reason strong{color:var(--teal-dark);}
.oto-note{font-size:12.5px;color:var(--brown-alt);text-align:center;margin-top:10px;font-weight:500;}
.decline-note{display:block;text-align:center;font-size:11.5px;color:var(--brown-alt);margin-top:2px;opacity:.75;}
.summary.strike span:last-child{text-decoration:line-through;text-decoration-color:var(--red);color:var(--brown-alt);}

/* ===== v3 checkout intent-reinforcement blocks (July 2026) ===== */
.checkout-lead{font-size:15.5px;color:var(--brown-alt);margin:0 0 16px;line-height:1.5;}
.checkout-lead strong{color:var(--navy);font-weight:900;}
.checkout-proof{font-style:italic;font-size:14px;color:var(--navy);background:var(--teal-light);
  border-left:4px solid var(--teal-dark);border-radius:10px;padding:12px 16px;margin:16px 0 0;line-height:1.5;}
.guarantee-strip{margin-top:14px;padding:12px 16px;border:1.5px dashed var(--teal-dark);border-radius:12px;
  background:rgba(50,192,196,0.06);font-size:13px;color:var(--brown-alt);line-height:1.45;text-align:center;}
.guarantee-strip strong{color:var(--teal-dark);}

/* ===== v3.1 checkout readability: larger bump type + roomier fields (July 2026) ===== */
.bump-intro{font-size:14px;}
.bump .bt{font-size:16px;}
.bump .bd{font-size:14.5px;line-height:1.4;}
.bump .bnudge{font-size:13px;}
.field input{font-size:15.5px;padding:14px;}

/* ===== v3.1 checkout readability: larger bump type + roomier fields (July 2026) ===== */
.bump-intro{font-size:14px;}
.bump .bt{font-size:16px;}
.bump .bd{font-size:14.5px;line-height:1.4;}
.bump .bnudge{font-size:13px;}
.field input{font-size:15.5px;padding:14px;}

/* ===== v3.2 footer legal + secure badge + checkout guarantee badge (July 2026) ===== */
.secure-badge{font-weight:700;color:rgba(255,255,255,0.85);margin-bottom:8px;letter-spacing:.3px;}
.secure-badge::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;
  background:var(--teal);margin-right:7px;vertical-align:middle;}
footer a{margin:0 3px;}
.guarantee-strip.with-badge{display:flex;align-items:center;gap:14px;text-align:left;}
.guarantee-badge-sm{width:66px;height:auto;flex-shrink:0;filter:drop-shadow(0 3px 8px rgba(0,0,0,0.18));}
@media(max-width:520px){.guarantee-strip.with-badge{flex-direction:column;text-align:center;}}

/* ===== v3.3 order-bump bigger type + glowing featured checkbox (July 2026) ===== */
.bump-intro{font-size:15px;}
.bump .bt{font-size:18px;}
.bump .bd{font-size:16px;line-height:1.45;}
.bump .bnudge{font-size:14px;}
.bump .bp{font-size:18px;}
@keyframes check-glow{
  0%{box-shadow:0 0 0 0 rgba(204,0,0,0.65);}
  50%{box-shadow:0 0 0 7px rgba(204,0,0,0);}
  100%{box-shadow:0 0 0 0 rgba(204,0,0,0);}}
.bump input.glow-check{
  width:22px;height:22px;border-radius:5px;accent-color:var(--red);
  outline:2px solid var(--red);outline-offset:2px;
  animation:check-glow 1.7s ease-in-out infinite;}

/* ===== v3.4 order-bump badges (Recommended / Popular) (July 2026) ===== */
.bump{position:relative;}
.bump-badge{position:absolute;top:-11px;left:16px;font-size:11px;font-weight:900;letter-spacing:.4px;
  text-transform:uppercase;padding:3px 11px;border-radius:100px;color:#fff;
  box-shadow:0 2px 8px rgba(10,42,71,0.22);white-space:nowrap;}
.bump-badge.rec{background:var(--teal-dark);}
.bump-badge.pop{background:var(--orange);color:var(--navy);}

/* ===== v4 STANDARD ORDER-FORM LAYOUT: form left + sticky rail right (July 2026) ===== */
.order-grid{display:grid;grid-template-columns:1fr 330px;gap:24px;align-items:start;max-width:1040px;margin:0 auto;}
.order-main{min-width:0;}
.order-aside{position:sticky;top:70px;display:flex;flex-direction:column;gap:16px;}
.countdown-card{background:var(--navy);border-radius:16px;
  padding:18px 16px;text-align:center;color:#fff;box-shadow:var(--shadow-navy);}
.cd-title{font-family:var(--font-head);font-weight:900;font-size:15px;margin-bottom:8px;}
.cd-clock{font-family:var(--font-head);font-weight:900;font-size:2.6rem;line-height:1;color:var(--teal);letter-spacing:1px;}
.cd-sep{opacity:.5;margin:0 2px;}
.cd-note{font-size:11.5px;color:rgba(255,255,255,0.7);margin-top:8px;}
.included-card .checks li{font-size:13.5px;padding:6px 0 6px 28px;}
.guarantee-aside{text-align:center;}
.guarantee-aside .guarantee-badge-sm{width:76px;height:auto;margin:0 auto 10px;display:block;}
.secure-line{font-size:11px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--brown-alt);text-align:center;margin:2px 0 0;}
@media(max-width:820px){
  .order-grid{grid-template-columns:1fr;}
  .order-aside{position:static;order:-1;}
}

/* ===== v5 What's Included heading + values + bump was/now pricing (July 2026) ===== */
.included-title{font-family:var(--font-head);font-weight:900;font-size:20px;color:var(--navy);
  text-align:center;margin:0 0 6px;padding-bottom:10px;border-bottom:2px solid rgba(10,42,71,0.12);}
.included-card .checks{margin-top:10px;}
.included-card .checks li{display:flex;justify-content:space-between;align-items:baseline;gap:10px;
  font-size:13.5px;padding:7px 0 7px 26px;}
.included-card .checks li::before{top:9px;}
.inc-txt{flex:1;}
.inc-val{flex:none;font-weight:900;color:var(--navy);white-space:nowrap;}
.inc-total{display:flex;justify-content:space-between;align-items:baseline;border-top:2px solid rgba(10,42,71,0.12);
  margin-top:6px;padding-top:10px;font-weight:900;color:var(--navy);}
.tv-was{color:var(--navy);text-decoration:line-through;text-decoration-color:var(--red);text-decoration-thickness:2px;}
.tv-now{color:var(--red);font-size:1.25em;}
/* bump price stack: regular (navy, red strikethrough) over actual (red, +4pt) */
.bump .bp{display:flex;flex-direction:column;align-items:flex-end;gap:1px;line-height:1.05;white-space:nowrap;}
.bp-was{font-size:18px;font-weight:900;color:var(--navy);text-decoration:line-through;
  text-decoration-color:var(--red);text-decoration-thickness:2px;}
.bp-now{font-size:22px;font-weight:900;color:var(--red);}

/* ===== v6 badge recolor + included benefits + bigger guarantee (July 2026) ===== */
.bump-badge.rec{background:var(--navy);color:#FFD400;}
.bump-badge.pop{background:var(--orange);color:var(--navy);}
.included-card .checks li{display:block;padding:9px 0 9px 26px;}
.included-card .checks li::before{top:11px;}
.inc-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;}
.inc-txt{flex:1;}
.inc-ben{display:block;font-size:12px;font-weight:300;color:var(--brown-alt);line-height:1.35;margin-top:3px;}
.guarantee-aside .guarantee-badge-sm{width:190px;height:auto;margin:0 auto;display:block;}
.ga-title{font-family:var(--font-head);font-weight:900;color:#fff;text-transform:uppercase;
  font-size:1.75rem;letter-spacing:1px;line-height:1;margin:-46px 0 12px;position:relative;z-index:2;
  text-shadow:0 2px 10px rgba(0,0,0,.55);}

/* ===== v7 legibility bump: raise small text (min ~14px on selling copy) (July 2026) ===== */
.pay-note{font-size:14px;}
.cta-note{font-size:14px;}
.video-cap{font-size:14px;}
.cd-note{font-size:13px;}
.secure-line{font-size:12.5px;}
.stat-cap{font-size:14px;}
.inc-ben{font-size:13px;}
.oto-note{font-size:14px;}
.decline-note{font-size:13px;}
.avatar-text{font-size:14.5px;}
.checkout-proof{font-size:14.5px;}
.bump .bd{font-size:15px;}
footer{font-size:13px;}
ul.checks li{font-size:15px;}
.included-card .checks li{font-size:13.5px;}

/* ===== v7 welcome: 2-col hero + clickable member cards + lock icon (July 2026) ===== */
.welcome-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:30px;align-items:center;text-align:left;max-width:960px;margin:0 auto;position:relative;}
.welcome-hero .wh-copy .hero-badge{margin-bottom:16px;}
@media(max-width:760px){.welcome-hero{grid-template-columns:1fr;text-align:center;}.welcome-hero .wh-copy .hero-badge{margin-left:auto;margin-right:auto;}}
a.prod{display:block;text-decoration:none;color:inherit;position:relative;transition:transform .15s,box-shadow .15s;}
a.prod:hover{transform:translateY(-3px);box-shadow:var(--shadow-card);}
.prod.locked::after{content:"";position:absolute;top:12px;right:12px;width:20px;height:20px;opacity:.5;
  background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230A2A47'%3E%3Cpath d='M12 1a5 5 0 00-5 5v3H6a2 2 0 00-2 2v9a2 2 0 002 2h12a2 2 0 002-2v-9a2 2 0 00-2-2h-1V6a5 5 0 00-5-5zm3 8H9V6a3 3 0 016 0v3z'/%3E%3C/svg%3E");}
.prod .tagline{font-size:13.5px;line-height:1.45;}

/* ===== v8 UNIFIED TYPE SCALE + TITLE CASE + BIGGER EYEBROWS + BLENDED DECLINE (July 2026) ===== */
/* One consistent, larger scale for headings and subheads across every funnel page. */
.hero h1,
h1{font-family:var(--font-head);font-weight:400;font-size:clamp(2.3rem,5vw,3.4rem);
  line-height:1.1;letter-spacing:-1px;text-transform:capitalize;}
h2,.section-title{font-family:var(--font-head);font-size:clamp(1.85rem,3.4vw,2.5rem);
  font-weight:900;color:var(--navy);line-height:1.18;letter-spacing:-.5px;margin-bottom:12px;
  text-transform:capitalize;}
.section-title{font-weight:400;}
h3{font-family:var(--font-head);font-weight:900;color:var(--navy);
  font-size:clamp(1.25rem,2vw,1.5rem);line-height:1.25;margin-bottom:8px;text-transform:capitalize;}
/* keep the em emphasis colored + italic (title-case shouldn't touch the accent styling) */
.hero h1 em,h2 em,.section-title em,h3 em{text-transform:none;}
/* subheads + leads: one consistent, legible size */
.hero p.sub,.sub{font-size:clamp(17px,2vw,20px);line-height:1.5;font-weight:300;}
.lead{font-size:clamp(18px,2vw,21px);line-height:1.55;font-weight:300;}
/* eyebrows were far too small ... raise + keep the tracking */
.hero-badge{font-size:clamp(13px,1.6vw,17px);letter-spacing:1.5px;padding:9px 24px;}
.section-label{font-size:13px;letter-spacing:3px;}
/* decline link: 1pt smaller, not bold, blended into the background so it recedes */
.btn-decline{font-size:15px !important;font-weight:500 !important;text-decoration:underline;
  color:rgba(10,42,71,.72) !important;opacity:1;}
.hero .btn-decline,.navy-card .btn-decline{color:rgba(255,255,255,.62) !important;}
.btn-decline:hover{color:rgba(10,42,71,.62) !important;}
.hero .btn-decline:hover{color:rgba(255,255,255,.6) !important;}

/* ===== v9 FLUID TYPE TOKENS (Utopia-style clamp: floor + slope + ceiling; 16px body floor) ===== */
:root{
  --step--1: clamp(0.83rem, 0.80rem + 0.16vw, 0.94rem);  /* eyebrows / fine print */
  --step-0:  clamp(1rem,    0.95rem + 0.24vw, 1.15rem);  /* body (16px floor) */
  --step-1:  clamp(1.15rem, 1.04rem + 0.55vw, 1.5rem);   /* lead / subhead */
  --step-2:  clamp(1.4rem,  1.20rem + 0.9vw,  2rem);     /* h3 */
  --step-3:  clamp(1.95rem, 1.56rem + 1.94vw, 3.05rem);  /* h2 / section title */
  --step-5:  clamp(2.6rem,  1.90rem + 3.4vw,  4.4rem);   /* hero h1 */
}
body{font-size:var(--step-0);}
.hero h1,h1{font-size:var(--step-5);}
h2,.section-title{font-size:var(--step-3);}
h3{font-size:var(--step-2);}
.hero p.sub,.sub{font-size:var(--step-1);}
.lead{font-size:var(--step-1);}
.hero-badge,.section-label{font-size:var(--step--1);}
/* keep the em accent styling; tokens only touch size */
.hero h1 em,h2 em,.section-title em,h3 em{font-size:inherit;}

/* ===== v10 EMPHASIS TOKEN SYSTEM =====================================
   Headline / subhead emphasis is written as plain-text tokens so the same
   string round-trips through the Admin copy editor, the A/B variant fields
   and the page default markup:

     [[ words ]]      -> accent 1   (teal)        <em class="em1">
     [[2: words ]]    -> accent 2   (orange)      <em class="em2">
     [[hl: words ]]   -> highlighter behind text  <em class="emhl">
     [[u: words ]]    -> bold + underline          <em class="emu">
     [[b: words ]]    -> bold only                 <em class="emb">
     ||               -> desktop-only line break  <br class="hb">

   Legacy <em>word</em> still renders as accent 1.
   Renderer lives in src/worker.js (renderCopy) and is mirrored inline on
   any page that swaps copy client-side (A/B runtime).
   ==================================================================== */
:root{
  --em1:var(--teal);          /* accent 1 on dark backgrounds */
  --em2:var(--orange);        /* accent 2 on dark backgrounds */
  --em1-ink:var(--teal-dark); /* accent 1 on light backgrounds */
  --em2-ink:#D4720F;          /* accent 2 on light backgrounds */
}
em.em1,em.em2,em.emhl{font-style:italic;font-weight:900;font-size:inherit;}
/* Bold and underline stay upright and keep the surrounding colour. The hero/h2/h3
   rules below are repeated with the class so they outrank the generic `.hero h1 em`. */
em.emu,em.emb,.hero h1 em.emu,.hero h1 em.emb,.hero em.emu,.hero em.emb,.navy-card em.emu,.navy-card em.emb,
h2 em.emu,h2 em.emb,h3 em.emu,h3 em.emb,.section-title em.emu,.section-title em.emb{
  font-style:normal;font-weight:900;font-size:inherit;color:inherit;text-shadow:none;}
.hero em.em1,.navy-card em.em1{color:var(--em1);text-shadow:0 0 28px rgba(50,192,196,.55);}
.hero em.em2,.navy-card em.em2{color:var(--em2);text-shadow:0 0 28px rgba(255,152,64,.45);}
em.em1{color:var(--em1-ink);}
em.em2{color:var(--em2-ink);}
em.emhl{color:inherit;background:linear-gradient(180deg,transparent 58%,rgba(255,152,64,.42) 58%);
  padding:0 .08em;border-radius:2px;}
/* On navy a 42% orange bar reads as a smudge, so on dark backgrounds the highlighter
   goes near-solid and the words stay white. */
.hero em.emhl,.navy-card em.emhl{color:#fff;text-shadow:none;
  background:linear-gradient(180deg,transparent 56%,rgba(255,152,64,.92) 56%);}
em.emu{color:inherit;text-decoration:underline;text-decoration-thickness:.07em;
  text-underline-offset:.14em;text-decoration-color:var(--em1);}
/* desktop-only forced line break (collapses to a normal space on small screens) */
br.hb{display:inline;}
@media(max-width:760px){br.hb{display:none;}}
