/* ==========================================================================
   LaunchWebly — styles.css
   Brand identity: ink navy + signal amber on warm paper.
   Heavy editorial type, thick rules, hard offset shadows. No gradients-as-crutch.
   ========================================================================== */

/* ---------- Tokens ---------- */
:root{
  --ink:        #0B1220;   /* near-black navy */
  --ink-2:      #131C2E;
  --ink-3:      #1E293F;
  --paper:      #F7F4EF;   /* warm off-white */
  --paper-2:    #EFE9E0;
  --white:      #FFFFFF;

  --amber:      #FF5A1F;   /* signal accent */
  --amber-dk:   #E04407;
  --amber-lt:   #FFE9DF;

  --green:      #0F7B4F;
  --green-lt:   #E4F3EC;

  --text:       #16202F;
  --text-mute:  #55627A;
  --text-inv:   #F2F5FA;
  --text-inv-mute:#A3B0C6;

  --line:       #DCD5C9;
  --line-dk:    #2C3852;

  --r:          4px;
  --r-lg:       8px;

  --shadow:     6px 6px 0 var(--ink);
  --shadow-sm:  4px 4px 0 var(--ink);

  --wrap:       1180px;
  --wrap-narrow: 800px;

  --ff-display: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --ff-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
}

/* ---------- Reset / base ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:84px; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.01ms!important; transition-duration:.01ms!important; }
}
body{
  margin:0;
  font-family:var(--ff-body);
  font-size:17px;
  line-height:1.65;
  color:var(--text);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; }
button{ font:inherit; }
h1,h2,h3,h4{ font-family:var(--ff-display); line-height:1.08; letter-spacing:-.02em; margin:0 0 .5em; font-weight:800; }
p{ margin:0 0 1em; }
ul,ol{ margin:0; padding:0; list-style:none; }
strong,b{ font-weight:700; }

:focus-visible{ outline:3px solid var(--amber); outline-offset:3px; }

.skip-link{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--ink); color:var(--white); padding:12px 20px; font-weight:700;
}
.skip-link:focus{ left:8px; top:8px; }

.wrap{ width:100%; max-width:var(--wrap); margin:0 auto; padding:0 20px; }
.wrap-narrow{ max-width:var(--wrap-narrow); }
.center{ text-align:center; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  font-family:var(--ff-display); font-weight:800; font-size:16px; letter-spacing:-.01em;
  padding:15px 26px; border:2px solid var(--ink); border-radius:var(--r);
  text-decoration:none; cursor:pointer; text-align:center;
  transition:transform .12s ease, box-shadow .12s ease, background .12s ease;
}
.btn-primary{ background:var(--amber); color:var(--ink); box-shadow:var(--shadow-sm); }
.btn-primary:hover{ background:var(--amber-dk); color:var(--white); transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--ink); }
.btn-primary:active{ transform:translate(2px,2px); box-shadow:1px 1px 0 var(--ink); }

.btn-outline{ background:transparent; color:var(--ink); box-shadow:var(--shadow-sm); }
.btn-outline:hover{ background:var(--ink); color:var(--white); transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--amber); }

.btn-ghost{ background:transparent; border-color:transparent; color:var(--ink); text-decoration:underline; text-underline-offset:5px; text-decoration-thickness:2px; padding:15px 8px; box-shadow:none; }
.btn-ghost:hover{ color:var(--amber-dk); }

.btn-sm{ padding:11px 18px; font-size:14px; }
.btn-lg{ padding:18px 34px; font-size:18px; }
.btn-xl{ padding:22px 44px; font-size:21px; box-shadow:8px 8px 0 var(--ink); }
.btn-block{ display:flex; width:100%; }

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:100;
  background:var(--paper);
  border-bottom:2px solid var(--ink);
  transition:box-shadow .2s ease;
}
.site-header.scrolled{ box-shadow:0 4px 0 rgba(11,18,32,.08); }
.header-inner{ display:flex; align-items:center; gap:20px; min-height:68px; }

.brand{ display:flex; align-items:center; gap:10px; text-decoration:none; flex:0 0 auto; }
.brand-mark{
  width:34px; height:34px; display:grid; place-items:center;
  background:var(--amber); color:var(--ink); border:2px solid var(--ink); border-radius:var(--r);
  font-family:var(--ff-display); font-weight:900; font-size:19px;
}
.brand-word{ font-family:var(--ff-display); font-weight:900; font-size:20px; letter-spacing:-.03em; }
.brand-word em{ font-style:normal; color:var(--amber-dk); }

.nav-desktop{ display:none; margin-left:auto; gap:26px; }
.nav-desktop a{
  font-size:15px; font-weight:600; text-decoration:none; color:var(--text-mute);
  padding:6px 0; border-bottom:2px solid transparent;
}
.nav-desktop a:hover{ color:var(--ink); border-bottom-color:var(--amber); }
.nav-cta{ display:none; margin-left:8px; }

.nav-toggle{
  margin-left:auto; width:44px; height:44px; display:grid; place-content:center; gap:5px;
  background:transparent; border:2px solid var(--ink); border-radius:var(--r); cursor:pointer;
}
.nav-toggle span{ display:block; width:20px; height:2.5px; background:var(--ink); transition:transform .2s, opacity .2s; }
.nav-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(7.5px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7.5px) rotate(-45deg); }

.nav-mobile{
  display:none; flex-direction:column; gap:2px; padding:14px 20px 22px;
  background:var(--paper); border-bottom:2px solid var(--ink);
}
.nav-mobile.open{ display:flex; }
.nav-mobile a{ padding:13px 0; font-weight:600; text-decoration:none; border-bottom:1px solid var(--line); }
.nav-mobile .btn{ margin-top:14px; border-bottom:2px solid var(--ink); }

/* ---------- Hero ---------- */
.hero{ background:var(--paper); padding:56px 0 0; position:relative; }
.hero::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:radial-gradient(var(--line) 1px, transparent 1px);
  background-size:22px 22px; opacity:.55;
}
.hero-grid{ position:relative; display:grid; gap:40px; }

