/* Shared styles for Amicable content pages (welcome, faq, terms, privacy).
   Calm Authority identity: Newsreader on warm ivory, deep petrol, muted brass. */
:root{
  --ground:#f4efe4; --surface:#fffdf8; --raised:#fbf7ee;
  --ink:#1a2733; --ink-2:#4a5a68; --ink-3:#6e7d89;
  --petrol:#163a5c; --teal:#276499; --teal-600:#2b6b9e;
  --brass:#a37a3f; --brass-soft:#ece0c8;
  --line:#e4dccb; --line-2:#d6ccb6;
  --calm-soft:#dce7f2; --calm-strong:#123453;
  --shadow-1:0 1px 2px rgba(18,42,68,.05), 0 6px 20px rgba(18,42,68,.07);
  --focus:#2b6b9e; --sel-bg:#ece0c8; --sel-fg:#163a5c;
}
@media (prefers-color-scheme:dark){
  :root{
    --ground:#0f1d2b; --surface:#15293a; --raised:#193043;
    --ink:#ece6d6; --ink-2:#a6b6c2; --ink-3:#7e909e;
    --petrol:#0b2033; --teal:#5aa9dd; --teal-600:#6fb3e0;
    --brass:#cba86e; --brass-soft:#2c3d4d;
    --line:#25404f; --line-2:#2f4d5d;
    --calm-soft:#173247; --calm-strong:#d6e6f2;
    --shadow-1:0 1px 2px rgba(0,0,0,.3), 0 6px 20px rgba(0,0,0,.35);
    --focus:#6fb3e0; --sel-bg:#2c3d4d; --sel-fg:#ece6d6;
  }
}
*{box-sizing:border-box}
body{margin:0; background:var(--ground); color:var(--ink);
  font-family:"Hanken Grotesk",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  font-size:17px; line-height:1.62; font-weight:450; letter-spacing:-.006em;
  -webkit-font-smoothing:antialiased; accent-color:var(--teal)}
::selection{background:var(--sel-bg); color:var(--sel-fg)}
::-webkit-scrollbar{width:12px; height:12px}
::-webkit-scrollbar-thumb{background:var(--line-2); border:3px solid var(--ground); border-radius:8px}
::-webkit-scrollbar-thumb:hover{background:var(--brass)}
.wrap{max-width:680px; margin:0 auto; padding:0 22px 64px}
a{color:var(--teal-600); text-decoration:none; text-underline-offset:3px; text-decoration-thickness:1px}
a:hover{text-decoration:underline}
:focus-visible{outline:2.5px solid var(--focus); outline-offset:3px; border-radius:4px}
h1,h2,h3{font-family:"Newsreader",Georgia,serif; font-weight:500; line-height:1.12;
  letter-spacing:-.018em; text-wrap:balance; color:var(--ink); font-optical-sizing:auto}
header{padding:24px 0 6px}
.brand{display:inline-flex; align-items:center; gap:10px; font-family:"Newsreader",serif;
  font-size:23px; font-weight:600; color:var(--ink); letter-spacing:-.02em}
.brand .dot{width:12px; height:12px; border-radius:50%;
  background:radial-gradient(circle at 32% 30%, var(--brass), var(--teal))}
.brand a{color:inherit}
h1{font-size:2.5rem; margin:20px 0 6px}
h2{font-size:1.32rem; margin:32px 0 8px}
.updated{color:var(--ink-3); font-size:14px; margin:0 0 10px}
p,li{color:var(--ink)}
.muted{color:var(--ink-2)}
.card{background:var(--surface); border:1px solid var(--line); border-radius:18px; padding:26px 24px; margin-top:18px}
.faq-q{font-family:"Newsreader",serif; font-weight:600; margin:26px 0 5px; font-size:1.22rem; letter-spacing:-.015em; line-height:1.25}
.btn{display:inline-block; background:var(--petrol); color:#f4efe4; font-weight:600; padding:13px 24px;
  border-radius:999px; margin-top:10px; transition:transform .18s cubic-bezier(.2,.7,.2,1), background .2s}
.btn:hover{background:#11314e; text-decoration:none; transform:translateY(-1px)}
.callout{background:var(--calm-soft); border-radius:14px; padding:15px 17px; margin:16px 0; color:var(--calm-strong)}
.backlink{display:inline-block; margin-top:28px; font-size:14.5px; font-weight:500}
footer{border-top:1px solid var(--line); margin-top:34px; padding:24px 0; color:var(--ink-3); font-size:13.5px}
footer a{color:var(--ink-2)}