/* ════════════════════════════════════════════════════════════════
   CONSUMO DA VIDA — responsive.css
   Todos os media queries. Mobile-first onde relevante.
════════════════════════════════════════════════════════════════ */

/* ── Navegação mobile ─────────────────────────────────────── */
@media (max-width: 780px) {
  .nav-links {
    position: fixed; top: 59px; left: 0; right: 0;
    background: var(--surface); flex-direction: column; align-items: stretch;
    padding: 8px; gap: 4px; border-bottom: 1px solid var(--border);
    box-shadow: var(--shadow-lg);
    transform: translateY(-130%); transition: transform .3s cubic-bezier(.16,1,.3,1); z-index: 190;
  }
  .nav-links.open { transform: translateY(0); }
  .nav-link { padding: 13px 16px; font-size: 15px; }
  .nav-toggle { display: flex; }
  .nav-sub { display: none; }
}

/* ── Home — tools grid ────────────────────────────────────── */
@media (max-width: 860px) {
  .tools-grid { grid-template-columns: 1fr; max-width: 440px; margin: 0 auto; }
}

/* ── Benefits grid ────────────────────────────────────────── */
@media (max-width: 780px) { .benefits-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 420px) { .benefits-grid { grid-template-columns: 1fr; } }

/* ── Formulários ─────────────────────────────────────────── */
@media (max-width: 520px) {
  .grid2 { grid-template-columns: 1fr; }
  .full  { grid-column: 1; }
}

/* ── Metrics grid ─────────────────────────────────────────── */
@media (max-width: 600px) { .metrics-grid { grid-template-columns: repeat(2,1fr); } }

/* ── Planejador ──────────────────────────────────────────── */
@media (max-width: 500px) { .plan-metrics { grid-template-columns: 1fr; } }
@media (max-width: 580px) { .scenario-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 360px) { .scenario-grid { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .discount-grid { grid-template-columns: 1fr; } }

/* ── Modal ───────────────────────────────────────────────── */
@media (max-width: 380px) { .modal-btns { grid-template-columns: 1fr; } }

/* ── Simulador ───────────────────────────────────────────── */
@media (max-width: 880px) { .sim-grid { grid-template-columns: 1fr; } }

/* ── Comparison cards ────────────────────────────────────── */
@media (max-width: 560px) { .cmp-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 380px) { .cmp-grid { grid-template-columns: 1fr; } }

/* ── Opt row — esconde taxa em telas muito pequenas ─────── */
@media (max-width: 360px) { .opt-rate { display: none; } }

/* ── Scenario grid mobile ────────────────────────────────── */
@media (max-width: 580px) { .scenario-grid { grid-template-columns: 1fr; gap: 10px; } }

/* ── Opt list — esconde rate em mobile pequeno ──────────── */
@media (max-width: 440px) { .opt-rate { display: none; } }