.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--ff-display); font-size:12.5px; font-weight:700; text-transform:uppercase;
  letter-spacing:.11em; color:var(--text-mute);
  background:var(--white); border:2px solid var(--ink); border-radius:100px; padding:7px 15px;
  margin:0 0 22px;
}
.eyebrow .dot{ width:8px; height:8px; border-radius:50%; background:var(--green); flex:0 0 auto; }

.hero h1{
  font-size:clamp(2.35rem, 7vw, 4.15rem);
  font-weight:900; letter-spacing:-.035em; margin-bottom:.35em;
}
.hero h1 .hl{
  background:linear-gradient(180deg, transparent 62%, var(--amber) 62%, var(--amber) 96%, transparent 96%);
  padding:0 .06em;
}
.lede{ font-size:clamp(1.06rem,2.2vw,1.28rem); color:var(--text-mute); max-width:38ch; margin-bottom:1.6em; }
.lede strong{ color:var(--ink); }

.hero-cta{ display:flex; flex-wrap:wrap; align-items:center; gap:14px; margin-bottom:14px; }
.micro{ font-size:14px; color:var(--text-mute); margin-bottom:1.6em; }
.micro.light{ color:var(--text-inv-mute); }

.hero-points{ display:flex; flex-wrap:wrap; gap:10px 26px; }
.hero-points li{ display:flex; align-items:center; gap:8px; font-size:15px; font-weight:600; }
.hero-points span{ color:var(--green); font-weight:900; }

/* Hero card */
.hero-card{
  background:var(--ink); color:var(--text-inv);
  border:2px solid var(--ink); border-radius:var(--r-lg);
  box-shadow:var(--shadow); padding:26px;
}
.hero-card-head{ margin-bottom:18px; }
.tag{
  display:inline-block; font-family:var(--ff-display); font-weight:800; font-size:13px;
  letter-spacing:.02em; padding:7px 13px; border-radius:100px;
}
.tag-live{ background:var(--amber); color:var(--ink); }

