@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400;1,800&display=swap');

* {
    font-family: 'Open Sans', sans-serif ;

}

html{
    scroll-behavior: smooth;
}

body{
    background: rgb(223,233,243);
    background: linear-gradient(180deg, rgba(223,233,243,1) 0%, rgba(255,255,255,1) 100%);
}

/*Whatsapp*/
.whatsapp-fixed{
    position: fixed; 
    bottom: 15%; 
    right: 20px; 
    z-index: 999;
    width: 50px;
}

/*navbar*/

.bg, .bg-mobile {
    background: rgba(255, 255, 255, 0.05) !important; 
    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

.bg-colorido {
    background: rgb(2,10,55) !important;
    background: linear-gradient(138deg, rgba(2,10,55,1) 0%, rgba(0,83,168,1) 100%) !important;
    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
    z-index: 99;
}

.navbar-collapse>.navbar-nav>.nav-item>.nav-link {
    color: #fff;
}

.dropdown-item:hover {
    background: #FF2E34;
}

.btn-nav{
    
    background-color: #FE0000;
    color: #fff;
    transition: 1s;
}

.btn-nav:hover , .btn-hero:active, .btn-hero:focus {
    transform: scale(1.1);
    background-color: #FE0000;
    color: #fff;
}


/*navbar-mobile*/
.nav-mobile{
    background: rgb(1, 79, 164) !important;
    background: linear-gradient(150deg, rgba(1, 79, 164, 1) 0%, rgba(1, 41, 137, 1) 100%) !important;
}

/*hero*/
.secao-carousel-mobile{
    /*position:relative; 
    top: -22vh; */
    box-shadow: 0 8px 32px 0 rgb(31 38 135 / 37%);
    z-index: 1;
}

.secao-carousel{
    /*position:relative; 
    top: -22vh; */
    box-shadow: 0 8px 32px 0 rgb(31 38 135 / 37%);
    z-index: 1;
}

.bg-hero, .bg-hero-mobile{
    height: 100vh;
    background-size: cover;
}

.bg-hero {
    /*position: relative;
    top: -22vh;*/
    background-image: url(../img/banner/banner.jpg) ;
    background-position: center right;
    background-repeat: no-repeat;
    background-size: auto; 
    max-height: 666px;
    
}

.bg-hero-mobile{
    background-image: url(../img/bg-hero-mobile.png);
    background-position: center;
}

.titulo-hero, .titulo-hero-mobile{
    position: absolute;
    display: inline-block;
}

.titulo-hero {
    top: 40%;
}

.titulo-hero-mobile {
    top: 65%;
}

.titulo-hero-mobile > .typed-out, .titulo-hero-mobile > .typed-out2{
    color: #FE0000;
}


.typed-out, .typed-out2{
    overflow: hidden;
    border-right: .15em solid orange;
    white-space: nowrap;
    font-size: 3.5vw;
    font-weight: 800;
    font-style: italic;
    width: 0;
    color: #fff;
}

.typed-out{
    animation:typing 1.5s steps(20, end) forwards;
}

.typed-out2{
    animation:typing2 1.5s steps(20, end) forwards;
    animation-delay: 1.6s;
}

@keyframes typing {
    0%{
        width: 0;
    }
    99%{
        width: 100%;
        border-right: .15em solid orange;
    }
    100%{
        width: 100%;
        border:none;
    }
}

@keyframes typing2 {
    from {width: 0}
    to {width: 50%;}
}


.btn-hero{
    padding: 1em 4em;
    background-color: #FE0000;
    color: #fff;
    transition: 1s;
}

.btn-hero:hover , .btn-hero:active {
    transform: scale(1.1);
    background-color: #FE0000;
    color: #fff;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}


/*Historia*/
.secao-historia{
    /*position: relative;
    top: -167px;*/
    padding:100px 0 100px 0;
    background: rgb(2,10,55) !important;
    background: linear-gradient(138deg, rgba(2,10,55,1) 0%, rgba(0,83,168,1) 100%) !important;
}

.historia-video{
    border-radius: 20px;
}

.secao-historia p {
    text-align: justify;
}

.coluna-proposta-texto{
    background-color: #DED9D5;
}
.row > .coluna-proposta-texto {
    background-color: #DED9D5
}

.proposta-texto {
    background: linear-gradient(138deg, rgba(2,10,55,1) 0%, rgba(0,83,168,1) 100%);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}

.btn-saiba-mais{
    background-color: #FE0000;
    padding: .5rem;
    color: #fff;
    transition: 1s;
}

.btn-saiba-mais:hover{
    background-color: #FE0000;
    color: #fff;
    transform: scale(1.1);
}

/*Segmentos*/

.secao-segmentos{
    /*top:-100px; */
    padding:100px 0 100px 0;
}

.cards{
	width: 100%;
	display: flex;
	display: -webkit-flex;
	justify-content: center;
	-webkit-justify-content: center;
}

.card--1 .card__img, .card--1 .card__img--hover{
	background-image: url(../img/segmentos/infantil.png);
}

.card--2 .card__img, .card--2 .card__img--hover{
	background-image: url(../img/segmentos/fundamental.jpg);
}

.card--3 .card__img, .card--3 .card__img--hover{
	background-image: url(../img/segmentos/medio.jpg);
}

.card--4 .card__img, .card--4 .card__img--hover{
	background-image: url(../img/segmentos/fundamental-2.jpg);
}


.card__img{
	visibility: hidden;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	width: 100%;
	height: 235px;
}

.card__info-hover{
	position: absolute;
	padding: 16px;
	width: 100%;
	opacity: 0;
	top: 0;
}

.card__img--hover{
	transition: 0.2s all ease-out;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	width: 100%;
	position: absolute;
	height: 235px;
	border-top-left-radius: 30px;
	top: 0;
}

.cardd {
	margin-right: 25px;
	transition: all 0.4s cubic-bezier(0.175, 0.885, 0, 1);
	background-color: #fff;
	width: 100%;
	position: relative;
    border-top-left-radius: 30px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 30px;
    border-bottom-left-radius: 0px;
	overflow: hidden;
}

.card__info{
	z-index: 2;
	background-color: #fff;
	padding: 16px 24px 24px 24px;
}

.card__category{
	text-transform: uppercase;
	font-size: 13px;
	font-weight: 500;
}

.card__title{
	margin-top: 5px;
	margin-bottom: 10px;
}

.card__author{
	font-weight: 600;
	text-decoration: none;
}

.cardd:hover .card__img--hover{
	height: 100%;
	opacity: 1;
}

.cardd:hover .card__info{
	background-color: transparent;
	position: relative;
	background-color: rgb(0, 0, 0, 0.3);
	color: white;
}

.cardd:hover .card__info-hover{
	opacity:0
}

/*Atividade*/

.secao-atividade{
    background: rgb(2,10,55) !important;
    background: linear-gradient(138deg, rgba(2,10,55,1) 0%, rgba(0,83,168,1) 100%) !important;
}

.card_overlay{
    background-color: transparent;
	background-color: rgb(0, 0, 0, 0.45);
    color: #fff;
    height: 50%;
    top: 50%;
}

.texto-atividades{
    font-size:1vw; 
    font-size: clamp(1em, 1em, 1.5em);
}

/*Redes Sociais*/

.social{
    position: fixed;
    z-index: 9999;
    bottom: 20px;
    right: 20px;
}

.bi-facebook, .bi-instagram, .bi-whatsapp, .bi-share-fill{
    color: #fff;
}
.btn-share{ 

    margin:auto; 
    width:50px; 
    height:50px; 

}

.btn-share ol{
    position: absolute;
    margin: 2px;
    width: 50px;
    height: 50px;
}

.btn-share ol li:nth-child(1),.btn-share ol li:nth-child(2),.btn-share ol li:nth-child(3){
    position: absolute;
    width: 50px;
    height: 50px;
    line-height: 50px;
    display: block;
    border-radius: 50%;
    transition: all .5s;
    text-align: center;
    right: 0;
    
}

.btn-share ol li:nth-child(1){
    background-color:#1877F2;
    bottom: 70px;
}

.btn-share ol li:nth-child(2){
    background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);
    bottom: 140px;
}

.btn-share ol li a{
    
    font-size:1.3em;
    text-decoration:none;
    color:#fff;
}

.btn-share.ativo ol li{
    transform: translate(0);
    transition: all 0.4s;
}

/*Estrutura*/

.secao-estrutura{
    background: rgb(223,233,243);
    background: linear-gradient(180deg, rgba(223,233,243,1) 0%, rgba(255,255,255,1) 100%);
}   

.owl-nav{
    display: none !important;
}

.imagem-estrutura{
    border-top-left-radius: 30px !important;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 30px;
    border-bottom-left-radius: 0px;
}

.estrutura-mapa{
    border-top-left-radius: 0px;
    border-top-right-radius: 30px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 30px;
    box-shadow: 0 8px 32px 0 rgb(31 38 135 / 37%);
    width: 100%;
}
.row{
    display: flex;
    justify-content: center;

}

.ava02 iframe{
   width: 100%;

}
/*Instagram*/
.secao-instagram{
    background-color: #4158D0; background-image: linear-gradient(43deg, #4158D0 0%, #C850C0 46%, #FFCC70 100%);
}
.insta{
    display: flex;
    justify-content: center;
    align-items:center;
    
}

/*Contato*/
.contato-bg {
    background: rgb(223,233,243);
    background: linear-gradient(180deg, rgba(223,233,243,1) 0%, rgba(255,255,255,1) 100%);
}

#contato, #estrutura {
    scroll-margin-top: 10rem;
}

