#navbar{
position:fixed;
top:0;
width:100%;
padding:18px 8%;
display:flex;
justify-content:space-between;
align-items:center;
background:#fff;
z-index:999;
}

.brand-logo{
height:52px;
}

#menu{
display:flex;
gap:18px;
align-items:center;
}

#menu a{
text-decoration:none;
color:#000;
}

.dropdown{
position:relative;
display:inline-block;
}

.dropdown-menu{
position:absolute;
top:100%;
left:0;

opacity:0;
visibility:hidden;
transform:translateY(10px);

transition:.25s;

background:#fff;
border-radius:14px;
min-width:220px;
padding:12px;
}

.dropdown:hover .dropdown-menu{
opacity:1;
visibility:visible;
transform:translateY(0);
}

.dropdown::after{
content:'';
position:absolute;
top:100%;
left:0;
width:100%;
height:20px;
}

#hamburger{
display:none;
}

#navbar{
position:fixed;
top:0;
width:100%;
padding:18px 8%;
display:flex;
justify-content:space-between;
align-items:center;

background:rgba(255,255,255);
backdrop-filter:blur(12px);

z-index:999;
}

.brand-logo{
height:52px;
}

#menu{
display:flex;
align-items:center;
gap:5px;
}

#menu a{
color:#000;
text-decoration:none;
}

.dropdown{
position:relative;
}

.dropdown-menu{
display:none;
position:absolute;
top:40px;
left:0;

background:#ffffff;
border-radius:14px;
min-width:220px;
padding:12px;
}

.dropdown:hover .dropdown-menu{
display:block;
}

.dropdown-menu a{
display:block;
padding:10px;
}

#hamburger{
display:none;
cursor:pointer;
}

#hamburger span{
display:block;
width:30px;
height:3px;

margin:6px 0;

background:#d4af37;

transition:.35s;
}

/* MOBILE */
@media(max-width:900px){

#hamburger{
display:block;
}

#menu{
position:fixed;

top:90px;
right:-100%;

width:300px;
height:100vh;

background:#ccdfff;

display:flex;
flex-direction:column;

align-items:flex-start;

padding:50px 30px;

transition:.4s;
}

#menu.active{
right:0;
}

#menu a{
margin-bottom:25px;
}

.dropdown-menu{
position:relative;
top:10px;
display:block;
background:transparent;
padding-left:20px;
}

}

nav a{
color:#000;
text-decoration:none;
margin-left:24px;
}