/* Media Queries - Responsividade */

/* TABLET */
@media (max-width: 1024px) {
    .hero-content {
        grid-template-columns: 1fr;
        text-align: center;
    }
    
    .hero-text h1 {
        font-size: 3.5rem;
    }
    
    .hero-ctas {
        justify-content: center;
    }
    
    .perfil-grid {
        grid-template-columns: 1fr;
        text-align: center;
    }
    
    .footer-content {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
}

/* MOBILE */
@media (max-width: 768px) {
    nav {
        padding: 1rem;
        flex-direction: column;
        gap: 1rem;
        align-items: center;
    }
    
    .logo {
        font-size: 1.3rem;
        text-align: center;
    }
    
    .cta-header {
        padding: 0.6rem 1.2rem;
        font-size: 0.85rem;
        width: 100%;
        max-width: 250px;
    }
    
    .hero {
        padding: 8rem 1rem 3rem;
        min-height: auto;
    }
    
    .hero-text h1 {
        font-size: 2.2rem;
    }
    
    .hero-text p {
        font-size: 1rem;
    }
    
    .hero-ctas {
        flex-direction: column;
        gap: 1rem;
    }
    
    .btn-primary, .btn-secondary {
        width: 100%;
        text-align: center;
    }
    
    .problema, .como-funciona, .depoimentos, .diferencial {
        padding: 3rem 1rem;
    }
    
    .servicos-adicionais, .quem-desenvolve, .metricas-roi {
        padding: 3rem 1rem;
    }
    
    .problema-header h2, .solucao h2, .como-funciona h2, .depoimentos h2, .diferencial h2, .servicos-adicionais h2, .quem-desenvolve h2, .metricas-roi h2 {
        font-size: 2rem;
    }
    
    .metrica-numero {
        font-size: 3rem;
    }
    
    .perfil-texto h3 {
        font-size: 1.8rem;
    }
    
    .steps {
        gap: 2rem;
    }
    
    .step {
        grid-template-columns: 1fr;
        text-align: center;
    }
    
    .step-number {
        margin: 0 auto;
    }
    
    .cta-final {
        padding: 4rem 1rem;
    }
    
    .cta-final h2 {
        font-size: 2rem;
    }
    
    .cta-final-buttons {
        flex-direction: column;
        gap: 1rem;
    }
    
    .btn-cta-final {
        width: 100%;
    }
}