/* ========================================= */
/*      FOLHA DE ESTILO RESPONSIVA         */
/* ========================================= */

/* === Breakpoint Principal para Tablets e Celulares (Abaixo de 1024px) === */
@media (max-width: 1024px) {
    
    html, body {
        overflow: auto; /* Permite a rolagem do corpo da página se necessário */
        -webkit-overflow-scrolling: touch; /* Melhora a fluidez da rolagem no iOS */
    }

    /* --- AJUSTES GLOBAIS --- */
    :root {
        --padding-horizontal: 30px; /* Reduz o espaçamento lateral geral */
    }

    .slide-content {
        margin-top: 150px;
        max-width: 100%;
        text-align: center; /* Centraliza o texto principal nos slides */
    }

    .slide-content h1 {
        font-size: 2.5em;
    }

    /* --- CABEÇALHO E MENU HAMBURGER --- */
    .main-header .main-nav, .main-header .social-icons {
        display: none;
    }
    .mobile-menu-toggle {
        display: block;
        background: none; border: none; cursor: pointer;
        z-index: 1001; padding: 10px;
    }
    .mobile-menu-toggle .hamburger-line {
        display: block; width: 30px; height: 3px;
        background-color: var(--cor-secundaria);
        margin: 6px 0;
        transition: transform 0.3s ease, opacity 0.3s ease;
    }
    .main-nav { transform: translateX(100%); }
    .mobile-nav-active .main-nav {
        display: flex; flex-direction: column; justify-content: center; align-items: center;
        position: fixed; top: 0; right: 0;
        width: 80%; height: 100vh;
        background-color: rgba(10, 10, 10, 0.9);
        backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px);
        transform: translateX(0%);
        transition: transform 0.4s ease-in-out;
        z-index: 999;
    }
    .main-nav ul { flex-direction: column; text-align: center; gap: 20px; }
    .main-nav ul li a { font-size: 1.8em; }
    .mobile-nav-active .social-icons {
        display: flex; position: absolute; bottom: 50px; gap: 30px;
    }
    .mobile-nav-active .social-icons a { font-size: 2em; }
    .mobile-nav-active .mobile-menu-toggle .line-1 { transform: translateY(9px) rotate(45deg); }
    .mobile-nav-active .mobile-menu-toggle .line-2 { opacity: 0; }
    .mobile-nav-active .mobile-menu-toggle .line-3 { transform: translateY(-9px) rotate(-45deg); }

    /* --- CORREÇÃO: Slide QUEM SOU EU --- */
#slide-quem-sou-eu .content-wrapper-aligned {
    height: 100%; /* <-- ADICIONADO: Garante que o wrapper tenha altura para rolar */
    flex-direction: column; /* Empilha os itens verticalmente */
    justify-content: flex-start; /* Alinha tudo ao topo */
    padding: 120px 20px 100px 20px; /* Adiciona um pouco de padding lateral */
    overflow-y: auto; /* Adiciona a barra de rolagem */
    box-sizing: border-box; /* Garante que o padding não estoure a altura */
}
    .col-item {
        max-width: 90%; /* Limita a largura dos itens */
        flex: none; /* Remove a regra de flexbox que esticava as colunas */
        width: 100%;
        margin-bottom: 30px; /* Adiciona espaço entre os itens empilhados */
    }
    .col-item.text-box {
        min-height: auto; /* Remove altura mínima para se ajustar ao conteúdo */
    }
    .janaina-photo-container {
        margin-bottom: 20px; /* Ajusta margem da foto */
        margin-top: 0;
    }
    .navigate-to-contact-btn {
        margin-top: 0;
    }
    
    
    
    /* 1. Aplica a rolagem no wrapper do slide CURSOS */
    #slide-cursos .content-wrapper-aligned {
        height: 100%;
        overflow-y: auto; /* A barra de rolagem */
        justify-content: flex-start;
        padding-top: 130px;
        padding-bottom: 150px; /* Espaço para não esconder atrás do rodapé */
        box-sizing: border-box;
    }

/* 2. Aplica a rolagem no wrapper do slide ESPECIALIDADES */
    #slide-especialidades .content-wrapper-aligned {
        height: 100%;
        overflow-y: auto; /* A barra de rolagem */
        justify-content: flex-start;
        padding-top: 130px;
        padding-bottom: 150px; /* Espaço para não esconder atrás do rodapé */
        box-sizing: border-box;
    }

    /* --- CORREÇÃO: Slide ESPECIALIDADES --- */
    #slide-especialidades .constellation-container {
        position: relative; /* Deixa de ser absoluto para fluir na página */
        padding-top: 30px; /* Espaço abaixo do título */
    }
    #slide-especialidades .constellation-point {
        position: relative !important; /* !important para garantir a sobreposição */
        display: block;
        width: 80%;
        max-width: 400px;
        margin: 0 auto 20px auto; /* Centraliza e adiciona espaço */
        text-align: center;
        top: auto !important; left: auto !important; right: auto !important; bottom: auto !important;
        font-size: 1.2em;
    }
    #slide-especialidades .specialty-info-box {
        max-width: 90vw; /* Ajusta a caixa de info */
    }
    #slide-especialidades .specialties-main-title {
        margin-bottom: 0; /* Remove margem desnecessária */
    }

    /* --- CORREÇÃO: Slide ÁUDIOS --- */
#slide-audios {
    align-items: flex-start; /* Alinha o conteúdo no topo */
    /* overflow-y: auto; <-- REMOVIDO DAQUI */
}
#slide-audios .content-wrapper-aligned {
    height: 100%; /* <-- ADICIONADO: Define a altura para o wrapper */
    overflow-y: auto; /* <-- ADICIONADO: Agora o wrapper é quem rola */
    padding-bottom: 150px; /* Aumenta um pouco o respiro no final da rolagem */
    align-items: center;
    width: 100%; /* Garante que ocupe toda a largura */
}
#slide-audios .slide-content {
    text-align: center;
}
.audio-player-container {
    position: relative;
    left: auto; bottom: auto;
    width: 100%; max-width: 400px;
    margin: 30px auto 0 auto;
}
.audio-products-grid-layout {
    position: relative;
    flex-direction: column;
    right: auto; top: auto;
    height: auto; width: 100%;
    align-items: center;
    margin-top: 30px;
}
.product-block {
    width: 100%; max-width: 400px;
}

   /* --- CORREÇÃO: Slide CONTATO --- */
#slide-contato .content-wrapper-aligned {
    height: 100%; /* <-- ADICIONADO */
    width: 100%; /* <-- ADICIONADO */
    overflow-y: auto; /* Permite a rolagem */
    padding-bottom: 120px;
    align-items: center;
}
    #slide-contato .map-container {
        display: none; /* Esconde o mapa no mobile, como solicitado */
    }
    .contact-form-container {
        position: relative; /* Põe o formulário no fluxo normal */
        width: 100%; max-width: 500px;
        margin: 30px auto 0 auto;
        right: auto; bottom: auto;
    }

    /* --- Rodapé --- */
    .footer-nav-container {
        padding: 0 20px;
    }
}

/* === Breakpoint Final para Celulares (Abaixo de 767px) === */
@media (max-width: 767px) {
    :root {
        --padding-horizontal: 20px;
    }
    .logo-image { height: 45px; }
    .slide-content { margin-top: 120px; }
    .slide-content h1 { font-size: 2em; }
    .slide-content p { font-size: 1em; }
    .footer-nav-container { --rodape-offset-bottom: 15px; }
    .swiper-progress-bar { width: 150px; }
    .custom-swiper-button-prev, .custom-swiper-button-next { font-size: 1.8em; }
}