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

html {scroll-behavior: smooth;}
* {margin: 0; padding: 0; box-sizing: border-box; font-family: "Poppins", sans-serif; font-optical-sizing: auto; font-style: normal; font-size: 20px; font-weight: 400; color: var(--preto);}
body {overflow-x: hidden; background-color: var(--branco);}
p {font-size: 18px; line-height: 30px; margin-bottom: 15px; color: var(--cinza);}
a,button, input, textarea {-webkit-transition: .3s;-o-transition: .3s;transition: .3s; outline: 0;}
button {cursor: pointer;}
cite {font-style: normal;}
strong, b {font-size: inherit; color: inherit;}
a, a:hover {text-decoration: none;}
a:focus, button:focus, input:focus, textarea:focus {outline: 0; text-decoration: none;}
ul {-webkit-padding-start:0; -moz-padding-start:0; margin: 0;}
li {list-style-type: none;}
img {max-width: 100%;}
section{padding: 50px 0;}
bee-grid {max-width: 1330px; width: 100%; margin: 0 auto; padding: 0 30px; display: grid; grid-template-columns: minmax(0, 1fr); grid-gap: 0px; position: relative; flex-wrap: wrap;}
cite {text-transform: uppercase; font-size: 22px; font-weight: 700; color: var(--laranja); margin-bottom: 15px; display: block;}
h2 {font-size: 40px; font-weight: 400; line-height: 54px; margin-bottom: 25px;}
a.whatsapp, a.zap {animation: bordas 1.5s ease-in-out infinite;} 
a.whatsapp:hover {transform: scale(1.1); filter: brightness(1.1);}
.controle button:hover {background-color: var(--preto)!important;}
@keyframes bordas {0%, 100% {box-shadow: 0px 0px 0px 0px rgb(64 195 81 / 0%);} 50% {box-shadow: 0px 0px 0px 15px rgb(64 195 81 / 30%);}}
a.zap {position: fixed; bottom: 20px; right: 20px; background: var(--whatsapp); display: flex; padding: 20px; border-radius: 50px;}

:root {
  --laranja: #FF6900;
  --preto: #191919;
  --cinza: #414141;  
  --branco: #FFFFFF;
  --whatsapp: #40C351;
  --bordas: #dddddd;
}


header {
  padding-top: 40px;
  height: 600px;
}
header bee-grid {
  grid-template-columns: .65fr;
}
header h1 {
  margin: 60px 0 15px;
  line-height: 76px;
  font-size: 58px;
  font-weight: 700;
  color: var(--preto);
}
header p {
  font-size: 22px;
  color: var(--cinza);
  margin-bottom: 40px;
  max-width: 80%;
  line-height: 34px;
  font-weight: 300;
}
header a {
  background-color: var(--whatsapp);
  color: var(--branco);
  display: flex;
  align-items: center;
  width: fit-content;
  padding: 15px 25px;
  border-radius: 50px;
  gap: 10px;
}
header figure {
  position: absolute;
  top: 0;
  right: 30px;
  animation: flutuar 3s ease-in-out infinite;  
}
header figure img {
  max-width: 500px;
}
/* Animação: sobe e desce suavemente */
@keyframes flutuar {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-20px);
  }
}



section.servicos {
  position: relative;
}
/*section.servicos:before {
  content: '';
  position: absolute;
  left: 0;
  top: 200px;
  background-image: url('../img/detalhe.png');
  width: 218px;
  height: 655px;  
}*/
section.servicos .rotativo {
  width: 1800px;
}
section.servicos .slick-slide {
  margin: 0 15px;
}
section.servicos .slick-list {
  margin: 0 -15px;
}
section.servicos figure {
  height: 400px;
  background-size: cover;
  border-radius: 50px;
  position: relative;
  padding: 20px;
}
section.servicos figure figcaption {
  background-color: var(--laranja);
  border-radius: 50px;
  padding: 20px;
  color: var(--branco);
  font-weight: 300;
  font-size: 32px;
  text-align: center;
  position: absolute;
  width: calc(100% - 40px);
  bottom: 20px;
  margin: 0 auto;
  left: 0;
  right: 0;  
}
section.servicos figure figcaption b {
  font-weight: 700;
}
section.servicos .controle {
  display: flex;
  justify-content: end;
  gap: 20px;  
  margin-bottom: 40px;
}
section.servicos .controle button {
  background-color: var(--laranja);
  border: unset;
  border-radius: 50px;
  width: 75px;
  height: 75px;
  background-image: url('../img/seta.png');
  background-size: 35px;
  background-position: center;
  background-repeat: no-repeat;
}
section.servicos .controle button#anterior {
  transform: scaleX(-1);
}



