body,
html {
    overflow-x: hidden;
    /* corta qualquer coisa que passe da tela horizontal */
}

/* !---------------------------------------Fontes---------------------------------------- */

@font-face {
    font-family: 'Delight';
    src: url('/fonts/delight-semibold.otf') format('opentype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Delight';
    src: url('/fonts/delight-regular.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Delight';
    src: url('/fonts/delight-bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Delight';
    src: url('/fonts/delight-black.otf') format('opentype');
    font-weight: 900;
    font-style: normal;
}

.title-diferencial {
    font-family: 'Delight', sans-serif;
    font-weight: 700;
    font-size: 1rem;
    color: white;
}

.subtitle-home {
    font-family: 'Delight', sans-serif;
    font-weight: 100;
    font-size: 18px;
    color: white;
}

.title-diferencial {
    font-family: 'Delight', sans-serif;
    font-weight: 700;
    font-size: 1rem;
    color: white;
}

.subtitle-home {
    font-family: 'Delight', sans-serif;
    font-weight: 100;
    font-size: 18px;
    color: white;
}

.title-2 {
    font-family: 'Delight', sans-serif;
    font-weight: 700;
    font-size: 5rem;
    color: white;
}

.destaque {
    font-family: 'Delight', sans-serif;
    font-weight: 600;
    color: rgb(48, 49, 49);
}

.text {
    font-family: 'Delight', sans-serif;
    font-weight: 100;
    color: rgb(48, 49, 49);
    font-size: 18px;
}

.text-footer {
    font-family: 'Delight', sans-serif;
    font-weight: 100;
    color: rgb(48, 49, 49);
}


.subtitle-2 {
    color: rgb(48, 49, 49);
    font-family: 'Delight', sans-serif;
    font-weight: 600;
    font-size: 35px;
}

.topic {
    font-family: 'Delight', sans-serif;
    font-weight: 100;
    color: rgb(48, 49, 49);
    font-size: clamp(20px, 2.5vw, 22px);;
}

.font-20{
    font-family: 'Delight', sans-serif;
    font-size: clamp(20px, 2.5vw, 22px);
}

.font-title{
    font-family: 'Delight', sans-serif;
    font-size: clamp(50px, 6vw, 65px);
    font-weight: 700 !important;
}

.font-subtitle{
    font-family: 'Delight', sans-serif;
    font-size: clamp(30px, 4vw, 33px) !important;
    font-weight: 700 !important;
}

.item-liber {
    color: #ebf6ff !important;
}

.strong-banner {
    font-family: 'Delight', sans-serif;
    font-weight: 600 !important;
    font-size: 20px;
    color: white;
    /* margin-top: -30px; */
}

.item{
    color: #A8DBFF !important;
}

.item:hover {
    color: #FFFFFF !important;

}

/* !----------------------------------------Botões---------------------------------------- */

.btn-light {
    color: #0F62AC;
    background-color: white;
}

.btn-light:hover {
    color: #0F62AC;
    background-color: #DBEEFF;
}

.btn-light:active {
    color: #0F62AC !important;
    background-color: #DBEEFF !important;
    border-color: #DBEEFF !important;
}

.btn-vaga-liber {
    font-family: 'delight', sans-serif;
    font-weight: 700;
    background-color: rgba(8, 45, 253, 0.3);
    color: white;
    /* margin-left: 100px; */
    font-size: 20px;
    border-radius: 20px;
    margin-top: 10px;
}

.btn-vaga-liber:hover {
    background-color: rgba(31, 31, 202, 0.3);
    color: white;
}

.btn-vaga-liber:active {
    background-color: rgba(31, 31, 202, 0.3) !important;
    border-color: rgba(31, 31, 202, 0.3) !important;
    color: white !important;
}



.btn-diferenciais {
    font-family: 'delight', sans-serif;
    font-weight: 700;
    background-color: rgba(31, 31, 202, 0.3);
    color: white;
    /* margin-left: 100px; */
    cursor: default !important;
}


/* 
.btn-diferenciais:hover {
    background-color: rgba(31, 31, 202, 0.3);
    color: white;
}

.btn-diferenciais:active {
    background-color: rgba(31, 31, 202, 0.3) !important;
    border-color: rgba(31, 31, 202, 0.3) !important;
    color: white !important;
} */

.btn-primary {
    font-family: delight, sans-serif;
    font-weight: 700;
    background-color: #0F62AC;
    border: none;
}

.btn-primary-americano {
    font-family: delight, sans-serif;
    font-weight: 700;
    background-color: #ffffff !important;
    color: #ED3237;
    border: none;
}

.btn-primary-americano:hover {
    background-color: #ffc8c8 !important;
    color: #ED3237;
    border: none;
}

.btn-primary-americano:active {
    background-color: rgb(255, 156, 156) !important;
    color: #ED3237 !important;
    border: none !important;
}


.botao-direito::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(0,0,0,0.58) 94%);
    opacity: 0;
    transition: opacity 0.3s ease; /* tanto entra quanto sai rápido */
    z-index: 1;
}

.botao-direito:hover::before {
    opacity: 1;
}

.botao-esquerdo::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(-90deg, rgba(255,255,255,0) 0%, rgba(0,0,0,0.58) 94%);
    opacity: 0;
    transition: opacity 0.3s ease; /* tanto entra quanto sai rápido */
    z-index: 1;
}

