
@font-face {
    font-family: "Mulish";
    src: url("../fonts/Mulish.ttf");
}

:root {
    /*Cores*/
    --cor_principal: transparent;
    --cor_principal_fraca: transparent;
    --cor_secundaria: transparent;
    --cor_site_fundo: transparent;
    --cor_site_titulos: transparent;
    --cor_site_textos: transparent;
    --cor_header_fundo: transparent;
    --cor_header_links: transparent;
    --cor_header_links_especial: transparent;
    --cor_dep_fundo: transparent;
    --cor_dep_aspas: transparent;
    --cor_dep_texto: transparent;
    --cor_dep_autor: transparent;
    --cor_navbarmobile_links: transparent;
    --cor_navbarmobile_links_secundaria: transparent;
    --cor_navbarmobile_fundo: transparent;
    --cor_footer_separador: transparent;
    --cor_integracoes_sombra: transparent;
    --cor_planos_fundo: transparent;
    --cor_planos_recursos_fundo: transparent;
    --cor_planos_separador: transparent;
    --cor_planos_preco_texto: transparent;
    --cor_planos_cta_fundo: transparent;
    --cor_planos_cta_texto: transparent;
    /*Formatos*/
    --formato-botao-cta-planos: none;
    /*Tamanhos*/
    --tamanho-botao_cta-planos: none;
    --tamanho-fonte-botao-cta-planos: none;
    --tamanho-fonte-preco-planos: none;
}

* {
    box-sizing: border-box;
}

    *:focus {
        outline: none;
    }

body {
    font-family: "Mulish";
    background-color: var(--cor_site_fundo);
}


html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}

.wrapper {
    min-height: 100%;
    display: flex;
    flex-direction: column;
}

.main-content {
    flex-grow: 1;
}

h2{
    font-size: 2rem;
    margin-bottom: 1rem;
}

h3 {
    font-size: 1.6rem;
}

h4 {
    font-size: 1.1rem;
}

header {
    /*position: fixed;*/
    width: 100%;
    background-color: var(--cor_header_fundo);
    z-index: 9999;
}

.header__wrap-top {
    display: flex;
    justify-content: center;
    /*padding: 1rem 0;*/
    z-index: 9999;
    height: 74px;
}

    .header__wrap-top.shadow {
        box-shadow: 0 0px 8px 0 rgba(0,0,0,.2);
    }

.header__wrap-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.container-wrap {
    max-width: 1100px;
    width: 100%;
    margin: auto;
}

.header__navbar {
    display: flex;
    align-items: center;
}

    .header__navbar ul {
        display: flex;
        gap: 20px;
        justify-content: center;
    }

.header__navbar_mobile-top {
    display: none;
}

