/* ============================================
   RESPONSIVIDADE - TABLET (até 992px)
   ============================================ */
@media (max-width: 992px) {
    :root {
        --espaco-secao: 60px;
    }

    .hero-titulo {
        font-size: 2.6rem;
    }

    .hero-conteudo {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .hero-descricao {
        margin-left: auto;
        margin-right: auto;
    }

    .hero-botoes {
        justify-content: center;
    }

    .hero-imagem {
        order: -1;
    }

    .hero-imagem img {
        max-width: 300px;
    }

    .sobre-conteudo {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .secao-titulo {
        font-size: 2rem;
    }

    /* Carrossel: 3 banners por tela */
    .cartao-produto {
        min-width: calc(33.333% - 17px);
    }

    .contato-grid {
        grid-template-columns: 1fr;
        max-width: 500px;
        margin: 0 auto;
    }

    .rodape-conteudo {
        grid-template-columns: 1fr 1fr;
        gap: 30px;
    }
}

/* ============================================
   RESPONSIVIDADE - CELULAR (até 768px)
   ============================================ */
@media (max-width: 768px) {
    /* Menu Mobile */
    .botao-menu-mobile {
        display: block;
    }

    .menu-navegacao {
        position: fixed;
        top: 0;
        right: -100%;
        width: 75%;
        max-width: 300px;
        height: 100vh;
        background-color: var(--azul-escuro);
        padding: 100px 30px 30px;
        transition: right 0.4s ease;
        box-shadow: -10px 0 30px rgba(0, 0, 0, 0.3);
        z-index: 999;
    }

    .menu-navegacao.ativo {
        right: 0;
    }

    .menu-navegacao ul {
        flex-direction: column;
        gap: 0;
    }

    .menu-navegacao ul li {
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }

    .link-menu {
        display: block;
        padding: 18px 0;
        font-size: 1.1rem;
    }

    .link-menu::after {
        display: none;
    }

    /* Hero */
    .hero {
        padding: 130px 0 100px;
    }

    .hero-titulo {
        font-size: 2rem;
    }

    .hero-descricao {
        font-size: 1rem;
    }

    .hero-botoes {
        flex-direction: column;
        width: 100%;
    }

    .botao {
        width: 100%;
        justify-content: center;
        padding: 14px 24px;
    }

    /* Sobre */
    .secao-titulo {
        font-size: 1.7rem;
    }

    /* Carrossel: 2 banners por tela */
    .carrossel-wrapper {
        gap: 10px;
    }

    .carrossel-botao {
        width: 42px;
        height: 42px;
        min-width: 42px;
        font-size: 0.95rem;
    }

    .cartao-produto {
        min-width: calc(50% - 13px);
    }

    /* Contato */
    .contato-card {
        padding: 30px 20px;
    }

    /* Rodapé */
    .rodape-conteudo {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 35px;
    }

    .rodape-coluna ul {
        align-items: center;
    }

    .rodape-redes {
        justify-content: center;
    }

    .rodape-logo {
        margin: 0 auto 15px;
    }

    /* Botão WhatsApp */
    .botao-whatsapp-flutuante {
        width: 58px;
        height: 58px;
        font-size: 1.7rem;
        bottom: 20px;
        right: 20px;
    }

    .whatsapp-tooltip {
        display: none;
    }
}

/* ============================================
   RESPONSIVIDADE - CELULAR PEQUENO (até 480px)
   ============================================ */
@media (max-width: 480px) {
    .hero-titulo {
        font-size: 1.7rem;
    }

    .hero-etiqueta {
        font-size: 0.8rem;
        padding: 6px 15px;
    }

    .secao-titulo {
        font-size: 1.5rem;
    }

    .secao-descricao {
        font-size: 1rem;
    }

    .carrossel-botao {
        width: 38px;
        height: 38px;
        min-width: 38px;
    }

    /* Carrossel: 1 banner + "espiadinha" do próximo */
    .cartao-produto {
        min-width: 78%;
    }
}