:root{
  --paper:#F1F3EF; --surface:#FBFCFA; --surface-2:#E9EDE8;
  --ink:#16211D; --ink-soft:#4C5A55; --ink-faint:#75837D;
  --rule:#D2D9D0; --rule-strong:#B6C0B6;
  --seal:#A32C24; --jade:#1B6B57; --amber:#846011;
  --seal-wash:#F6E7E5; --jade-wash:#E3EFEA; --amber-wash:#F5EEDC;
  --display:"IBM Plex Sans Condensed",system-ui,sans-serif;
  --body:"Source Serif 4",Georgia,serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --paper:#111614; --surface:#181F1C; --surface-2:#1F2723;
  --ink:#E5EBE6; --ink-soft:#9FADA7; --ink-faint:#7B8A84;
  --rule:#2B3430; --rule-strong:#3C4741;
  --seal:#E3796E; --jade:#6FC5A6; --amber:#D9AC55;
  --seal-wash:#2A1B19; --jade-wash:#16261F; --amber-wash:#26200F;
}}
:root[data-theme="dark"]{
  --paper:#111614; --surface:#181F1C; --surface-2:#1F2723;
  --ink:#E5EBE6; --ink-soft:#9FADA7; --ink-faint:#7B8A84;
  --rule:#2B3430; --rule-strong:#3C4741;
  --seal:#E3796E; --jade:#6FC5A6; --amber:#D9AC55;
  --seal-wash:#2A1B19; --jade-wash:#16261F; --amber-wash:#26200F;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
a{color:var(--jade)}
html,body{margin:0}
body{background:var(--paper); color:var(--ink); font-family:var(--body);
  font-size:16px; line-height:1.55; -webkit-font-smoothing:antialiased}
.wrap{max-width:1180px; margin:0 auto; padding:0 24px 80px}

header{border-bottom:2px solid var(--ink); padding:36px 0 16px; margin-bottom:28px}
.brand{font-family:var(--display); font-weight:700; font-size:1.05rem;
  letter-spacing:.02em; display:flex; align-items:baseline; gap:10px; margin-bottom:16px}
.brand span{font-family:var(--mono); font-size:10.5px; font-weight:400;
  letter-spacing:.14em; text-transform:uppercase; color:var(--seal)}
h1{font-family:var(--display); font-weight:700; font-size:clamp(2rem,4.6vw,3.1rem);
  line-height:1.02; letter-spacing:-.015em; margin:0 0 12px; text-wrap:balance}
.dek{color:var(--ink-soft); max-width:58ch; margin:0 0 8px; font-size:1.03rem}

.grid{display:grid; grid-template-columns:minmax(300px,380px) 1fr; gap:40px; align-items:start}
@media (max-width:880px){.grid{grid-template-columns:1fr; gap:28px}}

/* ---- form ---- */
.panel{background:var(--surface); border:1px solid var(--rule); padding:22px}
.sec-lbl{font-family:var(--mono); font-size:10.5px; letter-spacing:.13em;
  text-transform:uppercase; color:var(--ink-faint); margin:0 0 12px;
  padding-bottom:8px; border-bottom:1px solid var(--rule)}
.sec-lbl.mt{margin-top:26px}
.f{margin-bottom:14px}
.f label{display:block; font-family:var(--display); font-weight:600;
  font-size:.86rem; letter-spacing:.01em; margin-bottom:5px; color:var(--ink-soft)}
.f .hint{font-family:var(--mono); font-size:10px; color:var(--ink-faint);
  letter-spacing:.02em; margin-top:4px; line-height:1.4}
input,select{width:100%; font-family:var(--mono); font-size:.92rem;
  background:var(--paper); color:var(--ink);
  border:1px solid var(--rule-strong); border-radius:2px; padding:9px 10px}
input:focus,select:focus{outline:2px solid var(--jade); outline-offset:1px; border-color:var(--jade)}
.row2{display:grid; grid-template-columns:1fr 1fr; gap:10px}
.row3{display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px}
.badge{display:inline-block; font-family:var(--mono); font-size:9.5px;
  letter-spacing:.09em; text-transform:uppercase; font-weight:600;
  padding:2px 6px; border-radius:2px; margin-left:6px; vertical-align:1px}
.b-high{background:var(--jade-wash); color:var(--jade); border:1px solid var(--jade)}
.b-medium{background:var(--amber-wash); color:var(--amber); border:1px solid var(--amber)}
.b-low{background:var(--seal-wash); color:var(--seal); border:1px solid var(--seal)}

/* ---- verdict ---- */
.verdict{border:2px solid; padding:20px 22px; margin-bottom:24px}
.verdict .vl{font-family:var(--mono); font-size:10.5px; letter-spacing:.14em;
  text-transform:uppercase; display:block; margin-bottom:8px}
.verdict h2{font-family:var(--display); font-weight:700; font-size:1.45rem;
  line-height:1.15; margin:0 0 8px; text-wrap:balance}
.verdict p{margin:0 0 8px; font-size:.94rem; line-height:1.5}
.verdict p:last-child{margin-bottom:0}
.v-clear{border-color:var(--jade); background:var(--jade-wash)}
.v-clear .vl,.v-clear h2{color:var(--jade)}
.v-block{border-color:var(--seal); background:var(--seal-wash)}
.v-block .vl,.v-block h2{color:var(--seal)}

/* ---- headline numbers ---- */
.heads{display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:1px; background:var(--rule); border:1px solid var(--rule); margin-bottom:24px}
.head{background:var(--surface); padding:16px 18px}
.head .k{font-family:var(--mono); font-size:10px; letter-spacing:.11em;
  text-transform:uppercase; color:var(--ink-faint); display:block; margin-bottom:6px}
.head .v{font-family:var(--display); font-weight:700; font-size:1.6rem;
  line-height:1; font-variant-numeric:tabular-nums; letter-spacing:-.01em}
.head .s{font-family:var(--mono); font-size:10.5px; color:var(--ink-faint); margin-top:5px; display:block}
.head.accent .v{color:var(--jade)}

/* ---- breakdown ---- */
.tscroll{overflow-x:auto; border-top:1px solid var(--ink); margin-bottom:22px}
table{border-collapse:collapse; width:100%; min-width:460px; font-size:.92rem}
th{font-family:var(--mono); font-weight:600; font-size:10px; letter-spacing:.11em;
  text-transform:uppercase; color:var(--ink-faint); text-align:left;
  padding:10px 12px; border-bottom:1px solid var(--rule-strong)}
th.r,td.r{text-align:right}
td{padding:10px 12px; border-bottom:1px solid var(--rule); vertical-align:top}
td.r{font-family:var(--mono); font-variant-numeric:tabular-nums; white-space:nowrap}
tr.sum td{font-weight:600; border-top:1px solid var(--rule-strong); border-bottom:1px solid var(--ink)}
tr.credit td{color:var(--jade)}
td small{display:block; font-family:var(--mono); font-size:10px;
  color:var(--ink-faint); margin-top:3px; line-height:1.4}

.note{background:var(--surface-2); border-left:3px solid var(--rule-strong);
  padding:14px 16px; font-size:.9rem; color:var(--ink-soft); margin-bottom:20px}
.note b{color:var(--ink)}
h3{font-family:var(--display); font-weight:600; font-size:1.05rem; margin:26px 0 10px}
.pricing{display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
  gap:1px; background:var(--rule); border:1px solid var(--rule)}
.pr{background:var(--surface); padding:13px 15px}
.pr .k{font-family:var(--mono); font-size:10px; letter-spacing:.09em;
  text-transform:uppercase; color:var(--ink-faint); display:block; margin-bottom:5px}
.pr .v{font-family:var(--display); font-weight:700; font-size:1.15rem;
  font-variant-numeric:tabular-nums}

footer{border-top:2px solid var(--ink); margin-top:44px; padding-top:16px;
  font-family:var(--mono); font-size:10.5px; line-height:1.75; color:var(--ink-faint)}
footer a{color:var(--jade)}

/* ---------- site chrome (landing + generated pages) ---------- */
nav.top{display:flex; gap:24px; align-items:baseline; flex-wrap:wrap;
  font-family:var(--mono); font-size:11px; letter-spacing:.09em;
  text-transform:uppercase; margin-bottom:22px}
nav.top a{color:var(--ink-faint); text-decoration:none}
nav.top a:hover,nav.top a:focus{color:var(--jade); text-decoration:underline}
nav.top .home{font-family:var(--display); font-weight:700; font-size:15px;
  letter-spacing:.01em; text-transform:none; color:var(--ink)}

.crumb{font-family:var(--mono); font-size:10.5px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--ink-faint); margin-bottom:12px}
.crumb a{color:var(--ink-faint)}

