&&/*
--------------------------------------
Images
--------------------------------------
*/

.background-section-chiffres-cles {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
	background: linear-gradient(132deg, #F43AE3 7.74%, #6A25F9 53.48%, #57DEE7 99.21%);
	padding: 2px;
	border-radius: 16px;
}

.background-section-chiffres-cles::before {
	content: '';
	position: absolute;
	inset: 2px;
	background-color: #16182D;
	z-index: 0;
	border-radius: 16px;
}

.background-section-chiffres-cles::after {
	content: '';
	position: absolute;
	inset: 2px;
	background: linear-gradient(270deg, #16182D 0%, rgba(22, 24, 45, 0.50) 50%, #16182D 100%);
	z-index: 2;
	border-radius: 16px;
}

.background-section-chiffres-cles__container {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 18px;
	overflow: hidden;
	position: relative;
	z-index: 2;
}

.bg-row__track {
	display: flex;
	gap: 16px;
	width: max-content;
	will-change: transform;
	transform: translateZ(0);
	backface-visibility: hidden;
	contain: layout style paint;
}

.bg-row__group {
	display: inline-flex;
	gap: 16px;
}

/* ===== Items de fond ===== */
.bg-item {
	width: 450px !important;
	height: 300px !important;
	overflow: hidden;
	pointer-events: none;
	user-select: none;
	transform: translateZ(0);
	backface-visibility: hidden;
}

.bg-item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
	transform: translateZ(0);
	backface-visibility: hidden;
}

@media (prefers-reduced-motion: reduce) {
	.bg-row__track {
		will-change: auto;
	}
}

@keyframes bgRowMove {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(-50%);
	}
}


/*
--------------------------------------
Chiffres
--------------------------------------
*/

.key-numbers {
	position: absolute;
	z-index: 8;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	justify-content: center;
	column-gap: 150px;
	width: 100%;
}

.key-numbers .key-number__item {
	display: flex;
	flex-direction: column;
	row-gap: 10px;
	color: #fff;
}

.key-numbers .key-number__item-number {
	font-size: calc(80px + (125 - 80) * ((100vw - 320px) / (1920 - 320)));
	font-weight: 700;
	line-height: 75%;
	text-align: center;
}

.key-numbers .key-number__item-text {
	font-size: 25px;
	font-weight: 400;
	letter-spacing: 0.252px;
	text-align: center;
}