/* ═══════════════════════════════════════════════════════════════
   ATLAS Visio — MENU HAMBURGER MOBILE (V3 — refait le 06/08/2026)
   • Bouton ☰ à DROITE, cible tactile 48×48 px, icône SVG claire
   • Animation 3 lignes → croix (le HTML utilise un <svg><line>)
   • Menu plein écran fixé au viewport (placé HORS du header car le
     backdrop-filter du header créerait un containing block)
   • « Se connecter » : masqué dans le header sur mobile, présent
     dans le menu plein écran
   ═══════════════════════════════════════════════════════════════ */

/* ── Bouton hamburger — caché par défaut (desktop) ── */
.sv-burger {
  display: none;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  min-width: 48px;
  padding: 0;
  margin: 0 0 0 10px;
  background: rgba(10, 12, 18, 0.85);
  border: 1.5px solid rgba(242, 236, 223, 0.35);
  border-radius: 10px;
  cursor: pointer;
  color: var(--cream-100);
  flex-shrink: 0;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  z-index: 201;
}
.sv-burger svg { display: block; width: 26px; height: 26px; }
.sv-burger svg line {
  transition: transform 0.3s ease, opacity 0.25s ease;
  transform-box: fill-box;
  transform-origin: center;
}
.sv-burger:active { background: rgba(196, 163, 90, 0.25); }

/* ── Ouvert : les 3 lignes du SVG deviennent une croix ── */
.sv-burger.sv-open svg line:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.sv-burger.sv-open svg line:nth-child(2) { opacity: 0; }
.sv-burger.sv-open svg line:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* ── Menu mobile plein écran ── */
.sv-mobile-menu {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  z-index: 150;
  background: rgba(6, 7, 10, 0.98);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 26px;
  padding: 60px 28px calc(28px + env(safe-area-inset-bottom));
  overflow-y: auto;
  overscroll-behavior: contain;
}
.sv-mobile-menu.sv-open { display: flex; }

.sv-mobile-menu a {
  color: var(--cream-100);
  font-family: var(--serif);
  font-size: 1.55rem;
  text-decoration: none;
  padding: 12px 0;
  border-bottom: 1px solid rgba(242, 236, 223, 0.12);
  width: 100%;
  max-width: 340px;
  text-align: center;
  transition: color 0.2s;
}
.sv-mobile-menu a:hover,
.sv-mobile-menu a:active { color: var(--gold-300); }

/* Le bouton « Se connecter » du menu : reste un bouton, pas un lien géant */
.sv-mobile-menu .sv-btn {
  margin-top: 18px;
  max-width: 340px;
  width: 100%;
  font-family: var(--font);
  font-size: 1.05rem;
  font-weight: 600;
  border-bottom: none;
  padding: 15px 24px;
  min-height: 52px;
}

/* ── Mobile & tablette (<= 900px) : burger visible, nav masquée ── */
@media (max-width: 900px) {
  .sv-nav-links { display: none !important; }
  .sv-burger { display: flex !important; }
  .sv-nav-actions .sv-btn--ghost { display: none !important; }
}

/* ── Desktop (> 900px) : burger et menu mobile masqués ── */
@media (min-width: 901px) {
  .sv-burger { display: none !important; }
  .sv-mobile-menu { display: none !important; }
}

/* ── Blocage du scroll de fond quand le menu est ouvert ── */
body:has(.sv-mobile-menu.sv-open) { overflow: hidden; }

/* ── Menu ouvert : le header (logo + croix de fermeture) reste
      visible et cliquable au-dessus du menu plein écran ── */
body:has(.sv-mobile-menu.sv-open) .sv-nav { z-index: 160; }