.prose{max-width:66ch}
.prose p{margin:0 0 15px}
.prose h2{font-family:var(--display); font-weight:700; font-size:1.5rem;
  margin:34px 0 10px; line-height:1.15; text-wrap:balance}
.prose h3{margin:26px 0 8px}
.prose ul{margin:0 0 18px; padding-left:0; list-style:none}
.prose ul li{position:relative; padding-left:19px; margin-bottom:8px}
.prose ul li::before{content:"—"; position:absolute; left:0;
  color:var(--ink-faint); font-family:var(--mono); font-size:.8em}

.cards{display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr));
  gap:12px; margin:0 0 30px}
.card{background:var(--surface); border:1px solid var(--rule);
  padding:16px 18px; text-decoration:none; color:inherit; display:block}
.card:hover,.card:focus{background:var(--surface-2)}
.card .n{font-family:var(--display); font-weight:600; font-size:1rem;
  display:block; margin-bottom:5px; line-height:1.25}
.card .m{font-family:var(--mono); font-size:10px; letter-spacing:.06em;
  color:var(--ink-faint); display:block}
.card .flag{font-family:var(--mono); font-size:9.5px; letter-spacing:.09em;
  text-transform:uppercase; font-weight:600; padding:2px 6px; border-radius:2px;
  display:inline-block; margin-top:8px}