.botao-esquerdo:hover::before {
    opacity: 1;
}



/* !---------------------------------------Imagens---------------------------------------- */


#feedback1 {
    background-image: url('../img/crianca.webp');
    background-position: center 20%;
    background-size: 100% auto;
    height: 510px;
}

#diferencial {
    background-image: url('../img/menina-diferenciais.webp');
    background-position: center 50%;
    background-size: cover;
    height: 510px;
}

#wave {
    height: 310px;
    background: url('../img/wave.svg') no-repeat bottom center;
    background-size: cover;
    z-index: 9999;
    width: 100%;
}


.wave-3 {
    background: url('../img/wave3.svg') no-repeat bottom center;
    height: 500px;
    /* background: url('../img/wave-2-americano.svg') no-repeat bottom center; */
    background-size: 100% auto;
    z-index: 9999;
    width: 100%;
}

.wave-3-diferente {
    height: 310px;
    background: url('../img/wave3.svg') no-repeat bottom center;
    background-size: cover;
    z-index: 9999;
    width: 100%;
}


.wave-3-americano {
    height: 500px;
    background: url('../img/wave-2-americano.svg') no-repeat bottom center;
    background-size: 100% auto;
    z-index: 9999;
    width: 100%;
}



@media (min-width: 2500px) {
    #wave {
        height: 480px;
        background: url('../img/wave.svg') no-repeat bottom center;
        background-size: cover;
        z-index: 9999;
        width: 100%;
    }

    #wave2 {
        height: 310px;
        background: url('../img/wave2.svg') no-repeat bottom center;
        background-size: cover;
        z-index: 9999;
        width: 100%;
    }

    #wave2-americano {
        height: 310px;
        background: url('../img/wave-americano.svg') no-repeat bottom center;
        background-size: cover;
        z-index: 9999;
        width: 100%;
    }

    #wave3 {
        height: 310px;
        background: url('../img/wave3.svg') no-repeat bottom center;
        background-size: cover;
        z-index: 9999;
        width: 100%;
    }

    #wave3-americano {
        height: 310px;
        background: url('../img/wave-americano.svg') no-repeat bottom center;
        background-size: cover;
        z-index: 9999;
        width: 100%;
    }
}

#liber {
    border-radius: 30px;
    width: 100%;
    height: 100%;
}

.banner1 {
    background-image: url('../img/crianca.webp');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 100%;
    margin-top: 0;
}

#bannerDiferenciais {
    background-image: url('../img/menina-diferenciais.webp');
    background-position: center 20%;
    background-repeat: no-repeat;
    background-size: 100% auto;
    height: 240px;
    margin-top: -20px;
}

/* cor de fundo do footer */
.bg-body-enfase {
    background-color: #0F62AC;
}


.text-justify {
    text-align: justify;
}

/* wave */

.wave{
    height: 310px;
    background: url('../img/wave.svg') no-repeat bottom center;
    background-size: cover;
    z-index: 9999;
    width: 100%;
}

.wave-americano-vermelha{
    max-height: 310px;
    background: url('../img/wave_vermelha.svg') no-repeat bottom center;
    background-size: contain;
    z-index: 9999;
    width: 100%;
}

