/* ==========================================================
   BENEFITS
   ========================================================== */

.benefits {
	position:relative;
	width:100%;
	overflow:hidden;
	background:#ffffff;
}

.benefits__viewport {
	width:100%;
	overflow:hidden;
}

.benefits__track {
	display:grid;
	grid-template-columns:repeat(3, minmax(0, 1fr));
	width:100%;
}

.benefit-card {
	position:relative;
	min-width:0;
	background:#ffffff;
}

/* ----------------------------------------------------------
   Titre
   ---------------------------------------------------------- */

.benefit-card__header {
	position:absolute;
	z-index:3;
	top:0;
	left:0;
	width:40%;
	min-width:210px;
	background:#ffffff;
	border-bottom:8px solid #fbc300;
}

.benefit-card__title {
	margin:0;
	padding:6px 14px 5px;
	color:#181818;
	font-family:"Bebas Neue", Arial, sans-serif;
	font-size:27px;
	font-weight:400;
	line-height:1;
	text-transform:uppercase;
	white-space:nowrap;
}

/* ----------------------------------------------------------
   Image
   ---------------------------------------------------------- */

.benefit-card__visual {
	position:relative;
	height:300px;
	overflow:hidden;
}

.benefit-card picture {
	display:block;
	width:100%;
	height:100%;
}

.benefit-card__image {
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
}

/* Ajustement individuel du cadrage si nécessaire */

.benefit-card:nth-child(1) .benefit-card__image {
	object-position:center center;
}

.benefit-card:nth-child(2) .benefit-card__image {
	object-position:center center;
}

.benefit-card:nth-child(3) .benefit-card__image {
	object-position:center center;
}

/* ----------------------------------------------------------
   Cartouche de texte
   ---------------------------------------------------------- */

.benefit-card__content {
	position:absolute;
	z-index:2;
	right:0;
	bottom:0;
	width:57%;
	min-height:51px;
	padding:10px 18px 9px;
	background:#ffffff;
}

.benefit-card__text {
	margin:0;
	font-size:11px;
	line-height:1.2;
}

.benefit-card__note {
	margin:2px 0 0;
	font-size:8px;
	font-style:italic;
	line-height:1.1;
}

/* ----------------------------------------------------------
   Navigation mobile
   ---------------------------------------------------------- */

.benefits__navigation {
	display:none;
}

/* ----------------------------------------------------------
   Accessibilité
   ---------------------------------------------------------- */

.sr-only {
	position:absolute;
	width:1px;
	height:1px;
	padding:0;
	margin:-1px;
	overflow:hidden;
	clip:rect(0, 0, 0, 0);
	white-space:nowrap;
	border:0;
}
@media (max-width:767px) {

	.benefits {
		padding-bottom:39px;
	}

	.benefits__viewport {
		overflow-x:auto;
		overflow-y:hidden;
		scroll-behavior:smooth;
		scroll-snap-type:x mandatory;
		scrollbar-width:none;
	}

	.benefits__viewport::-webkit-scrollbar {
		display:none;
	}

	.benefits__track {
		display:flex;
		width:auto;
	}

	.benefit-card {
		flex:0 0 100%;
		width:100%;
		scroll-snap-align:start;
		scroll-snap-stop:always;
	}

	.benefit-card__header {
		width:50%;
		min-width:238px;
		border-bottom-width:9px;
	}

	.benefit-card__title {
		padding:8px 14px 6px;
		font-size:27px;
	}

	.benefit-card__visual {
		height:285px;
	}

	.benefit-card__image {
		object-fit:cover;
	}

	.benefit-card:nth-child(1) .benefit-card__image {
		object-position:center center;
	}

	.benefit-card__content {
		width:53%;
		min-height:60px;
		padding:12px 14px 10px;
	}

	.benefit-card__text {
		font-size:11px;
		line-height:1.25;
	}

	.benefit-card__note {
		font-size:8px;
	}

	.benefits__navigation {
		position:absolute;
		right:0;
		bottom:0;
		display:flex;
		height:39px;
	}

	.benefits__arrow {
		display:grid;
		width:45px;
		height:39px;
		padding:0;
		border:0;
		border-left:1px solid #ffffff;
		background:#eeeeee;
		color:#bbbbbb;
		font-size:22px;
		cursor:pointer;
		place-items:center;
	}

	.benefits__arrow:hover,
	.benefits__arrow:focus-visible {
		background:#dddddd;
		color:#777777;
	}

	.benefits__arrow:disabled {
		opacity:.35;
		cursor:default;
	}
}