/*
 * Macchi — stili di supporto alle animazioni (macchi-motion.js)
 * Life Color — 11/10/2026 — cmd 005
 * Note: la classe ms-motion su <html> la aggiunge lo script in <head> solo con JavaScript attivo
 * e senza prefers-reduced-motion; ms-motion-ready arriva quando macchi-motion.js ha preparato la pagina.
 * Senza queste classi nulla viene nascosto o bloccato.
 */

/* Lenis gestisce lo scroll fluido: niente scroll-behavior nativo che lo contrasti. */
html.lenis {
	scroll-behavior: auto !important;
}

/* Finché lo script non ha preparato le animazioni, i blocchi ms-reveal restano invisibili
   senza cambiare l'impaginazione (visibility, non display): nessun salto di layout. */
html.ms-motion:not(.ms-motion-ready) .ms-reveal {
	visibility: hidden;
}

/* Numeri: cifre a larghezza fissa, così il conteggio non fa "ballare" il testo. */
.ms-counter {
	font-variant-numeric: tabular-nums;
}

/* Card impilate: solo da 1025 px e senza movimento ridotto. Le card devono avere uno sfondo
   e un'altezza non superiore a quella della finestra meno --ms-stack-top. Solo con finestre alte almeno 760 px. */
/* Life Color — 12/10/2026 — cmd 010 — anche altezza minima 760 px: le card della Home sono alte 643
   e devono stare nella finestra meno --ms-stack-top (6rem); sotto restano una dopo l'altra. */

/* Life Color — 19/10/2026 — cmd 025 — pila a ogni larghezza (telefoni e tablet compresi): le card diventano sticky solo
   quando macchi-motion.js aggiunge ms-stack--on, cioè se tutte le card della pila stanno nella finestra sotto
   --ms-stack-top. Senza JavaScript o con movimento ridotto restano una lista. Sotto i 768 px il punto di arresto è più
   alto (5rem), perché le pillole dell'header finiscono a ≈ 60 px. */
@media (prefers-reduced-motion: no-preference) {
	html.ms-motion .ms-stack.ms-stack--on > .e-con,
	html.ms-motion .ms-stack.ms-stack--on > .e-con-inner > .e-con {
		position: sticky;
		top: var(--ms-stack-top, 6rem);
	}
}

@media (max-width: 767px) {
	:root {
		--ms-stack-top: 5rem;
	}
}

/* Life Color — 19/10/2026 — cmd 027 — iPhone: le card della pila attiva vanno su uno strato proprio (niente ridisegni a ogni
   passo del mazzo, che davano un leggero sfarfallio). Solo dispositivi touch. */
@media (hover: none), (pointer: coarse) {
	html.ms-motion .ms-stack.ms-stack--on > .e-con,
	html.ms-motion .ms-stack.ms-stack--on > .e-con-inner > .e-con {
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
	}
}

/* Life Color — 21/10/2026 — cmd 029
   Note: le maschere di SplitText (.ms-line-mask, overflow nascosto) sono alte quanto la riga: con interlinee
   minori del corpo (titoli delle card) le parti sotto la linea di base (g, p, q, j, y) venivano tagliate.
   Si allarga la maschera sopra e sotto senza cambiare l'impaginazione (margini negativi). */
.ms-line-mask {
	padding-block: 0.1em 0.25em;
	margin-block: -0.1em -0.25em;
}