/* BCS Logo Marquee – static styles */

.bcs_marquee {
	overflow: hidden;
	-webkit-mask-image: linear-gradient(
		90deg,
		transparent 0,
		#000 120px,
		#000 calc(100% - 120px),
		transparent 100%
	);
	mask-image: linear-gradient(
		90deg,
		transparent 0,
		#000 120px,
		#000 calc(100% - 120px),
		transparent 100%
	);
}

.bcs-marquee__track {
	display: flex;
	width: max-content;
	/* Start paused – JS measures the exact list width after images load,
	   injects a pixel-exact @keyframes rule, then adds --ready to play. */
	animation: bcs-marquee var(--bcs-speed, 30s) linear infinite;
	animation-play-state: paused;
}

/* JS adds this class once the correct animation-name is set */
.bcs-marquee__track--ready {
	animation-play-state: running;
}

/* Pause on hover */
.bcs_marquee:hover .bcs-marquee__track--ready {
	animation-play-state: paused;
}

.bcs-marquee__list {
	display: flex;
	align-items: center;
	gap: var(--bcs-gap, 160px);
	padding-inline-end: var(--bcs-gap, 160px);
	flex-shrink: 0;
}

.bcs_marquee_item {
	flex-shrink: 0;
	line-height: 0;
	margin-bottom: 0 !important; /* override Divi's default 30px module margin */
}

.bcs_marquee_item img {
	display: block;
	max-width: none !important; /* prevent Divi/WP global max-width from shrinking logos */
	width: auto;
	/* height is set via inline style on the element — do not override it here */
}

/* Fallback @keyframes – only used as a placeholder name; JS replaces
   animation-name with a pixel-exact instance-specific keyframe. */
@keyframes bcs-marquee {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}