/*
 * nav-menu.css — EDBP
 * Mida i setup visual dels nav links.
 * NO toca position/top/transform del #site-header — nav-scroll.css el gestiona.
 *
 * Selector: #site-header (id) > .site-navigation ul.menu > li > a
 * Especificitat: 1,3,1 — guanya al kit Elementor (0,3,1) i al child theme (0,3,1).
 */

/* ── 1. Mida font — desktop únicamente ────────────────────────────────────── */
@media (min-width: 768px) {
    #site-header .site-navigation ul.menu > li > a {
        font-size: clamp(0.85rem, 1.1vw, 1.2rem);
        letter-spacing: 0.06em;
        line-height: 1;
    }
}

/* ── 2. Setup contenidor per al rolling text hover ───────────────────────── */
/*
 * L'<a> actua com a màscara (overflow:hidden).
 * .nm-a  = text original (visible, en repòs a translateY(0))
 * .nm-b  = còpia del text (invisible, comença a translateY(100%))
 * En hover: ambdós pugen translateY(-100%) → nm-a surt per dalt, nm-b entra per baix.
 * El JS afegeix la classe .nm-ready un cop el DOM és preparat.
 */
#site-header .site-navigation ul.menu > li > a.nm-ready {
    position: relative;
    overflow: hidden;
    display: inline-flex;
    flex-direction: column;
    /* L'alçada queda fixada per .nm-a (primer fill en el flex column) */
}

#site-header .site-navigation ul.menu > li > a .nm-a,
#site-header .site-navigation ul.menu > li > a .nm-b {
    display: block;
    white-space: nowrap;
    /* Deixa el text-transform/font-weight/tracking del pare */
}

#site-header .site-navigation ul.menu > li > a .nm-b {
    /* Còpia: posicionada just per sota del nm-a dins el flex column */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    transform: translateY(100%);
    will-change: transform;
    pointer-events: none;
}

#site-header .site-navigation ul.menu > li > a .nm-a {
    will-change: transform;
}

/* Sense hover (mòbil, touch) — sense will-change innecessari */
@media (hover: none) {
    #site-header .site-navigation ul.menu > li > a .nm-a,
    #site-header .site-navigation ul.menu > li > a .nm-b {
        will-change: auto;
    }
}

/* ── 3. Accessibilitat ───────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    #site-header .site-navigation ul.menu > li > a,
    #site-header .site-navigation ul.menu > li > a .nm-a,
    #site-header .site-navigation ul.menu > li > a .nm-b {
        transition: none !important;
        animation: none !important;
        will-change: auto !important;
    }
}