.wave2,
.wave3,
.wave4,
.wave5 {
    height: 310px;
    background: url('../img/wave2.svg') no-repeat bottom center;
    background-size: cover;
    z-index: 9999;
    width: 100%;
}

.wave3-americano,
.wave5-americano,
.wave4-americano,
.wave2-americano {
    height: 310px;
    background: url('../img/wave-americano.svg') no-repeat bottom center;
    background-size: cover;
    z-index: 9999;
    width: 100%;
}


.wave-vermelha3,
.wave-vermelha4,
.wave-vermelha5 {
    height: 310px;
    background: url('../img/wave_vermelha.svg') no-repeat bottom center;
    background-size: contain;
    z-index: 9999;
    width: 100%;
}

.wave-vermelha2{
    height: 310px;
    background: url('../img/wave_vermelha.svg') no-repeat bottom center;
     background-size: 800px 310px;
    z-index: 9999;
    width: 800px;
}

.wave6 {
    height: 500px;
    background: url('../img/wave2.svg') no-repeat bottom center;
    background-size: cover;
    width: 100%;
}

.wave6-americano {
    height: 500px;
    background: url('../img/wave-americano.svg') no-repeat bottom center;
    background-size: cover;
    width: 100%;
}

.wave-3-xlg {
    height: 500px;
    background: url('../img/wave3.svg') no-repeat bottom center;
    background-size: cover;
    width: 100%;
}


.wrapper {
  min-height: 100vh;        
  display: flex;
  flex-direction: column;
}

.main {
  flex: 1; /* empurra o rodapé pra baixo */
}

.wave-3-xlg-americano {
    min-height: 100vh;
    height: 310px;
    background: url('../img/wave-vermelha-xlg.svg') no-repeat bottom center;
    background-size: 800px 310px;
    z-index: 9999;
    width: 800px;
}




/* !---------------------------------------media queries---------------------------------------- */




.only-576-767 {
    display: none !important;
}

@media (min-width: 576px) and (max-width: 767px) {
    .sai-576-767 {
        display: none !important;
    }
}



/* aparece acima de 990px até 1196px */
.only-991-1196 {
    display: none !important;
}

@media (min-width: 991px) and (max-width: 1196px) {
    .only-991-1196 {
        display: block !important;
    }
}

.only-1625-1873 {
    display: none !important;
}

@media (min-width: 1625px) and (max-width: 1873px) {
    .only-1625-1873 {
        display: block !important;
    }
}

.sai-1625-1873{
    display: block !important;
}
@media (min-width: 1625px) and (max-width: 1873px) {
    .sai-1625-1873 {
        display: none !important;
    }
}


.only-1730-2500 {
    display: none !important;
}

@media (min-width: 1730px)  {
    .only-1730-2500 {
        display: block !important;
    }

    .sai-1730-2500 {
        display: none !important;
    }
}




/* aparece acima de 768px até 991px */
.only-768-991 {
    display: none !important;
}

@media (min-width: 768px) and (max-width: 991px) {
    .only-768-991 {
        display: block !important;
    }
}

/* some acima de 768 até 991px */
.sai-768-991 {
    display: block !important;
}

@media (min-width: 768px) and (max-width: 991px) {
    .sai-768-991 {
        display: none !important;
    }
}

/* some acima de 575 até 991 */
.sai-575-991 {
    display: block !important;
}

@media (min-width: 575px) and (max-width: 991px) {
    .sai-575-991 {
        display: none !important;
    }
}

/* some acima de 990px até 1196px */
.sai-992-1196 {
    display: block !important;
}

@media (min-width: 992px) and (max-width: 1196px) {
    .sai-992-1196 {
        display: none !important;
    }
}

/* aparece no celular: até 767px */
.only-xs {
    display: block !important;
}

@media (min-width: 768px) {
    .only-xs {
        display: none !important;
    }
}

/* aparece no tablet: 768px até 991px */
.only-md {
    display: none !important;
}

@media (min-width: 768px) and (max-width: 991px) {
    .only-md {
        display: block !important;
    }
}

/* aparece na faixa intermediária: 992px até 1196px */
.only-992-1196 {
    display: none !important;
}

