:root{
  --bg:#0c0f12;
  --panel:#12171c;
  --panel-2:#161c22;
  --border:#232c35;
  --ink:#e8edf2;
  --muted:#9aa7b3;
  --accent:#4fd1a5;
  --warn:#d9a441;
  --dim:#5d6b78;
  --mono:"Cascadia Code","JetBrains Mono",Consolas,"SF Mono",Menlo,monospace;
  --sans:"Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6}
.wrap{max-width:960px;margin:0 auto;padding:0 28px}

/* ---------- nav ---------- */
nav{position:sticky;top:0;z-index:5;background:rgba(12,15,18,.94);border-bottom:1px solid var(--border);backdrop-filter:blur(6px)}
nav .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:2px}
nav .brand{font-family:var(--mono);font-size:13px;color:var(--ink);text-decoration:none;padding:12px 12px 12px 0;margin-right:8px;font-weight:600;letter-spacing:.02em}
nav .brand:hover{color:var(--accent)}
nav a.navlink{color:var(--muted);text-decoration:none;font-size:13px;font-family:var(--mono);padding:12px 12px;display:inline-block;border-bottom:2px solid transparent}
nav a.navlink:hover,nav a.navlink:focus{color:var(--ink);border-bottom-color:var(--accent)}
nav a.navlink[aria-current="page"]{color:var(--accent);border-bottom-color:var(--accent)}

/* ---------- header / hero ---------- */
header{padding:64px 0 40px;border-bottom:1px solid var(--border)}
header.compact{padding:44px 0 32px}
.kicker{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:14px}
h1{font-size:40px;font-weight:650;letter-spacing:-.01em;line-height:1.15}
header.compact h1{font-size:32px}
.tagline{margin-top:14px;font-size:18px;color:var(--muted);max-width:680px}
.contact-row{margin-top:22px;display:flex;flex-wrap:wrap;gap:10px 26px;font-family:var(--mono);font-size:13px}
.contact-row a{color:var(--accent);text-decoration:none;border-bottom:1px solid transparent}
.contact-row a:hover,.contact-row a:focus{border-bottom-color:var(--accent)}
.contact-row span{color:var(--muted)}

/* ---------- sections ---------- */
section{padding:52px 0;border-bottom:1px solid var(--border)}
section:last-of-type{border-bottom:none}
h2{font-size:26px;font-weight:640;letter-spacing:-.01em;margin-bottom:8px}
.h2-sub{color:var(--muted);margin-bottom:28px;max-width:680px}
h3{font-size:18px;font-weight:620;margin:30px 0 10px}
p{margin-bottom:14px;max-width:74ch}
strong{font-weight:640}
a{color:var(--accent)}

/* ---------- stats strip ---------- */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border);margin-top:26px}
@media (max-width:760px){.stats{grid-template-columns:repeat(2,1fr)}}
@media (max-width:480px){.stats{grid-template-columns:1fr}}
.stat{background:var(--panel);padding:16px 18px}
.stat b{display:block;font-family:var(--mono);font-size:21px;font-weight:600;color:var(--ink)}
.stat span{font-size:12.5px;color:var(--muted)}
.stat .src{display:block;margin-top:6px;font-family:var(--mono);font-size:10.5px;color:var(--dim)}

/* ---------- evidence annotations ---------- */
.src-note{font-family:var(--mono);font-size:11px;color:var(--dim);margin-top:4px}
code{font-family:var(--mono);font-size:.9em;background:var(--panel-2);border:1px solid var(--border);padding:1px 5px;border-radius:3px}

/* ---------- cards (teasers / index listings) ---------- */
.card-list{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:24px}
@media (max-width:700px){.card-list{grid-template-columns:1fr}}
a.card{display:block;background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:20px 22px;text-decoration:none;color:var(--ink);transition:border-color .15s}
a.card:hover,a.card:focus{border-color:var(--accent)}
a.card h3{margin:0 0 6px;font-size:16.5px}
a.card .meta{font-family:var(--mono);font-size:11px;color:var(--warn);letter-spacing:.06em;text-transform:uppercase;margin-bottom:10px}
a.card p{color:var(--muted);font-size:14px;margin:0}
a.card .go{display:block;margin-top:12px;font-family:var(--mono);font-size:12px;color:var(--accent)}

