/* Menu in alto e menu a tutto schermo (components/layout/navbar.inc.php) */

.nav {
  position: fixed; inset: 0 0 auto 0; z-index: 50;
  height: var(--nav-h);
  display: flex; align-items: center;
  transition: background-color .5s var(--esce), box-shadow .5s var(--esce), transform .5s var(--esce);
}
.nav.solida { background: rgba(0, 26, 68, .96); box-shadow: 0 1px 0 var(--filo-blu), 0 12px 32px -20px rgba(0, 0, 0, .6); }
@supports (backdrop-filter: blur(1px)) {
  .nav.solida { background: rgba(0, 26, 68, .86); backdrop-filter: saturate(140%) blur(14px); }
}
.nav .contenitore { display: flex; align-items: center; gap: 2rem; }
.nav .marchio { font-size: 1.05rem; color: var(--bianco); }
.nav__voci { display: flex; gap: clamp(1rem, 1.8vw, 2rem); margin-left: auto; align-items: center; }
.nav__voci a {
  position: relative; text-decoration: none; font-weight: 550; font-size: .9375rem; font-stretch: 105%;
  color: var(--su-blu-2); padding: .4rem 0; transition: color .3s;
}
.nav__voci a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--menta);
  transform: scaleX(0); transform-origin: left; transition: transform .45s var(--esce);
}
.nav__voci a:hover, .nav__voci a[aria-current="true"] { color: var(--bianco); }
.nav__voci a:hover::after, .nav__voci a[aria-current="true"]::after { transform: scaleX(1); }
.nav .azione { min-height: 2.75rem; padding: 0 1.1rem; font-size: .9375rem; }
.nav__menu { display: none; margin-left: auto; background: none; border: 1px solid var(--filo-blu); width: 3rem; height: 3rem; cursor: pointer; align-items: center; justify-content: center; }
.nav__menu svg { width: 1.4rem; height: 1.4rem; }

@media (max-width: 1060px) {
  .nav__voci { display: none; }
  .nav__menu { display: inline-flex; }
  .nav .azione { margin-left: 0; }
}
@media (max-width: 520px) {
  .nav .azione { display: none; }
}

/* Menu a tutto schermo (mobile) */
.menu {
  position: fixed; inset: 0; z-index: 60;
  background: var(--blu);
  display: flex; flex-direction: column;
  padding: 1rem var(--gutter) 2rem;
  clip-path: inset(0 0 100% 0);
  visibility: hidden;
  transition: clip-path .6s var(--esce), visibility 0s .6s;
}
.menu.aperto { clip-path: inset(0 0 0 0); visibility: visible; transition: clip-path .6s var(--esce), visibility 0s; }
.menu__testa { display: flex; align-items: center; justify-content: space-between; height: calc(var(--nav-h) - 1rem); }
.menu__testa .marchio { font-size: 1.05rem; }
.menu__chiudi { background: none; border: 1px solid var(--filo-blu); width: 3rem; height: 3rem; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.menu__chiudi svg { width: 1.3rem; height: 1.3rem; }
.menu nav { margin-top: 2.5rem; }
.menu nav a {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: .85rem 0; border-bottom: 1px solid var(--filo-blu);
  font-size: clamp(1.75rem, 7vw, 2.5rem); font-weight: 800; font-stretch: 118%; letter-spacing: -0.02em;
  text-decoration: none;
}
.menu nav a span { font-size: var(--t-piccolo); font-weight: 500; font-stretch: 100%; color: var(--su-blu-3); letter-spacing: 0; }
.menu .azione { margin-top: auto; justify-content: center; }
.menu__tel { margin-top: 1rem; text-align: center; color: var(--su-blu-2); }