.check-list li{
  position:relative; padding:11px 0 11px 30px; font-size:15.5px;
  border-bottom:1px solid var(--line-dk);
}
.check-list li:last-child{ border-bottom:0; }
.check-list li::before{
  content:"✓"; position:absolute; left:0; top:10px;
  color:var(--amber); font-weight:900; font-size:15px;
}
.hero-card-foot{ margin-top:20px; padding-top:18px; border-top:2px solid var(--line-dk); }
.slots{ font-size:13.5px; color:var(--text-inv-mute); }
.slots strong{ color:var(--white); }
.slots-bar{ display:block; height:7px; background:var(--ink-3); border-radius:100px; overflow:hidden; margin-bottom:9px; }
.slots-fill{ display:block; height:100%; background:var(--amber); }

/* Trust bar */
.trust-bar{ position:relative; margin-top:56px; background:var(--ink); color:var(--text-inv); border-top:2px solid var(--ink); }
.trust-inner{ display:flex; flex-wrap:wrap; align-items:center; gap:14px 28px; padding-top:18px; padding-bottom:18px; }
.trust-label{
  font-family:var(--ff-display); font-size:11.5px; font-weight:700; text-transform:uppercase;
  letter-spacing:.13em; color:var(--text-inv-mute);
}
.trust-list{ display:flex; flex-wrap:wrap; gap:10px 22px; }
.trust-list li{ font-family:var(--ff-display); font-weight:700; font-size:15px; color:var(--white); }

/* ---------- Section scaffolding ---------- */
.section{ padding:76px 0; border-bottom:2px solid var(--ink); }
.section-dark{ background:var(--ink); color:var(--text-inv); }
.section-dark .section-lede{ color:var(--text-inv-mute); }

.section-eyebrow{
  font-family:var(--ff-display); font-size:12.5px; font-weight:800; text-transform:uppercase;
  letter-spacing:.14em; color:var(--amber-dk); margin:0 0 14px;
}
.section-dark .section-eyebrow,.section-eyebrow.light{ color:var(--amber); }

.section-title{ font-size:clamp(1.85rem,4.4vw,3rem); max-width:22ch; margin-bottom:.5em; }
.section-title.big{ font-size:clamp(2.2rem,6vw,4rem); max-width:none; text-align:center; }
.section-title.left{ max-width:20ch; }
.section-faq .section-title,
.section-guarantee .section-title,
#pricing .section-title,
#proof .section-title{ max-width:24ch; }
.section-lede{ font-size:clamp(1.02rem,2vw,1.18rem); color:var(--text-mute); max-width:62ch; margin-bottom:2.4em; }
.section-lede.center{ margin-left:auto; margin-right:auto; text-align:center; }

/* ---------- Problem ---------- */
.pain-grid{ display:grid; gap:2px; background:var(--line-dk); border:2px solid var(--line-dk); border-radius:var(--r-lg); overflow:hidden; }
.pain{ background:var(--ink); padding:28px 24px; }
.pain-num{
  font-family:var(--ff-display); font-weight:900; font-size:13px; letter-spacing:.1em;
  color:var(--amber); display:block; margin-bottom:12px;
}
.pain h3{ font-size:1.2rem; margin-bottom:.5em; color:var(--white); }
.pain p{ font-size:15.5px; color:var(--text-inv-mute); margin:0; }

.turn{
  margin-top:44px; padding:30px; background:var(--ink-2);
  border:2px solid var(--amber); border-radius:var(--r-lg);
  display:grid; gap:20px; align-items:center;
}
.turn p{ font-size:clamp(1.05rem,2.2vw,1.3rem); margin:0; color:var(--text-inv); }
.turn strong{ color:var(--amber); }
.turn .btn{ justify-self:start; }

/* ---------- Offer ---------- */
.section-offer{ background:var(--paper-2); }
.vs-grid{ display:grid; gap:22px; margin:12px 0 34px; }
.vs-col{ padding:28px 24px; border:2px solid var(--ink); border-radius:var(--r-lg); position:relative; }
.vs-col h3{ font-size:1.3rem; margin-bottom:1em; }
.vs-col ul li{ position:relative; padding:11px 0 11px 30px; font-size:15.5px; border-bottom:1px solid var(--line); }
.vs-col ul li:last-child{ border-bottom:0; }

