/**
 * Casas Choice — infinite marquee (.marquee-animation, see inc/marquee.php
 * + assets/js/marquee.js). The JS builds this structure inside whichever
 * element already holds the row's text:
 *
 *   .cc-marquee__viewport            (clips the track; JS nudges this one
 *                                      on scroll — never the track itself,
 *                                      which already owns `transform` via
 *                                      the keyframe animation below)
 *     .cc-marquee__track             (flex row of repeated copies; the
 *                                      constant-speed animation)
 *       .cc-marquee__item × N        (each = one copy of the original text)
 *     .cc-marquee__sr-only           (the text once, for assistive tech —
 *                                      the repeated copies are aria-hidden)
 *
 * Untouched originals (no JS, JS failure, or .marquee-animation with no
 * text found) just show Greenshift's own plain text — no broken layout.
 */

.cc-marquee__viewport {
	overflow: hidden;
	width: 100%;
	-webkit-mask-image: linear-gradient( 90deg, transparent, #000 5%, #000 95%, transparent );
	        mask-image: linear-gradient( 90deg, transparent, #000 5%, #000 95%, transparent );
}

.cc-marquee__track {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	width: max-content;
	will-change: transform;
	animation: cc-marquee-scroll var( --cc-marquee-duration, 30s ) linear infinite;
}

.cc-marquee__item {
	flex: 0 0 auto;
	white-space: nowrap;
}

/* Visually hidden, still reachable by assistive tech — standard
 * "sr-only" recipe (not `display:none`/`visibility:hidden`, both of
 * which screen readers skip). */
.cc-marquee__sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect( 0, 0, 0, 0 );
	white-space: nowrap;
	border: 0;
}

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

/* A continuously auto-scrolling strip of text is exactly the kind of
 * motion this preference asks to remove — degrade to the plain
 * (JS-repeated but static) row rather than trying to slow it down. */
@media ( prefers-reduced-motion: reduce ) {
	.cc-marquee__track {
		animation: none;
	}
}