/* @import url("https://fonts.googleapis.com/css?family=Montserrat"); */

@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap");

/********** Template CSS **********/
:root {
   --primary: #9d28f0;
   --secondary: #47009a;
   --tertiary: #67d1c4;
   --light: #eef9ff;
   --dark: #47009a;
   --text-box: #585858;
}

* {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
}

body {
   width: 100%;
   /* border: 1.5px red solid; */
}

/*** Spinner ***/
.spinner {
   width: 40px;
   height: 40px;
   background: var(--primary);
   margin: 100px auto;
   -webkit-animation: sk-rotateplane 1.2s infinite ease-in-out;
   animation: sk-rotateplane 1.2s infinite ease-in-out;
}

@-webkit-keyframes sk-rotateplane {
   0% {
      -webkit-transform: perspective(120px);
   }
   50% {
      -webkit-transform: perspective(120px) rotateY(180deg);
   }
   100% {
      -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg);
   }
}

@keyframes sk-rotateplane {
   0% {
      transform: perspective(120px) rotateX(0deg) rotateY(0deg);
      -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
   }
   50% {
      transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
      -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
   }
   100% {
      transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
      -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
   }
}

#spinner {
   opacity: 0;
   visibility: hidden;
   transition: opacity 0.5s ease-out, visibility 0s linear 0.5s;
   z-index: 99999;
}

#spinner.show {
   transition: opacity 0.5s ease-out, visibility 0s linear 0s;
   visibility: visible;
   opacity: 1;
}

section {
   width: 100%;
}

/*** Heading ***/
h1,
h2,
.fw-bold {
   font-weight: 600 !important;
}

h3,
h4,
.fw-semi-bold {
   font-weight: 600 !important;
}

h5,
h6,
.fw-medium {
   font-weight: 600 !important;
}

/*** Button ***/
.btn {
   font-family: "Montserrat";
   font-weight: 600;
   transition: 0.5s;
}

.btn-fixo {
   width: 208px;
   padding: 1em 0;
}

.btn-fixoP {
   width: 110px;
   padding: 0.4em 0;
}

.btn-fixoM {
   width: 300px;
   padding: 1em 0;
}

.ajuste-btn-mobileG a {
   width: 300px;
}

.btn-fixoG {
   width: 330px;
   padding: 1em 0;
   font-size: 15px;
}

.btn-fixoGG {
   width: 340px;
   padding: 1em 0;
   font-size: 15px;
}

.btn-primary,
.btn-secondary {
   color: #ffffff;
   box-shadow: inset 0 0 0 50px transparent;
}

.btn-primary:hover {
   box-shadow: inset 0 0 0 0 var(--primary);
}

.btn-secondary:hover {
   box-shadow: inset 0 0 0 0 var(--secondary);
}

.btn-square {
   width: 36px;
   height: 36px;
}

.btn-sm-square {
   width: 30px;
   height: 30px;
}

.btn-lg-square {
   width: 48px;
   height: 48px;
}

.btn-square,
.btn-sm-square,
.btn-lg-square {
   padding-left: 0;
   padding-right: 0;
   text-align: center;
}

#logo-header img {
   padding: 0;
   margin: 0 0 0 25px;
   max-height: 60px;
}

/* Estilos para dispositivos móveis */
@media screen and (max-width: 992px) {
   #logo-header img {
      content: url("../img/logo.png");
      max-height: 40px !important;
      margin: 0 0 0 10px;
   }

   .px-5 {
      padding-right: 2rem !important;
      padding-left: 2rem !important;
   }
}

/*** Navbar ***/
.navbar-dark .navbar-nav .nav-link {
   font-family: "Montserrat";
   position: relative;
   margin-left: 25px;
   padding: 35px 0;
   color: #ffffff;
   font-size: 16px;
   font-weight: 600;
   outline: none;
   transition: 0.5s;
}

.sticky-top.navbar-dark .navbar-nav .nav-link {
   padding: 20px 0;
   color: var(--dark);
}

.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link.active {
   color: var(--primary);
}

.navbar-dark .navbar-brand h1 {
   color: #ffffff;
}

.navbar-dark .navbar-toggler {
   color: var(--primary) !important;
   border-color: var(--primary) !important;
}

@media (max-width: 992px) {
   .sticky-top.navbar-dark {
      position: fixed;
      background: #ffffff;
      width: 100%;
   }

   .navbar-dark .navbar-nav .nav-link,
   .navbar-dark .navbar-nav .nav-link.show,
   .sticky-top.navbar-dark .navbar-nav .nav-link {
      padding: 10px 0;
      color: var(--dark);
   }

   .navbar-dark .navbar-brand h1 {
      color: var(--primary);
   }
}

@media (min-width: 992px) {
   .navbar-dark {
      position: absolute;
      width: 100%;
      top: 0;
      left: 0;
      border-bottom: 1px solid rgba(256, 256, 256, 0.1);
      z-index: 999;
   }

   .sticky-top.navbar-dark {
      position: fixed;
      background: #ffffff;
   }

   .navbar-dark .navbar-nav .nav-link::before {
      position: absolute;
      content: "";
      width: 0;
      height: 2px;
      bottom: -1px;
      left: 50%;
      background: var(--primary);
      transition: 0.5s;
   }

   .navbar-dark .navbar-nav .nav-link:hover::before,
   .navbar-dark .navbar-nav .nav-link.active::before {
      width: 100%;
      left: 0;
   }

   .navbar-dark .navbar-nav .nav-link.nav-contact::before {
      display: none;
   }

   .sticky-top.navbar-dark .navbar-brand h1 {
      color: var(--primary);
   }
}

/*** Carousel ***/
.carousel-caption {
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background: rgba(9, 30, 62, 0.7);
   z-index: 1;
   height: max(800px);
}

.title-home {
   display: flex;
   justify-content: center;
   flex-direction: column;
   margin-top: 130px !important;
   max-width: 1100px;
}

.title-home p {
   font-size: 20px;
}

.bg-light p {
   font-size: 18px;
}

.ajuda-title {
   display: flex;
   flex-direction: column;
   justify-content: center;
   text-align: center;
}

.ajuste-title h6 {
   margin-top: -70px !important;
}

.ajuste-title .ajuste-btn-mobileG {
   margin-top: 70px !important;
}

.ajuste-title p {
   display: flex;
   margin: 30px 0 0 0 !important;
   padding: 0 100px;
}

@media (max-width: 576px) {
   .plataforma h2 {
      margin-bottom: 20px;
      font-size: 20px !important;
      line-height: 26px !important;
   }

   .title-home h6:not(.ajuste-title h6) {
      margin-top: -120px !important;
      font-size: 14px !important;
      padding: 0 10px;
   }

   .ajuste-title h6 {
      margin-top: -100px !important;
      padding: 0 10px;
      font-size: 14px !important;
   }

   .ajuste-title p {
      display: flex;
      margin: 10px 0 0 0 !important;
      padding: 0;
   }

   .ajuste-title .ajuste-btn-mobileG {
      margin-top: 10px !important;
   }

   .title-home {
      max-width: 390px;
   }

   .title-home p {
      margin-top: 10px;
      font-size: 13px !important;
      max-width: 400px;
      padding: 0 10px;
   }

   .plataforma p {
      font-size: 0.9rem !important;
      margin-bottom: 20px;
   }

   .carousel-caption {
      height: max(250px);
   }

   .carousel-caption h5 {
      font-size: 14px;
      font-weight: 500 !important;
   }

   .carousel-caption h1 {
      font-size: 30px;
      font-weight: 600 !important;
   }

   .bg-light p {
      font-size: 15px;
   }
}

.carousel-control-prev,
.carousel-control-next {
   width: 10%;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
   width: 3rem;
   height: 3rem;
}

/*** Section Title ***/
.section-title::before {
   position: absolute;
   content: "";
   width: 150px;
   height: 5px;
   left: 0;
   bottom: 0;
   background: var(--tertiary);
   border-radius: 2px;
}

.cta-index {
   background-image: url(../img/bg_3.png);
   background-position: center;
   flex-direction: column;
   width: 100%;
}

.conheca-cta {
   background-image: url(../img/bg_3.png);
   background-position: center;
   flex-direction: column;
   width: 100%;
}

.cta-index-btn-container {
   width: 50%;
   gap: 10px;
   margin-top: 20px;
}

.cta-index p {
   max-width: 800px !important;
   font-size: 1.5rem !important;
   color: #ffffff;
}

.cta-index .btn-cta-index {
   max-width: 280px;
}

.mr-3 {
   margin-right: 1rem;
}

.cta-index .btn-cta-index p {
   padding: 10px;
   background: transparent;
   color: #fff;
   border-radius: 5px;
   width: 280px;
   height: 72px;
   cursor: default;
   font-size: 1rem !important;
   border: 1px #fff double;
   text-align: center;
   align-content: center;
}

.cta-conheca-start {
   max-width: 900px !important;
   font-size: 1.1rem !important;
   font-weight: 500;
}

.section-title.text-center::before {
   left: 50%;
   margin-left: -75px;
}

.section-title.section-title-sm::before {
   width: 90px;
   height: 3px;
}

.section-title::after {
   position: absolute;
   content: "";
   width: 6px;
   height: 5px;
   bottom: 0px;
   background: #ffffff;
   -webkit-animation: section-title-run 5s infinite linear;
   animation: section-title-run 5s infinite linear;
}

.section-title.section-title-sm::after {
   width: 4px;
   height: 3px;
}

.section-title.text-center::after {
   -webkit-animation: section-title-run-center 5s infinite linear;
   animation: section-title-run-center 5s infinite linear;
}

.section-title.section-title-sm::after {
   -webkit-animation: section-title-run-sm 5s infinite linear;
   animation: section-title-run-sm 5s infinite linear;
}

/* @-webkit-keyframes section-title-run {
   0% {
      left: 0;
   }
   50% {
      left: 145px;
   }
   100% {
      left: 0;
   }
}

@-webkit-keyframes section-title-run-center {
   0% {
      left: 50%;
      margin-left: -75px;
   }
   50% {
      left: 50%;
      margin-left: 45px;
   }
   100% {
      left: 50%;
      margin-left: -75px;
   }
}

@-webkit-keyframes section-title-run-sm {
   0% {
      left: 0;
   }
   50% {
      left: 85px;
   }
   100% {
      left: 0;
   }
} */

/*** Service ***/
.service-item {
   position: relative;
   height: 150px;
   padding: 10px !important;
   transition: 0.5s;
   border-radius: 20px !important;
}

.service-item .service-icon {
   width: 60px;
   height: 60px;
   display: flex;
   align-items: center;
   justify-content: center;
   transform: rotate(-45deg);
}

.service-item .service-icon i {
   transform: rotate(45deg);
   font-size: 25px;
}

.service-item a.btn {
   position: absolute;
   width: 60px;
   bottom: -48px;
   left: 50%;
   margin-left: -30px;
   opacity: 0;
}

/* Prices */

.price-box-plan-adicionais {
   flex: 0 0 auto;
   border-radius: 20px !important;
   margin-bottom: 10px;
   border: 1px var(--primary) solid;
   background: #f3f3f3;
   width: 100%;
   max-width: 500px;
   padding-bottom: 12px;
}

.box-details {
   display: flex;
   flex-direction: column;
   justify-content: center;
   width: 50%;
   max-width: 500px;
}

.price-box-funcionalidades {
   flex: 0 0 auto;
   border-radius: 20px !important;
   margin-bottom: 10px;
   padding-bottom: 5px;
   border: 1px var(--primary) solid;
   width: 100%;
   max-width: 500px;
}

