/* Animaciones Globales para Elementor — base */

.egm-run {
	animation-duration: var(--egm-dur, 800ms);
	animation-timing-function: var(--egm-ease, cubic-bezier(.22, 1, .36, 1));
	animation-delay: 0ms;
	animation-fill-mode: both;
	animation-iteration-count: 1;
	will-change: transform, opacity, filter;
}

/* Utilidad: desvanecido simple (se usa en móvil y como respaldo). */
.egm-run[data-egm-anim="fade"] { animation-name: egm-fade; }
@keyframes egm-fade { from { opacity: 0; } to { opacity: 1; } }

/* ---------- Transiciones de página (capa en html::after) ---------- */
html.egm-pt::after {
	content: "";
	position: fixed;
	inset: 0;
	z-index: 2147483000;
	pointer-events: none;
	background: var(--egm-pt-color, #0e0e10);
	opacity: 0;
	visibility: hidden;
}
html.egm-pt-in::after,
html.egm-pt-out::after { opacity: 1; visibility: visible; }

html.egm-pt-in.egm-pt-fade::after    { animation: egm-pt-fade-hide var(--egm-pt-dur) ease .08s both; }
html.egm-pt-out.egm-pt-fade::after   { animation: egm-pt-fade-show calc(var(--egm-pt-dur) * .7) ease both; }
@keyframes egm-pt-fade-hide { from { opacity: 1; visibility: visible; } to { opacity: 0; visibility: hidden; } }
@keyframes egm-pt-fade-show { from { opacity: 0; } to { opacity: 1; } }

html.egm-pt-in.egm-pt-curtain::after  { transform-origin: 50% 0; animation: egm-pt-curtain-hide var(--egm-pt-dur) cubic-bezier(.76, 0, .24, 1) .08s both; }
html.egm-pt-out.egm-pt-curtain::after { transform-origin: 50% 100%; animation: egm-pt-curtain-show calc(var(--egm-pt-dur) * .7) cubic-bezier(.76, 0, .24, 1) both; }
@keyframes egm-pt-curtain-hide { from { transform: scaleY(1); } to { transform: scaleY(0); visibility: hidden; } }
@keyframes egm-pt-curtain-show { from { transform: scaleY(0); } to { transform: scaleY(1); } }

html.egm-pt-in.egm-pt-wipe::after  { transform-origin: 100% 50%; animation: egm-pt-wipe-hide var(--egm-pt-dur) cubic-bezier(.76, 0, .24, 1) .08s both; }
html.egm-pt-out.egm-pt-wipe::after { transform-origin: 0 50%; animation: egm-pt-wipe-show calc(var(--egm-pt-dur) * .7) cubic-bezier(.76, 0, .24, 1) both; }
@keyframes egm-pt-wipe-hide { from { transform: scaleX(1); } to { transform: scaleX(0); visibility: hidden; } }
@keyframes egm-pt-wipe-show { from { transform: scaleX(0); } to { transform: scaleX(1); } }

@property --egm-pt-r { syntax: "<percentage>"; inherits: false; initial-value: 0%; }
html.egm-pt-in.egm-pt-iris::after,
html.egm-pt-out.egm-pt-iris::after {
	-webkit-mask-image: radial-gradient(circle at 50% 50%, transparent var(--egm-pt-r), #000 calc(var(--egm-pt-r) + .5%));
	        mask-image: radial-gradient(circle at 50% 50%, transparent var(--egm-pt-r), #000 calc(var(--egm-pt-r) + .5%));
}
html.egm-pt-in.egm-pt-iris::after  { animation: egm-pt-iris-hide var(--egm-pt-dur) cubic-bezier(.65, 0, .35, 1) .08s both; }
html.egm-pt-out.egm-pt-iris::after { animation: egm-pt-iris-show calc(var(--egm-pt-dur) * .7) cubic-bezier(.65, 0, .35, 1) both; }
@keyframes egm-pt-iris-hide { from { --egm-pt-r: 0%; } to { --egm-pt-r: 75%; visibility: hidden; } }
@keyframes egm-pt-iris-show { from { --egm-pt-r: 75%; } to { --egm-pt-r: 0%; } }

@property --egm-pt-b { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
html.egm-pt-in.egm-pt-blinds::after,
html.egm-pt-out.egm-pt-blinds::after {
	-webkit-mask-image: linear-gradient(to bottom, #000 var(--egm-pt-b), transparent var(--egm-pt-b));
	        mask-image: linear-gradient(to bottom, #000 var(--egm-pt-b), transparent var(--egm-pt-b));
	-webkit-mask-size: 100% 12.5%;
	        mask-size: 100% 12.5%;
}
html.egm-pt-in.egm-pt-blinds::after  { animation: egm-pt-blinds-hide var(--egm-pt-dur) cubic-bezier(.65, 0, .35, 1) .08s both; }
html.egm-pt-out.egm-pt-blinds::after { animation: egm-pt-blinds-show calc(var(--egm-pt-dur) * .7) cubic-bezier(.65, 0, .35, 1) both; }
@keyframes egm-pt-blinds-hide { from { --egm-pt-b: 100%; } to { --egm-pt-b: 0%; visibility: hidden; } }
@keyframes egm-pt-blinds-show { from { --egm-pt-b: 0%; } to { --egm-pt-b: 100%; } }

@media (prefers-reduced-motion: reduce) {
	html.egm-pt::after { display: none; }
}

@media print {
	html.egm-on * { opacity: 1 !important; animation: none !important; clip-path: none !important; }
	html.egm-pt::after { display: none !important; }
}