/* ==========================================================================
   FAS IMÓVEIS - RESPONSIVIDADE MULTI-DISPOSITIVO (FINAL)
   ========================================================================== */

/* Tablets e Notebooks Médios */
@media (max-width: 1024px) {
    
    /* Garante que o botão apareça */
    .menu-trigger { 
        display: block !important; 
        cursor: pointer !important;
        background: none !important;
        border: none !important;
        font-size: 2.5rem !important;
        color: var(--dark) !important;
    }
    
    /* A LÓGICA DO MENU: */
    /* 1. Removemos qualquer display que conflite vindo do style.css */
    /* 2. Forçamos o estado inicial (escondido) */
    .nav-menu { 
        display: flex !important; 
        position: fixed !important; 
        top: 80px !important; 
        left: -100% !important; 
        width: 100% !important; 
        height: calc(100vh - 80px) !important; 
        background: #ffffff !important; 
        flex-direction: column !important; 
        gap: 2rem !important; 
        padding: 3rem 2rem !important; 
        transition: left 0.4s ease !important; 
        z-index: 9999 !important; 
        border-top: 1px solid #eee !important;
    }
    
    /* 3. A classe active fornecida pelo seu JS agora tem poder total */
    .nav-menu.active { 
        left: 0 !important; 
    }
    
    .nav-link { 
        color: var(--dark) !important; 
        font-size: 1.5rem !important; 
        font-weight: 600 !important; 
    }

    .busca-container-box { margin: -2rem 1rem 0 1rem !important; padding: 1.5rem !important; }
    .busca-form-grid { grid-template-columns: repeat(2, 1fr) !important; }
    .busca-form-grid .btn-fas { grid-column: span 2 !important; }
    
    .footer-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 2rem !important; }
    .detalhes-grid-layout { grid-template-columns: 1fr !important; }
}

/* Dispositivos Móveis */
@media (max-width: 768px) {
    /* Ajustes Gerais */
    .section-spacer { padding: 3rem 1rem !important; }
    .section-header .titulo { font-size: 1.75rem !important; }
    .hero-home { height: 50vh !important; }
    .hero-title { font-size: 1.75rem !important; padding: 0 1rem; }
    
    /* Layouts e Grids */
    .header-container { 
        padding: 10px 15px !important; 
        justify-content: space-between !important; 
    }
    
    .logo-container { 
        height: 90px !important; 
        justify-content: flex-start !important; 
    }
    
    .logo-container img { 
        height: 150% !important; 
        width: auto !important; 
        object-fit: contain !important; 
    }
    
    .grid-imoveis, .grid-home { 
        grid-template-columns: 1fr !important; 
        gap: 20px !important; 
        padding: 0 10px !important; 
    }
    
    .busca-form-grid { grid-template-columns: 1fr !important; }
    .busca-form-grid .btn-fas { grid-column: span 1 !important; }
    
    /* Footer */
    .footer-grid { grid-template-columns: 1fr !important; text-align: center !important; gap: 2rem !important; }
    .footer-bottom { flex-direction: column !important; gap: 1rem !important; text-align: center !important; padding-top: 1rem !important; }
    
    /* Contato */
    .contato-split { grid-template-columns: 1fr !important; gap: 2rem !important; }
    
    /* Imagens Globais */
    img { max-width: 100% !important; height: auto !important; }
}

/* Ajuste específico para celulares muito pequenos */
@media (max-width: 480px) {
    .section-spacer { padding: 2rem 0.5rem !important; }
    .nav-link { font-size: 1.25rem !important; }
    .btn-fas { padding: 10px 15px !important; font-size: 0.9rem !important; }
}


/* Ajuste para aproximar miniaturas da imagem principal */
    .galeria-detalhes-container { margin-bottom: 1rem !important; }
    
    .main-img-container { 
        height: 300px !important; /* Reduz a altura da imagem principal no mobile */
        margin-bottom: 0.5rem !important; /* Reduz o espaço entre a imagem e as miniaturas */
    }
    
    #detalhe-miniaturas { 
        padding: 5px 0 !important; /* Diminui o padding interno das miniaturas */
        gap: 8px !important; /* Diminui o espaçamento entre as miniaturas */
    }