/* Para navegadores Webkit (Chrome, Safari, Edge) */
::-webkit-scrollbar {
    width: 5px; /* Largura da barra de rolagem */
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
}



::-webkit-scrollbar-thumb:hover {
    background-color: var(--blue-original-color);
}

input::placeholder,
input::-webkit-input-placeholder,
input:-moz-placeholder,
input::-moz-placeholder,
input:-ms-input-placeholder {
  font-size: 14px; /* ou 1em se preferir usar base relativa */
  font-weight: 300;
  color: #bdbcbc;
  opacity: 1; /* importante para Safari */
}



* {
    box-sizing: border-box;
    
}

:root {
 
    /* paleta de cores */
    --blue-original-color: #022859;
    --green-original-color: #68efad;
    --bluesky-original-color: #00f8d7;
    --white-original-color: #ffffff;
    --blueback-original-color: #020e1c;

}

html {
    font-family: "Poppins", sans-serif;
    height: 100%;
    min-height: 100dvh;
    overflow-x: hidden;
    /* --------- */
    scrollbar-width: thin; 
    scrollbar-color: var(--blue-original-color) transparent; 
}


body {
    margin: 0;
    padding: 0;
    scroll-margin-top: 950px; 
    overflow: hidden;
    font-weight: 200;
    background-color: var(--blueback-original-color);
}

@media screen and (min-width: 1600px) {
    .content_principal,
    .section_two {
      transform: scale(1.2);
      transform-origin: top center;
    }
}


.content_principal,
.section_six,
.footer_seven,
.whats_mobile,
.ecorban_fim{
    max-width: 1400px;
    margin: 0 auto;
    width: 100%; 
    box-sizing: border-box; 
}



/* ---------- img header resolution small - start ---------- */

.gradient_linear>img{
    position: absolute;
    top: 0;
    right: 0;
    width: 60em;
    height: auto;
    z-index: -2;
    padding: 0;
    opacity: 100%;
    max-width: 2000px;
    margin: 0 auto; 
}

/* ---------- img header resolution small - end ---------- */



/* <!-- --------------- input - mobile ------------- --> */

.containerinput_button {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2em;
    margin-top: .3em;
}
.button_folder {
    border: 2px solid var(--green-original-color);
    border-radius: 50px;
    background-color: transparent;
    height: 30px;
    width: 80px;
    color: var(--green-original-color);
    font-weight: bold;
    font-size: .55em;
    letter-spacing: 0px;
    margin-top: .35em;
}
.pesquisafolder_container {
    position: relative;
    width: 8em;
    border-radius: 50px;
    

}
input[type="text"] {
    width: 18em;
    padding: 8px 40px 8px 10px;
    font-size: 13px;
    border: 1px solid #ccc;
    border-radius: 50px;
    outline: none;
    background-color: white;
}

.pesquisafolder_container>img {
    position: absolute;
    top: .6em;
    left: .5em;
}
.pesquisafolder_container span {
    content: "";
    position: absolute;
    top: 50%;
    left: .5em;
    transform: translateY(-50%);
    color: #888;
    font-size: 12px;
    
}


/* ---------- header resolution small - start ---------- */

.content_principal {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-weight: 400;
}

.logo_ecorban1>img{
    width: 5em;
}

.logo_ecorban1 {
    padding: 2.4em 0 0em .1em; 
    position: relative;
    height: auto;
}

.logo_ecorban1 span::after {
    content: '';
    width: 50%;
    height: 1px;
    background-color: var(--white-original-color);
    position: absolute;
    top: 50%;
    left: 6.2em;
}

/* --- */

.chamada_button_corbans {
    display: flex;
    justify-content: center;
    align-items: start;
    flex-direction: column;
    padding: 0em 1.2em 2em 1.2em;
    font-size: 1.5em;
}

.content_chamada h1{
    color: var(--white-original-color);
    padding: 0;
    margin: 1em 0 .3em 0;
    line-height: 1.20em;
    text-shadow: 0px 0px 10px black;
    font-size: 1.1em;
}

.content_chamada p{
    color: var(--white-original-color);
    padding: 0;
    margin-top: 1em 0 0 0;
    font-size: 1.1em;
    font-weight: 200;
    padding: 0;
    margin: 0;
    line-height: 1.2em;
    text-shadow: 0px 0px 10px black;
}

.content_chamada p b{
    color: var(--bluesky-original-color);
    font-weight: bold;
}

/* --- button --- */

.button1 button {
    background-color: transparent;
    border: 2px solid var(--green-original-color);
    padding: .6em 2em;
    margin: 2em 0;
    border-radius: 50px;
    transition: color .5s ease-in-out, background-color .5s ease-in-out;
    font-size: .6em;
    font-weight: bold;
    color: var(--green-original-color);
}

.button1 button:hover {
    background-color: var(--green-original-color);
    color: var(--blueback-original-color);
    cursor: pointer;
}

/* ----- corbans ----- */

.content_corbans {
    display: flex;
    justify-content: center;
    align-items: start;
    flex-direction: column;
    padding: 0 0 2em 0;
    margin: .5em 0 0 0;
    font-size: .6em;
    font-weight: bold;
    gap: 0;
    position: relative;
    width: 100%;
    height: auto;
}

.content_corbans img {
    width: 280px; 
    position: absolute;
    top: 0;
    left: 0;
    opacity: 1;
}


/* ---- banner ---- */


.congelar_group {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 30em;
    margin: 3em auto;
}

.lupa_1 {
    position: absolute;
    z-index: -1;
    top: 1.5em;
    left: -12em;
    width: 25em;
    margin: 0 auto;
    padding: 0;
}

.persona_1{
    position: absolute;
    z-index: -1;
    top: .75em;
    left: -7em;
    width: 15em;
    margin: 0 auto;
    padding: 0;
}

/* ---- baloes ---- */

.content_img_chamada3 {
    position: absolute;
    z-index: 1;
    padding: 0;
    margin: 0 0 3em;
    width: 15em;
}


/* ---------- header resolution small - end ---------- */

/* ---------- header resolution medium - start ---------- */

@media screen and (min-width: 700px) {


    
    .content_principal {
        height: 52em;
        margin: 0 auto;
        gap: 3em;
    }

    .chamada_button_corbans {
        display: flex;
        justify-content: center;
        align-items: start;
        flex-direction: column;
        padding: 0em 5em 2em 5em;
        font-size: 1.5em;
        max-width: 31em;
    }
    
    .logo_ecorban1>img{
        width: 7em;
    }

    .logo_ecorban1 {
        padding: 0em 0 1em 0em;
        position: relative;
        margin: 10em 0 0 0;
        display: flex;
        flex-direction: column;
        align-items: start;
        justify-content: center;
    }

    .logo_ecorban1 span::after {
        content: '';
        width: 80%;
        height: 1.5px;
        background-color: var(--white-original-color);
        position: absolute;
        top: 10%;
        left: 8em;
    }
    
    .content_chamada p{
        color: var(--white-original-color);
        padding: 0;
        margin-top: 1em 0 0 0;
        font-size: 1.1em;
        padding: 0;
        margin: 0;
        line-height: 1.2em;
    }
    .content_chamada h1{
        margin-top: 0;
    }
    
    .content_img_chamada123 {
        transform: scale(1.3); /* Escala inicial (100%) */
        transform-origin: top top; /* Define o ponto de origem para a escala */
        transition: transform 0.3s ease; /* Transição suave ao redimensionar */
    }

    .lupa_1 {
        position: absolute;
        z-index: -1;
        top: .75em;
        left: -9em;
        width: 18em;
        margin: 0 auto;
        padding: 0;
    }

    .persona_1{
        position: absolute;
        z-index: -1;
        top: .75em;
        left: -7em;
        width: 13em;
        margin: 0 auto;
        padding: 0;
    }

    .content_corbans {
        width: 380px;
    }

    .content_corbans img{
        width: 300px;
    }


    .gradient_linear>img{
        position: absolute;
        top: 0;
        right: 0;
        width: 100vw;
        height: auto;
        z-index: -1;
        padding: 0;
        
    }
    
}

/* ---------- header resolution medium - end ---------- */

/* ---------- header resolution large - start ---------- */

@media screen and (min-width: 960px) {

    .persona_1{
        position: absolute;
        z-index: -1;
        top: 1.5em;
        width: 11em;
        margin: 0;
        padding: 0;
    }

    .chamada_button_corbans {
        margin-top: 2em;
    }



}

/* ---------- header resolution large - end ---------- */

/* ---------- header resolution extra large - start ---------- */

