/* ===================================================================
   CHROME — la cornice comune a tutte le pagine pubbliche:
   interruttore del tema, menu mobile, rifiniture di nav e footer.

   Sta in un file suo perché è l'unica parte davvero condivisa: la nav è
   ripetuta nel markup di ogni pagina (sito statico, niente build), ma il
   comportamento e lo stile vivono qui e in scripts/nav.js.
   =================================================================== */

/* --- interruttore tema --- */
#stageLanding .ltheme{
  display:inline-flex;align-items:center;justify-content:center;
  width:40px;height:40px;flex:0 0 auto;padding:0;cursor:pointer;
  border:1px solid var(--lline2);border-radius:var(--lr-pill);
  background:transparent;color:var(--link);
  transition:border-color .18s ease,background .18s ease,color .18s ease}
#stageLanding .ltheme:hover{background:var(--lpanel2);border-color:var(--ldim)}
#stageLanding .ltheme:focus-visible{outline:2px solid var(--lacc);outline-offset:2px}
/* mezzo cerchio pieno: icona "contrasto", leggibile in entrambi i temi */
#stageLanding .ltheme-ico{
  width:16px;height:16px;border-radius:50%;
  border:1.6px solid currentColor;
  background:linear-gradient(90deg,currentColor 0 50%,transparent 50% 100%);
  transition:transform .25s ease}
html[data-theme="dark"] #stageLanding .ltheme-ico{transform:rotate(180deg)}

/* --- menu mobile ---
   .has-menu la mette scripts/nav.js: senza JS i link restano visibili e
   vanno a capo, invece di sparire lasciando la pagina senza navigazione. */
#stageLanding .lburger{
  display:none;align-items:center;justify-content:center;
  width:40px;height:40px;flex:0 0 auto;padding:0;cursor:pointer;
  border:1px solid var(--lline2);border-radius:var(--lr-pill);
  background:transparent;color:var(--link)}
#stageLanding .lburger:hover{background:var(--lpanel2);border-color:var(--ldim)}
#stageLanding .lburger:focus-visible{outline:2px solid var(--lacc);outline-offset:2px}
#stageLanding .lburger i{position:relative;display:block;width:16px;height:1.5px;
  background:currentColor;transition:transform .2s ease,opacity .2s ease}
#stageLanding .lburger i::before,#stageLanding .lburger i::after{
  content:'';position:absolute;left:0;width:16px;height:1.5px;background:currentColor;
  transition:transform .2s ease}
#stageLanding .lburger i::before{top:-5px}
#stageLanding .lburger i::after{top:5px}
#stageLanding .lburger[aria-expanded="true"] i{background:transparent}
#stageLanding .lburger[aria-expanded="true"] i::before{transform:translateY(5px) rotate(45deg)}
#stageLanding .lburger[aria-expanded="true"] i::after{transform:translateY(-5px) rotate(-45deg)}

#stageLanding .lmobile{
  display:none;border-top:1px solid var(--lline);background:var(--lbg);
  padding:10px 5.2vw 18px}
#stageLanding .lmobile.open{display:block}
#stageLanding .lmobile a{display:block;padding:13px 2px;font-size:16px;color:var(--ltxt);
  border-bottom:1px solid var(--lline-soft)}
#stageLanding .lmobile a:last-of-type{border-bottom:0}
#stageLanding .lmobile .lmobile-cta{display:flex;gap:10px;margin-top:14px}
#stageLanding .lmobile .lmobile-cta .lbtn{flex:1 1 0;justify-content:center}

@media(max-width:820px){
  #stageLanding .lnav.has-menu .llinks{display:none}
  #stageLanding .lnav.has-menu .lburger{display:inline-flex}
  /* su schermo stretto le due CTA testuali stanno nel pannello, non nella barra */
  #stageLanding .lnav.has-menu .lcta .lbtn.ghost{display:none}
}
@media(max-width:520px){
  #stageLanding .lnav.has-menu .lcta .lbtn.primary{display:none}
  #stageLanding .lmobile{padding-left:20px;padding-right:20px}
}
/* senza JS: i link non spariscono, vanno a capo sotto il brand */
@media(max-width:820px){
  #stageLanding .lnav:not(.has-menu) .inner{flex-wrap:wrap;row-gap:8px}
  #stageLanding .lnav:not(.has-menu) .llinks{
    order:3;flex-basis:100%;display:flex;flex-wrap:wrap;gap:12px 18px}
}

/* --- illustrazioni ---
   I diagrammi seguono i token del tema in landing-v3.css; qui manteniamo una
   cornice netta anche sul fondo scuro. */
html[data-theme="dark"] #stageLanding .pv-playbook-map{
  background:var(--lpanel-soft);
  border:1px solid var(--lline);border-radius:var(--lr-md);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.25)}