.tools-hero { padding-top: 92px; padding-bottom: 58px; }
.tools-hero h1 { max-width: 920px; font-size: clamp(2.9rem, 7vw, 5.8rem); }
.tools-intro { max-width: 760px; color: var(--ink-soft); font-size: 1.05rem; }
.breadcrumbs { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 32px; color: var(--muted); font-size: 0.82rem; font-weight: 750; }
.breadcrumbs a { color: var(--teal); }
.tool-section { padding-top: 68px; padding-bottom: 68px; }
.tools-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.tools-grid-compact { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.tool-card { min-height: 245px; padding: 25px 23px; border: 1px solid var(--line); border-radius: 18px; background: var(--white); box-shadow: 0 14px 34px rgba(25, 50, 57, 0.07); }
.tool-card h3 { font-size: 1.18rem; }
.tool-card p { color: var(--ink-soft); font-size: 0.92rem; }
.tool-card-kicker { margin-bottom: 12px; color: var(--teal); font-size: 0.73rem; font-weight: 900; letter-spacing: 0.13em; text-transform: uppercase; }
.calculator-shell { display: grid; grid-template-columns: minmax(0, 0.95fr) minmax(320px, 0.8fr); gap: 20px; align-items: start; padding-top: 22px; padding-bottom: 50px; }
.calculator-card, .result-panel { border: 1px solid var(--line); border-radius: 22px; background: var(--white); box-shadow: 0 18px 40px rgba(25, 50, 57, 0.08); }
.calculator-card { padding: 24px; }
.result-panel { position: sticky; top: 100px; padding: 24px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.form-grid label { display: grid; gap: 7px; color: var(--ink); font-size: 0.83rem; font-weight: 800; }
.form-grid input, .form-grid select { width: 100%; min-height: 48px; padding: 0 13px; border: 1px solid var(--line); border-radius: 10px; background: #fbfdfb; color: var(--ink); font: inherit; }
.form-grid input:focus, .form-grid select:focus { border-color: var(--mint); outline: 3px solid rgba(74, 180, 162, 0.22); }
.form-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.secondary-button { min-height: 52px; padding: 0.85rem 1.2rem; border: 1px solid var(--line); border-radius: 999px; background: var(--white); color: var(--teal); cursor: pointer; font-weight: 850; }
.form-note { min-height: 22px; margin: 12px 0 0; color: var(--muted); font-size: 0.84rem; }
.metric-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.metric { padding: 14px; border-radius: 14px; background: var(--paper); }
.metric span { display: block; color: var(--muted); font-size: 0.75rem; font-weight: 850; text-transform: uppercase; letter-spacing: 0.08em; }
.metric strong { display: block; margin-top: 4px; color: var(--teal-dark); font-size: 1.25rem; line-height: 1.15; }
.result-panel h2 { margin-bottom: 18px; font-size: 1.65rem; letter-spacing: -0.035em; }
.result-panel p { color: var(--ink-soft); font-size: 0.93rem; }
.status-pill { display: inline-flex; margin-bottom: 16px; padding: 7px 11px; border-radius: 999px; background: var(--mint-pale); color: var(--teal); font-size: 0.78rem; font-weight: 900; }
.warning-list { margin: 14px 0 0; padding-left: 18px; color: #8a4f10; }
.result-table { width: 100%; border-collapse: collapse; margin-top: 15px; font-size: 0.9rem; }
.result-table th, .result-table td { padding: 10px 8px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.result-table th { color: var(--teal-dark); }
.tool-cta { width: min(calc(100% - 48px), var(--shell)); margin: 32px auto 40px; display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 30px; border-radius: 22px; background: linear-gradient(135deg, var(--teal) 0%, #2a8a84 62%, var(--mint) 100%); color: var(--white); }
.tool-cta h2 { max-width: 680px; margin-bottom: 10px; font-size: clamp(1.8rem, 4vw, 3rem); }
.tool-cta p:not(.eyebrow) { max-width: 690px; margin-bottom: 0; color: rgba(255,255,255,0.82); }
.tool-cta .eyebrow { color: #a5eadd; }
.text-content { max-width: 860px; }
.text-content p, .text-content li { color: var(--ink-soft); font-size: 1rem; }
.text-content h2 { margin-top: 26px; font-size: clamp(2rem, 4vw, 3.25rem); }
.tool-faq { display: block; }
.tool-faq .section-heading { margin-bottom: 30px; text-align: left; }
.related-tools .section-heading { margin-bottom: 28px; text-align: left; }
.chart-wrap { padding-top: 0; padding-bottom: 18px; }
#variance-chart { width: 100%; max-height: 360px; border: 1px solid var(--line); border-radius: 18px; background: var(--white); box-shadow: 0 14px 34px rgba(25,50,57,0.07); }
.disclaimer { margin-top: 20px; margin-bottom: 70px; color: var(--muted); font-size: 0.84rem; }
.is-hidden { display: none !important; }
@media (max-width: 1020px) {
  .tools-grid, .tools-grid-compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .calculator-shell { grid-template-columns: 1fr; }
  .result-panel { position: static; }
}
@media (max-width: 640px) {
  .tools-grid, .tools-grid-compact, .form-grid, .metric-grid { grid-template-columns: 1fr; }
  .tool-cta { width: min(calc(100% - 36px), var(--shell)); flex-direction: column; align-items: flex-start; padding: 23px; }
  .calculator-card, .result-panel { padding: 18px; }
}

