header {
  background: rgb(0, 0, 0);
  position: fixed;
  width: 100%;
  padding: 1.3rem 0px;
  z-index: 3000;
}


header .content {
  width: 90%;
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

header nav {
  display: none;
  gap: 2rem;
}

header .tel {
  display: none;
}

header .tel a {
  color: #ffffff;
}


header .tel a:hover {
  text-decoration: underline;
  text-underline-offset: 8px;
}

header .tel a:last-child {
  margin-left: 2rem;
  border-bottom: 1px solid;
  padding-bottom: 2px;
}

@media (min-width: 768px) {
  header .tel {
    display: flex;
  }
}

@media (min-width: 1024px) {
  header nav {
    display: flex;
  }

  header .hamburguer {
    display: none;
  }
}

header nav a {
  color: #fff;
  font-size: 1rem;
  font-weight: 500;
  text-decoration: none;
}


header .logo a {
 font-family: 'Tilt Warp', sans-serif;
      color: #ffffff;
      font-size: 2rem;
      text-decoration: none;
      display: flex;
          align-items: center;
    gap: 8px;
}

header nav .logo {
  font-family: 'Tilt Warp', sans-serif;
      color: #111111;
      font-size: 3rem;
}

.tel {
  color: #fff;
  font-weight: 500;
  font-size: 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.menu-tel {
  display: flex;
  gap: 5rem;
  align-items: center;
}

.tel span {
  padding-top: 4px;
}


.contact .content {
  width: 90%;
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  gap: 4rem;
}

.contact .telefone {
  color:#ffffff;
  text-align: center;
  font-size: 2rem;
  font-size: clamp(2rem, 1.8rem + 1vw, 3rem);
}

@media (min-width: 1024px) {
  .contact .content {
    display: flex;
    align-items: center;
  }
}

.title-form {
  display: grid;
  align-items: center;
  gap: 2rem;
  height: min-content;
  width: 100%;
  padding-top: 5rem !important;
}


.title-form h2 {
  text-align: center;
  text-align: center;
  font-size: 3rem;
  margin-bottom: 2rem;
}

.logo-mobile {
  text-align: center;
  padding-top: 1rem;
}

.logo-desktop {
  display: none;
}

@media (min-width: 1024px) {
  .title-form {
    padding: 4rem;
  }

  .logo-mobile {
    display: none;
  }

  .logo-desktop {
    display: block;
  }
}

.title-form .logo {
  text-align: center;
}

.title-form h3 {
  font-size: 1.5rem;
  margin-bottom: 2rem;
  text-align: center;
}

.form {
  display: grid;
  grid-template-areas:
    'name'
    'business'
    'email'
    'phone'
    'message'
    'submit';
  gap: 1.5rem;
}

@media (min-width: 1024px) {
  .form {
    grid-template-areas:
      'name business'
      'email phone'
      'message message'
      'submit submit';
    grid-template-columns: 1fr 1fr;
  }
}

.form .textarea {
  grid-area: message;
}

.form .textarea textarea {
  min-height: 100px;
  border-radius: 4px;
  font-size: 1.5rem;
  padding: 1rem;
  border: 2px solid #111111;
}

.form .name {
  grid-area: name;
}

.form .business {
  grid-area: business;
}

.form .email {
  grid-area: email;
}

.form .phone {
  grid-area: phone;
}

.form input {
  border: 2px solid #111111;
  background: #fff;
  padding: 1rem;
  border-radius: 4px;
  outline: none;
  width: 100%;
  font-size: 1.5rem;
}

.form .submit {
  grid-area: submit;
}

.form .submit button {
  display: block;
  width: max-content;
  padding: 0.8rem 2.5rem;
  font-size: 1.2rem;
  border-radius: 3px;
  border: 1px solid #5f0af2;
  background: #5f0af2;
  color: #ffff;
  font-weight: bold;
  cursor: pointer;
}

.form .label-input {
  display: grid;
}

.form .label-input label {
  margin-bottom: 0.5rem;
  font-size: 1.2rem;
  font-weight: bold;
}

.contact .info .effect {
  padding: 3rem 0;
  background-color: #111111;
  border-radius: 11px;
  text-align: center;
  display: grid;
  gap: 2rem;
}

.contact .info .effect a {
  text-decoration: none;
  color: #ffffff;
}

@media (min-width: 1024px) {
  .contact .info .effect {
    min-width: 450px;
    margin: 4rem 0;
  }
}

.contact .info .effect h2 {
  color: #ffffff;
  font-size: 2.5rem;
  text-align: center;
  margin-top: 1rem;
}

.contact .info .effect .one-time {
  color: #fff;
    font-size: 1.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    justify-content: center;
}

.contact .info .effect .one-time svg {
  margin-left: -3.3rem;
}

.content .info .details {
  display: grid;
  gap: 1rem;
  justify-content: center;
}

.content .info .details p {
  color: #ffffff;
  font-size: 1.3rem;
}

.content .info .details .included {
  text-align: center;
  color: gray;
  font-size: 1.7rem;
}

.content .info .pay-only {
  max-width: 280px;
  margin: 0 auto;
  color: gray;
  text-align: center;
  margin-top: 5rem;
  line-height: 1.2;
  font-size: 1.5rem;
}

.loader {
  border: 8px solid #f3f3f3;
  border-top: 8px solid #5576fc;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  animation: spin 2s linear infinite;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.controls {
  display: flex;
  padding: 2rem 0;
  justify-content: center;
}

.controls button {
  color: #927afd;
  border: 1px solid #927afd;
  margin-right: 15px;
  padding: 12px 45px 8px 45px;
  border-radius: 30px;
  font-size: 1.2rem;
  font-weight: 700;
  background: #ffffff;
}

.controls button:first-child {
  background-color: #927afd;
  color: #ffffff;
}
.mixitup-control-active {
  background: #393939;
}

.container {
  display: grid;
  gap: 2rem;
  width: 85%;
  max-width: 1200px;
  margin: 0 auto;
}

.confuso {
  display: none;
}

@media (min-width: 425px) {
  .container {
    grid-template-columns: 1fr 1fr;
  }

  .confuso {
    display: block;
  }
}

@media (min-width: 768px) {
  .container {
    grid-template-columns: 1fr 1fr 1fr;
  }
}

@media (min-width: 1024px) {
  .container {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
}

.mix img {
  width: 100%;
  border: 1px solid #282828;
  border-radius: 10px;
}

.demo {
  padding: 5rem 0;
  background-color: #212121;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' width='1920' height='560' preserveAspectRatio='none' viewBox='0 0 1920 560'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1019%26quot%3b)' fill='none'%3e%3cpath d='M1844.664%2c460.551C1874.718%2c461.392%2c1900.627%2c442.983%2c1917.217%2c417.908C1936.108%2c389.355%2c1952.604%2c353.23%2c1935.156%2c323.774C1917.889%2c294.625%2c1878.511%2c293.946%2c1844.664%2c295.426C1814.126%2c296.761%2c1781.75%2c304.405%2c1766.913%2c331.13C1752.388%2c357.293%2c1763.405%2c388.387%2c1778.815%2c414.038C1793.648%2c438.728%2c1815.872%2c459.746%2c1844.664%2c460.551' fill='rgba(50%2c 56%2c 61%2c 0.4)' class='triangle-float3'%3e%3c/path%3e%3cpath d='M1806.524%2c528.343C1845.014%2c526.922%2c1874.113%2c497.483%2c1892.938%2c463.881C1911.253%2c431.189%2c1919.386%2c392.092%2c1901.216%2c359.319C1882.56%2c325.67%2c1844.919%2c310.497%2c1806.524%2c308.021C1762.205%2c305.163%2c1710.978%2c307.555%2c1688.023%2c345.573C1664.615%2c384.34%2c1683.663%2c432.701%2c1708.3%2c470.699C1730.436%2c504.84%2c1765.863%2c529.845%2c1806.524%2c528.343' fill='rgba(50%2c 56%2c 61%2c 0.4)' class='triangle-float2'%3e%3c/path%3e%3cpath d='M54.76 361.44 a118.22 118.22 0 1 0 236.44 0 a118.22 118.22 0 1 0 -236.44 0z' fill='rgba(50%2c 56%2c 61%2c 0.4)' class='triangle-float1'%3e%3c/path%3e%3cpath d='M1281.658%2c181.943C1299.722%2c182.531%2c1313.301%2c167.299%2c1322.049%2c151.483C1330.465%2c136.269%2c1334.317%2c117.834%2c1325.365%2c102.929C1316.621%2c88.37%2c1298.613%2c83.253%2c1281.658%2c84.235C1266.442%2c85.116%2c1253.336%2c94.215%2c1245.918%2c107.529C1238.707%2c120.471%2c1239.163%2c135.64%2c1245.577%2c148.995C1253.135%2c164.731%2c1264.21%2c181.375%2c1281.658%2c181.943' fill='rgba(50%2c 56%2c 61%2c 0.4)' class='triangle-float3'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1019'%3e%3crect width='1920' height='560' fill='white'%3e%3c/rect%3e%3c/mask%3e%3cstyle%3e %40keyframes float1 %7b 0%25%7btransform: translate(0%2c 0)%7d 50%25%7btransform: translate(-10px%2c 0)%7d 100%25%7btransform: translate(0%2c 0)%7d %7d .triangle-float1 %7b animation: float1 5s infinite%3b %7d %40keyframes float2 %7b 0%25%7btransform: translate(0%2c 0)%7d 50%25%7btransform: translate(-5px%2c -5px)%7d 100%25%7btransform: translate(0%2c 0)%7d %7d .triangle-float2 %7b animation: float2 4s infinite%3b %7d %40keyframes float3 %7b 0%25%7btransform: translate(0%2c 0)%7d 50%25%7btransform: translate(0%2c -10px)%7d 100%25%7btransform: translate(0%2c 0)%7d %7d .triangle-float3 %7b animation: float3 6s infinite%3b %7d %3c/style%3e%3c/defs%3e%3c/svg%3e");
}

.vantagens {
  padding: 5rem 0;
  background-color: #8a15ff;
}

.vantagens .blocos .destaque {
background: #0b0c106e;
    border-bottom: 6px solid #640ebb !important;
}

.vantagens .blocos {
  display: grid;
  gap: 2rem;
  width: 90%;
  max-width: 1200px;
  margin: 0 auto;
  height: 100%;
}

@media (min-width: 768px) {
  .vantagens .blocos {
    grid-template-columns: 1fr 1fr;
  }
}

@media (min-width: 1024px) {
  .vantagens .blocos {
    grid-template-columns: 1fr 1fr 1fr;
  }
}

.vantagens .blocos div {
  background: #0b0c10;
  display: grid;
  padding: 2rem;
  color: #ffffff;
  gap: 2rem;
}

.vantagens .blocos h3 {
  font-size: 1.8rem;
  font-weight: 900;
  line-height: 1.3;
}

.vantagens .blocos .icon {
  height: 55px;
}

.vantagens .blocos p {
  max-width: 350px;
  min-height: 96px;
  line-height: 1.5;
  font-size: 1.2rem;
}

.live-demo {
  background-color: #212121;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' width='1440' height='560' preserveAspectRatio='none' viewBox='0 0 1440 560'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1034%26quot%3b)' fill='none'%3e%3cuse xlink:href='%23SvgjsSymbol1041' x='0' y='0'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsSymbol1041' x='720' y='0'%3e%3c/use%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1034'%3e%3crect width='1440' height='560' fill='white'%3e%3c/rect%3e%3c/mask%3e%3cpath d='M-1 0 a1 1 0 1 0 2 0 a1 1 0 1 0 -2 0z' id='SvgjsPath1039'%3e%3c/path%3e%3cpath d='M-3 0 a3 3 0 1 0 6 0 a3 3 0 1 0 -6 0z' id='SvgjsPath1038'%3e%3c/path%3e%3cpath d='M-5 0 a5 5 0 1 0 10 0 a5 5 0 1 0 -10 0z' id='SvgjsPath1036'%3e%3c/path%3e%3cpath d='M2 -2 L-2 2z' id='SvgjsPath1037'%3e%3c/path%3e%3cpath d='M6 -6 L-6 6z' id='SvgjsPath1035'%3e%3c/path%3e%3cpath d='M30 -30 L-30 30z' id='SvgjsPath1040'%3e%3c/path%3e%3c/defs%3e%3csymbol id='SvgjsSymbol1041'%3e%3cuse xlink:href='%23SvgjsPath1035' x='30' y='30' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='30' y='90' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='30' y='150' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1037' x='30' y='210' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='30' y='270' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1038' x='30' y='330' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='30' y='390' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='30' y='450' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='30' y='510' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='30' y='570' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='90' y='30' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='90' y='90' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='90' y='150' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1039' x='90' y='210' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='90' y='270' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='90' y='330' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1039' x='90' y='390' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='90' y='450' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1037' x='90' y='510' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1037' x='90' y='570' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1040' x='150' y='30' stroke='rgba(44%2c 44%2c 44%2c 1)' stroke-width='3'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='150' y='90' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='150' y='150' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='150' y='210' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='150' y='270' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1038' x='150' y='330' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='150' y='390' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='150' y='450' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1039' x='150' y='510' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='150' y='570' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1039' x='210' y='30' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1039' x='210' y='90' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1037' x='210' y='150' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='210' y='210' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1037' x='210' y='270' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='210' y='330' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='210' y='390' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1037' x='210' y='450' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1037' x='210' y='510' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='210' y='570' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1040' x='270' y='30' stroke='rgba(44%2c 44%2c 44%2c 1)' stroke-width='3'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1038' x='270' y='90' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1039' x='270' y='150' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1039' x='270' y='210' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='270' y='270' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1037' x='270' y='330' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1040' x='270' y='390' stroke='rgba(44%2c 44%2c 44%2c 1)' stroke-width='3'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1037' x='270' y='450' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1037' x='270' y='510' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1037' x='270' y='570' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1037' x='330' y='30' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1039' x='330' y='90' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1037' x='330' y='150' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='330' y='210' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='330' y='270' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='330' y='330' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='330' y='390' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1037' x='330' y='450' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='330' y='510' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1039' x='330' y='570' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='390' y='30' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='390' y='90' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='390' y='150' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='390' y='210' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='390' y='270' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='390' y='330' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='390' y='390' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='390' y='450' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1039' x='390' y='510' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1038' x='390' y='570' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='450' y='30' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='450' y='90' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='450' y='150' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1038' x='450' y='210' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='450' y='270' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1037' x='450' y='330' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1038' x='450' y='390' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1038' x='450' y='450' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='450' y='510' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1039' x='450' y='570' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='510' y='30' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1039' x='510' y='90' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1040' x='510' y='150' stroke='rgba(44%2c 44%2c 44%2c 1)' stroke-width='3'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1038' x='510' y='210' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='510' y='270' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='510' y='330' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='510' y='390' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='510' y='450' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='510' y='510' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1037' x='510' y='570' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='570' y='30' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='570' y='90' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='570' y='150' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1038' x='570' y='210' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='570' y='270' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='570' y='330' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1037' x='570' y='390' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1039' x='570' y='450' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1039' x='570' y='510' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='570' y='570' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='630' y='30' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1038' x='630' y='90' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1039' x='630' y='150' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='630' y='210' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1039' x='630' y='270' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1038' x='630' y='330' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1039' x='630' y='390' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1038' x='630' y='450' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1039' x='630' y='510' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='630' y='570' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='690' y='30' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='690' y='90' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='690' y='150' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1040' x='690' y='210' stroke='rgba(44%2c 44%2c 44%2c 1)' stroke-width='3'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1037' x='690' y='270' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='690' y='330' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='690' y='390' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='690' y='450' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1036' x='690' y='510' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3cuse xlink:href='%23SvgjsPath1035' x='690' y='570' stroke='rgba(44%2c 44%2c 44%2c 1)'%3e%3c/use%3e%3c/symbol%3e%3c/svg%3e");
}

.live-demo .content {
  max-width: 1200px;
  margin: 0px auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 5rem 0px;
  border-top: 3px solid rgb(44, 44, 44);
  flex-wrap: wrap;
  justify-content: center;
  text-align: center;
  gap: 5rem;
}

.live-demo .content .cta {
  display: grid;
}

.live-demo .content .cta a {
  border: 2px solid #fff;
  padding: 1rem 6rem;
  color: #ffffff;
  font-weight: 700;
  font-size: 1.5rem;
  text-decoration: none;
  margin: 0 2rem;
}

.live-demo .content .cta a:hover {
  background-color: #ffffff;
  color: #2c2c2c;
}

.live-demo h2 {
  color: #fff;
  font-size: 3rem;
  font-weight: 300;
}

.live-demo p {
  margin-top: 15px;
  color: #ffffff;
  font-size: 1.2rem;
}

.testemunial {
  padding: 5rem 0;
  background-color: #1b1b1b;
}

.testemunial h2 {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 4rem;
  color: #ffffff;
}

.testemunial h3 {
  font-size: 1.5rem;
}
.testemunial p {
  line-height: 1.5;
  font-style: italic;
}

.testemunial .destaque {
  padding: 2.5rem 2rem !important;
  background: #2c2c2c;
}

.testemunial .content {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  gap: 2rem;
  color: #ffffff;
}

@media (min-width: 768px) {
  .testemunial .content {
    grid-template-columns: 1fr 1fr;
  }
}

.testemunial .content .bloco {
  padding: 2rem;
  display: grid;
  gap: 1rem;
  text-align: center;
  height: fit-content;
}

@media (min-width: 768px) {
  .testemunial .content .bloco {
    border-radius: 11px;
  }
}

.testemunial .content .bloco .photo img {
  width: 100px;
  height: 100px;
  margin: 0 auto;
  border-radius: 50%;
  object-fit: cover;
}

/*
.wrap-image {
  position: relative;
  &::before,
  &::after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: -1;
    border: 2px solid yellow;
    transition: all 0.25s ease-out;
  }
  &::before {
    background-color: yellow;
    top: -15px;
    left: -15px;
  }
  &::after {
    bottom: -15px;
    right: -15px;
  }
  &:hover {
    &::before {
      top: 15px;
      left: 15px;
    }
    &::after {
      bottom: 15px;
      right: 15px;
    }
  }
}
*/

.frente {
  background: linear-gradient(#3800e7, #8a15ff);
  font-size: calc(14px + (26 - 14) * ((100vw - 300px) / (1600 - 300)));
  font-weight: 300;
  overflow: hidden;
  color: white;
  text-align: center;
  padding-top: 6rem;
}

@media (min-width: 1024px) {
.frente {
    padding-top: 9rem;
}
}

.main {
  height: 100%;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  position: relative;
  justify-content: center;
  align-items: center;
  z-index: 200;
}

.main:after {
  top: 0;
  left: 30;
  height: 10em;
  width: 10em;
  border-radius: 10em;
  background: linear-gradient(#3800e7, #8a15ff);
  -webkit-animation: gradient-fade-alt 6s ease-in-out 3s infinite alternate;
  animation: gradient-fade-alt 6s ease-in-out 3s infinite alternate;
}

.main__text-wrapper {
  position: relative;
}

.main__text-wrapper .principal {
  width: 90%;
  margin: 0 auto;
}

@media (min-width: 1024px) {
  .main__text-wrapper .principal {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    width: auto;
    max-width: 1200px;
    padding: 0 8px;
  }
}

.main__text-wrapper .principal .title-image {
  text-align: left;
  display: grid;
  height: min-content;
  z-index: 2000;
  gap: 1.5rem;
}

.main__text-wrapper .principal .title-image h2 {
  font-size: 1.5rem;
  line-height: 1.8;
}

.title-image span {
  font-weight: 400;
  font-style: italic;
  font-size: 1.2rem;
}

.principal .image {
  display: none;
}

@media (min-width: 1024px) {
  .principal .image {
    display: block;
    z-index: 100;
    text-align: right;
  }
}

.principal .image img {
    width: 100%;
      max-width: 400px;
      border-radius: 37px;
      border: 8px solid #000;
}

.vantagens .line {
  width: 70px;
  height: 2px;
  background-color: #8a15ff;
}

.main__text-wrapper h1 {
  font-size: 4rem;
  font-size: clamp(4rem, 3.4rem + 3vw, 7rem);
}

.arrow {
  z-index: 50;
  opacity: 0.5;
  position: absolute;
}
.arrow--top {
  top: 0;
  left: -5em;
}
.arrow--bottom {
  bottom: 0;
  right: 3em;
}

.circle {
  transform: translate(50%, -50%) rotate(0deg);
  transform-origin: center;
}
.circle--ltblue {
  height: 20em;
  width: 20em;
  border-radius: 20em;
  background: linear-gradient(#15e0ff, #3800e7);
}

.backdrop {
  position: absolute;
  width: 100vw;
  height: 100vh;
  display: block;
  background-color: pink;
}

.dotted-circle {
  display: none;
}

@media (min-width: 768px) {
  .dotted-circle {
    position: absolute;
    top: 0;
    right: 0;
    opacity: 0.3;
    -webkit-animation: rotation 38s linear infinite;
    animation: rotation 38s linear infinite;
  }
}


.draw-in {
  stroke-dasharray: 1000;
  stroke-dashoffset: 10;
  -webkit-animation: draw 15s ease-in-out alternate infinite;
  animation: draw 15s ease-in-out alternate infinite;
}

@-webkit-keyframes draw {
  from {
    stroke-dashoffset: 1000;
  }
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes draw {
  from {
    stroke-dashoffset: 1000;
  }
  to {
    stroke-dashoffset: 0;
  }
}
.item-to {
  -webkit-animation-duration: 10s;
  animation-duration: 10s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  transform-origin: bottom;
}

.bounce-1 {
  -webkit-animation-name: bounce-1;
  animation-name: bounce-1;
  -webkit-animation-timing-function: ease;
  animation-timing-function: ease;
}

.bounce-2 {
  -webkit-animation-name: bounce-2;
  animation-name: bounce-2;
  -webkit-animation-timing-function: ease;
  animation-timing-function: ease;
}

.bounce-3 {
  -webkit-animation-name: bounce-3;
  animation-name: bounce-3;
  -webkit-animation-timing-function: ease;
  animation-timing-function: ease;
}

@-webkit-keyframes bounce-1 {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(50px);
  }
  100% {
    transform: translateY(0);
  }
}

@keyframes bounce-1 {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(50px);
  }
  100% {
    transform: translateY(0);
  }
}
@-webkit-keyframes bounce-2 {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-30px);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes bounce-2 {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-30px);
  }
  100% {
    transform: translateY(0);
  }
}
@-webkit-keyframes bounce-3 {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(30px);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes bounce-3 {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(30px);
  }
  100% {
    transform: translateY(0);
  }
}
@-webkit-keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
@keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes gradient-fade {
  from {
    transform: translate(10%, -10%) rotate(0deg);
  }
  to {
    transform: translate(50%, -50%) rotate(360deg);
  }
}
@keyframes gradient-fade {
  from {
    transform: translate(10%, -10%) rotate(0deg);
  }
  to {
    transform: translate(50%, -50%) rotate(360deg);
  }
}
@-webkit-keyframes gradient-fade-alt {
  from {
    transform: translate(-20%, 20%) rotate(0deg);
  }
  to {
    transform: translate(-60%, 60%) rotate(360deg);
  }
}
@keyframes gradient-fade-alt {
  from {
    transform: translate(-20%, 20%) rotate(0deg);
  }
  to {
    transform: translate(-60%, 60%) rotate(360deg);
  }
}

.principal .cta {
  padding: 0.6rem 2rem;
  display: inline-block;
  background: #2ccbc4;
  z-index: 2000;
  color: #ffffff;
  font-weight: bold;
  text-decoration: none;
  border-radius: 3px;
  font-size: 1.5rem;
font-size: clamp(1.5rem, 1.4rem + 0.5vw, 2rem);
}

.float {
  position: fixed;
  width: 60px;
  height: 60px;
  bottom: 10px;
  right: 10px;
  background-color: #25d366;
  color: #fff;
  border-radius: 50px;
  text-align: center;
  font-size: 30px;
  box-shadow: 2px 2px 3px #00000054;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
}

.my-float {
  margin-top: 16px;
}

.about .text-image {
  width: 90%;
  max-width: 1200px;
  margin: 0 auto;
}
.about .text-image .text {
  display: grid;
  gap: 2rem;
  height: min-content;
}

.about .text-image img {
  width: 100%;
  border: 3px solid #111111;
  padding: 1rem;
}

.about {
padding: 5rem 0;
    background: #f6f6f6;
    margin-top: 5rem;
}

.about h2 {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 4rem;
  color: #957afd;
  font-weight: 900;
}

.about h3 {
  text-align: center;
  font-size: 2rem;
  color: #111111;
}

.about p {
  line-height: 1.5;
  font-size: 1.3rem;
}

.about .text-image {
  display: grid;
  gap: 5rem;
  align-items: center;
}

@media (min-width: 1024px) {
  .about .text-image {
    grid-template-columns: 1fr 1fr;
  }
}

#menu-mobile {
  overflow: auto;
  display: none;
  position: fixed;
  right: 0;
  top: 0;
  height: 100%;
  background: #fff;
  width: 80%;
  max-width: 300px;
  border-left: 1px solid #eaeaea;
  z-index: 5000;
}

#menu-mobile nav {
  margin-top: 50px;
}

#menu-mobile nav li {
  list-style-type: none;
    text-align: center;
    border-top: 1px solid #36383812;
}

