/* Shared by the plain pages (privacy, terms, thanks). Tokens match index.html. */
:root{
  --bg:#faf9f7; --bg-subtle:#f4f2ef; --bg-card:#ffffff;
  --border:#e8e4de; --border-light:#f0ede8;
  --text:#1a1714; --text-muted:#706760; --text-light:#6b6259;
  --accent:#c4956a; --accent-ink:#8a5a2b; --accent-soft:#f5ede4; --accent-mid:#e8c4a0;
  --ink-dark:#15120f;
  --ff-display:'Instrument Serif', Georgia, serif;
  --ff-body:'DM Sans', system-ui, -apple-system, sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none !important}   /* the consent banner's own rules must not outrank it */
html{-webkit-text-size-adjust:100%; background:var(--bg)}
body{
  margin:0; background:var(--bg); color:var(--text); font-family:var(--ff-body);
  font-size:16px; line-height:1.65; -webkit-font-smoothing:antialiased;
}
a{color:var(--accent-ink)}
.nav{border-bottom:1px solid var(--border-light); background:rgba(250,249,247,.92)}
.nav-in{max-width:760px; margin:0 auto; padding:18px 24px; display:flex; align-items:center; justify-content:space-between; gap:16px}
.nav img{height:22px; width:auto; display:block}
.nav a.back{font-size:14px; color:var(--text-muted); text-decoration:none}
.nav a.back:hover{color:var(--text)}
main{max-width:760px; margin:0 auto; padding:48px 24px 72px}
h1{font-family:var(--ff-display); font-weight:400; font-size:clamp(36px,6vw,50px); line-height:1.05; letter-spacing:-.02em; margin:0 0 10px}
.updated{font-size:14px; color:var(--text-light); margin:0 0 34px}
h2{font-size:18px; font-weight:600; margin:34px 0 8px; letter-spacing:-.005em}
p, li{color:var(--text-muted)}
p{margin:0 0 12px}
ul{margin:0 0 12px; padding-left:20px}
li{margin:0 0 6px}
strong{color:var(--text); font-weight:600}
.btn{
  display:inline-flex; align-items:center; justify-content:center; font-family:var(--ff-body); font-size:15.5px;
  font-weight:600; padding:14px 24px; border-radius:10px; text-decoration:none;
  background:var(--accent); color:#2a1e12;
}
.center{text-align:center}
.foot{max-width:760px; margin:0 auto; padding:0 24px 48px; font-size:13px; color:var(--text-light)}
.foot a{color:var(--text-muted)}
:focus-visible{outline:2px solid var(--accent-ink); outline-offset:3px; border-radius:4px}

/* ---------- blog (public/blog/**) ---------- */
.nav-links{display:flex; align-items:center; gap:16px}
.nav-links a{font-size:14px; color:var(--text-muted); text-decoration:none}
.nav-links a:hover{color:var(--text)}
.nav-links a.btn-sm{
  padding:10px 16px; border-radius:10px; font-weight:600; font-size:14px;
  background:var(--ink-dark); color:#fff;
}
.nav-links a.btn-sm:hover{color:#fff}
@media (max-width:400px){ .nav-links .hide-xs{display:none} }
.crumbs{font-size:13px; color:var(--text-light); margin:0 0 22px}
.crumbs ol{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:6px}
.crumbs li{margin:0; color:var(--text-light)}
.crumbs li+li::before{content:"/"; margin-right:6px; color:var(--border)}
.crumbs a{color:var(--text-muted); text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.eyebrow{font-size:11.5px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--accent-ink); margin:0 0 12px}
.lede{font-size:18.5px; line-height:1.6; color:var(--text-muted); margin:0 0 18px}
.post-meta{font-size:13.5px; color:var(--text-light); margin:0 0 30px}
.answer{
  background:var(--bg-card); border:1px solid var(--border); border-left:3px solid var(--accent);
  border-radius:10px; padding:18px 20px; margin:0 0 30px;
}
.answer p:last-child, .answer ul:last-child{margin-bottom:0}
.answer-h{font-size:12px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--accent-ink); margin:0 0 6px}
.post h2{font-family:var(--ff-display); font-weight:400; font-size:clamp(25px,4vw,30px); line-height:1.15; letter-spacing:-.01em; margin:42px 0 12px; color:var(--text)}
.post h3{font-size:17px; font-weight:600; margin:26px 0 6px; color:var(--text)}
.post ol{margin:0 0 12px; padding-left:22px}
.post li strong{color:var(--text)}
.tbl-wrap{overflow-x:auto; margin:0 0 18px; border:1px solid var(--border); border-radius:10px; background:var(--bg-card)}
.tbl{border-collapse:collapse; width:100%; font-size:14.5px; min-width:480px}
.tbl th, .tbl td{text-align:left; vertical-align:top; padding:11px 14px; border-bottom:1px solid var(--border-light); color:var(--text-muted)}
.tbl th{font-weight:600; color:var(--text); background:var(--bg-subtle)}
.tbl tr:last-child td{border-bottom:0}
.note{font-size:14px; color:var(--text-light)}
.cta{
  margin:46px 0 10px; padding:28px 26px; border-radius:14px; background:var(--ink-dark); color:#fff;
}
.cta-tag{font-size:12px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--accent-mid); margin:0 0 8px}
.cta h2{font-family:var(--ff-display); font-weight:400; font-size:clamp(26px,4vw,32px); line-height:1.12; margin:0 0 10px; color:#fff}
.cta p{color:rgba(255,255,255,.74)}
.cta .btn{margin-top:8px}
.cta-fine{font-size:13px; margin:12px 0 0; color:rgba(255,255,255,.6) !important}
.sources{margin-top:34px; padding-top:18px; border-top:1px solid var(--border)}
.sources h2{font-family:var(--ff-body); font-size:15px; font-weight:600; margin:0 0 8px}
.sources li, .sources p{font-size:14px}
.related{margin-top:30px}
.related h2{font-family:var(--ff-body); font-size:15px; font-weight:600; margin:0 0 8px}
.post-list{list-style:none; padding:0; margin:28px 0 0; display:grid; gap:14px}
.post-list li{margin:0}
.post-card{
  display:block; padding:22px 22px 20px; background:var(--bg-card); border:1px solid var(--border);
  border-radius:12px; text-decoration:none; transition:border-color .2s ease, box-shadow .2s ease;
}
.post-card:hover{border-color:var(--accent-mid); box-shadow:0 6px 22px rgba(0,0,0,.06)}
.post-card h2{font-family:var(--ff-display); font-weight:400; font-size:clamp(23px,3.6vw,27px); line-height:1.15; margin:0 0 8px; color:var(--text)}
.post-card p{margin:0 0 10px}
.post-card .more{font-size:14px; font-weight:600; color:var(--accent-ink)}
.foot-nav{display:flex; flex-wrap:wrap; gap:6px 16px; margin:0 0 8px}