/*footer*/
.fa-location-dot, .fa-phone{
    color: #fff;
    font-size: 1.5em;
    padding-right: .3em;
}
.secao-footer{
    background: rgb(2,10,55) !important;
    background: linear-gradient(138deg, rgba(2,10,55,1) 0%, rgba(0,83,168,1) 100%) !important;
    padding: 3em 0 1em 0;
}



/*Proposta Pedagogica interna*/

.secao-bg{
    background-size:cover;
    height: 30vh;
    background-position: center;
    background-attachment: fixed;
    background-repeat: no-repeat;

}

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

.foto-radius, .dropdown-menu{
    border-top-left-radius: 30px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 30px;
    border-bottom-left-radius: 0px;
}

.drop-segmento-inicial:hover{
    border-top-left-radius: 10px;
}
.drop-segmento-final:hover{
    border-bottom-right-radius: 10px;
}

.foto-proposta{
    filter: drop-shadow(5px 0px 11px #0052A7)
}




/*Mediaquery*/

@media screen and (min-width:1920px){
    .bg-hero{
        max-width: 100%;
        background-size: 100%;
    }
}

@media screen and (max-width:1399px){
    .btn-saiba-mais{
        margin-bottom: 3rem;
    }
    .coluna-proposta-texto{
        padding-left: 2rem !important;
        padding-right: 2rem !important;
    }
}

@media screen and (max-width:1199px) {
    .coluna-proposta-texto{
        padding-top: 2rem !important;
    }
}

@media screen and (min-width:992px) {
    .nav-mobile, .bg-mobile, .secao-carousel-mobile{
        display: none;
    }
}

@media screen and (max-width:991px) {
    .nav-web{
        display: none;
    }

    .btn-mobile{
        width: 20ch !important;
    }
    .bg-hero {
        display: none;
    }

    .secao-carousel{
        display: none;
    }
    .typed-out, .typed-out2{
        font-size: 5vw;
    }

}

@media screen and (max-width:767px){
	.cards{
		display: contents;
	}
    .snapwidget-widget{
        width: 100% !important;
        height: 632px !important;
    }
}

@media screen and (max-width:575px) {
    .row > .coluna-proposta-imagem{
        padding-left: 0;
    } 
}

@media screen and (max-width:574px) {
    .titulo-hero-mobile{
        left: 13%;
    }
    .typed-out, .typed-out2{
        font-size: 6vw;
    }
}

@media screen and (max-width:455px) {
    .card_overlay{
        height: 70%;
        top: 30%;
    }
    
}

@media screen and (max-width:425px){
    .snapwidget-widget{
        width: 100% !important;
        height: 32rem !important;
    }
    .bg-hero-mobile {
        height: 70vh;
    }
}

@media screen and (max-width:385px) {
    .card_overlay{
        height: 100%;
        top: 0%;
    }
}

@media screen and (max-width:320px) {
    .titulo-hero-mobile{
        left: 10%;
    }
}