/*
--- 01 TYPOGRAPHY SYSTEM

- Font sizes (px)
10 / 12 / 14 / 16 / 18 / 20 / 24 / 30 / 36 / 44 / 52 / 62 / 74 / 86 / 98

- Font weights
Default: 400
Medium: 500
Semi-bold: 600
Bold: 700

- Line heights
Default: 1
Small: 1.05
Medium: 1.2
Paragraph default: 1.6

- Letter spacing
-0.5px
0.75px

--- 02 COLORS

- Primary: #e67e22
- Tints:
#77da55 - green
#384852 - Bluedark
#00a1cd - Bluelight
#f1f1f1
#fdf2e9
#fae5d3
#eb984e

- Shades: 
#cf711f
#45260a

- Accents:
- Greys
#3b3e46 
#888
#767676 (lightest grey allowed on #fff)
#6f6f6f (lightest grey allowed on #fdf2e9)
#555
#333

--- 05 SHADOWS

0 2.4rem 4.8rem rgba(0, 0, 0, 0.075);

--- 06 BORDER-RADIUS

Default: 9px
Medium: 11px

--- 07 WHITESPACE

- Spacing system (px)
2 / 4 / 8 / 12 / 16 / 24 / 32 / 48 / 64 / 80 / 96 / 128
*/



/*********** HEADER ***********/

header{
  position: absolute;
  display: flex;
  top:8rem;
  left: 8rem;
  width: 90%;
  height: 9rem;
  z-index: 10;
  /*background-image:linear-gradient(to right,rgba(56, 72, 82, 0.9), rgba(0, 161, 205, 0.5));*/
  border: none;
  border-radius: 2px;
  background-image: linear-gradient(to right,rgba(0, 0, 0, 0.96), rgba(51,51,55,0.96));/*rgba(85, 85, 85, 0.9)
  /*backdrop-filter: blur(8px);*/
}

p {
  font-family:'Poppins', sans-serif;
  font-weight: 400;
}

.logo-box{
  display: flex;
  flex:  0 1 auto;
  width: calc(35rem - 2rem);
  height: 100%;
  justify-content: center;
  align-items: center;
}
.logo{
  /* height: 70%; */
  width: 70%;
}

.header-container{
  width: 100%;
  display: flex;
  align-items: center;
}

.sticky .header {
  position: fixed;
  top: 0;
  bottom: 0;
  /* width: 100%; */
  height: 8rem;
  padding-top: 0;
  padding-bottom: 0;
  z-index: 999;
  
}


/*MENU*/
.header-menu{
  width: 100%;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  font-weight: 500;
  text-transform: uppercase;
  margin:0;
}
.menu-box{
  display: flex;
  height: 100%;  
  width: 100%;
}
.item-menu{
  display: flex;
  align-items: center;
  padding: 0 1.5rem;
  height: 100%;
}
.link-menu{ 
  text-decoration: none;
  font-size: 1.4rem;
  color: #f1f1f1;
}
.item-menu:hover{
 background: black;
 cursor: pointer;
}

/***********
  Mobile
************/
.btn-mobile-nav{
  border: none;
  position: absolute;
  background-color: rgb(0 0 0 / 0%);
  cursor: pointer;
  display: none;
  right: 2%;
  top: 25%;
  
}  
.icon-mobile-nav{
  height: 4.8rem;
  width: 4.8rem;
  color: white;
}
.icon-mobile-nav[name="close-outline"]{
  display: none;
}
/**************** Finish Header *************/


/* HERO SECTION */
.hero{
  width: 100%;
  height: 100vh;
  position: relative;
}

/* Slider */
.slide{
  width: 100%;
  height: 100%;
}
.slider{
margin: 0 auto;
 width:100%;
 height:100%;
 overflow:hidden;
 }
 

.slides{
width: 100%;
height:100%;
display:flex;
}	

 .slides input{
 	display: none;
 }
 
 .slide{
 	width:100%;
 	position: relative;
 }
 

 .slide img{
 	width: 100vw;
 	height: 100%;
 	transition: 0.5s;
 }
 
 .manual-navigation{
 position: absolute;
 width: 100%;
 bottom: 100px ;
 display: flex;
 justify-content: center;
 }
 .navigation-auto div{
  border: 2px solid  #90d6e2;
  padding: 5px;
  border-radius:10px;
  cursor: pointer;
  transition: 1s;
}