@media (min-width: 992px) and (max-width: 1196px) {
    .only-992-1196 {
        display: block !important;
    }
}

/* aparece no desktop: acima de 1196px */
.only-lg {
    display: none !important;
}

@media (min-width: 1197px) and (max-width: 1779px) {
    .only-lg {
        display: block !important;
    }
}

/* aparece no desktop grande: acima de 1780px */
.only-xlg {
    display: none !important;
}

@media (min-width: 1780px) {
    .only-xlg {
        display: block !important;
    }
}


@media (max-width: 991px) {
    #carouselExampleAutoplaying .carousel-item {
        height: 240px;
        background-position: top center;
        background-size: cover;
    }
}

/* monitor medio, min 768 até no max 991px*/
@media (min-width: 768px) and (max-width: 991px) {

    .banner1 {
        background-image: url('../img/crianca.webp');
        background-position: center 20%;
        background-repeat: no-repeat;
        background-size: cover;
        min-height: 400px;
        height: 80vh;
        display: flex;
        flex-direction: column;
        justify-content: center;
        margin-top: 0;
    }

    .banner2 {
        background-image: url('../img/banner-home.webp');
        background-position: center 20%;
        background-repeat: no-repeat;
        background-size: cover;
        min-height: 400px;
        height: auto;
        display: flex;
        flex-direction: column;
        justify-content: center;
        margin-top: 0;
    }

    .banner4 {
        background-image: url('../img/capa_americano.webp');
        background-position: center top;
        background-repeat: no-repeat;
        background-size: cover;
        min-height: 400px;
        height: auto;
        display: flex;
        flex-direction: column;
        justify-content: center;
        margin-top: 0;
    }

    .banner7 {
        background-image: url('../img/capa_liber_dif.webp');
        background-position: center top;
        background-repeat: no-repeat;
        background-size: cover;
        min-height: 400px;
        height: auto;
        display: flex;
        flex-direction: column;
        justify-content: center;
        margin-top: 0;
    }

   
    .banner6 {
        background-image: url('../img/diferenciais_serra.webp');
        background-position: center top;
        background-repeat: no-repeat;
        background-size: cover;
        min-height: 400px;
        height: auto;
        display: flex;
        flex-direction: column;
        justify-content: center;
        margin-top: 0;
    }

    .strong-banner {
        font-family: 'Delight', sans-serif;
        font-weight: 600;
    }

    .subtitle-home {
        font-family: 'Delight', sans-serif;
        font-weight: 100;
        font-size: 25px;
        color: white;
    }

}

/* Monitores médios e grandes acima de 992px (≥ 992px) */
@media (min-width: 992px) {
    .banner1 {
        background-image: url('../img/crianca.webp');
        background-position: center; 
        background-size: cover;
        background-repeat: no-repeat;
        height: clamp(600px, 50vw, 800px); 
        display: flex;
        align-items: center;
        justify-content: flex-start;
        padding-left: 9.5%;

    }
/* 
        .banner1 {
        background-image: url('../img/crianca.webp');
        background-position: center center;
        background-size: cover;
        background-repeat: no-repeat;
        height: 100vh;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        padding-left: 9.5%;
    } */

/* 
    .banner1 {
    background-image: url('../img/crianca.webp');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 100%;
    margin-top: 0;
} */

    .banner2 {
        background-image: url('../img/banner-home.webp');
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        padding-left: 9.5%;
    }

    .banner4 {
        background-image: url('../img/capa_americano.webp');
        background-position: center top;
        background-repeat: no-repeat;
        background-size: cover;
        width: auto;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        padding-left: 9.5%;
    }

    .banner5 {
        background-image: url('../img/foto_capa_home.webp');
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        padding-left: 9.5%;
    }

    .banner6 {
        background-image: url('../img/diferenciais_serra.webp');
        background-position: center top;
        background-repeat: no-repeat;
        background-size: cover;
        width: auto;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        padding-left: 9.5%;
    }

     .banner7 {
        background-image: url('../img/capa_liber_dif.webp');
        background-position: center top;
        background-repeat: no-repeat;
        background-size: cover;
        width: auto;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        padding-left: 9.5%;
    }



    .title-banner {
        font-family: 'Delight', sans-serif;
        font-weight: bold;
        font-size: clamp(2.5rem, 50vw, 5rem);
        margin-bottom: 10px;
    }

    .strong-banner {
        font-family: 'Delight', sans-serif;
        font-weight: 700;
        font-size: clamp(1.2rem, 2.0vw, 2rem);
        margin-bottom: 5px;

    }

    .subtitle-home {
        font-family: 'Delight', sans-serif;
        font-size: clamp(1.2rem, 2.0vw, 2rem);


    }



    .title-banner,
    .strong-banner,
    .subtitle-home,
    .btn-vaga-liber,
    .btn-vaga-americano {
        margin-left: 0;
        text-align: left;
    }
}


