.header{

width:100%;
background:
linear-gradient(
135deg,
#050505,
#151515
);
border-bottom:1px solid rgba(212,175,55,.30);
position:sticky;
top:0;
z-index:999;
}

.container{
max-width:1200px;
height:88px;
margin:auto;
padding:0 25px;
display:flex;
align-items:center;
justify-content:space-between;
}

/* =====================
BRAND
===================== */


.brand{
display:flex;
align-items:center;
gap:14px;
text-decoration:none;
}

.logo{
width:52px;
height:52px;
display:flex;
align-items:center;
justify-content:center;
}

.logo img{
width:100%;
height:100%;
object-fit:contain;
display:block;
filter:
drop-shadow(
0 0 15px rgba(212,175,55,.35)
);
transition:.3s ease;
}

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

.brand-title{
display:flex;
flex-direction:column;
}

.brand-name{
font-size:18px;
font-weight:600;
color:#ffffff;
letter-spacing:-.5px;
line-height:1;
}


.tagline{
margin-top:5px;
font-size:10px;
font-weight:400;
letter-spacing:2px;
text-transform:uppercase;
color:#d4af37;
}



/* =====================
MENU
===================== */



.menu{
display:flex;
gap:32px;
}





.menu a{

color:#ffffff;



font-size:15px;


font-weight:600;



text-decoration:none;



transition:.3s;


}






.menu a:hover{


color:#d4af37;


}









/* =====================
CTA
===================== */


.cta{


padding:

13px 24px;



border-radius:50px;



background:

linear-gradient(

135deg,

#d4af37,

#ffe88b

);



color:#050505;



font-size:14px;



font-weight:900;



text-decoration:none;




box-shadow:

0 10px 25px rgba(212,175,55,.35);



transition:.3s;


}





.cta:hover{


transform:translateY(-2px);


}









/* =====================
BURGER
===================== */


.burger{


display:none;


width:38px;



background:none;



border:0;



cursor:pointer;


}




.burger span{


display:block;


height:3px;



margin:7px 0;



background:#d4af37;



border-radius:20px;



transition:.35s;


}






/* BURGER X */


.burger.active span:nth-child(1){


transform:

translateY(10px)

rotate(45deg);


}





.burger.active span:nth-child(2){


opacity:0;


}




.burger.active span:nth-child(3){


transform:

translateY(-10px)

rotate(-45deg);


}










/* =====================
MOBILE MENU
===================== */



.mobile-menu{


position:absolute;



top:88px;


left:0;



width:100%;



background:#080808;




display:flex;


flex-direction:column;



overflow:hidden;



max-height:0;




padding:0 30px;




border-bottom:

1px solid rgba(212,175,55,.25);




transition:.4s ease;


}






.mobile-menu.active{


max-height:450px;



padding:25px 30px;


}





.mobile-menu a{



padding:15px 0;



color:#ffffff;



font-weight:700;



text-decoration:none;


}






.mobile-menu a:hover{


color:#d4af37;


}






.mobile-btn{


margin-top:15px;



background:#d4af37;



color:#050505!important;



border-radius:40px;



text-align:center;


}










/* =====================
RESPONSIVE
===================== */



@media(max-width:950px){



.menu,

.cta{


display:none;


}




.burger{


display:block;


}



}








@media(max-width:520px){



.container{


height:78px;


padding:0 18px;


}




.mobile-menu{


top:78px;


}




.logo{


width:44px;


height:44px;


}





.brand-name{


font-size:17px;


}





.tagline{


font-size:9px;


letter-spacing:1.3px;


}




}