:root{
  --bm-primary: #3B6E8F;
  --bm-primary-dk: #2d5570;
  --bm-primary-lt: #5a8fb0;
  --bm-secondary: #2F8F9D;
  --bm-orange: #F4A261;
  --bm-orange-hv: #E8934E;
  --bm-white: #FFFFFF;
  --bm-light-bg: #F5F7FA;
  --bm-dark-bg: #0F2A3A;
  --bm-card-bg-dk: #1F3B4D;
  --bm-text: #333333;
  --bm-label: #666666;
  --bm-glow: rgba(244,162,97,0.13);
  --bm-grad: linear-gradient(135deg, #0F2A3A 0%, #243f52 60%, #2b4c63 100%);
  --bm-line: #dfe7ee;
  --bm-shadow: 0 16px 46px rgba(15,42,58,.08);
  --bm-radius: 20px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}

body.iframe-app{
  margin:0;
  background:var(--bm-white);
  color:var(--bm-text);
  font-family:'Inter', sans-serif;
  font-size:16px;
  line-height:1.6;
  overflow-x:hidden;
}

.tool-shell{max-width:980px;margin:0 auto;padding:0 0 28px}

h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(1.9rem,4vw,3rem);line-height:1.05;letter-spacing:-.045em;margin-bottom:14px;color:var(--bm-white)}
h2{font-size:clamp(1.25rem,2.3vw,1.8rem);line-height:1.15;letter-spacing:-.035em;margin-bottom:6px;color:var(--bm-dark-bg)}
h3{font-size:1.05rem;margin-bottom:4px;color:var(--bm-dark-bg)}

.lede{font-size:1.03rem;color:rgba(255,255,255,.84);max-width:760px;margin-bottom:0}
.eyebrow{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.12em;color:var(--bm-orange);margin-bottom:10px}

.hero-card,.panel,.metric-card{
  background:var(--bm-white);
  border:1px solid var(--bm-line);
  border-radius:var(--bm-radius);
  box-shadow:var(--bm-shadow);
}

.hero-card{
  padding:32px 34px;
  margin-bottom:20px;
  position:relative;
  overflow:hidden;
  background:var(--bm-grad);
  border-color:transparent;
  box-shadow:0 20px 50px rgba(15,42,58,.18);
}

.hero-card:after{
  content:"";
  position:absolute;
  right:-90px;
  top:-90px;
  width:220px;
  height:220px;
  border-radius:999px;
  background:var(--bm-glow);
}

.hero-content{position:relative;z-index:1;max-width:850px}