.price-box-projetos {
   flex: 0 0 auto;
   height: auto;
   /* border-radius: 20px !important; */
   margin-bottom: 10px;
   padding-bottom: 5px;
   /* border: 3px #3f3f3f solid; */
   background: #f3f3f3;
   padding: 0 12px;
   width: 100%;
   max-width: 500px;
}

.price-box-title-plan-adicionais {
   color: #fff;
   text-align: center;
   background-color: var(--primary);
   border-top-left-radius: 20px;
   border-top-right-radius: 20px;
   padding: 7px;
   margin-bottom: 10px;
   height: 55px;
   border: 3px var(--primary) solid;
}

.price-box-title-projetos {
   display: flex;
   flex-direction: column;
   justify-content: center;
   color: #fff;
   text-align: center;
   background-color: var(--text-box);
   border-radius: 5px;
   padding: 8px;
   margin-bottom: 10px;
   border: 1px var(--text-box) solid;
}

.projetos-inventta {
   width: 30%;
   color: #fff;
   text-align: center;
   font-weight: normal;
   font-size: 13px;
   background-color: #a3a3a3;
   border-radius: 10px;
   padding: 8px 5px;
}

.projetos-inventta-detail {
   width: 30%;
   color: #000;
   text-align: center;
   font-weight: normal;
   font-size: 12px;
   padding: 8px 5px;
}

.funcionalidades-adicionais {
   display: flex;
   flex-direction: column;
   width: 45%;
   color: #fff;
   text-align: center;
   font-weight: normal;
   text-align: center;
}

.funcionalidades-adicionais h4 {
   font-size: 0.9rem;
   margin-bottom: 0;
   color: var(--primary);
}

.header-func {
   display: flex;
   width: 100%;
   flex-direction: column;
   background: #ebebeb;
   border-top-left-radius: 7px;
   border-top-right-radius: 7px;
   padding: 9px 0;
   border: 0.4px #d9d9d9 solid;
}

.header-func-proj {
   display: flex;
   flex-direction: column;
   justify-content: center;
   background: var(--primary);
   border-top-left-radius: 7px;
   border-top-right-radius: 7px;
   padding: 10px 0;
}

.header-func-proj h4 {
   color: #fff;
   font-size: 0.9rem;
}

.funcionalidades-adicionais h6 {
   font-size: 0.9rem;
   color: var(--text-box);
   margin: 0;
   padding: 2px 0;
}

.header-func-proj small {
   color: #fff !important;
   /* font-size: 0.9rem; */
}

.funcionalidades-adicionais span {
   display: flex;
   flex-direction: column;
   border: 0.4px #d9d9d9 solid;
   border-bottom-left-radius: 7px;
   border-bottom-right-radius: 7px;
   padding: 8px 0;
   color: var(--text-box);
   width: 100%;
}

.funcionalidades-adicionais p {
   color: var(--text-box);
   border: 0.4px #d9d9d9 solid;
   border-bottom-left-radius: 7px;
   border-bottom-right-radius: 7px;
   padding: 10px 0;
   font-weight: bold;
}

.funcionalidades-adicionais-img {
   width: 45%;
   color: #fff;
   text-align: center;
   font-weight: normal;
   padding: 6px 5px;
   border: 2px var(--primary) solid;
   margin-bottom: 10px;
   border-radius: 10px;
   text-align: center;
   align-content: center;
}

.funcionalidades-adicionais small {
   color: #fff;
   font-size: 0.8rem;
   color: var(--primary);
   /* margin-bottom: 1px; */
}

.funcionalidades-adicionais-detail {
   width: 45%;
   color: #000;
   text-align: center;
   font-weight: normal;
   padding: 8px 5px;
   /* background-color: var(--primary); */
   margin-bottom: 10px;
   border-radius: 10px;
   text-align: center;
   align-content: center;
}

.funcionalidades-adicionais-detail h5 {
   font-size: 0.9rem;
   color: #000;
   margin-bottom: 0;
}

.funcionalidades-adicionais-detail small {
   font-size: 0.7rem;
   color: #000;
   margin-bottom: 0;
}

.funcionalidades-adicionais-img img {
   width: 150px;
}

.price-box-title-plan-adicionais h4 {
   color: #fff;
   font-size: 1rem;
   margin-bottom: 1px;
}

.price-box-title-projetos h4 {
   color: #fff;
   font-size: 0.8rem;
   margin-bottom: 1px;
}

.price-box-title-plan-adicionais small,
.price-box-title-projetos small {
   font-size: 15px;
   font-weight: normal;
   /* color: #fff !important; */
}

.detail-price-adicionais td {
   color: #000;
   font-size: 13px !important;
   font-weight: normal;
   padding: 5px 15px;
}

td:nth-child(1) {
   width: 370px;
}

td:nth-child(2) {
   text-align: right;
   padding: 5px;
   width: 120px;
}

#pricing .container {
   width: 100% !important;
   padding: 5px;
   /* border: 1px red solid !important; */
}

#pricing .container-fluid {
   padding: 5px !important;
   /* border: 1px red solid !important; */
}

.price-container {
   display: flex;
   flex-direction: row;
   width: 100%;
   justify-content: center;
   flex-wrap: wrap;
   /* border: 2px blue dashed; */
   gap: 7px;
   margin-bottom: 20px;
}

.detalhe-plano img {
   max-width: 90%;
   object-fit: scale-down;
}

.price-box {
   flex: 0 0 auto;
   width: 320px;
   height: 400px;
   border-radius: 20px !important;
   margin-bottom: 10px;
}

.saiba-mais {
   display: flex;
   justify-content: center;
}

.detail-plan {
   font-size: 14px !important;
   min-height: 195px;
}

.col-lg-5 .form-price {
   border-radius: 15px !important;
}

/* Detail Prices */

.price-title {
   display: flex;
   justify-content: center;
   flex-direction: row;
   text-align: center;
   margin-bottom: 5px;
   height: 75px;
}

.price-title-essencial {
   display: flex;
   flex-direction: column;
   justify-content: center;
   border-radius: 10px;
   width: 660px;
   background-color: #df0075;
   margin-right: 5px;
}

.box-total-price {
   display: flex;
   flex-direction: column !important;
   justify-content: center !important;
}

.price-terms {
   display: flex;
   flex-direction: row;
   padding: 5px;
}

.price-terms-mobile {
   display: none;
}

.price-terms-line {
   display: flex;
   flex-direction: row;
   border-radius: 5px;
   border: 1px gray solid;
   width: 75%;
   justify-content: space-between;
   padding: 0 100px;
   /* margin-left: -15px; */
}

.plan-terms {
   display: flex;
   color: #777;
   flex-direction: row;
   justify-content: center;
   padding: 15px;
   font-weight: 600;
}

.plan-terms-line-mobile {
   display: flex;
   flex-direction: row;
   border-radius: 5px;
   border: 1px gray solid;
   width: 100%;
   justify-content: center;
   align-items: center;
   color: #777;
}

.plan-terms strong {
   font-size: 18px;
}

.plan-terms-funcionarios {
   display: flex;
   justify-content: center;
   writing-mode: vertical-lr;
   transform: rotate(180deg);
   color: #000;
   background-color: #ababab;
   padding: 5px 10px;
   border-radius: 5px;
   margin-right: 30px;
   margin-left: 90px;
}

.price-title h4,
.price-title p {
   margin: 0;
   color: #fff;
}

.price-title p {
   margin: 0;
   color: #fff;
   line-height: 18px;
   font-size: 14px;
   padding: 0 10px;
}

.price-title-profissional {
   display: flex;
   flex-direction: column;
   justify-content: center;
   border-radius: 10px;
   width: 328px;
   background-color: #1d8177;
}

.price-title h4,
.price-title h4 {
   font-size: 22px;
}

.price-box-plan {
   flex: 0 0 auto;
   width: 328px;
   height: 430px;
   border-radius: 20px !important;
   margin-bottom: 10px;
   /* border: 1px red solid; */
}

.price-box-plan-inedito {
   flex: 0 0 auto;
   width: 21%;
   height: 330px;
   border-radius: 20px !important;
   margin-bottom: 10px;
   margin-left: 30px;
}

.price-box-title-plan {
   display: flex;
   flex-direction: column;
   justify-content: center;
   color: #fff;
   text-align: center;
   background-color: #df0075;
   border-radius: 10px 10px 0 0;
   padding: 5px;
   margin-bottom: 10px;
   height: 70px;
}

.price-box-title-plan small,
.price-box-title-plan-profissional small {
   line-height: 17px;
}

.price-box-title-plan-profissional {
   display: flex;
   flex-direction: column;
   justify-content: center;
   color: #fff;
   text-align: center;
   background-color: #88093d;
   border-radius: 10px 10px 0 0;
   padding: 5px 0;
   margin-bottom: 10px;
   height: 70px;
}

.price-box-title-plan-profissional h5 {
   font-size: 22px;
   text-transform: uppercase;
}

.detail-funcionarios {
   display: flex;
   justify-content: center;
   align-content: center;
   justify-items: center;
   background-color: #df0075;
   border-radius: 0 0 10px 10px;
   font-size: 13px;
   color: #fff;
   height: 35px;
}

.detail-funcionarios span {
   align-content: center;
}

.detail-funcionarios-profissional {
   display: flex;
   justify-content: center;
   align-content: center;
   justify-items: center;
   background-color: #1d8177;
   border-radius: 0 0 10px 10px;
   font-size: 13px;
   color: #fff;
   height: 35px;
}

.detail-funcionarios-profissional span {
   align-content: center;
}

.price-box-title-plan h4 {
   color: #fff;
   font-size: 22px;
   margin-bottom: 0;
}

.price-box-title-plan span {
   line-height: 18px;
}

.detail-price {
   font-size: 14px !important;
   height: 240px;
   padding: 5px 15px 10px 15px;
   /* color: #9d28f0; */
   color: #000;
   font-weight: normal;
}

.detail-price-adicionais {
   width: 500px;
   /* border: 1px red solid; */
   line-height: 1rem;
}

div.plano {
   position: relative;
   padding-right: 110px;
}

td.plano {
   position: relative;
   padding-right: 110px;
}

span.logo-title {
   position: relative;
   width: 100% !important;
   float: right;
   top: 8px;
}

.price-box-title-plan-adicionais img {
   width: 30px;
   position: absolute;
   z-index: 1;
   right: 5px;
}

span.plano {
   position: relative;
   /* padding-right: 110px; */
}

.mais-pedido-small {
   display: block !important;
   position: absolute;
   bottom: -21px;
   right: -5px;
   color: #9d28f0 !important;
   background-color: #fefe87;
   padding: 5px 10px !important;
   border-radius: 5px;
   font-weight: 600;
   font-size: 12px;
   z-index: 1;
   width: 100px !important;
}

.destaque-ia {
   position: absolute;
   top: 10px;
   color: red;
   background-color: #fff;
   padding: 7px 10px;
   border-radius: 7px;
   font-weight: 600;
   font-size: 12px;
   z-index: 1;
   /* border: 1px red solid; */
}

.mais-pedido {
   position: absolute;
   top: -5px;
   color: #9d28f0;
   background-color: #fefe87;
   padding: 5px 10px;
   border-radius: 5px;
   font-weight: 600;
   font-size: 12px;
   z-index: 1;
   border: 0.4px #d9d9d9 solid;
}

.price-condicao {
   display: flex;
   flex-direction: column;
   margin: 10px 0 5px 0;
   align-items: center;
}

.price-condicao span {
   text-align: center;
   color: #000;
   line-height: 18px;
}

.price-condicao p {
   font-size: 14px;
   padding: 0 10px;
   margin-bottom: 15px;
   font-weight: 600;
}

