@font-face{font-family:Inter;src:url(/assets/fonts/inter-latin-var.woff2) format("woff2");font-weight:500 900;font-display:swap}
:root{
  --paper:#fffbea;      /* 60: page */
  --ink:#111111;        /* 30: hero, header, footer, text */
  --ink-2:#2a2924;
  --ink-3:#5c5a52;      /* muted text, 6.6:1 on paper */
  --line:#e9e2c6;
  --brand:#fec803;      /* 10: accents only */
  --teal:#14d6c0;       /* logo "OR" pill */
  --worked:#0f8f7f; --worked-bg:#dff7f2;
  --not:#c8372d;    --not-bg:#fde7e4;
  --clash:#3b5bff;      /* ONLY the Subscribe button */
  --r:16px;
  --ease-out:cubic-bezier(.2,.8,.2,1);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:500 17px/1.55 Inter,system-ui,-apple-system,"Segoe UI",sans-serif}
a{color:inherit}
img{max-width:100%;height:auto;display:block}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:var(--brand);padding:8px 12px;z-index:9}

/* wordmark in type, matches the logo */
.wm{display:inline-flex;align-items:center;gap:.28em;font-weight:900;letter-spacing:-.03em;text-decoration:none;white-space:nowrap}
.wm .or{background:var(--teal);color:var(--ink);border-radius:.32em;padding:.02em .32em;font-size:.82em;transform:rotate(-4deg)}

/* header */
.top{background:var(--ink);color:var(--paper);position:sticky;top:0;z-index:5}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.top .wm{font-size:22px;color:var(--paper)}
.top nav{display:flex;gap:22px;font-size:15px}
.top nav a{text-decoration:none;color:#d9d4bf;padding:10px 0}
.top nav a:hover{color:var(--brand)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 24px;border-radius:999px;font-weight:800;font-size:17px;text-decoration:none;transition:transform .1s var(--ease-out),background .15s var(--ease-out)}
.btn:active{transform:scale(.97)}
.btn-sub{background:var(--clash);color:#fff}
.btn-sub:hover{background:#2c4cf0}
.btn-out{border:2px solid currentColor;color:var(--paper)}
.btn-out:hover{background:rgba(255,251,234,.08)}
.btn svg{width:22px;height:22px;flex:none}

/* hero: big type at the back, sticker overlapping it, buttons on top */
.hero{background:var(--ink);color:var(--paper);overflow:hidden;position:relative}
.hero .wrap{position:relative;padding-top:56px;padding-bottom:72px}
.giant{font-weight:900;font-size:clamp(76px,15vw,196px);line-height:.86;letter-spacing:-.055em;margin:0;text-transform:uppercase}
.giant>span{display:block}
.giant .q{color:var(--brand)}
.sticker{position:absolute;right:20px;top:34px;width:clamp(150px,27vw,330px);aspect-ratio:1;border-radius:50%;background:var(--brand);display:grid;place-items:center;box-shadow:0 18px 50px rgba(0,0,0,.45);transform:rotate(-8deg)}
.sticker img{width:78%}
.lede{max-width:560px;font-size:clamp(19px,2.2vw,22px);color:#e8e3cc;margin:28px 0 30px}
.lede b{color:var(--paper)}
.ctas{display:flex;flex-wrap:wrap;gap:14px}

/* sections */
section{padding:72px 0}
.kicker{font-size:13px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin:0 0 10px}
h2{font-size:clamp(34px,5vw,56px);line-height:1;letter-spacing:-.04em;font-weight:900;margin:0 0 28px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.step{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:24px}
.step .n{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--brand);font-weight:900;margin-bottom:14px}
.step h3{margin:0 0 6px;font-size:21px;letter-spacing:-.02em}
.step p{margin:0;color:var(--ink-3);font-size:15px}

/* verdict cards */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ep{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;text-decoration:none;display:flex;flex-direction:column;transition:transform .2s var(--ease-out),box-shadow .2s var(--ease-out)}
.ep:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(17,17,17,.08)}
.ep .thumb{aspect-ratio:9/12;background:var(--brand);object-fit:cover;width:100%}
.ep .body{padding:16px 18px 20px}
.ep h3{margin:8px 0 0;font-size:19px;line-height:1.25;letter-spacing:-.02em}
.verdict{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:800;border-radius:999px;padding:4px 10px}
.verdict.worked{background:var(--worked-bg);color:var(--worked)}
.verdict.not{background:var(--not-bg);color:var(--not)}
.verdict.mixed{background:#f3eed6;color:var(--ink-2)}
.empty{background:#fff;border:2px dashed var(--line);border-radius:var(--r);padding:36px;text-align:center}
.empty b{display:block;font-size:24px;letter-spacing:-.02em;margin-bottom:6px}
.empty p{margin:0 0 18px;color:var(--ink-3)}
.empty a{font-weight:800}

/* about + products */
.about{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:start}
.about p{font-size:18px;margin:0 0 16px}
.prods{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.prod{display:block;background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;text-decoration:none;transition:border-color .15s var(--ease-out)}
.prod:hover{border-color:var(--ink)}
.prod b{display:block;font-size:17px}
.prod span{font-size:14px;color:var(--ink-3)}

/* episode page */
.ep-head{background:var(--ink);color:var(--paper);padding:48px 0}
.ep-head h1{font-size:clamp(36px,6vw,68px);line-height:1;letter-spacing:-.045em;margin:14px 0 0;font-weight:900;max-width:900px}
.ep-main{display:grid;grid-template-columns:minmax(0,380px) 1fr;gap:44px;padding:48px 0 72px}
.video{aspect-ratio:9/16;border-radius:var(--r);overflow:hidden;background:var(--ink)}
.video iframe{width:100%;height:100%;border:0}
.prose h2{font-size:28px;margin:30px 0 10px}
.prose ol,.prose ul{padding-left:22px}
.tools li{margin-bottom:6px}

/* footer */
footer{background:var(--ink);color:#cfc9b2;padding:48px 0;font-size:15px}
footer .wrap{display:flex;flex-wrap:wrap;gap:28px;justify-content:space-between;align-items:flex-start}
footer .wm{font-size:26px;color:var(--paper)}
footer nav{display:flex;flex-wrap:wrap;gap:18px}
footer a{color:#cfc9b2;text-decoration:none}
footer a:hover{color:var(--brand)}
.legal{width:100%;display:flex;flex-wrap:wrap;gap:18px;font-size:13px;color:#9d977f;border-top:1px solid #2b2a25;padding-top:20px}
.foot-pref{color:#9d977f;text-decoration:none}
.foot-pref:hover{color:var(--brand)}

/* motion: once, on arrival */
.rise{animation:rise .45s var(--ease-out) both}
.rise.d2{animation-delay:.08s}.rise.d3{animation-delay:.16s}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

@media (max-width:860px){
  .steps,.grid{grid-template-columns:1fr 1fr}
  .about,.ep-main{grid-template-columns:1fr}
  .top nav a.hide-sm{display:none}
}
@media (max-width:560px){
  .steps,.grid,.prods{grid-template-columns:1fr}
  .hero .wrap{padding-top:120px}
  .sticker{top:22px;right:16px}
  .btn{width:100%}
  section{padding:56px 0}
}