/* ---------- case study body ---------- */
.case{background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:24px 26px;margin:18px 0}
.case h3{margin:0 0 4px;font-size:17px}
.case .meta{font-family:var(--mono);font-size:11.5px;color:var(--warn);letter-spacing:.06em;text-transform:uppercase;margin-bottom:14px}
.case dl,dl.prf{display:grid;grid-template-columns:120px 1fr;gap:10px 18px}
.case dt,dl.prf dt{font-family:var(--mono);font-size:12px;color:var(--accent);text-transform:uppercase;letter-spacing:.08em;padding-top:2px}
.case dd,dl.prf dd{color:var(--ink);font-size:15px}
.case dd p,dl.prf dd p{margin-bottom:8px;font-size:15px}
@media (max-width:640px){.case dl,dl.prf{grid-template-columns:1fr}.case dt,dl.prf dt{margin-top:8px}}

/* ---------- tables ---------- */
table{width:100%;border-collapse:collapse;margin:16px 0;font-size:14px}
th{text-align:left;font-family:var(--mono);font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);border-bottom:1px solid var(--border);padding:8px 10px}
td{border-bottom:1px solid var(--border);padding:8px 10px;vertical-align:top}
td.mono,.mono{font-family:var(--mono);font-size:13px}
.pass{color:var(--accent);font-family:var(--mono);font-weight:600}
.skip{color:var(--muted);font-family:var(--mono)}

/* ---------- lists ---------- */
.cols{display:grid;grid-template-columns:1fr 1fr;gap:8px 34px;margin:14px 0}
@media (max-width:640px){.cols{grid-template-columns:1fr}}
.cols li{list-style:none;padding-left:18px;position:relative;font-size:15px;margin-bottom:6px}
.cols li::before{content:"\00b7";position:absolute;left:2px;color:var(--accent);font-weight:700}
ul.plain{margin:10px 0 14px 0}
ul.plain li{list-style:none;padding-left:18px;position:relative;margin-bottom:8px;max-width:74ch}
ul.plain li::before{content:"\00b7";position:absolute;left:2px;color:var(--accent);font-weight:700}

/* ---------- tool cards ---------- */
.tool{border-left:2px solid var(--border);padding:4px 0 4px 20px;margin:22px 0}
.tool h3{margin:0 0 2px}
.tool .sub{font-family:var(--mono);font-size:12px;color:var(--muted);margin-bottom:10px}

/* ---------- prev/next pager ---------- */
.pager{display:flex;justify-content:space-between;gap:16px;padding:32px 0 8px;font-family:var(--mono);font-size:13px}
.pager a{text-decoration:none;border:1px solid var(--border);border-radius:5px;padding:10px 16px;color:var(--muted)}
.pager a:hover{border-color:var(--accent);color:var(--ink)}
.pager .spacer{flex:1}

/* ---------- footer ---------- */
footer{padding:44px 0 64px;color:var(--muted);font-size:14px;border-top:1px solid var(--border)}
.disclaimer{font-size:12.5px;color:var(--dim);margin-top:18px;max-width:74ch}

/* ---------- print ---------- */
@media print{
  :root{--bg:#fff;--panel:#fff;--panel-2:#f4f4f4;--border:#ccc;--ink:#111;--muted:#444;--accent:#0a7d5c;--warn:#8a6414;--dim:#666}
  body{font-size:12px}
  nav{display:none}
  header{padding:10px 0 20px}
  section{padding:22px 0;page-break-inside:avoid}
  .case{page-break-inside:avoid;border:1px solid #bbb}
  a{color:#0a7d5c;text-decoration:none}
  .stat b{font-size:16px}
  h1{font-size:28px}
  .pager{display:none}
}
