/* statscheap-2026 — warm consumer-editorial theme. Single accent: coral-rose. No black, no monospace. */

/* ============ TOKENS ============ */
:root{
  --acc:#E8543A; --acc-hover:#C9432B; --acc-tint:#FEF0ED; --acc-tint2:#FDDDD7;
  --ink:#1C1917; --ink-muted:#57534E; --ink-faint:#A8A29E;
  --border:#E7E5E4; --surface:#FAFAF9; --card:#FFFFFF; --row-alt:#F5F4F2;
  --ok-bg:#D1FAE5; --ok-tx:#065F46; --free-bg:#FEF0ED; --free-tx:#9A3412;
  --diy-bg:#EDE9FE; --diy-tx:#5B21B6; --paid-bg:#F3F4F6; --paid-tx:#374151;
  --r-sm:3px; --r-md:4px; --r-lg:6px; --r-pill:14px;
  --s-xs:4px; --s-sm:8px; --s-md:16px; --s-lg:24px; --s-xl:40px; --s-2xl:64px;
  --sh-card:0 1px 4px rgba(28,25,23,.06); --sh-float:0 8px 28px rgba(28,25,23,.12);
  --ff-disp:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --ff-body:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --maxw:1140px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--surface);color:var(--ink);font-family:var(--ff-body);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--ff-disp);line-height:1.2;letter-spacing:-.02em;margin:0 0 .5em}
h1{font-size:clamp(2rem,4.5vw,3rem);font-weight:800}
h2{font-size:clamp(1.5rem,3vw,2rem);font-weight:700}
h3{font-size:1.18rem;font-weight:700}
a{color:var(--acc-hover);text-decoration:none}
a:hover{text-decoration:underline}
p{margin:0 0 1em}
img{max-width:100%;height:auto}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--s-lg)}
.eyebrow{display:inline-flex;align-items:center;gap:7px;font-family:var(--ff-disp);font-weight:700;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--acc-hover);background:var(--acc-tint);padding:5px 12px;border-radius:var(--r-pill)}
.eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 4px var(--acc-tint2)}
.muted{color:var(--ink-muted)}
.accent{color:var(--acc-hover)}

/* ============ BUTTONS ============ */
.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--ff-disp);font-weight:600;font-size:.92rem;padding:11px 22px;border-radius:var(--r-md);border:1.5px solid transparent;cursor:pointer;transition:background .15s;text-decoration:none}
.btn:hover{text-decoration:none}
.btn-primary{background:var(--acc);color:#fff}
.btn-primary:hover{background:var(--acc-hover);color:#fff}
.btn-outline{border-color:var(--acc);color:var(--acc-hover);background:transparent}
.btn-outline:hover{background:var(--acc-tint)}
.btn-ghost{color:var(--ink-muted);background:transparent}
.btn-ghost:hover{background:var(--row-alt)}

/* ============ HEADER / NAV ============ */
.site-header{position:sticky;top:0;z-index:50;background:rgba(250,250,249,.85);backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--border)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--ff-disp);font-weight:800;font-size:1.22rem;color:var(--ink);letter-spacing:-.03em}
.brand:hover{text-decoration:none}
.brand .mark{width:30px;height:30px;border-radius:8px;background:linear-gradient(135deg,var(--acc),#F7956A);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:1rem}
.brand b{color:var(--acc-hover)}
.nav{display:flex;align-items:center;gap:4px}
.nav a{font-family:var(--ff-disp);font-weight:600;font-size:.9rem;color:var(--ink-muted);padding:8px 13px;border-radius:var(--r-md)}
.nav a:hover{color:var(--ink);background:var(--row-alt);text-decoration:none}
.nav a.active{color:var(--acc-hover);background:var(--acc-tint)}
.nav-kbd{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);background:var(--card);color:var(--ink-faint);border-radius:var(--r-md);padding:7px 11px;font-size:.82rem;cursor:pointer}
.nav-kbd kbd{font-family:var(--ff-body);background:var(--row-alt);border-radius:4px;padding:1px 6px;font-size:.72rem;color:var(--ink-muted)}
.nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:8px}
.nav-toggle span{display:block;width:22px;height:2px;background:var(--ink);margin:4px 0;border-radius:2px}
@media(max-width:860px){
  .nav{position:fixed;inset:64px 0 auto 0;flex-direction:column;align-items:stretch;background:var(--card);border-bottom:1px solid var(--border);padding:var(--s-md);gap:2px;box-shadow:var(--sh-float);transform:translateY(-120%);transition:transform .25s}
  .nav.open{transform:translateY(0)}
  .nav-toggle{display:block}
  .nav-kbd{display:none}
}

