.calculator-page {
  min-height: calc(100vh - 247px);
  background: linear-gradient(180deg, #effaff 0, #fff 58%);
}

.calculator-hero { padding: 80px 0 54px; text-align: center; }
.calculator-hero .section-label { margin-inline: auto; }
.calculator-hero h1 { margin: 12px 0 18px; color: #071540; font-size: clamp(42px, 5vw, 70px); line-height: 1.08; letter-spacing: -3px; }
.calculator-hero h1 strong { color: #0874ed; }
.calculator-hero p { max-width: 670px; margin: 0 auto 28px; color: #60749a; font-size: 17px; line-height: 1.7; }
.calculator-hero .button { width: auto; }
.calculator-list { padding: 24px 0 80px; }
.calculator-list__heading { margin-bottom: 24px; }
.calculator-list__heading h2 { margin: 0 0 5px; font-size: 32px; letter-spacing: -1.5px; }
.calculator-list__heading p { margin: 0; color: #6d7fa1; }
.calculator-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.calculator-card { min-height: 260px; padding: 24px; border: 1px solid #dcebf6; border-radius: 18px; display: flex; flex-direction: column; background: #fff; box-shadow: 0 14px 34px rgb(24 97 155 / 8%); }
.calculator-card__icon { width: 54px; height: 54px; margin-bottom: 18px; border-radius: 50%; display: grid; place-items: center; color: #0874ed; background: linear-gradient(145deg,#e5f8ff,#fff); box-shadow: inset 0 0 0 1px #d8eefc; font-size: 22px; font-weight: 900; }
.calculator-card__status { color: #0874ed; font-size: 11px; font-weight: 900; letter-spacing: .08em; }
.calculator-card h2 { margin: 7px 0 8px; font-size: 20px; letter-spacing: -.7px; }
.calculator-card p { margin: 0; color: #687a9d; font-size: 13px; line-height: 1.65; }
.calculator-card__action { min-height: 42px; margin-top: auto; padding-inline: 14px; border: 1px solid #b9dcf4; border-radius: 9px; display: flex; align-items: center; justify-content: space-between; color: #0874ed; background: #f2f9fd; font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; transition: border-color .18s ease, background-color .18s ease, transform .18s ease; }
.calculator-card__action:hover { border-color: #76bdeb; background: #e8f6ff; transform: translateY(-1px); }

.calculator-shell { width: min(1040px, calc(100% - 48px)); margin-inline: auto; }
.calculator-tool-hero { padding: 50px 0 40px; border-bottom: 1px solid #dcebf6; background: radial-gradient(circle at 78% 8%, rgb(38 190 255 / 17%), transparent 40%); }
.breadcrumb { margin-bottom: 30px; display: flex; align-items: center; flex-wrap: wrap; gap: 8px; color: #53698e; font-size: 12px; }
.breadcrumb a { color: #526b94; font-weight: 700; }
.breadcrumb a:hover { color: #0874ed; }
.calculator-tool-hero h1 { margin: 12px 0 14px; color: #071540; font-size: clamp(42px, 5vw, 62px); line-height: 1.1; letter-spacing: -3px; }
.calculator-tool-hero p { max-width: 720px; margin: 0; color: #5e7399; font-size: 16px; line-height: 1.75; }

.calculator-workspace { padding: 48px 0 34px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; gap: 22px; }
.calculator-panel { min-width: 0; padding: 28px; border: 1px solid #dcebf6; border-radius: 20px; background: #fff; box-shadow: 0 16px 38px rgb(24 97 155 / 8%); }
.calculator-panel__heading { margin-bottom: 22px; }
.calculator-panel__heading > span { color: #0768d5; font-size: 10px; font-weight: 900; letter-spacing: .1em; }
.calculator-panel__heading h2 { margin: 5px 0 0; color: #0a1a48; font-size: 24px; letter-spacing: -.8px; }
.calculator-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 14px; }
.calculator-field { min-width: 0; }
.calculator-field label { display: block; margin-bottom: 7px; color: #233b69; font-size: 13px; font-weight: 800; }
.calculator-field input,
.calculator-field select { width: 100%; min-height: 48px; padding: 0 13px; border: 1px solid #cbddeb; border-radius: 10px; color: #0a1a48; background: #fbfdff; font: inherit; font-size: 15px; outline: none; transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease; }
.calculator-field input:hover,
.calculator-field select:hover { border-color: #91c7e9; }
.calculator-field input:focus-visible,
.calculator-field select:focus-visible { border-color: #0768d5; background: #fff; box-shadow: 0 0 0 4px rgb(7 104 213 / 24%); }
.calculator-field input[aria-invalid='true'],
.calculator-field select[aria-invalid='true'] { border-color: #d63d55; box-shadow: 0 0 0 4px rgb(214 61 85 / 12%); }
.calculator-field__hint { margin: 7px 0 0; color: #53698e; font-size: 10px; line-height: 1.55; }
.calculator-field__error { margin: 7px 0 0; color: #b9233d; font-size: 11px; font-weight: 700; line-height: 1.45; }
.calculator-form__error { margin-top: 18px; padding: 11px 13px; border: 1px solid #f3c4cc; border-radius: 9px; color: #a81e36; background: #fff5f7; font-size: 12px; font-weight: 700; }
.calculator-form__actions { margin-top: 22px; display: flex; gap: 10px; }
.calculator-form__actions .button { flex: 1; min-width: 0; }

.calculator-results { position: sticky; top: 92px; }
.calculator-results__content { min-height: 260px; }
.calculator-results__empty { min-height: 260px; border: 1px dashed #cce2f1; border-radius: 14px; display: grid; place-content: center; justify-items: center; gap: 12px; color: #53698e; background: #f7fbfe; text-align: center; }
.calculator-results__empty span { width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; color: #0768d5; background: #e6f7ff; font-size: 22px; font-weight: 900; }
.calculator-results__empty p { max-width: 250px; margin: 0; font-size: 12px; line-height: 1.65; }
.result-grid { display: grid; gap: 10px; }
.result-card { min-height: 68px; padding: 13px 15px; border: 1px solid #dbe9f3; border-radius: 12px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 4px 16px; background: #fbfdff; }
.result-card > span { color: #53698e; font-size: 11px; font-weight: 700; }
.result-card > strong { color: #132b59; font-size: clamp(17px, 2vw, 22px); text-align: right; overflow-wrap: anywhere; }
.result-card > small { grid-column: 1 / -1; color: #53698e; font-size: 10px; }
.result-card--positive { border-color: #bfe8db; background: #f2fcf8; }
.result-card--positive > strong { color: #07865e; }
.result-card--negative { border-color: #f1ced5; background: #fff7f8; }
.result-card--negative > strong { color: #c02d47; }
.calculator-disclaimer { margin: 20px 0 0; padding-top: 16px; border-top: 1px solid #e3edf5; color: #53698e; font-size: 10px; line-height: 1.65; }

.purchase-rows { display: grid; gap: 12px; }
.purchase-row { padding: 14px; border: 1px solid #dce9f3; border-radius: 12px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; align-items: start; gap: 12px; background: #fbfdff; }
.purchase-row__remove { min-height: 46px; margin-top: 20px; padding: 0 12px; border: 1px solid #ead2d7; border-radius: 9px; color: #a32b40; background: #fff7f8; font: inherit; font-size: 11px; font-weight: 800; cursor: pointer; }
.purchase-row__remove:disabled { color: #9ba9bd; border-color: #e3e9ef; background: #f5f7f9; cursor: not-allowed; }
.add-purchase { width: 100%; margin-top: 12px; border-color: #bfdff4; color: #0768d5; background: #f2f9fd; }

.calculator-guide { padding: 26px 0 48px; display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.calculator-guide > div { padding: 26px 28px; border: 1px solid #dcebf6; border-radius: 18px; background: #fff; }
.calculator-guide h2,
.related-calculators h2 { margin: 8px 0 18px; color: #0a1a48; font-size: 25px; letter-spacing: -.8px; }
.calculator-guide ol { margin: 0; padding-left: 20px; color: #53698e; font-size: 13px; line-height: 1.8; }
.calculator-guide li + li { margin-top: 8px; }
.calculator-faq-list { display: grid; gap: 8px; }
.calculator-faq-item { border: 1px solid #dce9f3; border-radius: 10px; background: #fbfdff; }
.calculator-faq-item summary { min-height: 44px; padding: 12px 14px; color: #263f6d; font-size: 12px; font-weight: 800; cursor: pointer; }
.calculator-faq-item p { margin: 0; padding: 0 14px 14px; color: #53698e; font-size: 11px; line-height: 1.7; }

.related-calculators { padding: 0 0 80px; }
.related-calculators__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.related-calculator { min-height: 112px; padding: 18px; border: 1px solid #dcebf6; border-radius: 14px; display: grid; grid-template-columns: 44px 1fr; align-items: center; gap: 4px 12px; background: #fff; box-shadow: 0 10px 24px rgb(24 97 155 / 6%); transition: border-color .18s ease, transform .18s ease; }
.related-calculator:hover { border-color: #9ad3f4; transform: translateY(-2px); }
.related-calculator > span { grid-row: 1 / 3; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; color: #0768d5; background: #e8f8ff; font-weight: 900; }
.related-calculator strong { color: #1b3565; font-size: 14px; }
.related-calculator small { color: #0768d5; font-size: 10px; font-weight: 800; }
.calculator-missing { padding: 80px 0; }

.calculator-card__action:focus-visible,
.breadcrumb a:focus-visible,
.purchase-row__remove:focus-visible,
.add-purchase:focus-visible,
.calculator-faq-item summary:focus-visible,
.related-calculator:focus-visible { outline: 3px solid rgb(0 126 255 / 32%); outline-offset: 3px; }

@media (max-width: 1120px) {
  .calculator-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 820px) {
  .calculator-shell { width: min(100% - 32px, 1040px); }
  .calculator-workspace { grid-template-columns: 1fr; }
  .calculator-results { position: static; }
  .calculator-guide { grid-template-columns: 1fr; }
  .related-calculators__grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 560px) {
  .calculator-hero { padding: 54px 0 40px; }
  .calculator-hero h1 { font-size: 40px; letter-spacing: -2px; }
  .calculator-hero p { font-size: 15px; }
  .calculator-grid { grid-template-columns: 1fr; }
  .calculator-card { min-height: 230px; }
  .calculator-tool-hero { padding: 36px 0 30px; }
  .breadcrumb { margin-bottom: 22px; }
  .calculator-tool-hero h1 { font-size: 36px; letter-spacing: -2px; }
  .calculator-tool-hero p { font-size: 14px; }
  .calculator-workspace { padding-top: 30px; gap: 16px; }
  .calculator-panel { padding: 20px 16px; border-radius: 16px; }
  .calculator-fields { grid-template-columns: 1fr; }
  .calculator-form__actions { flex-direction: column; }
  .purchase-row { grid-template-columns: 1fr; }
  .purchase-row__remove { width: 100%; margin-top: 0; }
  .calculator-guide { gap: 16px; }
  .calculator-guide > div { padding: 22px 18px; }
  .related-calculators__grid { grid-template-columns: 1fr; }
  .result-card { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); }
}

@media (max-width: 360px) {
  .calculator-shell { width: min(100% - 24px, 1040px); }
  .calculator-tool-hero h1 { font-size: 32px; }
  .calculator-panel { padding-inline: 13px; }
  .result-card { padding-inline: 12px; gap: 4px 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .calculator-card__action,
  .related-calculator { transition: none; }
}