@media screen and (min-width: 1168px) {

    

    .containerinput_button {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 5em;
        margin-top: 1em;
    }

    .button_folder {
        border: 2px solid var(--green-original-color);
        border-radius: 50px;
        background-color: transparent;
        height: 40px;
        width: 100px;
        color: var(--green-original-color);
        font-weight: bold;
        font-size: .7em;
        letter-spacing: 0px;
        margin-top: .8em;
        
    }

    .pesquisafolder_container {
        position: relative;
        width: 15em;
        border-radius: 50px;
    }
    
    

    input[type="text"] {
        width: 35em;
        padding: 12px 40px 12px 10px;
        font-size: 13px;
        border: 1px solid #ccc;
        border-radius: 100px;
        outline: none;
        background-color: white;
        margin-top: 1em;
    }

    .pesquisafolder_container>img {
        position: absolute;
        top: 1.05em;
        left: .7em;
    }

    .pesquisafolder_container span {
        content: "";
        position: absolute;
        top: 50%;
        left: .5em;
        transform: translateY(-50%);
        color: #888;
        font-size: 12px;
        
    }


    .gradient_linear>img{
        position: absolute;
        top: -5em;
        width: 100vw;
        height: 47em;
        padding: 0;
        
    }

    .content_principal {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        font-weight: 400;
        margin: 4.5em auto 11em;
        padding: 0 8em;
        height: auto;
    }
    
    .logo_ecorban1>img{
        scale: 1;
    }

    .logo_ecorban1 {
        padding: 0em 0 1em 0em;
        position: relative;
        margin: 0;
    }

    .logo_ecorban1 span::after {
        content: '';
        width: 60%;
        height: 2px;
        background-color: var(--white-original-color);
        position: absolute;
        top: 10%;
        left: 8em;
    }
    
    .chamada_button_corbans {
        display: flex;
        justify-content: center;
        align-items: start;
        flex-direction: column;
        padding: 0 0 2em 0;
        margin: 1em 0 0 0;
        font-size: 1.5em;
        z-index: 6;
    }
    
    .content_chamada h1{
        color: var(--white-original-color);
        padding: 0;
        margin: .5em 0 .3em 0;
        line-height: 1.20em;
        font-size: 1.5em;
        width: 100%;
    }

    .content_chamada p{
        color: var(--white-original-color);
        padding: 0;
        margin-top: 1em 0 0 0;
        font-size: 1.3em;
        padding: 0;
        margin: 0;
        line-height: 1.3em;
        width: 18em;
        
    }

    .content_chamada p b{
        color: var(--bluesky-original-color);
        font-weight: bold;
    }
    
    /* --- button --- */
    
    .button1 button {
        border: 2px solid var(--green-original-color);
        border-radius: 50px;
        background-color: transparent;
        height: 45px;
        width: 13em;
        color: var(--green-original-color);
        font-weight: bold;
        font-size: .7em;
        letter-spacing: 0px;
        margin-top: .8em;
    }

    .button1 button:hover {
        background-color: var(--green-original-color);
        color: var(--blue-original-color);
    }
    
    
    /* ----- corbans ----- */
    
    .content_corbans {
        display: flex;
        justify-content: center;
        align-items: start;
        flex-direction: column;
        padding: 0 0 2em;
        margin: .5em 0 0 0;
        font-size: .6em;
        font-weight: bold;
        gap: 1em;
    }
    
    .content_corbans img {
        width: 330px;
        padding: 0;
        margin: 0;
    }

    
    
/* ---- banner ---- */

    .persona_1{
        position: absolute;
        z-index: -1;
        top: -4em;
        left: -21em;
        width: 19em;
        margin: 0 auto;
        padding: 0;
    }

    .lupa_1{
        display: none;
    }

    .content_img_chamada123 {
        transform: scale(1); /* Escala inicial (100%) */
        transform-origin: top top; /* Define o ponto de origem para a escala */
        transition: transform 0.3s ease; /* Transição suave ao redimensionar */
    }

    .congelar_group {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 22.5em;
        scale: 1.2;
    }



    /* ---- baloes ---- */

    .content_img_chamada3 {
        position: absolute;
        z-index: 1;
        padding: 0;
        margin: 0;
        width: 15em;
    }

}

@media screen and (min-width: 1300px) {

    .containerinput_button {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 5em;
        margin-top: 1em;
    }

    .button_folder {
        border: 2px solid var(--green-original-color);
        border-radius: 50px;
        background-color: transparent;
        height: 40px;
        width: 100px;
        color: var(--green-original-color);
        font-weight: bold;
        font-size: .7em;
        letter-spacing: 0px;
        margin-top: .8em;
        
    }

    .pesquisafolder_container {
        position: relative;
        width: 15em;
        border-radius: 50px;
        

    }
    
    
    input[type="text"] {
        width: 35em;
        padding: 12px 40px 12px 10px;
        font-size: 13px;
        border: 1px solid #ccc;
        border-radius: 100px;
        outline: none;
        background-color: white;
        margin-top: 1em;
    }


    .pesquisafolder_container>img {
        position: absolute;
        top: 1.05em;
        left: .7em;
    }

    .pesquisafolder_container span {
        content: "";
        position: absolute;
        top: 50%;
        left: .5em;
        transform: translateY(-50%);
        color: #888;
        font-size: 12px;
        
    }


    .gradient_linear>img{
        position: absolute;
        top: -5em;
        width: 100vw;
        height: 47em;
        padding: 0;
        
    }

    .content_principal {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        font-weight: 400;
        margin: 4.5em auto 15em;
        padding: 0 8em 10em 4em;
        height: auto;
    }
    
    .logo_ecorban1>img{
        scale: 1;
    }

    .logo_ecorban1 {
        padding: 0em 0 1em 0em;
        position: relative;
        margin: 0;
    }

    .logo_ecorban1 span::after {
        content: '';
        width: 60%;
        height: 2px;
        background-color: var(--white-original-color);
        position: absolute;
        top: 10%;
        left: 8em;
    }
    
    .chamada_button_corbans {
        display: flex;
        justify-content: center;
        align-items: start;
        flex-direction: column;
        padding: 0 0 2em 5em;
        margin: 1em 0 0 0;
        font-size: 1.5em;
        z-index: 6;
    }
    
    .content_chamada h1{
        color: var(--white-original-color);
        padding: 0;
        margin: .5em 0 .3em 0;
        line-height: 1.20em;
        font-size: 1.5em;
        width: 100%;
    }

    .content_chamada p{
        color: var(--white-original-color);
        padding: 0;
        margin-top: 1em 0 0 0;
        font-size: 1.3em;
        padding: 0;
        margin: 0;
        line-height: 1.3em;
        width: 18em;
        
    }

    .content_chamada p b{
        color: var(--bluesky-original-color);
        font-weight: bold;
    }
    
    /* --- button --- */
    
    .button1 button {
        border: 2px solid var(--green-original-color);
        border-radius: 50px;
        background-color: transparent;
        height: 45px;
        width: 13em;
        color: var(--green-original-color);
        font-weight: bold;
        font-size: .7em;
        letter-spacing: 0px;
        margin-top: .8em;
    }

    .button1 button:hover {
        background-color: var(--green-original-color);
        color: var(--blue-original-color);
    }
    
    
    /* ----- corbans ----- */
    
    .content_corbans {
        display: flex;
        justify-content: center;
        align-items: start;
        flex-direction: column;
        padding: 0 0 2em;
        margin: .5em 0 0 0;
        font-size: .6em;
        font-weight: bold;
        gap: 1em;
    }
    
    .content_corbans img {
        width: 330px;
        padding: 0;
        margin: 0;
    }

    
    
/* ---- banner ---- */

    .persona_1{
        position: absolute;
        z-index: -1;
        top: -3em;
        left: -24em;
        width: 19em;
        margin: 0 auto;
        padding: 0;
    }

    .lupa_1{
        display: none;
    }

    .content_img_chamada123 {
        transform: scale(1); /* Escala inicial (100%) */
        transform-origin: top top; /* Define o ponto de origem para a escala */
        transition: transform 0.3s ease; /* Transição suave ao redimensionar */
    }

    .congelar_group {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 22.5em;
        scale: 1.2;
    }



    /* ---- baloes ---- */

    .content_img_chamada3 {
        position: absolute;
        z-index: 1;
        padding: 0;
        margin: 0;
        width: 15em;
    }
}

