/* ============================================
   Navigation
   ============================================ */

nav.main-nav ul {
    list-style: none;
    display: flex;
    gap: 28px;
}
nav.main-nav a {
    color: rgba(255,255,255,0.78);
    font-weight: 500;
    font-size: 14px;
    letter-spacing: 0.02em;
    padding: 6px 2px;
    position: relative;
    transition: color var(--t-fast);
}
nav.main-nav a::after {
    content: "";
    position: absolute;
    left: 0; bottom: 0;
    width: 0; height: 1px;
    background: var(--brass-2);
    transition: width var(--t-base);
}
nav.main-nav a:hover { color: #fff; }
nav.main-nav a:hover::after { width: 100%; }

@media (max-width: 768px) {
    nav.main-nav ul { gap: 20px; flex-wrap: wrap; }
}