/**
 * Briefcase Marquee Strip — front-end styles
 * All selectors namespaced .bcmq-* so they won't fight your theme.
 * Color, size, speed values come from inline CSS variables set by PHP.
 */

.bcmq {
	background: var(--bcmq-bg, #0A1F3A);
	color: var(--bcmq-color, #F4EFE6);
	overflow: hidden;
	border-top: 1px solid rgba(255, 255, 255, .08);
	border-bottom: 1px solid rgba(255, 255, 255, .08);
	position: relative;
	font-family: "Fraunces", "Times New Roman", serif;
	font-feature-settings: "kern";
	width: 100%;
}

.bcmq-track {
	display: flex;
	padding: var(--bcmq-pad-y, 18px) 0;
	width: max-content;
	animation: bcmq-scroll var(--bcmq-duration, 38s) linear infinite;
	will-change: transform;
}

.bcmq-group {
	display: inline-flex;
	align-items: center;
	gap: var(--bcmq-gap, 60px);
	padding-right: var(--bcmq-gap, 60px);
	font-size: var(--bcmq-font-size, 22px);
	font-weight: 400;
	letter-spacing: -0.01em;
	line-height: 1;
	white-space: nowrap;
}

.bcmq-item {
	display: inline-block;
}

.bcmq-item--em {
	font-style: italic;
	color: var(--bcmq-accent, #E6B664);
}

.bcmq-sep {
	display: inline-block;
	color: var(--bcmq-accent, #E6B664);
	font-size: 0.64em;
	transform: translateY(-2px);
	user-select: none;
}

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

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
	.bcmq-track {
		animation: none;
		transform: translateX(0);
	}
}

/* Pause on hover (nice touch, optional) */
.bcmq:hover .bcmq-track {
	animation-play-state: paused;
}