#projectside-preview .cost-page .ps-hero{padding-bottom:60px}
#projectside-preview .cost-page .ps-hero h1{max-width:900px;font-size:clamp(36px,4.3vw,62px);line-height:1.1}
#projectside-preview .cost-body{padding-bottom:70px}
#projectside-preview .cost-section{padding:56px 0;border-top:1px solid var(--ps-line);scroll-margin-top:145px}
#projectside-preview .cost-section>p{max-width:850px}
#projectside-preview .cost-section h2{font-size:clamp(27px,3vw,40px);line-height:1.18;max-width:820px}
#projectside-preview .cost-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:30px}
#projectside-preview .cost-card{background:var(--ps-soft);border:1px solid var(--ps-line);border-top:3px solid var(--ps-accent);padding:30px;border-radius:8px}
#projectside-preview .cost-card h3{font-size:23px;line-height:1.25;margin:0 0 16px}
#projectside-preview .cost-card p{margin:0;font-size:17px}
#projectside-preview .cost-card a{color:var(--ps-ink);text-underline-offset:5px}
#projectside-preview .cost-section li{margin-block:12px;max-width:850px}
#projectside-preview .cost-faq details{background:var(--ps-soft);padding:22px 26px;border:1px solid var(--ps-line);border-radius:7px;margin-top:12px}
#projectside-preview .cost-faq summary,#projectside-preview .cost-assumptions summary{cursor:pointer;font-weight:700;line-height:1.5}
#projectside-preview .cost-faq details[open]{border-color:var(--ps-accent)}
#projectside-preview .cost-source{font-size:13px;color:var(--ps-muted);overflow-wrap:anywhere}
#projectside-preview .cost-tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start;margin:28px 0}
#projectside-preview .cost-panel{background:white;border:1px solid var(--ps-line);border-radius:10px;padding:30px;min-width:0}
#projectside-preview .cost-panel h2{font-size:28px}
#projectside-preview .cost-result{background:var(--ps-soft);border-top:3px solid var(--ps-accent)}
#projectside-preview .cost-fields{display:grid;grid-template-columns:1fr 1fr;gap:20px}
#projectside-preview #cost-hvac-fields .cost-fields>label{grid-column:1/-1}
#projectside-preview .cost-panel label{display:block;font-weight:700;font-size:14px;margin:0 0 18px;line-height:1.5}
#projectside-preview .cost-panel input,#projectside-preview .cost-panel select{display:block;width:100%;box-sizing:border-box;min-width:0;background:#fff;border:1px solid #929b94;border-radius:4px;min-height:48px;padding:10px;font:inherit;color:var(--ps-ink);margin-top:7px}
#projectside-preview .cost-panel fieldset{border:0;margin:22px 0;padding:0;min-width:0}
#projectside-preview .cost-panel legend{font-size:12px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:20px}
#projectside-preview .cost-panel [hidden]{display:none!important}
#projectside-preview .cost-modes{display:flex;flex-wrap:wrap;gap:10px}
#projectside-preview .cost-modes button{border:1px solid var(--ps-line);padding:14px 25px;background:var(--ps-soft);border-radius:5px;font:inherit;font-weight:700;cursor:pointer}
#projectside-preview .cost-modes button[aria-pressed=true]{background:var(--ps-ink);color:white;border-color:var(--ps-ink)}
#projectside-preview .cost-modes button:hover{box-shadow:0 3px 0 var(--ps-accent)}
#projectside-preview .cost-assumptions{border:1px solid var(--ps-line);border-radius:6px;padding:24px}
#projectside-preview .cost-number{font-size:clamp(26px,3vw,40px);letter-spacing:-.035em;font-weight:700;line-height:1.2;margin:20px 0 10px}
#projectside-preview .cost-result table{width:100%;border-collapse:collapse;font-size:14px}
#projectside-preview .cost-result td{padding:12px 4px;border-bottom:1px solid var(--ps-line);overflow-wrap:anywhere}
#projectside-preview .cost-result td:last-child{text-align:right}
#projectside-preview .cost-tool-notice{padding:18px 22px;background:var(--ps-soft);border-left:3px solid var(--ps-accent)}
#projectside-preview #cost-error,#projectside-preview #ac-error{color:#9e2510;font-weight:700}
#projectside-preview .cost-panel :focus-visible,#projectside-preview .cost-modes :focus-visible{outline:3px solid var(--ps-accent);outline-offset:3px}
@media(max-width:800px){#projectside-preview .cost-tool-grid{grid-template-columns:1fr}#projectside-preview .cost-grid{gap:16px}#projectside-preview .cost-card{padding:24px}}
@media(max-width:540px){#projectside-preview .cost-grid{grid-template-columns:1fr}#projectside-preview .cost-section{padding:38px 0}#projectside-preview .cost-panel{padding:22px}#projectside-preview .cost-fields{grid-template-columns:1fr;gap:0}#projectside-preview .cost-page .ps-hero h1{font-size:38px}#projectside-preview .cost-result table{font-size:12px}}
