/* ==========================================
   RESPONSIVIDADE GERAL (Telas até 992px)
   ========================================== */
@media (max-width: 992px) {
    section {
        padding: 80px 0 !important;
    }

    /* Hero */
    .hero-grid {
        display: flex !important;
        flex-direction: column !important;
        text-align: center !important;
        gap: 40px !important;
    }

    .hero-content {
        align-items: center !important;
    }

    .description {
        margin: 0 auto !important;
    }

    .hero-mini-stats {
        justify-content: center !important;
        flex-wrap: wrap !important;
        gap: 20px !important;
    }

    .btn-cta {
        margin: 10px auto 0 auto !important;
    }

    .mockup-wrapper {
        height: 380px !important;
        max-width: 500px !important;
        margin: 0 auto !important;
    }

    .laptop-mockup {
        transform: translateX(-20px) !important;
    }

    /* Sobre Nós (Forçar coluna única e organizar imagem em cima) */
    .about-grid {
        display: flex !important;
        flex-direction: column !important;
        text-align: center !important;
        gap: 40px !important;
    }

    .about-image-container {
        order: -1 !important; /* Joga a rosa para cima do texto no celular */
    }

    .about-text {
        align-items: center !important;
    }

    /* Como Funciona */
    .steps-container {
        display: flex !important;
        flex-direction: column !important;
        gap: 20px !important;
    }

    .step-arrow {
        transform: rotate(90deg) !important; /* Gira a seta para apontar para baixo */
        margin: 10px 0 !important;
    }

    /* Grids de Produtos e Recursos */
    .products-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .features-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .faq-grid {
        grid-template-columns: 1fr !important;
    }

    .partner-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 40px !important;
    }
}

/* ==========================================
   RESPONSIVIDADE CELULAR (Telas até 768px)
   ========================================== */
@media (max-width: 768px) {
    /* Forçar títulos a quebrarem corretamente em telas estreitas */
    h1 {
        font-size: 30px !important;
        line-height: 1.25 !important;
    }

    .hero {
        padding: 40px 0 60px 0 !important;
    }

    /* Menu Mobile Hambúrguer */
    .menu-toggle {
        display: block !important;
    }

    nav {
        display: none !important;
        flex-direction: column !important;
        position: absolute !important;
        top: 80px !important;
        left: 0 !important;
        width: 100% !important;
        background-color: rgba(17, 1, 3, 0.98) !important;
        padding: 30px !important;
        border-bottom: 1px solid var(--border-color) !important;
        gap: 20px !important;
        text-align: center !important;
        z-index: 999 !important;
    }

    nav.active {
        display: flex !important;
    }

    .header-wrap .btn-partner {
        display: none !important; /* Oculta botão grande do topo */
    }

    /* Barra de Estatísticas */
    .stats-bar {
        padding: 20px 0 !important;
        margin: 20px 0 !important;
    }

    .stats-bar-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 24px !important;
        text-align: center !important;
    }

    .bar-stat-item {
        border-right: none !important;
        flex-direction: column !important;
        gap: 8px !important;
    }

    /* Grids em coluna única */
    .products-grid {
        grid-template-columns: 1fr !important;
    }

    .product-card {
        grid-column: span 1 !important;
    }

    .features-grid {
        grid-template-columns: 1fr !important;
    }

    /* Letreiro de Depoimentos (Garante o tamanho e impede esmagamento) */
    .testimonial-card {
        width: 290px !important; /* Preserva o tamanho do card no loop contínuo */
    }

    .footer-grid {
        grid-template-columns: 1fr !important;
        gap: 30px !important;
    }
}