/* ============ HERO ============ */
.hero{position:relative;overflow:hidden;padding:var(--s-2xl) 0 var(--s-xl)}
.hero__bg{position:absolute;inset:0;z-index:0;pointer-events:none}
.hero__blob{position:absolute;border-radius:50%;filter:blur(60px);opacity:.5}
.hero__blob--1{width:380px;height:380px;background:var(--acc-tint2);top:-120px;right:-80px}
.hero__blob--2{width:300px;height:300px;background:#FDE9C8;bottom:-120px;left:-60px;opacity:.4}
.hero__grid{position:absolute;inset:0;background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px);background-size:40px 40px;mask-image:radial-gradient(ellipse 70% 60% at 50% 30%,#000,transparent 75%);opacity:.5}
.hero .wrap{position:relative;z-index:1}
.hero__head{text-align:center;max-width:760px;margin:0 auto var(--s-xl)}
.hero__head h1{margin-top:14px}
.hero__head h1 .em{color:var(--acc-hover);font-style:italic}
.hero__head .lead{font-size:1.18rem;color:var(--ink-muted);margin:0 auto;max-width:620px}

/* ============ CALCULATOR SHELL (overrides scoped .sc-calc) ============ */
.calc-stage{background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--sh-card);padding:clamp(18px,3vw,32px);max-width:1040px;margin:0 auto}
/* recolor + de-mono the mu-plugin widget via its exposed scope */
.sc-calc{--sc-acc:var(--acc);--sc-acc2:var(--acc-hover);--sc-free:#16a34a;font-family:var(--ff-body)!important;max-width:100%!important}
.calc-stage .sc-calc__head{display:none!important} /* page H1 replaces the inner banner */

/* ============ VERDICT STRIP ============ */
.verdicts{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-md);margin-top:var(--s-xl)}
.verdict{background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s-lg)}
.verdict .lbl{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-muted);font-weight:600}
.verdict .val{font-family:var(--ff-disp);font-weight:800;font-size:1.7rem;color:var(--ink);margin:6px 0 2px}
.verdict .val small{color:var(--ink-faint);font-weight:600;font-size:.9rem}
.verdict a{font-size:.85rem;font-weight:600}
@media(max-width:760px){.verdicts{grid-template-columns:1fr}}

/* ============ SECTIONS ============ */
.section{padding:var(--s-2xl) 0}
.section--tint{background:var(--acc-tint)}
.section__head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-md);margin-bottom:var(--s-xl);flex-wrap:wrap}
.section__head p{margin:6px 0 0;color:var(--ink-muted);max-width:560px}

/* ============ TOOL CARDS / DIRECTORY ============ */
.grid-tools{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-md)}
@media(max-width:860px){.grid-tools{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.grid-tools{grid-template-columns:1fr}}
.tool-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s-lg);transition:border-color .15s,background .15s;display:flex;flex-direction:column;gap:10px}
.tool-card:hover{border-color:var(--acc);background:#fff}
.tool-card__top{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.tool-card__name{font-family:var(--ff-disp);font-weight:700;font-size:1.05rem;color:var(--ink)}
.tool-card__price{font-family:var(--ff-disp);font-weight:800;font-size:1.35rem;color:var(--ink)}
.tool-card__price.free{color:#16a34a}
.tool-card__price small{font-size:.7rem;color:var(--ink-faint);font-weight:600}
.tool-card__spark{height:34px;width:100%}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{font-size:.72rem;font-weight:600;padding:3px 10px;border-radius:var(--r-pill);background:var(--row-alt);color:var(--ink-muted)}
.chip--on{background:var(--acc-tint);color:var(--acc-hover);border:1px solid var(--acc)}

/* ============ BADGES ============ */
.badge{display:inline-block;font-size:.68rem;font-weight:600;padding:2px 8px;border-radius:var(--r-sm)}
.badge--ok{background:var(--ok-bg);color:var(--ok-tx)}
.badge--free{background:var(--free-bg);color:var(--free-tx)}
.badge--diy{background:var(--diy-bg);color:var(--diy-tx)}
.badge--paid{background:var(--paid-bg);color:var(--paid-tx)}

/* ============ BLOG ============ */
.grid-blog{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-lg)}
@media(max-width:860px){.grid-blog{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.grid-blog{grid-template-columns:1fr}}
.post-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;transition:border-color .15s;display:flex;flex-direction:column}
.post-card:hover{border-color:var(--acc)}
.post-card__thumb{aspect-ratio:16/9;background:var(--acc-tint) center/cover;display:block}
.post-card__body{padding:var(--s-md) var(--s-lg) var(--s-lg)}
.post-card__cat{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--acc-hover)}
.post-card__title{font-family:var(--ff-disp);font-weight:700;font-size:1.08rem;margin:6px 0 8px;color:var(--ink);line-height:1.3}
.post-card__title a{color:inherit}
.post-card__excerpt{font-size:.9rem;color:var(--ink-muted);margin:0}

/* ============ TRUST BAND ============ */
.trust{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s-xl);text-align:center}
.trust .item .n{font-family:var(--ff-disp);font-weight:800;font-size:1.9rem;color:var(--acc-hover)}
.trust .item .t{font-size:.85rem;color:var(--ink-muted)}