#menu-mobile .telefone {
  text-align: center;
  padding: 1rem 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background: #eaeaea;
}

#menu-mobile .telefone a {
  text-decoration: none;
  font-weight: bold;
  font-size: 1.3rem;
  color: #000000;
}

#menu-mobile nav li a {
  font-size: 1.3rem;
  color: #111111;
  text-decoration: none;
  padding: 1rem;
  display: block;
}

#menu-mobile nav li:last-child {
  margin: 0 !important;
}

#menu-mobile nav li:last-child a {
  padding: 1rem !important;
}

#close-menu {
  position: absolute;
  left: 6px;
  top: 6px;
  text-align: right;
  background-color: #ffffff;
  z-index: 150;
}

#close-menu button {
  width: 40px;
    height: 40px;
    border: none;
    background-image: url(/dental/assets/img/close.svg);
    background-color: #fff;
    background-repeat: no-repeat;
    cursor: pointer;
}

#thx {
  background: #ffd70066;
  padding: 4rem;
  display: flex;
  gap: 1rem;
  border-radius: 2px;
  align-items: center;
  justify-content: space-between;
}

#thx p {
  margin: unset;
  color: #424242;
  font-size: 2rem;
  text-align: center;
}

#error {
  background: red;
  padding: 4rem;
  display: flex;
  gap: 1rem;
  border-radius: 2px;
  align-items: center;
  justify-content: space-between;
}

