.calculators-page { background:#080808; color:#f6f6f4; }
.calculator-hero { min-height:520px; padding:150px clamp(22px,5vw,76px) 72px; display:grid; align-items:end; position:relative; overflow:hidden; border-bottom:1px solid var(--line); background:linear-gradient(120deg,rgba(8,8,8,.94),rgba(17,17,19,.9)),url('pro-pounds-hero.webp') center/cover; }
.calculator-hero::after { content:''; position:absolute; inset:auto 0 0; height:42%; background:linear-gradient(0deg,#080808,transparent); pointer-events:none; }
.calculator-hero .hero-copy { width:min(780px,100%); padding:0; z-index:1; }
.calculator-hero h1 { margin:23px 0 20px; font-size:clamp(42px,6vw,82px); line-height:.95; letter-spacing:-3px; font-weight:900; }
.calculator-hero p { max-width:680px; color:#b8b8be; font-size:15px; line-height:1.8; }
.calculator-shell { width:min(1180px,calc(100% - 80px)); margin:0 auto; }
.calculator-section { padding:84px 0; }
.calculator-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.calculator-card { min-height:310px; padding:28px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:#0d0d0f; display:flex; flex-direction:column; gap:16px; transition:background .25s,border-color .25s,transform .25s; }
.calculator-card:hover,.calculator-card:focus-within { background:#131316; border-color:rgba(230,0,18,.45); transform:translateY(-2px); }
.calculator-card span,.calculator-kicker { color:#e60012; font-size:10px; font-weight:900; letter-spacing:1.5px; text-transform:uppercase; }
.calculator-card h2,.calculator-card h3 { font-size:24px; line-height:1.1; letter-spacing:-.5px; }
.calculator-card p,.calculator-copy p,.calculator-copy li,.calculator-note { color:#9d9da4; font-size:13px; line-height:1.75; }
.calculator-card a { margin-top:auto; min-height:44px; display:inline-flex; align-items:center; justify-content:space-between; gap:12px; color:#fff; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:1px; border-top:1px solid var(--line); padding-top:18px; }
.calculator-layout { display:grid; grid-template-columns:minmax(0,.95fr) minmax(360px,.7fr); gap:48px; align-items:start; }
.calculator-panel { border:1px solid var(--line); background:#101012; padding:28px; }
.calculator-form { display:grid; gap:18px; }
.field-group { display:grid; gap:8px; }
.field-group label { font-size:10px; font-weight:800; letter-spacing:1px; text-transform:uppercase; color:#d8d8dc; }
.field-group input,.field-group select { width:100%; min-height:52px; padding:0 14px; border:1px solid rgba(255,255,255,.14); border-radius:4px; background:#09090a; color:#fff; outline:0; }
.field-group input:focus,.field-group select:focus { border-color:#e60012; box-shadow:0 0 0 3px rgba(230,0,18,.14); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.calculator-submit { min-height:54px; border:0; border-radius:4px; background:#e60012; color:#fff; font-size:12px; font-weight:900; letter-spacing:1px; text-transform:uppercase; cursor:pointer; }
.calculator-error { min-height:18px; color:#ff7b86; font-size:12px; line-height:1.5; }
.result-card { margin-top:24px; padding:24px; border:1px solid rgba(230,0,18,.34); background:linear-gradient(145deg,rgba(230,0,18,.12),#111114 42%); }
.result-card[hidden] { display:none; }
.result-card h2 { font-size:18px; margin-bottom:18px; }
.result-list { display:grid; gap:13px; list-style:none; }
.result-list li { display:flex; align-items:center; justify-content:space-between; gap:18px; padding-bottom:13px; border-bottom:1px solid var(--line); color:#b6b6bc; font-size:13px; }
.result-list li:last-child { border-bottom:0; padding-bottom:0; }
.result-list strong { color:#fff; font-size:20px; text-align:right; }
.percentage-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.percentage-list li { min-height:44px; padding:10px 0; }
.calculator-copy { display:grid; gap:28px; }
.calculator-copy h2 { font-size:clamp(27px,3vw,42px); line-height:1.08; letter-spacing:-1.2px; }
.calculator-copy h3 { margin-bottom:10px; font-size:17px; }
.calculator-copy ul { padding-left:18px; }
.related-tools { display:flex; flex-wrap:wrap; gap:10px; margin-top:4px; }
.related-tools a { min-height:42px; display:inline-flex; align-items:center; padding:0 14px; border:1px solid var(--line); border-radius:4px; color:#dedee2; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.8px; }
.related-tools a:hover { border-color:#e60012; }
.calculator-footer-note { border-top:1px solid var(--line); padding-top:24px; }

@media (max-width:1024px) {
    .calculator-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .calculator-layout { grid-template-columns:1fr; }
}

@media (max-width:768px) {
    .calculator-shell { width:calc(100% - 32px); }
    .calculator-hero { min-height:470px; padding:126px 18px 54px; }
    .calculator-hero h1 { letter-spacing:-2px; }
    .calculator-grid,.form-row { grid-template-columns:1fr; }
    .calculator-section { padding:58px 0; }
    .calculator-card { min-height:250px; }
}

@media (max-width:430px) {
    .calculator-shell { width:calc(100% - 24px); }
    .calculator-hero h1 { font-size:clamp(36px,11vw,48px); letter-spacing:-1px; }
    .calculator-hero p,.calculator-copy p,.calculator-copy li,.calculator-note { font-size:12px; }
    .calculator-panel,.result-card { padding:20px; }
    .result-list li { display:grid; grid-template-columns:1fr; gap:4px; }
    .result-list strong { text-align:left; }
}