@media screen and (min-width: 1500px){

    .content_principal {
        margin: 2em auto;
    }
}
@media screen and (min-width: 1600px){
    .gradient_linear>img {
        height: 10px;
        
    }
    
    .containerinput_button {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 5em;
        margin-top: 1em;
    }

    .button_folder {
        border: 2px solid var(--green-original-color);
        border-radius: 50px;
        background-color: transparent;
        height: 40px;
        width: 100px;
        color: var(--green-original-color);
        font-weight: bold;
        font-size: .7em;
        letter-spacing: 0px;
        margin-top: .8em;
        
    }

    .pesquisafolder_container {
        position: relative;
        width: 15em;
        border-radius: 50px;
        

    }
    
    
    input[type="text"] {
        width: 35em;
        padding: 12px 40px 12px 10px;
        font-size: 13px;
        border: 1px solid #ccc;
        border-radius: 100px;
        outline: none;
        background-color: white;
        margin-top: 1em;
    }



    .pesquisafolder_container>img {
        position: absolute;
        top: 1.05em;
        left: .7em;
    }

    .pesquisafolder_container span {
        content: "";
        position: absolute;
        top: 50%;
        left: .5em;
        transform: translateY(-50%);
        color: #888;
        font-size: 12px;
        
    }


    .gradient_linear>img{
        position: absolute;
        top: -5em;
        width: 100vw;
        height: 47em;
        padding: 0;
        
    }

    .content_principal {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        font-weight: 400;
        margin: 4.5em auto 15em 12em;
        padding: 0 8em 10em;
        height: auto;
    }
    
    .logo_ecorban1>img{
        scale: 1;
    }

    .logo_ecorban1 {
        padding: 0em 0 1em 0em;
        position: relative;
        margin: 0;
    }

    .logo_ecorban1 span::after {
        content: '';
        width: 60%;
        height: 2px;
        background-color: var(--white-original-color);
        position: absolute;
        top: 10%;
        left: 10em;
    }
    
    .chamada_button_corbans {
        display: flex;
        justify-content: center;
        align-items: start;
        flex-direction: column;
        padding: 0 0 2em 5em;
        margin: 1em 0 0 0;
        font-size: 1.5em;
        z-index: 6;
    }
    
    .content_chamada h1{
        color: var(--white-original-color);
        padding: 0;
        margin: .5em 0 .3em 0;
        line-height: 1.20em;
        font-size: 1.5em;
        width: 100%;
    }

    .content_chamada p{
        color: var(--white-original-color);
        padding: 0;
        margin-top: 1em 0 0 0;
        font-size: 1.3em;
        padding: 0;
        margin: 0;
        line-height: 1.3em;
        width: 18em;
        
    }

    .content_chamada p b{
        color: var(--bluesky-original-color);
        font-weight: bold;
    }
    
    /* --- button --- */
    
    .button1 button {
        border: 2px solid var(--green-original-color);
        border-radius: 50px;
        background-color: transparent;
        height: 45px;
        width: 13em;
        color: var(--green-original-color);
        font-weight: bold;
        font-size: .7em;
        letter-spacing: 0px;
        margin-top: .8em;
    }

    .button1 button:hover {
        background-color: var(--green-original-color);
        color: var(--blue-original-color);
    }
    
    
    /* ----- corbans ----- */
    
    .content_corbans {
        display: flex;
        justify-content: center;
        align-items: start;
        flex-direction: column;
        padding: 0 0 2em;
        margin: .5em 0 0 0;
        font-size: .6em;
        font-weight: bold;
        gap: 1em;
    }
    
    .content_corbans img {
        width: 330px;
        padding: 0;
        margin: 0;
    }

    
    
/* ---- banner ---- */

    .persona_1{
        position: absolute;
        z-index: -1;
        top: -4em;
        left: -25em;
        width: 19em;
        margin: 0 auto;
        padding: 0;
    }

    .lupa_1{
        display: none;
    }

    .content_img_chamada123 {
        transform: scale(1); /* Escala inicial (100%) */
        transform-origin: top top; /* Define o ponto de origem para a escala */
        transition: transform 0.3s ease; /* Transição suave ao redimensionar */
    }

    .congelar_group {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 22.5em;
        scale: 1.2;
    }



    /* ---- baloes ---- */

    .content_img_chamada3 {
        position: absolute;
        z-index: 1;
        padding: 0;
        margin: 0;
        width: 15em;
    }
    
 
}

@media screen and (min-width: 2000px) {

    .content_principal {
        margin: 2em auto;
    }

    .gradient_linear>img{
        position: absolute;
        top: -2em;
        right: 0;
        width: 100vw;
        height: auto;
        z-index: -2;
        padding: 0;
       
    }
}

/* ---------- header resolution extra large - end ---------- */

/* ---------- form resolution small - start ---------- */

.section_two {
    margin: 4em auto 0 auto;
}

.section_two  article{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin: 0 auto;
    padding: 0;
}

/* --------- text ----------- */

.section_two article h1{
    color: var(--white-original-color);
    width: 10em;
    text-align: center;
    font-size: 1.5em;
    margin: 3em 0 2em 0;
    padding-bottom: 1.8em;
    line-height: 1.2em;
    font-weight: 200;
    text-shadow: 0px 0px 10px black;
    border-bottom: 2px solid var(--bluesky-original-color);
}

.section_two article h1 b{
    font-weight: bold;
    color: var(--bluesky-original-color);
}

.divisao_h1_passo {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    color:var(--white-original-color);
    margin: 0 0 2em 0;
}

.passo_1 {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1em;
}

.text_passo1 {
    width: 20em;
    font-size: .8em;
}

.ball_1 {
    border-radius: 100px;
    width: 3em;
    height: 3em;
    background-color: var(--bluesky-original-color);
    box-shadow: 0px 0px 15px 8px rgba(0, 0, 0, 0.288);
}

.ball_1 p{
    text-align: center;
    font-weight: bold;
    margin: .8em 0 0 0;
    color: var(--blueback-original-color);
}

.passo_2 {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1em;
}

.text_passo2 {
    width: 20em;
    font-size: .8em;
}

.ball_2 {
    border-radius: 100px;
    width: 3em;
    height: 3em;
    background-color: var(--bluesky-original-color);
    box-shadow: 0px 0px 15px 8px rgba(0, 0, 0, 0.288);
}

.ball_2 p{
    text-align: center;
    font-weight: bold;
    margin: .8em 0 0 0;
    color: var(--blueback-original-color);
}

/* -------------------------- */

.form img {
    position: absolute;
    top: 20%;
    width: 100%;
    z-index: -2; /* ou até -1 se for só decorativa */
    pointer-events: none; /* ESSENCIAL para não bloquear cliques*/
}

.form {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    box-shadow: 0px 0px 15px 8px rgba(0, 0, 0, 0.288);
    background-color: #dedede0b;
    border: none;
    border-radius: 10px;
    margin: 2em auto 0 auto;
    width: 22em;
    height: auto;
    font-weight: 200;
    font-size: .9em;
    padding: 2em 1.5em;
    z-index: 0;
}


.fieldset_form {
    border: none;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 18em;
    margin: 0;
    padding: 0;
}


.fieldset_form input,
.fieldset_form select {
    border-radius: 5px;
    border: none;
    background-color: var(--white-original-color);
    box-shadow: 0px 0px 15px 8px rgba(0, 0, 0, 0.185);
    margin: 0;
    padding: 1em;
    width: 100%;
    z-index: 10;
    color: rgb(0, 0, 80);
}

