/* Menu plein écran sur téléphone (accueil et autres pages) */
.menu-btn { display: none; }
@media (max-width: 860px) {
  .menu-btn { display: inline-flex; align-items: center; gap: .6rem; margin-left: auto; position: relative; z-index: 71; min-height: 42px; padding: 0 1.1rem; border-radius: 999px; border: 1px solid rgba(255,255,255,.4); background: rgba(0,0,0,.3); color: #fff; font: 500 .95rem/1 "Instrument Sans", system-ui, sans-serif; cursor: pointer; -webkit-tap-highlight-color: transparent; }
  .menu-btn i { position: relative; width: 16px; height: 8px; }
  .menu-btn i::before, .menu-btn i::after { content: ""; position: absolute; left: 0; right: 0; height: 1.5px; background: currentColor; border-radius: 2px; transition: transform 200ms cubic-bezier(0.23, 1, 0.32, 1); }
  .menu-btn i::before { top: 0; } .menu-btn i::after { bottom: 0; }
  .menu-open .menu-btn i::before { transform: translateY(3.25px) rotate(45deg); }
  .menu-open .menu-btn i::after { transform: translateY(-3.25px) rotate(-45deg); }
  .menu-btn:active { transform: scale(.97); }
  .site-header .brand, .top .logo { position: relative; z-index: 71; }
  #menu { position: fixed; inset: 0; z-index: 70; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 1.6rem; margin: 0; padding: calc(96px + env(safe-area-inset-top, 0px)) 28px calc(40px + env(safe-area-inset-bottom, 0px)); background: rgba(0,0,0,.45); opacity: 0; visibility: hidden; transition: opacity 200ms ease, visibility 0s 200ms; }
  .menu-open #menu { opacity: 1; visibility: visible; transition: opacity 200ms ease; }
  .menu-open, .menu-open body { overflow: hidden; }
  /* Menu ouvert : on cache le contenu de la page, il ne reste que la Terre derrière */
  main, footer, .site-foot, .hud, .pin-label { transition: opacity 200ms ease; }
  .menu-open main, .menu-open footer, .menu-open .site-foot, .menu-open .hud, .menu-open .pin-label { opacity: 0 !important; visibility: hidden; }
  #menu .nav-links { display: flex; flex-direction: column; align-items: flex-start; gap: .5rem; order: 0; width: auto; margin: 0; padding: 0; border: 0; }
  #menu .nav-links a { text-shadow: 0 2px 18px rgba(0,0,0,.6); font: 800 clamp(2.1rem, 10vw, 3rem)/1.08 "Unbounded", "Arial Black", sans-serif; letter-spacing: -0.045em; color: #fff; padding: 0; background: none; box-shadow: none; border-radius: 0; transform: translateY(10px); transition: transform 260ms cubic-bezier(0.23, 1, 0.32, 1), color 200ms ease; }
  .menu-open #menu .nav-links a { transform: none; }
  #menu .nav-links a[aria-current="page"] { color: #5f7dff; }
  #menu > a:not(.btn) { order: 1; margin: 0; padding: 0; color: rgba(255,255,255,.66); font-size: 1rem; letter-spacing: .08em; text-decoration: none; }
  #menu > .btn { order: 2; margin: .4rem 0 0; padding: 0 1.6rem; min-height: 52px; font-size: 1.05rem; background: #002fa7; border-color: transparent; color: #fff; }
}
@media (prefers-reduced-motion: reduce) { #menu, #menu .nav-links a { transition: none !important; } }
