:root{
  --bg:#fbfaf7; --surface:#fff; --ink:#1c1a17; --muted:#6b6357; --line:#e7e2d8;
  --accent:#7c4dff; --accent-ink:#5a32d6; --good:#1f8a55; --chip:#f0ece2; --radius:12px;
  --maxw:1080px; --shadow:0 1px 2px rgba(20,16,10,.05),0 8px 24px rgba(20,16,10,.05);
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);
  font-family:"DM Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  line-height:1.55}
a{color:var(--accent-ink);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px}
.muted{color:var(--muted)}
h1{font-size:2rem;line-height:1.15;margin:.4em 0 .3em}
h2{font-size:1.3rem;margin:1.4em 0 .5em}
h3{font-size:1.02rem;margin:0}

/* topbar */
.topbar{background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}
.topbar-inner{display:flex;align-items:center;gap:18px;height:62px}
.brand{font-weight:700;font-size:1.15rem;color:var(--ink)}
.searchbar{display:flex;flex:1;max-width:460px;gap:6px}
.searchbar input{flex:1;padding:9px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg)}
.searchbar button,.hero-search button{background:var(--accent);color:#fff;border:0;border-radius:10px;padding:9px 16px;font-weight:600;cursor:pointer}
.mainnav{display:flex;align-items:center;gap:16px;margin-left:auto;font-weight:500}
.mainnav .cta{background:var(--accent);color:#fff;padding:8px 14px;border-radius:10px}
.mainnav .cta:hover{text-decoration:none}

/* hero */
.hero{padding:48px 0 24px;text-align:center}
.hero h1{font-size:2.6rem}
.lede{font-size:1.1rem;color:var(--muted);max-width:680px;margin:.2em auto 1.2em}
.hero-search{display:flex;gap:8px;max-width:560px;margin:0 auto 12px}
.hero-search input{flex:1;padding:13px 16px;border:1px solid var(--line);border-radius:12px;font-size:1rem}

/* sections */
.vert-block{margin:34px 0}
.vert-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;margin:12px 0}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow);display:block}
.card:hover{text-decoration:none;border-color:var(--accent)}
.card .meta{color:var(--muted);font-size:.85rem;margin:.5em 0 0}

/* rows */
.rows{display:flex;flex-direction:column;gap:8px;margin:14px 0}
.row{display:flex;justify-content:space-between;align-items:center;gap:14px;background:var(--surface);
  border:1px solid var(--line);border-radius:10px;padding:13px 16px}
a.row:hover{text-decoration:none;border-color:var(--accent)}
.row-main h3{font-size:1.05rem}
.row-main .muted{font-size:.88rem}
.row-side{display:flex;align-items:center;gap:12px;text-align:right}
.meta{color:var(--muted);font-size:.85rem;white-space:nowrap}

/* chips, tags, pills */
.chips{display:inline-flex;flex-wrap:wrap;gap:5px}
.chip{background:var(--chip);border-radius:999px;padding:3px 10px;font-size:.78rem;color:var(--ink)}
.chips.big .chip{font-size:.85rem;padding:5px 12px}
a.chip:hover{text-decoration:none;background:#e6dffb}
.taglist{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.taglist.big{gap:10px}
.tag{background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:6px 14px;font-size:.9rem}
.tag:hover{text-decoration:none;border-color:var(--accent)}
.pills{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.pill{border:1px solid var(--line);border-radius:999px;padding:7px 15px;background:var(--surface);font-weight:500}
.pill.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.pill:hover{text-decoration:none}

/* panels */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px;margin:16px 0;box-shadow:var(--shadow)}
.panel.narrow{max-width:520px;margin:36px auto}
.crumbs{font-size:.88rem;color:var(--muted);margin-top:14px}
.factbar{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin:16px 0}
.factbar>div{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px 14px;display:flex;flex-direction:column}
.factbar span{font-size:.78rem}
.factbar strong{font-size:1.05rem}

/* key-value */
.kv{list-style:none;padding:0;margin:0}
.kv li{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid var(--line)}
.kv li span{color:var(--muted)}

/* lock / paywall */
.lock{background:linear-gradient(180deg,#fff,#f7f3ff);border:1px dashed var(--accent);border-radius:12px;
  padding:16px 18px;margin:14px 0;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.lock strong{display:block;width:100%}
.lock .cta{margin-left:auto}
.confirmed-teaser{background:linear-gradient(180deg,#fff,#f0f7ff);border-color:#7eb8ff}

/* footer attribution */
.attribution{margin-top:10px;font-size:.8rem;line-height:1.4;max-width:760px}

/* empty state */
.empty{text-align:center;padding:40px 20px;border:1px dashed var(--line);border-radius:12px;margin:18px 0;color:var(--muted)}
.empty p{margin:0 0 14px}

/* cta buttons */
.cta{display:inline-block;background:var(--accent);color:#fff;border:0;border-radius:10px;padding:10px 18px;
  font-weight:600;cursor:pointer;font-size:.95rem}
.cta:hover{text-decoration:none;background:var(--accent-ink)}
.cta.ghost{background:transparent;color:var(--accent-ink);border:1px solid var(--accent)}
.google-btn{display:block;text-align:center;border:1px solid var(--line);border-radius:10px;padding:12px;font-weight:600;background:var(--surface);color:var(--ink)}

/* pricing */
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin:20px 0}
.plan{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
.plan.featured{border-color:var(--accent);border-width:2px}
.plan .price{font-size:2.2rem;font-weight:700;margin:.1em 0}
.plan .price span{font-size:1rem;color:var(--muted);font-weight:500}
.plan ul{padding-left:18px;color:var(--ink)}
.plan li{margin:.35em 0}

/* faq */
.faq details{border-bottom:1px solid var(--line);padding:10px 0}
.faq summary{cursor:pointer;font-weight:600}

/* pagination */
.pagination{display:flex;align-items:center;gap:16px;justify-content:center;margin:22px 0}

/* actions */
.actions{display:flex;gap:12px;align-items:center;margin-top:16px}
.actions form{margin:0}

/* footer */
.footer{border-top:1px solid var(--line);margin-top:48px;padding:26px 0;background:var(--surface)}
.footer p{margin:.2em 0}
.footnav{display:flex;flex-wrap:wrap;gap:16px;margin-top:10px}

@media(max-width:720px){
  .searchbar{display:none}
  .hero h1{font-size:2rem}
  .mainnav{gap:10px;font-size:.92rem}
}
