/* ═══════════════════════════════════════════════════════
   RIOFIX B2B — RESPONSIVE.CSS
   Breakpoints: 1024px · 768px · 480px · 380px
   ═══════════════════════════════════════════════════════ */

/* ── TABLET 1024px ─────────────────────────────────────── */
@media (max-width:1024px) {
  .nav-menu { display:none; }
  .nav-toggle { display:flex; }
  .nav-cta { padding:10px 16px; font-size:11px; }

  .stats-grid { grid-template-columns: repeat(2,1fr); }
  .stat-item:nth-child(2)::after { display:none; }
  .distribuidor-destaque { flex-direction:column; text-align:center; padding:20px; }
  .distribuidor-texto { font-size:13px; }

  .sobre-inner { grid-template-columns: 1fr; gap: 48px; }
  .sobre-visual { max-width: 560px; margin: 0 auto; }

  .diferenciais-grid { grid-template-columns: repeat(2,1fr); }

  .fq-grid { grid-template-columns: 1fr; gap: 48px; }
  .fq-side { position: static; align-items: center; text-align: center; }

  .localizacao-grid { grid-template-columns: 1fr; }

  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .footer-brand { grid-column: 1 / -1; }

  .cta-inner { grid-template-columns: 1fr; text-align: center; gap: 32px; }
  .cta-sub { margin: 0 auto 22px; }
  .cta-badges { justify-content: center; }

  .cert-block { gap: 48px; }
}

