/* =============================================================================
   SXP Mega menu — front
   Usa i token del tema Snopex (--sxp-*) con valori di riserva, così funziona
   anche con un altro tema. Primitive del tema usate nel markup: .sxp-glass, .sxp-pill, .sxp-eyebrow
   ============================================================================= */

.sxp-mm,
.sxp-mm-canvas {
  --mm-ink: var(--sxp-ink, #0f1113);
  --mm-ink-rgb: var(--sxp-ink-rgb, 15, 17, 19);
  --mm-text: var(--sxp-text, #23272c);
  --mm-muted: var(--sxp-muted, #5b6168);
  --mm-accent: var(--sxp-accent, #e63226);
  --mm-accent-text: var(--sxp-accent-text, #cf2a1f);
  --mm-accent-soft: var(--sxp-accent-soft, rgba(230, 50, 38, .1));
  --mm-line: var(--sxp-line, rgba(15, 17, 19, .09));
  --mm-display: var(--sxp-font-display, inherit);
  --mm-radius: var(--sxp-radius-xl, 28px);
  --mm-radius-md: var(--sxp-radius-md, 16px);
  --mm-ease: var(--sxp-ease, cubic-bezier(.2, .7, .2, 1));
  --mm-dur: var(--sxp-dur, .22s);
}
.sxp-mm { display: flex; align-items: center; }

/* ----- Desktop: barra ----------------------------------------------------- */
.sxp-mm__nav { display: none; }
@media (min-width: 1200px) {
  .sxp-mm { align-self: stretch; }
  .sxp-mm__nav { display: flex; align-items: stretch; height: 100%; min-width: 0; }
  .sxp-mm__burger { display: none !important; }
}

.sxp-mm__bar {
  display: flex;
  align-items: stretch;
  gap: .125rem;
  height: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  white-space: nowrap;
}
.sxp-mm__item { display: flex; align-items: center; position: static; }

.sxp-mm__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .375rem;
  padding: .5rem .875rem;
  border-radius: 999px;
  font-family: var(--mm-display);
  font-size: .9375rem;
  font-weight: 500;
  color: var(--mm-ink) !important;
  text-decoration: none;
  transition: background-color var(--mm-dur) var(--mm-ease), color var(--mm-dur) var(--mm-ease);
}
.sxp-mm__item.has-panel .sxp-mm__link { padding-right: .375rem; }
.sxp-mm__item:hover > .sxp-mm__link,
.sxp-mm__item.is-open > .sxp-mm__link { background: rgba(var(--mm-ink-rgb), .06); }
.sxp-mm__link.is-current::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: .25rem;
  width: 1rem;
  height: 2px;
  border-radius: 2px;
  background: var(--mm-accent);
  transform: translateX(-50%);
}
.sxp-mm__link.is-accent { color: var(--mm-accent-text) !important; }
.sxp-mm__link.is-dark { background: var(--mm-ink); color: #fff !important; }
.sxp-mm__item:hover > .sxp-mm__link.is-dark { background: var(--sxp-ink-2, #1b1f24); }

.sxp-mm__toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  margin-left: -.125rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--mm-muted);
  cursor: pointer;
  transition: transform var(--mm-dur) var(--mm-ease), background-color var(--mm-dur) var(--mm-ease);
}
.sxp-mm__toggle .material-icons { font-size: 1.125rem; }
.sxp-mm__toggle:hover { background: rgba(var(--mm-ink-rgb), .06); color: var(--mm-ink); }
.sxp-mm__item.is-open > .sxp-mm__toggle { transform: rotate(180deg); color: var(--mm-ink); }

.sxp-mm__badge {
  display: inline-flex;
  align-items: center;
  padding: .0625rem .4375rem;
  border-radius: 999px;
  background: var(--mm-accent-soft);
  color: var(--mm-accent-text);
  font-family: var(--mm-display);
  font-size: .625rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  line-height: 1.5;
}

/* ----- Desktop: pannello -------------------------------------------------- */
/* Posizionato rispetto all'header (sticky): occupa la larghezza del contenuto,
   centrato, staccato di poco con un "ponte" invisibile per il mouse. */
.sxp-mm__panel {
  position: absolute;
  top: 100%;
  left: 50%;
  z-index: 1035;
  width: min(1140px, calc(100vw - 2rem));
  padding-top: .5rem;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate(-50%, 6px);
  transition: opacity .18s var(--mm-ease), transform .18s var(--mm-ease), visibility 0s linear .18s;
}
.sxp-mm__item.is-open > .sxp-mm__panel,
html:not(.sxp-mm-ready) .sxp-mm__item:hover > .sxp-mm__panel,
html:not(.sxp-mm-ready) .sxp-mm__item:focus-within > .sxp-mm__panel {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(-50%, 0);
  transition: opacity .18s var(--mm-ease), transform .18s var(--mm-ease), visibility 0s;
}
.sxp-mm__panel-inner {
  max-height: calc(100vh - var(--sxp-header-h, 7rem) - 2rem);
  overflow-y: auto;
  padding: 1.75rem;
  border-radius: var(--mm-radius);
  white-space: normal;
  overscroll-behavior: contain;
}
.sxp-mm__panel-inner.sxp-glass {
  background: rgba(255, 255, 255, .95);
  box-shadow: var(--sxp-shadow-lg, 0 24px 60px -20px rgba(15, 17, 19, .28));
}

.sxp-mm__grid {
  display: grid;
  grid-template-columns: repeat(var(--sxp-mm-cols, 4), minmax(0, 1fr));
  gap: 1.75rem 2rem;
  align-items: start;
}

/* Colonna: titolo + link */
.sxp-mm__heading {
  display: inline-flex;
  align-items: center;
  gap: .375rem;
  margin-bottom: .625rem;
  font-family: var(--mm-display);
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: -.01em;
  color: var(--mm-ink) !important;
  text-decoration: none;
}
.sxp-mm__heading:hover { color: var(--mm-accent-text) !important; }
.sxp-mm__heading.is-accent { color: var(--mm-accent-text) !important; }
.sxp-mm__links { margin: 0; padding: 0; list-style: none; }
.sxp-mm__links li + li { margin-top: .125rem; }
.sxp-mm__sublink {
  display: inline-flex;
  align-items: center;
  gap: .375rem;
  padding: .25rem 0;
  font-size: .9375rem;
  color: var(--mm-muted) !important;
  text-decoration: none;
  transition: color var(--mm-dur) var(--mm-ease), transform var(--mm-dur) var(--mm-ease);
}
.sxp-mm__sublink:hover { color: var(--mm-ink) !important; transform: translateX(3px); }
.sxp-mm__sublink.is-current { color: var(--mm-accent-text) !important; font-weight: 500; }
.sxp-mm__sublink.is-accent { color: var(--mm-accent-text) !important; }

/* Blocco di testo */
.sxp-mm__text {
  padding: 1.25rem;
  border-radius: var(--mm-radius-md);
  background: rgba(var(--mm-ink-rgb), .04);
  font-size: .9375rem;
  color: var(--mm-text);
}
.sxp-mm__text-title {
  margin: .25rem 0 .5rem;
  font-family: var(--mm-display);
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.2;
  color: var(--mm-ink);
}
.sxp-mm__text-body > :last-child { margin-bottom: 0; }
.sxp-mm__text .sxp-mm__cta { margin-top: .875rem; }
.sxp-mm__text.is-accent { background: var(--mm-accent-soft); }
.sxp-mm__text.is-dark { background: var(--mm-ink); color: rgba(255, 255, 255, .75); }
.sxp-mm__text.is-dark .sxp-mm__text-title { color: #fff; }
.sxp-mm__text.is-dark .sxp-eyebrow { color: #ff8a80; }

/* Banner */
.sxp-mm__banner {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: var(--mm-radius-md);
  background: #fff;
  border: 1px solid var(--mm-line);
  color: var(--mm-text) !important;
  text-decoration: none;
  transition: transform var(--mm-dur) var(--mm-ease), box-shadow var(--mm-dur) var(--mm-ease);
}
a.sxp-mm__banner:hover { transform: translateY(-2px); box-shadow: var(--sxp-shadow-md, 0 8px 24px -10px rgba(15, 17, 19, .16)); }
.sxp-mm__banner-media { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--sxp-well, #eef0f2); }
.sxp-mm__banner-media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--mm-ease); }
a.sxp-mm__banner:hover .sxp-mm__banner-media img { transform: scale(1.04); }
.sxp-mm__banner-body { display: flex; flex-direction: column; align-items: flex-start; gap: .25rem; padding: .875rem 1rem 1rem; }
.sxp-mm__banner-title { font-family: var(--mm-display); font-weight: 600; font-size: 1rem; color: var(--mm-ink); line-height: 1.25; }
.sxp-mm__banner-text { font-size: .875rem; color: var(--mm-muted); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.sxp-mm__banner .sxp-mm__cta { margin-top: .5rem; }

.sxp-mm__cta .material-icons, .sxp-mm__all .material-icons { font-size: 1rem; }

/* Piede del pannello */
.sxp-mm__panel-foot {
  display: flex;
  justify-content: flex-end;
  margin-top: 1.5rem;
  padding-top: 1rem;
  border-top: 1px solid var(--mm-line);
}
.sxp-mm__all { gap: .375rem; }

/* ----- Burger --------------------------------------------------------------- */
.sxp-mm__burger .header-block__action-btn { color: var(--mm-ink); }

/* ----- Mobile: offcanvas ---------------------------------------------------- */
.offcanvas.sxp-mm-canvas { --bs-offcanvas-bg: rgba(255, 255, 255, .97); }
.sxp-mm-canvas .offcanvas-header { padding: 1rem 1.25rem .5rem; }
.sxp-mm-canvas .offcanvas-title {
  margin: 0;
  font-family: var(--sxp-font-display, inherit);
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--sxp-ink, #0f1113);
}
.sxp-mm-canvas .offcanvas-body { padding: .25rem 1.25rem 1.5rem; display: flex; flex-direction: column; }

.sxp-mm-m { margin: 0; padding: 0; list-style: none; }
.sxp-mm-m__item { border-bottom: 1px solid var(--sxp-line, rgba(15, 17, 19, .09)); }

.sxp-mm-m__top,
.sxp-mm-m__summary {
  display: flex;
  align-items: center;
  gap: .5rem;
  min-height: 3.25rem;
  padding: .75rem .125rem;
  font-family: var(--sxp-font-display, inherit);
  font-size: 1.0625rem;
  font-weight: 600;
  color: var(--sxp-ink, #0f1113) !important;
  text-decoration: none;
  cursor: pointer;
  list-style: none;
}
.sxp-mm-m__summary::-webkit-details-marker,
.sxp-mm-m__subsummary::-webkit-details-marker { display: none; }
.sxp-mm-m__summary .material-icons,
.sxp-mm-m__subsummary .material-icons {
  margin-left: auto;
  color: var(--sxp-muted, #5b6168);
  transition: transform var(--sxp-dur, .22s) var(--sxp-ease, ease);
}
.sxp-mm-m__group[open] > .sxp-mm-m__summary .material-icons,
.sxp-mm-m__sub[open] > .sxp-mm-m__subsummary .material-icons { transform: rotate(180deg); }
.sxp-mm-m__summary.is-accent, .sxp-mm-m__top.is-accent { color: var(--sxp-accent-text, #cf2a1f) !important; }

.sxp-mm-m__panel { padding: 0 0 .875rem .25rem; }
.sxp-mm-m__all {
  display: inline-flex;
  align-items: center;
  gap: .375rem;
  margin: 0 0 .5rem;
  padding: .375rem .875rem;
  border-radius: 999px;
  background: var(--sxp-ink, #0f1113);
  color: #fff !important;
  font-size: .875rem;
  font-weight: 600;
  text-decoration: none;
}
.sxp-mm-m__all .material-icons { font-size: 1rem; }
.sxp-mm-m__subsummary {
  display: flex;
  align-items: center;
  min-height: 2.75rem;
  padding: .5rem 0;
  font-weight: 600;
  color: var(--sxp-ink, #0f1113);
  cursor: pointer;
  list-style: none;
}
.sxp-mm-m__links { margin: 0 0 .5rem; padding: 0 0 0 .75rem; list-style: none; border-left: 2px solid var(--sxp-line, rgba(15, 17, 19, .09)); }
.sxp-mm-m__link {
  display: flex;
  align-items: center;
  gap: .375rem;
  min-height: 2.5rem;
  padding: .375rem 0;
  color: var(--sxp-muted, #5b6168) !important;
  text-decoration: none;
}
.sxp-mm-m__link.is-parent { font-weight: 600; color: var(--sxp-ink, #0f1113) !important; }
.sxp-mm-m__link.is-current { color: var(--sxp-accent-text, #cf2a1f) !important; }
.sxp-mm-m__panel > .sxp-mm-m__link { min-height: 2.75rem; color: var(--sxp-ink, #0f1113) !important; font-weight: 500; }
.sxp-mm-m__block { margin: .5rem 0; }
.sxp-mm-m__block .sxp-mm__banner { flex-direction: row; }
.sxp-mm-m__block .sxp-mm__banner-media { flex: 0 0 38%; aspect-ratio: auto; }

.sxp-mm-m__extra { margin-top: auto; padding-top: 1.5rem; display: flex; flex-direction: column; gap: .75rem; }
.sxp-mm-m__selects { display: flex; flex-wrap: wrap; gap: .5rem; }
.sxp-mm-m__selects .form-select { min-height: 2.5rem; border-radius: 999px; width: auto; }
.sxp-mm-m__extra .contact-link, .sxp-mm-m__extra .ps-contactinfo a { font-size: .875rem; color: var(--sxp-muted, #5b6168); }

@media (prefers-reduced-motion: reduce) {
  .sxp-mm__panel, .sxp-mm__toggle, .sxp-mm__sublink, .sxp-mm__banner, .sxp-mm__banner-media img { transition: none !important; }
}