/* =========================================
   HOME (MOBILE) - FINAL
   Arquivo: /assets/css/mobile/home.css
   ========================================= */

@media (max-width: 1024px) {

    /* =========================================
       1. SLIDER PRINCIPAL (CORRIGIDO)
       ========================================= */
    
    .site-slider-section {
        width: 100%;
        /* Altura automática baseada na proporção da imagem */
        height: auto; 
        min-height: auto;
        top: 0px;
        
        /* Proporção exata da imagem (1920x1011) */
        aspect-ratio: 1920 / 1011; 
        
        background: #000;
        position: relative; /* Importante para segurar os absolutes dentro */
    }

    /* Sombra mais suave no mobile */
    .site-slider-section::after {
        height: 50%;
        background: linear-gradient(to top, var(--cor-background-video) 0%, transparent 100%);
    }

    .home-slide {
        /* VOLTA A SER ABSOLUTO PARA EMPILHAR UM EM CIMA DO OUTRO */
        position: absolute; 
        top: 0; left: 0;
        width: 100%;
        height: 100%;
        
        /* Garante que o efeito de fade do PC continue funcionando */
        opacity: 0;
        transition: opacity 1s ease-in-out;
        z-index: 1;
    }

    /* Garante que o slide ativo apareça */
    .home-slide.active {
        opacity: 1;
        z-index: 2;
    }

    .slide-image-wrapper,
    .slide-image-wrapper img {
        width: 100%;
        height: 100%;
        object-fit: cover; 
    }

    /* Ajuste dos Textos */
    .slide-content {
        padding-left: 20px;
        padding-right: 20px;
        top: 50%;
        transform: translateY(-50%);
        width: 100%;
        box-sizing: border-box;
        z-index: 11;
    }

    .slide-rich-text h1, 
    .slide-rich-text h2 {
        font-size: 24px; 
        margin-bottom: 5px;
        line-height: 1.2;
        text-shadow: 0 2px 10px rgba(0,0,0,0.8); /* Sombra mais forte no texto para ler em cima da imagem */
    }

    .slide-rich-text p {
        display: none; /* Esconde texto longo no mobile para limpar a visão */
    }

    .diagonal-shape { display: none; }
    .slider-nav { display: none; }

    /* =========================================
       2. VÍDEO INSTITUCIONAL
       ========================================= */
    .webserie-section {
        padding: 50px 0;
    }

    .webserie-container {
        flex-direction: column; /* Empilha um embaixo do outro */
        padding: 0 20px;
        gap: 30px;
    }

    .webserie-text {
        flex: auto;
        width: 100%;
        text-align: center; /* Centraliza texto no mobile */
    }

    .webserie-text h2 { font-size: 32px; }
    
    .webserie-media-wrapper {
        flex: auto;
        width: 100%;
        max-width: 100%;
        min-width: auto;
    }
    
    .responsive-video-box {
        box-shadow: 0 10px 20px rgba(0,0,0,0.3);
    }


    /* =========================================
       3. PARCEIROS (FORMULÁRIO)
       ========================================= */
    .parceiros-home-novo {
        padding: 50px 0;
    }

    .content-wrapper {
        flex-direction: column;
        padding: 0 20px;
        gap: 40px;
    }

    .left-info {
        justify-content: center;
        width: 100%;
    }

    .img-titulo-fixa {
        width: 280px; /* Imagem menor */
        max-width: 100%;
    }

    .right-form {
        width: 100%;
        max-width: 100%;
        padding: 25px;
    }

    /* Inputs Mobile */
    .input-box { height: 50px; margin-bottom: 15px; }
    .form-select { font-size: 14px; }
    .btn-encontrar { height: 50px; font-size: 14px; }
    .btn-encontrar span { font-size: 16px; }
}