.navigation-auto{
 position: absolute;
 width: 100%;
 bottom: 100px;
 display: flex;
 justify-content: center;
 
}
.navigation-auto div:not(:last-child){
margin-right: 40px;
}
 
 
.manual-btn{
  border: 2px solid #90d6e2;
  padding:5px;
  border-radius: 10px;
  cursor: pointer;
  transition: 1s;
 }
 .descricao {
  position: absolute;
    background-color: rgb(0 0 0 / 65%);
    color: rgb(255, 255, 255);
    padding: 5px 15px 5px 15px;
    font-size: 12px;
    border-radius: 5px;
    bottom: 0px;
    right: 0px;
    border: 1px solid rgb(255, 255, 255);
    margin: 0 10px 10px 0;
    font-style: italic;
}

 .manual-btn:not(:last-child){
 	margin-right: 40px;
 }
 
 .manual-btn:hover{
 background-color:#FFF;
 }
 
 #radio1:checked ~ .first{
 margin-left: 0;
 }
 
 #radio2:checked ~ .first{
 margin-right: -100%;
 }
  #radio3:checked ~ .first{
 margin-left: -200%;
 }
 
 #radio4:checked ~ .first{
  margin-left: -300%;
  }
  #radio5:checked ~ .first{
    margin-left: -400%;
    }
     
 

 
 #radio1:checked ~ .navigation-auto .auto-btn1{
 	background-color: #077485;
 }
  #radio2:checked ~ .navigation-auto .auto-btn2{
 	background-color: #077485;
 }
  #radio3:checked ~ .navigation-auto .auto-btn3{
 	background-color: #077485;
 }
 #radio4:checked ~ .navigation-auto .auto-btn4{
  background-color: #077485;
}
#radio5:checked ~ .navigation-auto .auto-btn5{
  background-color: #077485;
}

/*CHAMADA PARA A AÇÃO DA SESÃO HERO*/
.cta-hero {
  font-family:'Inter', sans-serif;
  position: absolute;
  bottom: 0;
  left: 25vw;
  margin: 0 auto;
  display: flex;
  align-items: center;
  color: #f1f1f1;
  width: 50vw;
  height: 80px;
}

.cta-hero-left {
  background-color: #15161a;
  height: 100%;
  font-size: 18px;
  font-weight: 400;
  width: 30%;
  display: flex;
  align-items: center;
  padding: 20px;
  text-align: center;
}

.cta-hero-right {
  font-family:'Inter', sans-serif;
  background-color: #1f2227;
  height: 100%;
  display: flex;
  align-items: center;
  padding: 10px;
  width: 100%;
  justify-content: center;
}

.cta-hero-right a {
  font-family:'Inter', sans-serif;
  background-color: #1f2227;
  text-decoration: none;
  color: #fff;
  font-size: 18px;
  font-weight: 300;
}
/************************* Fim slider***************************/




/******************** SIDE BAR ******************************/
.sidebar{
  position: absolute;
  top: 0;
  width: 35rem;
  background-color: #077485d0;
  height: 100%; 
}

.side-bar-container{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 50%;
  gap:4.6rem;
  margin-top: 25rem;
  font-weight: 600;
  color: #f1f1f1;
  font-size: 1.6rem;
}


.side-title{
  font-family: 'Work Sans', sans-serif;
  font-weight: 600;
  font-size: 22px;
  letter-spacing: 0.2rem;
}
.side-p{
  font-style: italic;
  width: 70%;
  line-height: 1.5;
  font-size: 2.2rem;
  text-align: center;
  transition: all 1s;
}
.know-more{
  padding: 1.2rem 2.4rem;
  color: rgb(109, 107, 107);
  background-color: #f1f1f1;
  text-decoration: none;
  border: none;
  font-family:'Poppins', sans-serif;
  border-radius: 4px;
  font-weight: 400;
  transition: 1s;

  /* border-radius: 2px; */
}
/***********  FIM SIDE BAR **********************/







/***********************SECTION OTHERS******************/
.book{
  border: 3px solid black;
  padding: 0;
  width: 100%;
  margin: 6.8rem auto;
  margin-bottom: 0;
  /*box-shadow: 0 2.4rem 4.8rem 2rem rgba(0, 0, 0, 0.075);*/
  border: none;
  /*border-radius: 4px;*/
  padding-top: 20px;
}

