/* =========================================================
   Text ticker — olive band, white text scrolling right-to-left,
   dark "Read More" tab. Markup: templates/sec-ticker.php
   ========================================================= */

.ticker-ox {
	--ticker-olive: #71784B;
	--ticker-dark: #10110B;
	--ticker-speed: 38s;
	padding: clamp(40px, 6vw, 72px) 0;
	overflow: hidden;
}

.ticker-ox__band {
	position: relative;
	display: flex;
	align-items: stretch;
	background: var(--ticker-olive);
	border-top: 2px solid var(--ticker-olive);
	border-bottom: 2px solid var(--ticker-olive);
}

.ticker-ox__viewport {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	/* soft fade at the left edge so text slides in instead of being cut */
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 48px);
	mask-image: linear-gradient(90deg, transparent 0, #000 48px);
}

.ticker-ox__track {
	display: flex;
	width: max-content;
	animation: ticker-ox-scroll var(--ticker-speed) linear infinite;
}

.ticker-ox__band:hover .ticker-ox__track,
.ticker-ox__band:focus-within .ticker-ox__track {
	animation-play-state: paused;
}

.ticker-ox__group {
	display: flex;
	flex-shrink: 0;
}

.ticker-ox__item {
	padding: 14px 24px;
	white-space: nowrap;
	font: 700 clamp(1rem, .9rem + .55vw, 1.4rem)/1.2 'Montserrat', system-ui, sans-serif;
	letter-spacing: .01em;
	color: #fff;
}

@keyframes ticker-ox-scroll {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}

.ticker-ox__cta {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	padding: 0 clamp(18px, 2.2vw, 32px);
	background: var(--ticker-dark);
	color: #fff;
	font: 500 clamp(.9rem, .85rem + .2vw, 1.05rem)/1 'Montserrat', system-ui, sans-serif;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color .25s ease, color .25s ease;
}

.ticker-ox__cta:hover,
.ticker-ox__cta:focus-visible {
	background: #fff;
	color: var(--ticker-dark);
}

.ticker-ox__cta:focus-visible {
	outline: 2px solid var(--ticker-dark);
	outline-offset: -4px;
}

@media (max-width: 575.98px) {
	.ticker-ox {
		--ticker-speed: 26s;
	}

	.ticker-ox__item {
		padding: 12px 18px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ticker-ox__track {
		animation: none;
	}
}