/* -----------------------------------------------
   Generic Marquee — Infinite Horizontal Scroll
   .ad-pause-btn is defined in global.css — not duplicated here.
   ----------------------------------------------- */

/* Outer container — clip overflow, position anchor for pause button */
.ad-marquee {
	overflow: hidden;
	position: relative;
}

/* Track — flex row, no wrap */
.ad-marquee__track {
	width: max-content;
	flex-wrap: nowrap !important;
}

/* Fade modifier — opt-in edge fade via CSS mask */
.ad-marquee--fade .ad-marquee__track {
	-webkit-mask-image: linear-gradient(
		to right,
		transparent,
		black clamp(2rem, 8vw, 8rem),
		black calc(100% - clamp(2rem, 8vw, 8rem)),
		transparent
	);
	mask-image: linear-gradient(
		to right,
		transparent,
		black clamp(2rem, 8vw, 8rem),
		black calc(100% - clamp(2rem, 8vw, 8rem)),
		transparent
	);
}

/* Animated state — JS adds .is-animated after cloning children */
.ad-marquee.is-animated .ad-marquee__track {
	animation: ad-marquee-scroll var(--ad-marquee-duration, 30s) linear infinite;
}

/* Reverse direction */
.ad-marquee--reverse.is-animated .ad-marquee__track {
	animation-direction: reverse;
}

@keyframes ad-marquee-scroll {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(calc(var(--ad-marquee-width) * -1));
	}
}

/* Pause/play button — vertically centered, right of marquee */
.ad-marquee__pause-btn {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 0.5rem;
	z-index: 1;
}

/* Speed modifiers */
.ad-marquee--slow    { --ad-marquee-duration: 60s; }
.ad-marquee--slower  { --ad-marquee-duration: 90s; }
.ad-marquee--fast    { --ad-marquee-duration: 15s; }

/* Grouped marquees — one shared pause button on last marquee */
.ad-marquee-group .ad-marquee:last-of-type {
	position: relative;
}
.ad-marquee-group__pause-btn {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 0.5rem;
	z-index: 1;
}

/* Hover-only modifier — JS controls playbackRate for eased start/stop */
.ad-marquee--hover-only {
	cursor: pointer;
	position: relative;
	z-index: 3;
}

/* Work marquee items */
.ad-work-marquee__item {
	flex-shrink: 0;
}
.ad-work-marquee__item video,
.ad-work-marquee__item img {
	object-fit: cover;
}

/* Reduced motion — no animation */
@media (prefers-reduced-motion: reduce) {
	.ad-marquee.is-animated .ad-marquee__track {
		animation: none;
	}
}

/* -----------------------------------------------
   Logo Marquee
   ----------------------------------------------- */

.ad-services-marquee {
	position: relative;
	z-index: 1;
	padding-top: clamp(1.5rem, 3vw, 2.5rem);
	padding-bottom: clamp(1.5rem, 3vw, 2.5rem);
}

.ad-services-marquee .ad-marquee__track .wp-block-group {
	flex-shrink: 0;
}