.page-calculator{background:#f3f7fb;color:#102c3e;--cyan:#75e3fa;--yellow:#e8f8ff;font-family:'DM Sans',sans-serif}
.page-calculator header{padding:0;background:#fff;color:#102c3e}.page-calculator .nav{max-width:1240px}.page-calculator .nav a{text-transform:none;letter-spacing:normal}.page-calculator .brand img{width:225px}.page-calculator .brand>span{font-size:10px;letter-spacing:.16em}
.calculator-intro{padding:66px max(40px,calc((100vw - 1160px)/2)) 72px;grid-template-columns:1.25fr .75fr;gap:60px;background:radial-gradient(ellipse at 100% 0%,#087cb066,transparent 65%),linear-gradient(120deg,#071f43,#0a3760);position:relative}
.calculator-intro:after{content:'';position:absolute;bottom:0;left:0;right:0;height:4px;background:var(--spectrum)}
.calculator-intro .eyebrow{color:#9feaff;font-size:11px;letter-spacing:.14em;margin-bottom:22px}.calculator-intro h1{font-family:inherit;font-size:clamp(38px,4.2vw,60px);line-height:1.08;letter-spacing:-.045em;font-weight:750}.calculator-intro h1 em{font-style:normal;color:#75e3fa}.calculator-intro>p{font-size:17px;line-height:1.7;color:#d2e5f5}
.calculator-workspace{max-width:1240px;padding:48px 40px 64px;gap:32px;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
.calculator-fields{gap:24px}.calculator-preset{border:1px solid #c9e6f2;border-radius:14px;background:#e9f8ff;padding:22px;gap:7px}.calculator-preset strong{font-weight:700}.calculator-preset span{font-weight:400;line-height:1.65;color:#536774}.calculator-preset a{font-weight:600;color:#005ab8}
.calculator-fields fieldset{border:1px solid #d8e4ef;border-radius:16px;box-shadow:0 6px 24px #08265005;padding:24px;background:#fff;border-top:4px solid #00a6d9}.calculator-fields fieldset:nth-of-type(2){border-top-color:#f88021}.calculator-fields fieldset:nth-of-type(3){border-top-color:#e82786}.calculator-fields fieldset:nth-of-type(4){border-top-color:#7674c6}.calculator-fields legend{font-weight:700;font-size:18px;letter-spacing:-.02em;color:#102c3e;padding:0 8px}
.calc-field-grid{gap:18px}.calc-field{font-weight:600;font-size:13px}.calc-field small{font-weight:400;font-size:11px;line-height:1.5;margin-top:3px}.calc-field input:not([type=range]),.calc-field select{border:1px solid #bdcddd;border-radius:8px;background:#f8fbff;min-height:48px;font-weight:500;font-size:15px}.calc-field input[readonly]{background:#edf5fa;border-color:#d9e6ef;color:#536774;font-weight:600}.calc-field input:focus-visible,.calc-field select:focus-visible{outline:3px solid #48c9eb55;outline-offset:2px;border-color:#007ead}.calc-range{accent-color:#007ead}.water-reading{border-left:3px solid #66cfe9;background:#eff8fc;border-radius:6px;font-size:11px}.water-reading strong{font-weight:600}.appliance-comparison{border:1px solid #d8e5ef;border-radius:10px;background:#f3f8fc;overflow:hidden}.appliance-comparison span{font-weight:600;font-size:10px}.appliance-comparison strong{color:#075db8}.appliance-life-note{line-height:1.7}
.calculator-results{top:110px;padding:30px;border:1px solid #164a73;border-top:4px solid #75e3fa;border-radius:18px;background:radial-gradient(ellipse at 0% 100%,#65429355,transparent 65%),linear-gradient(140deg,#0b2853,#084b75);color:white;box-shadow:0 18px 42px #08265018}.calculator-results>.eyebrow{color:#9ae9fa;font-size:10px;letter-spacing:.15em}.calculator-results h2>span{font-size:clamp(56px,5.6vw,82px);letter-spacing:-.06em;line-height:1.05;color:#8beaff;font-weight:750;font-variant-numeric:tabular-nums}.calculator-results h2 small{color:#dcecf6;font-size:14px;font-weight:450;line-height:1.6}.result-metrics{border-block:1px solid #ffffff25;margin-bottom:25px}.result-metrics div{padding:16px 10px}.result-metrics div+div{border-color:#ffffff25}.result-metrics span{font-size:9px;font-weight:600;min-height:30px;color:#bdd5e7}.result-metrics strong{font-size:19px;color:#fff}.savings-breakdown h3{font-size:15px;font-weight:600}.breakdown-row>div{font-size:12px;color:#dceaf5}.breakdown-row strong{color:white}.breakdown-row i{border-radius:10px;background:#ffffff14;height:6px}.breakdown-row i b{border-radius:10px;background:#69d9f2}.breakdown-row:nth-of-type(2) i b{background:#f89751}.breakdown-row:nth-of-type(3) i b{background:#ee70a7}.breakdown-row:nth-of-type(5) i b{background:#b19be5}.result-boundary{background:#ffffff0c;border:1px solid #ffffff20;border-radius:10px;padding:15px}.result-boundary strong{font-size:12px;color:#e6f3fc}.result-boundary p{color:#c3d8e9;font-size:11px;line-height:1.7}.calculator-cta{display:flex;justify-content:space-between;width:100%;background:#75e3fa;color:#072a50;border:0;box-shadow:none;font-size:13px;padding:15px 18px;letter-spacing:normal;text-transform:none}.calculator-cta:hover{background:#a5eeff}.calculator-cta span{font-size:23px;line-height:1}
.calculator-method{padding:0 40px 64px;max-width:1240px;margin:auto;background:transparent}.method-disclosure{border:1px solid #d8e4ef;border-radius:14px;overflow:hidden;background:white}.method-disclosure summary{font-weight:650;font-size:16px;padding:22px}.method-disclosure summary:after{background:#e4f3fb;color:#007ead}.method-disclosure summary small{font-weight:400;font-size:12px}.method-grid strong{font-size:15px;font-weight:650}.method-grid p{font-size:13px;line-height:1.75}.calculator-sources{font-size:11px;line-height:1.8}.page-calculator footer{padding:35px 0;background:white;border-top:1px solid #dce5e9;text-align:left}.page-calculator .footer-row{font-size:13px}
@media(max-width:1000px){.calculator-workspace{grid-template-columns:1fr 1fr;gap:20px;padding-inline:24px}.calculator-results{padding:24px}.calculator-intro{padding-inline:32px;gap:30px}.page-calculator .brand>span{display:none}}
@media(max-width:760px){.calculator-intro{grid-template-columns:1fr;gap:20px;padding:42px 24px}.calculator-intro h1{font-size:40px}.calculator-intro>p{font-size:15px}.calculator-workspace{grid-template-columns:1fr;padding:28px 20px 36px}.calculator-results{position:static}.calculator-fields fieldset{padding:20px}.calculator-method{padding:0 20px 40px}.method-disclosure summary{flex-wrap:wrap;gap:8px}.method-disclosure summary small{margin-left:0}.method-disclosure summary:after{margin-left:auto}.result-metrics{grid-template-columns:repeat(3,1fr)}.result-metrics div+div{border-top:0;border-left:1px solid #ffffff25}.result-metrics span{min-height:25px}.page-calculator .brand img{width:185px}.page-calculator .nav{padding-inline:20px}.page-calculator .footer-row{gap:20px}.calculator-intro .eyebrow{font-size:9px}}

.method-disclosure summary>span{font-size:16px;font-weight:650;color:#102c3e;transform:none}.method-disclosure .calculator-sources{max-width:none;margin:0}

/* Comfortable entry on phones; keep desktop comparison columns intact. */
@media(max-width:760px){
 .calculator-fields input,.calculator-fields select{font-size:16px;min-height:44px;max-width:100%}
 .calculator-fields input[type=range]{min-height:44px;touch-action:pan-y}
 .calculator-intro h1{font-size:clamp(32px,9.5vw,40px)}
 .method-grid{grid-template-columns:1fr}
 .page-calculator .nav nav{justify-content:space-between}
 .page-calculator footer{padding-bottom:32px}
}
@media(max-width:360px){
 .calculator-workspace{padding-inline:16px}.calculator-fields fieldset,.calculator-results{padding:18px}
 .result-metrics div{padding-inline:5px}.result-metrics strong{font-size:17px}
}