/* =====================================================================
   HOME › FASCIA MARQUEE — fascia Blu MM a tutta larghezza (80px), nomi dei servizi separati da un fulmine.
   Scorrimento infinito solo CSS: la lista e' ripetuta 2 volte e la traccia scorre di meta' (-50%).
   Pausa all'hover; ferma con "riduci movimento". Vedi design/DESIGN.md › Motion 7.
   ===================================================================== */
.wp-block-group.mm-marquee {
  display: flex;
  align-items: center;
  height: 80px;
  margin-block: 32px;
  overflow: hidden;
  user-select: none;
}
.wp-block-group.mm-marquee > *,
.wp-block-group.mm-marquee__track > *,
.wp-block-group.mm-marquee__list > * { margin: 0; }
.wp-block-group.mm-marquee__track,
.wp-block-group.mm-marquee__list { display: flex; flex: none; }
/* testo + 48 + fulmine + 48: ogni elemento porta con se' il suo spazio, cosi' le due copie si raccordano */
.wp-block-group.mm-marquee__list > .mm-marquee__item {
  display: flex;
  align-items: center;
  gap: 48px;
  margin-right: 48px;
  font-family: var(--wp--preset--font-family--plus-jakarta-sans);
  font-size: 17px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .1em;
  text-transform: uppercase;
  white-space: nowrap;
}
/* fulmine 20px in uno spazio largo 25px (come l'emoji ⚡ di Stitch) */
.mm-marquee__item::after {
  content: "";
  flex: none;
  width: 25px;
  height: 20px;
  background-color: var(--wp--preset--color--primary-soft);
  -webkit-mask: var(--mm-ico-bolt-fill) center / 20px no-repeat;
  mask: var(--mm-ico-bolt-fill) center / 20px no-repeat;
}
@media (prefers-reduced-motion: no-preference) {
  .wp-block-group.mm-marquee__track { animation: mm-marquee 40s linear infinite; }
  .wp-block-group.mm-marquee:hover .mm-marquee__track { animation-play-state: paused; }
}
@keyframes mm-marquee { to { transform: translateX(-50%); } }