section.como bee-grid {
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;  
}
section.como h2 {
  padding-right: 50px;
}
section.como a {
  background-color: var(--whatsapp);
  color: var(--branco);
  display: flex;
  align-items: center;
  width: fit-content;
  padding: 15px 25px;
  border-radius: 50px;
  gap: 10px;  
}
section.como figure {
  position: relative;
}
section.como figure img {
  animation: flutuar 3s ease-in-out infinite;      
}
section.como figure:before {
  content: '';
  position: absolute;
  width: 130px;
  height: 130px;
  background-color: var(--laranja);
  opacity: .8;
  z-index: -1;
  border-radius: 100%;
  top: 75px;
  left: -7px;
}

section.como div:nth-child(2) figure img {
  animation-delay: 0s;
}
section.como div:nth-child(3) figure img {
  animation-delay: .3s;
}
section.como div:nth-child(4) figure img {
  animation-delay: .6s;
}
section.como div:nth-child(5) figure img {
  animation-delay: .9s;
}
section.como div:nth-child(6) figure img {
  animation-delay: 1.2s;
}
section.como figure figcaption {
  color: var(--cinza);
}
section.como figure figcaption b {
  font-weight: 700;
  font-size: 28px;
  display: flex;
  color: var(--preto);
  margin: 10px 0 5px;   
}


section.profissionais figure {
  background-image: url('../img/profissionais.png');
  background-size: cover;
  background-position: center;
  width: 500px;
  height: 400px;
  border-radius: 50px;
}
section.profissionais bee-grid {
  grid-template-columns: max-content 1fr;
  gap: 60px;
  align-items: center;
}
section.profissionais h2 {
  margin-bottom: 20px;
}
section.profissionais p {
  margin-bottom: 35px;
}
section.profissionais a {
  background-color: var(--whatsapp);
  color: var(--branco);
  display: flex;
  align-items: center;
  width: fit-content;
  padding: 15px 25px;
  border-radius: 50px;
  gap: 10px;  
}


section.video {

}
section.video .player {
  position: relative;
}
section.video .player .assistir {
  background-color: rgb(255 105 0 / 75%);
  border-radius: 50px;
  position: absolute;
  top: 32%;
  left: 0;
  right: 0;
  margin: 0 auto;
  z-index: 1;
  width: fit-content;
  padding: 25px 50px;
  text-align: center;  
  cursor: pointer;
  transition: .3s;
}
section.video .player .assistir.remover {
  opacity: 0;
  visibility: hidden;
}
section.video .player .assistir button {
  background: none;
  border: none;
}
section.video .player .assistir img {
  transition: .3s;
  position: relative;
  top: 0;
}
section.video .player .assistir:hover img {
  transform: scale(1.4);
  top: -18px;
}
section.video .player .assistir p {
  color: var(--branco);
  font-weight: 700;
  transition: .3s;
}
section.video .player .assistir:hover p {
  opacity: 0;
} 
section.video .video {
  background-color: #000;
  border-radius: 50px;
  overflow: hidden;
}
section.video video {
  width: 100%;
  border-radius: 50px;
  opacity: .3;
  margin: -100px 0 -15px;
  transition: 1s;
}