@media screen and (max-width: 1200px) {
   .detail-price {
      font-size: 13px !important;
   }

   .price-title-essencial {
      width: 560px;
   }

   .price-title-essencial h4 {
      font-size: 18px;
   }

   .price-title-essencial p {
      font-size: 13px;
   }

   .price-box-title-plan-profissional h5 {
      font-size: 18px;
   }

   .price-box-title-plan h4 {
      font-size: 18px;
   }

   .price-title-profissional p {
      font-size: 13px;
   }

   .price-box-title-plan-profissional small {
      padding: 0 3px;
   }

   .price-title-profissional {
      width: 280px;
   }

   .price-title-profissional h4 {
      font-size: 18px;
   }

   .price-title-profissional p {
      font-size: 13px;
   }
}

@media screen and (max-width: 900px) {
   .detail-price {
      font-size: 13px !important;
   }

   .price-title-essencial {
      width: 380px;
      margin-right: 0;
   }

   .price-title-essencial h4 {
      font-size: 18px;
   }

   .price-title-essencial p {
      font-size: 13px;
   }

   .price-box-title-plan-profissional h5 {
      font-size: 18px;
   }

   .price-box-title-plan h4 {
      font-size: 18px;
   }

   .price-title-profissional p {
      font-size: 13px;
   }

   .price-box-title-plan-profissional small {
      padding: 0 3px;
   }

   .price-title-profissional {
      width: 380px;
   }

   .price-title-profissional h4 {
      font-size: 18px;
   }

   .price-title-profissional p {
      font-size: 13px;
   }

   .price-box-plan {
      width: 380px;
   }
}

@media screen and (max-width: 430px) {
   #agende-demonstracao,
   #personalize-plano {
      width: 43%;
      height: 55px;
      align-content: center;
      padding: 0 15px;
   }

   .cta-index-btn-container {
      display: flex;
      width: 100%;
      flex-direction: row;
      padding: 0 !important;
      gap: 5px;
   }

   .cta-index p {
      font-size: 1rem !important;
      color: #ffffff;
   }

   .cta-index .btn-cta-index {
      max-width: 175px;
      justify-content: center;
      padding: 0;
      gap: 5px;
   }

   .cta-index .btn-cta-index p {
      padding: 5px;
      width: 175px;
      height: 65px;
      font-size: 12px !important;
      line-height: 15px;
   }
}

@media screen and (max-width: 576px) {
   .detail-price {
      font-size: 13px !important;
   }

   .price-desktop {
      margin-bottom: 10px;
      padding-bottom: 0;
   }

   .terms-desktop {
      display: none;
   }

   .p-mobile {
      padding: 0 10px !important;
      margin-top: 0 !important;
      /* border: 1px blue solid; */
   }

   .ajuste-padding {
      padding: 0 15px !important;
      /* border: 1px blue solid; */
   }

   .price-terms-mobile {
      display: flex;
      justify-content: center;
      flex-direction: column;
      margin-bottom: 30px;
   }

   .price-terms-mobile:last-child {
      margin-bottom: 5px;
   }

   .line-terms-mobile {
      display: flex;
      flex-direction: row;
      width: 100%;
      margin-bottom: 10px;
   }

   .plan-terms-funcionarios {
      font-size: 14px;
      width: fit-content;
      margin-left: 0px;
      margin-right: 10px;
   }

   .price-terms-line {
      display: flex;
      flex-direction: row;
      text-align: center;
      border-radius: 5px;
      border: 1px gray solid;
      width: 90%;
      padding: 0;
   }

   .plan-terms {
      display: flex;
      color: #777;
      flex-direction: row;
      justify-content: center;
      text-align: center;
      font-weight: 600;
      width: 100%;
   }

   .price-title-essencial {
      width: 360px;
      margin-right: 0;
   }

   .price-title-essencial h4 {
      font-size: 18px;
   }

   .price-title-essencial p {
      font-size: 13px;
   }

   .price-box-title-plan-profissional h5 {
      font-size: 18px;
   }

   .price-box-title-plan h4 {
      font-size: 18px;
   }

   .price-title-profissional p {
      font-size: 13px;
   }

   .price-box-title-plan-profissional small {
      padding: 0 3px;
   }

   .price-title-profissional {
      width: 360px;
   }

   .price-title-profissional h4 {
      font-size: 18px;
   }

   .price-title-profissional p {
      font-size: 13px;
   }

   /* .price-box-plan {
      width: 360px;
   } */
}

.detail-obs {
   font-size: 13px;
}

.use-avantti {
   object-fit: scale-down;
   height: 314px;
}

.about-home {
   width: 600px;
   height: 314px;
}

@media screen and (max-width: 768px) {
   .detalhe-plano img {
      max-width: 95%;
   }
}

@media screen and (max-width: 576px) {
   .container-diferenciais-adicionais {
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 0 !important;
      width: 100%;
   }

   .sub-title-mobile {
      margin-top: 20px;
      max-width: 350px !important;
      line-height: 1.3rem;
   }

   .price-box-title-plan-adicionais {
      width: 100%;
      border-top-left-radius: 7px;
      border-top-right-radius: 7px;
   }

   .price-box-title-plan-adicionais h4 {
      color: #fff;
      font-size: 0.9rem;
      margin-bottom: 0;
   }

   .price-box-title-plan-adicionais img {
      width: 20px;
      position: absolute;
      z-index: 1;
      right: 5px;
   }

   .price-box-title-plan-adicionais small,
   .price-box-title-projetos small {
      font-size: 12px;
   }

   .price-box-plan-adicionais {
      width: 100%;
      border-radius: 7px !important;
   }

   .price-box-funcionalidades {
      width: 100%;
   }

   .price-box-projetos {
      margin-top: 40px !important;
   }

   .detail-price-adicionais {
      width: 100%;
      /* border: 1px red solid; */
      line-height: 1rem;
   }

   .detail-price-adicionais td {
      font-size: 11px !important;
      padding: 10px !important;
   }

   .mais-pedido {
      top: -5px;
      padding: 5px 10px;
      border-radius: 5px;
      font-weight: 600;
      font-size: 10px;
   }

   .funcionalidades-adicionais {
      width: 47% !important;
   }

   .header-func {
      border-top-left-radius: 5px;
      border-top-right-radius: 5px;
   }

   .header-func h4 {
      font-size: 0.8rem;
   }

   .header-func-proj {
      border-top-left-radius: 5px;
      border-top-right-radius: 5px;
   }

   .header-func-proj h4 {
      font-size: 0.7rem;
   }

   .funcionalidades-adicionais h6 {
      font-size: 0.8rem;
      padding: 2px 0;
   }

   .detalhe-plano img {
      max-width: 100%;
   }

   .cta-conheca-start {
      font-size: 0.9rem !important;
   }

   .use-avantti,
   .junte-avantti {
      width: 90vw;
   }

   .use-avantti-mobile {
      max-width: 90vw !important;
      max-height: 210px !important;
      background-color: #fff;
   }

   .facts {
      padding-top: 0 !important;
   }

   .section-title h2 {
      font-size: 22px;
   }
}

/*** Testimonial ***/
.testimonial-carousel .owl-dots {
   margin-top: 15px;
   display: flex;
   align-items: flex-end;
   justify-content: center;
}

.testimonial-carousel .owl-dot {
   position: relative;
   display: inline-block;
   margin: 0 5px;
   width: 10px;
   height: 10px;
   background: #dddddd;
   border-radius: 2px;
   transition: 0.5s;
}

.testimonial-carousel .owl-item.center {
   position: relative;
   z-index: 1;
}

/*** Team ***/
.team-item {
   transition: 0.5s;
}

.team-social {
   position: absolute;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   display: flex;
   align-items: center;
   justify-content: center;
   transition: 0.5s;
}

.team-social a.btn {
   position: relative;
   margin: 0 3px;
   margin-top: 100px;
   opacity: 0;
}

.team-item:hover {
   box-shadow: 0 0 30px #dddddd;
}

.team-item:hover .team-social {
   background: rgba(9, 30, 62, 0.7);
}

.team-item:hover .team-social a.btn:first-child {
   opacity: 1;
   margin-top: 0;
   transition: 0.3s 0s;
}

.team-item:hover .team-social a.btn:nth-child(2) {
   opacity: 1;
   margin-top: 0;
   transition: 0.3s 0.05s;
}

.team-item:hover .team-social a.btn:nth-child(3) {
   opacity: 1;
   margin-top: 0;
   transition: 0.3s 0.1s;
}

.team-item:hover .team-social a.btn:nth-child(4) {
   opacity: 1;
   margin-top: 0;
   transition: 0.3s 0.15s;
}

.blog-item .blog-img img {
   width: 400px;
   height: 200px;
   object-fit: cover;
}

.team-item:hover .team-img img,
.blog-item:hover .blog-img img {
   transform: scale(1.15);
}

.facts-box,
.img-thumbnail {
   border-radius: 10px !important;
   width: 98%;
   min-width: 300px;
   margin-bottom: 5px;
   padding: 0 !important;
   background-color: #9d28f0;
   cursor: pointer;
   transition: ease-in 0.5s;
   border: none;
}

.img-thumbnail:hover {
   scale: 1.02;
}

.custom-bg {
   background-color: #9d28f0 !important;
   width: 650px;
   min-width: 400px;
   border-radius: 0 0 10px 10px !important;
}

.custom-modal-content,
.custom-modal-header {
   width: 650px;
   border: none;
   min-width: 400px;
   background-color: white;
   align-content: center;
}

.custom-modal-header button {
   margin: 0 !important;
   padding: 0 !important;
   width: 20px;
   height: 20px;
   font-weight: bold !important;
   color: #000;
}

.facts-box img {
   width: 100%;
}

.footer-demonstration {
   background-image: url(../assets/img/bg_footer_v2.png);
   display: flex;
   flex-direction: row;
   background-position: 50%;
   color: rgb(51, 51, 51);
}

.form-demonstration {
   font: 400 16px / 22.8571px Arial, "Helvetica Neue", Helvetica, sans-serif;
   margin: 50px 0px !important;
   padding: 10px 20px;
   vertical-align: baseline;
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
   width: 428px;
   height: 580px;
   align-self: flex-start;
   background-color: rgb(245, 229, 255);
   border-radius: 33px;
   max-width: 428px;
   outline: none !important;
}

.div-form-demonstration {
   display: flex;
   justify-content: left;
   margin-left: 50px;
   /* border: 1px white solid; */
}

.footer-demonstration-text {
   display: flex;
   justify-content: right;
   width: 50%;
   /* border: 1px white solid; */
   padding-top: 60px;
}

.footer-demonstration-text p {
   font-size: 36px;
   font-weight: 700;
   max-width: 440px;
   color: #fff;
   margin-right: 40px;
   padding: 0 20px;
   line-height: 45px;
}

.form-label-demonstration {
   color: rgb(51, 51, 51) !important;
   margin: 0 0 6px 0;
}

.form-control-demonstration {
   margin: 0 0 15px 0;
}

.form-control-demonstration input,
select {
   box-shadow: rgb(221, 221, 221) 0px 2px 3px 0px inset;
   color: #000000 !important;
   height: 32px;
   outline: none !important;
   border: 1px solid rgb(245, 229, 255);
   padding: 0px 8px;
   width: 376px;
   background-color: rgb(255, 255, 255);
   border-radius: 14px;
}

.title-demonstration {
   font-size: 20px;
   font-weight: normal !important;
   line-height: 1.6rem;
}

/*** Miscellaneous ***/
@media (min-width: 991.98px) {
   .facts {
      position: relative;
      margin-top: 20px;
      z-index: 1;
   }
}

