/* Groundwork Heritage — shared brand system.
   Palette + type per MichifAI Partners' brand guide, identical to the
   Groundwork product so the two read as one family. The B3 frontend
   workstream owns the final page designs; this file is the shared
   foundation they build on. */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600&family=Inter:wght@400;500;600&display=swap');

:root {
  --ink:#1C1C1A; --stone:#FFFFFF; --stone-dim:#D8E4E0;
  --teal:#0A5C47; --teal-dark:#063829; --ochre:#C4860F; --gold-light:#F5C96A;
  --line:#D8E4E0; --paper:#EFF4F2; --grey:#4A4A47;
  /* semantic — screening verdict, kept separate from the brand accent */
  --flag-action:#9C4436; --flag-review:#A9701A; --flag-clear:#2F6B4F;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ink:#EFF4F2; --stone:#1C1C1A; --stone-dim:#2B2B23;
    --teal:#2FAE86; --teal-dark:#4FC79C; --ochre:#C4860F; --gold-light:#F5C96A;
    --line:#3A3A34; --paper:#242420; --grey:#A8A89E;
    --flag-action:#D3826F; --flag-review:#D6A24E; --flag-clear:#5FB489;
  }
}
:root[data-theme="dark"] {
  --ink:#EFF4F2; --stone:#1C1C1A; --stone-dim:#2B2B23;
  --teal:#2FAE86; --teal-dark:#4FC79C; --ochre:#C4860F; --gold-light:#F5C96A;
  --line:#3A3A34; --paper:#242420; --grey:#A8A89E;
  --flag-action:#D3826F; --flag-review:#D6A24E; --flag-clear:#5FB489;
}

* { box-sizing:border-box; }
body { margin:0; background:var(--stone); color:var(--ink); font-family:'Inter',sans-serif; -webkit-font-smoothing:antialiased; line-height:1.6; }
.wrap { max-width:960px; margin:0 auto; padding:0 24px; }

h1,h2,h3 { font-family:'Fraunces',serif; font-weight:500; font-optical-sizing:auto; letter-spacing:-0.01em; line-height:1.12; }
h1 { font-size:clamp(34px,5.5vw,52px); margin:12px 0 16px; max-width:20ch; }
h2 { font-size:clamp(22px,3.4vw,28px); margin:0 0 8px; }
p { margin:0 0 1rem; }
a { color:var(--teal); }

.eyebrow { font-weight:500; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--teal); display:flex; align-items:center; gap:8px; }
.eyebrow::before { content:""; width:14px; height:1px; background:var(--ochre); display:inline-block; }

.lead { max-width:56ch; color:var(--grey); font-size:16px; line-height:1.65; margin-bottom:28px; }

.brandbar { display:flex; align-items:baseline; gap:10px; padding:28px 0; flex-wrap:wrap; }
.brandbar .lockup { display:flex; align-items:baseline; gap:6px; }
.brandbar .mark { font-family:'Fraunces',serif; font-weight:600; font-size:15px; color:var(--teal); text-decoration:none; }
.brandbar .by { font-size:11px; color:var(--grey); letter-spacing:.03em; }
.brandbar .links { margin-left:auto; display:flex; align-items:baseline; gap:22px; flex-wrap:wrap; }
.brandbar .links a { font-size:12.5px; font-weight:600; color:var(--teal); text-decoration:none; }
.brandbar .links a:hover { color:var(--teal-dark); }
#nav-auth { display:contents; }
.theme-toggle { background:none; border:none; cursor:pointer; padding:0; font-size:15px; line-height:1; color:var(--grey); }
.theme-toggle:hover { color:var(--ink); }

