/**
 * Section « Récompenses » de l'accueil, à la place du bloc « Blog » de la démo (Anthony
 * n'a pas de blog). En-tête dans l'esprit des autres sections, puis bandeau défilant
 * (marquee) de tous ses badges : grands, en niveaux de gris, ils reprennent leurs
 * couleurs au survol ; le défilement s'arrête tant que la souris est sur le bandeau.
 * Écrans tactiles (pas de survol) : badges en couleur. Animations réduites : pas de
 * défilement automatique, bandeau parcourable au doigt / à la molette.
 */

.aml-awards {
	position: relative;
	overflow: hidden;
	background: var(--aml-white);
	color: var(--aml-ink);
	padding: 36px 0 clamp(96px, 11.1vw, 160px);
}

.aml-awards__inner {
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
	padding: 0 clamp(16px, 2.5vw, 36px);
	box-sizing: border-box;
}

.aml-awards__head {
	display: grid;
	grid-template-columns: 889fr 444fr;
	column-gap: 20px;
	align-items: end;
	margin: clamp(64px, 8.3vw, 120px) 0 clamp(56px, 5.6vw, 80px);
}

.aml-awards__h2 {
	margin: 0;
	font-size: clamp(38px, 5.7vw, 82px);
	font-weight: 500;
	letter-spacing: -0.07em;
	line-height: 0.96;
}

.aml-awards__intro {
	margin: 0;
	max-width: 400px;
	font-size: 20px;
	font-weight: 500;
	letter-spacing: -0.05em;
	line-height: 28px;
	color: rgba(17, 17, 18, 0.6);
}

/* --- Bandeau défilant ------------------------------------------------------------------- */

.aml-marquee {
	--aml-marquee-gap: clamp(40px, 5vw, 80px);
	--aml-marquee-size: clamp(120px, 13.9vw, 200px);
	position: relative;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%);
}

.aml-marquee__track {
	display: flex;
	width: max-content;
	animation: aml-marquee var(--aml-marquee-duration, 150s) linear infinite;
}

.aml-marquee:hover .aml-marquee__track,
.aml-marquee:focus-within .aml-marquee__track {
	animation-play-state: paused;
}

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

.aml-marquee__list {
	display: flex;
	align-items: center;
	gap: var(--aml-marquee-gap);
	margin: 0;
	padding: 20px var(--aml-marquee-gap) 20px 0;
	list-style: none;
}

.aml-marquee__list li {
	flex: none;
	margin: 0;
}

.aml-marquee__list img {
	display: block;
	width: auto;
	max-width: none;
	height: var(--aml-marquee-size);
	filter: grayscale(1);
	opacity: 0.45;
	transition:
		filter 0.5s ease,
		opacity 0.5s ease,
		transform 0.6s cubic-bezier(0.34, 1.4, 0.64, 1);
}

/* Badges carrés sur fond plein (logos, carte Team Belgium) : coins adoucis */
.aml-marquee__list .is-square img {
	border-radius: 12px;
}

.aml-marquee__list li:hover img {
	filter: none;
	opacity: 1;
	transform: scale(1.06);
}

@media (hover: none) {
	.aml-marquee__list img {
		filter: none;
		opacity: 1;
	}
}

@media (prefers-reduced-motion: reduce) {
	.aml-marquee {
		overflow-x: auto;
		-webkit-mask-image: none;
		mask-image: none;
	}
	.aml-marquee__track { animation: none; }
	.aml-marquee__list[aria-hidden='true'] { display: none; }
	.aml-marquee__list { padding-left: clamp(16px, 2.5vw, 36px); }
}

/* --- Tablette et mobile -------------------------------------------------------------- */

@media (max-width: 1199px) {
	.aml-awards__head { grid-template-columns: 1fr; row-gap: 24px; }
}