.back-to-top {
   display: flex;
   flex-direction: column;
   justify-content: center;
   position: fixed;
   width: 45px;
   height: 45px;
   right: 30px;
   bottom: 100px;
   padding-left: 0;
   padding-right: 0;
   text-align: center;
   justify-items: center !important;
   align-items: center !important;
   align-content: center !important;
   border-radius: 50% !important;
   z-index: 99;
}

.bg-header {
   background: linear-gradient(rgba(9, 30, 62, 0.7), rgba(9, 30, 62, 0.7)), url(../img/carousel-1.jpg) center center no-repeat;
   background-size: cover;
}

.bg-header-conheca {
   background: linear-gradient(rgba(9, 30, 62, 0.7), rgba(9, 30, 62, 0.7)), url(../img/carousel-2.jpg) center center no-repeat;
   background-size: cover;
}

.bg-header-materiais {
   background: linear-gradient(rgba(9, 30, 62, 0.8), rgba(9, 30, 62, 0.8)), url(../img/img_06.jpg) center center no-repeat;
   background-size: cover;
}

.link-animated a {
   transition: 0.5s;
}

.link-animated a:hover {
   padding-left: 10px;
}

@media (min-width: 767.98px) {
   .footer-about {
      margin-bottom: -75px;
   }
}

.fa-user {
   margin-right: 5px;
}

.contato {
   font-size: 28px;
   border-bottom: 2px white solid;
}

/* Footer */
#footer {
   font-size: 14px;
   background: var(--primary);
}

#footer .footer-newsletter {
   padding: 50px 0;
   background: #f3f5fa;
   text-align: center;
   font-size: 15px;
   color: #444444;
   position: relative;
}

#footer .footer-newsletter span {
   margin-top: 30px;
   position: relative;
   text-align: left;
}

#footer .footer-newsletter span input[type="email"] {
   border: 0;
   padding: 4px 10px;
   width: calc(100% - 100px);
   height: 40px;
   border-radius: 50px;
   padding: 6px 10px;
   box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.06);
}

#footer .footer-newsletter span button[type="submit"] {
   position: relative;
   margin-left: -50px;
   top: 0;
   right: 0;
   bottom: 0;
   height: 42px;
   border: 0;
   background: none;
   font-size: 16px;
   font-weight: bold;
   padding: 0 20px;
   background: var(--primary);
   color: #fff;
   transition: 0.3s;
   border-radius: 50px;
   box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
}

#footer .footer-newsletter span button[type="submit"]:hover {
   background: var(--secondary);
}

#footer .footer-top {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   width: 100%;
   padding: 30px 50px 0 50px;
   background: #fff;
   height: 130px;
}

#footer .footer-top h4 {
   font-size: 16px;
   font-weight: bold;
   color: var(--primary);
   position: relative;
   padding-bottom: 12px;
}

.footer-links {
   width: auto;
   height: 70px;
}

.footer-links a {
   font-weight: 600;
}

#footer .footer-top .footer-links ul {
   list-style: none;
   padding: 0;
   margin: 0;
}

#footer .footer-top .footer-links ul i {
   color: var(--primary);
   font-size: 12px;
   line-height: 1;
}

#footer .footer-top .footer-links ul li {
   padding: 5px 0;
   display: flex;
   align-items: center;
}

#footer .footer-top .footer-links ul li:first-child {
   padding-top: 0;
}

#footer .footer-top .footer-links ul a {
   color: #777777;
   transition: 0.3s;
   display: inline-block;
   line-height: 1;
}

.social-links {
   margin-right: 100px;
}

.social-links a {
   font-size: 16px;
   display: inline-block;
   background: var(--primary);
   color: #fff;
   line-height: 1;
   padding: 9px 0;
   border-radius: 50%;
   text-align: center;
   width: 36px;
   height: 36px;
   transition: 0.3s;
}

#footer .footer-top .social-links a:hover {
   background: var(--secondary);
   border: none;
   color: #fff;
   text-decoration: none;
}

.footer-bottom {
   display: flex;
   height: 60px;
   justify-content: space-between;
   justify-items: center;
   align-items: center;
   color: #fff;
}

.logo-footer {
   display: flex;
   justify-content: center;
   width: auto;
   margin-left: 50px;
}

.logo-footer img {
   height: 30px;
   width: 96px;
}

.footer-top .container {
   width: 100%;
}

@media (max-width: 768px) {
   .footer-demonstration {
      flex-direction: column;
   }

   .footer-demonstration-text {
      display: flex;
      justify-content: right;
      width: 100%;
      padding: 60px 10px 0 10px;
   }

   .footer-demonstration-text p {
      font-size: 18px;
      font-weight: 700;
      width: 360px !important;
      color: #fff;
      margin-right: 0;
      padding: 0 10px;
      line-height: 24px;
   }

   .title-demonstration {
      font-size: 16px;
      padding: 20px 0;
   }

   .div-form-demonstration {
      display: flex;
      justify-content: center;
      margin-left: 0px;
      padding: 0 10px 40px 10px;
   }

   .form-demonstration {
      font: 400 14px Arial, "Helvetica Neue", Helvetica, sans-serif;
      margin: 30px 0px !important;
      padding: 10px 20px;
      vertical-align: baseline;
      box-sizing: border-box;
      display: flex;
      flex-direction: column;
      width: 100%;
      border-radius: 10px;
      max-width: 370px;
      padding: 0 10px;
   }

   .form-control-demonstration input,
   select {
      box-shadow: rgb(221, 221, 221) 0px 2px 3px 0px inset;
      color: #000000 !important;
      height: 32px;
      outline: none !important;
      border: 1px solid rgb(245, 229, 255);
      padding: 0px 8px;
      width: 100%;
      background-color: rgb(255, 255, 255);
      border-radius: 14px;
   }

   .topicos {
      display: flex !important;
      justify-content: center !important;
      flex-direction: column !important;
      align-items: center !important;
   }

   .topicos p {
      width: 360px !important;
      /* border: 1px blue solid; */
   }

   #footer .footer-bottom {
      padding-top: 20px;
      padding-bottom: 20px;
   }

   #footer .copyright,
   #footer .credits {
      text-align: center;
      float: none;
   }

   #footer .credits {
      padding-top: 4px;
   }

   .fa-envelope-open {
      display: none !important;
   }

   #footer .footer-top {
      width: 100%;
      flex-direction: column;
      padding: 30px 50px 10px 30px;
      background: #fff;
      height: auto;
   }

   #footer .footer-top h4 {
      font-size: 14px;
   }
}

/* topicos */

.topicos img {
   width: 30px;
}

.topicos p {
   max-width: 345px;
   font-size: 18px;
   line-height: 20px;
}

/* F.A.Q */

.faq {
   background: var(--faqbg);
}

.faq .section-title h2 {
   background: var(--section);
}

.faq .faq-list {
   padding: 0 100px;
}

.faq .faq-list ul {
   padding: 0;
   list-style: none;
}

.faq .faq-list li + li {
   margin-top: 15px;
}

.faq .faq-list li {
   padding: 20px;
   background: var(--white);
   border-radius: 4px;
   position: relative;
}

.faq .faq-list a {
   display: block;
   position: relative;
   font-family: var(--ff-primary);
   font-size: 16px;
   line-height: 24px;
   font-weight: 500;
   padding: 0 30px;
   outline: none;
   cursor: pointer;
}

.faq .faq-list .icon-help {
   font-size: 24px;
   position: absolute;
   right: 0;
   left: 20px;
   color: var(--tertiary);
}

.faq .faq-list .icon-show,
.faq .faq-list .icon-close {
   font-size: 24px;
   position: absolute;
   right: 0;
   top: 0;
}

.faq .faq-list p {
   margin-bottom: 0;
   padding: 10px 0 0 0;
   max-width: 94%;
   color: #6b6b6b;
}

.faq .faq-list .icon-show {
   display: none;
}

.faq .faq-list a.collapsed {
   color: var(--fcsecondary);
}

.faq .faq-list a.collapsed:hover {
   color: var(--primary);
}

.faq .faq-list a.collapsed .icon-show {
   display: inline-block;
}

.faq .faq-list a.collapsed .icon-close {
   display: none;
}

@media (max-width: 1200px) {
   .faq .faq-list {
      padding: 0;
   }
}

.conheca {
   margin-top: 0;
}

.conheca-mobile,
.img-conheca,
.gif-conheca {
   margin-top: 0;
   padding: 0 12px !important;
}

/* .img-conheca {
   justify-content: center;
} */

.img-conheca img,
.gif-conheca img {
   width: 93% !important;
   object-fit: scale-down;
   bottom: 0;
}

.img-conheca-grande img {
   width: 80% !important;
}

@media screen and (max-width: 900px) {
   .conheca-mobile {
      margin: 0 !important;
      /* border: 1px red solid; */
      width: 50% !important;
      padding: 0 11px !important;
   }

   .cta-conheca-img {
      display: none !important;
      text-align: center !important;
   }

   .cta-conheca-texto {
      text-align: center !important;
   }

   .conheca-mobile h3 {
      font-size: 24px;
   }

   .conheca-mobile p {
      font-size: 17px;
      text-align: justify !important;
   }

   .gif-conheca {
      display: flex;
      width: 100%;
      justify-content: center;
   }

   .gif-conheca img {
      width: 70%;
      object-fit: scale-down;
   }

   .img-conheca {
      width: 39%;
      /* padding: 0 7px; */
      /* border: 1px red solid; */
      justify-content: center;
   }

   .img-conheca img {
      width: 100%;
      object-fit: scale-down;
   }

   .img-conheca-grande {
      width: 40%;
   }

   .img-conheca-grande img {
      width: 95% !important;
   }
}

@media screen and (max-width: 576px) {
   .conheca-mobile {
      /* border: 1px red solid; */
      width: 100vw !important;
      padding: 0 20px !important;
   }

   .conheca-mobile h3 {
      font-size: 19px;
   }

   .conheca-mobile p {
      font-size: 15px;
      text-align: justify !important;
   }

   .img-conheca,
   .img-conheca-grande {
      justify-content: center;
      /* border: 1px red solid; */
      width: 100%;
      margin-bottom: 20px !important;
   }

   .img-conheca img {
      width: 65% !important;
   }

   .img-conheca-grande {
      width: 100%;
   }

   .img-conheca-grande img {
      width: 60% !important;
      margin-bottom: 20px;
   }

   .img-conheca-cta {
      width: 100vw !important;
      /* border: 1px red solid; */
      margin: -40px 0 10px 0 !important;
   }

   .img-conheca-cta img {
      width: 50% !important;
      object-fit: scale-down;
   }
}

.col-lg-conheca {
   flex: 0 0 auto;
   width: 20%;
}

.conheca-item {
   position: relative;
   height: 150px;
   border-radius: 20px !important;
   box-shadow: 0 0 30px #dddddd;
   padding: 10px !important;
}

.ajuda-item {
   position: relative;
   height: 320px;
   padding: 25px 20px;
   transition: 0.5s;
   border-radius: 20px !important;
}

.ajuda-item .ajuda-title {
   height: 65px !important;
   padding-bottom: 20px !important;
}

/*** Testimonial ***/

.flip-container {
   display: flex;
   justify-content: space-between;
   height: 500px;
   perspective: 1000px;
   flex-wrap: wrap;
}

.flip-ccr {
   transform: rotateY(180deg);
}

.flip-votorantin {
   transform: rotateY(180deg);
}

.flipper {
   border-radius: 20px !important;
   width: 49%;
   height: 450px;
   transition: transform 0.8s;
   transform-style: preserve-3d;
   position: relative;
   box-shadow: 0 0 30px #dddddd;
}

.flipper-2 {
   border-radius: 20px !important;
   width: 49%;
   height: 450px;
   transition: transform 0.8s;
   transform-style: preserve-3d;
   position: relative;
   box-shadow: 0 0 30px #dddddd;
}

