/* ============================================================
   11 · HOME — the 3-second rewrite
   Hero that answers "what / who / what's the catch / what next"
   at a glance, then short, punchy sections.
   ============================================================ */

/* ---- hero ---- */
.hx .wrap{padding-top:110px;padding-bottom:70px;}
.hx-eyebrow{font-size:13px;letter-spacing:.2em;text-transform:uppercase;font-weight:800;color:var(--amber);margin:0 0 18px;}
.hx-h1{font-size:clamp(42px,6.4vw,84px);line-height:.98;font-weight:800;letter-spacing:-.045em;max-width:12ch;margin:0 0 22px;color:var(--paper);}
.hx-h1 .hit{color:var(--flame);}
.hx-h1 .hx-for{display:block;margin-top:.28em;font-size:.4em;line-height:1.1;letter-spacing:-.02em;color:var(--paper);max-width:none;}
.hx-sub{font-size:clamp(18px,1.9vw,22px);line-height:1.45;color:#c9c7c1;max-width:44ch;margin:0 0 24px;}
.hx-sub b{color:var(--paper);font-weight:700;}
.hx-ticks{list-style:none;padding:0;margin:0 0 30px;display:grid;grid-template-columns:repeat(2,max-content);gap:10px 28px;}
.hx-ticks li{position:relative;padding-left:26px;font-size:16px;color:#c9c7c1;}
.hx-ticks li::before{content:"\2713";position:absolute;left:0;top:0;font-weight:800;color:var(--flame);}
.hx-ticks b{color:var(--paper);}
.hx-cta{display:flex;flex-wrap:wrap;gap:12px;}
.hx-proof{margin:30px 0 0;font-size:15px;color:#bcbab4;max-width:52ch;}
.hx-proof span{color:var(--amber);letter-spacing:2px;margin-right:6px;}
.hx-proof cite{font-style:normal;color:var(--mute);}
.hx .scene{opacity:.85;}

/* ---- what I do ---- */
.do-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:36px;}
.do-card{position:relative;background:#fffdf8;border:1px solid rgba(10,10,12,.12);border-radius:4px;padding:28px 24px 24px;
  transition:transform .25s,box-shadow .25s,border-color .25s;}
.do-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(10,10,12,.09);border-color:rgba(255,59,31,.4);}
.do-n{font:800 13px/1 ui-monospace,Menlo,monospace;color:var(--flame);letter-spacing:.1em;}
.do-card h3{font-size:28px;font-weight:800;letter-spacing:-.03em;margin:10px 0 8px;}
.do-card p{font-size:16px;line-height:1.5;color:var(--mute-dark);margin:0 0 16px;}
.do-card p b{color:var(--ink);}
.do-card a{font-weight:800;color:var(--ink);text-decoration:none;border-bottom:2px solid var(--flame);}
.do .lead{margin-top:-4px;}
.do-why{list-style:none;padding:0;margin:26px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;}
.do-why li{position:relative;padding:0 0 0 30px;font-size:16px;line-height:1.5;color:var(--mute-dark);}
.do-why li::before{content:"\2713";position:absolute;left:0;top:0;font-weight:800;color:var(--flame);font-size:18px;}
.do-why b{color:var(--ink);display:block;}
@media (max-width:800px){.do-why{grid-template-columns:minmax(0,1fr);gap:12px;}}

/* ---- straight answers ---- */
.qa-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;margin:36px 0 0;
  background:rgba(10,10,12,.12);border:1px solid rgba(10,10,12,.12);}
