/* NoirMusk home — feature marquee (endless, seamless, CSS only)

   The track holds two identical groups side by side and slides left by exactly one group's width, then restarts,
   so the loop never jumps. Spacing is padding inside each item (not flex gap), which keeps both groups the same width. */

.noirmusk-marquee {
	position: relative;
	overflow: hidden;
	border-top: 1px solid #ece7de;
	border-bottom: 1px solid #ece7de;
	background: #fff;
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
}

.noirmusk-marquee__track {
	display: flex;
	width: max-content;
	animation: noirmusk-marquee 85s linear infinite;
	will-change: transform;
}
.noirmusk-marquee:hover .noirmusk-marquee__track,
.noirmusk-marquee:focus-within .noirmusk-marquee__track {
	animation-play-state: paused;
}

.noirmusk-marquee__group {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
}

.noirmusk-marquee__item {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	padding: 34px 0;
	white-space: nowrap;
}
.noirmusk-marquee__icon.dashicons {
	flex: 0 0 auto;
	width: 24px;
	height: 24px;
	margin-right: 14px;
	font-size: 24px;
	line-height: 24px;
	color: #a3703f;
	transition: transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.noirmusk-marquee__item:hover .noirmusk-marquee__icon.dashicons {
	transform: scale(1.18) rotate(-6deg);
}
.noirmusk-marquee__text {
	font-family: var(--theme-body-font-family), 'Inter', sans-serif;
	font-size: 15px;
	font-weight: 500;
	letter-spacing: 0.14em;
	line-height: 1;
	text-transform: uppercase;
	color: #1a1a1a;
}
/* small gold diamond between items */
.noirmusk-marquee__sep {
	flex: 0 0 auto;
	width: 7px;
	height: 7px;
	margin: 0 44px;
	background: #d8c29b;
	transform: rotate(45deg);
}

@keyframes noirmusk-marquee {
	from {
		transform: translate3d(0, 0, 0);
	}
	to {
		transform: translate3d(-50%, 0, 0);
	}
}

@media (max-width: 767px) {
	.noirmusk-marquee {
		-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%);
		mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%);
	}
	.noirmusk-marquee__track {
		animation-duration: 66s;
	}
	.noirmusk-marquee__item {
		padding: 26px 0;
	}
	.noirmusk-marquee__icon.dashicons {
		width: 20px;
		height: 20px;
		margin-right: 10px;
		font-size: 20px;
		line-height: 20px;
	}
	.noirmusk-marquee__text {
		font-size: 12.5px;
	}
	.noirmusk-marquee__sep {
		margin: 0 30px;
	}
}

/* Reduced motion: no scrolling; show the four items once, centred and wrapping. */
@media (prefers-reduced-motion: reduce) {
	.noirmusk-marquee {
		-webkit-mask-image: none;
		mask-image: none;
	}
	.noirmusk-marquee__track {
		width: auto;
		animation: none;
		will-change: auto;
		justify-content: center;
	}
	.noirmusk-marquee__group[aria-hidden="true"],
	.noirmusk-marquee__item.is-clone {
		display: none;
	}
	.noirmusk-marquee__group {
		flex-wrap: wrap;
		justify-content: center;
		padding: 0 20px;
	}
	.noirmusk-marquee__item {
		padding: 22px 0;
	}
	.noirmusk-marquee__sep {
		margin: 0 28px;
	}
	.noirmusk-marquee__item.is-last .noirmusk-marquee__sep {
		display: none;
	}
}