.front,
.back {
   position: absolute;
   backface-visibility: hidden;
}

.back {
   transform: rotateY(180deg);
}

.front-2,
.back-2 {
   position: absolute;
   backface-visibility: hidden;
}

.back-2 {
   transform: rotateY(180deg);
}

.vermais {
   align-items: baseline;
}

.vermais button {
   font-size: 13px;
}

.detail-testimonial {
   height: 264px;
}

/* Containter Como */

.container-como {
   position: relative;
   display: flex;
   justify-content: center;
   align-items: center;
   flex-wrap: wrap;
   gap: 90px 10px;
   padding: 50px 10px;
}

.container-como .card {
   position: relative;
   display: flex;
   justify-content: center;
   align-items: center;
   width: 350px;
   max-width: 100%;
   height: 300px;
   background: white;
   border-radius: 20px;
   transition: 0.5s;
   box-shadow: 0 35px 80px rgba(0, 0, 0, 0.15);
}

.container-como .card:hover {
   height: 370px;
   cursor: pointer;
}

.container-como .card .img-box {
   position: absolute;
   top: 20px;
   width: 300px;
   height: 150px;
   background: #333;
   border-radius: 12px;
   overflow: hidden;
   transition: 0.5s;
}

.container-como .card:hover .img-box {
   top: -100px;
   scale: 0.75;
   box-shadow: 0 15px 45px rgba(0, 0, 0, 0.2);
}

.container-como .card .img-box img {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: fit-content;
   object-fit: cover;
}

.container-como .card .content {
   position: absolute;
   top: 200px;
   width: 100%;
   height: 50px;
   padding: 0 20px;
   text-align: center;
   overflow: hidden;
   transition: 0.5s;
}

.container-como .card:hover .content {
   top: 70px;
   height: 300px;
}

.container-como .card .content h2 {
   font-size: 1.1rem;
   font-weight: 600;
   color: var(--clr);
}

.container-como .card .content p {
   color: #333;
   padding-top: 15px;
   font-size: 0.9rem;
}

.container-como .card .content a:hover {
   opacity: 0.8;
}

@media screen and (max-width: 900px) {
   .flip-container {
      height: auto;
   }

   .flipper {
      width: 100%;
      height: 450px;
   }

   .flipper-2 {
      width: 100%;
      height: 450px;
   }

   .detail-testimonial {
      height: 264px;
   }
}

@media screen and (max-width: 576px) {
   .container-conheca {
      width: 100%;
      gap: 10px !important;
      padding: 1px !important;
      margin-left: 0 !important;
      padding-left: 0 !important;
   }

   .container-conheca .card {
      width: 160px !important;
      max-width: 100%;
      margin-top: 10px;
   }

   .container-conheca .card:hover {
      height: 220px !important;
      cursor: pointer;
   }

   .container-como .card {
      width: 400px;
      border-radius: 15px;
   }

   .container-como .card .content {
      position: absolute;
      top: 200px;
      width: 100%;
      height: 50px;
      padding: 0 10px;
   }

   .box-conheca {
      display: flex;
      flex-direction: column !important;
   }

   .container-como .card .content h2 {
      font-size: 1rem;
      font-weight: 600;
      color: var(--clr);
   }

   .container-como .card .img-box {
      width: 250px;
      border-radius: 10px;
   }

   .container-como .card .content p {
      font-size: 0.8rem;
   }

   .flip-container {
      height: auto;
   }

   .flipper {
      width: 100%;
      height: 560px;
   }

   .flipper-2 {
      width: 100%;
      height: 600px;
   }

   .detail-testimonial {
      height: 350px;
   }

   .detail-testimonial p {
      font-size: 14px;
   }

   .detail-mobile {
      height: 400px;
   }
}

/* Containter Como */

.container-home {
   position: relative;
   display: flex;
   justify-content: center;
   align-items: center;
   flex-wrap: wrap;
   gap: 90px 10px;
   padding: 50px 10px;
}

.container-home .card {
   /* position: relative; */
   display: flex;
   /* justify-content: center; */
   flex-direction: column;
   align-items: center;
   width: 300px;
   max-width: 100%;
   height: 270px;
   background: white;
   border-radius: 10px;
   transition: 0.5s;
   box-shadow: 0 35px 80px rgba(0, 0, 0, 0.15);
}

.container-home .card .img-box {
   margin: 30px 0 20px 0;
   width: 245px;
   height: 165px;
   object-fit: scale-down;
   border-radius: 5px;
   transition: 0.5s;
}

.container-home .card:hover .img-box {
   scale: 1.1;
}

.container-home .card .img-box img {
   width: 100%;
   height: 165px;
}

.container-home .card .content {
   top: 195px;
   width: 100%;
   padding: 0 20px;
   text-align: center;
   transition: 0.5s;
   line-height: 1.2rem;
}

.container-home .card .content p {
   color: #333;
   font-size: 15px;
   padding: 0 !important;
   display: flex;
}

/* Containter Conheca */

.container-grupo {
   padding-top: 40px;
   padding-bottom: 70px;
   /* border: 1px blue solid; */
}

.container-conheca {
   position: relative;
   display: flex;
   justify-content: center;
   align-items: center;
   flex-wrap: wrap;
   gap: 70px 20px;
   padding: 10px 20px;
   margin-bottom: 10px;
}

.container-conheca .card {
   position: relative;
   display: flex;
   justify-content: center;
   align-items: center;
   width: 180px;
   max-width: 100%;
   height: 150px;
   background: white;
   border-radius: 20px;
   transition: 0.5s;
   box-shadow: 0 35px 80px rgba(0, 0, 0, 0.15);
}

.container-conheca .card:hover {
   height: 200px;
   cursor: pointer;
}

.container-conheca .card .img-box {
   position: absolute;
   top: 20px;
   width: 60px;
   height: 60px;
   border-radius: 12px;
   overflow: hidden;
   transition: 0.5s;
}

.container-conheca .card:hover .img-box {
   top: -25px;
   scale: 0.75;
   box-shadow: 0 15px 45px rgba(0, 0, 0, 0.2);
}

.container-conheca .card .img-box img {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   object-fit: cover;
}

.container-conheca .card .content {
   position: absolute;
   top: 100px;
   width: 100%;
   height: 40px;
   padding: 0 20px;
   text-align: center;
   overflow: hidden;
   transition: 0.5s;
}

.container-conheca .card:hover .content {
   top: 40px;
   height: 170px;
}

.container-conheca .card .content h2 {
   font-size: 1.1rem;
   font-weight: 500;
   color: var(--clr);
}

.container-conheca .card .content p {
   color: #333;
   padding-top: 15px;
   font-size: 0.9rem;
}

.container-conheca .card:hover .content p {
   padding-top: 10px;
}

.container-conheca .card .content a:hover {
   opacity: 0.8;
}

.gestao,
.monitore {
   display: flex;
   justify-content: center;
   height: 350px;
}

.gestao img {
   /* border-radius: 49% 51% 73% 27% / 31% 39% 61% 69%; */
   height: 320px;
}

.banco {
   display: flex;
   justify-content: center;
   height: 330px;
   margin-top: 25px;
}

.banco img {
   /* border-radius: 49% 51% 73% 27% / 31% 39% 61% 69%; */
   height: 330px;
}

.monitore img {
   height: 360px;
}

.conheca-gestao {
   font-size: 14px;
   line-height: 23px;
   list-style: none;
}

.titulo-mobile p {
   font-size: 20px !important;
}

.btn-cta a {
   background: var(--tertiary);
   color: #000;
}

.btn-cta a:hover {
   color: #ffffff;
   box-shadow: inset 0 0 0 0 var(--primary);
   background: var(--primary);
}

.ajuste-btn-mobileG {
   gap: 15px;
   padding-top: 3rem;
}

@media screen and (max-width: 576px) {
   .gestao,
   .banco {
      display: none;
   }

   .container-conheca .card .content {
      padding: 0 16px;
   }

   .container-conheca .card .content h2 {
      font-size: 1rem;
   }

   .textos-btn-mobile {
      font-size: 12px !important;
      padding-left: 10px;
      padding-right: 10px;
   }

   .textos-btn-mobile i {
      display: none;
   }

   .btn-fixoGG i {
      display: none;
   }

   .ajuste-btn-mobileG {
      flex-direction: row;
      text-align: center;
      gap: 5px !important;
      padding: 0 !important;
   }

   .carousel-control-prev-icon,
   .carousel-control-next-icon {
      width: 1rem;
      height: 1rem;
   }

   .ajuste-btn-mobileG a {
      width: 160px;
      font-size: 11px !important;
   }

   .btn-fixoM {
      width: 240px !important;
   }

   .btn-fixoG {
      width: 260px !important;
   }

   .titulo-mobile h6 {
      margin-top: -35px !important;
      font-size: 17px !important;
      /* border: 1px red solid !important; */
   }

   .titulo-mobile p {
      margin-top: -10px;
      font-size: 14px !important;
      /* border: 1px red solid !important; */
   }

   .cta-mobile {
      padding-left: 15px;
      padding-right: 15px;
      font-weight: 500 !important;
      font-size: 15px !important;
      /* border: 1px red solid !important; */
   }

   .btn-cta {
      margin-left: -30px !important;
      padding-right: 15px !important;
   }

   .mac-mobile {
      margin-top: -40px !important;
   }
}

.mac-mobile {
   object-fit: contain;
   margin-top: -20px;
   height: 340px;
}

.gif-mobile {
   object-fit: contain;
   height: 350px;
}

.ciclo-more {
   min-height: 450px;
   /* border: 1px red solid; */
}

/* Containter diferenciais */

.container-diferenciais {
   position: relative;
   display: flex;
   justify-content: center;
   align-items: center;
   flex-wrap: wrap;
   gap: 75px 20px;
   padding: 50px 10px 20px 10px;
}

.container-diferenciais-adicionais {
   position: relative;
   display: flex;
   justify-content: space-around;
   /* align-items: center; */
   flex-wrap: wrap;
   gap: 75px 5px;
   padding: 40px 5px 20px 5px;
   /* border: 1px red solid; */
}

.container-diferenciais .card-diferenciais {
   position: relative;
   display: flex;
   justify-content: center;
   align-items: center;
   width: 350px;
   max-width: 100%;
   height: 200px;
   background: white;
   border-radius: 20px;
   transition: 0.5s;
   box-shadow: 0 35px 80px rgba(0, 0, 0, 0.15);
}

.container-diferenciais .card-diferenciais:hover {
   height: 200px;
   cursor: pointer;
}

.container-diferenciais .card-diferenciais .img-box-diferenciais {
   position: absolute;
   top: 20px;
   width: 250px;
   height: 110px;
   background: #333;
   border-radius: 12px;
   overflow: hidden;
   transition: 0.5s;
}

.container-diferenciais .card-diferenciais:hover .img-box-diferenciais {
   top: -80px;
   scale: 0.75;
   box-shadow: 0 15px 45px rgba(0, 0, 0, 0.2);
}

.container-diferenciais .card-diferenciais .img-box-diferenciais img {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: fit-content;
   object-fit: cover;
}

.container-diferenciais .card-diferenciais .content-diferenciais {
   position: absolute;
   top: 140px;
   width: 100%;
   height: 50px;
   padding: 0 20px;
   text-align: center;
   overflow: hidden;
   transition: 0.5s;
}

.container-diferenciais .card-diferenciais:hover .content-diferenciais {
   top: 30px;
   height: 200px;
}

.container-diferenciais .card-diferenciais .content-diferenciais h2 {
   font-size: 1rem;
   font-weight: 600;
   color: var(--clr);
   margin: 7px 0 5px 0;
}

