/* ============================================================
   Responsivo padrão Nortia — breakpoints 900/768/600/480/380,
   barra de ação fixa no rodapé, alvos de toque e anti-zoom iOS.
   Último arquivo carregado.
   Ver: Ferramentas/_meta/PADRAO-FERRAMENTAS.md (seção 8)
   ============================================================ */

@media (max-width: 900px) {
  .container { padding: 0 16px 40px; }
  .calculator-container { padding: 24px 20px; }
}

@media (max-width: 768px) {
  .header { padding: 24px 0 6px; margin-bottom: 16px; }
  .header-content h1 { font-size: clamp(1.3rem, 3.5vw, 1.8rem); }
  .header-content p { font-size: 0.88rem; }
  .header-logo { height: 38px; }

  .calculator-container { padding: 20px 16px; border-radius: 12px; }
  .tab-explanation { padding: 14px; margin-bottom: 16px; }
  .explanation-text h3 { font-size: 0.98rem; }
  .explanation-text p { font-size: 0.8rem; }
  .explanation-icon { width: 32px; height: 32px; }

  .tabs { gap: 8px; }
  .tab-btn { flex: 1; min-width: 0; padding: 12px 14px; font-size: 0.85rem; min-height: 48px; }

  /* 16px é o mínimo que evita o zoom automático do iOS ao focar o campo */
  .form-group input,
  .form-group select,
  .form-group textarea { padding: 12px 14px; font-size: 16px; }
  .form-group label { font-size: 0.8rem; }

  /* Barra de ação fixa: mantém o botão de calcular sempre alcançável pelo
     polegar. --kb-offset é calculado via JS (visualViewport) para a barra
     grudar em cima do teclado do iOS em vez de ficar escondida atrás dele. */
  .calculator-actions {
    position: fixed; left: 0; right: 0;
    bottom: var(--kb-offset, 0px);
    display: flex; gap: 10px;
    margin: 0;
    padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
    background: var(--bg-dark);
    border-top: 1px solid var(--border);
    z-index: 500;
    box-shadow: 0 -6px 20px rgba(0, 0, 0, 0.25);
  }
  .calculator-actions .calculate-btn,
  .calculator-actions button[type="submit"] { flex: 1; }
  body.has-fixed-actions .calculator-container { padding-bottom: 84px; }

  .btn, .calculate-btn, button[type="submit"] { padding: 14px 20px; font-size: 0.9rem; min-height: 48px; }

  .results-container { grid-template-columns: 1fr !important; }
  .result-card { padding: 16px; }
}

@media (max-width: 600px) {
  .container { padding: 0 12px 30px; }
  .calculator-container { padding: 16px 14px; }
  .tab-subtitle { display: none; }
}

@media (max-width: 480px) {
  .header { padding: 18px 0 4px; }
  .header-content h1 { font-size: 1.25rem; }
  .header-content p { font-size: 0.82rem; }
  .header-logo { height: 32px; }

  .calculator-container { padding: 16px 14px; border-radius: 10px; }
  .explanation-text h3 { font-size: 0.92rem; }
  .explanation-icon { width: 28px; height: 28px; border-radius: 8px; }

  .btn, .calculate-btn, button[type="submit"] { padding: 12px 14px; font-size: 0.84rem; min-height: 44px; }
  .tab-btn { padding: 10px 12px; font-size: 0.8rem; min-height: 44px; }
  .form-group input, .form-group select { padding: 10px 12px; font-size: 16px; }
  .result-card { padding: 12px 10px; }
}

@media (max-width: 380px) {
  .header-content h1 { font-size: 1.1rem; }
  .calculator-container { padding: 14px 12px; }
  .btn, .calculate-btn, button[type="submit"] { padding: 10px 12px; font-size: 0.8rem; min-height: 40px; }
  .tabs { flex-direction: column; }
}

/* Toque: hover "cola" em tela sensível ao toque — desliga o efeito e usa :active */
@media (hover: none) and (pointer: coarse) {
  .btn:hover, .calculate-btn:hover, .result-card:hover,
  .tab-btn:hover, button[type="submit"]:hover { transform: none !important; }
  .btn:active, .calculate-btn:active, button[type="submit"]:active { transform: scale(0.97) !important; }
  .form-group input:focus, .form-group select:focus { font-size: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}
