* {
  padding: 0;
  margin: 0;
}

body {
  background-color: #fff;
  font-family: "Inter", sans-serif;
}

.navbar {
  z-index: 1000;
  position: absolute;
  width: 100%;
}






.navBarContent {
  padding: 0 150px;
  padding-top: 20px;
}

.firstLine {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 0.7px solid #fff;
  padding-bottom: 10px;
}

.firstLine a {
  text-decoration: none;
  color: #fff;
  font-weight: 500;
  font-size: 15px;
}

.socialBtns {
  display: flex;
  align-items: center;
  gap: 10px;
}

.secondLine {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 0;
}

.navMenu {
  display: flex;
  align-items: center;
  gap: 40px;
}

.logo img {
  width: 250px;
}
.navLinks {
  display: flex;
  align-items: center;
  gap: 30px;
}

.navMenu .navLinks a {
  text-decoration: none;
  color: #fff;
  font-weight: 400;
  font-size: 18px;
}

.cdcCta {
  display: flex;
  align-items: center;
  background-color: #cfbe70;
  color: #fff;
  text-decoration: none;
  font-weight: 500;
  font-size: 18px;
  text-transform: uppercase;
  padding: 13px 35px;
  border-radius: 5px;
}

.banner {
  background-image: url(https://matheusborba.com.br/Combu/mtConNovo/assets/img/Hero.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 115vh;
  display: flex;
  align-items: center;
  justify-content: end;
}

.bannerContent {
  width: 565px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0 150px;
  color: #fff;
  gap: 40px;
}

.firstText {
  display: flex;
  align-items: center;
  gap: 20px;
}

.barText {
  height: 180px;
  width: 10px;
  background-color: #fff;
}

.firstText h1 {
  font-size: 38px;
  font-weight: 800;
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}

.secondText {
  font-size: 18px;
  font-weight: 400;
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
  padding-left: 20px;
}

.ctaBanner {
  text-decoration: none;
  color: #fff;
  font-weight: 700;
  font-size: 21px;
  text-transform: uppercase;
  padding: 13px 43px;
  background-color: #cfbe70;
  border-radius: 5px;
}

.servicesContent {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 50px 150px;
  gap: 20px;
}

.servicesCard {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  width: 270px;
  height: 390px;
  box-shadow: 0 3px 20px rgba(0, 0, 0, 0.3);
  border-radius: 10px;
  padding: 13px;
  gap: 36px;
}

.card-1,
.card-4 {
  margin-bottom: 30px;
}

.servicesCardIcon {
  background-color: #cfbe70;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 90px;
  height: 90px;
  border-radius: 50%;
}

.servicesCardIcon i {
  font-size: 43px;
  color: #fff;
}

.servicesTitle h1 {
  font-size: 21px;
  font-weight: 400;
  color: #3b3a39;
  text-transform: uppercase;
  text-align: center;
}

.servicesText p {
  font-size: 16px;
  font-weight: 300;
  color: #000;
  text-align: center;
}

.servicesCardCta {
  font-size: 16px;
  font-weight: 400;
  color: #fff;
  text-decoration: none;
  background-color: #cfbe70;
  padding: 8px 29px;
  border-radius: 5px;
  text-transform: uppercase;
}

.about {
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 50px 150px;
  gap: 55px;
}

.aboutText {
  max-width: 483px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 30px;
}

.aboutTitle {
  display: flex;
  align-items: center;
  gap: 20px;
}

.aboutTitleBar {
  height: 100px;
  width: 10px;
  background-color: #cfbe70;
}

.aboutTitle h1 {
  font-size: 25px;
  font-weight: 500;
  color: #000;
}

.aboutTitle h1 span {
  font-size: 35px;
  font-weight: 900;
  color: #cfbe70;
  text-transform: uppercase;
}

.aboutDescription {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.aboutDescription p {
  font-size: 18px;
  font-weight: 400;
  color: #000;
}

.aboutCTA {
  text-decoration: none;
  color: #fff;
  font-weight: 500;
  font-size: 18px;
  text-transform: uppercase;
  padding: 13px 35px;
  background-color: #cfbe70;
  border-radius: 5px;
}

.cdc {
  background-image: url(https://matheusborba.com.br/Combu/mtConNovo/assets/img/CDCBanner.png);
  background-size: cover;
  background-repeat: no-repeat;
  height: 488px;
  margin-top: 100px;
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 0 150px;
  overflow: hidden;
}

.cdc img {
  width: 460px;
}

.cdcBannerContent {
  max-width: 422px;
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.cdcTitle {
  display: flex;
  align-items: center;
  gap: 20px;
}

.cdcBar {
  height: 80px;
  width: 10px;
  background-color: #fff;
}

.cdcTitle h1 {
  font-size: 25px;
  font-weight: 900;
  color: #fff;
}

.cdcDescription p {
  font-size: 19px;
  font-weight: 400;
  color: #fff;
}

.cdcCTA {
  text-decoration: none;
  color: #b6a455;
  font-weight: 600;
  font-size: 19px;
  text-transform: uppercase;
  padding: 12px 47px;
  background-color: #fff;
  border-radius: 5px;
  width: 210px;
}

.contato {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0px 150px;
}
.espacobaixo100{
    margin-bottom: 100px;
}
.espacocima100{
    margin-top: 100px;
}

.contatoContainer {
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 50px 20px;
    gap: 20px;
    width: 1400px;

  height: 263px;
  border-radius: 20px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
  margin-top: -50px;
  background-color: #fff;
}

.contatoContent {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 50px;
}

.contatoTitle {
  display: flex;
  align-items: center;
  gap: 20px;
  max-width: 430px;
}

.contatoBar {
  height: 80px;
  width: 10px;
  background-color: #cfbe70;
}

.contatoTitle h1 {
  font-size: 30px;
  font-weight: 600;
  color: #b6a455;
}

.contatoBTNS {
  display: flex;
  align-items: center;
  gap: 50px;
}

.contatoCTA {
  font-size: 15px;
  font-weight: 500;
  color: #fff;
  text-decoration: none;
  background-color: #cfbe70;
  padding: 11px 18px;
  border-radius: 5px;
  text-transform: uppercase;
}

.contatoPhone {
  display: flex;
  align-items: center;
  gap: 22px;
}

.contatoPhone i {
  font-size: 25px;
  color: #cfbe70;
  border-radius: 50%;
  border: 1px solid #cfbe70;
  padding: 15px;
}

.contatoPhoneDescription {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}

.contatoPhoneDescription h1 {
  font-size: 23px;
  font-weight: 500;
  color: #b6a455;
}

.contatoPhoneDescription p {
  font-size: 17px;
  font-weight: 400;
  color: #b6a455;
}


.owners {
  background-image: url(https://matheusborba.com.br/Combu/mtConNovo/assets/img/owners.png);
  background-size: cover;
  background-repeat: no-repeat;
  height: 140%;
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 0 150px;
  margin-top: 180px;
  padding-bottom: 50px;
  padding-top: 50px;
}

.ownersContent {
  display: flex;
  flex-direction: column;
  align-items: start;
  justify-content: center;
  gap: 30px;
  max-width: 467px;
}

.ownersTitle {
  display: flex;
  align-items: center;
  gap: 20px;
}

.ownersBar {
  height: 50px;
  width: 5px;
  background-color: #fff;
}

.ownersTitle h1 {
  font-size: 25px;
  font-weight: 800;
  color: #fff;
  text-transform: uppercase;
}

.ownersDescription {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.fundador {
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 10px;
}

.fundador h1 {
  font-size: 20px;
  font-weight: 800;
  color: #fff;
}

.fundador p {
  font-size: 16px;
  font-weight: 400;
  color: #fff;
}

.footer {
  background-color: #151515;
  padding: 50px 150px 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.footerContainer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 50px;
      align-items: start;
}

.footerCardTitle {
  display: flex;
  align-items: center;
  gap: 20px;
}

.footerContato {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
}

.footerCardBar {
  height: 30px;
  width: 5px;
  background-color: #b6a455;
}
.footerCardBar:hover{
    background-color: #fff;
}
.footerCardTitle h1 {
  font-size: 20px;
  font-weight: 800;
  color: #fff;
  text-transform: uppercase;
}

.footerContato a {
  text-decoration: none;
  color: #fff;
  font-weight: 400;
  font-size: 16px;
}

.footerContato a i {
  font-size: 20px;
  color: #b6a455;
  margin-right: 10px;
}

.footerServices {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.footerServices a {
  text-decoration: none;
  color: #fff;
  font-size: 16px;
  font-weight: 400;
}

.footerServices a i {
  font-size: 20px;
  color: #b6a455;
  margin-right: 10px;
}

.footerBtns {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.footerSocialBtns{
  display: flex;
  align-items; center;
  gap: 20px;
  margin-top: 20px;
}

.footerSocialBtns a{
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  border: 1px solid #b6a455;
  border-radius: 50%;
  text-decoration: none;
  color: #b6a455;
  font-size: 20px;
      transition: all .6s ease-out;

}
.footerSocialBtns a:hover{
    background: #b6a455;
    color: #151515;
    transition: all .6s ease-out;
}
.footerCDC a{
  text-decoration: none;
}

.aboutPageFooter{
  margin-top: 100px;
}


.aboutBanner {
    background-image: url(https://matheusborba.com.br/Combu/mtConNovo/assets/img/aboutBanner.png);
    width: 100%;
    height: 700px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-repeat: no-repeat;
  background-position: bottom center;
    background-size: cover;
}

.aboutBanner h1{
  font-size: 45px;
  font-weight: 800;
  color: #fff;
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}

.aboutPageAbout{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 100px;
  padding: 50px 150px 0 150px;
}

.aboutContent{
  max-width: 530px;
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 30px;
}

.contentTitle{
  display: flex;
  align-items: center;
  gap: 20px
}

.contentTitle h1{
  font-size: 35px;
  font-weight: 800;
}

.contentTitle h1 span{
  color: #b6a455;
}

.contentBar{
  height: 100px;
  width: 10px;
  background-color: #b6a455;
}

.aboutText p{
  font-size: 18px;
  font-weight: 400;
}

.aboutContentCTA{
  text-decoration: none;
  color: #fff;
  background-color: #b6a455;
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
  padding: 13px 43px;
  border-radius: 5px;
}

.copy{
  text-align: center;
  margin-top: 50px;
  border-top: solid 1px #222;
  width: 100%;
}

.copy h1{
  font-size: 15px;
  font-weight: 300;
  color: #fff;
  margin: 5px 0;
  margin-top: 10px;
}

.contatosContainer{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 100px;
  padding: 60px 150px;
}

.contatoCards{
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.contatoCard{
  display: flex;
  flex-direction: column;
  gap: 10px;
  box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
  padding: 20px 71px 20px 20px;
  border-radius: 10px;
  word-break: auto-phrase;
}

.contatoCard h1{
  font-size: 21px;
  font-weight: 700;
  color: #b6a455;
}

.contatoCard a{
  text-decoration: none;
  color: #000;
  font-size: 15px;
  font-weight: 400;
}

.contatoCard a i{
  margin-right: 10px;
  color: #b6a455;
}

.servicesContainer{
  display: flex;
  flex-direction: column;
  padding: 50px 150px;
  gap: 50px;
}

.serviicesContainerTitle{
  display: flex;
  align-items: center;
  gap: 20px;
}

.serviicesContainerTitle h1{
  font-size: 25px;
  font-weight: 800;
}

.sectionBar{
  height: 90px;
  width: 10px;
  background-color: #b6a455;
}

.departTitle h1{
  font-size: 25px;
  font-weight: 800px
}

.departContainer{
  display: flex;
  align-items: center;
  gap: 20px;
}






/** CSS ADICIONAL **/
/** ajustes mobile */





@media(max-width: 767px){
    .logo img {
  width: 170px;
}
    .navBarContent {
    padding: 0 30px;
    padding-top: 20px;
}
.servicesContent .servicesCard {
    height: 300px;
}
.banner {
  background-image: url(https://matheusborba.com.br/Combu/mtConNovo/assets/img/hero600.png);
}

.banner {
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: start;
    justify-content: end;
    padding-top: 180px;
}
.bannerContent {
    width: 750px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0 30px;
    color: #fff;
    gap: 40px;
}
.barText {
    height: 180px;
    width: 5px;
    background-color: #fff;
}
.firstText h1 {
    font-size: 28px;
    font-weight: 800;
    text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}
}


/* MENU HAMBURGUER INICIO */
/* estilo do nav */
.navMenu {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}

/* links desktop */
.navLinks {
  display: flex;
  gap: 20px;
}

/* botão hamburguer */
.hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 30px;
  height: 22px;
  background: none;
  border: none;
  cursor: pointer;
}

.hamburger span {
  display: block;
  height: 3px;
  width: 100%;
  background: #333;
  border-radius: 3px;
}
.maps{
            width: 601px;
            height: 453px;
            
        }
/* responsivo */
@media (max-width: 600px) {
    .aboutBanner h1 {
    padding: 20px;
    }
    .servicesContainer {
    padding: 30px 10px;
}
    .logo img {
  width: 150px;
}
    .cdcCta {
    display: none;
    }
.footer {
    padding: 10PX;
    display: BLOCK;
    flex-direction: column;
}
.footerContainer {
        display: BLOCK;
        align-items: center;
    }
        .footer {
        padding: 10PX;
        margin-top: 30px;
        display: BLOCK;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }


.footerCardBar{
    display: none;
}

.footerContato {
    display: flex
;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}


.footerCardTitle {
    display: block;
    align-items: center;
    gap: 20px;
    margin-top: 30px;
}
.footerSocialBtns {
    display: flex;
    gap: 20px;
    margin-top: 20px;
    align-items: center;
    justify-content: center;
}
    .cdcCTA {
    width: 118px;
    }
        .contatoContainer {
        margin-top: 94px;
        align-items: center;
        display: block;
        align-items: center;
        justify-content: space-around;
        padding: 10px;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.0001);
        width: auto;
        text-align: center;
        justify-content: center;
        align-items: center;
        align-self: center;
    }
    .contatoContent {
    display: block;
    flex-direction: column;
    align-items: flex-start;
    gap: 50px;
    margin-top: 20px;
}
    .contatoBTNS {
        display: block;
        align-items: center;
        gap: 50px;
        margin-top: 30px;
    }
.contatoPhone {
    display: flex;
    align-items: center;
    gap: 22px;
    margin-top: 30px;
}

.contato {
    display: block;
    align-items: start;
    justify-content: center;
    padding: 0;
}
    .cdc img {
        width: 350px;
        margin-left: -280px;
        bottom: 0;
        position: absolute;
        bottom: 0;
                left: 150px;
    }
.cdcTitle h1 {
    font-size: 21px;
    font-weight: 900;
    color: #fff;
}
.cdcBar {
    height: 50px;
    width: 5px;
    background-color: #fff;
}
    .cdcBannerContent {
        max-width: 220px;
        display: flex;
        flex-direction: column;
        gap: 30px;
        margin-left: 20px;        width: 220px;
        /* background-color: rgba(0, 0, 0, 0.4); */
        padding: 10px;
        box-shadow: black;
        border-radius: 20px;
    }
.cdcDescription p {
    font-size: 14px;
    font-weight: 400;
    color: #fff;
}

      .about {
    display: block;
    padding: 50px 50px;
}
.aboutImage{
    margin-top: 30px
}
.aboutImage img{
        max-width: 75vw;
    }
    .firstLine a {
    text-decoration: none;
    color: #fff;
    font-weight: 500;
    font-size: 10px;
}
        .firstText h1 {
        font-size: 21px;
        font-weight: 800;
        text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
    }
        .barText {
        height: 150px;
        }
        .ctaBanner {
    margin-top: 10px;
        }
    .bannerContent {
        gap: 10px;
    }
    
    /* menu responsivo */
    .navLinks a {
    color: #000 !important;   /* força preto */
    text-decoration: none;
    font-size: 16px;
    display: block;           /* garante clique fácil */
    padding: 8px 0;
  }

  .navLinks {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    flex-direction: column;
    background: #fff;
    border: 1px solid #ddd;
    padding: 10px;
    gap: 10px;
    width: 200px;
    z-index: 1000;            /* sobe acima de header/background */
  }

  .navLinks.active {
    display: flex;
  }

  .hamburger {
    display: flex;
  }
      /* teste */
    .aboutPageAbout {
    display: block;
    }
    .owners {
        display: block;
            padding: 30px 60px;
    }
        .contato {
        display: block;
        align-items: center;
        justify-content: center;
        padding: 20px 50px;
        margin-top: 0;
        margin-bottom: 200px;
        }
        
        
        
        .contatosContainer {
    padding: 60px 60px;
}
.ownersContent {
    margin-bottom: 40px;
}
    .aboutContent{
        margin-bottom: 30px;
    }
    .contentTitle h1 {
    font-size: 25px;
    }
    .aboutPageAbout{
            padding: 50px 50px 0 50px;
    }
    .aboutPageAbout img{
        max-width: 74vw;
    }
              .contatosContainer {
        padding: 60px 60px;
        display: block;
        }
        .map{
            margin-bottom: 30px;
        }
        
        .maps{
            width: 80vw;
            height: auto;
            
        }
}

@media (min-width: 601px) and (max-width: 768px) {
    /* teste */
    .aboutPageAbout {
    display: block;
    }
    .owners {
        display: block;
    }
     
        .contatosContainer {
        padding: 60px 60px;
        display: block;
        }
        .map{
            margin-bottom: 30px;
        }
.ownersContent {
    margin-bottom: 40px;
}
    .aboutContent{
        margin-bottom: 30px;
    }
     .cdcCta {
    display: none;
    }
    .about {
    display: block;
    padding: 50px 50px;
}
.aboutImage{
    margin-top: 30px;
}

.cdc img {
    width: 460px;
    margin-left: -200px;
}
.contatoContainer{
    margin-top: 100px;
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 10px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.0001);
   width: 90vw;
}
.contatoBTNS {
    display: block;
    align-items: center;
    gap: 50px;
}
.contatoPhone {
    display: flex;
    align-items: center;
    gap: 22px;
    margin-top: 30px;
}

.contato {
    display: block;
    align-items: start;
    justify-content: center;
    padding: 0;
}

.footer {
    padding: 10PX;
    display: BLOCK;
    flex-direction: column;
}
.footerContainer {
        display: BLOCK;
        align-items: center;
    }
        .footer {
        padding: 10PX;
        display: BLOCK;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }


.footerCardBar{
    display: none;
}

.footerContato {
    display: flex
;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}


.footerCardTitle {
    display: block;
    align-items: center;
    gap: 20px;
    margin-top: 30px;
}
.footerSocialBtns {
    display: flex;
    gap: 20px;
    margin-top: 20px;
    align-items: center;
    justify-content: center;
}
    .navLinks a {
    color: #000 !important;   /* força preto */
    text-decoration: none;
    font-size: 16px;
    display: block;           /* garante clique fácil */
    padding: 8px 0;
  }

  .navLinks {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    flex-direction: column;
    background: #fff;
    border: 1px solid #ddd;
    padding: 10px;
    gap: 10px;
    width: 200px;
    z-index: 1000;            /* sobe acima de header/background */
  }

  .navLinks.active {
    display: flex;
  }

  .hamburger {
      z-index: 1000;
    display: flex;
  }
}





/* novo hamburguer com x */

/* MENU HAMBURGUER FINAL */



/** swipper js - services card home */


/* Container da seção (ajuste se usar outro) */
.services { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

/* ===== Layout DESKTOP (sem Swiper) ===== */
.servicesContent {
  --services-gap: 24px;
}
.servicesContent:not(.swiper-initialized) .swiper-wrapper,
.servicesContent:not(.swiper) {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--services-gap);
}
.servicesContent:not(.swiper-initialized) .swiper-slide,
.servicesContent:not(.swiper) .servicesCard {
}
.servicesContent .servicesCard { height: 100%; }

/* 3 colunas ≤1024px */
@media (max-width: 1024px){
  .servicesContent:not(.swiper-initialized) .swiper-wrapper,
  .servicesContent:not(.swiper){
    grid-template-columns: repeat(3, 1fr);
  }
}

/* 2 colunas ≤768px (quando Swiper estiver DESLIGADO acima de 768, mantém coerência) */
@media (max-width: 767px){
  .servicesContent:not(.swiper-initialized) .swiper-wrapper,
  .servicesContent:not(.swiper){
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ===== Controles do Swiper ===== */
.services .swiper-pagination,
.services .swiper-button-prev,
.services .swiper-button-next { display: none; }

.services .swiper.swiper-initialized .swiper-pagination { 
  display: flex; 
  position: static; 
  margin-top: 16px; 
  justify-content: center; 
}
.services .swiper.swiper-initialized .swiper-button-prev,
.services .swiper.swiper-initialized .swiper-button-next {
  display: flex;
  top: 50%; transform: translateY(-50%);
  width: 36px; height: 36px; border-radius: 50%;
  background: #fff; box-shadow: 0 6px 18px rgba(0,0,0,.12);
}
.services .swiper.swiper-initialized .swiper-button-prev { left: -18px; }
.services .swiper.swiper-initialized .swiper-button-next { right: -18px; }

@media (max-width: 767px){
  .services .swiper.swiper-initialized .swiper-button-prev,
  .services .swiper.swiper-initialized .swiper-button-next { display: none; }
}
/* ≥768px: volta a ser grid de 4 colunas, mesmo se o Swiper estiver inicializado */
@media (min-width: 768px){
    
    
  .services .servicesContent .swiper-wrapper{
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 24px !important;
  }
  .services .servicesContent .swiper-slide{
    width: auto !important;
    height: auto !important;
    display: flex;
  }
  /* esconde controles no desktop */
  .services .swiper-button-prev,
  .services .swiper-button-next,
  .services .swiper-pagination{
    display: none !important;
  }
  
  .services .servicesContent .swiper-slide{
    display: flex;
}
  
  
}









/* teste 3
*/
/* Container opcional — use o seu margin inline se preferir */
.services { max-width: 1200px; margin: 0 auto; }

/* Gap padrão da seção (use o mesmo do seu grid atual) */
.servicesContent { --services-gap: 24px; }

/* ====== Aparência CONSISTENTE dos cards ====== */
.servicesCard {
  display: flex;
  flex-direction: column;
  justify-content: space-between;   /* botão sempre baixa */
  gap: 12px;                        /* espaço interno entre blocos */
  padding: 20px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(0,0,0,.08);
  height: 100%;                     /* preenche o grid/slide */
}

/* (se tiver elementos internos específicos, garante alinhamento) */
.servicesCard .servicesTitle { text-align: center; }
.servicesCard .servicesText  { text-align: center; }
.servicesCard .servicesCardCta { align-self: center; }

/* ====== DESKTOP (≥768px) — GRID de 4 ====== */
@media (min-width: 768px){
  /* Força grid mesmo que o Swiper tenha deixado sua estrutura */
  .services .servicesContent.swiper .swiper-wrapper {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: var(--services-gap) !important;
  }
}

/* final teste 3
*/

/* final services card home */






/* preloader */
:root{
  --gold:#cbb46a;
  --bg:#ffffff;
  --text:#111;
}

#preloader{
  position:fixed; inset:0; z-index:99999;
  background:var(--bg);
  display:grid; place-items:center;
  transition:opacity .4s ease, transform .4s ease;
}
#preloader.is-hiding{ opacity:0; transform:scale(.98); pointer-events:none; }
body.preloader-lock{ overflow:hidden; }

.pl-inner{ width:min(520px, 86vw); display:flex; flex-direction:column; align-items:center; gap:14px; }
.pl-logo{ width:min(220px, 60vw); height:auto; display:block; }

.pl-progress{
  width:100%;
  height:10px;
  background:#f0f0f0;
  border-radius:999px;
  overflow:hidden;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.06);
}
.pl-bar{
  width:0%;
  height:100%;
  background: linear-gradient(90deg, var(--gold), #e1cf8b);
  border-radius:999px;
  transition: width .25s ease;
}
.pl-text{ color:var(--text); font:600 14px/1.2 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; }

@media (prefers-reduced-motion: reduce){
  #preloader{ transition:none }
  .pl-bar{ transition:none }
}




/*
*
*
*
*
*
                ANIMAÇÕES 
*
*
*
*
*
*/
                
                
 .fade-in {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 2s ease, transform 2s ease;
}

.fade-in.show {
  opacity: 1;
  transform: translateY(0);
}

.serviceBanner {
    background-image: url(https://matheusborba.com.br/Combu/mtConNovo/assets/img/aboutBannerServices.png);
}