/* HEADER */

.header{
position:fixed;
top:0;
width:100%;
display:flex;
justify-content:center;
z-index:1000;
}
.logo img{
    height:50px;
    transition:0.3s;
    padding: 0;
}
.logo{
    display: flex;
    align-items: center;
    justify-content: center;
}

.logo img:hover{
    transform:scale(1.05);
}
/* NAV */

.navbar{
width:90%;
max-width:1200px;
display:flex;
justify-content:space-between;
align-items:center;
padding:18px 30px;
margin-top:10px;
border-radius:18px;
background:rgba(15,15,15,0.6);
backdrop-filter:blur(12px);
box-shadow:0 5px 20px rgba(0,0,0,0.4);
}

/* LOGO */



/* MENU DESKTOP */

.menu{
display:flex;
gap:40px;
list-style:none;
}

.menu a{
color:#b8b8b8;
text-decoration:none;
font-size:16px;
position:relative;
transition:0.3s;
}

/* HOVER */

.menu a:hover{
color:#ffffff;
transform:translateY(-2px);
}

/* LINHA */

.menu a::after{
content:"";
position:absolute;
left:0;
bottom:-6px;
width:0;
height:2px;
background:#0069be;
transition:0.3s;
}

.menu a:hover::after{
width:100%;
}

/* BOTÃO HAMBURGUER */

.menu-btn{
display:none;
font-size:26px;
background:none;
border:none;
color:#0069be;
cursor:pointer;
}

.menu-btn i{
transition:0.3s;
}

/* ANIMAÇÃO X */

.menu-btn.active span:nth-child(1){
transform:rotate(45deg) translate(5px,5px);
}

.menu-btn.active span:nth-child(2){
opacity:0;
}

.menu-btn.active span:nth-child(3){
transform:rotate(-45deg) translate(5px,-5px);
}


@media(max-width:768px){

.menu-btn{
display:block;
z-index:3000;
}

/* MENU FULLSCREEN */

.menu{
position:fixed;
top:0;
left:0;
width:100%;
height:100vh;

background:rgba(10,10,10,0.95);
backdrop-filter:blur(10px);

display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
gap:40px;

/* ANIMAÇÃO */
opacity:0;
pointer-events:none;
transform:scale(1.05);
transition:0.4s;

z-index:2000;
}
.logo img{
    height: 35px;
}
/* ATIVO */

.menu.active{
opacity:1;
pointer-events:auto;
transform:scale(1);
}

/* LINKS GRANDES */

.menu a{
font-size:22px;
}

}