/* ESTB Marquee v1.0.0 */
.estb-mq {
	--estb-mq-gap: 32px;
	--estb-mq-icon-size: 1em;
	--estb-mq-icon-gap: 10px;
	--estb-mq-fade: 80px;
	position: relative;
	width: 100%;
	overflow: hidden;
	box-sizing: border-box;
}

.estb-mq-track {
	display: flex;
	width: max-content;
	will-change: transform;
	animation: estb-mq-scroll var(--estb-mq-duration, 30s) linear infinite;
}

.estb-mq--right .estb-mq-track {
	animation-direction: reverse;
}

.estb-mq--pause:hover .estb-mq-track,
.estb-mq--pause:focus-within .estb-mq-track {
	animation-play-state: paused;
}

@keyframes estb-mq-scroll {
	from { transform: translate3d(0, 0, 0); }
	to   { transform: translate3d(calc(-1 * var(--estb-mq-distance, 50%)), 0, 0); }
}

.estb-mq-group {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	gap: var(--estb-mq-gap);
	padding-right: var(--estb-mq-gap); /* mismo hueco en la unión entre copias */
}

.estb-mq-item {
	display: inline-flex;
	align-items: center;
	gap: var(--estb-mq-icon-gap);
	white-space: nowrap;
	text-decoration: none;
	color: var(--estb-mq-item-color, var(--estb-mq-color));
	background-color: var(--estb-mq-item-bg, var(--estb-mq-bg, transparent));
	transition: color .2s ease, background-color .2s ease;
}

a.estb-mq-item,
a.estb-mq-item:hover,
a.estb-mq-item:focus {
	text-decoration: none;
	box-shadow: none;
}

.estb-mq-text {
	margin: 0;
	padding: 0;
	color: inherit;
	font-size: inherit;
	line-height: 1.2;
	white-space: nowrap;
}

.estb-mq-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	line-height: 1;
	font-size: var(--estb-mq-icon-size);
	color: var(--estb-mq-item-icon-color, var(--estb-mq-icon-color, currentColor));
	transition: color .2s ease;
}

.estb-mq-icon svg {
	width: 1em;
	height: 1em;
	fill: currentColor;
}

.estb-mq-sep {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	line-height: 1;
}

.estb-mq-sep svg {
	width: 1em;
	height: 1em;
	fill: currentColor;
}

/* Difuminado de bordes */
.estb-mq--fade {
	-webkit-mask-image: linear-gradient(to right, transparent 0, #000 var(--estb-mq-fade), #000 calc(100% - var(--estb-mq-fade)), transparent 100%);
	mask-image: linear-gradient(to right, transparent 0, #000 var(--estb-mq-fade), #000 calc(100% - var(--estb-mq-fade)), transparent 100%);
}

/* Accesibilidad: sin animación si el usuario lo ha pedido en su sistema */
@media (prefers-reduced-motion: reduce) {
	.estb-mq {
		overflow-x: auto;
	}
	.estb-mq-track {
		animation: none;
	}
	.estb-mq-group[aria-hidden="true"] {
		display: none;
	}
}