#error p {
  margin: unset;
  color: #ffffff;
  font-size: 2rem;
  text-align: center;
}

#error a {
  text-decoration: underline;
  color: #ffffff;
  font-weight: bold;
}

.title-demo {
  text-align: center;
  margin-bottom: 4rem;
  font-size: 2.5rem;
  color: #ffff;
}

.pay-only {
  background: #3f1274;
  width: fit-content;
  padding: 10px;
  font-size: 2rem;
}

.faq {
  padding-top: 5rem;
}

.faq h2 {
  margin-bottom: 4rem;
        text-align: center;
        font-size: 2.5rem;
}

details {
  width: 90%;
  min-height: 5px;
  margin: 0 auto;
  position: relative;
  font-size: 1.3rem;
  border: 1px solid rgba(0, 0, 0, .1);
  border-radius: 15px;
  box-sizing: border-box;
  transition: all .3s;
}

@media (min-width: 768px) {
  details {
    width: 75%;
  }
}

details+details {
  margin-top: 20px;
}

details[open] {
  min-height: 50px;
  background-color: #f6f7f8;
  box-shadow: 2px 2px 20px rgba(0, 0, 0, .2);
}

details p {
  color: #1e1e1e;
  font-weight: bold;
  line-height: 1.5;
}

summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: 500;
  cursor: pointer;
  padding: 3rem;
}

.anwser {
  padding: 3rem;
  padding-top: 0;
  margin-top: -1.5rem
}
summary:focus {
  outline: none;

}

summary:focus::after {
  content: "";
  height: 100%;
  width: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  box-shadow: 0 0 0 5px rebeccapurple;
  border-radius: 15px;
}

summary::-webkit-details-marker {
  display: none
}

.control-icon {
  fill: rebeccapurple;
  transition: .3s ease;
  pointer-events: none;
}

.control-icon-close {
  display: none;
}

details[open] .control-icon-close {
  display: initial;
  transition: .3s ease;
}

details[open] .control-icon-expand {
  display: none;
}