/* Fearless Pivot v3 — quiet sales letter.
   Palette (only 3 colors; everything else is opacity of these):
   ink #121A22, gold #C9A25E, paper #F7F2E9. No gradients. */
:root{
  --ink:#121A22;
  --gold:#C9A25E;
  --paper:#F7F2E9;
  --ink-90:rgba(18,26,34,.9);
  --ink-75:rgba(18,26,34,.75);
  --ink-60:rgba(18,26,34,.6);
  --ink-15:rgba(18,26,34,.15);
  --ink-08:rgba(18,26,34,.08);
  --gold-20:rgba(201,162,94,.2);
  --gold-35:rgba(201,162,94,.35);
  --paper-90:rgba(247,242,233,.92);
  --serif:"Fraunces","Playfair Display",Georgia,"Times New Roman",serif;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:1.0625rem;
  line-height:1.75;
}
img,table{max-width:100%}
a{color:inherit}

/* ---------- Top bar + silent progress line ---------- */
.topbar{
  background:var(--ink);
  color:var(--paper);
}
.topbar-inner{
  max-width:44rem;
  margin:0 auto;
  padding:1rem 1.25rem .9rem;
}
.brand{
  font-family:var(--serif);
  font-weight:700;
  font-size:1.2rem;
  letter-spacing:.04em;
  text-decoration:none;
}
.brand span{color:var(--gold)}
.progress-line{
  height:2px;
  background:var(--gold-20);
}
.progress-line span{
  display:block;
  height:2px;
  background:var(--gold);
}

/* ---------- Article column ---------- */
.wrap{
  max-width:44rem;
  margin:0 auto;
  padding:0 1.25rem;
}
article.funnel{padding:2.5rem 0 1rem}
article.funnel h1{
  font-family:var(--serif);
  font-weight:600;
  font-size:clamp(2rem,6vw,3rem);
  line-height:1.12;
  letter-spacing:-.01em;
  margin:0 0 1.4rem;
}
article.funnel h2{
  font-family:var(--serif);
  font-weight:600;
  font-size:clamp(1.45rem,4.5vw,1.9rem);
  line-height:1.25;
  margin:2.6rem 0 1rem;
}
article.funnel h3{
  font-family:var(--serif);
  font-size:1.2rem;
  margin:2rem 0 .6rem;
}
article.funnel p{margin:0 0 1.15rem}
article.funnel .lede{
  font-size:1.18rem;
  line-height:1.7;
  color:var(--ink-90);
}
article.funnel hr{
  border:0;
  border-top:1px solid var(--ink-15);
  margin:2.6rem 0;
}
article.funnel ul,
article.funnel ol{
  margin:0 0 1.3rem;
  padding-left:1.4rem;
}
article.funnel li{margin:0 0 .65rem}
article.funnel li::marker{color:var(--gold)}
article.funnel blockquote{
  margin:1.8rem 0;
  padding:1.1rem 1.4rem 1.1rem 1.5rem;
  border-left:3px solid var(--gold);
  background:var(--ink-08);
  font-family:var(--serif);
  font-style:italic;
  font-size:1.12rem;
  line-height:1.65;
}
article.funnel blockquote p{margin:0}
article.funnel strong{font-weight:700}
article.funnel table{
  border-collapse:collapse;
  width:100%;
  margin:1.6rem 0;
  font-size:.95rem;
  line-height:1.6;
}
article.funnel th,
article.funnel td{
  border:1px solid var(--ink-15);
  padding:.7rem .9rem;
  text-align:left;
  vertical-align:top;
}
article.funnel th{
  background:var(--ink);
  color:var(--paper);
  font-weight:600;
}
article.funnel td:first-child{font-weight:600}

/* ---------- Email capture card ---------- */
.leadmagnet{
  margin:2.6rem 0;
  padding:1.8rem 1.6rem;
  background:var(--paper);
  border:2px solid var(--ink);
  border-radius:.35rem;
}
.capture-form label{
  display:block;
  font-size:.85rem;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  margin-bottom:.4rem;
}
.capture-form input[type="email"]{
  width:100%;
  padding:.9rem 1rem;
  font-size:1rem;
  font-family:var(--sans);
  color:var(--ink);
  background:var(--paper-90);
  border:1px solid var(--ink-60);
  border-radius:.25rem;
  margin-bottom:.8rem;
}
.capture-form button{
  display:block;
  width:100%;
  padding:1rem 1.4rem;
  font-size:1.05rem;
  font-weight:700;
  font-family:var(--sans);
  color:var(--ink);
  background:var(--gold);
  border:0;
  border-radius:.25rem;
  cursor:pointer;
}
.capture-form button:hover{background:var(--ink);color:var(--gold)}
.capture-form .ok{
  margin:1rem 0 0;
  padding:.9rem 1.1rem;
  border:2px solid var(--gold);
  border-radius:.25rem;
  background:var(--gold-20);
  font-weight:600;
}

/* ---------- CTA block ---------- */
.cta-block{
  margin:2.8rem 0 1rem;
  padding:2.2rem 0 2.6rem;
  border-top:1px solid var(--ink-15);
  text-align:center;
}
.cta-btn{
  display:inline-block;
  width:100%;
  max-width:34rem;
  padding:1.25rem 2rem;
  background:var(--gold);
  color:var(--ink);
  font-size:1.15rem;
  font-weight:700;
  text-decoration:none;
  border-radius:.3rem;
  line-height:1.4;
}
.cta-btn:hover{background:var(--ink);color:var(--gold)}

