/* Django Clients — front-end scrolling logo strip. Scoped under
   .django-clients-marquee so it won't leak into the rest of the theme.
   Self-contained: the wrapper (edge fade), the track (animation) and the
   items are all here, so this renders the same wherever it's placed. */

.django-clients-marquee {
	position: relative;
	overflow: hidden;
	width: 100%;
	mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.django-clients-marquee * {
	box-sizing: border-box;
}

.django-clients-track {
	display: flex;
	gap: clamp(14px, 2.4vw, 28px);
	align-items: stretch;
	width: max-content;
	animation: django-clients-marquee 56s linear infinite;
}
.django-clients-marquee:hover .django-clients-track {
	animation-play-state: paused;
}
@keyframes django-clients-marquee {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}

.django-client-item {
	height: 64px;
	padding: 0 26px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(238, 234, 225, 0.06);
	border: 1px solid rgba(238, 234, 225, 0.14);
	border-radius: 3px;
	white-space: nowrap;
	transition: background 0.35s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.35s cubic-bezier(0.22, 1, 0.36, 1), transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}
.django-client-item:hover {
	background: rgba(255, 90, 31, 0.12);
	border-color: rgba(255, 90, 31, 0.5);
	transform: translateY(-3px);
}

.django-client-img {
	max-height: 32px;
	max-width: 140px;
	width: auto;
	height: auto;
	object-fit: contain;
	display: block;
	opacity: 0.92;
	transition: opacity 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}
.django-client-item:hover .django-client-img {
	opacity: 1;
}
/* Logos render in their own original color (no forced invert/monochrome
   filter) — matches how the text fallback already shows each brand's own
   color. If a specific logo file is dark ink drawn for a light background
   and reads poorly on this dark strip, the fix is a white/transparent
   export of that one file, not a CSS filter (which would also wreck any
   logo that's already colored correctly). */

.django-client-text {
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-weight: 700;
	font-size: 17px;
	letter-spacing: 0.01em;
	color: #eeeae1;
}
.django-client-text.is-italic {
	font-family: 'Fraunces', Georgia, serif;
	font-weight: 500;
	font-style: italic;
	letter-spacing: 0.03em;
}

@media (max-width: 760px) {
	.django-clients-track {
		gap: 10px;
		animation-duration: 96s;
	}
	.django-client-item {
		height: 52px;
		padding: 0 18px;
	}
	.django-client-text {
		font-size: 14px;
	}
	.django-client-img {
		max-height: 24px;
		max-width: 100px;
	}
}