section.avaliacoes bee-grid:nth-child(1) {
  grid-template-columns: 1fr 1fr;
  align-items: end;
  margin-bottom: 40px;
}
section.avaliacoes h2 {
  margin-bottom: 15px;
}
section.avaliacoes p {
  display: flex;
  align-items: center;
  gap: 20px;
}
section.avaliacoes bee-grid:nth-child(1) p strong {
  font-weight: 700;
  color: var(--preto);
  font-size: 32px;
}
section.avaliacoes bee-grid:nth-child(1) p i {
  width: 210px;
  height: 47px;
  background-image: url('../img/estrela.png');
}
section.avaliacoes bee-grid:nth-child(1) p em {
  color: var(--cinza);
}
section.avaliacoes .controle {
  display: flex;
  justify-content: end;
  gap: 20px;  
  margin-bottom: 20px;
}
section.avaliacoes .controle button {
  background-color: var(--laranja);
  border: unset;
  border-radius: 50px;
  width: 75px;
  height: 75px;
  background-image: url('../img/seta.png');
  background-size: 35px;
  background-position: center;
  background-repeat: no-repeat;
}
section.avaliacoes .controle button#anterior {
  transform: scaleX(-1);
}
section.avaliacoes article {
  display: flex;
  align-items: center;
  flex-direction: column;
  border: 1px solid var(--bordas);
  border-radius: 50px;
  padding: 40px;
  text-align: center;  
  gap: 10px;
}
section.avaliacoes article strong {
  font-weight: 700;
  color: var(--preto);
  font-size: 20px;
}
section.avaliacoes article i {
  width: 210px;
  height: 47px;
  background-image: url('../img/estrela.png');
}
section.avaliacoes article p {
  color: var(--cinza);
}
section.avaliacoes .rotativo {
  width: 110%;
}
section.avaliacoes .slick-slide {
  margin: 0 15px;
}
section.avaliacoes .slick-list {
  margin: 0 -15px;
}



section.mapa cite {
  text-align: center;
}
section.mapa h2 {
  text-align: center;
}
section.mapa p {
  text-align: center;
  font-size: 28px;
  font-weight: 400;
  margin-bottom: 50px;  
  line-height: 40px;
}
section.mapa iframe {
  width: 100%;
  height: 400px;
  border-radius: 50px;
  border: unset;
}



section.duvidas bee-grid {
  grid-template-columns: 1fr .9fr;
  gap: 50px;
}
section.duvidas h2 {
  margin-bottom: 40px;
}
section.duvidas .faq {
  display: flex;
  flex-direction: column;
  gap: 20px;  
}
section.duvidas .faq div.ativo {
  background-color: var(--laranja);
  border: 0;
}
section.duvidas .faq div.ativo h3 {
  color: var(--branco);
}
section.duvidas .faq div.ativo h3:after {
  content: '-';
}
section.duvidas .faq div {
  border-radius: 40px;
  padding: 20px 30px;
  border: 1px solid var(--preto);
}
section.duvidas .faq div h3 {
  color: var(--preto);
  font-size: 22px;
  font-weight: 600;
  display: flex;
  justify-content: space-between;
}
section.duvidas .faq div h3:after {
  content: '+';
  display: inline-flex;
}
section.duvidas .faq div p {
  color: var(--branco);
  display: none;
  margin-top: 15px;
  font-weight: 300;
}
section.duvidas .faq div.ativo p {
  display: block
}
section.duvidas figure {
  margin-top: 50px;
  animation: flutuar 3s ease-in-out infinite;   
}



footer {
  margin-bottom: 20px;
}
footer .bg {
  background-image: url('../img/rodape.png');
  padding: 60px;
  border-radius: 50px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 50px;
}
footer .bg div:nth-child(1) img {
  margin-bottom: 20px;
  padding: 10px;
  border-radius: 20px;
  background: var(--branco);  
}
footer p {
  color: var(--branco);
  font-weight: 300;
}
footer strong {
  font-weight: 600;
  color: var(--branco);
  font-size: 28px;
  display: flex;
  margin-bottom: 20px;
}
footer ul li:first-child a {
  font-size: 40px;
  font-weight: 600;
}
footer ul li, footer ul li a {
  color: var(--branco);
  display: flex;
  align-items: center;
  gap: 20px;
}
footer ul li img {
  max-width: 34px;
}
footer ul {
  display: flex;
  flex-direction: column;
  gap: 10px;
}


.creditos bee-grid {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.creditos p:last-child {
  display: flex;
  align-items: center;
  gap: 10px;
}