/* ═══════════════════════════════════════════════════════
   DROGARIA PAGUE BEM — 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:12.5px; }

  .stats-grid { grid-template-columns: repeat(2,1fr); }
  .stat-item:nth-child(2)::after { display:none; }
  .stat-item:nth-child(3), .stat-item:nth-child(4) { border-top: 1px solid rgba(255,255,255,.22); padding-top: 22px; margin-top: 6px; }

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

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

  .faq-inner { grid-template-columns: 1fr; gap: 40px; }
  .faq-sidebar { position: static; text-align: center; }
  .faq-sidebar .section-tag { display: inline-flex; }
  .faq-sidebar .btn { margin: 0 auto; }

  .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; }
}

/* ── 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: 50px; padding-left: 50px; }
  .top-bar-item { font-size: 11.5px; }

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

  /* Hero */
  .hero-slide img { object-position: center; }
  .hero-arrow { width: 36px; height: 36px; }
  .hero-arrow-prev { left: 10px; }
  .hero-arrow-next { right: 10px; }

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

  /* Sobre */
  #sobre { padding: 56px 0; }
  .sobre-pilares { grid-template-columns: 1fr; }
  .sobre-card { padding: 32px 24px; }
  .sobre-quote { font-size: 18px; }

  /* Diferenciais - vira carrossel horizontal no mobile */
  #diferenciais { padding: 56px 0; }
  #diferenciais .container { padding-right: 0; }
  .diferenciais-header { padding-right: 16px; margin-bottom: 36px; }
  .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(--cinza-50),transparent); pointer-events:none; z-index:2; }
  .diferenciais-grid { display: flex; grid-template-columns: none; gap: 14px; padding: 4px 16px 16px 0; overflow-x: auto; scrollbar-width: none; scroll-behavior: auto; }
  .diferenciais-grid::-webkit-scrollbar { display: none; }
  /* Cards do carrossel ignoram reveal (todos visíveis lado a lado) */
  .diferenciais-grid .diferencial-card.reveal,
  .diferenciais-grid .diferencial-card.reveal-left,
  .diferenciais-grid .diferencial-card.reveal-right { opacity:1; transform:none; }
  .diferencial-card { flex: 0 0 240px; padding: 22px 18px; }
  .diferencial-icon { width: 56px; height: 56px; }
  .diferencial-icon img { width: 32px; height: 32px; }
  .diferencial-title { font-size: 14.5px; }
  .diferencial-desc { font-size: 12.5px; }

  /* Avaliações */
  #avaliacoes { padding: 56px 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; }

  /* FAQ */
  #faq { padding: 56px 0; }
  .faq-sidebar-title { font-size: 28px; }
  .faq-question { padding: 16px 18px; font-size: 13.5px; }
  .faq-answer-inner { padding: 0 18px 18px; font-size: 13px; }

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

  /* CTA */
  #cta-final { padding: 64px 0; }

  /* 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 */
  .wpp-float { width: 54px; height: 54px; bottom: 18px; right: 18px; }
}

/* ── SMALL MOBILE 480px ────────────────────────────────── */
@media (max-width:480px) {
  .stats-grid { grid-template-columns: 1fr 1fr; }
  .stat-item { padding: 12px 8px; }
  .stat-number { font-size: 24px; }
  .stat-label { font-size: 11.5px; }

  .diferencial-card { flex: 0 0 220px; }

  .sobre-quote { font-size: 17px; }
  .sobre-quote-mark { font-size: 64px; }

  .cta-headline { font-size: 26px; }
  .cta-headline span { padding: 0 8px; }
}

/* ── SMALL 380px ───────────────────────────────────────── */
@media (max-width:380px) {
  .section-title { font-size: 24px; }
  .nav-logo img { height: 32px; }
  .nav-cta span { display: none; }
  .nav-cta { padding: 9px 12px; }
  .avaliacao-card { flex: 0 0 250px; }
  .top-bar-item { font-size: 11px; }
  .top-bar-track { gap: 35px; padding-left: 35px; }
}