@media (min-width: 1200px) {

  .title {

    font-size: 50px;

  }



  .title-second {

    font-size: 50px;

  }



  .description {

    font-size: 18px;

  }



  .form-overlay {

    width: 60%;

  }



  .row {

    margin: 10px;

    max-width: 1200px;

    display: flex;

  }

}


@media (max-width: 1600px) {
  .faq-page, .faq-body {
    width: 75%;
  }
}

@media (max-width: 1200px) {
  .faq-page, .faq-body {
    width: 100%;
  }
}

/**************************/

/* BELOW 768 (Celulares (Smartphones) - Grandes ) */

/**************************/



@media screen and (max-width: 768px) {

  .mask h1 {

    font-size: 28px;

    line-height: 1;

    margin-top: 0;

  }



  .description {

    font-size: 14px;

    text-align: left;

  }



  .sobre {

    flex-direction: column;

  }



  .imagem img {

    margin: 1rem 0;

  }



  .texto {

    margin-left: 0;

  }



  .row {

    flex-wrap: nowrap;

  }



  .title-description {

    flex-basis: 50%;

    margin-bottom: 0;

    padding-right: 20px;

  }



  .form-overlay {

    flex-basis: 50%;

    padding-left: 20px;

  }



  .projetos-botao {

    margin: auto;

  }



  .sobre .imagem {

    width: 100%;

    height: 100%;

  }

  .sobre .imagem img {

    height: 300px;

  }



  .sobre .texto {
padding-top: 20px;
    padding-left: 0;

  }



  .container-formulario {

    padding: 40px 10%;

  }



  .frase {
    padding: 0;
    padding-bottom: 20px;
}



  .frase-nossa-historia {

    font-size: 30px;

  }



  .subtitulo-nossa-historia {

    font-size: 16px;


  }

}



@media (max-width: 767px) {

  .row {

    grid-template-columns: 1fr;

  }



  .title-second {

    margin-top: 20px;

  }

  .bg-fotos {

    display: none;

  }

}



@media (min-width: 768px) {

  .title {

    margin-bottom: 20px;

  }

}



@media (min-width: 768px) {

  .projetos-galeria {

    grid-template-columns: repeat(2, 1fr);

   

  }

}



@media (min-width: 992px) {

  .projetos-galeria {

    grid-template-columns: repeat(6, 1fr);

  }

}



/* DEPOIMENTOS */



@media (max-width: 768px) {

  .depoimentos {

    grid-template-columns: 1fr;

    gap: 20px;

  }



  .coluna {

    margin-bottom: 20px;

  }

  .faq-container { 
    padding: 40px 5%;
  }

  .testemunhas-depoimentos {
    padding-bottom: 40px;
}

}



@media (min-width: 769px) and (max-width: 992px) {

  .depoimentos {

    grid-template-columns: repeat(2, 1fr);

    gap: 20px;

  }



  .coluna {

    margin-bottom: 20px;

  }

}



@media (min-width: 993px) {

  .depoimentos {

    grid-template-columns: repeat(3, 1fr);

    gap: 20px;

  }



  .coluna {

    margin-bottom: 20px;

  }

}



/**************************/

/* BELOW 1200px (Landscape Tablets) */

/**************************/



@media (max-width: 75em) {

  html {

    /* 9px / 16px  */

    font-size: 56.25%;

  }

  .header {
    padding: 0 3.2rem;
  }

  
  .main-nav-list {
    gap: 3.2rem;
  }

  .main-nav-link:link,
  .main-nav-link:visited {
    font-size: 1rem;
  }


}



/**************************/

/* BELOW 944px (Tablets) */

/**************************/



@media (max-width: 59em) {

  html {
    font-size: 50%;
  }

  .main-nav {
    background-color: rgba(255, 255, 255, 0.3);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(10px);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    transform: translateX(100%);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.5s ease-in;
    /* display: none; */
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
}

  .main-nav-link:link,
  .main-nav-link:visited {
    font-size: 3rem;
  }

  .main-nav-list {
    flex-direction: column;
    gap: 4.8rem;
}

.btn-mobile-nav {
  display: block;
  z-index: 9999;
}



.nav-open .main-nav {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
  transform: translateX(0);
}

.nav-open .icon-mobile-nav[name="menu-outline"] {
  display: none;
}

.nav-open .icon-mobile-nav[name="close-outline"] {
  display: block;
}

.slider {
  width: 100%;
  position: none;
}

.slides {
  width: 800%;
}

.whatsapp-icon-container {
  position: fixed;
  top: 90%;
}

.whatsapp-icon-container {
width: 20%;

}
/* .slide {
  width: 12.5%;
} */

.manual-navigation,
.navigation-auto {
  width: 100%;
}

.manual-btn:not(:last-child),
.navigation-auto div:not(:last-child) {
  margin-right: 10px;
}

.sobre-localizacao {
  display: block;
}

#map {
  width: 100%;
}