.container-diferenciais .card-diferenciais .content-diferenciais p {
   color: #333;
   padding-top: 15px;
   font-size: 0.9rem;
}

@media screen and (max-width: 576px) {
   .container-diferenciais .card-diferenciais {
      width: 350px;
      border-radius: 15px;
   }

   .container-diferenciais .card-diferenciais .content-diferenciais p {
      font-size: 0.8rem;
   }

   .botoes {
      width: 210px;
      padding: 2px;
      font-size: 12px;
   }

   .h2-mobile {
      font-size: 22px !important;
   }

   .carousel-link {
      margin-top: 100px !important;
   }

   .carousel-link button {
      font-size: 12px !important;
      padding: 5px 10px !important;
   }

   .gif-mobile {
      height: 220px;
      width: 430px;
   }

   .ciclo-more {
      min-height: 280px;
   }
}

.botoes {
   width: 220px;
   padding: 10px;
}

/*** Carousel Clientes ***/
.vendor-carousel .owl-dots {
   margin-top: 15px;
   display: flex;
   align-items: flex-end;
   justify-content: center;
}

.clients-home {
   margin: 40px 0 60px 0;
   padding-bottom: 50px;
}

.vendor-carousel .owl-dot {
   position: relative;
   display: inline-block;
   margin: 0 5px;
   width: 10px;
   height: 10px;
   background: #dddddd;
   border-radius: 2px;
   transition: 0.5s;
}

.vendor-carousel .owl-dot.active {
   width: 30px;
   background: var(--primary);
}

.carousel {
   display: flex;
   position: relative;
   justify-content: center;
   align-items: center;
}

.vendor-carousel {
   max-width: 800px;
}

.vendor-carousel img {
   max-width: 800px;
}

.carousel-link {
   margin-top: 200px;
}

.carousel-link button {
   border-radius: 20px;
   font-size: 14px;
   padding: 12px;
   border: 1px white solid;
}

.ajuste-padding {
   padding: 15px 0 !important;
}

.principal {
   width: 100% !important;
}

/* Tabs Pagina Clientes  Vertical*/

.tabscontainer {
   display: flex;
   flex-direction: column;
   align-items: center;
   margin-top: 30px;
   margin-bottom: 60px;
}

.tab {
   overflow: hidden;
   background-color: none;
   width: 60%;
   border-top-left-radius: 20px;
}

.tab button {
   border: 1px #ccc solid;
   outline: none;
   cursor: pointer;
   transition: 0.3s;
   font-size: 17px;
   background-color: var(--light);
   color: var(--secondary);
   padding: 16px;
   border-top-left-radius: 20px;
   font-weight: bold;
   box-shadow: 0 0 30px #dddddd;
}

.tab button:hover {
   background-color: var(--secondary);
   color: #fff;
   font-weight: bold;
}

.tab button.active {
   background-color: var(--primary);
   color: #fff;
   font-weight: bold;
}

.tabcontent {
   display: none;
   padding: 20px 25px;
   border: 1px solid #ccc;
   text-align: left;
   width: 60%;
   border-bottom-right-radius: 20px;
   border-bottom-left-radius: 20px;
   box-shadow: 0 0 30px #dddddd;
}

.tabcontent p {
   margin-bottom: 10px;
   line-height: 21px;
}

.tabcontent h3 {
   font-size: 20px;
   margin-bottom: 24px;
}

@media screen and (max-width: 900px) {
   .tab {
      width: 95%;
   }

   .tabcontent {
      width: 95%;
      padding: 20px 16px;
   }

   .cta-mobile {
      padding-left: 15px;
      padding-right: 15px;
      font-weight: 600 !important;
      font-size: 16px !important;
      /* border: 1px red solid !important; */
   }
}

@media screen and (max-width: 576px) {
   .tab button {
      font-size: 13px;
      font-weight: 500;
      padding: 10px;
   }

   .tab button.active {
      font-weight: 500;
   }

   .tabcontent h3 {
      font-size: 15px;
      margin-bottom: 24px;
   }

   .tabcontent p {
      margin-bottom: 10px;
      line-height: 20px;
      text-align: justify;
      font-size: 14px;
   }

   .tablinks {
      width: auto;
      margin-left: -5px;
   }

   .btn-fixo {
      font-size: 13px;
   }

   .btn-fixo i {
      display: none;
   }
}

/* tools */

.div-checker-red {
   border: 1px red solid !important;
}

.div-checker-blue {
   border: 1px blue solid !important;
}

/*--------------------------------------------------------------
# Services
--------------------------------------------------------------*/

.services {
   display: flex;
   width: 100%;
   /* border: 1px red solid !important; */
   justify-content: center;
   padding: 0 !important;
   align-items: center;
}

.services-container {
   display: flex;
   justify-content: center;
   /* border: 1px red solid !important; */
   width: 100%;
   margin: 0;
}

.services .icon-box {
   display: block;
   justify-content: center;
   text-align: center;
   transition: all ease-in-out 0.3s;
   border-radius: 20px;
   border: 1px var(--secondary) solid;
   margin-bottom: 70px;
   height: 315px;
   width: 400px;
}

.service-title {
   width: 400px;
   background-color: var(--secondary);
   border-top-right-radius: 20px;
   border-top-left-radius: 20px;
   padding: 0 10px;
   height: 175px;
   clip-path: polygon(0 0, 100% 0, 100% 90%, 47% 90%, 50% 100%, 53% 90%, 0 90%);
   z-index: -1;
   position: relative;
   margin-top: 30px;
}

.detail-service {
   text-align: left;
   position: absolute;
   font-size: 14px;
   background: #ebe8e8;
   position: relative;
   padding: 15px 5px 1px 0;
   margin-top: -20px;
   z-index: -2;
   border-bottom-right-radius: 20px;
   border-bottom-left-radius: 20px;
   height: 160px;
}

.detail-service ul {
   margin-top: 8px;
   padding: 0 10px 0 20px;
}

.detail-service li {
   list-style-type: none;
}

.services .icon-box .icon {
   margin: -45px auto;
   width: 60px;
   height: 60px;
   background: var(--light);
   transition: all 0.8s ease-out 0s;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 10px;
   border: 2px var(--primary) solid;
   position: relative;
}

.box-include {
   display: flex;
   width: 105px;
   height: 45px;
   border: 1px #60cfc1 solid;
   border-radius: 10px;
   font-size: 12px;
   font-weight: 600;
   /* position: relative; */
   background-color: #60cfc1;
   color: #000;
   padding: 3px;
   float: right;
   margin-right: 10px;
}

.services .icon-box .icon img {
   width: 40px;
   height: 40px;
}

.services .icon-box h4 {
   font-weight: 600;
   font-size: 20px;
   color: #fff;
   height: 20px;
   padding-top: 25px;
   margin-bottom: 40px;
}

.services .icon-box p {
   line-height: 18px;
   font-size: 14px;
   color: #fff;
}

.services .icon-box:hover .icon {
   background: #fff;
   transform: rotateY(360deg);
}

.services .icon-box:hover {
   scale: 1.05;
   box-shadow: 7px 3px 8px 0px rgba(157, 40, 240, 0.51);
}

@media screen and (max-width: 576px) {
   .services .icon-box {
      margin-bottom: 70px;
      height: 315px;
      width: 85vw;
   }

   .service-title {
      width: 85vw;
      padding: 0 10px;
      height: 175px;
   }

   .detail-service {
      font-size: 13px;
      padding: 15px 8px 8px 0;
      margin-top: -20px;
      height: 160px;
   }

   .services .icon-box h4 {
      font-size: 16px;
      padding-top: 25px;
   }

   .services .icon-box p {
      line-height: 16px;
      font-size: 13px;
      color: #fff;
      /* border: 1px white solid; */
      margin-top: 20px;
   }
}

/* MATERIAIS */

.materiais {
   display: flex;
   width: 100%;
   /* border: 1px blue solid !important; */
   justify-content: center;
   justify-items: center;
   padding: 0 !important;
   align-items: center;
}

.diagnostico {
   background-color: #fbf6f4;
}

.diagnostico h3 {
   font-size: 2rem;
   /* text-align: center; */
}

.diagnostico p {
   font-size: 1.2rem;
   color: #47009a;
}

.diagnostico-box {
   display: flex;
   width: 60%;
   justify-content: center;
   border: 2px #c077f2;
   border-style: double;
   border-radius: 5px;
   cursor: pointer;
}

.materiais-container {
   display: flex;
   flex-direction: row;
   justify-content: center;
   /* border: 1px red solid; */
   gap: 15px;
   padding: 0 10px;
   flex-wrap: wrap;
   width: 100%;
}

.materiais-box {
   display: flex;
   flex-direction: column;
   width: 410px;
   height: 224px;
   /* border: 1px red solid; */
   justify-content: center;
   margin-bottom: 20px;
   border-radius: 20px;
}

.materiais-download {
   display: flex;
   flex-direction: column;
   width: 410px;
   /* border: 1px blue solid; */
   justify-content: center;
   margin-bottom: 30px;
   align-items: center;
   justify-items: center;
}

.materiais-download img {
   border-radius: 20px;
}

.materiais-download:hover {
   border-radius: 20px;
   /* box-shadow: 5px 5px 3px 0px rgba(0, 0, 0, 0.5);
   -webkit-box-shadow: 5px 5px 3px 0px rgba(0, 0, 0, 0.5);
   -moz-box-shadow: 5px 5px 3px 0px rgba(0, 0, 0, 0.5); */
   scale: 1.03;
   transition: 0.25s ease-out;
   cursor: pointer;
}

.materiais-box:hover {
   cursor: pointer;
}

.btnbaixar {
   display: flex;
   justify-content: center;
   margin-top: -20px;
}

.materiais-box .material-title {
   position: relative;
   margin-top: 5px;
   padding: 0 10px 0 5px;
   text-align: justify;
   /* border: 1px red solid; */
}

.materiais-box .material-title h4 {
   font-size: 16px;
   font-weight: 500;
   margin: 0;
}

.materiais-box .material-title p {
   margin: 1px 0 0 0;
   font-size: 14px;
   font-weight: 500;
}

.materiais-box .materiais-videos video {
   width: 100%;
   height: 224px;
}

.materiais-box .materiais-videos video[poster] {
   width: 100%;
   height: 100%;
}

@media screen and (max-width: 576px) {
   .materiais-box {
      width: 100%;
   }

   .material {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      width: 100%;
      margin: 0 0 30px 0;
      justify-items: center;
      padding: 0;
   }

   .material img {
      width: 370px;
      margin: 0 0 0 6px;
   }

   .materiais-box .materiais-videos video {
      width: 100%;
      height: 190px;
   }
}

@media screen and (max-width: 380px) {
   .materiais-box .materiais-videos video {
      width: 100%;
      height: 160px;
   }

   .material img {
      width: 310px;
   }

   .container-conheca .card .content h2 {
      font-size: 0.9rem;
   }
}

@media screen and (max-width: 414px) {
   .container-conheca .card .content h2 {
      font-size: 0.9rem;
   }
}

.text-white {
   opacity: 1;
   color: #fff !important;
}

.display-conheca h6 {
   font-size: 45px;
   line-height: 50px;
   font-weight: 700 !important;
}

.display-conheca p {
   font-size: 20px;
}

.display-servicos h6 {
   font-size: 38px;
   line-height: 50px;
   font-weight: bold !important;
}

.display-servicos p {
   font-weight: normal !important;
}

.title-ajuda h4 {
   font-size: 28px;
}

.title-conheca h4 {
   font-size: 28px;
}

.title-ajuda p {
   font-size: 18px;
   font-weight: 500;
}

