/* Platform 88.5.3.2 — Primary nav legibility (WCAG 2.2 + Google UX touch targets) */

:root {
    /* gray-700 on #fff ≈ 10.3:1 — exceeds WCAG AA (4.5:1) */
    --fe885-nav-fg: #374151;
    --fe885-nav-fs: 0.875rem;
    --fe885-nav-fw: 700;
    --fe885-nav-hit: 2.75rem;
}

.dark {
    --fe885-nav-fg: #e2e8f0;
}

.fe885-nav__link,
.fe885-nav__trigger {
    color: var(--fe885-nav-fg);
    font-size: var(--fe885-nav-fs);
    font-weight: var(--fe885-nav-fw);
    height: var(--fe885-nav-hit);
    min-height: var(--fe885-nav-hit);
    letter-spacing: 0.0125em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.fe885-nav__icon {
    width: 1.0625rem;
    height: 1.0625rem;
    font-size: 0.9375rem;
    opacity: 0.95;
}

.fe885-nav__label {
    font-weight: inherit;
    line-height: 1.25;
}

.fe885-nav__chev {
    font-size: 0.625rem;
    opacity: 0.9;
}

.fe885-nav__link:hover,
.fe885-nav__trigger:hover,
.fe885-nav__link:focus-visible,
.fe885-nav__trigger:focus-visible,
.fe885-nav__link.is-active,
.fe885-nav__trigger.is-active,
.fe885-nav__trigger.is-mega-open {
    color: var(--fe885-primary);
}

@media (min-width: 1440px) {
    :root {
        --fe885-nav-fs: 0.9375rem;
    }

    .fe885-nav__link,
    .fe885-nav__trigger {
        padding-left: 0.55rem;
        padding-right: 0.55rem;
    }

    .fe885-nav__label {
        max-width: none;
    }
}

/* Desktop nav (xl+) — readable floor overrides prior compact shrink */
@media (min-width: 1280px) {
    .fe885-nav__link,
    .fe885-nav__trigger {
        font-size: var(--fe885-nav-fs) !important;
        font-weight: var(--fe885-nav-fw) !important;
        height: var(--fe885-nav-hit) !important;
        min-height: var(--fe885-nav-hit) !important;
        color: var(--fe885-nav-fg);
    }

    .fe885-nav__link.is-active,
    .fe885-nav__trigger.is-active,
    .fe885-nav__trigger.is-mega-open {
        color: var(--fe885-primary);
    }
}