.background-image{
  display: flex;
  flex-direction: column;
  gap: 3.2rem;
  width: 100%;
  border-radius: 2px;
  box-shadow: 0 12rem 24rem  rgba(56, 72, 82, 0.1);
}
.h2.pilares-sec-title{
  color: #077485;
  font-size: 3rem;
  text-align: center;
  padding: 64px;
  line-height: 1.5;
}
.pilares-content{
  padding:30px;
  /*background-image:/*linear-gradient(to  bottom left, rgba(24, 134, 171, 0.971), rgba(7, 116, 133, 0.807) 90%), url(/img/pilares-background.jpg);*/
  background-position: center;
  display: flex;
  justify-content: space-evenly;
  width: 100%;
  margin-top: 6.4rem;
  margin-bottom: 6.4rem;
 border-radius: 4px;
}

.pilares-card-box{
  background-color: #077485df;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 30%;
  height: 40rem;
  padding-top: 1.5rem;
  gap: 4rem;
  border-radius: 10px;
  /*border: rgba(56, 72, 82, 0.7);*/
  box-shadow: 0 2.4rem 4.8rem rgba(0, 0, 0, 0.479);
}
.pilares-card-title{

  display: block;
  padding: 0;
  color: #f1f1f1;
  font-size: 2rem;
  font-style: italic;
}
.pilares-card-text{
  text-align: center;
  color: #f1f1f1;
  width: 90%;
  line-height: 1.5;
}



.container.container-others{
  margin-top: 9.6rem;

}
.container.container-others p{
  color: #077485;
  font-size: 1.9rem;
  overflow-x: hidden;
}
.others{
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.others-img-box{
  box-sizing: border-box;
  position: relative;
  padding:1rem 3.2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: inherit;
}
figure{
  width: 100%;
  height: 350px;
}
.others-img-box img{
  max-height: 340px;
  box-shadow: 0 1.2rem 2.4rem;
}
.others-img-box:last-child{
  border: none;
}
.others-img-box .text-center{
  margin-top: 3.2rem ;
  padding:0 3.2rem;
  text-align: center;
  line-height: 1.5;
  height: 30px;

}
/*
.others-img-box  .conheca{
  display: block;
  padding: 1rem 2rem;
  margin-top: 1rem;
  text-decoration: none;
  background-color: #91d7e2;
  color: #077485;
  font-weight: 600;
  border: none;
  border-radius: 2px;
}
.others-img-box  .conheca:hover{
  background-color: #384852;
  box-shadow:0 2.4rem 4.8rem rgba(0, 0, 0, 0.075) ;
}*/



.slider-empreendimentos {
  max-width: 120rem;
  height: 70rem;
  margin: 0 auto;
  width: 100%;
  position: relative;
  display: flex;
  overflow-x: hidden;
}

.card-slide-empreendimentos {
  width: 100%;
  height: 100%;
  position: absolute;
  transition: 1.5s;
}

.arrow {
  position: absolute;
  height: 75px;
  width: 75px;
  color: #077485;
}

.arrow:hover {
  background-color: #38485280;
  color: #077485;
  border-radius: 50%;
}

.slide_btn_left {
  transform: translate(-20%, 250%);
}

.slide_btn_right {
  right: 0;
  transform: translate(20%, 250%);
}

#carousel3 img {
  height: 50%;
}

.empreendimento-texto {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}

.text-center {
  position: relative;
  padding-bottom: 60px;
}


.button-conheca {
  position: absolute;
  font-size: 17px;
  text-transform: uppercase;
  text-decoration: none;
  padding: 1em 2.5em;
  display: inline-block;
  border-radius: 0.2em;
  transition: all .2s;
  border: none;
  font-family: inherit;
  font-weight: 600;
  color: #077485;
  background-color: #90d6e2;
  width: 90%;
  bottom: -200px;
  transform: translateX(-50%);
 }

 .button-conheca:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
 }
 .button-conheca:active {
  transform: translateY(-1px);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
 }
 .button-conheca::after {
  content: "";
  display: inline-block;
  height: 100%;
  width: 100%;
  border-radius: 3px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  transition: all .4s;
 }
 .button-conheca::after {
  background-color: #90d6e2;
 }
 .button-conheca:hover::after {
  transform: scaleX(1.4) scaleY(1.6);
  opacity: 0;
 }