@media screen and (max-width: 576px) {
   .display-conheca h6 {
      font-size: 22px;
      line-height: 32px;
   }

   .display-servicos h6 {
      font-size: 22px;
      line-height: 32px;
   }
}

@-webkit-keyframes orbit {
   0% {
      -webkit-transform: rotateY(90deg) rotate(0deg);
   }
   60% {
      -webkit-transform: rotateY(90deg) rotate(-180deg);
   }
   100% {
      -webkit-transform: rotateY(90deg) rotate(-360deg);
   }
}
@-moz-keyframes orbit {
   0% {
      -moz-transform: rotateY(90deg) rotate(0deg);
   }
   60% {
      -moz-transform: rotateY(90deg) rotate(-180deg);
   }
   100% {
      -moz-transform: rotateY(90deg) rotate(-360deg);
   }
}
@keyframes orbit {
   0% {
      -webkit-transform: rotateY(90deg) rotate(0deg);
      -moz-transform: rotateY(90deg) rotate(0deg);
      -ms-transform: rotateY(90deg) rotate(0deg);
      -o-transform: rotateY(90deg) rotate(0deg);
      transform: rotateY(90deg) rotate(0deg);
   }
   60% {
      -webkit-transform: rotateY(90deg) rotate(-180deg);
      -moz-transform: rotateY(90deg) rotate(-180deg);
      -ms-transform: rotateY(90deg) rotate(-180deg);
      -o-transform: rotateY(90deg) rotate(-180deg);
      transform: rotateY(90deg) rotate(-180deg);
   }
   100% {
      -webkit-transform: rotateY(90deg) rotate(-360deg);
      -moz-transform: rotateY(90deg) rotate(-360deg);
      -ms-transform: rotateY(90deg) rotate(-360deg);
      -o-transform: rotateY(90deg) rotate(-360deg);
      transform: rotateY(90deg) rotate(-360deg);
   }
}

.button {
   display: inline-block;
   border-radius: 10px;
   border: 1px solid rgba(0, 0, 0, 0.05);
   position: relative;
   padding: 10px 15px;
   font-size: 14px;
   font-weight: bold;
   cursor: pointer;
   -webkit-transform-style: preserve-3d;
   -moz-transform-style: preserve-3d;
   -ms-transform-style: preserve-3d;
   -o-transform-style: preserve-3d;
   transform-style: preserve-3d;
   -webkit-transition: all 500ms ease-in-out;
   -moz-transition: all 500ms ease-in-out;
   transition: all 500ms ease-in-out;
   color: #fff;
   /* padding: 15px 25px; */
   background-color: var(--primary);
   background-image: radial-gradient(93% 87% at 87% 89%, rgba(0, 0, 0, 0.23) 0%, transparent 86.18%),
      radial-gradient(66% 66% at 26% 20%, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0) 69.79%, rgba(255, 255, 255, 0) 100%);
   box-shadow: inset -3px -3px 9px rgba(255, 255, 255, 0.25), inset 0px 3px 9px rgba(255, 255, 255, 0.3), inset 0px 1px 1px rgba(255, 255, 255, 0.6), inset 0px -8px 36px rgba(0, 0, 0, 0.3),
      inset 0px 1px 5px rgba(255, 255, 255, 0.6), 2px 19px 31px rgba(0, 0, 0, 0.2);
}
.button:hover {
   -webkit-transform: translateY(-5px);
   -moz-transform: translateY(-5px);
   -ms-transform: translateY(-5px);
   -o-transform: translateY(-5px);
   transform: translateY(-5px);
   color: #fff;
   background: var(--secondary);
}

.fa-download {
   color: #fff;
}

.header-login {
   display: flex;
   flex-shrink: 0;
   align-items: center;
   justify-content: space-between;
   padding: 0.8rem;
   border-bottom: 1px solid #dee2e6;
   border-top-left-radius: calc(0.3rem - 1px);
   border-top-right-radius: calc(0.3rem - 1px);

   .btn-close-login {
      box-sizing: content-box;
      width: 0.5em;
      height: 0.5em;
      color: #000;
      background: transparent
         url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e")
         center/1em auto no-repeat;
      border: 0;
      border-radius: 2px;
      opacity: 0.5;
      padding: 0.5rem 0.5rem;
      margin: -0.5rem -0.5rem -0.5rem auto;
   }
}

.modal-login-header {
   display: flex;
   justify-content: center;
   flex-shrink: 0;
   align-items: center;
   margin: 5px 0 10px 0;
   border-bottom: 1px solid #dee2e6;
   padding-bottom: 10px;
}

.modal-login-header h6 {
   width: 75%;
   text-align: center;
}

.modal-login-title {
   margin-bottom: 0;
   line-height: 1.5;
}

.error {
   color: #ff0000;
   display: none;
   font-size: 13px;
   font-weight: 500;
}

#sign-up,
#sign-in {
   color: #67d1c4;
}

#sign-up:hover,
#sign-in:hover {
   cursor: pointer;
}

.user-off {
   display: none;
}

.textoemail {
   font-size: 14px;
   color: #47009a;
}

.blog-item h4 {
   font-size: 18px;
}

.blog-item p {
   font-size: 0.9rem;
}

.blog-item a {
   font-size: 0.9rem;
}

.detail-blog {
   height: 211.4px;
}

.blog-title {
   font-size: 1.4rem;
}

.btn-light {
   font-size: 0.9rem;
}

.blog-recents {
   font-size: 1rem;
   color: var(--dark);
   font-weight: 500;
}

.timeline-sobre {
   font-size: 1rem !important;
   line-height: 1.3rem;
   width: max(900px);
}

.btn-about button {
   margin-top: 5px !important;
}

.card-diferenciai img {
   object-fit: cover;
}

.display-index {
   font-size: 45px !important;
   font-weight: 700 !important;
}

.about-mobile {
   justify-content: center;
   height: max(56px);
}

.about-mobile img {
   display: flex;
   height: 50px !important;
}

.scroller[data-animated="true"] {
   overflow: hidden;
   -webkit-mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent);
   mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent);
}

.scroller[data-animated="true"] .scroller__inner {
   width: max-content;
   flex-wrap: nowrap;
   animation: scroll var(--_animation-duration, 1s) linear;
}

.scroller[data-direction="right"] {
   --_animation-direction: reverse;
}

.scroller[data-direction="left"] {
   --_animation-direction: forwards;
}

.scroller[data-speed="fast"] {
   --_animation-duration: 10s;
}

.scroller[data-speed="slow"] {
   --_animation-duration: 40s;
}

@keyframes scroll {
   to {
      transform: translate(calc(-50% - 0.5rem));
   }
}

.tag-list {
   display: flex;
   flex-direction: row !important;
   margin: 0;
   padding-inline: 0;
   list-style: none;
   background-color: #fff;
}

.tag-list img {
   padding-right: 25px;
   width: 100%;
   object-fit: scale-down;
}

@media screen and (max-width: 576px) {
   .detail-blog {
      height: 220px;
   }

   .post-title {
      font-size: 14px !important;
   }

   .blog-item p {
      font-size: 0.8rem;
   }

   .about-mobile {
      margin-bottom: 60px !important;
   }

   .display-index {
      font-size: 24px !important;
      font-weight: 600 !important;
   }

   .modal-content {
      /* background-color: #000 !important; */
      width: 100%;
   }
}

.btn-back-to-top {
   color: #ffffff;
   background-color: var(--tertiary);
   border-color: var(--tertiary);
   box-shadow: inset 0 0 0 50px transparent;
}
.btn-back-to-top:hover {
   color: #fff;
   background-color: var(--secondary);
   border-color: var(--secondary);
   box-shadow: inset 0 0 0 0 var(--tertiary);
}

.btn-ciano {
   color: #000;
   background-color: #67cb57;
   border-color: #67cb57;
   box-shadow: inset 0 0 0 50px transparent;
   font-family: "Montserrat";
   font-weight: 600;
   transition: 0.5s;
   border-radius: 10px;
   text-align: center;
}

.btn-ciano:hover {
   background-color: #90ee90;
   box-shadow: inset 0 0 0 0 #90ee90;
   color: #000;
}

.more-topics {
   padding: 0 5px 0 12px;
}

.span-topics:hover,
.more-topics:hover {
   cursor: pointer;
   font-weight: bold;
}

.span-topics i:hover {
   opacity: 0.8;
}

.more-topics-no {
   display: none;
}

.more-topics-yes {
   display: block;
}

.btn-more {
   display: flex !important;
   width: auto !important;
   padding: 3px 0 0 0;
   font-size: 1.1rem;
}

.cta-conheca {
   display: flex;
   flex-direction: row;
   justify-content: space-around;
   align-items: center;
   background-image: url(../img/bgcall.png);
   height: 150px;
   margin-bottom: 40px;
}

/* wow fadeInUp mb-5 py-5 */

.cta-conheca-texto {
   display: inline-flex;
   max-width: 750px;
   height: 55px;
   font-size: 18px;
   padding-left: 30px;
   color: #fff;
}

.cta-conheca-texto p {
   height: 55px;
}

.cta-conheca-img {
   display: inline-flex;
   height: 85px;
   object-fit: scale-down;
   margin-right: 30px;
}

.diferenciais {
   font-size: 25px;
}

.about-topics {
   font-size: 16px !important;
}

.about-gif {
   margin-top: 0;
   /* max-height: 400px; */
   /* border: 1px red solid; */
}

.services-logo {
   max-width: 900px !important;
}

.services-logo li {
   padding: 0 15px 0 15px;
}

.services-logo img {
   height: 70px;
}

.institucional {
   font-size: 1.8rem;
   font-weight: 600;
   margin-top: 20px;
   padding: 15px 15px 0 15px;
}

.container-institucional {
   padding-top: 30px;
   padding-bottom: 40px;
   margin-bottom: 80px;
}

.container-index {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 20px;
   padding: 10px;
   margin-bottom: 10px;
}

.container-index .card-index {
   position: relative;
   font-weight: 600;
   display: flex;
   justify-content: center;
   align-items: center;
   width: 280px;
   max-width: 100%;
   height: 180px;
   background: white;
   border-radius: 15px;
   transition: 0.3s;
   box-shadow: 0 35px 80px rgba(0, 0, 0, 0.15);
}

.container-index .card-index:hover {
   /* cursor: pointer; */
   scale: 1.04;
}

.container-index .card-index .content-index {
   display: flex;
   justify-content: center;
   align-items: center;
   /* position: absolute; */
   width: 100%;
   height: 90%;
   padding: 0 10px;
   text-align: center;
   overflow: hidden;
   transition: 0.5s;
}

.container-index .card-index .content-index p {
   /* display: flex; */
   height: auto;
   margin: 5px 0;
   line-height: 1.5;
   color: #181818;
}

@media screen and (max-width: 576px) {
   .container-index {
      flex-direction: column;
   }

   .institucional {
      font-size: 1rem;
      font-weight: 500;
      margin-top: 20px;
      padding: 15px 15px 0 15px;
   }

   .cta-conheca-img {
      display: none;
   }

   .cta-conheca-texto {
      width: 100%;
      font-size: 15px;
      padding: 0 15px;
      text-align: center !important;
   }

   .diferenciais-tecnicos {
      margin-top: 0 !important;
      padding: 1rem 0 !important;
   }

   .diferenciais {
      font-size: 22px;
      padding: 0 10px;
   }

   .about-gif {
      margin-top: 0;
      min-height: 330px;
   }

   .services-logo li {
      padding: 0;
   }

   .services-logo img {
      height: 40px;
   }

   .section-title h4 {
      font-size: 20px;
   }
}

/* BLOG */

