/* MK2 Elements — styles communs : animations d'entrée, survol, accessibilité. */

.mk2e-root { box-sizing: border-box; }

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

.mk2e-notice {
	margin: 0; padding: 12px 14px; border: 1px dashed #b4b9c4;
	background: #f7f8fa; color: #3c4257; font-size: 13px;
}

.mk2e-root a:focus-visible,
.mk2e-root button:focus-visible {
	outline: 2px solid var(--mk2e-focus, #2563eb);
	outline-offset: 2px;
}

/* ---- Survol / focus (classe .mk2e-hv posée par les widgets) ---- */
.mk2e-hv {
	transition: transform var(--mk2e-h-dur, 300ms) ease, opacity var(--mk2e-h-dur, 300ms) ease,
		box-shadow var(--mk2e-h-dur, 300ms) ease, color var(--mk2e-h-dur, 300ms) ease,
		background-color var(--mk2e-h-dur, 300ms) ease, border-color var(--mk2e-h-dur, 300ms) ease;
}
.mk2e-hv:hover,
.mk2e-hv:focus-visible,
.mk2e-hv:focus-within {
	transform: translateY(var(--mk2e-h-y, 0px)) scale(var(--mk2e-h-s, 1));
	opacity: var(--mk2e-h-o, 1);
}

/* ---- Animations d'entrée ----------------------------------------------
 * L'état masqué n'existe que si .mk2e-js est posée sur <html> par le script
 * inline : sans JavaScript, le contenu reste visible.
 * Variables internes : --mk2e-tx/ty/rx/ry/sc/clip/oo (état initial).
 * Variables de réglage (Elementor) : --mk2e-dur/delay/ease/dist/s/r/o.
 * ----------------------------------------------------------------------- */
[class*="mk2e-anim-"] {
	--mk2e-tx: 0px; --mk2e-ty: 0px; --mk2e-rx: 0deg; --mk2e-ry: 0deg;
	--mk2e-sc: 1; --mk2e-clip: none; --mk2e-oo: var(--mk2e-o, 0);
}
.mk2e-anim-fade-up { --mk2e-ty: var(--mk2e-dist, 30px); }
.mk2e-anim-fade-down { --mk2e-ty: calc(var(--mk2e-dist, 30px) * -1); }
.mk2e-anim-fade-left { --mk2e-tx: calc(var(--mk2e-dist, 30px) * -1); }
.mk2e-anim-fade-right { --mk2e-tx: var(--mk2e-dist, 30px); }
.mk2e-anim-zoom-in { --mk2e-sc: var(--mk2e-s, .8); }
.mk2e-anim-zoom-out { --mk2e-sc: var(--mk2e-s, 1.2); }
.mk2e-anim-slide-in { --mk2e-oo: var(--mk2e-o, 1); }
.mk2e-anim-slide-in.mk2e-dir-left { --mk2e-tx: calc(var(--mk2e-dist, 80px) * -1); }
.mk2e-anim-slide-in.mk2e-dir-right { --mk2e-tx: var(--mk2e-dist, 80px); }
.mk2e-anim-slide-in.mk2e-dir-up { --mk2e-ty: var(--mk2e-dist, 80px); }
.mk2e-anim-slide-in.mk2e-dir-down { --mk2e-ty: calc(var(--mk2e-dist, 80px) * -1); }
.mk2e-anim-flip.mk2e-dir-left { --mk2e-ry: -90deg; }
.mk2e-anim-flip.mk2e-dir-right { --mk2e-ry: 90deg; }
.mk2e-anim-flip.mk2e-dir-up { --mk2e-rx: 90deg; }
.mk2e-anim-flip.mk2e-dir-down { --mk2e-rx: -90deg; }
.mk2e-anim-reveal { --mk2e-oo: 1; }
.mk2e-anim-reveal.mk2e-dir-left { --mk2e-clip: inset(0 100% 0 0); }
.mk2e-anim-reveal.mk2e-dir-right { --mk2e-clip: inset(0 0 0 100%); }
.mk2e-anim-reveal.mk2e-dir-up { --mk2e-clip: inset(100% 0 0 0); }
.mk2e-anim-reveal.mk2e-dir-down { --mk2e-clip: inset(0 0 100% 0); }

/* Transition (cible = widget, ou éléments .mk2e-item en mode séquentiel) */
.mk2e-js [class*="mk2e-anim-"]:not(.mk2e-stagger-on),
.mk2e-js [class*="mk2e-anim-"].mk2e-stagger-on .mk2e-item {
	transition-property: opacity, transform, clip-path;
	transition-duration: var(--mk2e-dur, var(--mk2e-g-dur, 700ms));
	transition-timing-function: var(--mk2e-ease, var(--mk2e-g-ease, ease));
	transition-delay: calc(var(--mk2e-delay, var(--mk2e-g-delay, 0ms)) + var(--mk2e-sd, 0ms));
}

/* État initial (masqué) */
.mk2e-js [class*="mk2e-anim-"]:not(.mk2e-stagger-on):not(.mk2e-in),
.mk2e-js [class*="mk2e-anim-"].mk2e-stagger-on:not(.mk2e-in) .mk2e-item {
	opacity: var(--mk2e-oo);
	transform: perspective(900px) translate3d(var(--mk2e-tx), var(--mk2e-ty), 0)
		rotateX(var(--mk2e-rx)) rotateY(var(--mk2e-ry)) rotate(var(--mk2e-r, 0deg)) scale(var(--mk2e-sc));
	clip-path: var(--mk2e-clip);
	backface-visibility: hidden;
}
/* Le clip-path doit avoir un état final explicite pour pouvoir être animé */
.mk2e-js .mk2e-anim-reveal.mk2e-in:not(.mk2e-fin):not(.mk2e-stagger-on),
.mk2e-js .mk2e-anim-reveal.mk2e-stagger-on.mk2e-in:not(.mk2e-fin) .mk2e-item { clip-path: inset(0 0 0 0); }

/* Animation terminée : on rend la main aux effets de survol */
.mk2e-fin[class*="mk2e-anim-"]:not(.mk2e-stagger-on),
.mk2e-fin[class*="mk2e-anim-"].mk2e-stagger-on .mk2e-item {
	transition-property: transform, opacity, box-shadow, color, background-color, border-color;
	transition-duration: var(--mk2e-h-dur, 300ms);
	transition-delay: 0ms;
	transition-timing-function: ease;
	clip-path: none;
}

/* ---- Révélation par masque (MK2 Heading) ---- */
.mk2e-mask { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .12em; margin-bottom: -.12em; }
.mk2e-mask__in {
	display: inline-block;
	transition: transform var(--mk2e-dur, var(--mk2e-g-dur, 700ms)) var(--mk2e-ease, var(--mk2e-g-ease, ease)) var(--mk2e-delay, var(--mk2e-g-delay, 0ms));
}
.mk2e-js .mk2e-mask-yes:not(.mk2e-in) .mk2e-mask__in { transform: translateY(110%); }

/* ---- Révélation mot à mot (MK2 Text Editor) ---- */
.mk2e-w {
	display: inline-block;
	transition: opacity var(--mk2e-dur, 500ms) var(--mk2e-ease, var(--mk2e-g-ease, ease)) calc(var(--mk2e-delay, 0ms) + var(--mk2e-wi, 0) * 45ms),
		transform var(--mk2e-dur, 500ms) var(--mk2e-ease, var(--mk2e-g-ease, ease)) calc(var(--mk2e-delay, 0ms) + var(--mk2e-wi, 0) * 45ms);
}
.mk2e-js .mk2e-words-yes:not(.mk2e-in) .mk2e-w { opacity: 0; transform: translateY(.5em); }

/* ---- Tracé de ligne (MK2 Divider) ---- */
.mk2e-divider__line {
	transform-origin: left center;
	transition: transform var(--mk2e-dur, 900ms) var(--mk2e-ease, var(--mk2e-g-ease, ease)) var(--mk2e-delay, 0ms);
}
.mk2e-js .mk2e-draw-yes:not(.mk2e-in) .mk2e-divider__line { transform: scaleX(0); }

/* ---- Effets de défilement ---- */
.mk2e-scroll-active { will-change: transform, opacity; }

/* ---- Filet de sécurité : le moteur ne s'est pas chargé ---- */
.mk2e-fallback [class*="mk2e-anim-"]:not(.mk2e-stagger-on),
.mk2e-fallback [class*="mk2e-anim-"].mk2e-stagger-on .mk2e-item {
	opacity: 1 !important; transform: none !important; clip-path: none !important; transition: none !important;
}
.mk2e-fallback .mk2e-mask__in, .mk2e-fallback .mk2e-w, .mk2e-fallback .mk2e-divider__line { transform: none !important; opacity: 1 !important; }

/* ---- Préférence « réduire les animations » ---- */
@media (prefers-reduced-motion: reduce) {
	[class*="mk2e-anim-"]:not(.mk2e-stagger-on),
	[class*="mk2e-anim-"].mk2e-stagger-on .mk2e-item {
		opacity: 1 !important; transform: none !important; clip-path: none !important; transition: none !important;
	}
	.mk2e-mask__in, .mk2e-w, .mk2e-divider__line { transform: none !important; opacity: 1 !important; transition: none !important; }
	.mk2e-hv, .mk2e-hv:hover, .mk2e-hv:focus-visible, .mk2e-hv:focus-within { transform: none; transition: none; }
}