/*--------------------- Fim Estilização Sesão Other -----------------------*/



/*------------------- SECTION SOBRE ---------------------*/
.section-about {
  padding: 9.6rem 0;
  margin-bottom: 12.8rem;
}
.section-about .container.grid-2-columns{
  margin-top: 12.8rem;
}
.others{
  padding: 3.2rem;
}
.step-description {
  font-size: 1.4rem;
  line-height: 1.8;
  color: RGB(119, 119, 119);
  font-weight: 400;
  margin-bottom: 5px;
}
.step-text-box{
  margin: 0;
  padding: 0 3.2rem;
}

.about-img-box{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.about-img-box img{
  width: 100%;
  height: 100%;
}


.lk-ns-hst{
  text-decoration: none;
  display: inline-block;
  background: #484750;
  color: #f1f1f1;
  font-size: 1.8rem;
  padding: 1rem 2rem;
  font-weight: 600;
  margin-top: 1rem;
  margin-bottom: 2rem;
  border-radius: 4px;
}


/*-------------------- SECTION TESTIMONIALS -------------------*/
.section-testimonials {
  display: none;
  padding: 0 6.4rem;
  background-color: #077485;
  color: #f1f1f1;

  margin-bottom: 18rem;
}

.testimonials-container {
   margin: 0 auto;
}

.testimonials {
 display: flex;
 padding: 3.2rem;
}

.testimonial{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.testimonial-img {
  width: 6.4rem;
  border-radius: 50%;
  margin-bottom: 1.2rem;
}

.testimonial-text {
  text-align: center;
  font-size: 1.8rem;
  line-height: 1.8;
  margin-bottom: 1.6rem;
  width: 80%;
  font-weight: 400;
  color:#91d7e2;
}

.testimonial-name {
  font-size: 1.4rem;
  font-style: italic;
  color:#f1f1f1;
}



/*------------------- SECTION NEWS ---------------------*/
.news{
  margin-top: 12.8rem;
}
.news-container{
  margin-top: 6.4rem;
}
.news-box{
  margin-left: 2rem;
  height: 50rem;
  padding: 3.2rem;
  border: 4px solid black;
  border: rgba(56, 72, 82, 0.7);
  box-shadow: 0 2.4rem 4.8rem rgba(0, 0, 0, 0.075);
  z-index: 5;
}

.news-box h4{
  margin-bottom: 3.2rem;
  text-align: center;
}

.news-text-box{
  line-height: 1.6;
  font-weight: 400;
  color: RGB(119, 119, 119);
}




.cta {
  position: relative;
  margin: auto;
  padding: 12px 18px;
  transition: all 0.2s ease;
  border: none;
  background: none;
  top: 15px;
  cursor: pointer;
 }
 
 .cta:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  border-radius: 50px;
  background: #90d6e2;
  width: 45px;
  height: 45px;
  transition: all 0.3s ease;
 }
 
 .cta span {
  position: relative;
  font-family: "Ubuntu", sans-serif;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: #077485;
 }
 
 .cta svg {
  position: relative;
  top: 0;
  margin-left: 10px;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke: #077485;
  stroke-width: 2;
  transform: translateX(-5px);
  transition: all 0.3s ease;
 }
 
 .cta:hover:before {
  width: 100%;
  background: #90d6e2;
 }
 
 .cta:hover svg {
  transform: translateX(0);
 }
 
 .cta:active {
  transform: scale(0.95);
 }


/* FOOTER */
footer{
  padding: 3.2rem 9.6rem;
  width: 100%;
  /* background-color: #384852; */
  background-image: url(/img/fundo-rodape-verde-1024x219.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  color:#077485;
  margin-top: 18rem;
}
footer .container{
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-evenly;
}

footer ul{
  list-style: none;
  padding: 0;
}
footer ul li, footer ul li a{
 /* margin-top: 1.2rem;
  font-weight: 400;
  text-decoration: none;
  color: #077485;
  text-align: center;*/
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
footer div{
  padding: 3.2rem;

}

footer .copy{
  border-top: 1px solid #f1f1f1;
  text-align: center;
  padding: 1.5rem 3rem;
}

.fab.fa-whatsapp{
  position: fixed;
  bottom: 20px;
  right: 0;
  font-size: 5rem;
  font-weight: bold;
  padding: 2rem 1rem;
  border: none;
  color: #77da55;
}