/* MONITOR MUITO GRANDE */
@media (min-width: 2000px) {
    .banner1 {
        background-image: url('../img/crianca.webp');
        background-position: center center;
        background-size: cover;
        background-repeat: no-repeat;
        height: 90vh;
        /* altura do banner */
        display: flex;
        align-items: center;
        /* centraliza verticalmente */
        justify-content: flex-start;
        padding-left: 10%;
    }

    .banner2 {
        background-image: url('../img/banner-home.webp');
        background-position: center center;
        background-size: cover;
        background-repeat: no-repeat;
        height: 90vh;
        /* altura do banner */
        display: flex;
        align-items: center;
        /* centraliza verticalmente */
        justify-content: flex-start;
        padding-left: 10%;
    }

    .banner4{
        background-image: url('../img/capa_americano.webp');
        background-position: center top;
        background-size: cover;
        background-repeat: no-repeat;
        height: 90vh;
        /* altura do banner */
        display: flex;
        align-items: center;
        /* centraliza verticalmente */
        justify-content: flex-start;
        padding-left: 10%;
    }

    .banner7{
        background-image: url('../img/capa_liber_dif.webp');
        background-position: center top;
        background-size: cover;
        background-repeat: no-repeat;
        height: 90vh;
        /* altura do banner */
        display: flex;
        align-items: center;
        /* centraliza verticalmente */
        justify-content: flex-start;
        padding-left: 10%;
    }


    .banner6{
        background-image: url('../img/diferenciais_serra.webp');
        background-position: center top;
        background-size: cover;
        background-repeat: no-repeat;
        height: 90vh;
        /* altura do banner */
        display: flex;
        align-items: center;
        /* centraliza verticalmente */
        justify-content: flex-start;
        padding-left: 10%;
    }


}

/* ! ----------------------------------------Americano---------------------------------------- */

.item-americano{
    color: #0F62AC;
}

.item-americano:hover{
    color: #BF2834;
}

.nav-link.active {
    color: #BF2834 !important;
}

.btn-americano {
    background-color: #0F62AC !important;
    color: #ffffff !important;
}

.btn-americano:hover {
    color: #ffffff !important;
}

.btn-vaga-americano {
    font-family: 'delight', sans-serif;
    font-weight: 700;
    background-color: #00BDF6;
    color: white;
    font-size: 20px;
    border-radius: 20px;
    margin-top: 10px;
}

.btn-vaga-americano:hover {
    background-color: #0aa5d4;
    color: white;
}

.btn-vaga-americano:active {
    background-color: #0aa5d4 !important;
    border-color: #0aa5d4 !important;
    color: white !important;
}

.btn-azul-claro {
    font-family: delight, sans-serif;
    font-weight: 700;
    background-color: #00BDF6 !important;
    border: none;
    color: #ffffff !important;
    transition: background-color 0.3s ease;
}

.btn-azul-claro:hover {
    background-color: #03aee2 !important;
    color: #ffffff !important;
}

.btn-azul-claro:active {
    background-color: #039dcc !important;
    color: #ffffff !important;

}


@media(max-width: 768px) {  
    
 .banner2 {
        background-image: url('../img/banner-home.webp');
        background-position: center 20%;
        background-repeat: no-repeat;
        background-size: cover;
        height: auto;
        display: flex;
        flex-direction: column;
        justify-content: center;
        margin-top: 0;
    }

    #banner3 {
        background-image: url('../img/banner-home.webp');
        background-position: center 20%;
        background-repeat: no-repeat;
        background-size: cover;
        height: auto;
        display: flex;
        flex-direction: column;
        justify-content: center;
        margin-top: 0;
    }

}