/* Life insurance: how much do I need? (calc/life-insurance.html) */
.li-h { display: flex; align-items: center; gap: 10px; font: 600 1.15rem/1.3 var(--sans); color: var(--ink); margin: 18px 0 0; }
.li-h:first-child { margin-top: 0; }
.li-l { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--ink); color: var(--gold); font: 700 1.1rem var(--serif); flex: none; }
.li-minus { padding-top: 16px; border-top: 1px solid rgba(11, 40, 78, .1); }
.li-table { width: 100%; border-collapse: collapse; margin-top: 18px; font-size: .95rem; }
.li-table caption { text-align: left; font-weight: 600; color: var(--mist); padding-bottom: 6px; font-size: .85rem; letter-spacing: .06em; text-transform: uppercase; }
.li-table th, .li-table td { padding: 9px 8px; border-top: 1px solid rgba(255, 255, 255, .12); }
.li-table th { text-align: left; font-weight: 500; color: #d6e4f3; }
.li-table td { text-align: right; color: #fff; font-weight: 600; white-space: nowrap; }
.li-table .li-sum th, .li-table .li-sum td { border-top: 2px solid rgba(255, 255, 255, .35); color: #fff; font-weight: 700; }
.li-table .li-final td { color: var(--gold); font: 700 1.2rem var(--serif); }
.li-cta { display: grid; grid-template-columns: 1fr auto; gap: 20px 28px; align-items: center; margin-top: 22px; padding: 24px 26px; border: 2px solid var(--gold); border-radius: 16px; background: rgba(233, 185, 78, .1); }
.li-cta h2 { font-size: 1.4rem; color: var(--ink); margin: 0 0 6px; }
.li-cta p { margin: 0; color: var(--ink); max-width: 62ch; }
.li-cta .btn { font-size: 1.05rem; padding: 15px 28px; white-space: nowrap; }
@media (max-width: 700px) {
  .li-cta { grid-template-columns: 1fr; padding: 20px 18px; }
  .li-cta .btn { justify-content: center; }
  .li-table { font-size: .88rem; }
  .li-table th, .li-table td { padding: 8px 4px; }
}