.cta-row { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:20px; }
.cta { font-size:14px; font-weight:600; padding:12px 22px; border-radius:2px; cursor:pointer; border:1px solid var(--line); background:transparent; color:var(--ink); text-decoration:none; display:inline-block; }
.cta.primary { background:var(--ochre); color:#FFFFFF; border-color:var(--ochre); }
.cta:hover { opacity:.85; }

.section { padding:48px 0; border-top:1px solid var(--line); }
.trust-note { font-size:12.5px; color:var(--grey); line-height:1.55; background:var(--stone-dim); border-left:2px solid var(--teal); padding:12px 14px; max-width:66ch; }

.card { background:var(--paper); border:1px solid var(--line); border-radius:2px; padding:24px; }
.grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
@media (max-width:720px) { .grid-2 { grid-template-columns:1fr; } }

footer { padding:32px 0 60px; color:var(--grey); font-size:12px; border-top:1px solid var(--line); }

/* ── shared building blocks used across locate / pricing / account ──────── */

.muted { color:var(--grey); font-size:13px; }
.err, .error { color:var(--flag-action); font-size:13.5px; }
.back-to-top { display:block; text-align:center; font-size:12px; font-weight:600; color:var(--grey); text-decoration:none; margin-top:32px; }
.back-to-top:hover { color:var(--teal); }

/* form controls */
.field { width:100%; padding:11px 14px; border:1px solid var(--line); border-radius:2px; background:var(--stone); color:var(--ink); font:inherit; outline:none; }
.field:focus { border-color:var(--teal); }
select.field { padding:11px 12px; }

/* the screening search bar */
.searchbar { background:var(--paper); border:1px solid var(--line); border-radius:2px; padding:14px 16px; display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.searchbar input[type=text] { flex:1; min-width:180px; border:1px solid var(--line); border-radius:2px; background:var(--stone); color:var(--ink); font:inherit; padding:10px 12px; }
.searchbar input[type=text]:focus { border-color:var(--teal); }
.searchbar select { border:1px solid var(--line); border-radius:2px; background:var(--stone); color:var(--ink); font:inherit; padding:10px 10px; }
.searchbar button { font-weight:600; font-size:14px; background:var(--teal); color:#fff; border:none; padding:11px 20px; border-radius:2px; cursor:pointer; }
.searchbar button:hover { background:var(--teal-dark); }
.searchbar button:disabled { opacity:.5; cursor:not-allowed; }

/* verdict box — semantic colours, separate from the brand accent */
.verdict { border:1px solid var(--line); border-radius:2px; padding:20px 22px; margin:22px 0; }
.verdict .v-tag { display:inline-flex; align-items:center; gap:7px; font-size:10.5px; font-weight:600; letter-spacing:.09em; text-transform:uppercase; margin-bottom:8px; }
.verdict .v-tag::before { content:""; width:8px; height:8px; border-radius:50%; display:inline-block; }
.verdict h2, .verdict h3 { margin:0 0 6px; }
.verdict .flag { font-size:13.5px; line-height:1.55; padding:10px 0; border-top:1px dashed var(--line); }
.verdict .flag:first-of-type { margin-top:6px; }
.verdict .flag strong { display:block; }
.verdict .flag span { color:var(--grey); }
.verdict.action_required { border-left:4px solid var(--flag-action); background:color-mix(in srgb, var(--flag-action) 8%, var(--stone)); }
.verdict.action_required .v-tag { color:var(--flag-action); } .verdict.action_required .v-tag::before { background:var(--flag-action); }
.verdict.review { border-left:4px solid var(--flag-review); background:color-mix(in srgb, var(--flag-review) 8%, var(--stone)); }
.verdict.review .v-tag { color:var(--flag-review); } .verdict.review .v-tag::before { background:var(--flag-review); }
.verdict.not_indicated { border-left:4px solid var(--flag-clear); background:color-mix(in srgb, var(--flag-clear) 8%, var(--stone)); }
.verdict.not_indicated .v-tag { color:var(--flag-clear); } .verdict.not_indicated .v-tag::before { background:var(--flag-clear); }

/* results list */
.section-label { font-weight:600; font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--grey); margin:22px 0 8px; }
.reclist { margin:0; padding:0; list-style:none; }
.reclist li { padding:12px 2px; border-bottom:1px solid var(--line); font-size:13.5px; line-height:1.5; cursor:default; }
.reclist li:last-child { border-bottom:none; }
.reclist li.hit { cursor:pointer; }
.reclist li.active { background:color-mix(in srgb, var(--teal) 9%, var(--stone)); }
.reclist li .name { font-family:'Fraunces',serif; font-size:15.5px; font-weight:500; }
.reclist li .meta { color:var(--grey); font-size:12px; margin-top:2px; }
.reclist li .dist { float:right; color:var(--teal); font-weight:500; font-size:12px; }
.reclist li.empty { color:var(--grey); font-style:italic; cursor:default; }

/* leaflet map */
#map { height:440px; border:1px solid var(--line); border-radius:2px; background:var(--paper); }
.gw-pin { filter:drop-shadow(0 1px 2px rgba(0,0,0,.35)); }
.gw-pin svg { display:block; width:100%; height:100%; }
.gw-pin .pin-fill { fill:var(--teal); }
.gw-pin.site .pin-fill { fill:var(--ochre); }
.gw-pin.selected .pin-fill { fill:#2E5C8A; }
.leaflet-bar a { background:var(--paper); color:var(--ink); border-bottom-color:var(--line); }
.leaflet-bar a:hover { background:var(--stone-dim); }
.leaflet-control-attribution { background:var(--paper); color:var(--grey); }
.leaflet-control-attribution a { color:var(--teal); }

/* pricing */
.plan-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
@media (max-width:720px) { .plan-grid { grid-template-columns:1fr; } }
.plan-card { background:var(--paper); border:1px solid var(--line); border-radius:2px; padding:30px 26px; }
.plan-card.paid { border-color:var(--ochre); background:rgba(196,134,15,.05); }
.plan-card .plan-label { font-weight:600; font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--grey); margin-bottom:10px; }
.plan-card.paid .plan-label { color:var(--ochre); }
.plan-card .price { font-family:'Fraunces',serif; font-weight:500; font-size:40px; line-height:1; margin-bottom:4px; }
.plan-card .price span { font-size:15px; font-weight:400; color:var(--grey); }
.plan-card .price-note { font-size:12.5px; color:var(--grey); margin-bottom:20px; }
.plan-card .cta { width:100%; text-align:center; }
.compare-scroll { overflow-x:auto; }
.compare { width:100%; border-collapse:collapse; }
.compare th, .compare td { padding:12px 14px; text-align:left; font-size:13.5px; border-bottom:1px solid var(--line); }
.compare thead th { font-weight:600; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--grey); }
.compare tbody th { font-weight:400; color:var(--ink); }
.compare td.c { text-align:center; }
.compare .yes { color:var(--flag-clear); font-weight:600; }
.compare .yes.p { color:var(--ochre); }
.compare .no { color:var(--line); }

/* account */
.badge { font-size:10.5px; font-weight:600; letter-spacing:.03em; text-transform:uppercase; padding:3px 9px; border-radius:20px; display:inline-flex; align-items:center; gap:5px; }
.badge::before { content:""; width:6px; height:6px; border-radius:50%; display:inline-block; }
.badge.active { background:color-mix(in srgb, var(--flag-clear) 16%, transparent); color:var(--flag-clear); }
.badge.active::before { background:var(--flag-clear); }
.badge.inactive { background:color-mix(in srgb, var(--flag-review) 16%, transparent); color:var(--flag-review); }
.badge.inactive::before { background:var(--flag-review); }
.fact-row { display:flex; justify-content:space-between; gap:12px; align-items:center; padding:9px 0; border-bottom:1px dashed var(--line); font-size:13.5px; }
.fact-row:last-child { border-bottom:none; }
.fact-row .k { color:var(--grey); }
.key-box { font-family:ui-monospace,Menlo,Consolas,monospace; font-size:12.5px; background:var(--stone-dim); border:1px solid var(--line); border-radius:2px; padding:10px 12px; margin-top:8px; word-break:break-all; }

/* faq */
.faq dt { font-family:'Fraunces',serif; font-weight:500; font-size:16px; margin:20px 0 6px; }
.faq dt:first-child { margin-top:0; }
.faq dd { margin:0; color:var(--grey); font-size:13.5px; line-height:1.6; max-width:64ch; }

@media (max-width:720px) {
  .grid-2 { grid-template-columns:1fr; }
  h1 { font-size:clamp(28px,7vw,38px); }
}