/* ==========================================================================
   MaxxedOut — Ticker
   ========================================================================== */

.mxo-scope.mxo-ticker {
	--tk-size: clamp(19px, 1.9vw, 27px);
	--tk-bg: var(--mx-blue);
	--tk-ink: var(--mx-white);
	--tk-accent: #A9B5FF;
	position: relative;
	display: block;
	overflow: hidden;
	background: var(--s-bg);
}
.mxo-scope.mxo-ticker--crossed {
	padding-block: clamp(46px, 5vw, 70px);
}

.mxo-scope .mxo-ticker__band {
	position: relative;
	display: flex;
	overflow: hidden;
	padding-block: calc(var(--tk-size) * 0.62);
	color: var(--tk-ink);
	background: var(--tk-bg);
}
.mxo-scope.mxo-ticker--navy .mxo-ticker__band { --tk-bg: #121A47; }
.mxo-scope.mxo-ticker--blue .mxo-ticker__band { --tk-accent: #C9D0FF; }
.mxo-scope.mxo-ticker--light .mxo-ticker__band {
	--tk-bg: var(--mx-white);
	--tk-ink: var(--mx-ink);
	--tk-accent: var(--mx-blue);
	border-block: 1px solid var(--mx-line);
}
.mxo-scope.mxo-ticker--crossed .mxo-ticker__band {
	width: 112%;
	margin-left: -6%;
}
.mxo-scope.mxo-ticker--crossed .mxo-ticker__band--front {
	transform: rotate(-2.2deg);
	box-shadow: 0 20px 50px -26px rgba(10, 15, 44, 0.6);
}
.mxo-scope.mxo-ticker--crossed .mxo-ticker__band--back {
	position: absolute;
	top: 50%;
	left: 0;
	--tk-bg: var(--mx-navy);
	--tk-ink: rgba(226, 231, 246, 0.85);
	transform: translateY(-50%) rotate(2.4deg);
}

.mxo-scope .mxo-ticker__track {
	display: flex;
	flex: none;
	width: max-content;
	animation: mxo-ticker var(--dur, 46s) linear infinite;
	will-change: transform;
}
.mxo-scope .mxo-ticker__track.is-reverse { animation-direction: reverse; }
.mxo-scope.mxo-ticker:hover .mxo-ticker__track { animation-play-state: paused; }
@keyframes mxo-ticker {
	from { transform: translate3d(0, 0, 0); }
	to { transform: translate3d(-50%, 0, 0); }
}

.mxo-scope .mxo-ticker__group {
	display: flex;
	align-items: center;
	flex: none;
}
.mxo-scope .mxo-ticker__item {
	padding-inline: calc(var(--tk-size) * 0.9);
	font-size: var(--tk-size);
	font-weight: 700;
	font-stretch: 112%;
	line-height: 1;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	white-space: nowrap;
}
.mxo-scope .mxo-ticker__item.is-outline { color: var(--tk-accent); }
.mxo-scope .mxo-ticker__sep {
	display: inline-flex;
	gap: calc(var(--tk-size) * 0.1);
	height: calc(var(--tk-size) * 0.7);
	flex: none;
}
.mxo-scope .mxo-ticker__sep i {
	display: block;
	width: calc(var(--tk-size) * 0.14);
	background: var(--tk-accent);
	transform: skewX(var(--mx-slant));
}
.mxo-scope .mxo-ticker__sep i:nth-child(4) {
	width: calc(var(--tk-size) * 0.2);
	background: var(--mx-steel);
}
.mxo-scope.mxo-ticker--light .mxo-ticker__sep i { background: var(--mx-blue); }
.mxo-scope.mxo-ticker--light .mxo-ticker__sep i:nth-child(4) { background: var(--mx-grey); }

@media (max-width: 767px) {
	.mxo-scope.mxo-ticker { --tk-size: 18px; }
	.mxo-scope.mxo-ticker--crossed { padding-block: 40px; }
}
@media (prefers-reduced-motion: reduce) {
	.mxo-scope .mxo-ticker__track { animation: none; }
}
