/* ==========================================================================
   Menu a scomparsa sotto i 1080px.

   Prima di questo foglio, sotto quella soglia il sito non aveva navigazione:
   sulla home `.nav-links` andava a `display:none` senza nulla al suo posto,
   e la pagina prezzi non aveva nemmeno la soglia — sette link piu' due
   pulsanti su una riga sola a 390px.

   Il foglio e' **autosufficiente**: si carica su tutte le pagine, comprese
   quelle che non caricano bmup-home.css (la pagina prezzi porta il suo, con
   token e classi dei bottoni diversi). Quindi ogni var() ha il suo valore di
   ripiego e i bottoni del pannello hanno uno stile proprio, scoped su
   .nav-mob, invece di ereditare .btn dal foglio della pagina.
   ========================================================================== */

.nav-burger{display:none;flex:none;width:42px;height:42px;margin-left:14px;
  align-items:center;justify-content:center;gap:5px;flex-direction:column;
  background:var(--card,#fff);border:1px solid var(--line,#E1E8F1);
  border-radius:10px;cursor:pointer;
  box-shadow:0 1px 2px rgba(15,36,68,.06);transition:border-color .18s ease}
.nav-burger:hover{border-color:#C6D5E6}
.nav-burger-l{display:block;width:18px;height:2px;border-radius:2px;
  background:var(--navy,#0F2444);transition:transform .22s ease,opacity .18s ease}
/* Le tre righe diventano una X quando il pannello e' aperto. */
.nav-burger[aria-expanded="true"] .nav-burger-l:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-burger[aria-expanded="true"] .nav-burger-l:nth-child(2){opacity:0}
.nav-burger[aria-expanded="true"] .nav-burger-l:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.nav-mob-bg{position:fixed;inset:0;z-index:290;background:rgba(10,26,51,.5);
  backdrop-filter:blur(2px);opacity:0;transition:opacity .24s ease}
.nav-mob-bg.on{opacity:1}

.nav-mob{position:fixed;top:0;right:0;bottom:0;z-index:300;
  width:min(340px,86vw);display:flex;flex-direction:column;
  padding:22px 24px calc(24px + env(safe-area-inset-bottom));
  background:var(--card,#fff);border-left:1px solid var(--line,#E1E8F1);
  box-shadow:-30px 0 60px -30px rgba(15,36,68,.45);
  font-family:var(--f-body,"Poppins",system-ui,sans-serif);
  transform:translateX(100%);transition:transform .26s cubic-bezier(.2,.7,.3,1);
  overflow-y:auto;overscroll-behavior:contain}
.nav-mob.on{transform:none}
/* Chi ha chiesto meno animazioni non vuole nemmeno questa. */
@media (prefers-reduced-motion:reduce){
  .nav-mob,.nav-mob-bg{transition:none}
}

.nav-mob-hd{display:flex;align-items:center;justify-content:space-between;
  padding-bottom:16px;border-bottom:1px solid var(--line,#E1E8F1)}
.nav-mob-hd .eyebrow{margin-bottom:0;
  font-family:var(--f-mono,ui-monospace,monospace);font-size:.66rem;
  font-weight:500;letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted,#5C6E88)}
.nav-mob-x{width:38px;height:38px;flex:none;display:flex;align-items:center;
  justify-content:center;font-size:1.6rem;line-height:1;
  color:var(--muted,#5C6E88);background:none;border:0;border-radius:8px;
  cursor:pointer}
.nav-mob-x:hover{color:var(--navy,#0F2444);background:var(--paper,#F2F5FA)}

.nav-mob-links{display:flex;flex-direction:column;padding:8px 0}
.nav-mob-links a{padding:14px 2px;font-size:1.02rem;text-decoration:none;
  color:var(--navy,#0F2444);border-bottom:1px solid var(--line-soft,#EFF3F8)}
.nav-mob-links a:last-child{border-bottom:0}
.nav-mob-links a:hover{color:#0075BC}

/* I bottoni del pannello non ereditano .btn dal foglio della pagina: sulla
   pagina prezzi quelle classi sono altre e uscirebbero senza stile. */
.nav-mob-cta{display:flex;flex-direction:column;gap:10px;margin-top:auto;
  padding-top:20px}
.nav-mob-cta a{display:flex;align-items:center;justify-content:center;
  padding:13px 18px;border-radius:12px;font-size:.95rem;font-weight:500;
  text-decoration:none;border:1px solid transparent;transition:background .18s ease,border-color .18s ease}
.nav-mob-cta a:first-child{background:var(--navy,#0F2444);color:#fff}
.nav-mob-cta a:first-child:hover{background:var(--ink,#0A1A33)}
.nav-mob-cta a:last-child{background:var(--card,#fff);
  border-color:var(--line,#E1E8F1);color:var(--navy,#0F2444)}
.nav-mob-cta a:last-child:hover{border-color:#C6D5E6}

.nav-mob-note{margin-top:14px;font-size:.72rem;line-height:1.5;
  font-family:var(--f-mono,ui-monospace,monospace);color:var(--muted,#5C6E88)}

@media (max-width:1080px){
  .nav-burger{display:flex}
  /* La pagina prezzi non aveva nessuna soglia sulla nav. */
  #bmup-lp .nav-links{display:none}
  #bmup-lp .nav-right .btn-ghost{display:none}
}
/* Sopra la soglia il pannello non deve poter comparire nemmeno per sbaglio. */
@media (min-width:1081px){
  .nav-mob,.nav-mob-bg,.nav-burger{display:none !important}
}
/* Con il pannello aperto la pagina sotto non scorre. */
body.nav-aperto{overflow:hidden}
