/* Shared responsive overrides + base for all Conexão Azul home variations */

html, body { margin: 0; padding: 0; background: var(--bg-canvas); overflow-x: hidden; }
body { font-family: var(--font-body); -webkit-font-smoothing: antialiased; }
* { box-sizing: border-box; }
img { max-width: 100%; }

/* Tap-highlight removal + fast touch response */
* { -webkit-tap-highlight-color: transparent; }
a, button { touch-action: manipulation; }
button:focus { outline: none; }
button:focus-visible { outline: 2px solid var(--color-cyan, #2DD2E1); outline-offset: 2px; }

/* ========== RESPONSIVE OVERRIDES ========== */

/* Tablet < 1024 */
@media (max-width: 1023px) {
  /* NavBar: menu mobile (bottom-sheet) ativo em tablet também — evita overflow
     dos links desktop em celulares landscape (768–1023px) que escondia o
     botão hambúrguer fora da viewport.
     NOTA: NÃO usar overflow:hidden na nav, pois o MobileMenu é renderizado
     dentro dela com position:fixed; inset:0 e seria cortado para 60px. */
  .ca-nav { padding: 0 16px !important; height: 60px !important; }
  .ca-nav-links { display: none !important; }
  .ca-nav-entrar { display: none !important; }
  .ca-desktop-only { display: none !important; }
  .ca-mobile-only { display: flex !important; }
  .ca-grid-5 { grid-template-columns: repeat(3, 1fr) !important; }
  .ca-grid-4 { grid-template-columns: repeat(2, 1fr) !important; }
  .ca-grid-3 { grid-template-columns: repeat(2, 1fr) !important; }
  .ca-grid-8 { grid-template-columns: repeat(4, 1fr) !important; }
  .ca-footer-grid { grid-template-columns: 1fr 1fr !important; row-gap: 36px !important; }
  .ca-footer-brand { grid-column: 1 / -1; }
  .ca-cta-grid { grid-template-columns: 1fr !important; gap: 32px !important; }
  .ca-section { padding-left: 24px !important; padding-right: 24px !important; }
  .ca-section-py { padding-top: 72px !important; padding-bottom: 72px !important; }
  .ca-products-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .ca-segments-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .ca-pricing-grid { grid-template-columns: 1fr !important; }
  .ca-agents-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .ca-tabs-content { grid-template-columns: 1fr !important; }
  .ca-editorial-hero { grid-template-columns: 1fr !important; }
}

/* Mobile < 768 */
@media (max-width: 767px) {
  .ca-hero-grid { grid-template-columns: 1fr !important; gap: 48px !important; }
  .ca-grid-2,
  .ca-grid-3,
  .ca-grid-4,
  .ca-grid-5 { grid-template-columns: 1fr !important; }
  .ca-grid-8 { grid-template-columns: repeat(3, 1fr) !important; }
  .ca-stats { grid-template-columns: repeat(2, 1fr) !important; row-gap: 32px !important; }
  .ca-stats .ca-stat:nth-child(odd) { border-left: none !important; }
  .ca-section { padding-left: 20px !important; padding-right: 20px !important; }
  .ca-section-py { padding-top: 64px !important; padding-bottom: 64px !important; }
  .ca-hero-py { padding-top: 40px !important; padding-bottom: 64px !important; }
  .ca-hide-mobile { display: none !important; }
  .ca-hero h1 { font-size: 38px !important; line-height: 1.08 !important; }
  .ca-section h2 { font-size: 28px !important; }
  .ca-stat-num { font-size: 32px !important; }
  .ca-cta-banner { padding: 40px 24px !important; border-radius: 18px !important; }

  /* NavBar mobile: regras de display/padding herdadas do breakpoint <1024 acima. */

  /* Footer: coluna única no mobile */
  .ca-footer-grid { grid-template-columns: 1fr !important; row-gap: 32px !important; }
  .ca-footer-brand { grid-column: 1 / -1 !important; }
  .ca-footer { padding: 48px 20px 100px !important; }
  /* Espaço extra embaixo para a barra flutuante não cobrir o footer */
  .ca-footer-outer { padding: 48px 20px calc(88px + env(safe-area-inset-bottom, 0px)) !important; }

  /* Links do footer: target mínimo de toque */
  .ca-footer-link { display: block; padding: 6px 0 !important; margin-bottom: 4px !important; }

  .ca-omni-channels { grid-template-columns: repeat(3, 1fr) !important; }
  .ca-api-grid { grid-template-columns: 1fr !important; }
  .ca-segments-grid { grid-template-columns: 1fr !important; }
  .ca-products-grid { grid-template-columns: 1fr !important; }
  .ca-pricing-grid { grid-template-columns: 1fr !important; }
  .ca-agents-grid { grid-template-columns: 1fr !important; }
  .ca-testimonials-grid { grid-template-columns: 1fr !important; }
  .ca-case-grid { grid-template-columns: 1fr !important; }
  .ca-how-grid { grid-template-columns: 1fr !important; row-gap: 32px !important; }
  .ca-how-edge { display: none !important; }
  .ca-editorial-hero { grid-template-columns: 1fr !important; gap: 32px !important; }
  .ca-editorial-hero h1 { font-size: 44px !important; }
  .ca-tabs-tablist { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
  .ca-chat-cols { grid-template-columns: 1fr !important; }
}

.ca-mobile-only { display: none; }
