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



:root{
    --cor01:#2C3639;
    --cor02:#A27B5C ;
    --cor03:#DCD7C9;
    --cor04:#3F4E4F;
    --cor-hover:rgb(25, 25, 25);
    --fonte01:"Krona One", sans-serif;
    --fonte02:"Montserrat", sans-serif;


    }
    


*{
margin: 0%;
padding: 0%;

}




body{
    background-color:var(--cor01);
    color: white;
  height: 100vh;
box-sizing: border-box;

}

.cabecalho{
  display: flex;
padding-top:30px;
padding-left:30px;
width: 50%;

}

.cabecalho__menu{
display: flex;
gap: 70px;
}

.cabecalho__menu__link{
text-decoration: none;
font-weight: 600;
font-family: var(--fonte02);
font-size: 24px;
color: var(--cor02);
}
.cabecalho__menu__link__destaque{
text-decoration: none;
font-family: var(--fonte02);
font-size:1.5rem;
color:#2BDEFD;
font-weight: 600;

}



span{
color: #2BDEFD;


}


.apresentacao{
padding-top:8%;
display: flex;
flex-direction: column;
align-items: center;

}

.apresentacao__conteudo{
display: flex;
flex-direction:column;
gap: 30px;
align-items: center;
margin-bottom: 5%;

}
.apresentacao__conteudo02{
width: 50%;
display: flex;
flex-direction: column;
align-items: center;

margin-bottom: 5%;
}



.apresentacao__conteudo__titulo{
font-family: var(--fonte01);
font-weight: normal;
color: var(--cor02);



}

.apresentacao__conteudo__texto{
width:60%;
color: var(--cor03);
font-size:20px;
  font-family: "Montserrat", sans-serif;
text-align: justify;
text-indent: 5%;
line-height: 30px;

}


.swiper{
width: 120%;
margin-left: -10%;
padding: 4%;
}

.titulo__swiper{
  font-family: var(--fonte01);
  padding:5%;
  border-radius: 15px;
  font-size: 34px;
  border: 2px solid var(--cor02);
  font-weight: 200;
  margin: 5% -4% 0 0;
  background-image: linear-gradient(to right,#A27B5C,#A27B5C,#A27B5C,#3F4E4F,#2C3639);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent ;
  
  }
  

.swiper-slide{
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
gap: 15px;
}

.swiper-slide > img{
width: 76%;
border-radius: 10px;
border: 3px solid var(--cor04);

}



.swiper-pagination-bullet{
  background:#2BDEFD;
  }
  .swiper-pagination{
    position: initial;
    margin: 4% 0 8% 0;
    }


.link__carrossel{
color: white;
font-family: var(--fonte02);
text-decoration: none;

}


.swiper-button-prev,.swiper-button-next{
background-color: var(--cor02);
border-radius: 50%;
width: 40px;
height: 40px;
color: transparent;
margin: 3% -0.5% ;
background-repeat: no-repeat;
}


.swiper-button-prev{
background-image: url(/portifolio-alura/imagens/chevron_left_black_24dp\ 1.png);
background-position: center;

}
.swiper-button-next{
  background-image: url(/portifolio-alura/imagens/chevron_right_black_24dp\ 1.png);
  
background-position: center;
  }



abbr{
text-decoration: none;

}


.links{
text-decoration:none;
color:rgb(48, 48, 250);
font-weight:600;
text-shadow:1px 1px 3px black ;

}

.links:hover{

text-decoration: underline;
cursor: pointer;

}

.link__alura{
  text-decoration:none;
  color:#2BDEFD;
  font-weight:600;
  
}
.link__alura:hover{

  text-decoration: underline;
  cursor: pointer;
  

}




footer{
background-color: var(--cor02);
display: flex;
justify-content: center;
height: 50px;
align-items: center;
width: 100%;
font-family: var(--fonte01);
color: black;



}

/*------------------------------------------------------------------------------------*/



@media(max-width:1024px){

.apresentacao{
padding:8% 0%;
width: 100%;
}


.titulo__swiper{
margin-top: 5%;

}
  

.swiper{
  width:150%;
  margin-top: 2%;
  margin-left: -25%;
  }

  .swiper-button-prev,.swiper-button-next{
    width: 30px;
    height: 30px;
    margin: 4% -0.5% ;
    }
    
.swiper-pagination{
margin-bottom:10%;
}

}


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

.cabecalho__menu__link{
width: 100%;
font-size: 30px;

}

.apresentacao__conteudo__titulo{
width: auto;
font-size: 34px;
margin-top: 5%;

}
.apresentacao__conteudo__texto{
font-size: 20px;

}

}




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

.cabecalho{
padding-left: 5%;
margin-bottom: 8%;
gap: 50px;
}

.cabecalho__menu__link{
font-size: 24px;

}

.apresentacao{
  width: 100%;

}

.apresentacao__conteudo__titulo{
font-size: 27px;

}

.apresentacao__conteudo__texto{
width: 80%;



}

.titulo__swiper{
padding:10%;
font-size: 27px;
width: 120%;
text-align: center;
margin-top: 25%;
}
.swiper{
width: 190%;
margin-left: -47%;
margin-top: 20%;

}
.swiper-button-prev,.swiper-button-next{
  display: none;
}


}