.fieldset_form input{
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.fieldset_form select {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box; 
}
option {
    font-size: 1.2em;  
}

/* ---- */

.fieldset_form input:focus,
.fieldset_form select:focus {
    outline: none;
}

/* ---- */


label {
    color: var(--white-original-color);
    margin: 1em 0.5em 0 0;
    text-align:left;
    font-weight: 600;
}

/* ----- button ----- */

.fieldset_form button {
    background-color: var(--bluesky-original-color);    
    padding: .6em 1em;
    margin: 2em 0 0 0;
    border-radius: 50px;
    transition: color .5s ease-in-out, background-color .5s ease-in-out;
    font-size: 1em;
    font-weight: bold;
    color: var(--blueback-original-color);
    border: none;
    width: 100%;
}

.fieldset_form button:hover {
    background-color: transparent;
    outline: 2px solid  var(--bluesky-original-color);
    color: var(--bluesky-original-color);
    cursor: pointer;
}

/* ---------- form resolution small - end ---------- */

/* ---------- form resolution medium - start ---------- */

@media screen and (min-width: 700px) {

    .form {
        width: 30em;
    }
    .section_two article h1{
        width: 25em;
        font-size: 1.7em;
    }

    .fieldset_form {
        width: 25em;
    }

    .fieldset_form input,
    .fieldset_form select {
        border-radius: 5px;
        border: none;
        background-color: var(--white-original-color);
        box-shadow: 0px 0px 15px 8px rgba(0, 0, 0, 0.185);
        margin: 0;
        padding: 1em;
        width: 100%;
        z-index: 10;
        color: rgb(0, 0, 80);
    }

    .fieldset_form input{
        width: 170%;
    }

    .fieldset_form select {
        color: rgb(0, 0, 80);    
    }
    option {
        font-size: 1.2em;  
    }

}

/* ---------- form resolution medium - end ---------- */

/* ---------- form resolution large - start ---------- */

@media screen and (min-width: 950px) {

    .section_two {
        margin-top: 0em;
    }

    .form {
        width: 30em;
    }

    .section_two article h1{
        width: 10em;
        text-align: start;
        font-size: 1.7em;
        margin-top: -0em;
        border-bottom: 2px solid var(--bluesky-original-color);
        padding-bottom: 1em;
    }

    .section_two article{
        flex-direction: row;
        justify-content: center;
        align-items: start;
        gap: 5em;
        padding: 5em 0 0 0;
    }

    .divisao_h1_passo {
        align-items: start;
        
    }

    .form {
        margin: 0 3em 0 3em;
    }

}

/* ---------- form resolution large - end ---------- */

/* ---------- form resolution extra large - start ---------- */

@media screen and (min-width: 1300px) {

    .section_two .article {
        margin-top: -2em;
    }

    .form {
        width: 30em;
    }
    .section_two article h1{
        width: 10em;
        text-align: start;
        font-size: 2.1em;
    }
    .section_two article{
        padding: 5em 0 0 0;
    }
}

@media screen and (min-width: 1600px) {

    .section_two {
        padding-top: 0em;
        margin: 0;
    }

    .form {
        width: 30em;
    }
    .section_two article h1{
        width: 10em;
        text-align: start;
        font-size: 1.8em;
    }
    .section_two article{
        padding: 0 0 0 0;
    }
}

/* ---------- form resolution extra large - end ---------- */

/* ---------- tablet and computer small - start ---------- */

.section_three{
    margin: 10em auto 0em 0em;
    padding-bottom: 0;
    position: relative;
    color: var(--white-original-color);
}



.background_2 {
    background: url('./assets/images/backgrounds/fundo_escript_2.webp') no-repeat center center;
    z-index: -1;
    position: absolute;
    height: 49em;
}
.section_three_text h1{
    border-bottom: 1px solid var(--bluesky-original-color);
    padding: 3em 1em 1em 1em;
    font-size: 1.5em;
    width: 14em;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    flex-direction: column;
    line-height: 1.3em;
}


.section_three_text p{
    font-weight: 200;
    width: 18em;
    margin: 0 auto;
    padding-top: 1.2em;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: start;
    flex-direction: column;
}

/* ----- */

.busca {
    position: absolute;
    z-index: 1;
    width: 3.5em;
    padding: 0;
    top: 6.5em;
    right: 3.5em;
    
}

.busca_p {
    position: absolute;
    z-index: 1;
    width: 11em;
    padding: 0;
    top: 14.8em;
    right: 3em;
    font-size: .6em;
    text-align: center;
    color: var(--blue-original-color);
    font-weight: 400;
}
.busca_p b{
    font-weight: bold;
}


.enriquecimento {
    position: absolute;
    z-index: 1;
    width: 3.5em;
    padding: 0;
    top: 3em;

}

.enriquecimento_p {
    position: absolute;
    z-index: 1;
    width: 12em;
    padding: 0;
    top: 9em;
    font-size: .6em;
    text-align: center;
    color: var(--blue-original-color);
    font-weight: 400;
}
.enriquecimento_p b{
    font-weight: bold;
}

.suporte {
    position: absolute;
    z-index: 1;
    width: 3.5em;
    padding: 0;
    top: 17.5em;
}

.suporte_p {
    position: absolute;
    z-index: 1;
    width: 11em;
    padding: 0;
    top: 33em;
    font-size: .6em;
    text-align: center;
    color: var(--blue-original-color);
    font-weight: 400;
}
.suporte_p b{
    font-weight: bold;
}

.controle {
    position: absolute;
    z-index: 1;
    width: 3.5em;
    padding: 0;
    top: 13.5em;
    left: 3.5em;
}

.controle_p {
    position: absolute;
    z-index: 1;
    width: 10em;
    padding: 0;
    top: 25.8em;
    left: 3.8em;
    font-size: .6em;
    text-align: center;
    color: var(--blue-original-color);
    font-weight: 400;
}
.controle_p b{
    font-weight: bold;
}

.calendario {
    position: absolute;
    z-index: 1;
    width: 3.5em;
    padding: 0;
    top: 6.5em;
    left: 3.5em;
}


.calendario_p {
    position: absolute;
    z-index: 1;
    width:10em;
    padding: 0;
    top: 14.8em;
    left: 3.5em;
    font-size: .6em;
    text-align: center;
    color: var(--blue-original-color);
    font-weight: 400;
}
.calendario_p b{
    font-weight: bold;
}

.lgpd {
    position: absolute;
    z-index: 1;
    width: 3.5em;
    padding: 0;
    top: 13.5em;
    right: 3.5em;
}

.lgpd_p {
    position: absolute;
    z-index: 1;
    width: 9em;
    padding: 0;
    top: 26.5em;
    right:4.3em;
    font-size: .6em;
    text-align: center;
    color: var(--blue-original-color);
    font-weight: 400;
}
.lgpd_p b{
    font-weight: bold;
}

/* ----- */

.elements_tablet{
    position: relative;
    width: 23em;
    height: 30em;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin: 0em auto 0 auto;
    padding: 2em 0 0 0;
}

.tablet {
    position: absolute;
    z-index: 1;
    width: 25em;
    padding: 2em 0 8em 0;
}



/* ---------- tablet and computer small - end ---------- */

/* ---------- tablet and computer medium - start ---------- */

@media screen and (min-width: 950px) {

    .section_three{
        margin: 10em auto 0em 0em;
        padding-bottom: 0;
        position: relative;
        color: var(--white-original-color);
        height: auto;
    }

    .section_three_elements {
        display: flex;
        justify-content:center;
        align-items: center;
        flex-direction: row;
        width: 100%;
        margin: 0 auto;
        height: auto;
    }


    .background_2 {
        background: url('./assets/images/backgrounds/fundo_escript_2.webp') no-repeat center center;
        background-size: cover;
        width: 100vw;
        height: 100%;
        z-index: -1;
        position: absolute;
    }

    .section_three_text{
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: start;
        flex-direction: column;
        width: 20em;
        margin: 0 auto;
    }


    .section_three_text h1{
        border-bottom: 1px solid var(--bluesky-original-color);
        padding: 0 0 .5em 0;
        font-size: 1.8em;
        width: 12em;
        margin: 0 auto;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: start;
        flex-direction: column;
        line-height: 1.3em;
    }


    .section_three_text p{
        font-weight: 200;
        width: 100%;
        margin: 0 auto;
        padding: 1.2em 0 0 0;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: start;
        flex-direction: column;
    }

    /* ----- */

    .busca {
        position: absolute;
        z-index: 1;
        width: 3.5em;
        padding: 0;
        top: 7.5em;
        right: 3em;
        
    }

    .busca_p {
        position: absolute;
        z-index: 1;
        width: 11em;
        padding: 0;
        top: 14em;
        right: 1em;
        font-size: .7em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .busca_p b{
        font-weight: bold;
    }


    .enriquecimento {
        position: absolute;
        z-index: 1;
        width: 3.5em;
        padding: 0;
        top: 4em;

    }

    .enriquecimento_p {
        position: absolute;
        z-index: 1;
        width: 12em;
        padding: 0;
        top: 9em;
        font-size: .7em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .enriquecimento_p b{
        font-weight: bold;
    }

    .suporte {
        position: absolute;
        z-index: 1;
        width: 3.5em;
        padding: 0;
        top: 20em;
    }

    .suporte_p {
        position: absolute;
        z-index: 1;
        width: 11em;
        padding: 0;
        top: 32em;
        font-size: .7em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .suporte_p b{
        font-weight: bold;
    }

    .controle {
        position: absolute;
        z-index: 1;
        width: 3.5em;
        padding: 0;
        top: 16em;
        left: 2.5em;
    }

    .controle_p {
        position: absolute;
        z-index: 1;
        width: 10em;
        padding: 0;
        top: 26em;
        left: 1em;
        font-size: .7em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .controle_p b{
        font-weight: bold;
    }

    .calendario {
        position: absolute;
        z-index: 1;
        width: 3.5em;
        padding: 0;
        top: 7.5em;
        left: 2.6em;
    }


    .calendario_p {
        position: absolute;
        z-index: 1;
        width:10em;
        padding: 0;
        top: 14em;
        left: 1em;
        font-size: .7em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .calendario_p b{
        font-weight: bold;
    }

    .lgpd {
        position: absolute;
        z-index: 1;
        width: 3.5em;
        padding: 0;
        top: 16em;
        right: 2.5em;
    }

    .lgpd_p {
        position: absolute;
        z-index: 1;
        width: 9em;
        padding: 0;
        top: 26em;
        right: 1.5em;
        font-size: .7em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .lgpd_p b{
        font-weight: bold;
    }

    /* ----- */

    .elements_tablet{
        position: relative;
        width: 23em;
        height: 30em;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        margin: 0 auto 0 auto;
        padding: 0;
    }

    .tablet {
        position: absolute;
        z-index: 1;
        width: 28em;
        padding: 0;
    }

}

/* ---------- tablet and computer medium - end ---------- */



/* ---------- tablet and computer extra large - start ---------- */

@media screen and (min-width: 1100px) {

    .section_three{
        margin: 5em auto 0em 0em;
        padding: 10em 0;
        position: relative;
        color: var(--white-original-color);
        height: auto;
    }

    .section_three_elements {
        display: flex;
        justify-content:center;
        align-items: center;
        flex-direction: row;
        width: 65em;
        margin: 0 auto;
        height: auto;
    }


    .background_2 {
        background: url('./assets/images/backgrounds/fundo_escript_2.webp') no-repeat center center;
        background-size: cover;
        width: 100vw;
        height: 100%;
        z-index: -1;
        position: absolute;
    }

    .section_three_text{
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: start;
        flex-direction: column;
        width: 20em;
        margin: 0 auto 0 0;
        padding: 25em 0 0 0;
    }


    .section_three_text h1{
        border-bottom: 1px solid var(--bluesky-original-color);
        padding: 0 0 .5em 0;
        font-size: 1.8em;
        width: 12em;
        margin: 0 auto;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: start;
        flex-direction: column;
        line-height: 1.3em;
    }


    .section_three_text p{
        font-weight: 200;
        width: 100%;
        margin: 0 auto;
        padding: 1.2em 0 0 0;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: start;
        flex-direction: column;
    }

    /* ----- */

    .busca {
        position: absolute;
        z-index: 1;
        width: 4.5em;
        padding: 0;
        top: 16.5em;
        right: -.8em;
        
    }

    .busca_p {
        position: absolute;
        z-index: 1;
        width: 11em;
        padding: 0;
        top: 25em;
        right: -3.8em;
        font-size: .8em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .busca_p b{
        font-weight: bold;
    }


    .enriquecimento {
        position: absolute;
        z-index: 1;
        width: 4.5em;
        padding: 0;
        top: 10.2em;

    }

    .enriquecimento_p {
        position: absolute;
        z-index: 1;
        width: 12em;
        padding: 0;
        top: 17em;
        font-size: .8em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .enriquecimento_p b{
        font-weight: bold;
    }

    .suporte {
        position: absolute;
        z-index: 1;
        width: 4.5em;
        padding: 0;
        top: 33.5em;
    }

    .suporte_p {
        position: absolute;
        z-index: 1;
        width: 11em;
        padding: 0;
        top: 46em;
        font-size: .8em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .suporte_p b{
        font-weight: bold;
    }

    .controle {
        position: absolute;
        z-index: 1;
        width: 4.5em;
        padding: 0;
        top: 27.5em;
        left: -.8em;
    }

    .controle_p {
        position: absolute;
        z-index: 1;
        width: 15em;
        padding: 0;
        top: 38em;
        left: -5.6em;
        font-size: .8em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .controle_p b{
        font-weight: bold;
    }

    .calendario {
        position: absolute;
        z-index: 1;
        width: 4.5em;
        padding: 0;
        top: 16.5em;
        left: -1em;
    }


    .calendario_p {
        position: absolute;
        z-index: 1;
        width:10em;
        padding: 0;
        top: 25em;
        left: -3.8em;
        font-size: .8em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .calendario_p b{
        font-weight: bold;
    }

    .lgpd {
        position: absolute;
        z-index: 1;
        width: 4.5em;
        padding: 0;
        top: 27.5em;
        right: -.8em;
    }

    .lgpd_p {
        position: absolute;
        z-index: 1;
        width: 9em;
        padding: 0;
        top: 38em;
        right: -2.6em;
        font-size: .8em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .lgpd_p b{
        font-weight: bold;
    }

    /* ----- */

    .elements_tablet{
        position: relative;
        width: 23em;
        height: 30em;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        margin: 0 auto 0 auto;
        padding: 0;
    }

    .tablet {
        position: absolute;
        z-index: 1;
        top: 8em;
        width: 40em;
        padding: 0;
    }
 
}

@media screen and (min-width: 1300px) {

    
    .section_three{
        margin: 10em auto 0em 0em;
        padding: 10em 0;
        position: relative;
        color: var(--white-original-color);
        height: auto;
    }

    .section_three_elements {
        display: flex;
        justify-content:center;
        align-items: center;
        flex-direction: row;
        width: 80em;
        margin: 0 auto;
        height: auto;
    }


    .background_2 {
        background: url('./assets/images/backgrounds/fundo_escript_2.webp') no-repeat center center;
        background-size: cover;
        width: 100vw;
        height: 100%;
        z-index: -1;
        position: absolute;
    }

    .section_three_text{
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: start;
        flex-direction: column;
        width: 25em;
        margin: 0 auto;
        padding: 25em 0 0 0;
    }


    .section_three_text h1{
        border-bottom: 1px solid var(--bluesky-original-color);
        padding: 0 0 .5em 0;
        font-size: 2.1em;
        width: 12em;
        margin: 0 auto;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: start;
        flex-direction: column;
        line-height: 1.3em;
    }


    .section_three_text p{
        font-weight: 200;
        width: 100%;
        margin: 0 auto;
        padding: 1.2em 0 0 0;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: start;
        flex-direction: column;
    }

    /* ----- */

    .busca {
        position: absolute;
        z-index: 1;
        width: 4.5em;
        padding: 0;
        top: 16.5em;
        right: -.8em;
        
    }

    .busca_p {
        position: absolute;
        z-index: 1;
        width: 11em;
        padding: 0;
        top: 25em;
        right: -3.8em;
        font-size: .8em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .busca_p b{
        font-weight: bold;
    }


    .enriquecimento {
        position: absolute;
        z-index: 1;
        width: 4.5em;
        padding: 0;
        top: 10.2em;

    }

    .enriquecimento_p {
        position: absolute;
        z-index: 1;
        width: 12em;
        padding: 0;
        top: 17em;
        font-size: .8em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .enriquecimento_p b{
        font-weight: bold;
    }

    .suporte {
        position: absolute;
        z-index: 1;
        width: 4.5em;
        padding: 0;
        top: 33.5em;
    }

    .suporte_p {
        position: absolute;
        z-index: 1;
        width: 11em;
        padding: 0;
        top: 46em;
        font-size: .8em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .suporte_p b{
        font-weight: bold;
    }

    .controle {
        position: absolute;
        z-index: 1;
        width: 4.5em;
        padding: 0;
        top: 27.5em;
        left: -.8em;
    }

    .controle_p {
        position: absolute;
        z-index: 1;
        width: 15em;
        padding: 0;
        top: 38em;
        left: -5.6em;
        font-size: .8em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .controle_p b{
        font-weight: bold;
    }

    .calendario {
        position: absolute;
        z-index: 1;
        width: 4.5em;
        padding: 0;
        top: 16.5em;
        left: -1em;
    }


    .calendario_p {
        position: absolute;
        z-index: 1;
        width:10em;
        padding: 0;
        top: 25em;
        left: -3.8em;
        font-size: .8em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .calendario_p b{
        font-weight: bold;
    }

    .lgpd {
        position: absolute;
        z-index: 1;
        width: 4.5em;
        padding: 0;
        top: 27.5em;
        right: -.8em;
    }

    .lgpd_p {
        position: absolute;
        z-index: 1;
        width: 9em;
        padding: 0;
        top: 38em;
        right: -2.6em;
        font-size: .8em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .lgpd_p b{
        font-weight: bold;
    }

    /* ----- */

    .elements_tablet{
        position: relative;
        width: 23em;
        height: 30em;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        margin: 0 12.5em 0 auto;
        padding: 0;
    }

    .tablet {
        position: absolute;
        z-index: 1;
        top: 8em;
        width: 40em;
        padding: 0;
    }
}

@media screen and (min-width: 1600px) {

    .section_three_elements {
        display: flex;
        justify-content:center;
        align-items: center;
        flex-direction: row;
        width: 80em;
        margin: 0 auto;
        height: auto;
        gap: 15em;
    }

    .section_three{
        margin: 10em auto 0em 0em;
        padding: 10em 0;
        position: relative;
        color: var(--white-original-color);
        height: 40em;
    }


    .background_2 {
        background: url('./assets/images/backgrounds/fundo_escript_2.webp') no-repeat center center;
        background-size: cover;
        width: 100vw;
        height: 100%;
        z-index: -1;
        position: absolute;
    }

    .section_three_text{
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: start;
        flex-direction: column;
        width: 20em;
        margin: 0 auto;
        padding: 10em 0 0 0;
    }


    .section_three_text h1{
        border-bottom: 1px solid var(--bluesky-original-color);
        padding: 0 0 .5em 0;
        font-size: 2.5em;
        width: 12em;
        margin: 0 auto;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: start;
        flex-direction: column;
        line-height: 1.3em;
    }


    .section_three_text p{
        font-weight: 200;
        width: 100%;
        margin: 0 auto;
        padding: 1.2em 0 0 0;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: start;
        flex-direction: column;
    }

    /* ----- */

    .busca {
        position: absolute;
        z-index: 1;
        width: 4.5em;
        padding: 0;
        top: 10em;
        right: -.8em;
        
    }

    .busca_p {
        position: absolute;
        z-index: 1;
        width: 11em;
        padding: 0;
        top: 16.5em;
        right: -3.8em;
        font-size: .8em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .busca_p b{
        font-weight: bold;
    }


    .enriquecimento {
        position: absolute;
        z-index: 1;
        width: 4.5em;
        padding: 0;
        top: 4.2em;

    }

    .enriquecimento_p {
        position: absolute;
        z-index: 1;
        width: 12em;
        padding: 0;
        top: 9.5em;
        font-size: .8em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .enriquecimento_p b{
        font-weight: bold;
    }

    .suporte {
        position: absolute;
        z-index: 1;
        width: 4.5em;
        padding: 0;
        top: 27.5em;
    }

    .suporte_p {
        position: absolute;
        z-index: 1;
        width: 11em;
        padding: 0;
        top: 38.5em;
        font-size: .8em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .suporte_p b{
        font-weight: bold;
    }

    .controle {
        position: absolute;
        z-index: 1;
        width: 4.5em;
        padding: 0;
        top: 22em;
        left: -.8em;
    }

    .controle_p {
        position: absolute;
        z-index: 1;
        width: 15em;
        padding: 0;
        top: 31em;
        left: -5.6em;
        font-size: .8em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .controle_p b{
        font-weight: bold;
    }

    .calendario {
        position: absolute;
        z-index: 1;
        width: 4.5em;
        padding: 0;
        top: 10em;
        left: -.8em;
    }


    .calendario_p {
        position: absolute;
        z-index: 1;
        width:10em;
        padding: 0;
        top: 16.5em;
        left: -3.8em;
        font-size: .8em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .calendario_p b{
        font-weight: bold;
    }

    .lgpd {
        position: absolute;
        z-index: 1;
        width: 4.5em;
        padding: 0;
        top: 21.5em;
        right: -.8em;
    }

    .lgpd_p {
        position: absolute;
        z-index: 1;
        width: 9em;
        padding: 0;
        top: 31em;
        right: -2.6em;
        font-size: .8em;
        text-align: center;
        color: var(--blue-original-color);
        font-weight: 400;
    }
    .lgpd_p b{
        font-weight: bold;
    }

    /* ----- */

    .elements_tablet{
        position: relative;
        width: 23em;
        height: 30em;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        margin: 0 12.5em 0 auto;
        padding: 0;
    }

    .tablet {
        position: absolute;
        z-index: 1;
        top: 2em;
        width: 40em;
        padding: 0;
    }
}


/* ---------- tablet and computer extra large - end ---------- */

/* ---------- function small - start ---------- */

.section_four {
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin: 2em auto 0 auto;
    gap: 1em;
    font-family: 'poppins', sans-serif;
    font-weight: 200;
    color: var(--white-original-color);
}

.section_four h1 {
    text-align: center;
    font-size: 1.5em;
    line-height: 1.2em;
    width: 10em;
    margin-bottom: 0;
    font-weight: bold;
    text-shadow: 0px 0px 10px black;
    border-bottom: 1px solid var(--bluesky-original-color);
    padding-bottom: .5em;
}
.section_four_text>p {
    display: flex;
    justify-content: center;
    align-items: start;
    text-align: start;
    margin: 0;
    font-size: .8em;
    
    
}
.section_four h3 {
    margin: .5em 0 0 0;
}

.elements_function {
    display: flex;
    justify-content: center;
    align-items: start;
    flex-direction: column;
}

.fuction_1 img{
    width: 7em;
    height: auto;
    margin: 1em 0 0 0 ;
    padding: 0;
}

.fuction_1{
    display: flex;
    justify-content: center;
    align-items: start;
    flex-direction: column;
}

.fuction_1 p{
    width: 12em;
    padding: 0;
    margin:  0;
}

.fuction_importar,
.fuction_campanhas,
.fuction_gerar{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 1em;
    color: var(--white-original-color);
    line-height: 1.2em;
    padding: 1em;
    text-align: center;
}


/* ------- button ------- */

.section_four button {
    background-color: var(--bluesky-original-color);    
    padding: .6em 1em;
    margin: 4em 0 0 0;
    border-radius: 50px;
    transition: color .5s ease-in-out, background-color .5s ease-in-out;
    font-size: 1em;
    font-weight: bold;
    color: var(--blueback-original-color);
    border: none;
    width: 10em;
}

.section_four button:hover {
    background-color: transparent;
    outline: 2px solid var(--bluesky-original-color);
    color:var(--bluesky-original-color);
    cursor: pointer;
}

/* ---------- function small - end ---------- */

/* ---------- function large - start ---------- */

@media screen and (min-width: 950px) {

.section_four {
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin: 2em auto 0 auto;
    gap: 1em;
    font-family: 'poppins', sans-serif;
    font-weight: 200;
    color: var(--white-original-color);
}

.section_four h1 {
    text-align: center;
    font-size: 1.8em;
    line-height: 1.2em;
    width: 13em;
    font-weight: bold;
    margin-bottom: 0;
    text-shadow: 0px 0px 10px black;
    border-bottom: 1px solid var(--bluesky-original-color);
    padding-bottom: .5em;
}
.section_four_text>p {
    display: flex;
    justify-content: center;
    align-items: start;
    text-align: start;
    margin: 0;
    font-size: .8em;
    
    
}
.section_four h3 {
    margin: .5em 0 0 0;
}

.elements_function {
    display: flex;
    justify-content: center;
    align-items: start;
    flex-direction: column;
}

.fuction_1 img{
    width: 7em;
    height: auto;
    margin: 1em 0 0 0 ;
    padding: 0;
}

.fuction_1{
    display: flex;
    justify-content: center;
    align-items: start;
    flex-direction: row;
    gap: 5em;
}

.fuction_1 p{
    width: 12em;
    padding: 0;
    margin:  0;
}

.fuction_importar,
.fuction_campanhas,
.fuction_gerar{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 1em;
    color: var(--white-original-color);
    line-height: 1.2em;
    padding: 1em;
    text-align: center;
}


/* ------- button ------- */

.section_four button {
    background-color: var(--bluesky-original-color);    
    padding: .6em 1em;
    margin: 4em 0 4em 0;
    border-radius: 50px;
    transition: color .5s ease-in-out, background-color .5s ease-in-out;
    font-size: 1em;
    font-weight: bold;
    color:var(--blueback-original-color);
    border: none;
    width: 10em;
}

.section_four button:hover {
    background-color: transparent;
    outline: 2px solid var(--bluesky-original-color);
    color: var(--bluesky-original-color);
    cursor: pointer;
}

    
}

/* ---------- function large - end ---------- */

@media screen and (min-width: 1100px) {

.section_four {
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin: 15em auto 0 auto;
    gap: 1em;
    font-family: 'poppins', sans-serif;
    font-weight: 200;
    color: var(--white-original-color);
}

.section_four h1 {
    text-align: center;
    font-size: 1.8em;
    line-height: 1.2em;
    width: 13em;
    font-weight: bold;
    margin: 0 0 1em;
    text-shadow: 0px 0px 10px black;
    border-bottom: 1px solid var(--bluesky-original-color);
    padding-bottom: .5em;
    
}
.section_four_text>p {
    display: flex;
    justify-content: center;
    align-items: start;
    text-align: start;
    margin: 0;
    font-size: .8em;
    
    
}
.section_four h3 {
    margin: .5em 0 0 0;
}

.elements_function {
    display: flex;
    justify-content: center;
    align-items: start;
    flex-direction: column;
    margin-top: 3em;
}

.fuction_1 img{
    width: 7em;
    height: auto;
    margin: 1em 0 0 0 ;
    padding: 0;
}

.fuction_1{
    display: flex;
    justify-content: center;
    align-items: start;
    flex-direction: row;
    gap: 5em;
}

.fuction_1 p{
    width: 12em;
    padding: 0;
    margin:  0;
}

.fuction_importar,
.fuction_campanhas,
.fuction_gerar{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 1em;
    color: var(--white-original-color);
    line-height: 1.2em;
    padding: 1em;
    text-align: center;
}


/* ------- button ------- */

.section_four button {
    background-color: var(--bluesky-original-color);    
    padding: .6em 1em;
    margin: 4em 0 5em 0;
    border-radius: 50px;
    transition: color .5s ease-in-out, background-color .5s ease-in-out;
    font-size: 1em;
    font-weight: bold;
    color: var(--blueback-original-color);
    border: none;
    width: 10em;
}

.section_four button:hover {
    background-color: transparent;
    outline: 2px solid var(--bluesky-original-color);
    color: var(--bluesky-original-color);
    cursor: pointer;
}

    
}

/* ---------- function extra large - start ---------- */

@media screen and (min-width: 1300px) {

    .section_four {
        margin: 15em auto auto auto;
    }
    .section_four h1{
         font-size: 2.1em;
    }
    .elements_function {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row;
        gap: 6em;
    }
    
}
@media screen and (min-width: 1600px) {

    .section_four h1{
        font-size: 2.5em;
    }
    .elements_function {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row;
        gap: 6em;
    }
    
}

/* ---------- function extra large - end ---------- */

/* <!-- -------- planos - mobile ------ --> */

.planos {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    color: var(--white-original-color);
    height: auto;
    margin-top: 10em;
    background-color: #cccccc32;

}

.planos_title {
    font-size: 1.5em;
    color: var(--primary-color);
    padding: 1em 1em 0 1em;
    margin-bottom: 1em;
    display: block;
    text-align: center;
}

.container-plan1 {
    flex: 1;
    padding: 1em 3em 2em;
    margin-top: 6em;
    margin-bottom: 10em;
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border: 1px solid var(--bluesky-original-color);
    position: relative; 
}
.container-plan {
    flex: 1;
    padding: 1em 1.5em 3.5em;
    margin-bottom: 2em;
    border-radius: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border-bottom: .5px solid var(--green-original-color);
}


.border_plan_quant {
    
    width: 12em;
    padding: 0;
    display: block;
    text-align: center;
    margin-bottom: 2em;
}

.plan_quant {
    margin: 0 0 .3em 0;
    padding: 0 ;
    color: var(--white-original-color);
}

.plan_quant b {
    text-transform: uppercase;
    font-weight: bold;
}
.color1 {
    color: var(--green-original-color);
}
.color2 {
    color: var(--green-original-color);
}
.color3 {
    color: var(--bluesky-original-color);
    margin-top: .5em;
}
.pricing-plan p {
    margin-top: 0;

}

.plan_valor {
    color: var(--white-original-color);
    font-size: 33px;
    font-weight: bold;
}

.plan_detalhes {

    color: #a9a9a9;
    padding-left: 16px;
    line-height: 1.8;

}


.plan_quero {
    text-decoration: none;
    border-radius: 50PX;
    font-size: 1em;
    font-weight: bold;
    padding: .5em 2em;
    text-align: center;
    color: var(--green-original-color);
    border: 1px solid var(--green-original-color);
    background-color: transparent;
    transition: background-color .5s;
}
.plan_quero:hover {
    background-color: var(--green-original-color);
    color: var(--blue-original-color);
}

.plan_detalhes li::marker {
    color: #a9a9a9;
}

.color {
    background-color: var(--bluesky-original-color);
    color: var(--blueback-original-color);
    border: 1px solid var(--bluesky-original-color);
}
.color:hover {
    background-color: transparent;
    color: var(--bluesky-original-color);
}
ul {
    padding-bottom: 1em;
}
.maisvendido_container {
    background-color: rgb(252, 65, 65);
    color: white;
    height: 1.7em;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 8em;
    border-radius: 0px;
    margin-bottom:1.5em;
    margin: 1em 1em 0 0;
    padding: 1.2em 0 ;
    position: relative;
}

.mv {
    width: 100%;
    display: flex;
    justify-content:right;
    align-items: center;
    position: absolute;
    top: -3.4em;
    z-index: 1;
}





/* <!-- -------- planos - maiores resolucoes ------ --> */

@media screen and (min-width: 950px) {

.media_queries {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    gap: 4em;
    margin-bottom: 2em;
}

    .planos {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    color: var(--white-original-color);
    height: auto;
    margin-top: 0em;
    background-color: #cccccc32;

}

.planos_title {
    font-size: 1.8em;
    color: var(--primary-color);
    padding: 1em 1em 0 1em;
    margin-bottom: 3em;
    display: block;
    text-align: center;
}

.container-plan1 {
    flex: 1;
    padding: 1em 3em 2em;
    margin-top: -2em;
    margin-bottom: 2em;
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border: 1px solid var(--bluesky-original-color);
    position: relative; 
}
.container-plan {
    flex: 1;
    padding: 1em 1.5em 3.5em;
    margin-bottom: 2em;
    border-radius: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border-bottom:none
}


.border_plan_quant {
    
    width: 12em;
    padding: 0;
    display: block;
    text-align: center;
    margin-bottom: 2em;
}

.plan_quant {
    margin: 0 0 .3em 0;
    padding: 0 ;
    color: var(--white-original-color);
}

.plan_quant b {
    text-transform: uppercase;
    font-weight: bold;
}
.color1 {
    color: var(--green-original-color);
}
.color2 {
    color: var(--green-original-color);
}
.color3 {
    color: var(--bluesky-original-color);
    margin-top: .5em;
}
.pricing-plan p {
    margin-top: 0;

}

.plan_valor {
    color: var(--white-original-color);
    font-size: 1.75em;
    font-weight: bold;
}

.plan_detalhes {

    color: #a9a9a9;
    padding-left: 16px;
    line-height: 1.8;

}


.plan_quero {
    text-decoration: none;
    border-radius: 50PX;
    font-size: 1em;
    font-weight: bold;
    padding: .5em 2em;
    text-align: center;
    color: var(--green-original-color);
    border: 1px solid var(--green-original-color);
    background-color: transparent;
    transition: background-color .5s;
}
.plan_quero:hover {
    background-color: var(--green-original-color);
    color: var(--blue-original-color);
}

.plan_detalhes li::marker {
    color: #a9a9a9;
}

.color {
    background-color: var(--bluesky-original-color);
    color: var(--blueback-original-color);
    border: 1px solid var(--bluesky-original-color);
}
.color:hover {
    background-color: transparent;
    color: var(--bluesky-original-color);
}
ul {
    padding-bottom: 1em;
}
.maisvendido_container {
    background-color: rgb(252, 65, 65);
    color: white;
    height: 1.7em;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 8em;
    border-radius: 0px;
    margin-bottom:1.5em;
    margin: 1em 1em 0 0;
    padding: 1.2em 0 ;
    position: relative;
}

.mv {
    width: 100%;
    display: flex;
    justify-content:right;
    align-items: center;
    position: absolute;
    top: -3.4em;
    z-index: 1;
}


}

@media screen and (min-width: 1100px) {

    .media_queries {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row;
        gap: 7em;
        margin-bottom: 3em;
}

    .planos_title {
        font-size: 2.1em;
        color: var(--primary-color);
        padding: 1em 1em 0 1em;
        margin-bottom: 3em;
        display: block;
        text-align: center;

}
}
@media screen and (min-width: 1300px) {

    .media_queries {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row;
        gap: 7em;
        margin-bottom: 3em;
}

    .planos_title {
        font-size: 2.1em;
        color: var(--primary-color);
        padding: 1em 1em 0 1em;
        margin-bottom: 3em;
        display: block;
        text-align: center;

}

}

@media screen and (min-width: 1600px) {


    .planos_title {
        font-size: 2.5em;
        color: var(--primary-color);
        padding: 1em 1em 0 1em;
        margin-bottom: 3em;
        display: block;
        text-align: center;

}
}



/* ---------- frase final small - start ---------- */

.section_six {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 0;
    height: 10em;
    position: relative;
}


.section_six h1 {
    position: absolute;
    display: block;
    justify-content: center;
    align-items: center;
    margin: 8em 0 0 0;
    padding: 0em 2em 4em 2em;
    text-align: center;
    color: var(--white-original-color);
    font-size: 1.5em;
    line-height: 1.2em;
    width: 100%;
    font-weight: 400;
    text-shadow: 0px 0px 10px black;
}

/* ---------- frase final small - end ---------- */

/* ---------- frase final medium - start ---------- */

@media screen and (min-width: 500px) {

    .section_six h1 {
        width: 22em;
    }

}

/* ---------- frase final medium - end ---------- */

/* ---------- frase final large - start ---------- */

@media screen and (min-width: 950px) {

    .section_six {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        margin: 0 auto;
        height: 10em;
        position: relative;
        padding: 7em 0 10em 0;
    }
    .section_six h1 {
        font-size: 2em;
        width: 25em;
    }

}

/* ---------- frase final large - end ---------- */

/* ---------- frase final extra large - start ---------- */

@media screen and (min-width: 1300px) {


    .section_six h1 {
        font-size: 2.2em;
        padding: 0 2em ;
        margin: 0 0 -6em;
    }

    .section_six {
        padding: 7em 0 20em 0;
    }
    
}

/* ---------- frase final extra large - end ---------- */

/* ---------- frase final 2 small - start ---------- */

.section_eight {
    height: auto;
    color: var(--white-original-color);
    line-height: 1.8em;
    width: 70%;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-align: center;
    font-weight: 200;
}

.frase_final2 {
    margin: 0;
    padding: 3em 0 0 0;
    font-size: 1.5em;
}
.frase_final2 p{
    margin: 0;
    text-shadow: 0px 0px 10px black;
}
.frase_final2 b{
    font-weight: bold;
}

.section_eight .button1 button{
    font-size: 1em;
    background-color: var(--green-original-color);
    color: var(--blueback-original-color);
}
.section_eight .button1 button:hover{
    font-size: 1em;
    background-color: transparent;
    color: var(--green-original-color);
}

/* ---------- frase final 2 small - end ---------- */

@media screen and (min-width: 950px){

    .section_eight {
       
        width: 30em;
        
    }
    .frase_final2 {
        margin: 3em 0 1em 0;
        padding: 3em 0 0 0;
        font-size: 2em;
        line-height: 1.2em;
    }
}


@media screen and (min-width: 1300px){

    .section_eight {
       
        width: 40em;
        
    }
    .frase_final2 {
        margin: 3em 0 1em 0;
        padding: 3em 0 0 0;
        font-size: 2.1em;
        line-height: 1.2em;
    }
}
@media screen and (min-width: 1600px){

    .section_eight {
       
        width: 40em;
        
    }
    .frase_final2 {
        margin: 3em 0 1em 0;
        padding: 3em 0 0 0;
        font-size: 2.5em;
        line-height: 1.2em;
    }
}

/* ---------- footer small - start ---------- */

.footer_seven {
    padding: 4em 2em 2em 2em;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin: 0 auto;
    gap: 1em;
    font-family: 'poppins', sans-serif;
    font-weight: 200;
    color: var(--white-original-color);
}

.elements_footer {
    display: flex;
    justify-content: center;
    align-items: start;
    flex-direction: column;
    
}

.footer_1 img{
    width: 1.5em;
    height: auto;
    margin: 0 auto;
    padding: 0;
}

.footer_1 a{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    text-decoration: none;
    gap: .5em;
    transition: scale .3s ease-in-out, box-shadow .3s ease-in-out;
    padding: 0 1em 0 1em;
    border-radius: 50px;
}

.footer_1 a:hover{
    scale: 1.05;
    box-shadow: 0px 0px 15px 4px rgba(0, 32, 102, 0.2);
}

.footer_1{
    display: flex;
    justify-content: center;
    align-items: start;
    flex-direction: column;
}

.footer_1 p{
    color: var(--white-original-color);
}

.footer_insta,
.footer_whats,
.footer_email {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1em;
    color: var(--white-original-color);
    line-height: 1.2em;
    padding: 0em;
}

.version {
    color: var(--white-original-color);
    font-size: .7em;
    line-height: 1.2em;
    width: 11em;
    margin: 5em auto 0 auto;
    font-weight: 200;
    text-align: center;
}

/* ---------- footer small - end ---------- */

/* ---------- footer medium - start ---------- */

@media screen and (min-width: 700px) {

    .footer_seven {
        padding: 4em 2em 2em 2em;
    }

    .footer_1 p{
        font-size: .8em;
    }

    .footer_insta,
    .footer_whats,
    .footer_email {
        display: flex;
        justify-content: center;
        align-items: center;
        color: var(--white-original-color);
        line-height: 1.2em;
        padding: .5em;
    }
    
    .footer_1 img{
        width: 2em;
        height: auto;
        margin: 0 auto;
        padding: 0;
    }

    .footer_1 a{
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row;
        text-decoration: none;
        padding: 0 1em 0 1em;
        border-radius: 50px;
        transition: scale .3s ease-in-out, box-shadow .3s ease-in-out;
    }

    .footer_1 a:hover{
        scale: 1.05;
        box-shadow: 0px 0px 15px 4px rgba(0, 32, 102, 0.2);
    }

    .version {
        color: var(--white-original-color);
        font-size: .7em;
        line-height: 1.2em;
        width: 11em;
        margin: 5em auto 0 auto;
        font-weight: 200;
        text-align: center;
    }

}

/* ---------- footer medium - end ---------- */

/* ---------- footer large - start ---------- */

@media screen and (min-width: 950px) {

    .footer_seven {
        padding: 7em 2em 2em 2em;
    }

    .footer_1{
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row;
    }

    .footer_1 p{
        font-size: .8em;
    }

    .footer_insta,
    .footer_whats,
    .footer_email {
        display: flex;
        justify-content: center;
        align-items: center;
        color: var(--white-original-color);
        line-height: 1.2em;
        padding: 2em;
    }

    
    .footer_1 img{
        width: 2em;
        height: auto;
        margin: 0 auto;
        padding: 0;
    }

    .footer_1 a{
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row;
        gap: 1em;
        text-decoration: none;
        padding: 0 1em 0 1em;
        border-radius: 50px;
        transition: scale .3s ease-in-out, box-shadow .3s ease-in-out;
    }

    .footer_1 a:hover{
        scale: 1.05;
        box-shadow: 0px 0px 15px 4px rgba(0, 32, 102, 0.2);
    }
    

    .version {
        margin: 0 auto;
    }
}

/* ---------- footer large - end ---------- */

/* ---------- whats fixed small - start ---------- */

.whats_mobile img,
.lgpd_mobile img{
    width: 0px;
    position: fixed;
    top: 35em;
}

/* ---------- whats fixed small - end ---------- */

/* ---------- whats fixed medium - start ---------- */

@media screen and (min-width: 500px) {

    .whats_mobile img{
        height: 4em;
        width: 4em;
        position: fixed;
        top: 89%;
        right: 1%;
        border-radius: 100%;
        transition: border .5s ease, background-color .5s ease, padding .5s ease, box-shadow .5s ease;
    }

    .whats_mobile img:hover{
        border-radius: 100%;
        border: 5px solid white;
        background-color: green;
        padding: .3em;
        box-shadow: 1px 3px 12px #ffffffb2;
    }

}

/* ---------- whats fixed medium - end ---------- */

/* ---------- whats fixed large - start ---------- */

@media screen and (min-width: 950px) {

    .whats_mobile img{
        height: 4em;
        width: 4em;
        position: fixed;
        top: 89%;
        right: 1%;
        border-radius: 100%;
        transition: border .5s ease, background-color .5s ease, padding .5s ease, box-shadow .5s ease;
    }

    .whats_mobile img:hover{
        border-radius: 100%;
        border: 5px solid white;
        background-color: green;
        padding: .3em;
        box-shadow: 1px 3px 12px #ffffffb2;
    }

}

/* ---------- whats fixed large - end ---------- */