/* ============================================================
   MENU DI NAVIGAZIONE GLOBALE — renexhibitions.com
   Barra superiore + fascia di collegamenti nel footer.
   Caricato dal header comune su tutte le pagine.
   ============================================================ */

:root{
  --m-inchiostro:#2E2536;
  --m-grigio:#6F6779;
  --m-viola:#6636A0;
  --m-ocra:#D5811A;
  --m-bianco:#FFFFFF;
  --m-filo:#E9E4EF;
  --m-etichetta:"Archivo","Helvetica Neue",Arial,sans-serif;
  --m-display:"Playfair Display",Didot,serif;
}

/* ---------- barra superiore ---------- */
.menu-sito{
  background:var(--m-bianco);
  border-bottom:1px solid var(--m-filo);
  font-family:var(--m-etichetta);
  position:relative;
  z-index:50;
}
.menu-sito .menu-riga{
  max-width:1100px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;padding:10px clamp(16px,4vw,32px);
}
.menu-sito .menu-marchio{
  text-decoration:none;display:flex;align-items:baseline;gap:8px;
  font-weight:800;font-size:15px;color:var(--m-inchiostro);letter-spacing:.01em;
  white-space:nowrap;
}
.menu-sito .menu-marchio .fb{
  font-family:var(--m-display);font-weight:800;text-transform:uppercase;
  font-size:17px;letter-spacing:.04em;
}
.menu-sito .menu-marchio .sicilia{
  font-weight:600;font-size:11px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--m-grigio);
}
.menu-sito ul{
  list-style:none;display:flex;gap:clamp(10px,2vw,26px);
  margin:0;padding:0;align-items:center;
}
.menu-sito ul a{
  text-decoration:none;display:flex;align-items:center;gap:7px;
  font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--m-grigio);padding:8px 2px;border-bottom:2px solid transparent;
  white-space:nowrap;
}
.menu-sito ul a:hover{color:var(--m-inchiostro)}
.menu-sito ul a .punto{
  width:8px;height:8px;border-radius:50%;flex:none;
}
.menu-sito ul a.pa .punto{background:var(--m-viola)}
.menu-sito ul a.ag .punto{background:var(--m-ocra)}
.menu-sito ul a[aria-current="page"]{color:var(--m-inchiostro)}
.menu-sito ul a.pa[aria-current="page"]{border-bottom-color:var(--m-viola)}
.menu-sito ul a.ag[aria-current="page"]{border-bottom-color:var(--m-ocra)}
.menu-sito ul a.home[aria-current="page"]{border-bottom-color:var(--m-inchiostro)}

/* pulsante hamburger: nascosto su desktop */
.menu-apri,.menu-chiudi{
  display:none;background:none;border:1.5px solid var(--m-filo);border-radius:6px;
  padding:8px 10px;cursor:pointer;line-height:0;
}
.menu-apri svg,.menu-chiudi svg{width:20px;height:20px;stroke:var(--m-inchiostro);stroke-width:2.2;fill:none;stroke-linecap:round}
.menu-apri:focus-visible,.menu-chiudi:focus-visible{outline:3px solid var(--m-ocra);outline-offset:2px}

/* velo e intestazione del pannello: esistono solo su smartphone */
.menu-velo{display:none}
.pannello-testa{display:none}

/* ---------- versione smartphone: pannello a scorrimento laterale ---------- */
@media (max-width:820px){
  .menu-apri{display:block}

  /* velo scuro sul contenuto */
  .menu-velo{
    display:block;position:fixed;inset:0;z-index:70;
    background:rgba(30,20,40,.45);
    opacity:0;pointer-events:none;
    transition:opacity .3s ease;
  }
  .menu-sito.aperto .menu-velo{opacity:1;pointer-events:auto}

  /* pannello che scivola da destra */
  .menu-sito nav{
    position:fixed;top:0;right:0;bottom:0;z-index:80;
    width:min(320px,84vw);height:100dvh;
    background:var(--m-bianco);
    box-shadow:-14px 0 44px rgba(30,20,40,.25);
    transform:translateX(105%);
    visibility:hidden;
    transition:transform .38s cubic-bezier(.22,.61,.36,1), visibility 0s linear .38s;
    display:flex;flex-direction:column;
    overflow-y:auto;overscroll-behavior:contain;
    border-top:0;
  }
  .menu-sito.aperto nav{
    transform:translateX(0);
    visibility:visible;
    transition:transform .38s cubic-bezier(.22,.61,.36,1);
  }

  /* intestazione del pannello con titolo e chiusura */
  .pannello-testa{
    display:flex;align-items:center;justify-content:space-between;
    padding:14px 18px;border-bottom:1px solid var(--m-filo);
  }
  .pannello-testa span{
    font-weight:800;font-size:12px;letter-spacing:.24em;text-transform:uppercase;
    color:var(--m-grigio);
  }
  .menu-chiudi{display:block}

  /* voci del pannello */
  .menu-sito ul{
    flex-direction:column;align-items:stretch;gap:0;
    padding:8px 18px 20px;
  }
  .menu-sito ul a{
    padding:16px 4px;font-size:13.5px;
    border-bottom:1px solid var(--m-filo);
    white-space:normal;
  }
  .menu-sito ul li:last-child a{border-bottom-color:transparent}
  .menu-sito ul a[aria-current="page"]{font-weight:800}
  .menu-sito ul a.pa[aria-current="page"]{color:var(--m-viola)}
  .menu-sito ul a.ag[aria-current="page"]{color:var(--m-ocra)}

  /* blocco dello scorrimento della pagina quando il pannello è aperto */
  html.menu-bloccato,html.menu-bloccato body{overflow:hidden}
}

/* movimento ridotto: niente animazioni per chi le disattiva */
@media (prefers-reduced-motion:reduce){
  .menu-velo,.menu-sito nav,.menu-sito.aperto nav{transition:none}
}

/* ---------- fascia di collegamenti nel footer ---------- */
.rete-piede{
  background:var(--m-inchiostro);color:#B9AFC6;
  font-family:var(--m-etichetta);
  padding:clamp(22px,4vw,34px) clamp(16px,4vw,32px);
}
.rete-piede .rete-riga{
  max-width:1100px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;
}
.rete-piede .rete-titolo{
  font-family:var(--m-display);font-weight:700;font-size:15px;color:var(--m-bianco);
  letter-spacing:.06em;text-transform:uppercase;
}
.rete-piede .rete-titolo small{
  display:block;font-family:var(--m-etichetta);font-weight:500;font-size:11px;
  letter-spacing:.2em;color:#B9AFC6;margin-top:3px;text-transform:uppercase;
}
.rete-piede ul{list-style:none;margin:0;padding:0;display:flex;gap:clamp(12px,2.5vw,28px);flex-wrap:wrap}
.rete-piede a{
  text-decoration:none;color:#D8D0E4;display:flex;align-items:center;gap:7px;
  font-weight:600;font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  padding:4px 0;
}
.rete-piede a:hover{color:var(--m-bianco)}
.rete-piede a .punto{width:7px;height:7px;border-radius:50%;flex:none}
.rete-piede a.pa .punto{background:var(--m-viola);filter:brightness(1.5)}
.rete-piede a.ag .punto{background:var(--m-ocra)}
.rete-piede a[aria-current="page"]{color:var(--m-bianco);font-weight:800}
@media (max-width:820px){
  .rete-piede .rete-riga{flex-direction:column;align-items:flex-start}
  .rete-piede ul{flex-direction:column;gap:4px}
}