/* mega-menu.css · organisation du méga menu · 24/09/2026, noms alignés le 11/10/2026
   Chargé depuis le menu lui-même (tools/nav.canonical.html), donc distribué avec lui :
   les pages en série le reçoivent par partials/chrome.js, la racine par sync_nav.py.
   Pour le modifier : éditer ce fichier, changer ?v= dans tools/build_nav.py, relancer les trois scripts. */

/* Deux colonnes de liens, la vitrine à droite. */
@media (min-width:1241px){
  .v5-mega-inner{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
  .v5-mega-rail{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 34px;align-content:start}
}
/* Sous 1240 px, un groupe par colonne, la vitrine dessous. */
@media (max-width:1240px){
  .v5-mega-rail{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:22px 28px}
}

/* Chaque lien : le titre sur une ligne, une description dessous. */
.v5-mega-rail a{flex-direction:column;align-items:stretch;gap:1px;padding:6px 10px;margin:0 -10px;border-radius:8px;font-size:15px;line-height:1.3}
.v5-mega-rail a:hover,.v5-mega-rail a:focus-visible{background:var(--surface-2)}
.v5-mega-rail a[aria-current="page"]{background:var(--surface-2)}
.v5-mega-t{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.v5-mega-d{display:block;font-family:var(--font-sans);font-size:.8rem;line-height:1.35;color:var(--ink-3);text-wrap:pretty}
.v5-mega-rail a:hover .v5-mega-d,.v5-mega-rail a:focus-visible .v5-mega-d{color:var(--ink-2)}
.v5-mega-group .v5-nav-submenu-group{margin:0 0 4px;padding:0 0 8px;border-bottom:1px solid;border-bottom-color:var(--line);color:var(--ink-2)}

/* Vitrines des entrées ajoutées après layout.css (mis en cache longtemps). */
.v5-mega:has(.v5-mega-rail a[data-shot="mon-corps"]:hover) .v5-mega-stage a.v5-mega-shot[data-shot="mon-corps"],
.v5-mega:has(.v5-mega-rail a[data-shot="mon-corps"]:focus-visible) .v5-mega-stage a.v5-mega-shot[data-shot="mon-corps"]{opacity:1;pointer-events:auto}
.v5-mega:has(.v5-mega-rail a[data-shot="astrologie-medicale"]:hover) .v5-mega-stage a.v5-mega-shot[data-shot="astrologie-medicale"],
.v5-mega:has(.v5-mega-rail a[data-shot="astrologie-medicale"]:focus-visible) .v5-mega-stage a.v5-mega-shot[data-shot="astrologie-medicale"]{opacity:1;pointer-events:auto}

@media (prefers-reduced-motion:reduce){
  .v5-mega-stage a.v5-mega-shot,.v5-mega-shot img{transition:none}
}