/* --- TABLETS & LAPTOPS PEQUENOS (Abaixo de 992px) --- */
@media (max-width: 992px) {
    section { padding: 80px 0; }

    /* Força o empilhamento de todas as grids principais */
    .hero-grid, 
    .footer-grid, 
    .portfolio-grid,
    .metodologia-grid,
    .cards-grid {
        grid-template-columns: 1fr !important;
        gap: 40px;
    }

    /* Hero: Imagem primeiro para impacto, texto depois */
    .hero-text {
        text-align: center;
        order: 2;
    }

    .hero-visual {
        order: 1;
        max-width: 320px;
        margin: 0 auto 20px;
    }

    .hero-text h1 {
        font-size: 2.8rem;
    }

    .hero-btns {
        display: flex;
        justify-content: center;
    }

    /* Navegação */
    .nav-desktop { display: none; }
    .menu-toggle { display: flex; }

    /* Formulário Mobile */
    .input-row {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .footer-info {
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .footer-form-area {
        padding: 30px 20px;
        margin-top: 10px;
    }
}

/* --- SMARTPHONES (Abaixo de 600px) --- */
@media (max-width: 600px) {
    .container {
        padding: 0 25px;
    }

    .hero-text h1 {
        font-size: 2.2rem;
    }

    .section-title {
        font-size: 1.8rem;
        margin-bottom: 40px;
    }

    /* Botões em bloco para facilitar o toque */
    .btn-primary, .btn-submit {
        width: 100%;
        text-align: center;
        padding: 18px;
    }

    /* Cards e Portfólio */
    .card {
        padding: 35px 25px;
    }

    .portfolio-item {
        height: 320px;
    }

    .port-info {
        opacity: 1;
        background: linear-gradient(to top, rgba(2, 6, 23, 1) 30%, transparent 100%);
        padding: 25px;
    }

    .port-info h4 {
        font-size: 1.4rem;
    }

    /* Elementos Flutuantes */
    .whatsapp-btn {
        width: 55px;
        height: 55px;
        bottom: 20px;
        right: 20px;
        font-size: 26px;
    }

    .step-number {
        font-size: 3.5rem;
        top: -10px;
    }
}

/* --- TELAS ULTRA PEQUENAS (iPhone SE / Outros) --- */
@media (max-width: 380px) {
    .hero-text h1 {
        font-size: 1.8rem;
    }

    .badge {
        font-size: 0.7rem;
    }
    
    .site-header .logo {
        height: 35px;
    }
}

/* --- FIX LANDSCAPE --- */
@media (max-height: 500px) and (orientation: landscape) {
    #hero { padding: 120px 0 60px; }
    .mobile-menu-overlay ul li { margin: 15px 0; }
    .mobile-nav-links a { font-size: 1.2rem; }
}