/* Sagamento Toolkit — Wipe
   Le texte se révèle de gauche à droite dans une vague bleue,
   qui retombe en noir juste derrière le front de balayage.
   Réglages surchargeables par élément via style="--sg-wipe-duration: 2s". */

.sg-anim-wipe {
	--sg-wipe-duration: 1400ms;
	--sg-wipe-delay: 0ms;
	--sg-wipe-ease: cubic-bezier(0.33, 0.1, 0.25, 1);
	--sg-wipe-wave: #533ff5;
	--sg-wipe-settled: #000;
	--sg-wipe-wave-hold: 2;
	--sg-wipe-scale: 0.92;
	--sg-wipe-origin: 0% 50%;
}

/* Masqué uniquement si le JS tourne, et seulement jusqu'à la prise en charge. */
.sg-js .sg-anim-wipe:not(.sg-wipe-ready) {
	visibility: hidden;
}

/* Deux calques larges de trois fois le titre, déplacés ensemble :
   le masque découvre le texte, le dégradé de couleur porte la vague.
   Le noir occupe le tiers gauche, donc l'état final est entièrement noir.
   Le calque de couleur avance plus lentement que le masque (--sg-wipe-wave-hold) :
   les lettres restent bleues un moment après avoir été révélées. */
.sg-anim-wipe.sg-wipe-ready {
	background-image: linear-gradient(
		to right,
		var(--sg-wipe-settled) 0%,
		var(--sg-wipe-settled) 36%,
		var(--sg-wipe-wave) 48%,
		var(--sg-wipe-wave) 100%
	);
	background-size: 300% 100%;
	background-repeat: no-repeat;
	background-position: 100% 0;
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;

	-webkit-mask-image: linear-gradient( to right, #000 0%, #000 33.33%, transparent 66.66%, transparent 100% );
	mask-image: linear-gradient( to right, #000 0%, #000 33.33%, transparent 66.66%, transparent 100% );
	-webkit-mask-size: 300% 100%;
	mask-size: 300% 100%;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: 100% 0;
	mask-position: 100% 0;

	transform: scale( var(--sg-wipe-scale) );
	transform-origin: var(--sg-wipe-origin);
	will-change: transform, mask-position, background-position;

	transition:
		-webkit-mask-position var(--sg-wipe-duration) var(--sg-wipe-ease) var(--sg-wipe-delay),
		mask-position var(--sg-wipe-duration) var(--sg-wipe-ease) var(--sg-wipe-delay),
		background-position calc( var(--sg-wipe-duration) * var(--sg-wipe-wave-hold) ) var(--sg-wipe-ease) var(--sg-wipe-delay),
		transform calc( var(--sg-wipe-duration) * 1.15 ) var(--sg-wipe-ease) var(--sg-wipe-delay);
}

.sg-anim-wipe.sg-wipe-ready.sg-in {
	-webkit-mask-position: 0 0;
	mask-position: 0 0;
	background-position: 0 0;
	transform: scale( 1 );
}

/* Les couleurs internes au titre (spans, liens) doivent laisser passer
   le dégradé du parent pendant l'animation. */
.sg-anim-wipe.sg-wipe-ready * {
	color: inherit;
	-webkit-text-fill-color: inherit;
}

/* Bloc dont l'animation WPBakery a été neutralisée. */
.sg-builder-off {
	opacity: 1 !important;
	animation: none !important;
	transform: none !important;
}

/* Accessibilité : aucun mouvement si l'utilisateur l'a demandé. */
@media (prefers-reduced-motion: reduce) {
	.sg-anim-wipe.sg-wipe-ready {
		-webkit-mask-image: none;
		mask-image: none;
		background-image: none;
		-webkit-text-fill-color: var(--sg-wipe-settled);
		color: var(--sg-wipe-settled);
		transform: none;
		transition: none;
	}
}