/* Navigation — tiroir latéral (direction A).
   Chargé par toutes les pages, après dark-theme.css.

   Les sélecteurs sont en nav#navLinks : chaque page définit encore
   .nav-links{display:none} dans son <style> inline, qui arrive après cette
   feuille. L'identifiant reprend la main sans qu'on touche aux dix pages. */

/* ---------- Le tiroir ---------- */
/* Le tiroir fermé sort de l'écran par la droite. Une enveloppe fixe qui le
   découpe évite qu'il agrandisse la zone défilable de la page. */
#jfdMenuEnveloppe{
  position:fixed;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  z-index:80;
}
#jfdMenuEnveloppe.actif{ pointer-events:auto; }

nav#navLinks{
  display:flex;
  pointer-events:auto;
  flex-direction:column;
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  left:auto;
  width:min(86vw, 340px);
  max-width:340px;
  min-width:0;
  height:100%;
  margin:0;
  padding:0;
  background:#0e1b3a;
  border:0;
  border-left:1px solid rgba(185,146,86,.45);
  border-radius:0;
  box-shadow:-30px 0 60px -30px rgba(10,17,32,.75);
  transform:translateX(101%);
  visibility:hidden;
  transition:transform .38s cubic-bezier(.32,.72,0,1), visibility 0s linear .38s;
  z-index:80;
  overflow-y:auto;
  overscroll-behavior:contain;
}
nav#navLinks.open{
  display:flex;
  transform:none;
  visibility:visible;
  transition:transform .38s cubic-bezier(.32,.72,0,1), visibility 0s;
}

/* en-tête */
nav#navLinks .tiroir-tete{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:20px 22px 0;
  flex:0 0 auto;
}
nav#navLinks .tiroir-titre{
  font-family:"Cormorant Garamond","Iowan Old Style",Georgia,serif;
  font-size:1.5rem;
  color:#fff;
}
nav#navLinks .tiroir-fermer{
  background:none;
  border:0;
  color:rgba(255,255,255,.55);
  font-size:1.15rem;
  cursor:pointer;
  padding:4px 6px;
  line-height:1;
}
nav#navLinks .tiroir-fermer:hover{ color:#fff; }

nav#navLinks .tiroir-regle{
  height:1px;
  background:rgba(185,146,86,.45);
  margin:12px 22px 4px;
  flex:0 0 auto;
}

/* corps */
nav#navLinks .tiroir-corps{
  padding:0 22px;
  flex:1 1 auto;
  counter-reset:lien;
}
nav#navLinks .tiroir-corps .menu-titre{
  display:block;
  font-size:.6rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:rgba(185,146,86,.9);
  font-weight:700;
  margin:16px 0 4px;
  padding:0 0 0 26px;
  font-family:"Inter","Avenir Next","Segoe UI",system-ui,sans-serif;
}
nav#navLinks .tiroir-corps .menu-titre:first-child{ margin-top:6px; }

nav#navLinks .tiroir-corps a{
  display:flex;
  align-items:baseline;
  gap:10px;
  text-decoration:none;
  color:rgba(255,255,255,.92);
  font-family:"Cormorant Garamond","Iowan Old Style",Georgia,serif;
  font-size:1.12rem;
  line-height:1.2;
  padding:8px 0;
  border-bottom:1px solid rgba(255,255,255,.07);
  counter-increment:lien;
  white-space:normal;
}
nav#navLinks .tiroir-corps a::before{
  content:counter(lien, decimal-leading-zero);
  font-family:"Inter","Avenir Next","Segoe UI",system-ui,sans-serif;
  font-size:.6rem;
  letter-spacing:.12em;
  color:rgba(185,146,86,.75);
  flex:0 0 18px;
}
nav#navLinks .tiroir-corps a:hover{ color:#fff; }
nav#navLinks .tiroir-corps a:hover::before{ color:#e6d3ac; }

/* pied : connexion détachée, puis contact */
nav#navLinks .tiroir-pied{
  flex:0 0 auto;
  padding:14px 22px 22px;
  border-top:1px solid rgba(185,146,86,.28);
  margin-top:14px;
}
nav#navLinks .tiroir-pied a{
  display:block;
  text-decoration:none;
  color:#e6d3ac;
  font-family:"Inter","Avenir Next","Segoe UI",system-ui,sans-serif;
  font-size:.82rem;
  font-weight:600;
  letter-spacing:.04em;
  padding:4px 0;
}
nav#navLinks .tiroir-pied span{
  display:block;
  margin-top:8px;
  font-size:.72rem;
  color:rgba(255,255,255,.42);
}

/* voile */
/* Pas de backdrop-filter ici : sur plusieurs navigateurs mobiles, la couche
   de flou reste composée quand seule l'opacité change — le voile se ferme et
   l'écran reste flou. Un simple assombrissement ne laisse aucune trace.
   La visibilité est détruite en fin de transition pour la même raison. */
#jfdVoile{
  position:fixed;
  inset:0;
  background:rgba(10,17,32,.6);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .3s ease, visibility 0s linear .3s;
  z-index:75;
}
#jfdVoile.actif{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition:opacity .3s ease, visibility 0s;
}

body.jfd-menu-ouvert{ overflow:hidden; }

/* ---------- En-tête sur petit écran ----------
   Sans ces règles, la barre ne tenait pas dans 375 px : le bouton
   d'inscription poussait le hamburger hors de l'écran. */
@media (max-width: 900px){
  .nav-in{ gap:10px; height:62px; }
  .brand span{ display:none; }
  .brand img{ height:38px; }
  .nav-cta{ gap:6px; }
  .nav-cta .btn-primary{ display:none; }
  .nav-cta .btn-ghost{ padding:7px 11px; font-size:.8rem; white-space:nowrap; }
  .nav-toggle{ width:32px; height:32px; }
  .burger{ margin-left:2px; font-size:1.3rem; }
}
@media (max-width: 380px){
  .nav-cta .btn-ghost{ display:none; }
}