.bg-blog-post {
   background: linear-gradient(rgba(9, 30, 62, 0.8), rgba(9, 30, 62, 0.8)), url(../blog/app/assets/img/bg-blog-post.jpg) center center no-repeat;
   background-size: cover;
}

.title-blog {
   /* border: 1px #fff solid; */
   width: max(850px);
   margin-left: 5rem;
}

.title-blog h6 {
   font-size: 2.5rem;
   font-weight: 700;
   color: #fff;
}

.title-blog a {
   color: #67d1c4;
   font-weight: bold;
}

.title-blog a:hover {
   color: #0582ae;
}

.detail-post {
   color: #fff;
}

.img-destaque {
   margin: 0;
   padding: 0;
   height: 350px;
}

.content-blog {
   padding: 0;
   color: #000;
}

.content-blog strong {
   color: #000;
}

.link-blog {
   display: flex !important;
   align-items: center !important;
   padding-left: 20px !important;
}

.link-blog a {
   /* color: #fff !important; */
   font-size: 1.6rem;
   line-height: 1.6rem;
   /* font-weight: 600; */
   height: 1.5rem;
}

.nav-search {
   display: flex;
   flex-direction: row;
   height: 35px;
   line-height: 1rem;
   width: 300px;
   margin-left: 2rem;
}

.nav-search input {
   height: 35px;
   line-height: 1rem;
   border-radius: 8px 0 0 8px;
}

.nav-search button {
   border-radius: 0 8px 8px 0;
   text-align: center;
   padding: 0 12px !important;
   font-size: 14px;
}

.ajuste-home {
   margin-top: 30px;
   padding-bottom: 30px;
}

.demonstration {
   display: flex;
   justify-content: center;
   width: 50%;
   margin-top: -70px;
}

/* .demonstration a {
   margin-left: 50px;
} */

@media screen and (max-width: 576px) {
   .title-blog h6 {
      font-size: 24px;
      font-weight: 600;
   }

   .ajuste-home {
      padding: 0 10px !important;
   }

   .ajuste-home .image {
      margin-top: 20px;
   }

   .ajuste-home img {
      width: 80% !important;
   }
}

.font-weight-bold {
   font-weight: 700 !important;
}

.conheca-class {
   vertical-align: baseline;
   display: flex;
   box-sizing: border-box;
   width: 560px;
   background-color: rgba(0, 0, 0, 0);
   border-radius: 0px;
   color: rgb(51, 51, 51);
   flex-direction: column;
   height: 436.237px;
   min-height: 50px;
   padding: 20px 10px 0 10px;
}

.panorama {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   /* padding: 0 60px; */
   margin: 50px 0;
}

.plataforma {
   display: flex;
   flex-direction: column;
   box-sizing: border-box;
   color: rgb(51, 51, 51);
   padding: 0 30px;
}

.plataforma h2 {
   font-family: Montserrat, sans-serif;
   margin-bottom: 30px;
   font-size: 32px;
   vertical-align: baseline;
   font-weight: 700 !important;
   box-sizing: border-box;
   color: var(--primary);
   line-height: 46px;
}

.conheca-class p {
   font-family: Montserrat, sans-serif;
   vertical-align: baseline;
   box-sizing: border-box;
   line-height: 23px;
   color: #333333;
}

.conheca-class h2 {
   font-family: Montserrat, sans-serif;
   margin-bottom: 30px;
   font-size: 36px;
   vertical-align: baseline;
   font-weight: 700 !important;
   box-sizing: border-box;
   color: var(--primary);
   line-height: 46px;
   max-width: 500px;
}

.conheca-class strong {
   font-weight: 700;
}

.conheca-class p {
   font-family: Montserrat, sans-serif;
   margin: 0px;
   vertical-align: baseline;
   box-sizing: border-box;
   line-height: 23px;
   max-width: 470px;
   color: #333333;
}

.conheca-image {
   width: 420px;
   padding: 0px 10px 40px 10px;
   vertical-align: baseline;
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
   height: 436.237px;
   min-height: 50px;
   justify-content: center;
}

.conheca-image img {
   vertical-align: middle;
   box-sizing: border-box;
   border-radius: 0px;
   max-width: 100%;
   width: 360px;
   margin-top: -40px;
}

.conheca-image-big {
   margin-top: -150px !important;
}

.conheca-img-big {
   width: 400px !important;
}

/*--------------------------------------------------------------
# Módulos
--------------------------------------------------------------*/
.specials {
   overflow: hidden;
   margin-top: 100px;
}

.specials .nav-tabs {
   border: 0;
}

.specials .nav-link {
   border: 0;
   padding: 12px 15px 12px 0;
   transition: 0.3s;
   color: #433f39;
   border-radius: 0;
   border-right: 2px solid #e8e7e4;
   font-weight: 600;
   font-size: 15px;
   padding-bottom: 3px;
}

.specials .nav-link:hover {
   color: var(--primary);
}

.specials .nav-link.active {
   color: var(--primary);
   /* border-color: var(--primary); */
   border-bottom: 3px var(--primary) solid;
}

.specials .tab-pane.active {
   animation: fadeIn 0.5s ease-out;
}

.specials .details h3 {
   font-size: 22px;
   font-weight: 600;
   margin-bottom: 20px;
   color: var(--primary);
}

.specials .details li {
   color: #777777;
   font-size: 15px;
}

.specials .details p:last-child {
   margin-bottom: 0;
}

.modulos {
   padding: 0 12px;
}

.modulos-plataforma {
   max-width: 500px;
}

.modulos-flexiveis {
   display: flex;
   justify-content: center;
   margin-top: 20px;
}

.modulos-flexiveis p {
   font-size: 18px;
}

.tab-pane p {
   margin-bottom: 5px;
}

.tab-pane img {
   margin-top: -50px;
   width: 80%;
}

.principais-dores {
   display: flex;
   flex-direction: row;
   justify-content: center;
   justify-items: center;
}

.implementacao {
   display: flex;
   flex-direction: row;
   justify-content: center;
   justify-items: center;
   gap: 20px;
   margin-top: 40px;
   padding-bottom: 30px;
}

.implementacao div {
   max-width: 260px;
   max-height: 270px;
}

.cases {
   display: flex;
   flex-direction: row;
   justify-content: center;
   gap: 20px;
}

/* .implementacao div:last-child {
   width: 300px !important;
   max-width: 300px;
   max-height: 300px;
   height: 300px;
   margin-top: -30px;
} */

.implementacao img {
   width: 100%;
   border-radius: 15px;
}

.principais-dores img {
   width: 85%;
   border-radius: 15px;
}

.principais-dores img:hover {
   scale: 1.03;
   transition: ease-in 0.5s;
}

.principais-dores div {
   max-width: 300px !important;
   width: 25%;
}

.more-funcionaliades {
   margin-top: 50px !important;
   /* background-image: url("../assets/img/modulos/bg_modulos.png");
   background-repeat: no-repeat;
   height: 500px;
   background-size: contain; */
}

.more-funcionaliades img {
   border-radius: 10px;
   max-width: 380px;
}

.solution {
   width: 80% !important;
   /* border-radius: 15px !important; */
}

.retangulo {
   width: 45% !important;
   padding: 20px;
   border-radius: 5px;
   background-color: var(--primary);
   box-shadow: rgb(221, 221, 221) 0px 2px 3px 0px inset;
   margin-bottom: 15px;
   align-content: center;
}

.retangulo p {
   margin: 0;
   color: #fff;
   font-weight: 500;
   text-align: center;
}

.px-90 {
   padding-left: 90px;
   padding-right: 90px;
}

.py-6 {
   padding-bottom: 4rem !important;
   padding-top: 4rem !important;
}

@media (max-width: 768px) {
   .specials .nav-link {
      border: 0;
      padding: 15px;
   }

   .cta-index-new {
      flex-direction: column !important;
   }

   .cta-index-new p {
      font-size: 0.9rem !important;
      margin-left: 0 !important;
      padding: 0;
   }

   .cta-index-new .btn-cta {
      margin: 20px 0 0 0 !important;
      width: 100%;
      text-align: center;
   }

   .cases {
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 20px;
   }

   .conheca-image {
      display: flex;
      /* justify-content: center;
      justify-items: center; */
      align-items: center;
      /* border: 1px red solid; */
      width: 100%;
      padding: 0px 10px;
      flex-direction: column;
      height: auto;
      min-height: auto;
      margin-top: -30px;
      padding-bottom: 40px;
   }

   .conheca-image img {
      width: 90% !important;
      object-fit: scale-down;
      margin-top: 0;
      /* border: 1px red solid; */
   }

   .conheca-class h2 {
      font-family: Montserrat, sans-serif;
      margin-bottom: 30px;
      font-size: 22px;
      vertical-align: baseline;
      font-weight: 700 !important;
      box-sizing: border-box;
      color: var(--primary);
      line-height: 28px;
      max-width: 100%;
      padding: 0 10px;
   }

   .conheca-class p {
      font-family: Montserrat, sans-serif;
      vertical-align: baseline;
      box-sizing: border-box;
      line-height: 23px;
      color: #333333;
      padding: 0 10px;
      /* border: 1px red solid; */
   }

   .specials .nav-link.active {
      color: #fff;
      background: var(--primary);
   }

   .tab-pane h3 {
      font-size: 18px !important;
   }

   .specials .details li {
      font-size: 14px !important;
   }

   .specials .section-title {
      padding: 0 10px;
   }

   .modulos {
      padding: 0 10px;
   }

   .modulos-mobile {
      padding: 0 10px 30px 10px;
   }

   .conheca-cta {
      background-image: none;
   }

   .more-funcionaliades {
      margin-top: 0 !important;
      /* border: 1px red solid; */
   }

   .more-funcionaliades img {
      margin-bottom: 2rem;
      max-width: 330px !important;
      width: 330px !important;
   }

   .py-6 {
      padding-top: 2rem !important;
      padding-bottom: 2rem !important;
   }

   .title-conheca h4 {
      font-size: 22px;
   }

   .implementacao {
      display: flex;
      flex-direction: column;
      justify-content: center;
      justify-items: center;
      gap: 10px;
      margin-top: 5px;
      padding-bottom: 30px;
   }

   .implementacao div {
      width: 100%;
      max-width: 100%;
      /* border: 1px red solid; */
      padding: 5px 10px;
      background-color: transparent;
      margin-top: 0 !important;
      margin-bottom: 0 !important;
   }

   /* .implementacao div:last-child {
      width: 100% !important;
      max-width: 100% !important;
      max-height: 300px;
      height: auto;
      padding: 5px 10px;
      margin-top: 0 !important;
      margin-bottom: 0 !important;
   } */

   .implementacao img {
      width: 100%;
      object-fit: scale-down;
      box-shadow: none !important;
   }
}

@media screen and (max-width: 576px) {
   .title-blog h6 {
      font-size: 24px;
      font-weight: 600;
   }

   .solution-rec {
      flex-direction: column !important;
      /* border: 1px red solid; */
      margin-top: 10px;
      padding: 0 20px !important;
   }

   .retangulo {
      width: 100% !important;
      padding: 10px;
   }

   .retangulo p {
      margin: 0;
      color: #fff;
      font-weight: 500;
      font-size: 13px;
   }

   .modulos-flexiveis {
      font-size: 20px;
      line-height: 26px;
   }

   .demonstration {
      display: flex;
      justify-content: center;
      width: 100%;
      margin-top: 50px;
   }

   .principais-dores {
      display: flex;
      flex-direction: column !important;
      justify-content: center !important;
      justify-items: center !important;
   }

   .principais-dores div {
      width: 100% !important;
      padding: 0 !important;
      max-width: 100% !important     ;
      margin-bottom: 30px !important;
   }

   .solution {
      width: 95% !important;
      /* border-radius: 15px !important; */
   }
}