/* Cost calculator page. */

.calc-hero {
  padding: var(--space-7) 0 var(--space-4);
  text-align: center;
}
.calc-hero h1 { margin: 0.3rem 0 0.6rem; }

.calc-wrap { padding-bottom: var(--space-7); }

.calc-form {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-4);
  margin-bottom: var(--space-5);
}
@media (max-width: 700px) {
  .calc-form { grid-template-columns: 1fr; }
}

.calc-cards {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-4);
}
@media (max-width: 700px) {
  .calc-cards { grid-template-columns: 1fr; }
}
.calc-card {
  border: 1px solid var(--border); border-radius: 14px;
  padding: var(--space-4);
}
.calc-card--ours { border-color: var(--primary); }
.calc-card__label { color: var(--fg-muted); font-size: 0.85rem; }
.calc-card__value { font-size: 2rem; font-weight: 700; line-height: 1.1; margin: 0.2rem 0; }
.calc-card__value small { font-size: 0.9rem; font-weight: 400; color: var(--fg-muted); }
.calc-card__meta { color: var(--fg-muted); font-size: 0.85rem; }

.calc-verdict { margin-top: var(--space-4); font-size: 1.05rem; }
.calc-verdict[data-cheaper="true"] strong { color: #16a34a; }
.calc-outgrow { color: var(--fg-muted); font-size: 0.9rem; }
.calc-note { color: var(--fg-muted); font-size: 0.85rem; margin-top: var(--space-5); }