/*
 * AXEK Elements – Logos clients (défilement) — par 6LEX (https://6lex.co)
 * Marquee infini sans couture (deux passes identiques + translateX 50 %).
 * La durée est calculée en JS pour une vitesse constante (px/s).
 */
.axek-logos{ --logo-h: 34px; --logo-gap: 60px; --dur: 30s; }
.axek-logos, .axek-logos * { box-sizing: border-box; }

.axek-logos-title{
	text-align: center; font-weight: 600; font-size: var(--ax-section);
	letter-spacing: -.025em; color: var(--ax-encre); margin: 0 0 30px; line-height: 1.12;}

.axek-logos-viewport{ overflow: hidden; }
.axlogos-fade-yes .axek-logos-viewport{
	-webkit-mask: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
	        mask: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
}

.axek-logos-track{
	display: flex; align-items: center; gap: var(--logo-gap);
	width: max-content;
	animation: axlogos var(--dur) linear infinite;
}
.axek-logos[data-dir="right"] .axek-logos-track{ animation-direction: reverse; }
.axlogos-pause-yes .axek-logos:hover .axek-logos-track{ animation-play-state: paused; }

/* la 2e passe devient enfant flex direct → espacement homogène + aria-hidden */
.axek-logos-dup{ display: contents; }

.axek-logos-item{ display: inline-flex; align-items: center; flex: 0 0 auto; }
.axek-logos-item img{ height: var(--logo-h); width: auto; max-width: none; display: block; }
.axlogos-gray-yes .axek-logos-item img{ filter: grayscale(1); opacity: .6; transition: filter var(--axk-dur-mid) var(--axk-ease), opacity var(--axk-dur-mid) var(--axk-ease); }
.axlogos-gray-yes .axek-logos-item:hover img{ filter: none; opacity: 1; }

@keyframes axlogos{ to{ transform: translateX(-50%); } }

/* accessibilité : pas de défilement → logos statiques centrés */
@media (prefers-reduced-motion: reduce){
	.axek-logos-track{ animation: none; flex-wrap: wrap; justify-content: center; width: auto; }
	.axek-logos-dup{ display: none; }
}
