/* =====================================================================
   KIT MOTION ARCA, stati iniziali e fallback
   Va caricato nel <head> PRIMA del contenuto, insieme allo snippet inline
   che mette la classe .motion su <html> (vedi README.md).

   Regola di sicurezza, gli elementi animati sono nascosti SOLO se <html>
   ha la classe .motion. Senza JS, con movimento ridotto o se motion.js non
   arriva entro 3 s, la classe non c'è e tutto resta visibile allo stato finale.
   ===================================================================== */

/* --- Lenis (equivalente di vendor/lenis.css, incluso qui per una richiesta in meno) --- */
html.lenis, html.lenis body { height: auto; }
.lenis:not(.lenis-autoToggle).lenis-stopped { overflow: clip; }
.lenis [data-lenis-prevent], .lenis [data-lenis-prevent-wheel], .lenis [data-lenis-prevent-touch],
.lenis [data-lenis-prevent-vertical], .lenis [data-lenis-prevent-horizontal] { overscroll-behavior: contain; }
.lenis.lenis-smooth iframe { pointer-events: none; }
.lenis.lenis-autoToggle { transition-property: overflow; transition-duration: 1ms; transition-behavior: allow-discrete; }

/* --- Stati iniziali, solo con motion attivo --- */
.motion [data-reveal],
.motion [data-reveal-group] > * { opacity: 0; }

/* Il titolo spezzato resta visibile, è SplitText a nascondere le parti appena create.
   Evita il lampo di testo intero prima della divisione. */
.motion [data-split] { visibility: hidden; }
.motion [data-split].is-split { visibility: visible; }

/* Maschera delle righe di SplitText (mask:"lines"), un filo di spazio per le discendenti */
.motion [data-split] [class$="-mask"] { padding-bottom: .08em; margin-bottom: -.08em; }

/* Parallax, la scala che copre lo spostamento la imposta motion.js */
[data-parallax] { overflow: hidden; }
.motion [data-parallax] > img,
.motion [data-parallax] > picture > img,
.motion [data-parallax] > video { will-change: transform; }

/* --- Movimento ridotto, stato finale ESPLICITO (regola ferrea 13) --- */
@media (prefers-reduced-motion: reduce) {
  [data-reveal], [data-reveal-group] > *, [data-split] {
    opacity: 1 !important; visibility: visible !important;
    transform: none !important; animation: none !important;
  }
  [data-parallax] > img, [data-parallax] > picture > img, [data-parallax] > video { scale: 1 !important; transform: none !important; }
}