* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
/* trava rolagem horizontal — clip (não overflow:hidden) para não quebrar position:sticky */
html, body { overflow-x: clip; }
html { scroll-behavior: smooth; }
body { background: #fff; color: var(--ink); font-family: var(--font-text); -webkit-font-smoothing: antialiased; }
::selection { background: var(--brad-red); color: #fff; }
a { color: inherit; }
/* mídia nunca estoura a largura */
img, svg, video { max-width: 100%; }
/* ao rolar para âncoras, não deixa o header fixo cobrir o título da seção */
section[id] { scroll-margin-top: 88px; }

@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes chatIn { from { opacity: 0; transform: translateY(16px) scale(0.98); } to { opacity: 1; transform: none; } }
@keyframes chatDot { 0%,60%,100% { opacity: .3; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }

/* responsive */
@media (max-width: 940px) {
  .hero-copy ~ div, .hero-copy { grid-column: auto; }
  [class*="-grid"] { grid-template-columns: 1fr 1fr !important; }
  .reason-grid, .step-grid, .plan-grid, .badge-grid, .stat-grid { grid-template-columns: 1fr 1fr !important; }
}
@media (max-width: 760px) {
  .kit-nav, .kit-phone, .kit-wa-header { display: none !important; }
  /* SolucaoSection: 4 cards empilham em 1 coluna no mobile */
  .sol-cards-grid { grid-template-columns: 1fr !important; }
  section > div > div[style*="grid-template-columns: 1.05fr"],
  .hosp-grid, .corr-grid { grid-template-columns: 1fr !important; }
  [class*="-grid"], .reason-grid, .step-grid, .plan-grid, .badge-grid, .stat-grid, .kit-foot-grid { grid-template-columns: 1fr !important; }
  /* Grade de faixas etárias: mantém 2 colunas no mobile (desejado) */
  .faixas-grid { grid-template-columns: repeat(2, 1fr) !important; }
  /* Hero: empilha e reduz respiro no mobile */
  .hero-grid { padding-top: 44px !important; padding-bottom: 52px !important; gap: 36px !important; }
  /* ritmo vertical menor no mobile (afeta só as <Section>, não Hero/FinalCTA que usam valores literais) */
  :root { --sp-9: 56px; --sp-8: 48px; }
}

/* Modal: grade e-mail + celular empilha em telas muito estreitas */
@media (max-width: 480px) {
  .lead-grid { grid-template-columns: 1fr !important; }
}

/* telas muito estreitas (≤390px): aperta o header para caber logo + "Solicite cotação" sem estourar (o WhatsApp do header já sai em ≤760px; no mobile vale o botão flutuante) */
@media (max-width: 390px) {
  header > div { padding-left: 14px !important; padding-right: 14px !important; gap: 10px !important; }
}

@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
  html { scroll-behavior: auto; }
  /* marquee: para explicitamente para usuários com sensibilidade a movimento */
  .marquee-track { animation: none !important; }
}