/* ============ ARTICLE / SINGLE ============ */
.article{max-width:760px;margin:0 auto;padding:var(--s-2xl) var(--s-lg)}
.article h1{margin-bottom:.3em}
.article .meta{color:var(--ink-muted);font-size:.9rem;margin-bottom:var(--s-xl)}
.article-body{font-size:1.05rem}
.article-body h2{margin-top:1.6em}
.article-body img{border-radius:var(--r-lg);margin:1.5em 0}
.article-body a{text-decoration:underline}
.article-body blockquote{border-left:3px solid var(--acc);background:var(--acc-tint);margin:1.5em 0;padding:14px 20px;border-radius:0 var(--r-md) var(--r-md) 0;color:var(--ink)}
.article-body table{width:100%;border-collapse:collapse;margin:1.5em 0;font-size:.92rem}
.article-body th{background:var(--acc-tint);color:var(--ink);text-align:left;padding:10px 12px;border-bottom:2px solid var(--acc)}
.article-body td{border-bottom:1px solid var(--border);padding:10px 12px}

/* ============ FOOTER ============ */
.site-footer{background:var(--card);border-top:1px solid var(--border);margin-top:var(--s-2xl)}
.site-footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s-xl);padding:var(--s-2xl) var(--s-lg)}
.site-footer .col h4{font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-faint);margin-bottom:12px}
.site-footer .col a{display:block;color:var(--ink-muted);font-size:.9rem;padding:3px 0}
.site-footer .tagline{max-width:280px}
.site-footer .tagline .muted{font-size:.88rem}
.site-footer .legal{border-top:1px solid var(--border);text-align:center;padding:16px;color:var(--ink-faint);font-size:.82rem}

/* ============ COMMAND PALETTE (⌘K) ============ */
.cmdk{position:fixed;inset:0;z-index:100;display:none;align-items:flex-start;justify-content:center;padding-top:12vh;background:rgba(28,25,23,.35);backdrop-filter:blur(3px)}
.cmdk.open{display:flex}
.cmdk__box{width:min(560px,92vw);background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--sh-float);overflow:hidden}
.cmdk__input{width:100%;border:0;border-bottom:1px solid var(--border);padding:16px 18px;font-size:1rem;font-family:var(--ff-body);outline:none;color:var(--ink)}
.cmdk__list{max-height:50vh;overflow:auto;padding:6px}
.cmdk__item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:var(--r-md);cursor:pointer;color:var(--ink)}
.cmdk__item.sel,.cmdk__item:hover{background:var(--acc-tint)}
.cmdk__item .k{font-size:.72rem;color:var(--ink-faint)}

/* ============ STICKY MINI-CAL BAR ============ */
.minical{position:fixed;left:0;right:0;bottom:0;z-index:40;transform:translateY(120%);transition:transform .25s;background:var(--acc-hover);color:#fff;padding:10px 0}
.minical.show{transform:translateY(0)}
.minical .wrap{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap}
.minical b{font-family:var(--ff-disp)}
.minical a{color:#fff;text-decoration:underline;font-weight:600;font-size:.9rem}

/* ============ REVEAL ANIMATION ============ */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .5s ease,transform .5s ease}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

[x-cloak]{display:none!important}