.elementor-997 .elementor-element.elementor-element-4cdbcce{--display:flex;}/* Start custom CSS for html, class: .elementor-element-5b00341 *//* ==========================================
   HISTÓRIA - LINHA DO TEMPO
========================================== */

.historia{

    padding:80px 20px;
    background:linear-gradient(180deg,#ffffff,#eef7ff);
    position:relative;
    overflow:hidden;
    font-family:'Poppins',sans-serif;

}


.historia h2{

    text-align:center;
    font-size:48px;
    color:#ff2a8d;
    font-family:'Fredoka',sans-serif;
    margin-bottom:15px;

}


.subtitulo{

    text-align:center;
    max-width:750px;
    margin:0 auto 70px;
    font-size:18px;
    color:#666;
    line-height:1.6;

}


/* CONTAINER */

.timeline{

    max-width:1100px;
    margin:auto;
    position:relative;

}


/* LINHA CENTRAL */

.timeline::before{

    content:"";
    position:absolute;
    top:0;
    bottom:0;
    left:50%;
    width:7px;
    transform:translateX(-50%);
    background:linear-gradient(#2b8cff,#ff2a8d);
    border-radius:50px;

}


/* ITEM */

.item{

    width:50%;
    position:relative;
    margin-bottom:70px;

}


/* LADO ESQUERDO */

.item.left{

    left:0;
    padding-right:60px;

}


/* LADO DIREITO */

.item.right{

    left:50%;
    padding-left:60px;

}



/* CARTÃO */

.card{

    background:white;
    padding:30px;
    border-radius:25px;
    box-shadow:0 15px 40px rgba(0,0,0,.10);
    border-top:5px solid #ff2a8d;
    transition:.3s;

}


.card:hover{

    transform:translateY(-8px);

}


/* ANO */

.ano{

    display:inline-block;
    background:#2b8cff;
    color:white;
    padding:8px 20px;
    border-radius:40px;
    font-weight:700;
    font-size:18px;
    margin-bottom:15px;

}



/* TITULO */

.card h3{

    font-family:'Fredoka',sans-serif;
    font-size:28px;
    color:#2b8cff;
    margin-bottom:15px;

}



/* TEXTO */

.card p{

    color:#555;
    line-height:1.8;
    font-size:16px;

}



/* ICONE */

.icone{

    position:absolute;
    top:25px;

    width:70px;
    height:70px;

    background:white;
    border-radius:50%;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:35px;

    box-shadow:0 10px 25px rgba(0,0,0,.15);

    z-index:3;

}


/* POSIÇÃO ESQUERDA */

.left .icone{

    right:-35px;

}


/* POSIÇÃO DIREITA */

.right .icone{

    left:-35px;

}



/* PONTO NA LINHA */

.item::after{

    content:"";

    position:absolute;

    top:50px;

    width:20px;
    height:20px;

    background:#ff2a8d;

    border:5px solid white;

    border-radius:50%;

    z-index:2;

    box-shadow:0 0 0 5px #2b8cff;

}



.left::after{

    right:-10px;

}



.right::after{

    left:-10px;

}



/* ==========================================
   TABLET
========================================== */


@media(max-width:900px){


.historia{

    padding:60px 15px;

}


.historia h2{

    font-size:38px;

}


.subtitulo{

    font-size:16px;

}


.item.left{

    padding-right:35px;

}


.item.right{

    padding-left:35px;

}


.card{

    padding:22px;

}


.card h3{

    font-size:23px;

}


.card p{

    font-size:15px;

}


.icone{

    width:55px;
    height:55px;
    font-size:26px;

}


.left .icone{

    right:-27px;

}


.right .icone{

    left:-27px;

}


}



/* ==========================================
   CELULAR
   Mantém lado esquerdo e direito
========================================== */


@media(max-width:600px){


.historia{

    padding:50px 10px;

}


.historia h2{

    font-size:30px;

}



.timeline::before{

    width:5px;

}



.item{

    margin-bottom:45px;

}


/* reduz distância dos cards */

.item.left{

    padding-right:35px;

}


.item.right{

    padding-left:35px;

}



.card{

    padding:15px;
    border-radius:18px;

}


.ano{

    font-size:13px;
    padding:6px 13px;

}


.card h3{

    font-size:18px;

}


.card p{

    font-size:13px;
    line-height:1.6;

}


.icone{

    width:42px;
    height:42px;

    font-size:20px;

    top:30px;

}


.left .icone{

    right:-21px;

}


.right .icone{

    left:-21px;

}


.item::after{

    width:14px;
    height:14px;

    top:43px;

}


.left::after{

    right:-7px;

}


.right::after{

    left:-7px;

}


}



/* ==========================================
   CELULARES MUITO PEQUENOS
========================================== */


@media(max-width:380px){


.card{

    padding:12px;

}


.card h3{

    font-size:16px;

}


.card p{

    font-size:12px;

}


.icone{

    width:36px;
    height:36px;

    font-size:17px;

}


.left .icone{

    right:-18px;

}


.right .icone{

    left:-18px;

}


}/* End custom CSS */