.menu-container {
     display: flex;
     justify-content: flex-end;
     align-items: center;
}
.menu {
     padding: 0;
     margin: 0;
     display: flex;
     align-items: center;
}
.menu li {
     margin: 0;
     display: inline-block;
     list-style: none;
     position: relative;
}
.menu li a {
     display: block;
     padding: 12px 18px;
     text-decoration: none;
     text-transform: uppercase;
     font-size: 14px;
     font-weight: 600;
     color: #ffffff;
     font-family: var(--font-headings);
     letter-spacing: 0.5px;
     position: relative;
     transition: var(--transition);
}
.menu li a::after {
     content: '';
     position: absolute;
     bottom: 4px;
     left: 18px;
     right: 18px;
     height: 2px;
     background-color: var(--primary);
     transform: scaleX(0);
     transform-origin: right;
     transition: transform 0.3s ease;
}
.menu li a:hover::after, 
.menu li.highlight a::after,
.menu li a.highlight::after {
     transform: scaleX(1);
     transform-origin: left;
}
.menu li a:hover, .menu .highlight, .menu li a.highlight {
     color: var(--primary) !important;
     text-shadow: 0 0 8px rgba(205, 162, 116, 0.4);
}
.menu li ul {
     height: auto;
     position: absolute;
     top: 100%;
     right: 0;
     z-index: 10;
     display: block;
     opacity: 0;
     visibility: hidden;
     transform: translateY(10px);
     margin: 0;
     padding: 10px 0;
     width: 220px;
     background: rgba(15, 23, 42, 0.9);
     backdrop-filter: blur(16px);
     border: 1px solid rgba(205, 162, 116, 0.2);
     border-radius: var(--radius-md);
     box-shadow: var(--shadow-xl);
     transition: var(--transition);
}
.menu li:hover > ul {
     opacity: 1;
     visibility: visible;
     transform: translateY(0);
}
.menu li ul li {
     display: block;
     width: 100%;
}
.menu li ul li a {
     display: block;
     padding: 10px 20px;
     text-transform: none;
     font-size: 14px;
     font-weight: 500;
     text-align: left;
     color: #cbd5e1;
     background: transparent;
     transition: var(--transition);
}
.menu li ul li a::after {
     display: none;
}
.menu li ul li a:hover {
     color: var(--primary) !important;
     background: rgba(255, 255, 255, 0.05);
     padding-left: 25px;
}
.menu li li {
     display: block;
     float: none;
}
.menu li ul ul {
     right: 100%;
     top: 0;
     margin-right: 2px;
}