/* ============================================================
   1. DESKTOP E TELAS GRANDES (Acima de 992px)
   ============================================================ */

/* Configuração Geral do Banner Desktop */
.hero-section {
    height: 591px;
    display: flex;
    align-items: center;
}

@media (min-width: 992px) {
    .form-fixed-overlay {
        position: absolute !important;
        top: 0;
        z-index: 100;
        width: 100%;
        height: 591px; /* Mesma altura do banner */
        margin-top: 0 !important; 
        pointer-events: none;
    }

    .form-fixed-overlay .container, 
    .form-fixed-overlay .row {
        height: 100%;
        align-items: center;
    }

    .form-overlay {
        pointer-events: auto;
    }

    .form-fixed-overlay .col-lg-4 {
        width: 450px !important;
        flex: 0 0 auto !important;
        margin-left: auto !important;
    }

    .responsive-title { font-size: 2.5rem !important; }
    .responsive-lead { font-size: 1.5rem !important; }
}

/* Telas Ultra-Wide e Ajustes Intermediários Desktop */
@media (max-width: 1399px) and (min-width: 992px) {
    .form-fixed-overlay .container {
        max-width: 100% !important;
        padding-right: 50px;
    }
}

@media (min-width: 1400px) {
    .responsive-title { font-size: 2.5rem !important; }
    .responsive-lead { font-size: 1.5rem !important; }
}

/* ============================================================
   2. CONSOLIDAÇÃO MOBILE (Abaixo de 991px)
   ============================================================ */

@media (max-width: 991px) {
    
    /* Reset do Container: Removemos alturas automáticas e fixamos para o carrossel */
    #home, .carousel-inner, .carousel-item { 
        height: 500px !important; 
        min-height: 500px !important;
    }

    /* CENTRALIZAÇÃO INTELIGENTE: 
       Isso substitui todas as margens negativas (text-space e banner-mobile) */
    .carousel-item .container {
        height: 100%;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important; /* Centraliza verticalmente na imagem */
        align-items: center !important;     /* Centraliza horizontalmente */
        text-align: center !important;
    }

    /* Limpeza total de resíduos de margens que quebravam o layout */
    .text-space, .banner-mobile {
        margin-top: 0 !important;
        padding-top: 0 !important;
        width: 100%;
    }

    /* Ajuste da Imagem de Fundo */
    .hero-bg-img {
        object-position: 70% center; /* Mantém o rosto/foco à direita */
    }

    .hero-overlay { 
        background: linear-gradient(180deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.3) 100%) !important; 
    }

    /* --- Tipografia Mobile Progressiva --- */
    .responsive-title { 
        font-size: 2.1rem !important; 
        line-height: 1.2;
        margin-bottom: 1rem !important;
    }

    .responsive-lead { 
        font-size: 1.1rem !important;
        margin-bottom: 2rem !important;
    }
    .object-layer{
        display:none !important;
        }

    /* Resolução Tablets e Fones Largos (Até 768px) */
    @media (max-width: 768px) {
        .responsive-title { font-size: 1.8rem !important; }
    }

    /* Resolução Média e Pequena (Abaixo de 493px) */
    @media (max-width: 493px) {
        .responsive-title { font-size: 1.5rem !important; }
        .responsive-lead { font-size: 1rem !important; }
    }

    /* AJUSTE CRÍTICO: Celulares muito pequenos (< 455px) */
    @media (max-width: 455px) {
        #home, .carousel-inner, .carousel-item { 
            height: 460px !important; /* Reduzimos a altura total para o texto não "sumir" */
        }
        .responsive-title { font-size: 1.4rem !important; }
        
        /* Em vez de margem, usamos transform para subir o bloco levemente se necessário */
        .banner-mobile {
            transform: translateY(-10px);
        }
        
        .hero-section .btn {
            padding: 12px 24px !important;
            font-size: 0.9rem !important;
        }
    }

    /* --- FORMULÁRIO MOBILE (Abaixo do Banner) --- */
    .form-fixed-overlay {
        position: relative !important;
        top: 0 !important;
        height: auto !important;
        background-color: #f8fafc;
        padding: 40px 0;
        pointer-events: auto !important;
        margin-top: 0 !important;
    }

    .form-fixed-overlay .container, .form-fixed-overlay .row {
        height: auto !important;
    }

    .form-overlay {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .form-fixed-overlay .col-lg-4 {
        margin-left: 0 !important;
        width: 100% !important;
    }

    .titulo-form { padding-bottom: 30px; }
}

/* iPhone SE e telas < 350px */
@media (max-width: 350px) {
    #home, .carousel-inner, .carousel-item { height: 420px !important; }
    .responsive-title { font-size: 1.2rem !important; }
}
/* --- Ajuste Fino para Desktop Pequeno / Tablets em Paisagem --- */
@media (max-width: 1200px) and (min-width: 992px) {
    
    /* Força o container a alinhar o conteúdo no topo e não no centro */
    .form-fixed-overlay .row,
    .hero-section .row {
        align-items: flex-start !important; 
        padding-top: 30px; /* Ajuste este valor para subir ou descer o bloco todo */
    }

    /* Ajuste do Título para não ficar colado no topo */
    .responsive-title {
        font-size: 2.2rem !important;
        margin-top: -60px !important;
    }

    /* Garante que o formulário também suba acompanhando o texto */
    .form-fixed-overlay {
        padding-top: 60px !important;
    }
    
    /* Opcional: Diminuir um pouco a altura do banner nessa faixa para compactar */
    #home, .hero-section, .form-fixed-overlay {
        height: 520px !important; 
    }
}

    @media (max-width: 1399px) and (min-width: 992px) {
        .object-layer{
        width: 100% !important;
        }
            .object-entrance-wrapper {

        right: 5%; /* Ajuste a posição lateral aqui */
    }
}

    @media (max-width: 1200px) and (min-width: 992px) {
        .object-layer{
        width: 85% !important;
        }
            .object-entrance-wrapper {

        right: -5%; /* Ajuste a posição lateral aqui */
    }
}