/* ===================================================================
   Mio Toolkit 0.3 — parte fissa.
   Posizioni, larghezze, livelli, bordi e tutte le regole per tablet e mobile
   sono generati in PHP (includes/css.php) con i punti di rottura di WordPress.
   Canali: translate = posizione + uscita + comparsa + parallax; transform = movimento continuo;
   opacity/scale = comparsa.
   =================================================================== */

/* Nessuna pagina può scorrere in orizzontale, anche se un elemento sborda */
body {
	overflow-x: clip;
}

/* ---------- Contenitore a livelli ---------- */
.plur-scene {
	position: relative;
	isolation: isolate;
	overflow: clip;
}
.plur-scene.plur-scene-overflow {
	overflow: visible;
	z-index: 5;
}
.plur-scene > :not(.plur-pos) {
	position: relative;
	z-index: 3; /* il contenuto normale è il livello 3 */
}

/* ---------- Canale "translate" comune ---------- */
.plur-pos,
.plur-enter,
.plur-scroll {
	translate:
		calc(var(--plur-tx, 0%) + var(--plur-ox, 0%) + var(--plur-enter-x, 0px))
		calc(var(--plur-ty, 0%) + var(--plur-oy, 0%) + var(--plur-enter-y, 0px) + var(--plur-scroll-y, 0px));
}

/* ---------- Elementi posizionati (base desktop) ---------- */
.plur-pos {
	--plur-inset: 4%;
}
.plur-scene > .plur-pos {
	position: absolute;
	margin: 0 !important;
	max-width: none;
}
.plur-scene > .plur-pos.wp-block-image img {
	width: 100%;
	height: auto;
}

/* ---------- Comparsa ---------- */
.plur-js .plur-enter {
	transition:
		opacity 0.8s ease,
		translate 0.8s cubic-bezier(0.2, 0.7, 0.2, 1),
		scale 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.plur-js .plur-enter.plur-entered {
	transition: none;
}
.plur-js .plur-enter:not(.is-visible)             { opacity: 0; }
.plur-js .plur-enter-none:not(.is-visible)        { opacity: 1; }
.plur-js .plur-enter-fade-up:not(.is-visible)     { --plur-enter-y: 32px; }
.plur-js .plur-enter-slide-left:not(.is-visible)  { --plur-enter-x: -48px; }
.plur-js .plur-enter-slide-right:not(.is-visible) { --plur-enter-x: 48px; }
.plur-js .plur-enter-zoom-in:not(.is-visible)     { scale: 0.92; }

/* ---------- Movimento continuo ---------- */
@keyframes plur-float {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-14px); }
}
@keyframes plur-float-slow {
	0%, 100% { transform: translateY(0) rotate(0deg); }
	50% { transform: translateY(-24px) rotate(2deg); }
}
@keyframes plur-spin {
	to { transform: rotate(360deg); }
}
@keyframes plur-pulse {
	0%, 100% { transform: scale(1); }
	50% { transform: scale(1.05); }
}
.plur-loop-float      { animation: plur-float 6s ease-in-out infinite; }
.plur-loop-float-slow { animation: plur-float-slow 11s ease-in-out infinite; }
.plur-loop-spin-slow  { animation: plur-spin 40s linear infinite; }
.plur-loop-pulse      { animation: plur-pulse 4s ease-in-out infinite; }

/* Scritta scorrevole */
.plur-loop-marquee {
	overflow: hidden;
	white-space: nowrap;
	max-width: none;
}
.plur-marquee-track {
	display: inline-flex;
	width: max-content;
	animation: plur-marquee var(--plur-marquee-duration, 30s) linear infinite;
}
.plur-marquee-half {
	flex: none;
}
@keyframes plur-marquee {
	to { transform: translateX(-50%); }
}
.plur-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* ---------- Scroll (parallax): il valore lo calcola toolkit.js ---------- */
.plur-scroll {
	will-change: translate;
}

/* ---------- Riduzione del movimento ---------- */
@media (prefers-reduced-motion: reduce) {
	.plur-loop,
	.plur-loop .plur-marquee-track {
		animation: none !important;
	}
	.plur-enter {
		transition: none !important;
	}
}
