:root {
	--blue: #0060FF;
	--dark: #000000;
	--fade: #F2F2F2;
	--white: #FFFFFF;
}

body {
	overflow-x: hidden;
}

.sticky-header {
	left: 0px;
	position: fixed;
	top: 0px;
	width: 100%;
	z-index: 9999;
}
.sticky-header.is-sticky {
	background: var(--blue);
}
.sticky-header.is-sticky > .elementor-element > .e-con-inner {
	padding-block-end: 15px;
	padding-block-start: 15px;
}

.sticky-header .e--pointer-framed.e--animation-draw .elementor-item:after,
.sticky-header .e--pointer-framed.e--animation-draw .elementor-item:before {
	border-radius: 50px;
}

.span-white span {
	color: var(--white);
}

.span-dark span {
	color: var(--dark);
}

.span-blue span {
	color: var(--blue);
	font-weight: 700;
}

.rotating-image.is-rotating {
	transform-origin: center center;
	transform-origin: 43% 50%; /* ajusta según la posición de la moneda */
	animation: spin-slowdown 3s cubic-bezier(0.1, 0.9, 0.2, 1) forwards;
}
.rotating-image-2.is-rotating {
	transform-origin: center center;
	transform-origin: 43% 50%; /* ajusta según la posición de la moneda */
	animation: spin-slowdown 3s cubic-bezier(0.1, 0.9, 0.2, 1) forwards;
}
@keyframes spin-slowdown {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(1080deg);
	}
}

.rotating-image-3.is-rotating {
	animation: girarDesacelerado 4s ease-out forwards;
	transform-style: preserve-3d;
	display: inline-block;
}
@keyframes girarDesacelerado {
	0% {
		transform: rotateY(0deg);
	}
	10% {
		transform: rotateY(720deg); /* Gira muy rápido al inicio */
	}
	30% {
		transform: rotateY(1080deg);
	}
	60% {
		transform: rotateY(1260deg);
	}
	100% {
		transform: rotateY(1440deg); /* 4 giros completos = mismo estado que inicio */
	}
}


.shine-container {
	position: relative;
}
.shine-container:before {
	content: '';
	position: absolute;
	top: 0;
	left: -75%;
	width: 50%;
	height: 100%;
	background: linear-gradient(
		120deg,
		rgba(255, 255, 255, 0) 0%,
		rgba(255, 255, 255, 0.1) 50%,
		rgba(255, 255, 255, 0) 100%
	);
	transform: skewX(-20deg);
	animation: shine 2.5s infinite;
	z-index: 20;
}
@keyframes shine {
	0% {
		left: -75%;
		width: 50%;
	}
	100% {
		left: 125%;
		width: 100%;
	}
}

.visible-xs {
	display: none !important;
}

/* Medium & mobile devices (phone, tablets, 768px and less) */
@media screen and (max-width: 767px) {
	.visible-xs {
		display: block !important;
	}

	.hidden-xs {
		display: none !important;
	}

	body {
		overflow-x: hidden;
	}

	.sticky-header.is-sticky {
		background: var(--white);
	}
}

/* Mobile devices (tablet, 768px and up) */
@media (min-width: 768px) {

}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {

}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {

}

/* XXL Extra large devices (HD-4K, 1400px and up) */
@media (min-width: 1400px) {
	
}