/* ── MOBILE 768px ──────────────────────────────────────── */
@media (max-width:768px) {
  :root { --nav-h: 60px; --top-bar-h: 34px; --header-h: 94px; }
  .container { padding: 0 16px; }

  /* Top bar */
  .top-bar-track { gap: 48px; padding-left: 48px; }
  .top-bar-item { font-size: 11px; }

  /* Navbar */
  .nav-main { padding: 0 16px; gap: 12px; }
  .nav-logo img { height: 36px; }

  /* Hero */
  .hero-arrow { width: 34px; height: 34px; }
  .hero-arrow-prev { left: 8px; }
  .hero-arrow-next { right: 8px; }

  /* Stats */
  #stats { padding: 24px 0; }

  /* Sobre */
  #sobre { padding: 64px 0; }
  .sobre-pilares { grid-template-columns: 1fr; }
  .sobre-card { padding: 30px 22px; }
  .sobre-quote { font-size: 17px; }

  /* Diferenciais — carrossel horizontal */
  #diferenciais { padding: 64px 0; }
  #diferenciais .container { padding-right: 0; }
  .diferenciais-header { padding-right: 16px; margin-bottom: 32px; }
  .diferenciais-track-wrap { position: relative; }
  .diferenciais-track-wrap::after { content:''; position:absolute; top:0; right:0; bottom:0; width:40px; background:linear-gradient(to left,var(--preto),transparent); pointer-events:none; z-index:2; }
  .diferenciais-grid { display: flex; grid-template-columns: none; gap: 12px; padding: 4px 16px 16px 0; overflow-x: auto; scrollbar-width: none; }
  .diferenciais-grid::-webkit-scrollbar { display: none; }
  .diferenciais-grid .diferencial-card.reveal,
  .diferenciais-grid .diferencial-card { opacity:1; transform:none; }
  .diferencial-card { flex: 0 0 220px; padding: 20px 16px; }

  /* Clientes */
  #clientes { padding: 56px 0; }
  #clientes .container { padding-right: 0; }
  .clientes-track-wrap::before, .clientes-track-wrap::after { display: block; }
  .clientes-track { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; scrollbar-width: none; padding: 8px 16px 16px 0; }
  .clientes-track::-webkit-scrollbar { display: none; }
  .cliente-item { flex: 0 0 160px; height: 80px; }
  .cliente-item { flex: 0 0 140px; height: 72px; }

  /* Avaliações */
  #avaliacoes { padding: 64px 0; }
  .avaliacao-card { flex: 0 0 280px; padding: 18px; }
  .avaliacoes-track-wrap::before, .avaliacoes-track-wrap::after { width: 40px; }
  .avaliacoes-score-big { font-size: 36px; }

  /* Certificação */
  #certificacao { padding: 64px 0; }
  .cert-block { flex-direction: column !important; align-items: center !important; text-align: center !important; gap: 32px !important; }
  .cert-block__text { max-width: 100% !important; flex: none !important; }
  .cert-block__qualidade { display: none !important; }
  .cert-block__selo { width: 140px !important; flex: none !important; }

  /* FAQ */
  #faq { padding: 64px 0; }
  .fq-grid { grid-template-columns: 1fr !important; gap: 40px !important; }
  .fq-side { position: static !important; align-items: center !important; text-align: center !important; }
  .fq-subtitle { text-align: center !important; }
  .fq-q { font-size: 13.5px; padding: 18px 20px; }
  .fq-a { padding: 0 20px 20px; font-size: 13px; }

  /* Localização */
  #localizacao { padding: 64px 0; }
  .loja-info { padding: 22px 18px; }
  .contato-card { padding: 26px 20px; }

  /* CTA */
  #catalogo .catalogo-grid{grid-template-columns:1fr !important;}
  #cta-final { padding: 80px 0; }
  #cta-final .cta-inner { display:flex !important; flex-direction:column !important; align-items:center !important; text-align:center !important; gap:32px !important; }
  #cta-final .cta-headline { text-align:center !important; }
  #cta-final .cta-sub { text-align:center !important; margin-left:auto !important; margin-right:auto !important; }
  #cta-final .cta-badges { justify-content:center !important; flex-wrap:wrap !important; }
  #cta-final .cta-actions { width:100% !important; align-items:center !important; }
  #cta-final .cta-actions .btn { width:100% !important; justify-content:center !important; }
  .cta-headline { font-size: 26px; }

  /* Footer */
  #footer { padding: 48px 0 24px; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; text-align: center; padding-bottom: 28px; }
  .footer-brand { display: flex; flex-direction: column; align-items: center; }
  .footer-brand p { max-width: none; }
  .footer-socials { justify-content: center; }
  .footer-contact-item { justify-content: flex-start; text-align: left; }
  .footer-bottom { flex-direction: column; text-align: center; gap: 12px; padding-top: 20px; }

  .wpp-float { width: 52px; height: 52px; bottom: 18px; right: 18px; }
}

/* ── SMALL 480px ───────────────────────────────────────── */
@media (max-width:480px) {
  .stats-grid { grid-template-columns: 1fr 1fr; }
  .stat-number { font-size: 24px; }
  .sobre-quote { font-size: 16px; }
  .cta-headline { font-size: 23px; }
}

/* ── SMALL 380px ───────────────────────────────────────── */
@media (max-width:380px) {
  .section-title { font-size: 22px; }
  .nav-logo img { height: 30px; }
  .nav-cta span { display: none; }
  .nav-cta { padding: 9px 12px; }
  .avaliacao-card { flex: 0 0 252px; }
}

/* ── CENTRALIZAÇÃO GLOBAL MOBILE ─────────────────────────────────────── */
@media (max-width: 768px) {
  /* Todos os botões centralizados */
  .btn, .btn-verde, .btn-outline, .btn-preto, .btn-amarelo, .btn-lg {
    display: flex !important;
    justify-content: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }
  /* Grupos de botões em coluna centralizada */
  .hero-actions, .cta-actions, .sobre-actions, .faq-actions {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    gap: 12px !important;
  }
  /* Section tags centralizadas */
  .section-tag {
    display: flex !important;
    width: fit-content !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  /* Textos centralizados globalmente */
  .section-title, .section-subtitle, .prod-intro h2, .prod-intro p {
    text-align: center !important;
  }
}