/* Non-destructive augmentations for header/navigation layout */
.nav-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.nav-links {
    display: flex;
    gap: 1.5rem;
    align-items: center;
}

/* Tweak for logo text to not wrap on small screens */
.logo span { white-space: nowrap; }

/* Ensure nav links wrap nicely on small viewports */
@media (max-width: 720px) {
    .nav-inner { flex-direction: column; align-items: stretch; }
    .nav-links { justify-content: center; flex-wrap: wrap; gap: 0.8rem; }
    .logo { justify-self: start; }
}