/* ==========================================================
   Auto Confiança Motores — breakpoints (mobile first)
   sm 576 · md 768 · lg 992 · xl 1200
   ========================================================== */

@media (min-width: 576px) {
    .busca-grid { grid-template-columns: 1fr 1fr; }
    .busca-botao { grid-column: 1 / -1; }
    .bandeiras { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .comparativo { padding: 32px; }
    .card-faq { padding: 28px 32px; }
    .selo { font-size: 16px; }
}

@media (min-width: 768px) {
    :root { --ac-gutter: 32px; --ac-secao: 96px; }

    .whatsapp-flutuante { right: 24px; bottom: 24px; width: 60px; height: 60px; }

    .hero-bg {
        background-image:
            linear-gradient(0deg, #0B0B0C 0%, rgba(11,11,12,0) 28%),
            linear-gradient(90deg, rgba(11,11,12,.97) 0%, rgba(11,11,12,.9) 38%, rgba(11,11,12,.55) 68%, rgba(11,11,12,.3) 100%),
            url(../imgs/hero-oficina-1920.webp);
    }
    .sobre-bg {
        background-image:
            linear-gradient(180deg, #0B0B0C 0%, rgba(11,11,12,0) 22%, rgba(11,11,12,0) 70%, #0B0B0C 100%),
            linear-gradient(90deg, rgba(11,11,12,.96) 0%, rgba(11,11,12,.88) 45%, rgba(11,11,12,.78) 75%, rgba(11,11,12,.6) 100%),
            url(../imgs/cabecote-motor-1920.webp);
    }
    .busca-bg {
        background-image:
            linear-gradient(0deg, #0B0B0C 0%, rgba(11,11,12,0) 35%),
            linear-gradient(90deg, rgba(11,11,12,.97) 0%, rgba(11,11,12,.9) 45%, rgba(11,11,12,.7) 75%, rgba(11,11,12,.55) 100%),
            url(../imgs/cabecote-motor-1920.webp);
    }
    .modelo-bg {
        background-image:
            linear-gradient(0deg, #0B0B0C 0%, rgba(11,11,12,0) 35%),
            linear-gradient(90deg, rgba(11,11,12,.97) 0%, rgba(11,11,12,.92) 50%, rgba(11,11,12,.8) 100%),
            url(../imgs/cabecote-motor-1920.webp);
    }

    .header-logo img { height: 72px; }
    .header-inner { padding-top: 14px; padding-bottom: 14px; }

    .hero-inner { padding-top: 112px; padding-bottom: 128px; }
    .hero-conteudo { gap: 28px; }
    .hero-sub { font-size: 21px; }

    .busca { padding: 20px; }
    .busca-pagina { padding: 24px; }
    .busca-grid { grid-template-columns: 1fr 1fr auto; }
    .busca-pagina .busca-grid { gap: 16px; }
    .busca-botao { grid-column: auto; }

    .pagina-topo { gap: 32px; padding-top: 72px; padding-bottom: 96px; }
    .pagina-topo-modelo { padding-top: 56px; gap: 40px; }
    .pagina-sub { font-size: 19px; }
    .modelo-sub { font-size: 20px; }
    .modelo-texto { gap: 26px; }

    .cabecalho-lista { margin-bottom: 40px; }
    .cabecalho-centro { margin-bottom: 56px; }

    .pagamento-inner { padding-top: 72px; padding-bottom: 72px; gap: 48px; }
    .pagamento-destaque { flex-direction: row; align-items: center; gap: 36px; }
    .pagamento-12x { font-size: 150px; }

    .cta-inner { padding-top: 80px; padding-bottom: 80px; gap: 40px; }
    .cta .btn-ac-lg { font-size: 21px; padding: 18px 32px; }
    .cta-escuro .cta-inner { padding-top: 88px; padding-bottom: 88px; }

    .secao-destaques { padding: 80px 0; }
    .card-destaque { padding: 32px 28px; }
    .card-destaque-titulo { font-size: 30px; }
    .card-faq h3 { font-size: 23px; }

    .footer-inner { padding-top: 72px; padding-bottom: 40px; }
}

@media (min-width: 992px) {
    :root { --ac-gutter: 48px; --ac-secao: 112px; }

    .gx-ac { --bs-gutter-x: 48px; }

    .comparativo { padding: 40px; }
    .pagamento-bandeiras { width: auto; }
    .bandeiras { grid-template-columns: repeat(2, 180px); }
    .footer-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px; }
    .hero-inner { padding-top: 128px; padding-bottom: 144px; }
    .secao-modelos.secao { padding: 96px 0 112px; }
}

@media (min-width: 1200px) {
    .header-inner { flex-wrap: nowrap; }
    .site-header .navbar-collapse { flex-basis: auto; justify-content: space-between; gap: 32px; }
    .nav-ac { flex-direction: row; flex-wrap: wrap; gap: 30px; padding: 0; margin: 0 auto; }
    .nav-ac a { padding: 6px 0; border-bottom: 0; }
    .header-cta { width: auto; margin-bottom: 0; }
    .gx-ac { --bs-gutter-x: 72px; }
    .pagina-topo-modelo .gx-ac { --bs-gutter-x: 64px; }
}