.calculator-form{display:grid;gap:18px}
.panel{padding:26px}
.accent-panel{background:linear-gradient(180deg,#fff,#fbfdfe)}

.section-heading{display:flex;gap:15px;align-items:flex-start;margin-bottom:22px}
.section-heading.slim{margin-bottom:16px}
.section-heading p{color:var(--bm-label);font-size:.95rem;margin:0}

.step-badge{
  flex:0 0 auto;
  background:var(--bm-primary);
  color:var(--bm-white);
  border-radius:999px;
  padding:7px 12px;
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.accent-panel .step-badge{background:var(--bm-secondary)}

.two-col{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.align-end{align-items:end}
.field-group{margin-bottom:18px}
.field-group:last-child{margin-bottom:0}

label{display:block;font-weight:750;font-size:.92rem;margin-bottom:8px;color:var(--bm-dark-bg)}
label span{font-weight:600;color:var(--bm-label);font-size:.82rem}

input,select,textarea{
  width:100%;
  border:1px solid #d9e1e8;
  background:#fff;
  border-radius:14px;
  padding:14px 15px;
  font:inherit;
  color:var(--bm-text);
  outline:none;
  transition:border-color .18s,box-shadow .18s,transform .18s;
}

textarea{min-height:118px;resize:vertical}

input:focus,select:focus,textarea:focus{
  border-color:var(--bm-primary);
  box-shadow:0 0 0 4px rgba(59,110,143,.13);
}

.money-input,.percent-input{
  display:flex;
  align-items:center;
  border:1px solid #d9e1e8;
  background:#fff;
  border-radius:14px;
  overflow:hidden;
  transition:border-color .18s,box-shadow .18s;
}

.money-input:focus-within,.percent-input:focus-within{
  border-color:var(--bm-primary);
  box-shadow:0 0 0 4px rgba(59,110,143,.13);
}

.money-input span,.percent-input span{
  padding:0 14px;
  color:var(--bm-label);
  font-weight:800;
}

.money-input input,.percent-input input{
  border:0;
  border-radius:0;
  box-shadow:none;
}

.segmented-control{
  display:inline-grid;
  grid-template-columns:1fr 1fr;
  border:1px solid #d9e1e8;
  border-radius:999px;
  padding:4px;
  background:var(--bm-light-bg);
  gap:4px;
  max-width:100%;
}

.segmented-control input{position:absolute;opacity:0;pointer-events:none}

.segmented-control label{
  margin:0;
  padding:10px 16px;
  border-radius:999px;
  cursor:pointer;
  color:var(--bm-label);
  font-size:.9rem;
  font-weight:750;
  text-align:center;
  white-space:nowrap;
}

.segmented-control input:checked+label{
  background:var(--bm-primary);
  color:#fff;
  box-shadow:0 8px 18px rgba(59,110,143,.18);
}

.segmented-control.small label{padding:9px 14px}

.check-card{
  display:flex;
  gap:12px;
  align-items:flex-start;
  border:1px solid #d9e1e8;
  border-radius:18px;
  padding:15px;
  background:#fff;
  cursor:pointer;
  margin:0;
}

.check-card input{
  width:20px;
  height:20px;
  margin-top:3px;
  accent-color:var(--bm-orange);
}

.check-card small{
  display:block;
  color:var(--bm-label);
  font-weight:500;
  margin-top:2px;
}

.note-card{
  border-left:4px solid var(--bm-orange);
  background:#fff7ef;
  color:#684b0f;
  border-radius:16px;
  padding:14px 16px;
  margin:3px 0 18px;
  font-size:.93rem;
}

.subsection-header{
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:center;
  margin-top:10px;
  margin-bottom:14px;
}

.subsection-header p{color:var(--bm-label);font-size:.9rem;margin:0}

.debts-list{display:grid;gap:10px}

.debt-item{
  display:grid;
  grid-template-columns:1fr 180px auto;
  gap:10px;
  align-items:center;
  background:#fff;
  border:1px solid var(--bm-line);
  border-radius:18px;
  padding:10px;
}

.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border:0;
  border-radius:999px;
  padding:14px 22px;
  font:inherit;
  font-weight:800;
  text-decoration:none;
  cursor:pointer;
  transition:transform .18s,box-shadow .18s,background .18s;
  color:var(--bm-dark-bg);
}

.button:hover{transform:translateY(-1px)}

.button.primary{
  background:var(--bm-orange);
  color:var(--bm-dark-bg);
  box-shadow:0 14px 25px rgba(244,162,97,.22);
}

.button.primary:hover{background:var(--bm-orange-hv)}

.button.ghost{
  background:#fff;
  color:var(--bm-primary-dk);
  border:1px solid #d9e1e8;
}

.button.text-link{
  background:transparent;
  color:var(--bm-primary);
  padding-left:0;
  padding-right:0;
}

.small-button{padding:10px 14px;font-size:.88rem}

.sticky-action{
  position:sticky;
  bottom:10px;
  z-index:2;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(12px);
  border:1px solid var(--bm-line);
  border-radius:22px;
  padding:14px;
  box-shadow:0 14px 45px rgba(15,42,58,.13);
  display:flex;
  align-items:center;
  gap:18px;
  justify-content:space-between;
}

.sticky-action p{
  margin:0;
  color:var(--bm-label);
  font-size:.86rem;
}

.metrics-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin:0 0 18px;
}

.metric-card{padding:22px}

.metric-card span{
  display:block;
  font-size:.83rem;
  color:var(--bm-label);
  font-weight:750;
  text-transform:uppercase;
  letter-spacing:.06em;
  margin-bottom:9px;
}

.metric-card strong{
  font-size:clamp(1.45rem,3vw,2.15rem);
  letter-spacing:-.04em;
  color:var(--bm-primary-dk);
}

.metric-card.warning strong{color:var(--bm-orange-hv)}

.metric-card.success{
  background:#eef8f9;
  border-color:#c8e7eb;
}

.metric-card.success strong{color:var(--bm-secondary)}

.compact-panel{padding:22px}

.details-list{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:12px;
  margin:0;
}

.details-list div{
  background:var(--bm-light-bg);
  border-radius:16px;
  padding:12px 14px;
}

.details-list dt{
  font-weight:800;
  font-size:.78rem;
  color:var(--bm-label);
  text-transform:uppercase;
  letter-spacing:.06em;
}

.details-list dd{
  margin:3px 0 0;
  font-weight:650;
}

.table-wrap{
  overflow-x:auto;
  border:1px solid var(--bm-line);
  border-radius:18px;
}

.breakdown-table{
  width:100%;
  border-collapse:collapse;
  background:#fff;
  min-width:620px;
}

.breakdown-table th{
  background:var(--bm-dark-bg);
  color:#fff;
  text-align:left;
  padding:14px 16px;
  font-size:.86rem;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.breakdown-table th:last-child,
.breakdown-table td:last-child{
  text-align:right;
}

.breakdown-table td{
  padding:14px 16px;
  border-bottom:1px solid var(--bm-line);
  vertical-align:top;
}

.breakdown-table tr:nth-child(even):not(.total-row):not(.final-row):not(.group-row){
  background:#fafbfc;
}

.breakdown-table small{
  display:block;
  color:var(--bm-label);
  font-size:.8rem;
  margin-top:3px;
}

.group-row td{
  background:#eef5f8!important;
  color:var(--bm-primary-dk);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
  font-size:.8rem;
}

.indent{padding-left:34px!important}

.total-row td{
  background:#fff7ef!important;
  font-weight:800;
  border-top:2px solid var(--bm-orange);
}

.final-row td{
  background:#eef8f9!important;
  color:var(--bm-secondary);
  font-weight:900;
  font-size:1.06rem;
  border-top:2px solid var(--bm-secondary);
}

.action-panel{
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:center;
}

.action-panel p{
  color:var(--bm-label);
  margin:0;
}

.action-buttons{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}

.disclaimer{
  font-size:.8rem;
  color:var(--bm-label);
  padding:18px 4px;
  text-align:center;
}

.sr-only{
  position:absolute;
  left:-9999px;
}

@media (max-width:760px){
  .tool-shell{padding:0 0 20px}

  .hero-card,.panel{
    border-radius:18px;
    padding:20px;
  }

  .two-col,
  .metrics-grid,
  .details-list,
  .action-panel{
    grid-template-columns:1fr;
    display:grid;
  }

  .segmented-control{width:100%}

  .segmented-control label{
    font-size:.82rem;
    padding:10px 9px;
  }

  .debt-item{grid-template-columns:1fr}

  .sticky-action{
    position:static;
    display:grid;
  }

  .sticky-action .button{width:100%}

  .action-buttons,
  .action-buttons form,
  .action-buttons .button{
    width:100%;
  }

  .subsection-header{
    align-items:flex-start;
    flex-direction:column;
  }

  .button{width:100%}
}

/* Results page hero padding override */
.hero-card.results-hero{
  padding:56px 48px;
}

@media (max-width:760px){
  .hero-card.results-hero{
    padding:36px 24px;
  }
}