.texto {
 margin: 0;
}

.beneficios {
  grid-template-columns: repeat(2, 1fr);
 }

 .contato {
  display: block;
  padding: 10px 10%;
 }

 .contato-esquerdo {
   margin-right: 0; 
}

.contato-whatsapp {
  font-size: 2.4rem;
}

.projetos-titulo {
  font-size: 3.5rem;
}

.footer {
  margin-top: 0x; 
}
}


/**************************/

/* BELOW 704px (Smaller tablets) */

/**************************/



@media (max-width: 44em) {

  .grid--3-cols,

  .grid--4-cols {

    grid-template-columns: repeat(2, 1fr);

  }

}



/**************************/

/* BELOW 544px (Phones) */

/**************************/



@media (max-width: 34em) {

  .grid {

    row-gap: 4.8rem;

  }

}



/* MAIN */



@media screen and (max-width: 768px) {

  .logo {

    height: 65px;

    margin-top: 15px;

  }



  .title {

    font-size: 40px;

    line-height: 45px;

    margin-top: 35%;

  }



  .title-second {

    font-size: 40px;

    line-height: 45px;

  }



  /*   .description {

    font-size: 14px;

    line-height: 20px;

    text-align: center;

  } */



  .custom-form {

    margin-top: 20px;

  }



  .custom-form .btn-primary {

    width: 200px;

  }



  /* FOOTER */

  .container-footer {

    grid-template-columns: 1fr;

    text-align: center;

  }



  .nav-col {

    margin-top: 10px;

  }



  .footer-heading {

    font-size: 16px;

  }



  .footer-descricao {

    font-size: 12px;

  }



  .social-icon {

    font-size: 16px;

  }



  .social-links {

    justify-content: center;

  }

}



@media (max-width: 600px) {

  .custom-form {

    width: 100%; /* faz o formulário ocupar toda a largura disponível */

    box-sizing: border-box; /* inclui padding e border no cálculo da largura total */

    padding: 20px; /* adiciona um pouco de espaço ao redor do formulário */

  }



  .projetos-galeria {

    grid-template-columns: 1fr;

    gap: 10px; /* Adiciona um espaço de 10px entre as imagens. Ajuste este valor conforme necessário. */

    margin: 10px;

  }



  .projetos-galeria-img {

    width: 100%;

    height: 200px; /* Ajuste conforme necessário */

    object-fit: cover;

  }



  /*   .frase-nossa-historia,

  .frase-nossa-historia-embaixo {

    font-size: 40px;

    text-align: center;

  } */



  /*  .subtitulo-nossa-historia {

    font-size: 24px;

    text-align: justify;

  } */



  .botao-orcamento {

    width: 150px;

    height: 40px;

  }

}



/* Estilos para telas com largura de 601px a 900px */

@media (min-width: 601px) and (max-width: 900px) {

  .custom-form {

    width: 75%; /* faz o formulário ocupar 75% da largura disponível */

    box-sizing: border-box; /* inclui padding e border no cálculo da largura total */

    padding: 20px; /* adiciona um pouco de espaço ao redor do formulário */

  }

}



/* Estilos para telas com largura maior que 900px */

@media (min-width: 901px) {

  .custom-form {

    width: 100%; /* faz o formulário ocupar metade da largura disponível */

    box-sizing: border-box; /* inclui padding e border no cálculo da largura total */

    padding: 30px; /* adiciona um pouco de espaço ao redor do formulário */

  }

}



@media (max-width: 768px) {

  .row {

    flex-direction: column;

    margin: 10px auto;

    left: 0px;

  }

  /* 

  .col {

    margin-bottom: 20px;

  } */



  .title {

    font-size: 24px;

  }



  .title-second {

    font-size: 30px;

  }



  .custom-form {

    width: 100%;

  }



  .custom-form .mb-3 {

    margin-bottom: 10px;

  }



  .custom-form .form-control {

    font-size: 16px;

  }



  .custom-form .btn {

    padding: 10px 20px;

    font-size: 16px;

  }

}



@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) {

  /* Insira seus estilos CSS aqui. */

  .mask h1 {

    font-size: 22px;

    line-height: 1;

    margin: 0;

    padding: 0;

    text-align: center;

  }



  .description {

    padding: 0;

    margin: 0;

    font-size: 14px;

    text-align: center;

    margin-top: 5%;

  }



  .col {

    padding: 0;

    margin: 0;

  }



  .form-title {

    font-size: 3rem;

  }

  .form-subtitulo {

    text-align: center;
}



  .logo {

    height: 50px;

    margin-bottom: 5%;

  }

}