/* Navigation compacte et améliorations d'accessibilité partagées. */

.skip-link {
    position: fixed;
    z-index: 2000;
    top: 0.75rem;
    left: 50%;
    padding: 0.75rem 1rem;
    color: #111827;
    background: #fbbf24;
    border-radius: 0.5rem;
    font-weight: 700;
    text-decoration: none;
    transform: translate(-50%, -180%);
    transition: transform 0.2s ease;
}

.skip-link:focus {
    transform: translate(-50%, 0);
}

:focus-visible {
    outline: 3px solid #fbbf24;
    outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Entre tablette et petit écran de bureau, conserver tous les liens sans débordement. */
@media (min-width: 769px) and (max-width: 1380px) {
    .nav-container {
        gap: 0.5rem;
        padding-right: 0.75rem;
        padding-left: 0.75rem;
    }

    .logo {
        width: 245px;
        margin-top: 8px;
        margin-left: -20px;
    }

    .logo-img {
        height: 180px;
    }

    .nav-search {
        flex: 0 1 150px;
        width: 150px;
    }

    .nav-search input {
        width: 100%;
    }

    .nav-links {
        flex: 1 1 auto;
        min-width: 0;
        justify-content: flex-end;
        gap: clamp(0.35rem, 0.55vw, 0.65rem);
    }

    .nav-links a,
    button.dropdown-trigger {
        font-size: 0.67rem;
        letter-spacing: 0.35px;
    }

    .nav-links .btn {
        padding: 0.5rem 0.65rem;
        font-size: 0.66rem;
    }
}

@media (min-width: 769px) and (max-width: 1100px) {
    .logo {
        width: 160px;
        margin-left: -10px;
    }

    .logo-img {
        height: 125px;
    }

    .nav-search {
        display: none;
    }
}