.header__navbar.expand {
    display: block;
    position: fixed;
    width: 100vw;
    height: 100vh;
    background-color: var(--cor_navbarmobile_fundo);
    -webkit-backdrop-filter: blur(.5rem);
    backdrop-filter: blur(.5rem);
    left: 0;
    top: 0;
    z-index: 10;
}

    .header__navbar.expand .header__navbar_mobile-top {
        display: flex;
        justify-content: flex-end;
        padding: 1rem 3rem;
    }

    .header__navbar.expand .header__menu-close {
        color: white;
        font-size: 2.5rem;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .header__navbar.expand ul {
        display: flex;
        gap: 10px;
        flex-direction: column;
    }

    .header__navbar.expand .nav-link {
        display: flex;
        justify-content: center;
        align-items: center;
        justify-self: center;
        align-self: center;
        padding: .5rem;
    }

        .header__navbar.expand .nav-link a {
            color: var(--cor_navbarmobile_links);
            fill: var(--cor_navbarmobile_links);
            font-size: 1.5rem;
            font-weight: 400;
        }

        .header__navbar.expand .nav-link.button a {
            background-color: var(--cor_navbarmobile_links_secundaria);
        }

.header__menu-btn {
    color: var(--cor_principal);
    font-size: 1.8rem;
    align-self: center;
}

.header__navbar-mobile {
    display: none;
}

.header__logo-div a img {
    max-height: 74px;
}

/*add*/

.nav-link {
    display: flex;
    justify-content: center;
    align-items: center;
}

.drop-down a {
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    cursor: pointer;
}

    .drop-down a svg {
        fill:
    }

/*---*/
.nav-link a {
    color: var(--cor_header_links);
    fill: var(--cor_header_links);
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: .08rem;
    text-decoration: none;
    user-select: none;
}

    .nav-link a:hover {
        text-decoration: underline;
    }

.nav-link.button a {
    background-color: var(--cor_principal);
    color: white;
    padding: 10px 15px;
    border-radius: 0.5rem;
    transition: 0.3s;
    font-weight: 400;
    text-decoration: none;
}

    .nav-link.button a:hover {
        border-radius: .8rem;
    }

.nav-link.login a {
    color: var(--cor_header_links_especial);
}

.main-content {
    /*padding-top: 74px;*/
}



/*DROPDOWN*/
.drop-down__black {
    position: fixed;
    width: 200vw;
    height: 200vh;
    z-index: 2;
    display: none;
    background-color: rgba(0,0,0,.4);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    opacity: 0;
}

.drop-down__content {
    position: fixed;
    width: 100%;
    margin: 74px 0 0 0;
    justify-content: center;
    z-index: 9998;
    display: none;
    transition: .3s all linear;
}

.drop-down__sub-menu {
    display: flex;
    width: 1100px;
    /*height:auto;*/
    justify-content: space-around;
    align-items: flex-start;
    flex-direction: row;
    transition: .3s all linear;
    box-shadow: 0 0 15px 0 rgb(0 0 0 / 15%);
    border-radius: 0 0 0.7rem 0.7rem;
}

    .drop-down__sub-menu .sub-menu__content__col:first-child {
        border-radius: 0 0 0 .7rem;
    }

    .drop-down__sub-menu .sub-menu__content__col:last-child {
        border-radius: 0 0 .7rem 0;
    }

.drop-down__visible {
    /*opacity: 1;*/
    /*transition: .3s all linear;*/
}

.drop-down__content_visible {
    background-color: rgba(0,0,0,.5);
    /*transition: .3s;*/
}

.sub-menu__content__col {
    display: flex;
    flex-direction: column;
    text-align: center;
    background-color: var(--cor_principal_fraca);
    padding: 1rem;
    width: 100%;
    height: 100%;
    gap: 1rem;
}

    .sub-menu__content__col .sub-menu__header {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .sub-menu__content__col ul {
        display: flex;
        flex-direction: column;
        height: 70%;
        padding: 1rem 0;
    }

    .sub-menu__content__col li {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        transition: .1s all linear;
        color: var(--cor_site_titulos);
    }

    .sub-menu__content__col a {
        text-decoration: none;
        display: flex;
        flex-direction: row;
        align-items: center;
    }

    .sub-menu__content__col:nth-child(odd) {
        background-color: var(--cor_header_fundo);
    }


    .sub-menu__content__col li:hover {
        transform: translateX(3px);
        cursor: pointer;
        color: var(--cor_principal);
    }

.sub-menu__svg-color {
    fill: var(--cor_principal);
}

.sub-menu__content__col li:hover > .svg-color {
    fill: var(--cor_principal_fraca);
}

/*.sub-menu__content__col li p::before {
    content: url('data:image/svg+xml; utf8,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15"><path d="M10.707 17.707 16.414 12l-5.707-5.707-1.414 1.414L13.586 12l-4.293 4.293z"></path></svg>');
    width: 15px;
    height: 15px;
    text-align: center;
    position: relative;
}*/

.sub-menu__title {
    font-size: 120%;
    color: var(--cor_site_titulos);
}

.sub-menu__item {
    padding: .5rem .5rem .5rem 0;
    text-align: start;
}



/*---*/

.slogan {
    background-color: var(--cor_principal_fraca);
    padding: 2rem 0;
    width: 100%;
    margin-bottom: 2rem;
}

.slogan__wrap {
    display: grid;
    grid-template-areas:
        "title image"
        "button image";
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 100px
}

.slogan__content p {
    line-height: 1.4rem;
}

.slogan-wrap-left {
    width: 100%;
    justify-content: center;
    flex-direction: column;
    grid-column: span 2;
}

.slogan_btn {
    grid-area: button;
    justify-self: start;
    align-self: center;
}

    .slogan_btn.nav-link.button {
        font-size: 1.9rem;
    }

        .slogan_btn.nav-link.button a {
            padding: .8rem 1.6rem;
            font-size: 1.3rem;
        }

.slogan__image {
    grid-area: image;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

    .slogan__image img {
        justify-self: flex-end;
    }

    .slogan__image img {
        width: 80%;
        height: auto;
    }

.slogan__title {
    font-size: 2.3rem;
    font-weight: 700;
    margin-bottom: 1rem;
    grid-area: title;
    align-self: end;
}

.slogan__text {
    font-size: 1rem;
    margin-bottom: 2rem;
    grid-area: text;
    color: #484848;
}

.funcionalidades__content {
    display: grid;
    padding: 2rem 0;
    grid-template-columns: 1fr 1fr;
    /*grid-template-rows: 1fr 1fr 1fr 1fr;*/
    gap: 1rem;
    grid-template-areas:
        "image title"
        "image text"
        "image link"
        "image button";
}

    .funcionalidades__content:nth-child(odd) {
        grid-template-areas:
            "title image"
            "text image"
            "link image"
            "button image";
    }

.funcionalidades__image {
    align-self: center;
    justify-self: flex-start;
    grid-row: 4 span;
    grid-area: image;
}

    .funcionalidades__image img {
        max-width: 420px;
        max-height: 300px;
    }

.funcionalidades__btn.nav-link.button {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.funcionalidades__content:nth-child(odd) .functionalidades__image {
    justify-self: flex-end;
}

.funcionalidades__title {
    font-size: 2rem;
    font-weight: 700;
    align-self: end;
    grid-area: title;
    color: var(--cor_site_titulos)
}

.funcionalidades__text {
    color: var(--cor_site_textos);
    grid-area: text;
    line-height: 1.4;
    width: 100%;
}

.funcionalidades__link {
    grid-area: link;
    color: rgb(116, 116, 116);
    width: 100%;
}

    .funcionalidades__link p {
        line-height: 1.3rem;
    }

.verticais {
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding: 3rem 0 1rem 0;
    margin-bottom: 3rem;
}

.verticais__text, .verticais__title {
    text-align: center;
    padding: 1rem 20%;
    line-height: 1.4;
}

.verticais__title {
    padding-bottom: 0;
    font-size: 2rem;
    font-weight: 700;
    color: var(--cor_principal)
}

.verticais__text {
    color: var(--cor_site_textos);
}

.verticais__icone {
    display: flex;
    justify-content: center;
    width: 80px;
}

.verticais__item-wrap {
    display: flex;
    gap: 0.5rem;
    flex-direction: column;
    justify-content: center;
}

.verticais__icone img {
    max-width: 80px;
    max-height: 50px;
}

.verticais__icone {
    margin: auto;
}

.verticais__item-title {
    color: var(--cor_principal);
    font-size: 1rem;
    /*font-weight: 700;*/
    text-align: center;
}

.verticais__swiper {
    width: 100%;
    height: 120px;
    margin: 1rem 0;
}

/* .swiper-slide{
    display: flex !important;
    justify-content: center !important;
} */

.experimente {
    background-color: var(--cor_principal_fraca);
    padding: 5rem 0;
}

.experimente__wrap {
    display: flex;
    justify-content: center;
    gap: 2rem;
    flex-direction: column;
}

.experimente__title {
    color: var(--cor_principal);
    font-size: 2rem;
    font-weight: 700;
    text-align: center;
}

.experimente__btn.nav-link.button {
    display: flex;
    justify-content: center;
}

    .experimente__btn.nav-link.button a {
        padding: 16px 35px;
        font-size: 1.2rem;
        border-radius: 18px;
        background-color: var(--cor_secundaria);
    }

.experimente__number-box {
    display: flex;
    justify-content: center;
}

.experimente__duvida {
    text-align: center;
    font-size: 1.5rem;
    color: var(--cor_site_textos);
}

.experimente__form input[type=tel],
.experimente__form input[type=submit] {
    border: solid var(--cor_principal) 2px;
    padding: 0.8rem 2rem;
    border-radius: 0.8rem;
    font-size: 1rem;
}

.experimente__form input[type=submit] {
    background-color: var(--cor_principal);
    color: white;
    cursor: pointer;
    font-weight: 500;
    margin-left: .5rem;
}

.depoimentos {
    padding: 4rem 0;
}

.depoimentos__title {
    font-size: 2rem;
    text-align: center;
    margin-bottom: 1rem;
    color: var(--cor_site_titulos);
}

.depoimentos__swiper {
    width: 100%;
    height: auto;
}

    .depoimentos__swiper .swiper-slide {
        flex-shrink: 0 !important;
        width: 450px !important;
        height: 300px !important;
    }

.depoimentos__box {
    width: 90%;
    height: 90%;
    display: grid;
    grid-template-columns: 3rem 1fr;
    grid-template-rows: 3rem 1fr 3rem;
    grid-template-areas:
        "aspas x"
        "depoimento depoimento"
        "foto nome";
    background-color: var(--cor_dep_fundo);
    border-radius: 1rem;
    padding: 1rem;
}

.depoimentos__marks {
    grid-area: aspas;
}

    .depoimentos__marks svg {
        width: 3rem;
        fill: var(--cor_dep_aspas);
    }

.depoimentos__text {
    grid-area: depoimento;
    text-align: center;
    line-height: 1.5rem;
    color: var(--cor_dep_texto);
    align-self: center;
}

.depoimentos__autor-name {
    grid-area: nome;
    align-self: center;
    padding-left: 1rem;
    font-weight: 700;
    color: var(--cor_dep_autor);
    letter-spacing: .05rem;
    font-size: 0.8rem;
}

.depoimentos__autor-image {
    width: 2.7rem;
    height: 2.7rem;
    border-radius: 10rem;
    object-fit: cover;
    grid-area: foto;
    align-self: center;
    justify-self: center;
}

.integracoes {
    padding: 7rem 0;
    position: relative;
}

.integracoes__wrap {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    justify-content: center;
    align-items: center;
    padding: 0 20%;
}

.integracoes__title {
    font-size: 2rem;
    text-align: center;
    font-weight: 700;
    line-height: 1.4;
    color: var(--cor_site_titulos);
}

.integracoes__text {
    text-align: center;
    line-height: 1.4;
    color: var(--cor_site_textos);
}

.integracoes__item-img {
    margin: auto 0;
}

    .integracoes__item-img img {
        width: 2.7rem;
        height: auto;
        object-fit: fill;
        user-select: none;
    }

.integracoes[data-type="carrossel"] .integracoes__list {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.integracoes[data-type="aleatorio"] .integracoes__list .integracoes__item-img {
    position: absolute;
}

.integracoes__btn {
    padding: .8rem 1.5rem;
    border: solid var(--cor_principal) 2px;
    border-radius: 10rem;
    text-decoration: none;
    color: var(--cor_principal);
    transition: 0.3s;
}

    .integracoes__btn:hover {
        color: white;
        background-color: var(--cor_principal);
    }

/*Bot�es do swipper*/
.swiper-button-next,
.swiper-button-prev {
    right: 10px;
    padding: 30px;
    color: var(--cor_principal) !important;
    fill: var(--cor_principal) !important;
    stroke: var(--cor_principal) !important;
}

    .swiper-button-next:after, .swiper-rtl .swiper-button-prev:after,
    .swiper-button-prev:after, .swiper-rtl .swiper-button-next:after {
        font-size: 2rem !important;
    }
/* Planos */

.show-cta-planos-wrap {
    position: sticky;
    width: calc(100% - 165px);
    top: 74px;
    background-color: var(--cor_principal_fraca);
    z-index: 1000;
    border-radius: 0 0 1rem 1rem;
    display:none;
    justify-content:space-around;
    align-items:center;
    padding:1.5rem 0;
    margin-left: auto;
}

    .show-cta-planos-wrap .planos__button {
        margin-top:0;
    }

    .show-cta-planos-wrap .planos__button.melhor{
        background-color: var(--cor_principal);
        color: white !important;
    }

.planos {
    margin-bottom: 3rem;
}

.planos .container-wrap{
    max-width: 1600px;
}

.planos__container {
    margin-top: 3rem;
    display: flex;
    position: relative;
}

.planos__lateral {
    flex: 0 0 165px;
}

.planos__paineis {
    display: flex;
    box-shadow: 0 0 1.2rem 0 #0000001a;
    border-radius: 1rem;
    background-color: var(--cor_planos_fundo);
    padding: 2rem 0 2rem 0;
    width: 100%;
}

.planos__button {
    background-color: var(--cor_planos_cta_fundo);
    /*border: solid 1px var(--cor_principal);*/
    /*padding: .7rem 1.5rem;*/
    padding: var(--tamanho-botao_cta-planos);
    border-radius: var(--formato-botao-cta-planos);
    text-decoration: none;
    color: var(--cor_planos_cta_texto) !important;
    margin-top: 0.5rem;
    transition: .3s;
    font-size: var(--tamanho-fonte-botao-cta-planos);
    transition: .25s transform linear;
}

    .planos__button:hover {
        transform: scale(1.07);
    }

.planos__painel.melhor .planos__button {
    background-color: var(--cor_principal);
    color: white !important;
}

    .planos__painel.melhor .planos__button:hover {
        /*background-color: white;*/
        /*color: var(--cor_principal);*/
    }

.planos__painel {
    width: 100%;
    padding-bottom: 1rem;
    border-right: solid var(--cor_planos_separador) 1px;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

    .planos__painel.melhor::before {
        content: "Recomendado";
        position: absolute;
        top: .3rem;
        left: 50%;
        right: 50%;
        text-align: center;
        background-color: var(--cor_principal);
        color: white;
        font-size: 1rem;
        padding: .6rem;
        border-radius: .5rem;
        transform: translate(-50%, -50%);
        width: 60%;
    }

.planos__paineis .planos__painel:last-child {
    border-right: none;
}

.planos__painel a {
    text-align: center;
    user-select: none;
}

.planos__painel-top {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    gap: 1rem;
    height: 300px;
    padding: 1rem;
    padding-top: 2rem;
}

.planos__mobile-container .planos__painel {
    width: 90%;
    background-color: white;
    border-radius: 2rem;
    box-shadow: 0 0 1.2rem 0 #0000001a;
}

.planos__mobile-container .planos__item {
    justify-content: flex-start;
}

.planos__mobile-container .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem 0 1rem 0;
}

    .planos__mobile-container .swiper-slide:last-child .planos__painel {
        border-right: none;
    }


.planos__mobile-container .planos__title-item {
    padding: 0.5rem;
}

.planos__descricao {
    text-align: center;
    font-size: .9rem;
    color: rgb(168, 168, 168);
    height: 80px;
    overflow: hidden;
}

.planos__item p {
    font-weight: 700;
    color: var(--cor_site_titulos)
}

.planos__item,
.planos__title-item {
    height: 55px;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .planos__item svg {
        fill: var(--cor_principal);
    }

    .planos__item.x svg {
        fill: rgb(197, 197, 197);
    }

    .planos__title-item p {
        color: var(--cor_principal);
        font-size: .85rem;
        font-weight: bold;
    }

.planos__img {
    max-height: 28%;
    user-select: none;
}

.planos__titulo {
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: .2rem;
    font-size: 1rem;
    text-align: center;
}

.planos__preco-rs {
    font-weight: bold;
}

.planos__preco-numero {
    font-weight: 700;
    /*font-size: 1.8rem;*/
    font-size: var(--tamanho-fonte-preco-planos);
    color: var(--cor_planos_preco_texto);
    /*color: var(--cor_preco_plano);*/
}

.planos__preco-rs {
    color: var(--cor_planos_preco_texto);
}

.planos__preco-mes {
    color: rgb(119, 119, 119);
}

.planos__title-list {
    margin-top: 332px;
    background-color: var(--cor_planos_recursos_fundo);
    border-radius: 1rem 0 0 1rem;
}

.planos__title-item {
    padding: 1rem;
    justify-content: flex-start;
}

.planos__mobile-container {
    display: none;
}

.planos__titulo-container {
    display: flex;
    justify-content: center;
    margin: 3rem 0 7rem 0
}

    .planos__titulo-container h1 {
        font-size: 2rem;
        color: var(--cor_site_titulos);
        font-weight: 700;
    }

/* Contato */
.contato__container {
    width: 800px;
    margin: auto;
    margin-bottom: 6rem;
}

.contato__titulo-container {
    margin-top: 3rem;
}

    .contato__titulo-container h1 {
        font-size: 2rem;
        color: var(--cor_site_titulos);
        font-weight: 700;
    }

    .contato__titulo-container h2 {
        font-size: 1.2rem;
        color: var(--cor_site_textos);
        font-weight: 400;
    }

    .contato__titulo-container h2,
    .contato__titulo-container h1 {
        text-align: center;
        margin: 1rem 0;
    }

.contato__info-container {
    display: flex;
    padding: 2rem 0;
    justify-content: center;
    gap: 1rem;
}

.contato__info-item {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    background-color: transparent;
    padding: 1rem;
    width: 100%;
    border-radius: 1rem;
    fill: rgb(90, 90, 90);
    transition: .4s;
    cursor: pointer;
    text-decoration: none;
}

    .contato__info-item:hover {
        transform: scale(1.05);
        box-shadow: 0 0 1.5rem .2rem rgba(0, 0, 0, 0.2);
        background-color: var(--cor_principal);
        fill: white;
    }

        .contato__info-item:hover p {
            color: white;
        }


.contato__info-text p {
    text-align: center;
    font-size: .8rem;
    color: rgb(129, 129, 129);
}

.contato__form-container {
    background-color: green;
    padding: 2rem;
    border-radius: 1rem;
    background-color: white;
    box-shadow: 0 0 1.5rem .2rem rgba(0, 0, 0, 0.05);
}

.contato__form-input {
    display: flex;
    border: 2px #dddddd solid;
    padding: .8rem;
    border-radius: .8rem;
    gap: .5rem;
    transition: .3s;
    fill: var(--cor_principal);
    margin: .5rem 0 0 0;
    align-items: center;
}

    .contato__form-input input {
        width: 100%;
        background-color: transparent;
        border: none;
        font-size: 1rem;
        font-weight: 700;
        color: var(--cor_site_textos);
    }

        .contato__form-input input::placeholder {
            color: #dddddd;
            font-weight: 700;
        }

.contato__form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr 1fr;
    grid-template-areas:
        "nome mensagem"
        "email mensagem"
        "telefone mensagem"
        "submit submit";
    gap: 1rem;
}

.contato__form-nome {
    grid-area: nome;
}

.contato__form-email {
    grid-area: email;
}

.contato__form-telefone {
    grid-area: telefone;
}

.contato__form-mensagem {
    grid-area: mensagem;
    display: flex;
    flex-direction: column;
}

.contato__form-submit {
    grid-area: submit;
    display: flex;
    justify-content: center;
    align-items: center;
}

.contato__form-container h2 {
    font-size: 1.2rem;
    margin: 1rem 0 2rem 0;
    font-weight: 700;
}

.contato__form-submit button {
    background-color: var(--cor_principal);
    border: none;
    color: white;
    font-size: 1rem;
    padding: .7rem 2rem;
    border-radius: .8rem;
    cursor: pointer;
    transition: .3s;
}

    .contato__form-submit button:hover {
        transform: scale(1.05);
    }

.contato__form label {
    font-weight: 700;
    color: var(--cor_principal);
    font-size: .9rem;
    user-select: none;
}

.contato__form-input:focus-within {
    border: 2px var(--cor_principal) solid;
    fill: #dddddd;
}

.contato__form textarea {
    background-color: #f3f3f3;
    padding: .8rem;
    border-radius: .8rem;
    transition: .3s;
    margin: .5rem 0 0 0;
    border: none;
    font-size: 1rem;
    font-weight: 700;
    resize: none;
    width: 100%;
    color: var(--cor_site_textos);
    font-family: "Mulish";
    height: 100%;
}

    .contato__form textarea::placeholder {
        font-weight: 700;
        color: rgb(180, 180, 180);
        font-size: 1rem;
    }

.contato__form-mensagem textarea {
    border: 2px transparent solid;
    transition: .4s;
}

    .contato__form-mensagem textarea:focus-within {
        border: 2px var(--cor_principal) solid;
    }

.contato__mensagem {
    display: flex;
    padding: 1rem;
    background-color: var(--cor_principal_fraca);
    border-radius: 1rem;
    font-size: 0.9rem;
    justify-content: center;
    width: 60%;
    margin: auto;
    margin-bottom: 2rem;
}

    .contato__mensagem.erro {
        background-color: #ff8585;
        color: white;
    }

    .contato__mensagem p {
        text-align: center;
    }

/* Footer */

.footer {
    background-color: var(--cor_principal_fraca);
}



.footer__wrap {
    padding: 3rem 0 3rem 0;
}

.footer__separator {
    border: none;
    border-top: solid var(--cor_footer_separador) 1px;
    margin-top: 1rem;
}

.footer__links {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.footer__top {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 2rem;
}

    .footer__top.spaced {
        margin-top: 2rem;
    }

.footer__rights {
    height: 50px;
    background-color: rgba(0, 0, 0, 0.2);
    text-align: center;
    line-height: 50px;
    font-size: .85rem;
}

.footer__texto h3 {
    font-size: 1.2rem;
    color: var(--cor_site_titulos);
}

.footer__texto .footer_email {
    margin-top: .5rem;
}

.footer__texto .footer_contato {
    font-weight: 700;
    font-size: 1.8rem;
    color: var(--cor_principal);
    margin-top: .5rem;
}

.footer__links-group {
    margin: 1rem;
}

    .footer__links-group h3 {
        font-size: 1rem;
        font-weight: 700;
        color: var(--cor_site_titulos);
        margin-bottom: 1.5rem;
    }

    .footer__links-group a {
        text-decoration: none;
        color: var(--cor_dep_texto);
        font-size: .9rem;
        transition: .3s;
    }

        .footer__links-group a:hover {
            color: var(--cor_principal);
        }

    .footer__links-group ul {
        display: flex;
        flex-direction: column;
        gap: .8em;
    }

    .footer__links-group li {
        list-style: none;
    }

.footer__redes {
    display: flex;
    align-items: flex-end;
}

    .footer__redes a {
        fill: var(--cor_principal);
    }


/* Integrções list */

.integracoes-page__wrap {
    margin-bottom: 6rem;
}

.integracoes-page__titulo-container {
    margin: 3rem 0;
}

    .integracoes-page__titulo-container h1 {
        font-size: 2rem;
        font-weight: 700;
        text-align: center;
        color: var(--cor_site_titulos);
        margin: 1rem 0;
    }

    .integracoes-page__titulo-container h2 {
        font-size: 1.2rem;
        font-weight: 400;
        text-align: center;
        color: var(--cor_site_textos);
        margin: 1rem 0;
    }

.integracoes-page__list-img {
    width: 5rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .integracoes-page__list-img img {
        max-height: 3rem;
        width: auto;
        max-width: 100px;
        z-index: 7;
    }

.integracoes-page__list > li {
    display: flex;
    justify-content: space-between;
    background-color: white;
    padding: 2rem;
    padding-bottom: 3rem;
    box-shadow: 0 0 20px 2px var(--cor_integracoes_sombra);
    border-radius: 1rem;
    overflow-y: hidden;
    height: 160px;
    position: relative;
    margin-bottom: 2rem;
    cursor: pointer;
}

.integracoes-page__list li.expand {
    height: 100%;
}

    .integracoes-page__list li.expand .integracoes-page__list-btn {
        transform: translateX(-50%) rotate(180deg);
    }


    .integracoes-page__list li.expand .integracoes-page__list-shadow {
        box-shadow: 0 0 20px 2px transparent;
    }

.integracoes-page__list li h3 {
    width: 200px;
    font-weight: 700;
    font-size: 1.2rem;
    align-self: center;
    text-align: start;
    z-index: 7;
    color: var(--cor_site_titulos);
    padding-left: 1rem;
}

.integracoes-page__list-content {
    font-size: 1.1rem;
    line-height: 1.5rem;
    width: 70%;
    color: var(--cor_site_textos);
    overflow: hidden;
}

.integracoes-page__list-shadow {
    box-shadow: 0px 0 25px 60px rgb(255, 255, 255);
    width: 100%;
    height: 0;
    position: absolute;
    bottom: 10px;
    z-index: 5;
}

.integracoes-page__list-btn {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 10px;
    z-index: 6;
    border: none;
    display: flex;
    justify-content: center;
    align-items: center;
    fill: rgba(0, 0, 0, 0.4);
    background-color: transparent;
    cursor: pointer;
}

/* Termos */
.termos-container {
    padding: 2rem 0;
}

/* Página de ativação */

.ativacao-content {
    width: 100vw;
    height: 100vh;
    /*background-image: url(../images/ativacao-pagina-bg.png);*/
    background-repeat: no-repeat;
    background-size: cover;
}

.ativacao__filter {
    width: 100%;
    height: 100%;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    background-color: #0000005e;
    display: flex;
    justify-content: center;
    align-items: center;
}

.ativacao__card {
    background-color: white;
    width: 850px;
    height: 630px;
    border-radius: 1.5rem;
    display: flex;
    box-shadow: #0000001f 0 0 30px 5px;
    margin: 1rem;
    position: relative;
}

    .ativacao__card .left-side, .ativacao__card .right-side {
        height: 100%;
        width: 50%;
    }

    .ativacao__card .right-side {
        background-color: var(--cor_principal);
        border-radius: 0 1.5rem 1.5rem 0;
        /* background-image: url(../images/undraw_Statistic_chart_re_w0pk.png); */
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
    }

    .ativacao__card .left-side {
        padding: 2.5rem;
    }

.ativacao-input input {
    width: 100%;
    background-color: #f7f7f7;
    border: none;
    font-size: 1rem;
    font-weight: 700;
    color: var(--cor_site_textos);
    padding: .7rem .8rem;
    border-radius: .5rem;
    border: solid 1px #e5e5e5;
    box-shadow: #00000010 0 0 5px 0px;
    margin-top: .3rem;
}

    .ativacao-input input::placeholder {
        color: #868686;
        font-weight: 700;
        font-size: .9rem;
    }

.ativacao-form input[type="submit"] {
    width: 50%;
    background-color: var(--cor_secundaria);
    color: white;
    border: none;
    font-size: 1rem;
    font-weight: 700;
    padding: .8rem;
    border-radius: 1rem;
    border: solid 1px #e5e5e5;
    box-shadow: #00000010 0 0 5px 0px;
    cursor: pointer;
    transition: .3s;
}

    .ativacao-form input[type="submit"]:hover {
        transform: scale(110%);
    }

.ativacao-input label {
    font-size: .8rem;
}

.ativacao-form {
    display: flex;
    gap: 1rem;
    flex-direction: column;
    margin-top: 1rem;
}

.ativacao__card .left-side h2 {
    font-size: 1.6rem;
    font-weight: 700;
    margin-top: 1rem;
    color: var(--cor_principal);
}

.ativacao__card .left-side p {
    font-size: 1.2rem;
    color: #585858;
    margin-top: 1rem;
}

.ativacao__msg {
    background-color: #e93e3ee0;
    position: absolute;
    width: 40%;
    left: 30%;
    bottom: 10px;
    padding: 1rem;
    border-radius: .8rem;
    color: white;
    font-size: .9rem;
    display: none;
}

    .ativacao__msg p {
        text-align: center;
    }

.cookies-container {
    box-sizing: border-box;
    position: fixed;
    bottom: 0;
    width: 100vw;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 100;
    padding: 2rem 1rem;
}

.cookies-popup {
    display: none;
    align-items: center;
    background-color: white;
    border-radius: .7rem;
    padding: 1rem;
    gap: 1rem;
    box-shadow: 0px 2px 15px 0px rgba(72, 72, 72, .2);
}

    .cookies-popup .termos-text :first-child {
        margin-bottom: .4rem;
    }

    .cookies-popup .termos-link {
        color: var(--cor_principal);
    }


    .cookies-popup > .aceitar-cookies-btn {
        padding: .7rem .9rem;
        border-radius: 1.2rem;
        background-color: var(--cor_secundaria);
        /*color: var(--cor_site_titulos);*/
        color: white;
    }

        .cookies-popup > .aceitar-cookies-btn:hover {
            cursor: pointer;
        }

@media only screen and (max-width: 1160px) {
    body {
        /* background-color: red; */
    }

    .header__wrap-header {
        padding: 0 2rem;
    }

    .funcionalidades__content {
        padding: 1rem;
    }
}

@media only screen and (max-width: 1000px) {
    .show-cta-planos-wrap{
        display: none !important;
    }
    body {
        /* background-color: blue; */
    }

    .container-wrap {
        padding: 0 1rem;
    }

    .header__navbar {
        display: none;
    }

    .header__navbar-mobile {
        display: block;
    }

    .header__logo-div a img {
        max-height: 30px;
    }

    .header__wrap-top {
        height: 64px;
    }

    /* add */


    .drop-down__content {
        height: auto;
        margin-top: 64px;
        position: absolute;
    }

    .drop-down__sub-menu {
        flex-direction: column;
        width: 100%;
        height: 100%;
    }

    .sub-menu__content__col {
        padding: 2rem .5rem;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
    }

    .drop-down__sub-menu .sub-menu__content__col:first-child,
    .drop-down__sub-menu .sub-menu__content__col:last-child {
        border-radius: 0;
    }

    .sub-menu__content__col .sub-menu__header {
        padding: 0 2rem;
        width: 30%;
    }

    .sub-menu__title {
        font-size: 1rem;
    }

    .sub-menu__content__col ul {
        justify-content: center;
        flex-wrap: nowrap;
        width: 100%;
    }


    /*---*/

    .main-content {
        padding-top: 64px;
    }

    .slogan__wrap {
        padding: .5rem 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 1rem;
    }

    .slogan__image {
        justify-content: center;
    }

        .slogan__image img {
            max-width: 80%;
        }

    .slogan__title, .slogan__text {
        align-self: center;
        text-align: center;
    }

    .slogan_btn.nav-link.button {
        margin-bottom: 2rem;
        margin-top: 2rem;
    }

    .funcionalidades__content, .funcionalidades__content:nth-child(odd) {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto auto 1fr;
        grid-template-areas:
            "title"
            "text"
            "link"
            "button"
            "image";
        padding: 1rem 0;
    }

    .funcionalidades__image img {
        max-width: 280px;
    }



    .funcionalidades__image {
        justify-self: center;
        margin-top: 1.5rem;
    }

    .verticais__text, .verticais__title {
        padding: .5rem 1rem;
    }

    .verticais__swiper {
        padding: 0 1rem !important;
    }

        .verticais__swiper .swiper-slide {
            flex-shrink: 0 !important;
            width: 100px !important;
        }

    .experimente__form {
        display: flex;
        flex-direction: column;
    }

        .experimente__form input[type=text],
        .experimente__form input[type=submit] {
            margin: .5rem 0;
        }

    .integracoes__item-img {
        display: flex;
    }

    .integracoes__wrap {
        padding: 0;
    }

    .integracoes[data-type="aleatorio"] .integracoes__wrap {
        margin: 10rem 0;
    }

    .depoimentos__swiper .swiper-slide {
        flex-shrink: 0 !important;
        width: 350px !important;
        height: 400px !important;
    }

    /* Planos mobile */
    .planos__container {
        display: none;
    }

    .planos__mobile-container {
        display: block;
    }

    /* Contato */
    .contato__container {
        width: 100%;
    }

    .contato__form {
        display: flex;
        flex-direction: column;
    }

    .contato__form-mensagem {
        height: 180px;
    }

    .contato__info-container {
        flex-direction: column;
    }

    /* Integracoes */
    .integracoes-page__list li {
        flex-direction: column;
        align-items: center;
        padding: 2rem 0;
        padding-bottom: 3rem;
        gap: 1rem;
    }

    .integracoes-page__list-content {
        width: 85%;
    }

    .integracoes-page__list li h3 {
        text-align: center;
        padding: 0;
    }

    /* Página Ativação */
    .ativacao__card .right-side {
        display: none;
    }

    .ativacao__card .left-side {
        width: 100% !important;
        padding: 1.5rem !important;
    }

    .ativacao__card {
        height: auto;
    }

    .ativacao__msg {
        width: 80%;
        left: 10%;
        top: 10px;
        position: position;
        height: max-content;
    }
}