.qa-grid > div{background:var(--paper);padding:22px 24px;}
.qa-grid dt{font-size:19px;font-weight:800;letter-spacing:-.015em;margin-bottom:6px;color:var(--ink);}
.qa-grid dd{margin:0;font-size:16px;line-height:1.5;color:var(--mute-dark);}
.qa-grid mark{background:#ffe1a1;color:var(--ink);padding:0 4px;font-weight:700;}

/* ---- how it works ---- */
.hw-steps{list-style:none;padding:0;margin:36px 0 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;}
.hw-steps li{font-size:15.5px;line-height:1.5;color:#bcbab4;padding-top:16px;border-top:2px solid rgba(255,59,31,.6);}
.hw-steps span{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;margin-bottom:10px;background:var(--flame);color:var(--ink);font-weight:800;}
.hw-steps b{display:block;color:var(--paper);font-size:18px;margin-bottom:4px;}

/* ---- about (short) ---- */
.ab-grid{display:grid;grid-template-columns:260px minmax(0,1fr);gap:50px;align-items:center;}
.ab-me{position:relative;margin:0;}
.ab-me img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 22%;border-radius:3px;}
.ab-me::after{content:"";position:absolute;inset:12px -12px -12px 12px;border:2px solid var(--flame);z-index:-1;border-radius:3px;}
.ab-me figcaption{margin-top:18px;font-size:13px;color:var(--mute-dark);font-style:italic;}
.ab-big{font-size:clamp(19px,2.1vw,23px);line-height:1.4;font-weight:600;color:var(--ink);margin:6px 0 14px;max-width:38ch;}
#about p:not(.ab-big):not(.eyebrow){font-size:17px;line-height:1.6;color:var(--mute-dark);max-width:58ch;}
.ab-chips{list-style:none;padding:0;margin:18px 0 0;display:flex;flex-wrap:wrap;gap:8px;}
.ab-chips li{font:600 13px/1 ui-monospace,Menlo,monospace;padding:8px 11px;border-radius:99px;border:1px solid rgba(10,10,12,.2);color:var(--ink);}

/* ---- Ember strip ---- */
.em-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:50px;align-items:center;}
.em .lead{margin-bottom:24px;}
.em-shot{position:relative;padding-right:50px;}
.em-desk{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top;border-radius:10px;box-shadow:0 26px 60px rgba(0,0,0,.5);}
.em-phone{position:absolute;right:0;bottom:-24px;width:30%;height:auto;border-radius:18px;border:6px solid #0c0c0e;box-shadow:0 20px 50px rgba(0,0,0,.55);}

/* ---- small screens ---- */
@media (max-width:900px){
  .do-grid,.hw-steps{grid-template-columns:minmax(0,1fr);}
  .qa-grid{grid-template-columns:minmax(0,1fr);}
  .em-grid{grid-template-columns:minmax(0,1fr);}
}
@media (max-width:760px){
  .hx .wrap{padding-top:96px;}
  .hx-ticks{grid-template-columns:minmax(0,1fr);gap:8px;}
  .ab-grid{grid-template-columns:minmax(0,1fr);gap:26px;}
  .ab-me{width:160px;}
}
.hx-h1{margin-bottom:14px;}
.hx-not{font-size:clamp(20px,2.3vw,28px);line-height:1.25;font-weight:800;letter-spacing:-.02em;color:var(--paper);
  max-width:30ch;margin:0 0 22px;padding-left:16px;border-left:4px solid var(--flame);}

/* ---- phones: less scrolling ---- */
@media (max-width:760px){
  section.band{padding:60px 0;}
  .do-grid{margin-top:24px;gap:12px;}
  .do-card{padding:20px 18px 18px;}
  .do-card h3{font-size:24px;margin:6px 0 6px;}
  .qa-grid{margin-top:24px;}
  .qa-grid > div{padding:16px 18px;}
  .qa-grid dt{font-size:17px;margin-bottom:4px;}
  .qa-grid dd{font-size:15.5px;}
}

/* ---- hero v3: one-line headline, short and on one screen ---- */
.hx .wrap{padding-top:120px;padding-bottom:56px;}
.hx-h1{font-size:min(84px,calc((100vw - 64px) / 12.5));white-space:nowrap;max-width:none;margin:0 0 14px;}
.hx-tag{font-size:clamp(19px,2.3vw,30px);line-height:1.2;font-weight:800;letter-spacing:-.02em;color:var(--paper);margin:0 0 18px;}
.hx-tag .hit{color:var(--flame);}
.hx-sub{max-width:52ch;margin:0 0 26px;}
@media (max-width:760px){
  .hero.hx{min-height:auto;}
  .hx .wrap{padding-top:100px;padding-bottom:48px;}
  .hx-eyebrow{margin-bottom:12px;}
  .hx-sub{font-size:17px;margin-bottom:22px;}
  .hx-proof{margin-top:22px;}
}

/* hero ticks: one column, so the longer lines read cleanly */
.hx-ticks--stack{grid-template-columns:minmax(0,1fr);max-width:58ch;gap:10px;margin-bottom:28px;}
.hx-ticks--stack li{font-size:clamp(16px,1.5vw,18px);line-height:1.45;}

/* ---- The Doubt Test (replaces the price slider on the homepage) ---- */
.fs-h-hit{color:var(--flame);}
.fs-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:48px;align-items:center;margin-top:8px;}
.fs-lead{font-size:clamp(18px,1.6vw,21px);line-height:1.55;color:#cfccc5;max-width:54ch;margin:18px 0 0;}
.fs-lead b{color:var(--paper);}
.fs-card{background:var(--ink-3);border:1px solid rgba(246,243,237,.12);border-radius:6px;padding:28px 28px 22px;}
.fs-score{display:flex;align-items:baseline;gap:6px;margin:0 0 14px;font-weight:800;letter-spacing:-.04em;line-height:1;}
.fs-score b{font-size:clamp(56px,7vw,84px);color:var(--amber);}
.fs-score span{font-size:22px;color:var(--mute);}
.fs-card ul{list-style:none;padding:0;margin:0;}
.fs-card li{position:relative;padding:8px 0 8px 28px;font-size:16px;color:var(--paper);border-top:1px solid rgba(246,243,237,.08);}
.fs-card li::before{content:"\2713";position:absolute;left:2px;color:#5fd38d;font-weight:800;}
.fs-note{margin:18px 0 0;font-size:14.5px;color:#bcbab4;}
@media (max-width:860px){ .fs-grid{grid-template-columns:1fr;gap:26px;} section.dark.fs{padding:64px 0;} }