.vs-them{ background:var(--white); color:var(--text-mute); }
.vs-them h3{ color:var(--text-mute); }
.vs-them li::before{ content:"✕"; position:absolute; left:2px; top:11px; color:#B4180F; font-weight:900; }

.vs-us{ background:var(--ink); color:var(--text-inv); box-shadow:var(--shadow); }
.vs-us h3{ color:var(--white); }
.vs-us li{ border-bottom-color:var(--line-dk); }
.vs-us li::before{ content:"✓"; position:absolute; left:0; top:11px; color:var(--amber); font-weight:900; }
.vs-us strong{ color:var(--amber); }
.vs-badge{
  position:absolute; top:-14px; left:24px;
  background:var(--amber); color:var(--ink); border:2px solid var(--ink);
  font-family:var(--ff-display); font-weight:900; font-size:12px; letter-spacing:.08em;
  text-transform:uppercase; padding:5px 12px; border-radius:100px;
}
.offer-kicker{
  text-align:center; font-family:var(--ff-display); font-weight:800;
  font-size:clamp(1.2rem,3vw,1.7rem); max-width:24ch; margin:0 auto 1.4em;
}

/* ---------- Pricing ---------- */
.tiers{ display:grid; gap:26px; align-items:start; }
.tier{
  background:var(--white); border:2px solid var(--ink); border-radius:var(--r-lg);
  padding:28px 24px; display:flex; flex-direction:column; position:relative;
}
.tier-featured{ background:var(--ink); color:var(--text-inv); box-shadow:var(--shadow); }
.tier-flag{
  position:absolute; top:-14px; left:50%; transform:translateX(-50%);
  background:var(--amber); color:var(--ink); border:2px solid var(--ink);
  font-family:var(--ff-display); font-weight:900; font-size:12px; text-transform:uppercase;
  letter-spacing:.08em; padding:5px 14px; border-radius:100px; white-space:nowrap;
}
.tier-head h3{ font-size:1.6rem; margin-bottom:.35em; }
.tier-featured .tier-head h3{ color:var(--amber); }
.tier-for{ font-size:14.5px; color:var(--text-mute); margin-bottom:1.4em; }
.tier-featured .tier-for{ color:var(--text-inv-mute); }

.stack{ margin-bottom:18px; }
.stack li{
  display:flex; justify-content:space-between; align-items:baseline; gap:14px;
  padding:10px 0; font-size:15px; border-bottom:1px dashed var(--line);
}
.tier-featured .stack li{ border-bottom-color:var(--line-dk); }
.stack li b{ font-family:var(--ff-display); font-weight:700; font-size:14px; color:var(--text-mute); white-space:nowrap; }
.tier-featured .stack li b{ color:var(--text-inv-mute); }

.tier-total{
  display:flex; justify-content:space-between; align-items:baseline; gap:10px;
  padding:14px 0; border-top:2px solid var(--ink); border-bottom:2px solid var(--ink);
  font-family:var(--ff-display); font-weight:800; margin-bottom:20px;
}
.tier-featured .tier-total{ border-color:var(--amber); }
.tier-total span{ font-size:14px; text-transform:uppercase; letter-spacing:.08em; }
.tier-total b{ font-size:1.5rem; text-decoration:line-through; text-decoration-thickness:2px; color:var(--text-mute); }
.tier-featured .tier-total b{ color:var(--text-inv-mute); }

.tier-price{ margin-bottom:20px; margin-top:auto; }
.price-label{ font-size:12.5px; font-family:var(--ff-display); font-weight:800; text-transform:uppercase; letter-spacing:.1em; color:var(--amber-dk); }
.tier-featured .price-label{ color:var(--amber); }
.price{ font-family:var(--ff-display); font-weight:900; font-size:3.1rem; letter-spacing:-.04em; line-height:1; margin:6px 0 4px; }
.price small{ display:block; font-size:.9rem; font-weight:600; letter-spacing:0; color:var(--text-mute); margin-top:6px; }
.tier-featured .price small{ color:var(--text-inv-mute); }
.price-alt{ font-size:14.5px; color:var(--text-mute); margin:0; }
.tier-featured .price-alt{ color:var(--text-inv-mute); }

.pricing-note{ text-align:center; font-size:15px; color:var(--text-mute); max-width:70ch; margin:30px auto 0; }

/* Bonuses */
.bonuses{ margin-top:56px; padding:34px 26px; background:var(--amber-lt); border:2px solid var(--ink); border-radius:var(--r-lg); }
.bonuses-title{ text-align:center; font-size:clamp(1.25rem,3vw,1.8rem); max-width:26ch; margin:0 auto 28px; }
.bonus-grid{ display:grid; gap:20px; }
.bonus{ background:var(--white); border:2px solid var(--ink); border-radius:var(--r); padding:22px; }
.bonus-tag{
  display:inline-block; font-family:var(--ff-display); font-weight:900; font-size:11.5px;
  text-transform:uppercase; letter-spacing:.1em; color:var(--amber-dk); margin-bottom:10px;
}
.bonus h4{ font-size:1.15rem; margin-bottom:.5em; }
.bonus p{ font-size:14.5px; color:var(--text-mute); margin-bottom:1em; }
.bonus-val{ font-family:var(--ff-display); font-weight:800; font-size:14px; background:var(--ink); color:var(--white); padding:4px 10px; border-radius:var(--r); }
.bonus-foot{ text-align:center; font-size:14px; color:var(--text-mute); margin:24px 0 0; }

/* ---------- Guarantee ---------- */
.section-guarantee{ background:var(--ink); color:var(--text-inv); }
.guarantee-shell{ text-align:center; }
.section-guarantee .section-title{ margin-left:auto; margin-right:auto; }
.section-guarantee .section-lede{ color:var(--text-inv-mute); }

.guarantee-grid{ display:grid; gap:20px; text-align:left; margin-bottom:36px; }
.g-card{
  background:var(--ink-2); border:2px solid var(--line-dk); border-radius:var(--r-lg);
  padding:26px 24px; position:relative;
}
.g-card-hero{ border-color:var(--amber); background:var(--ink-3); }
.g-num{
  display:grid; place-items:center; width:38px; height:38px; margin-bottom:16px;
  background:var(--amber); color:var(--ink); border-radius:50%;
  font-family:var(--ff-display); font-weight:900; font-size:19px;
}
.g-card h3{ font-size:1.2rem; color:var(--white); margin-bottom:.6em; }
.g-card p{ font-size:15.5px; color:var(--text-inv-mute); margin:0; }
.g-card strong{ color:var(--amber); }

.guarantee-foot{
  font-family:var(--ff-display); font-weight:800; font-size:clamp(1.05rem,2.4vw,1.35rem);
  color:var(--white); max-width:48ch; margin:0 auto 1.8em;
}
.guarantee-foot span{ color:var(--amber); }

/* ---------- Lead magnet ---------- */
.section-grade{ background:var(--paper-2); }
.grade-grid{ display:grid; gap:38px; align-items:start; }
.grade-copy p{ color:var(--text-mute); }
.grade-list{ margin:1.4em 0; }
.grade-list li{ display:flex; gap:11px; padding:10px 0; font-size:15.5px; border-bottom:1px solid var(--line); }
.grade-list li span{ color:var(--green); font-weight:900; }

.grade-form{
  background:var(--white); border:2px solid var(--ink); border-radius:var(--r-lg);
  box-shadow:var(--shadow); padding:28px 24px;
}
.grade-form h3{ font-size:1.5rem; margin-bottom:.25em; }
.form-sub{ font-size:14.5px; color:var(--text-mute); margin-bottom:1.5em; }
.field{ margin-bottom:16px; }
.field label{ display:block; font-size:14px; font-weight:700; margin-bottom:6px; }
.field .opt{ font-weight:500; color:var(--text-mute); }
.field input,.field select{
  width:100%; padding:13px 14px; font-family:var(--ff-body); font-size:16px;
  color:var(--text); background:var(--paper);
  border:2px solid var(--ink); border-radius:var(--r); appearance:none;
}
.field select{ background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'><path d='M1 1l6 6 6-6' stroke='%230B1220' stroke-width='2' fill='none' stroke-linecap='round'/></svg>"); background-repeat:no-repeat; background-position:right 14px center; padding-right:40px; }
.field input:focus,.field select:focus{ outline:3px solid var(--amber); outline-offset:1px; }
.field.invalid input,.field.invalid select{ border-color:#B4180F; background:#FDF2F1; }
.err{ display:none; font-size:13.5px; color:#B4180F; font-weight:600; margin-top:5px; }
.field.invalid .err{ display:block; }
.form-foot{ font-size:13px; color:var(--text-mute); text-align:center; margin:14px 0 0; }
.form-status{ margin:14px 0 0; font-weight:700; font-size:15px; text-align:center; }
.form-status.success{ color:var(--green); background:var(--green-lt); border:2px solid var(--green); border-radius:var(--r); padding:12px; }

/* ---------- Proof ---------- */
.notice{
  background:var(--amber-lt); border:2px solid var(--ink); border-left-width:8px;
  border-radius:var(--r); padding:18px 20px; font-size:15px; margin-bottom:34px; max-width:76ch;
}
.notice em{ font-style:italic; }

.case-grid{ display:grid; gap:22px; margin-bottom:44px; }
.case{ background:var(--white); border:2px solid var(--ink); border-radius:var(--r-lg); padding:24px; }
.case-label{
  display:inline-block; font-family:var(--ff-display); font-weight:800; font-size:11px;
  text-transform:uppercase; letter-spacing:.1em; color:var(--text-mute);
  border:1.5px dashed var(--text-mute); border-radius:100px; padding:4px 10px; margin-bottom:14px;
}
.case h3{ font-size:1.2rem; margin-bottom:1em; }
.ba{ display:grid; gap:14px; margin-bottom:18px; }
.ba-col{ background:var(--paper); border:2px solid var(--line); border-radius:var(--r); padding:16px; }
.ba-col > span{
  display:block; font-family:var(--ff-display); font-weight:900; font-size:11.5px;
  text-transform:uppercase; letter-spacing:.1em; color:var(--text-mute); margin-bottom:10px;
}
.ba-col li{ font-size:14.5px; padding:5px 0 5px 16px; position:relative; color:var(--text-mute); }
.ba-col li::before{ content:"–"; position:absolute; left:0; }
.ba-after{ background:var(--green-lt); border-color:var(--green); }
.ba-after > span{ color:var(--green); }
.ba-after li{ color:var(--text); }
.ba-after li::before{ content:"✓"; color:var(--green); font-weight:900; }
.case-result{ margin:0; padding-top:16px; border-top:2px solid var(--ink); font-size:15.5px; }
.case-result b{ font-family:var(--ff-display); }

.testi-grid{ display:grid; gap:20px; }
.testi{ margin:0; background:var(--ink); color:var(--text-inv); border:2px solid var(--ink); border-radius:var(--r-lg); padding:24px; }
.testi blockquote{ margin:0 0 18px; font-size:16px; line-height:1.6; color:var(--text-inv); }
.testi blockquote::before{ content:"“"; font-family:var(--ff-display); font-size:44px; color:var(--amber); display:block; line-height:.7; margin-bottom:8px; }
.testi figcaption{ font-size:14px; border-top:1px solid var(--line-dk); padding-top:14px; }
.testi figcaption strong{ display:block; color:var(--white); font-family:var(--ff-display); }
.testi figcaption span{ color:var(--text-inv-mute); font-size:13px; }

/* ---------- Process ---------- */
.steps{ display:grid; gap:2px; background:var(--line-dk); border:2px solid var(--line-dk); border-radius:var(--r-lg); overflow:hidden; margin-bottom:40px; }
.step{ display:flex; gap:20px; background:var(--ink); padding:26px 24px; align-items:flex-start; }
.step-num{
  flex:0 0 auto; display:grid; place-items:center; width:44px; height:44px;
  background:var(--amber); color:var(--ink); border-radius:var(--r);
  font-family:var(--ff-display); font-weight:900; font-size:20px;
}
.step h3{ font-size:1.2rem; color:var(--white); margin-bottom:.45em; display:flex; flex-wrap:wrap; gap:10px; align-items:baseline; }
.step-time{
  font-family:var(--ff-body); font-size:12.5px; font-weight:700; letter-spacing:.04em;
  color:var(--amber); border:1.5px solid var(--amber); border-radius:100px; padding:2px 10px; white-space:nowrap;
}
.step p{ font-size:15.5px; color:var(--text-inv-mute); margin:0; }

/* ---------- Founder ---------- */
.founder-grid{ display:grid; gap:36px; align-items:center; }
.founder-photo{
  position:relative; background:var(--paper-2); border:2px solid var(--ink);
  border-radius:var(--r-lg); box-shadow:var(--shadow); overflow:hidden; min-height:280px;
  display:grid; place-items:center;
}
.photo-fallback{
  position:absolute; font-family:var(--ff-display); font-weight:800; font-size:14px;
  text-transform:uppercase; letter-spacing:.12em; color:var(--text-mute); z-index:0;
}
.founder-photo img{ position:relative; z-index:1; width:100%; object-fit:cover; }
.founder-copy p{ color:var(--text-mute); }
.founder-sign{ margin:1.6em 0; padding-left:16px; border-left:4px solid var(--amber); }
.founder-sign strong{ display:block; font-family:var(--ff-display); font-size:1.05rem; color:var(--text); }
.founder-sign span{ font-size:14px; }

/* ---------- FAQ ---------- */
.section-faq{ background:var(--paper-2); }
.faq-list{ border-top:2px solid var(--ink); }
.faq-item{ border-bottom:2px solid var(--ink); }
.faq-item h3{ margin:0; font-size:inherit; }
.faq-q{
  width:100%; display:flex; justify-content:space-between; align-items:flex-start; gap:20px;
  background:transparent; border:0; cursor:pointer; text-align:left;
  padding:22px 4px; font-family:var(--ff-display); font-weight:700;
  font-size:clamp(1.02rem,2.2vw,1.2rem); line-height:1.35; color:var(--ink);
}
.faq-q:hover{ color:var(--amber-dk); }
.faq-icon{
  flex:0 0 auto; position:relative; width:26px; height:26px; margin-top:2px;
  border:2px solid var(--ink); border-radius:var(--r); background:var(--white);
}
.faq-icon::before,.faq-icon::after{
  content:""; position:absolute; left:50%; top:50%; background:var(--ink);
  transform:translate(-50%,-50%); transition:transform .2s ease, opacity .2s ease;
}
.faq-icon::before{ width:11px; height:2.5px; }
.faq-icon::after{ width:2.5px; height:11px; }
.faq-q[aria-expanded="true"] .faq-icon{ background:var(--amber); }
.faq-q[aria-expanded="true"] .faq-icon::after{ transform:translate(-50%,-50%) rotate(90deg); opacity:0; }
.faq-a{ padding:0 46px 24px 4px; }
.faq-a p{ margin:0; color:var(--text-mute); font-size:16px; }

/* ---------- Final CTA ---------- */
.section-final{ background:var(--ink); color:var(--text-inv); padding:88px 0; border-bottom:0; position:relative; }
.section-final::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:radial-gradient(var(--ink-3) 1.4px, transparent 1.4px);
  background-size:24px 24px;
}
.section-final .wrap{ position:relative; }
.final-title{ font-size:clamp(2rem,5.4vw,3.5rem); font-weight:900; letter-spacing:-.035em; margin-bottom:.4em; }
.final-lede{ font-size:clamp(1.02rem,2.2vw,1.2rem); color:var(--text-inv-mute); max-width:56ch; margin:0 auto 2em; }
.slots-callout{
  display:inline-block; background:var(--ink-2); border:2px solid var(--amber);
  border-radius:var(--r-lg); padding:16px 22px; margin-bottom:30px; max-width:60ch;
}
.slots-callout p{ margin:0; font-size:15px; color:var(--text-inv-mute); }
.slots-callout strong{ color:var(--amber); font-family:var(--ff-display); font-size:1.1rem; }
.section-final .micro{ margin-top:16px; }
.final-alt{ margin-top:32px; font-size:15.5px; color:var(--text-inv-mute); }
.final-alt a{ color:var(--amber); font-weight:700; text-underline-offset:4px; }

/* ---------- Footer ---------- */
.site-footer{ background:var(--ink-2); color:var(--text-inv-mute); padding:56px 0 30px; border-top:2px solid var(--line-dk); }
.footer-grid{ display:grid; gap:30px; margin-bottom:40px; }
.footer-brand p{ font-size:14.5px; max-width:34ch; margin-top:14px; }
.footer-brand .brand-word{ color:var(--white); }
.footer-col h4{ font-size:13px; text-transform:uppercase; letter-spacing:.12em; color:var(--white); margin-bottom:14px; }
.footer-col a{ display:block; font-size:14.5px; padding:5px 0; text-decoration:none; }
.footer-col a:hover{ color:var(--amber); }
.footer-col .btn{ margin-top:4px; }
.footer-bottom{ border-top:1px solid var(--line-dk); padding-top:22px; font-size:13.5px; }
.footer-bottom p{ margin:0 0 8px; }
.footer-legal a{ text-decoration:none; }
.footer-legal a:hover{ color:var(--amber); }
.disclaimer{ font-size:12.5px; color:#7C8AA3; max-width:90ch; margin-top:14px; }

/* ---------- Sticky mobile CTA ---------- */
.sticky-cta{
  position:fixed; left:0; right:0; bottom:0; z-index:90;
  background:var(--paper); border-top:2px solid var(--ink);
  padding:11px 16px calc(11px + env(safe-area-inset-bottom));
  transform:translateY(120%); transition:transform .28s ease;
  box-shadow:0 -6px 20px rgba(11,18,32,.14);
}
.sticky-cta.show{ transform:translateY(0); }
.sticky-inner{ display:flex; align-items:center; justify-content:space-between; gap:14px; max-width:var(--wrap); margin:0 auto; }
.sticky-text{ display:flex; flex-direction:column; line-height:1.25; min-width:0; }
.sticky-text strong{ font-family:var(--ff-display); font-size:14.5px; }
.sticky-text span{ font-size:12.5px; color:var(--text-mute); }
.sticky-cta .btn{ flex:0 0 auto; padding:12px 18px; font-size:14.5px; }

/* ==========================================================================
   Breakpoints
   ========================================================================== */
@media (min-width:640px){
  .bonus-grid{ grid-template-columns:repeat(2,1fr); }
  .case-grid{ grid-template-columns:repeat(2,1fr); }
  .testi-grid{ grid-template-columns:repeat(2,1fr); }
  .ba{ grid-template-columns:1fr 1fr; }
  .pain-grid{ grid-template-columns:repeat(2,1fr); }
  .turn{ grid-template-columns:1fr auto; }
  .footer-grid{ grid-template-columns:repeat(2,1fr); }
}

@media (min-width:900px){
  body{ font-size:17px; }
  .section{ padding:96px 0; }
  .hero{ padding-top:76px; }
  .hero-grid{ grid-template-columns:1.15fr .85fr; gap:56px; align-items:center; }
  .vs-grid{ grid-template-columns:1fr 1fr; gap:26px; }
  .grade-grid{ grid-template-columns:1fr 1fr; gap:54px; }
  .guarantee-grid{ grid-template-columns:repeat(3,1fr); }
  .pain-grid{ grid-template-columns:repeat(3,1fr); }
  .bonus-grid{ grid-template-columns:repeat(3,1fr); }
  .case-grid{ grid-template-columns:repeat(3,1fr); }
  .testi-grid{ grid-template-columns:repeat(3,1fr); }
  .tiers{ grid-template-columns:repeat(3,1fr); }
  .tier-featured{ transform:scale(1.03); }
  .founder-grid{ grid-template-columns:.8fr 1.2fr; gap:54px; }
  .footer-grid{ grid-template-columns:1.6fr 1fr 1fr 1.2fr; }
  .steps{ grid-template-columns:repeat(2,1fr); }
}

@media (min-width:900px){
  .tiers.tiers-single{ grid-template-columns:1fr; max-width:520px; margin:0 auto; }
}

@media (min-width:1000px){
  .nav-desktop{ display:flex; }
  .nav-cta{ display:inline-flex; }
  .nav-toggle{ display:none; }
  .nav-mobile{ display:none!important; }
  /* Desktop keeps its own header CTA — no need for the bottom bar */
  .sticky-cta{ display:none; }
}

/* ---------- Print ---------- */
@media print{
  .site-header,.sticky-cta,.nav-mobile{ display:none!important; }
  body{ background:#fff; color:#000; }
  .section{ padding:20px 0; border:0; }
  .section-dark,.section-guarantee,.section-final,.tier-featured,.hero-card,.testi,.step,.pain{
    background:#fff!important; color:#000!important; border:1px solid #999!important; box-shadow:none!important;
  }
}