:root {
  --ground: #f5f1e8; --paper: #fbf8f1; --ink: #14243a; --ink-soft: #3d4a61; --ink-mute: #71798a;
  --rule: #ddd5c2; --rule-soft: #e8e1cf; --brass: #9a6b30; --brass-tint: rgba(154,107,48,0.08); --sage: #52705f;
  --shadow: 0 1px 2px rgba(20,36,58,0.05), 0 6px 20px rgba(20,36,58,0.05);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ground: #101c2e; --paper: #16263c; --ink: #ece5d3; --ink-soft: #c3bda9; --ink-mute: #8d96a8;
    --rule: #263850; --rule-soft: #1e2e44; --brass: #cd9c58; --brass-tint: rgba(205,156,88,0.10); --sage: #8fb39f;
    --shadow: 0 1px 2px rgba(0,0,0,0.4), 0 10px 24px rgba(0,0,0,0.3); color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --ground: #101c2e; --paper: #16263c; --ink: #ece5d3; --ink-soft: #c3bda9; --ink-mute: #8d96a8;
  --rule: #263850; --rule-soft: #1e2e44; --brass: #cd9c58; --brass-tint: rgba(205,156,88,0.10); --sage: #8fb39f;
  --shadow: 0 1px 2px rgba(0,0,0,0.4), 0 10px 24px rgba(0,0,0,0.3); color-scheme: dark;
}
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--ground); color: var(--ink); font-family: "Public Sans","Helvetica Neue",Arial,sans-serif; font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; }
.wrap { max-width: 680px; margin: 0 auto; padding: 36px 24px 80px; }
.mast { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding-bottom: 20px; border-bottom: 1px solid var(--rule); }
.brand { font-family: "Newsreader",Georgia,serif; font-size: 21px; font-weight: 500; letter-spacing: -0.01em; color: var(--ink); text-decoration: none; }
.mast nav { display: flex; gap: 18px; font-size: 13.5px; flex-wrap: wrap; }
.mast nav a { color: var(--ink-soft); text-decoration: none; }
.mast nav a:hover, .mast nav a:focus { color: var(--brass); outline: none; }
.theme-toggle { background: none; border: 1px solid var(--rule); color: var(--ink-mute); padding: 5px 10px; border-radius: 5px; font: inherit; font-size: 11.5px; letter-spacing: 0.04em; cursor: pointer; }
.theme-toggle:hover { color: var(--ink); border-color: var(--brass); }
.hero { padding: 72px 0 48px; }
.hero h1 { font-family: "Newsreader",Georgia,serif; font-weight: 400; font-size: clamp(40px,7vw,60px); line-height: 1.08; letter-spacing: -0.015em; text-wrap: balance; margin: 0 0 20px; }
.hero p.lede { font-size: 17.5px; color: var(--ink-soft); max-width: 33em; text-wrap: pretty; margin: 0 0 28px; }
.hero p.lede.sub { font-size: 15.5px; color: var(--ink-mute); }
.cta-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.btn { display: inline-flex; align-items: center; font: inherit; font-weight: 500; font-size: 14.5px; padding: 11px 20px; border-radius: 6px; text-decoration: none; border: 1px solid transparent; cursor: pointer; transition: background 120ms ease, border-color 120ms ease; }
.btn-primary { background: var(--ink); color: var(--ground); }
.btn-primary:hover { background: var(--brass); }
.btn-secondary { color: var(--ink); border-color: var(--rule); }
.btn-secondary:hover { border-color: var(--brass); }
.hero .note { font-size: 13px; color: var(--ink-mute); margin: 14px 0 0; }
.records { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 40px 0 8px; }
@media (max-width: 560px) { .records { grid-template-columns: 1fr; } }
.doc { background: var(--paper); border: 1px solid var(--rule); border-radius: 4px; box-shadow: var(--shadow); padding: 20px; font-size: 12px; line-height: 1.45; }
.doc .doc-label { font-size: 9.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-mute); padding-bottom: 8px; margin-bottom: 10px; border-bottom: 1px solid var(--rule-soft); display: flex; justify-content: space-between; align-items: baseline; }
.doc .doc-label .tag { color: var(--sage); letter-spacing: 0.08em; }
.doc h4 { font-family: "Newsreader",Georgia,serif; font-weight: 500; font-size: 17px; line-height: 1.2; margin: 0 0 10px; }
.doc .kv { display: grid; grid-template-columns: 1fr auto; gap: 3px 12px; margin: 8px 0; font-variant-numeric: tabular-nums; }
.doc .kv dt { color: var(--ink-mute); font-size: 11px; }
.doc .kv dd { color: var(--ink-soft); font-size: 11px; margin: 0; text-align: right; }
.doc hr { border: 0; border-top: 1px solid var(--rule-soft); margin: 10px 0; }
.doc p { margin: 4px 0; font-size: 11px; color: var(--ink-soft); }
.doc p .k { color: var(--ink-mute); }
.doc .resolved { padding-left: 8px; border-left: 2px solid var(--brass); font-size: 11.5px; color: var(--ink); margin: 7px 0; }
.doc .sig { display: flex; align-items: baseline; gap: 10px; margin-top: 14px; }
.doc .sig-line { flex: 1; border-bottom: 1px solid var(--ink-soft); padding-bottom: 1px; font-family: "Newsreader",Georgia,serif; font-size: 13.5px; }
.doc .sig-label { font-size: 9px; color: var(--ink-mute); text-transform: uppercase; letter-spacing: 0.1em; }
.doc-caption { text-align: center; color: var(--ink-mute); font-size: 12.5px; margin: 12px 0 0; }
section { padding: 60px 0 0; }
section + section { margin-top: 60px; border-top: 1px solid var(--rule-soft); }
h2 { font-family: "Newsreader",Georgia,serif; font-weight: 400; font-size: clamp(28px,4.5vw,36px); line-height: 1.12; letter-spacing: -0.01em; text-wrap: balance; margin: 0 0 16px; }
.section-lede { color: var(--ink-soft); max-width: 38em; margin: 0 0 32px; }
.steps { display: grid; gap: 18px; max-width: 40em; }
.steps p { margin: 0; color: var(--ink-soft); font-size: 15.5px; }
.steps b { color: var(--ink); font-weight: 600; }
.calc { background: var(--paper); border: 1px solid var(--rule); border-radius: 8px; padding: 28px 26px; box-shadow: var(--shadow); }
.calc-label { color: var(--ink-mute); font-size: 12px; text-transform: uppercase; letter-spacing: 0.07em; }
.calc-value { font-family: "Newsreader",Georgia,serif; font-weight: 500; font-size: 30px; line-height: 1.1; font-variant-numeric: tabular-nums; }
.calc-value.fee { color: var(--brass); }
.calc-value.write-off { color: var(--sage); }
.calc input[type="range"] { width: 100%; accent-color: var(--brass); margin-top: 12px; }
.slider-scale { display: flex; justify-content: space-between; color: var(--ink-mute); font-size: 11px; font-variant-numeric: tabular-nums; margin-top: 4px; }
.calc-row { display: flex; justify-content: space-between; gap: 20px; margin-top: 28px; }
.calc-row > div:last-child { text-align: right; }
.verdict { padding-top: 18px; margin-top: 22px; border-top: 1px solid var(--rule-soft); color: var(--ink-soft); font-size: 14px; }
.verdict strong { color: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.fineprint { color: var(--ink-mute); font-size: 12.5px; margin: 14px 0 0; }
.whofor { display: grid; gap: 0; border: 1px solid var(--rule); border-radius: 8px; overflow: hidden; }
.whofor .who-row { padding: 18px 20px; border-bottom: 1px solid var(--rule-soft); display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: baseline; }
.whofor .who-row:last-child { border-bottom: 0; }
.whofor .who-row.lead { background: var(--brass-tint); }
.whofor .marker { font-family: "Newsreader",Georgia,serif; font-size: 15px; font-weight: 600; color: var(--brass); font-variant-numeric: tabular-nums; min-width: 1.2em; }
.whofor h3 { font-family: "Newsreader",Georgia,serif; font-weight: 500; font-size: 17.5px; margin: 0 0 4px; color: var(--ink); line-height: 1.25; }
.whofor p { margin: 0; font-size: 14.5px; color: var(--ink-soft); line-height: 1.5; }
.whofor .tag { display: inline-block; font-size: 10px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--brass); margin-left: 8px; vertical-align: 2px; }
.callout { background: var(--brass-tint); border: 1px solid var(--brass); border-radius: 8px; padding: 26px; margin-top: 36px; }
.callout h3 { font-family: "Newsreader",Georgia,serif; font-weight: 500; font-size: 20px; line-height: 1.25; margin: 0 0 10px; color: var(--ink); }
.callout p { margin: 0 0 8px; color: var(--ink-soft); font-size: 15.5px; max-width: 44em; }
.callout p:last-child { margin-bottom: 0; }
.callout strong { color: var(--ink); font-weight: 600; }
.privacy h2 { max-width: 16em; }
.privacy .big { font-family: "Newsreader",Georgia,serif; font-size: clamp(20px,3vw,24px); line-height: 1.35; color: var(--ink); max-width: 30em; margin: 0 0 16px; }
.privacy p { color: var(--ink-soft); max-width: 40em; margin: 0 0 10px; font-size: 15.5px; }
.compare-wrap { overflow-x: auto; }
.compare { width: 100%; border-collapse: collapse; font-size: 14px; font-variant-numeric: tabular-nums; }
.compare th, .compare td { text-align: left; padding: 11px 10px; border-bottom: 1px solid var(--rule-soft); }
.compare th { font-size: 10.5px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-mute); }
.compare tr:last-child td { border-bottom: 0; }
.compare .us td { color: var(--ink); font-weight: 500; }
.compare .us td:first-child { color: var(--brass); }
.founder p { color: var(--ink-soft); max-width: 40em; margin: 0 0 10px; font-size: 16px; }
.founder .attribution { color: var(--ink-mute); font-size: 13px; margin-top: 14px; }
details.faq { border-top: 1px solid var(--rule-soft); padding: 18px 0; }
details.faq:last-of-type { border-bottom: 1px solid var(--rule-soft); }
details.faq summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 20px; font-family: "Newsreader",Georgia,serif; font-weight: 500; font-size: 17.5px; color: var(--ink); }
details.faq summary::-webkit-details-marker { display: none; }
details.faq summary::after { content: "+"; color: var(--brass); font-family: "Public Sans",sans-serif; }
details.faq[open] summary::after { content: "\2212"; }
details.faq p { color: var(--ink-soft); font-size: 15px; margin: 12px 0 0; max-width: 42em; }
.signup { text-align: center; padding-top: 72px; }
.signup h2 { margin: 0 auto 14px; }
.signup > p { color: var(--ink-soft); max-width: 30em; margin: 0 auto 26px; }
.signup form { display: flex; max-width: 420px; margin: 0 auto; border: 1px solid var(--rule); border-radius: 6px; background: var(--paper); box-shadow: var(--shadow); overflow: hidden; }
.signup input[type="email"] { flex: 1; min-width: 0; background: none; color: var(--ink); border: 0; padding: 13px 15px; font: inherit; font-size: 14.5px; outline: none; }
.signup input::placeholder { color: var(--ink-mute); }
.signup .hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.signup button { background: var(--ink); color: var(--ground); border: 0; padding: 13px 20px; font: inherit; font-size: 14px; font-weight: 500; cursor: pointer; }
.signup button:hover { background: var(--brass); }
.signup button[disabled] { opacity: 0.6; cursor: default; }
.trial-copy { margin-top: 14px; font-size: 12.5px; color: var(--ink-mute); }
.trial-copy a { color: var(--ink-soft); }
.trial-copy.ok { color: var(--sage); font-weight: 500; }
.trial-copy.err { color: var(--brass); font-weight: 500; }
footer { margin-top: 72px; padding-top: 28px; border-top: 1px solid var(--rule); color: var(--ink-mute); font-size: 12.5px; }
footer p { max-width: 46em; margin: 0 0 8px; }
footer a { color: var(--ink-soft); text-decoration: none; border-bottom: 1px dotted var(--rule); }
footer a:hover { color: var(--ink); border-bottom-color: var(--brass); }
/* legal pages */
.legal { max-width: 42em; }
.legal .draft { background: var(--brass-tint); border: 1px solid var(--brass); border-radius: 6px; padding: 12px 16px; font-size: 13.5px; color: var(--ink-soft); margin: 28px 0 8px; }
.legal h1 { font-family: "Newsreader",Georgia,serif; font-weight: 400; font-size: clamp(30px,5vw,42px); line-height: 1.1; margin: 28px 0 8px; letter-spacing: -0.01em; }
.legal h2 { font-size: clamp(20px,3vw,24px); margin: 36px 0 10px; }
.legal p, .legal li { color: var(--ink-soft); font-size: 15px; }
.legal table { border-collapse: collapse; width: 100%; font-size: 14px; }
.legal th, .legal td { text-align: left; padding: 9px 10px; border-bottom: 1px solid var(--rule-soft); vertical-align: top; }
.legal th { font-size: 10.5px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-mute); }
.legal a { color: var(--ink); }
:focus-visible { outline: 2px solid var(--brass); outline-offset: 2px; border-radius: 3px; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } html { scroll-behavior: auto; } }
