.navigation-links {
    display: flex;
    flex-wrap: nowrap;
    align-items: baseline;
    justify-content: space-between;
    font-family: var(--saans-heavy);
    font-weight: normal;
    font-size: clamp(12px, 1.05vw + 0.25rem, 18px);
    line-height: var(--leading-none);
    gap: clamp(6px, 0.7vw, 39px);
    color: var(--gray);
    text-transform: uppercase;
    letter-spacing: clamp(0.015em, 0.22vw, 0.05em);
    text-align: center;
    overflow: visible;
}

.navigation-links .link-item {
    position: relative;
    display: block;
    padding: 4px 0;
    font: inherit;
    color: inherit;
    text-decoration: none;
    white-space: nowrap;
    flex: 0 1 auto;
    min-width: 0;
}

.navigation-links .link-underline {
    height: auto;
}

@media (hover: hover) {
    .navigation-links .link-item:hover {
        text-decoration: none;
    }
}

@media (max-width: 69em) {
    .navigation-links {
        flex-wrap: nowrap;
        font-size: clamp(11px, 0.95vw + 0.2rem, 16px);
        gap: clamp(6px, 0.6vw, 24px);
        letter-spacing: clamp(0.012em, 0.18vw, 0.04em);
    }
}

@media (min-width: 92em) {
    .navigation-links {
        text-align: left;
        gap: clamp(16px, 1.2vw, 39px);
    }
}

@media (max-width: 48em) {
    .navigation-links {
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
        gap: 10px 16px;
        font-size: 12px;
    }
}