/**
 * MSA — Minucci Suite Animations
 * États initiaux, filet anti-page-blanche, reduced-motion et utilitaires.
 *
 * Quatre principes non négociables :
 *  1. Sans JS, tout est visible : aucun état caché sans « msa-js » sur <html>,
 *     classe posée par un script inline du <head> UNIQUEMENT si le moteur est
 *     effectivement mis en file (voir AnimationsModule::print_head_bootstrap()).
 *  2. Ce script s'exécute avant le premier paint : jamais de « visible puis caché ».
 *  3. Filet universel « msa-safety » : si le moteur ne s'exécute pas (échec
 *     réseau, erreur JS, Delay JS d'un optimiseur), tout redevient normal à 1,2 s.
 *  4. Neutralisateur « msa-in » : posé en fin d'animation ET sur tout élément
 *     écarté par le scanner — un élément skippé ne reste jamais invisible.
 *
 * Les blocs A, B et D doivent rester des MIROIRS EXACTS l'un de l'autre :
 * toute recette ajoutée au bloc A doit l'être aux blocs B et D.
 */

/* ── A. États initiaux + filet anti-page-blanche (uniquement si head-script) ── */
.msa-js .msa-reveal-up,
.msa-js .msa-stagger > * {
	opacity: 0;
	transform: translate3d(0, var(--msa-distance, 24px), 0);
	animation: msa-safety 0s linear 1.2s forwards;
}

/* --msa-x porte déjà le signe : positif dans la variable = arrivée par la
   droite, donc une distance de règle positive y est posée en négatif. */
.msa-js .msa-reveal-side {
	opacity: 0;
	transform: translate3d(var(--msa-x, -24px), 0, 0);
	animation: msa-safety 0s linear 1.2s forwards;
}

.msa-js .msa-scale-in {
	opacity: 0;
	transform: scale(var(--msa-scale, 0.94));
	animation: msa-safety 0s linear 1.2s forwards;
}

/* Filet dédié : msa-safety ne remet que opacity et transform. Réutiliser
   celui-là poserait « filter: none » sur des éléments dont le filtre vient
   du thème ou d'Elementor. */
.msa-js .msa-blur-in {
	opacity: 0;
	filter: blur(var(--msa-blur, 8px));
	animation: msa-safety-blur 0s linear 1.2s forwards;
}

.msa-js .msa-reveal-mask,
.msa-js .msa-lines {
	opacity: 0; /* masqués le temps du wrap / du split */
	animation: msa-safety 0s linear 1.2s forwards;
}

.msa-js .msa-img-zoom img,
.msa-js .msa-img-zoom video,
.msa-js img.msa-img-zoom,
.msa-js video.msa-img-zoom {
	transform: scale(var(--msa-zoom, 1.06)); /* jamais d'opacity sur une image */
	animation: msa-safety 0s linear 1.2s forwards;
}

.msa-js .msa-reveal-mask,
.msa-js .msa-img-zoom {
	overflow: hidden;
}

@keyframes msa-safety {
	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes msa-safety-blur {
	to {
		opacity: 1;
		filter: none;
	}
}

/* ── B. Le moteur a pris la main : le filet est coupé (MÊME liste qu'en A) ── */
html.msa-ready .msa-reveal-up,
html.msa-ready .msa-reveal-side,
html.msa-ready .msa-scale-in,
html.msa-ready .msa-blur-in,
html.msa-ready .msa-stagger > *,
html.msa-ready .msa-reveal-mask,
html.msa-ready .msa-lines,
html.msa-ready .msa-img-zoom img,
html.msa-ready .msa-img-zoom video,
html.msa-ready img.msa-img-zoom,
html.msa-ready video.msa-img-zoom {
	animation: none;
}

/* ── C. Neutralisateur — fin d'animation et éléments écartés (APRÈS A).
   Les variantes qualifiées par une balise sont indispensables : « .msa-js .msa-in »
   seule (0,2,0) perdrait contre l'état initial « .msa-js img.msa-img-zoom » (0,2,1),
   et l'image resterait zoomée une fois l'animation terminée. ── */
.msa-js .msa-in,
.msa-js .msa-img-zoom.msa-in img,
.msa-js .msa-img-zoom.msa-in video,
.msa-js img.msa-img-zoom.msa-in,
.msa-js video.msa-img-zoom.msa-in {
	opacity: 1;
	transform: none;
	animation: none;
}

/* `filter` isolé du neutraliseur générique : appliqué à tous les « .msa-in »,
   il effacerait les filtres légitimes du thème sur les éléments animés. */
.msa-js .msa-blur-in.msa-in {
	filter: none;
}

/* ── D. Reduced motion : tout visible immédiatement, même sans moteur.
   Inconditionnel et non désactivable. Sélecteurs ÉNUMÉRÉS (miroir du bloc A
   + recettes continues), jamais de [class*=] ni de descendant universel :
   les transforms inline de tiers (Swiper, Elementor…) sont épargnés. ── */
@media (prefers-reduced-motion: reduce) {
	html.msa-js .msa-reveal-up,
	html.msa-js .msa-reveal-side,
	html.msa-js .msa-scale-in,
	html.msa-js .msa-blur-in,
	html.msa-js .msa-stagger > *,
	html.msa-js .msa-reveal-mask,
	html.msa-js .msa-lines,
	html.msa-js .msa-img-zoom img,
	html.msa-js .msa-img-zoom video,
	html.msa-js img.msa-img-zoom,
	html.msa-js video.msa-img-zoom,
	html.msa-js .msa-parallax,
	html.msa-js .msa-magnetic {
		opacity: 1 !important;
		transform: none !important;
		animation: none !important;
	}

	html.msa-js .msa-blur-in {
		filter: none !important;
	}
}

/* ── E. Utilitaires (structures créées par le moteur) ── */
.msa-mask__inner {
	display: block;
}

.msa-line {
	display: block;
	overflow: hidden;
}

.msa-line__inner {
	display: block;
}

.msa-w {
	display: inline-block;
}

/* split=char — inline-block pour être transformable ; la coupure de ligne au
   milieu d'un mot reste impossible, .msa-w étant lui-même inline-block. */
.msa-c {
	display: inline-block;
}

.msa-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* Repère visuel du mode debug (?msa-debug). */
.msa-debug-bound {
	outline: 1px dashed rgba(255, 0, 128, 0.6);
}