/* ============================================================
   RIOFIX — RESPONSIVE.CSS  (reescrito e limpo)
   ============================================================ */

/* --- TABLET (max 1024px) ----------------------------------- */
@media (max-width: 1024px) {

  :root { --section-pad: 72px 0; }

  .hero-content          { grid-template-columns: 1fr; gap: 48px; }
  .hero-form-card        { max-width: 520px; }

  .stats-grid            { grid-template-columns: repeat(3, 1fr); gap: 0; }
  .stat-item:nth-child(3)::after { display: none; }

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

  .steps-container       { grid-template-columns: repeat(2, 1fr); gap: 40px; }
  .steps-container::before { display: none; }

  .segments-grid         { grid-template-columns: repeat(3, 1fr); }

  .chumbador-inner       { grid-template-columns: 1fr; gap: 48px; }
  .chumbador-visual      { height: 340px; }

  .faq-inner             { grid-template-columns: 1fr; gap: 40px; }
  .faq-sidebar           { position: static; }

  .footer-grid           { grid-template-columns: 1fr 1fr; gap: 40px; }
}

/* --- MOBILE (max 768px) ------------------------------------ */
@media (max-width: 768px) {

  :root { --section-pad: 56px 0; }

  /* ── Navbar ─────────────────────────────────────────────── */
  .nav-links    { display: none; }
  .nav-cta      { display: none; }
  .nav-hamburger { display: flex; }
  .nav-inner    { padding: 0 20px; }

  .nav-mobile-open .nav-links {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 72px; left: 0; right: 0;
    background: var(--black);
    padding: 24px 24px 32px;
    border-bottom: 1px solid var(--gray-border);
    gap: 0;
    z-index: 999;
  }
  .nav-mobile-open .nav-links a {
    padding: 14px 0;
    border-bottom: 1px solid var(--gray-border);
    font-size: 15px;
  }
  .nav-mobile-open .nav-links a:last-child { border-bottom: none; }
  .nav-mobile-open .nav-cta {
    display: block;
    padding: 0 24px 24px;
    position: fixed;
    bottom: 0; left: 0; right: 0;
    background: var(--black);
    z-index: 999;
  }
  .nav-mobile-open .nav-cta .btn { width: 100%; justify-content: center; }

  /* ── Container ───────────────────────────────────────────── */
  .container { padding: 0 16px; }

  /* ── Textos e section-tags centralizados no mobile ────────── */
  .section-title,
  .section-subtitle {
    text-align: center;
  }
  .section-subtitle {
    margin-left: auto;
    margin-right: auto;
  }
  .section-tag {
    display: flex;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
    font-size: 11px;
  }

  /* ── Hero — textos centralizados ─────────────────────────── */
  #hero               { padding: 100px 0 60px; }
  .hero-content       { gap: 40px; }
  .hero-text          { text-align: center; }
  #hero .hero-text h1.headline     { text-align: center !important; }
  #hero .hero-text p.hero-subtext  { font-size: 16px; max-width: 100%; margin-left: auto; margin-right: auto; text-align: center !important; }
  .hero-trust         { justify-content: center; }
  .hero-actions       { flex-direction: column; align-items: stretch; }
  .hero-actions .btn  { justify-content: center; }

  /* ── Stats ───────────────────────────────────────────────── */
  .stats-grid                    { grid-template-columns: repeat(2, 1fr); }
  .stat-item:nth-child(2)::after { display: none; }
  .stat-item:nth-child(4)::after { display: none; }
  .stat-item:nth-child(5) {
    grid-column: 1 / -1;
    border-top: 1px solid var(--gray-border);
  }
  .stat-item:nth-child(5)::after { display: none; }

  /* ── Produtos ────────────────────────────────────────────── */
  .products-grid   { grid-template-columns: 1fr; }

  /* ── Diferenciais ────────────────────────────────────────── */
  .diferenciais-grid { grid-template-columns: 1fr; }

  /* ── Steps ───────────────────────────────────────────────── */
  .steps-container { grid-template-columns: 1fr; gap: 32px; }

  /* ── Segmentos ───────────────────────────────────────────── */
  .segments-grid { grid-template-columns: repeat(2, 1fr); }

  /* ── Chumbador ───────────────────────────────────────────── */
  .chumbador-visual { height: 260px; }
  .chumbador-inner .reveal-left .btn {
    display: block;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
  }

  /* ── Marcas ──────────────────────────────────────────────── */
  .brand-item { width: 110px; }

  /* ── FAQ ─────────────────────────────────────────────────── */
  .faq-inner { grid-template-columns: 1fr; gap: 32px; }
  .faq-sidebar .btn {
    display: block;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
  }

  /* ── CTA final ───────────────────────────────────────────── */
  #cta { padding: 72px 0; }
  .cta-inner .section-subtitle { font-size: 16px; }
  .cta-inner .btn {
    display: block;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
  }
  .cta-badges { flex-direction: column; gap: 12px; align-items: center; }

  /* ── Certificação mobile — apenas texto + selo centralizado ─ */
  .cert-img-main  { display: none !important; }
  .cert-row {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center;
    gap: 28px;
  }
  .cert-text {
    max-width: 100% !important;
    width: 100% !important;
    flex: none !important;
  }
  .cert-desc { text-align: center; }
  .cert-img-selo {
    flex: none !important;
    width: 160px !important;
    margin: 0 auto;
    animation: float 3s ease-in-out infinite;
  }

  /* ── Footer ──────────────────────────────────────────────── */
  .footer-grid {
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .footer-top-row {
    flex-direction: column;
    align-items: center;
    gap: 32px;
  }

  .footer-brand,
  .footer-brand p,
  .footer-col {
    text-align: center;
  }

  .footer-socials     { justify-content: center; }
  .footer-contact-item { justify-content: center; }

  .footer-links {
    align-items: center;
  }

  .btn-scroll-top {
    align-self: center;
    margin-left: 0;
    margin-top: 0;
  }

  .footer-bottom {
    flex-direction: column;
    text-align: center;
    gap: 8px;
  }

  /* ── Google Maps — ponta a ponta no mobile ──────────────── */
  .map-wrapper {
    width: calc(100% + 32px);
    margin-left: -16px;
    height: 220px;
    border-radius: 0;
  }

  /* ── Form ────────────────────────────────────────────────── */
  .hero-form-card { padding: 28px 20px; }
}

/* --- SMALL MOBILE (max 480px) ------------------------------ */
@media (max-width: 480px) {

  .segments-grid  { grid-template-columns: 1fr 1fr; }
  .stats-grid     { grid-template-columns: 1fr 1fr; }
  .hero-form-card { padding: 24px 16px; }
  .nav-logo img   { height: 38px; }
  .faq-question   { padding: 16px 18px; }
  .faq-answer-inner { padding: 14px 18px 16px; }
}

/* ── Animação flutuante do selo no mobile ──────────────────── */
@keyframes float {
  0%, 100% { transform: translateY(0px); }
  50%       { transform: translateY(-12px); }
}