.f-ok{background:var(--jade-wash); color:var(--jade); border:1px solid var(--jade)}
.f-no{background:var(--seal-wash); color:var(--seal); border:1px solid var(--seal)}

.grouphead{font-family:var(--mono); font-size:10.5px; letter-spacing:.13em;
  text-transform:uppercase; color:var(--ink-faint); margin:34px 0 12px;
  padding-bottom:8px; border-bottom:1px solid var(--rule)}

/* ---------- lead form ---------- */
.lead{background:var(--surface); border:1px solid var(--rule);
  border-top:3px solid var(--jade); padding:24px; margin:34px 0}
.lead h2{font-family:var(--display); font-weight:700; font-size:1.35rem;
  margin:0 0 6px; line-height:1.15}
.lead p.sub{color:var(--ink-soft); font-size:.94rem; margin:0 0 18px; max-width:56ch}
.lead .row2{display:grid; grid-template-columns:1fr 1fr; gap:12px}
@media (max-width:560px){.lead .row2{grid-template-columns:1fr}}
button{font-family:var(--display); font-weight:700; font-size:.95rem;
  letter-spacing:.01em; background:var(--jade); color:#fff; border:0;
  border-radius:2px; padding:11px 22px; cursor:pointer}
button:hover{filter:brightness(1.1)}
button:focus{outline:2px solid var(--ink); outline-offset:2px}
button[disabled]{opacity:.55; cursor:default}
.formmsg{font-family:var(--mono); font-size:11.5px; margin-top:12px; line-height:1.6}
.formmsg.ok{color:var(--jade)} .formmsg.err{color:var(--seal)}
