/* Napelem Rendszer Tervező – shared styles
   Layout: tool-first. The planner is the hero; editorial pages use a 68ch reading column with a sticky CTA rail. */
:root{
  --paper:#F2F4F1; --surface:#FFFFFF; --ink:#16202A; --muted:#566370; --line:#D5DBD4; --line-2:#E6EAE5;
  --sun:#F2A30F; --sun-ink:#8F5600; --sun-soft:#FDF0D5;
  --cell:#1E3A5F; --cell-soft:#E3EAF3;
  --ok:#2E7A4E; --warn:#A8660A; --bad:#B23A2E;
  --f-display:"Archivo", "Arial Narrow", system-ui, sans-serif;
  --f-body:"Source Sans 3", "Segoe UI", system-ui, sans-serif;
  --f-mono:"IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --r:6px; --shadow:0 1px 2px rgba(22,32,42,.06),0 8px 24px rgba(22,32,42,.06);
  --maxw:1240px;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --paper:#0E141A; --surface:#151D25; --ink:#E7ECEF; --muted:#9AA7B2; --line:#2A3540; --line-2:#202A33;
  --sun:#F5B630; --sun-ink:#F5C25A; --sun-soft:#2B2414;
  --cell:#8FB6E0; --cell-soft:#1B2836; --ok:#5DBB86; --warn:#E3A048; --bad:#E47B6E;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.25); color-scheme:dark}}
:root[data-theme="dark"]{
  --paper:#0E141A; --surface:#151D25; --ink:#E7ECEF; --muted:#9AA7B2; --line:#2A3540; --line-2:#202A33;
  --sun:#F5B630; --sun-ink:#F5C25A; --sun-soft:#2B2414;
  --cell:#8FB6E0; --cell-soft:#1B2836; --ok:#5DBB86; --warn:#E3A048; --bad:#E47B6E;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.25); color-scheme:dark}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{background:var(--paper);color:var(--ink);font:16px/1.6 var(--f-body);margin:0}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--surface)}
a{color:inherit}
.wrap{max-width:var(--maxw);margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
h1,h2,h3{font-family:var(--f-display);font-stretch:112%;line-height:1.12;text-wrap:balance;margin:0;letter-spacing:-.01em}
h1{font-size:clamp(1.9rem,3.6vw,2.9rem);font-weight:800}
h2{font-size:clamp(1.45rem,2.4vw,1.95rem);font-weight:750}
h3{font-size:1.15rem;font-weight:700}
.eyebrow{font:600 .74rem/1.2 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--sun-ink)}
.num{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
:focus-visible{outline:2px solid var(--sun);outline-offset:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* header */
.site-head{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.site-head .wrap{display:flex;align-items:center;gap:20px;min-height:60px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font:800 1.02rem/1 var(--f-display);font-stretch:112%;white-space:nowrap}
.brand svg{flex:none}
.brand small{display:block;font:500 .66rem/1.2 var(--f-mono);letter-spacing:.06em;color:var(--muted);text-transform:uppercase;margin-top:3px}
.nav{display:flex;gap:4px;margin-left:auto;align-items:center}
.nav a{text-decoration:none;padding:8px 12px;border-radius:var(--r);font-weight:600;color:var(--muted)}
.nav a:hover{color:var(--ink);background:var(--line-2)}
.nav a[aria-current="page"]{color:var(--ink)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:700 .95rem/1 var(--f-body);padding:12px 18px;border-radius:var(--r);border:1px solid transparent;cursor:pointer;text-decoration:none;transition:transform .12s,background .12s}
.btn:active{transform:translateY(1px)}
.btn-sun{background:var(--sun);color:#1A1203}
.btn-sun:hover{background:color-mix(in srgb,var(--sun) 88%,#fff)}
.btn-ink{background:var(--ink);color:var(--paper)}
.btn-line{background:transparent;border-color:var(--line);color:var(--ink)}
.btn-line:hover{border-color:var(--muted)}
.nav .btn{padding:10px 14px;color:#1A1203}
@media (max-width:760px){.nav a:not(.btn){display:none}.brand small{display:none}.nav .btn{display:none}}

/* footer */
.site-foot{border-top:1px solid var(--line);margin-top:72px;background:var(--surface)}
.site-foot .wrap{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:32px;padding-block:40px}
.site-foot h4{font:600 .74rem/1.2 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 12px}
.site-foot ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.site-foot a{text-decoration:none;color:var(--muted)} .site-foot a:hover{color:var(--ink)}
.site-foot p{margin:0 0 8px;color:var(--muted);font-size:.92rem}
.foot-base{border-top:1px solid var(--line);padding-block:16px;color:var(--muted);font-size:.85rem}
@media (max-width:820px){.site-foot .wrap{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.site-foot .wrap{grid-template-columns:1fr}}

/* ---------- PLANNER ---------- */
.tool-intro{padding-block:28px 18px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px 32px;align-items:end}
.tool-intro p{margin:8px 0 0;color:var(--muted);max-width:62ch;font-size:1.06rem}
.facts{display:flex;gap:18px;flex-wrap:wrap;list-style:none;margin:0;padding:0;font:500 .82rem/1.3 var(--f-mono);color:var(--muted)}
.facts li{display:flex;gap:6px;align-items:center}
.facts li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--sun)}
@media (max-width:820px){.tool-intro{grid-template-columns:1fr}}

.planner{display:grid;grid-template-columns:380px minmax(0,1fr);border:1px solid var(--line);border-radius:10px;background:var(--surface);box-shadow:var(--shadow);overflow:hidden}
@media (max-width:980px){.planner{grid-template-columns:1fr}}
.ctrl{border-right:1px solid var(--line);display:flex;flex-direction:column;min-width:0}
@media (max-width:980px){.ctrl{border-right:0;border-top:1px solid var(--line);order:2}}
.steps{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}
.steps button{all:unset;cursor:pointer;padding:12px 6px 10px;text-align:center;font:600 .78rem/1.2 var(--f-body);color:var(--muted);border-bottom:2px solid transparent;display:grid;gap:3px}
.steps button b{font:600 .68rem/1 var(--f-mono);color:var(--muted)}
.steps button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--sun)}
.steps button[aria-selected="true"] b{color:var(--sun-ink)}
.steps button:focus-visible{outline:2px solid var(--sun);outline-offset:-2px}
.pane{padding:18px;display:grid;gap:16px;align-content:start;overflow:auto;max-height:640px}
@media (max-width:980px){.pane{max-height:none}}
.field{display:grid;gap:6px}
.field>label,.field>.lbl{font-weight:650;font-size:.92rem;display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.field output,.field .val{font:600 .86rem/1 var(--f-mono);color:var(--sun-ink);font-variant-numeric:tabular-nums}
.hint{font-size:.82rem;color:var(--muted);margin:0;line-height:1.45}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
input[type=number],input[type=text],input[type=email],input[type=tel],select,textarea{width:100%;font:inherit;font-size:.95rem;padding:9px 11px;border:1px solid var(--line);border-radius:var(--r);background:var(--paper);color:var(--ink)}
input[type=number]{font-family:var(--f-mono)}
input:focus,select:focus,textarea:focus{outline:2px solid color-mix(in srgb,var(--sun) 60%,transparent);border-color:var(--sun)}
input[type=range]{width:100%;accent-color:var(--sun)}
.seg{display:flex;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;flex-wrap:wrap}
.seg label{flex:1 1 0;min-width:70px;position:relative}
.seg input{position:absolute;opacity:0;inset:0;cursor:pointer}
.seg span{display:block;text-align:center;padding:8px 6px;font-size:.84rem;font-weight:600;color:var(--muted);border-right:1px solid var(--line)}
.seg label:last-child span{border-right:0}
.seg input:checked+span{background:var(--ink);color:var(--paper)}
.seg input:focus-visible+span{outline:2px solid var(--sun);outline-offset:-2px}
.checks{display:grid;gap:8px}
.check{display:flex;gap:10px;align-items:flex-start;font-size:.9rem;cursor:pointer}
.check input{margin-top:4px;accent-color:var(--sun);width:16px;height:16px;flex:none}
.check small{display:block;color:var(--muted);font-size:.8rem}
.pane-foot{margin-top:auto;padding:14px 18px;border-top:1px solid var(--line);display:flex;gap:10px;justify-content:space-between}
.pane-foot .btn{padding:10px 14px}
.compass-row{display:grid;grid-template-columns:72px 1fr;gap:12px;align-items:center}
.compass{width:72px;height:72px}

.stage{position:relative;min-width:0;display:flex;flex-direction:column;background:#CFE0EC}
.view3d{position:relative;flex:1;min-height:520px;max-height:760px;touch-action:none}
@media (max-width:980px){.view3d{min-height:380px}}
.view3d canvas{display:block;width:100%!important;height:100%!important;position:absolute;inset:0;cursor:grab}
.view3d canvas:active{cursor:grabbing}
.nogl{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:24px;color:#16202A;font-weight:600}
.hud{position:absolute;left:12px;top:12px;display:flex;gap:6px;flex-wrap:wrap;z-index:2}
.hud button{all:unset;cursor:pointer;background:rgba(255,255,255,.88);color:#16202A;font:600 .78rem/1 var(--f-body);padding:8px 10px;border-radius:5px;box-shadow:0 1px 3px rgba(0,0,0,.15)}
.hud button:hover{background:#fff}
.hud button[aria-pressed="true"]{background:#16202A;color:#fff}
.hud button:focus-visible{outline:2px solid var(--sun)}
.sunbar{position:absolute;left:12px;right:12px;bottom:12px;z-index:2;display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;gap:10px;align-items:center;background:rgba(255,255,255,.9);color:#16202A;border-radius:6px;padding:8px 12px;box-shadow:0 1px 3px rgba(0,0,0,.15);font-size:.82rem}
.sunbar select{width:auto;padding:5px 8px;font-size:.82rem;background:#fff;color:#16202A;border-color:#cfd6cf}
.sunbar input{accent-color:#E59400}
.sunbar .num{font-size:.82rem;min-width:44px;text-align:right}
.sunbar button{all:unset;cursor:pointer;font-weight:700;padding:4px 6px}
@media (max-width:560px){.sunbar{grid-template-columns:auto minmax(0,1fr) auto}.sunbar select{display:none}}
.legend{position:absolute;right:12px;top:12px;z-index:2;background:rgba(255,255,255,.88);color:#16202A;border-radius:5px;padding:8px 10px;font-size:.75rem;display:grid;gap:4px;box-shadow:0 1px 3px rgba(0,0,0,.15)}
.legend i{display:inline-block;width:12px;height:12px;border-radius:2px;margin-right:6px;vertical-align:-2px}
@media (max-width:560px){.legend{display:none}}
.tip3d{position:absolute;z-index:3;pointer-events:none;background:#16202A;color:#fff;font:500 .74rem/1.3 var(--f-mono);padding:6px 8px;border-radius:4px;transform:translate(-50%,-130%);white-space:nowrap}

.kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid var(--line);background:var(--surface)}
.kpi{padding:14px 16px;border-right:1px solid var(--line);min-width:0}
.kpi:last-child{border-right:0}
.kpi .k{font:600 .68rem/1.2 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.kpi .v{font:800 1.5rem/1.15 var(--f-display);font-stretch:108%;margin-top:6px;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpi .s{font-size:.8rem;color:var(--muted);margin-top:2px}
.kpi.hl{background:var(--sun-soft)}
.kpi.hl .v{color:var(--ink)}
@media (max-width:1100px){.kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.kpi:nth-child(3){border-right:0}.kpi:nth-child(n+4){border-top:1px solid var(--line)}}
@media (max-width:560px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.kpi{border-right:1px solid var(--line)!important;border-top:1px solid var(--line)}.kpi:nth-child(2n){border-right:0!important}.kpi:nth-child(-n+2){border-top:0}.kpi.hl{grid-column:1/-1}}

.notes{display:grid;gap:8px;padding:12px 18px;border-top:1px solid var(--line);background:var(--surface)}
.note{font-size:.86rem;padding:8px 10px;border-radius:var(--r);border:1px solid var(--line);display:flex;gap:8px}
.note b{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;padding-top:2px}
.note.warn{border-color:color-mix(in srgb,var(--warn) 45%,var(--line));background:color-mix(in srgb,var(--warn) 8%,var(--surface))}
.note.warn b{color:var(--warn)}
.note.info b{color:var(--cell)}

/* results */
.results{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:24px;margin-top:28px}
@media (max-width:980px){.results{grid-template-columns:1fr}}
.card{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:22px;min-width:0}
.card h2{font-size:1.35rem}
.card-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-end;flex-wrap:wrap;margin-bottom:14px}
.tbl-wrap{overflow-x:auto}
table.bom{width:100%;border-collapse:collapse;font-size:.92rem}
.bom th,.bom td{padding:9px 8px;border-bottom:1px solid var(--line-2);text-align:left;vertical-align:top}
.bom th{font:600 .7rem/1.2 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line)}
.bom td.r,.bom th.r{text-align:right;white-space:nowrap;font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.bom td small{display:block;color:var(--muted);font-size:.8rem}
.bom tfoot td{border-bottom:0;font-weight:700}
.bom td.r,.bom th.r{min-width:0}
@media (max-width:600px){.bom .net{display:none}}
.bom tfoot tr.total td{font-size:1.1rem;border-top:2px solid var(--ink);padding-top:12px}
.bom tr.sub td{color:var(--ok)}
.chart{width:100%;height:auto;display:block}
.chart text{fill:var(--muted);font:500 11px var(--f-mono)}
.chart .axis{stroke:var(--line)}
.legend-inline{display:flex;gap:14px;flex-wrap:wrap;font-size:.8rem;color:var(--muted)}
.legend-inline i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}
.assum{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px}
@media (max-width:640px){.assum{grid-template-columns:1fr}}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.status{font-size:.88rem;margin-top:10px;min-height:1.2em}
.status.ok{color:var(--ok)} .status.err{color:var(--bad)}

/* quote */
.quote{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:32px;margin-top:56px;align-items:start}
@media (max-width:900px){.quote{grid-template-columns:1fr}}
.quote-side{display:grid;gap:14px}
.quote-side p{margin:0;color:var(--muted)}
.summary-box{border:1px dashed var(--line);border-radius:var(--r);padding:12px 14px;font:500 .84rem/1.6 var(--f-mono);color:var(--muted);background:var(--paper)}
form.lead{display:grid;gap:14px}
form.lead .row2{gap:14px}
@media (max-width:520px){form.lead .row2{grid-template-columns:1fr}}

/* sections */
.section{margin-top:72px}
.section-head{display:grid;gap:8px;margin-bottom:22px;max-width:70ch}
.section-head p{margin:0;color:var(--muted)}
.howto{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1px solid var(--line)}
.howto li{list-style:none;padding:18px 18px 0 0;border-right:1px solid var(--line-2);margin-right:18px}
.howto li:last-child{border-right:0}
.howto b{font:600 .72rem/1 var(--f-mono);color:var(--sun-ink);display:block;margin-bottom:10px}
.howto p{margin:6px 0 0;color:var(--muted);font-size:.93rem}
@media (max-width:820px){.howto{grid-template-columns:1fr 1fr;row-gap:18px}.howto li:nth-child(2n){border-right:0}}
@media (max-width:480px){.howto{grid-template-columns:1fr}.howto li{border-right:0}}
.method{columns:2 320px;column-gap:40px;color:var(--muted);font-size:.95rem}
.method p{margin:0 0 12px;break-inside:avoid}
.method strong{color:var(--ink)}
.faq{display:grid;gap:0;border-top:1px solid var(--line);max-width:860px}
.faq details{border-bottom:1px solid var(--line);padding:16px 0}
.faq summary{cursor:pointer;font-weight:700;font-size:1.04rem;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::after{content:"+";font:600 1.2rem/1 var(--f-mono);color:var(--sun-ink)}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:10px 0 0;color:var(--muted);max-width:70ch}

/* article cards */
.grid-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:900px){.grid-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.grid-cards{grid-template-columns:1fr}}
.acard{display:flex;flex-direction:column;gap:8px;padding:18px;border:1px solid var(--line);border-radius:10px;background:var(--surface);text-decoration:none;min-width:0;transition:border-color .15s}
.acard:hover{border-color:var(--sun)}
.acard h3{font-size:1.06rem}
.acard p{margin:0;color:var(--muted);font-size:.9rem}
.acard .meta{margin-top:auto;padding-top:8px;font:500 .74rem/1 var(--f-mono);color:var(--muted)}
.cat-filter{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.cat-filter button{all:unset;cursor:pointer;padding:7px 12px;border:1px solid var(--line);border-radius:999px;font-size:.86rem;font-weight:600;color:var(--muted)}
.cat-filter button[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}

/* article page */
.crumbs{font:500 .8rem/1.4 var(--f-mono);color:var(--muted);padding-top:22px}
.crumbs a{text-decoration:none} .crumbs a:hover{color:var(--ink)}
.art-head{padding-block:18px 26px;max-width:860px}
.art-head .lead{font-size:1.18rem;color:var(--muted);margin:14px 0 0;max-width:62ch}
.art-meta{display:flex;gap:14px;flex-wrap:wrap;font:500 .78rem/1 var(--f-mono);color:var(--muted);margin-top:16px}
.art-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:48px;align-items:start}
@media (max-width:980px){.art-layout{grid-template-columns:1fr}}
.prose{max-width:68ch;font-size:1.07rem;min-width:0}
.prose h2{margin:40px 0 12px}
.prose h3{margin:28px 0 8px}
.prose p{margin:0 0 16px}
.prose ul,.prose ol{padding-left:22px;margin:0 0 16px}
.prose li{margin-bottom:6px}
.prose a{color:var(--ink);text-decoration-color:var(--sun);text-decoration-thickness:2px;text-underline-offset:3px}
.prose table{width:100%;border-collapse:collapse;font-size:.94rem;margin:8px 0 22px;display:block;overflow-x:auto}
.prose th,.prose td{padding:9px 10px;border-bottom:1px solid var(--line);text-align:left}
.prose th{font:600 .72rem/1.2 var(--f-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.prose blockquote.tip{margin:0 0 18px;padding:14px 16px;border-left:3px solid var(--sun);background:var(--sun-soft);border-radius:0 var(--r) var(--r) 0}
.prose blockquote.tip p:last-child{margin:0}
.toc{border:1px solid var(--line);border-radius:10px;padding:14px 16px;margin:0 0 26px;background:var(--surface)}
.toc b{font:600 .72rem/1 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.toc ol{margin:10px 0 0;padding-left:20px;font-size:.95rem}
.toc a{text-decoration:none}.toc a:hover{text-decoration:underline}
.cta-box{margin:28px 0 30px;padding:20px;border-radius:10px;background:var(--ink);color:var(--paper);display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;align-items:center}
.cta-box h3{color:var(--paper);font-size:1.15rem}
.cta-box p{margin:4px 0 0!important;color:color-mix(in srgb,var(--paper) 75%,transparent);font-size:.95rem}
.cta-box .btn{grid-column:1/-1;justify-self:start}
.cta-box svg{flex:none}
.rail{position:sticky;top:84px;display:grid;gap:16px}
.rail-cta{border:1px solid var(--line);border-radius:10px;padding:18px;background:var(--surface);display:grid;gap:10px}
.rail-cta p{margin:0;color:var(--muted);font-size:.92rem}
.rail-cta ul{margin:0;padding-left:18px;color:var(--muted);font-size:.88rem}
.rail-list{display:grid;gap:8px;font-size:.92rem}
.rail-list a{text-decoration:none;color:var(--muted)}.rail-list a:hover{color:var(--ink)}
@media (max-width:980px){.rail{position:static}}
.end-cta{margin-top:48px;border-radius:12px;padding:28px;background:var(--sun-soft);border:1px solid color-mix(in srgb,var(--sun) 35%,var(--line));display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center}
.end-cta p{margin:6px 0 0;color:var(--muted)}
@media (max-width:640px){.end-cta{grid-template-columns:1fr}}
.mob-cta{position:fixed;left:0;right:0;bottom:0;z-index:40;display:none;padding:10px max(16px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));background:var(--surface);border-top:1px solid var(--line)}
.mob-cta .btn{width:100%}
@media (max-width:760px){.mob-cta{display:block}body.has-mob-cta{padding-bottom:72px}}
.legal{max-width:76ch}
.legal h2{margin:32px 0 10px;font-size:1.3rem}
.legal p,.legal li{color:var(--muted)}
.legal .fill{background:var(--sun-soft);padding:0 4px;border-radius:3px;color:var(--ink)}

/* pdf sheet (off-screen render target) */
.pdf-host{position:fixed;left:-10000px;top:0;width:794px;pointer-events:none}
.sheet{width:794px;height:1123px;background:#fff;color:#16202A;padding:48px 52px;font:13px/1.5 "Source Sans 3",Arial,sans-serif;position:relative;overflow:hidden}
.sheet h1{font:800 26px/1.15 "Archivo",Arial,sans-serif;font-stretch:112%;margin:0}
.sheet h2{font:700 15px/1.2 "Archivo",Arial,sans-serif;margin:22px 0 8px;letter-spacing:0}
.sheet .top{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:2px solid #16202A;padding-bottom:14px;margin-bottom:18px}
.sheet .top .id{font:500 11px/1.5 "IBM Plex Mono",monospace;text-align:right;color:#566370}
.sheet img.shot{width:100%;height:330px;object-fit:cover;border-radius:6px;display:block}
.sheet .k4{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid #D5DBD4;border-radius:6px;margin-top:14px}
.sheet .k4 div{padding:10px 12px;border-right:1px solid #D5DBD4}
.sheet .k4 div:last-child{border-right:0}
.sheet .k4 span{display:block;font:600 9.5px/1.2 "IBM Plex Mono",monospace;letter-spacing:.06em;text-transform:uppercase;color:#566370}
.sheet .k4 b{display:block;font:800 18px/1.2 "Archivo",Arial,sans-serif;margin-top:4px}
.sheet table{width:100%;border-collapse:collapse;font-size:12px}
.sheet td,.sheet th{padding:6px 6px;border-bottom:1px solid #E6EAE5;text-align:left}
.sheet th{font:600 9.5px/1.2 "IBM Plex Mono",monospace;letter-spacing:.05em;text-transform:uppercase;color:#566370}
.sheet td.r,.sheet th.r{text-align:right;font-family:"IBM Plex Mono",monospace;white-space:nowrap}
.sheet tr.total td{border-top:2px solid #16202A;font-weight:800;font-size:14px}
.sheet .foot{position:absolute;left:52px;right:52px;bottom:30px;border-top:1px solid #D5DBD4;padding-top:10px;font-size:10.5px;color:#566370;display:flex;justify-content:space-between;gap:20px}
.sheet .two{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.sheet .small{font-size:11px;color:#566370}
.sheet .cta{margin-top:16px;background:#FDF0D5;border:1px solid #F2C46B;border-radius:6px;padding:12px 14px;font-size:12.5px}

/* county comparison */
.chart-box{border:1px solid var(--line);border-radius:10px;background:var(--surface);padding:14px 12px 8px;margin:6px 0 10px}
.chart-box a text{cursor:pointer}
.chart-box a:hover circle{fill:var(--sun-ink)}
.county-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:8px 0 24px}
@media (max-width:760px){.county-list{grid-template-columns:1fr}}
.county{border:1px solid var(--line);border-radius:10px;background:var(--surface);padding:16px 18px;display:grid;gap:12px;align-content:start;scroll-margin-top:84px;min-width:0}
.county:target{border-color:var(--sun);box-shadow:0 0 0 3px color-mix(in srgb,var(--sun) 25%,transparent)}
.county-head{display:grid;gap:2px}
.county-head h3{margin:0!important;font-size:1.08rem}
.county-kv{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px;margin:0}
.county-kv div{min-width:0}
.county-kv dt{font:600 .68rem/1.25 var(--f-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.county-kv dd{margin:2px 0 0;font-weight:700;font-size:.98rem}
.county .btn{justify-self:start;padding:9px 12px;font-size:.88rem}
.county-strip{display:flex;flex-wrap:wrap;gap:8px}
.county-strip a{padding:7px 12px;border:1px solid var(--line);border-radius:999px;text-decoration:none;font-size:.9rem;color:var(--muted);background:var(--surface)}
.county-strip a:hover{border-color:var(--sun);color:var(--ink)}
