/* KW Ticker para Elementor */

.kwt-ticker {
	--kwt-gap: 24px;
	--kwt-shift: -50%;
	--kwt-duration: 20s;
	--kwt-fade: 60px;
	position: relative;
	overflow: hidden;
	width: 100%;
	display: block;
}

.kwt-marquee {
	display: flex;
	flex-wrap: nowrap;
	width: max-content;
	will-change: transform;
	animation: kwt-scroll var(--kwt-duration) linear infinite;
}

.kwt-track {
	display: flex;
	flex: 0 0 auto;
	flex-wrap: nowrap;
	align-items: center;
	gap: var(--kwt-gap);
	padding-inline-end: var(--kwt-gap);
}

.kwt-item,
.kwt-sep {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	white-space: nowrap;
}

.kwt-text {
	display: inline-block;
	margin: 0;
	white-space: nowrap;
	transition: color .2s ease, background-color .2s ease;
}

.kwt-link {
	text-decoration: none;
	color: inherit;
	display: inline-flex;
}

.kwt-sep {
	line-height: 1;
	justify-content: center;
	transform: rotate(var(--kwt-icon-rotate, 0deg));
}

.kwt-sep svg {
	display: block;
	width: 1em;
	height: 1em;
	fill: currentColor;
}

.kwt-sep i {
	line-height: 1;
}

@keyframes kwt-scroll {
	from { transform: translate3d(0, 0, 0); }
	to   { transform: translate3d(var(--kwt-shift), 0, 0); }
}

/* Dirección inversa */
.kwt-dir-right .kwt-marquee {
	animation-direction: reverse;
}

/* Pausa al pasar el cursor */
.kwt-pause-on-hover:hover .kwt-marquee {
	animation-play-state: paused;
}

/* Desvanecido en los bordes */
.kwt-has-fade {
	-webkit-mask-image: linear-gradient(
		to right,
		transparent 0,
		#000 var(--kwt-fade),
		#000 calc(100% - var(--kwt-fade)),
		transparent 100%
	);
	mask-image: linear-gradient(
		to right,
		transparent 0,
		#000 var(--kwt-fade),
		#000 calc(100% - var(--kwt-fade)),
		transparent 100%
	);
}

/* Accesibilidad: sin movimiento si el usuario lo pide */
@media (prefers-reduced-motion: reduce) {
	.kwt-marquee {
		animation: none;
		transform: none;
	}
	.kwt-track {
		flex-wrap: wrap;
	}
}
