:root { --accent:#28634b; --light:#e9f4e5; --charge-ink:#102e29; --charge-electric:#dcf988; }
body {background:#f7f8f1;color:var(--charge-ink)}
header {padding:19px clamp(20px,4vw,59px);background:#f7f8f1}
header .brand svg {color:#285b48}
.charge-hero {display:grid;grid-template-columns:1.05fr 1fr;align-items:stretch;gap:clamp(20px,4vw,72px);background:#133b36;color:white;padding:clamp(30px,4.4vw,66px);border-radius:24px;margin:0 20px}
.charge-lead {display:flex;align-items:flex-start;flex-direction:column;min-width:0}
.charge-label {text-transform:uppercase;font:700 .70rem/1.5 ui-monospace,monospace;letter-spacing:.12em;color:var(--accent);margin:0 0 18px}
.charge-lead .charge-label {color:#d5efa6}
.charge-hero h1 {font-weight:600;letter-spacing:-.07em;font-size:clamp(42px,5.65vw,80px);line-height:.99;color:white;margin:0}
.charge-hero h1 em {display:inline;color:var(--charge-electric);font-style:normal}
.charge-intro {font-size:clamp(.96rem,1.4vw,1.12rem);color:#e0eee6;max-width:39ch;line-height:1.55;margin:24px 0 12px}
.charge-locator {display:inline-flex;align-items:center;gap:14px;min-height:44px;color:white;font-weight:650;font-size:.88rem}
.charge-locator span {font-size:1.1rem;color:var(--charge-electric)}
.charge-drawing {margin-top:auto;padding-top:20px;width:min(100%,460px);color:#aacda7}
.charge-console {align-self:center;border-radius:18px;background:#f1f6e9;color:var(--charge-ink);padding:clamp(20px,2.55vw,35px);min-width:0}
.charge-readout {min-height:94px;border-bottom:1px solid #b7cbb7;margin:0 0 17px}
.charge-readout>span {font:650 .75rem/1.4 ui-monospace,monospace}
.charge-readout>div {display:flex;gap:12px;align-items:baseline;flex-wrap:wrap}
.charge-readout output {font-size:clamp(36px,4.2vw,65px);font-weight:650;line-height:1.15;letter-spacing:-.07em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.charge-unit {font-size:1.1rem;color:#45604e}
.charge-console label {display:block;font-size:.80rem;font-weight:700}
.charge-fields {display:grid;grid-template-columns:1fr 1.15fr;gap:12px}
.charge-entry {display:flex;align-items:center;min-width:0;background:white;border:1px solid #a8b9a8;border-radius:8px;padding:0 10px;margin:5px 0 13px;gap:4px}
.charge-entry:focus-within {outline:3px solid #237e5a;outline-offset:1px}
.charge-entry input {width:100%;min-width:0;border:0;outline:none;border-radius:6px;box-shadow:none;background:transparent;padding:11px 0;font:500 1rem/1.3 system-ui;color:var(--charge-ink)}
.charge-entry input:focus {outline:none;border:0}
.charge-entry>span {white-space:nowrap;font-size:.72rem;color:#506353}
.charge-calculate.button {width:100%;margin:1px 0 12px;display:flex;justify-content:space-between;background:#204d3f;border-color:#204d3f;color:white}
.charge-calculate.button:hover {background:#153d32}
.charge-total {font-size:.93rem;font-weight:660;line-height:1.45;color:#214a3b;margin:0 0 10px}
.charge-method {border:0;margin:0;padding:0}
.charge-method summary {min-height:36px;font-size:.75rem;cursor:pointer;display:list-item;color:#3b574b;padding:5px 0}
.charge-method p {font-size:.77rem;line-height:1.5;color:#3b574b;margin-bottom:0}
.charge-search {display:grid;grid-template-columns:1fr 1.15fr;align-items:start;gap:clamp(24px,5vw,80px);padding:clamp(40px,6vw,80px) clamp(24px,5vw,72px) 10px}
.charge-search .charge-label {margin-bottom:12px}
.charge-search h2 {font-size:clamp(29px,3.45vw,48px);font-weight:620;letter-spacing:-.055em;margin-bottom:12px}
.charge-search p:not(.charge-label) {font-size:.92rem;line-height:1.55}
.charge-search .finder {background:#fff;border-color:#c7d3c5}
.charge-search .city-examples {display:flex}
.charge-search .finder .micro {font-size:.72rem}
.directory-v4 .official-resources,.service-card,.quote {border-color:#cfdbc9}
@media(max-width:850px) {.charge-hero{gap:24px;padding:30px}.charge-fields{grid-template-columns:1fr}.charge-drawing{margin-top:24px}.charge-readout{min-height:75px}}
@media(max-width:690px) {header{padding:16px 19px}.charge-hero{grid-template-columns:1fr;margin:0 10px;padding:26px 18px 18px;gap:20px}.charge-hero h1{font-size:clamp(40px,8.8vw,56px)}.charge-intro{margin:14px 0 4px}.charge-drawing{display:none}.charge-label{margin-bottom:12px}.charge-fields{grid-template-columns:1fr 1.1fr}.charge-search{grid-template-columns:1fr;gap:12px}.charge-search .charge-label{margin-bottom:5px} .charge-search h2 br{display:none}.charge-console{padding:18px}.charge-search-form{min-width:0}}
@media(max-width:420px) {.charge-fields{grid-template-columns:1fr}.charge-hero h1{font-size:42px}.charge-hero h1 br:first-of-type{display:none}.charge-hero .charge-label,.charge-intro{margin-bottom:9px}}
@media print {.charge-hero,.charge-search{display:none}}
