/* ONMAKE — movimento in piu' per le pagine di apertura (assets/moto-plus.js). */
.mp-hero { position: relative; isolation: isolate; overflow: hidden; }
.mp-gradiente { position: absolute; inset: -20%; z-index: -1; pointer-events: none; opacity: .55;
  background:
    radial-gradient(38% 42% at 18% 30%, rgba(255,107,26,.18), transparent 70%),
    radial-gradient(34% 40% at 82% 22%, rgba(59,130,246,.16), transparent 70%),
    radial-gradient(40% 46% at 55% 85%, rgba(168,85,247,.14), transparent 70%);
  animation: mp-deriva 26s ease-in-out infinite alternate; }
@keyframes mp-deriva { from { translate: -3% -2%; scale: 1; } to { translate: 3% 2%; scale: 1.08; } }
.mp-parola { display: inline-block; animation: mp-sale .7s cubic-bezier(.2,.7,.2,1) both; }
.mp-pezzo { animation: mp-sale .7s cubic-bezier(.2,.7,.2,1) both; }
@keyframes mp-sale { from { opacity: .35; translate: 0 .35em; } to { opacity: 1; translate: 0 0; } }
.mp-onda { position: absolute; left: 0; right: 0; bottom: -1px; height: 42px; z-index: 0; pointer-events: none; line-height: 0; }
.mp-onda svg { width: 100%; height: 100%; display: block; }
@media (max-width: 640px) { .mp-onda { height: 24px; } }
html.fermo .mp-gradiente, html.fermo .mp-parola, html.fermo .mp-pezzo { animation: none !important; }
@media (prefers-reduced-motion: reduce) { .mp-gradiente, .mp-parola, .mp-pezzo { animation: none !important; } }
.mp-hero > .mp-gradiente, .mp-hero > .mp-onda { position: absolute !important; margin: 0 !important; }
.mp-hero > .mp-gradiente { inset: -20% !important; }
.mp-hero > .mp-onda { left: 0 !important; right: 0 !important; bottom: -1px !important; top: auto !important; }