/* ---------- savings calculator ---------- */

.calc-top{display:flex;justify-content:center;margin-bottom:28px}
.calc-pick{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%;max-width:620px}
.calc-pick .seg{width:100%}
.calc-pick .lbl,.fee .lbl,.calc-returns label{font-family:var(--head);font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:#b9c5be}
.seg{display:flex;border:1px solid var(--line-2);background:#0b0e0c}
.seg button{flex:1;background:transparent;border:0;padding:13px 10px;font-family:var(--head);letter-spacing:.1em;text-transform:uppercase;font-size:14px;color:#c9d3cd;cursor:pointer;transition:background .15s,color .15s}
.seg button+button{border-left:1px solid var(--line-2)}
.seg button[aria-selected=true]{background:linear-gradient(135deg,var(--lime),var(--green-400));color:#061006;font-weight:700}

.calc-compare{display:grid;grid-template-columns:1fr 64px 1fr;align-items:stretch}
.calc-vs{display:flex;align-items:center;justify-content:center;font-family:var(--head);font-size:22px;color:var(--steel);letter-spacing:.1em}
.calc-card{background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line);padding:28px;clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,22px 100%,0 calc(100% - 22px))}
.calc-card.ours{border-color:var(--green-700);background:linear-gradient(180deg,rgba(29,107,26,.28),var(--panel))}
.calc-card-head{display:flex;flex-direction:column;gap:4px;margin-bottom:18px}
.calc-card-head small{color:var(--muted);font-size:14px}
.tag{font-family:var(--head);text-transform:uppercase;letter-spacing:.14em;font-size:15px;font-weight:600}
.tag.lime{color:var(--lime)}
.fee{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}
.fee label,.fee .lbl{font-family:var(--head);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#c9d3cd;display:flex;flex-direction:column}
.fee label small,.fee .lbl small{font-family:var(--body);letter-spacing:0;text-transform:none;color:var(--muted);font-size:13px}
.money{display:flex;align-items:center;background:#0b0e0c;border:1px solid var(--line-2);width:140px;flex:none;transition:border-color .15s,box-shadow .15s}
.money:focus-within{border-color:var(--lime);box-shadow:0 0 0 3px rgba(143,212,55,.15)}
.money span{padding:0 0 0 12px;color:var(--muted)}
.money input{background:transparent;border:0;outline:none;padding:11px 12px 11px 6px;width:100%;text-align:right;font-weight:600;font-size:17px}
.fixed{font-family:var(--head);font-size:22px;color:#fff}
.calc-total{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-top:18px}
.calc-total span{font-family:var(--head);text-transform:uppercase;letter-spacing:.14em;font-size:13px;color:var(--muted)}
.calc-total b{font-family:var(--head);font-size:40px;line-height:1}
.ours .calc-total b{color:var(--lime)}
.calc-foot{color:var(--muted);font-size:14px;margin-top:10px}

.calc-returns{margin:34px 0 22px;padding:24px 28px;border:1px solid var(--line);background:var(--bg-2)}
.ret-row{display:flex;align-items:center;gap:20px;margin-top:10px}
.ret-row input[type=range]{flex:1;accent-color:var(--lime);height:28px}
.ret-row input[inputmode=numeric]{width:130px;background:#0b0e0c;border:1px solid var(--line-2);padding:12px;text-align:center;font-family:var(--head);font-size:24px;outline:none}
.ret-row input[inputmode=numeric]:focus{border-color:var(--lime)}

.calc-result{display:grid;grid-template-columns:2fr 1fr 1fr;gap:2px;background:var(--green-900);border:1px solid var(--green-700);margin-bottom:44px}
.calc-result > div{padding:30px;background:linear-gradient(135deg,#123f14,#0f2a10)}
.calc-result .big{background:linear-gradient(120deg,#1d6b1a,#3c9a1e)}
.calc-result .big .k,.calc-result .big .s{display:block;font-family:var(--head);text-transform:uppercase;letter-spacing:.16em;font-size:14px;color:#e1f5d2}
.calc-result .big b{display:block;font-family:var(--head);font-size:clamp(48px,7vw,84px);line-height:1.05;color:#fff;margin:6px 0}
.calc-result .mini{display:flex;flex-direction:column;justify-content:center}
.calc-result .mini b{font-family:var(--head);font-size:40px;color:var(--lime);line-height:1.1}
.calc-result .mini span{font-family:var(--head);text-transform:uppercase;letter-spacing:.14em;font-size:13px;color:var(--muted)}
.calc-result.neg .big{background:linear-gradient(120deg,#3a3f3c,#252a27)}

.calc-money{padding:30px;border:1px solid var(--line);background:var(--panel);margin-bottom:44px}
.calc-money-head p{color:var(--muted);margin-top:8px}
.money-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:20px}
.money-grid .fee{flex-direction:column;align-items:stretch;border:0;padding:0;gap:8px}
.money-grid .money{width:100%}
.money-grid small{color:var(--muted);font-size:14px}
.money-grid small b{color:var(--text)}
.calc-total.rev{padding-top:20px;border-top:1px solid var(--line);margin-top:24px}
.calc-total.rev b{color:var(--lime)}

.calc-keep{text-align:center;padding:10px 0 30px}
.calc-keep h2{font-size:clamp(28px,4vw,44px);margin-bottom:24px}
.keep-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:760px;margin:0 auto}
.keep{padding:26px;border:1px solid var(--line);background:var(--panel)}
.keep.ours{border-color:var(--green-700);background:rgba(29,107,26,.22)}
.keep span{display:block;font-family:var(--head);text-transform:uppercase;letter-spacing:.14em;font-size:13px;color:var(--muted)}
.keep em{font-style:normal}
.keep b{display:block;font-family:var(--head);font-size:46px;margin-top:6px}
.keep.ours b{color:var(--lime)}
.keep-diff{display:inline-block;margin-top:20px;padding:10px 20px;font-family:var(--head);text-transform:uppercase;letter-spacing:.12em;font-size:18px;background:var(--lime);color:#061006;font-weight:700}
.keep-diff.neg{background:var(--line-2);color:var(--text)}
.calc-keep .calc-foot{max-width:640px;margin:14px auto 0}

.calc-disclaimer{font-size:13px;color:var(--muted);line-height:1.6;border-top:1px solid var(--line);padding-top:22px;margin-top:20px}
.calc-disclaimer b{color:#c9d3cd}
.calc-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px;justify-content:center}

@media (max-width:920px){
  .calc-compare{grid-template-columns:1fr}
  .calc-vs{padding:14px 0}
  .calc-result{grid-template-columns:1fr 1fr}
  .calc-result .big{grid-column:1/-1}
  .money-grid{grid-template-columns:1fr}
}
@media (max-width:680px){
    .calc-card{padding:22px 18px}
  .money{width:118px}
  .calc-total b{font-size:34px}
  .ret-row{gap:12px}
  .ret-row input[inputmode=numeric]{width:96px;font-size:20px}
  .calc-result > div{padding:22px}
  .calc-result .mini b{font-size:30px}
  .calc-money{padding:22px 18px}
  .keep-grid{grid-template-columns:1fr}
  .keep b{font-size:38px}
  .calc-actions .btn{flex:1 1 100%}
}