/* FluxFront — leakage-calculator · sliced verbatim from the original sections.css block (render-identical). See docs/marketing-site-architecture.md for the selector map. */
/* ===================== LEAKAGE CALCULATOR ===================== */
.leak-grid { display: grid; grid-template-columns: 1fr 1.05fr; gap: 22px; align-items: stretch; }
@media (max-width: 880px) { .leak-grid { grid-template-columns: 1fr; } }
/* Phones: tighten the calculator so it reads as one compact unit, and give the
   results card a touch more contrast against the controls above it. */
@media (max-width: 560px) {
  .leak-controls { padding: 22px 20px; gap: 20px; }
  .leak-results { padding: 24px 20px; }
  .leak-results .btn { align-self: stretch; justify-content: center; }
}
.leak-controls { padding: 28px clamp(22px, 3vw, 32px); display: flex; flex-direction: column; gap: 26px; }
.leak-ctrl-top { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 13px; }
.leak-ctrl-top label { font-size: var(--t-sm); font-weight: 500; }
.leak-val { font-size: 1.15rem; font-weight: 600; color: var(--ink); }
.leak-assume { margin-top: auto; font-size: 0.7rem; color: var(--ink-3); line-height: 1.5; padding-top: 8px;
  border-top: 1px solid var(--hairline); }
.leak-results { background: var(--ink-deep); color: #C9CED7; border-radius: var(--r-lg); padding: 28px clamp(22px,3vw,32px);
  display: flex; flex-direction: column; }
.leak-lines { display: grid; gap: 2px; }
.leak-line { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 13px 0;
  border-bottom: 1px solid var(--ink-line); }
.leak-line-l { font-size: var(--t-sm); color: #C9CED7; display: flex; flex-direction: column; gap: 2px; }
.leak-line-l em { font-style: normal; font-family: var(--font-mono); font-size: 0.66rem; color: #6E747F; }
.leak-line-v { font-size: 1.05rem; font-weight: 600; color: #EDEBE4; white-space: nowrap; }
.leak-total { margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--teal-700); }
.leak-total-l { display: block; font-size: var(--t-xs); text-transform: uppercase; letter-spacing: 0.08em; color: #8A919D; }
.leak-total-v { display: block; font-size: clamp(2.6rem, 1.6rem + 4vw, 4rem); font-weight: 600; letter-spacing: -0.03em;
  line-height: 1.05; color: var(--teal); margin: 4px 0 6px; }
.leak-total-sub { font-size: 0.74rem; color: #8A919D; }
.leak-total-sub b { color: #C9CED7; }
.leak-results .btn { margin-top: 22px; align-self: flex-start; }