/* ---------- Track cards (mechanism page) ---------- */
.track-cards{
  display:grid;
  gap:1.2rem;
  margin:2rem 0;
  grid-template-columns:1fr;
}
.track-card{
  border:2px solid var(--ink);
  border-radius:.35rem;
  padding:1.5rem 1.4rem;
  background:var(--paper);
}
.track-card h3{
  font-family:var(--serif);
  font-size:1.3rem;
  margin:0 0 .9rem;
}
.track-card p{margin:0 0 .6rem}
@media (min-width:48rem){
  .track-cards{grid-template-columns:1fr 1fr}
}

/* ---------- Sale page: offer stack ---------- */
.offer-stack{display:grid;gap:1.4rem;margin:2rem 0}
.offer-card{
  border:2px solid var(--ink);
  border-radius:.35rem;
  padding:1.5rem 1.4rem;
  background:var(--paper);
}
.offer-card h3{
  font-family:var(--serif);
  font-size:1.3rem;
  margin:0 0 .9rem;
}
.offer-card ul{margin:0;padding-left:1.3rem}
.offer-card li{margin:0 0 .6rem}
.price-hero{
  text-align:center;
  margin:2.8rem 0;
  padding:2.4rem 1.4rem;
  background:var(--ink);
  color:var(--paper);
  border-radius:.4rem;
}
.price-hero .amount{
  font-family:var(--serif);
  font-size:clamp(3.4rem,14vw,5.5rem);
  font-weight:700;
  color:var(--gold);
  line-height:1;
  margin:.4rem 0 .8rem;
}
.price-hero p{margin:.4rem 0}
.price-hero .codes{
  display:flex;
  flex-wrap:wrap;
  gap:.8rem;
  justify-content:center;
  margin-top:1.2rem;
}
.price-hero .codes span{
  border:1px solid var(--gold-35);
  border-radius:.25rem;
  padding:.5rem .9rem;
  font-size:.92rem;
}
.price-hero .codes b{color:var(--gold)}
.checkouts{
  margin:1.8rem 0 1.2rem;
}
.checkout-btn{
  display:block;
  text-align:center;
  padding:1.25rem 2rem;
  font-size:1.15rem;
  font-weight:700;
  text-decoration:none;
  border-radius:.3rem;
  line-height:1.4;
}
.checkout-btn.gumroad{background:var(--gold);color:var(--ink)}
.checkout-btn:hover{opacity:.92}
.whop-alt{
  text-align:center;
  font-size:.92rem;
  color:var(--ink-75);
  margin:0 0 2.4rem;
}
.whop-alt a{color:inherit}
.guarantee{
  border-left:3px solid var(--gold);
  background:var(--ink-08);
  padding:1.2rem 1.4rem;
  margin:2rem 0;
}
.for-list{margin:1.6rem 0}

/* ---------- Footer ---------- */
.site-footer{
  margin-top:3rem;
  background:var(--ink);
  color:var(--paper);
}
.site-footer .wrap{
  padding-top:2.2rem;
  padding-bottom:2.2rem;
}
.site-footer p{
  margin:.6rem 0 0;
  font-size:.88rem;
  color:rgba(247,242,233,.7);
  line-height:1.6;
}
.site-footer a{color:var(--gold);text-decoration:none}
.site-footer a:hover{text-decoration:underline}

/* ---------- Thin mobile sticky CTA (<=640px only) ---------- */
.sticky-cta{display:none}
@media (max-width:40rem){
  .cta-btn{width:100%}
  body{padding-bottom:4.2rem}
  .sticky-cta{
    display:block;
    position:fixed;
    left:0;right:0;bottom:0;
    background:var(--paper-90);
    border-top:1px solid var(--ink-15);
    padding:.6rem .9rem calc(.6rem + env(safe-area-inset-bottom));
    z-index:50;
  }
  .sticky-cta .sticky-btn{
    display:block;
    text-align:center;
    background:var(--ink);
    color:var(--gold);
    font-weight:700;
    font-size:1rem;
    text-decoration:none;
    border-radius:.3rem;
    padding:.85rem 1rem;
  }
}

@media (min-width:48rem){
  body{font-size:1.125rem}
  article.funnel{padding:3.5rem 0 1.5rem}
}

/* Kit guard modal (bot-check interstitial): keeps the visitor on the page. */
.kit-guard-overlay{position:fixed;inset:0;background:rgba(18,26,34,.74);z-index:9999;display:flex;align-items:center;justify-content:center;padding:16px}
.kit-guard-box{background:var(--paper);border-radius:10px;max-width:460px;width:100%;padding:20px;box-shadow:0 12px 40px rgba(0,0,0,.35)}
.kit-guard-head{margin:0 0 12px;font-size:16px}
.kit-guard-frame{width:100%;height:420px;border:0;border-radius:6px;background:#fff}
.kit-guard-close{margin-top:12px;background:transparent;border:1px solid var(--ink);color:var(--ink);padding:8px 18px;border-radius:6px;cursor:pointer}
