/* =========================================================
   MENU MOBILE FILMAKERS — partagé par toutes les pages
   À charger APRÈS le <style> de la page (juste avant </head>).
   Le préfixe header#hdr garantit qu'il passe devant les styles inline.
   ========================================================= */
#hdr .burger span{border-radius:2px;
  transition:background .22s cubic-bezier(0.23,1,0.32,1),transform .36s cubic-bezier(0.23,1,0.32,1),opacity .2s;}
#hdr .burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
#hdr .burger[aria-expanded="true"] span:nth-child(2){opacity:0;transform:scaleX(0.4);}
#hdr .burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

@media(max-width:640px){
  header#hdr .burger{display:flex;position:relative;z-index:2;}
  header#hdr .nlinks,header#hdr .nlinks.open{position:fixed;inset:74px 0 0 0;z-index:1;display:flex;flex-direction:column;
    align-items:stretch;gap:0;background:#0E0E10;padding:18px 20px calc(28px + env(safe-area-inset-bottom));
    opacity:0;visibility:hidden;pointer-events:none;
    transition:opacity .3s cubic-bezier(0.23,1,0.32,1),visibility 0s linear .3s;}
  header#hdr .nlinks::before{content:"";position:absolute;top:-30%;left:50%;transform:translateX(-50%);width:600px;height:420px;
    background:radial-gradient(ellipse at center,rgba(255,45,45,0.16),transparent 65%);pointer-events:none;}
  header#hdr .nlinks.open{opacity:1;visibility:visible;pointer-events:auto;
    transition:opacity .3s cubic-bezier(0.23,1,0.32,1),visibility 0s;}
  header#hdr .nlinks a{position:relative;color:#fff;font-size:30px;font-weight:800;letter-spacing:-.03em;line-height:1.2;
    padding:16px 0;border-bottom:1px solid rgba(255,255,255,0.14);background:none;border-radius:0;
    opacity:0;transform:translateY(14px);
    transition:opacity .4s cubic-bezier(0.23,1,0.32,1),transform .5s cubic-bezier(0.23,1,0.32,1),color .16s;}
  header#hdr .nlinks a:not(.cta):not(.nav-cta)::after{content:"→";position:absolute;right:2px;top:50%;transform:translateY(-50%);
    font-size:20px;font-weight:500;color:#FF2D2D;}
  header#hdr .nlinks a.cta,header#hdr .nlinks a.nav-cta{margin-top:auto;text-align:center;font-size:16px;font-weight:700;letter-spacing:0;
    padding:17px 18px;border-radius:12px;border-bottom:0;background:#D11616;color:#fff;}
  header#hdr .nlinks.open a{opacity:1;transform:none;}
  header#hdr .nlinks.open a:nth-child(1){transition-delay:.05s;}
  header#hdr .nlinks.open a:nth-child(2){transition-delay:.1s;}
  header#hdr .nlinks.open a:nth-child(3){transition-delay:.15s;}
  header#hdr .nlinks.open a:nth-child(4){transition-delay:.2s;}
  header#hdr .nlinks.open a:nth-child(5){transition-delay:.25s;}
  /* le flou de l'en-tête enferme les éléments fixed : en mode menu, l'en-tête couvre tout l'écran */
  header#hdr.menu{bottom:0;background:#0E0E10;border-bottom-color:transparent;
    backdrop-filter:none;-webkit-backdrop-filter:none;}
  header#hdr.menu .nav{border-bottom:1px solid rgba(255,255,255,0.14);}
  header#hdr.menu .logo-blanc{opacity:1;}
  header#hdr.menu .logo-noir{opacity:0;}
  header#hdr.menu .burger span{background:#fff;}
}