.blocs-alternes {
	--ba-gap: var(--space-m-l, clamp(1.5rem, 4vw, 3.5rem));
	--ba-gap-bloc: var(--space-l-xl, clamp(2.5rem, 6vw, 5rem));
	--ba-gap-xs: var(--space-xs-s, 0.75rem);
	--ba-radius: var(--border-radius-small, 0.5rem);
	--ba-ratio: 200 / 153;
	--ba-fit: cover;
	--ba-bg: transparent;
	--ba-text: inherit;
	--ba-titre-font: var(--font-fam-averia, inherit);
	--ba-titre-size: clamp(32px, calc(26.6131px + 1.4365vw), 45px);
	--ba-accent: var(--color-green, #17aa55);
	--ba-accent-fort: var(--color-dark-green, #004523);
	--ba-ctrl-bg: var(--color-cream, #f6f4df);
	--ba-ctrl-texte: var(--color-dark-green, #004523);
	--ba-focus: var(--color-blue, #77d0ec);
	--ba-sticky-top: var(--header-height, 0px);
	--ba-duree: 0.2s;

	display: grid;
	gap: var(--ba-gap-bloc);
	color: var(--ba-text);
	background: var(--ba-bg);
}

.blocs-alternes--sombre {
	--ba-bg: var(--color-dark-green, #004523);
	--ba-text: var(--color-cream, #f6f4df);
	--ba-ctrl-bg: var(--color-cream, #f6f4df);
	--ba-ctrl-texte: var(--color-dark-green, #004523);
	padding-block: var(--ba-gap-bloc);
	padding-inline: var(--ba-gap);
	border-radius: var(--ba-radius);
}

.blocs-alternes--sombre {
	--ba-lien: var(--color-light-green, #c7de35);
	--ba-lien-survol: var(--color-blue, #77d0ec);
}

.blocs-alternes--sombre .blocs-alternes__texte a {
	color: var(--ba-lien);
	text-decoration: underline;
	text-underline-offset: 0.15em;
	transition: color var(--ba-duree);
}

.blocs-alternes--sombre .blocs-alternes__texte a:hover {
	color: var(--ba-lien-survol);
}

.blocs-alternes--sombre .blocs-alternes__texte a:active {
	color: var(--ba-ctrl-bg);
}

.blocs-alternes--sombre .blocs-alternes__texte a:focus-visible {
	outline: 3px solid var(--ba-focus);
	outline-offset: 2px;
}

.blocs-alternes--contain {
	--ba-fit: contain;
}

.blocs-alternes__bloc {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--ba-gap);
	align-items: center;
}

.blocs-alternes__bloc--sans-media {
	grid-template-columns: minmax(0, 1fr);
}

.blocs-alternes__bloc--inverse .blocs-alternes__media {
	order: 2;
}

.blocs-alternes__media {
	min-width: 0;
}

.blocs-alternes__media--carrousel {
	align-self: start;
	position: sticky;
	top: calc(var(--ba-sticky-top) + var(--ba-gap-xs));
}

.blocs-alternes__img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: var(--ba-ratio);
	object-fit: var(--ba-fit);
	border-radius: var(--ba-radius);
}

.blocs-alternes__contenu {
	min-width: 0;
}

.blocs-alternes__titre {
	margin: 0 0 var(--ba-gap-xs);
	color: inherit;
	font-family: var(--ba-titre-font);
	font-size: var(--ba-titre-size);
	font-weight: 700;
	line-height: 1.15;
	text-wrap: balance;
}

.blocs-alternes__texte > :first-child {
	margin-top: 0;
}

.blocs-alternes__texte > :last-child {
	margin-bottom: 0;
}

.blocs-alternes__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ba-gap-xs);
	margin-top: var(--ba-gap);
}

.blocs-alternes__actions .w-btn-wrapper {
	margin: 0;
}

.blocs-alternes__bouton:not(.w-btn) {
	display: inline-block;
	padding: 0.8em 1.6em;
	border-radius: var(--ba-radius);
	background: var(--ba-accent);
	color: #fff;
	font-weight: 700;
	text-decoration: none;
	transition: background var(--ba-duree), transform var(--ba-duree);
}

.blocs-alternes__bouton:not(.w-btn):hover {
	background: var(--ba-accent-fort);
}

.blocs-alternes__bouton:not(.w-btn):active {
	transform: scale(0.97);
}

.blocs-alternes__bouton:focus-visible {
	outline: 3px solid var(--ba-focus);
	outline-offset: 3px;
}

.blocs-alternes__carrousel {
	display: grid;
	gap: var(--ba-gap-xs);
	border-radius: var(--ba-radius);
}

.blocs-alternes__carrousel:focus-visible {
	outline: 3px solid var(--ba-focus);
	outline-offset: 4px;
}

.blocs-alternes__scene {
	position: relative;
}

.blocs-alternes__piste {
	position: relative;
	display: flex;
	margin: 0;
	padding: 0;
	list-style: none;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	border-radius: var(--ba-radius);
}

.blocs-alternes__piste::-webkit-scrollbar {
	display: none;
}

.blocs-alternes__diapo {
	flex: 0 0 100%;
	min-width: 0;
	margin: 0;
	padding: 0;
	scroll-snap-align: start;
	scroll-snap-stop: always;
}

.blocs-alternes__fleche {
	position: absolute;
	top: 50%;
	z-index: 1;
	display: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--ba-ctrl-bg);
	color: var(--ba-ctrl-texte);
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25);
	cursor: pointer;
	transform: translateY(-50%);
	transition: background var(--ba-duree), color var(--ba-duree), transform var(--ba-duree);
}

.blocs-alternes__carrousel.is-ready .blocs-alternes__fleche {
	display: inline-flex;
}

.blocs-alternes__fleche--prec {
	left: var(--ba-gap-xs);
}

.blocs-alternes__fleche--prec .blocs-alternes__icone {
	transform: scaleX(-1);
}

.blocs-alternes__fleche--suiv {
	right: var(--ba-gap-xs);
}

.blocs-alternes__fleche:hover {
	background: var(--ba-accent);
	color: #fff;
}

.blocs-alternes__fleche:active {
	transform: translateY(-50%) scale(0.92);
}

.blocs-alternes__fleche:focus-visible {
	outline: 3px solid var(--ba-focus);
	outline-offset: 2px;
}

.blocs-alternes__vignettes {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ba-gap-xs);
}

.blocs-alternes__vignette {
	display: block;
	width: 72px;
	height: 54px;
	margin: 0;
	padding: 0;
	overflow: hidden;
	border: 2px solid transparent;
	border-radius: calc(var(--ba-radius) / 1.5);
	background: transparent;
	opacity: 0.65;
	cursor: pointer;
	transition: opacity var(--ba-duree), border-color var(--ba-duree), transform var(--ba-duree);
}

.blocs-alternes__vignette:hover {
	opacity: 1;
}

.blocs-alternes__vignette:active {
	transform: scale(0.95);
}

.blocs-alternes__vignette:focus-visible {
	outline: 3px solid var(--ba-focus);
	outline-offset: 2px;
}

.blocs-alternes__vignette.is-active {
	border-color: var(--ba-accent);
	opacity: 1;
}

.blocs-alternes--sombre .blocs-alternes__vignette.is-active {
	border-color: var(--ba-ctrl-bg);
}

.blocs-alternes__mini {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media (max-width: 767px) {
	.blocs-alternes__bloc {
		grid-template-columns: minmax(0, 1fr);
	}

	.blocs-alternes__bloc--inverse .blocs-alternes__media {
		order: 0;
	}

	.blocs-alternes__media--carrousel {
		position: static;
	}
}

@media (prefers-reduced-motion: no-preference) {
	.blocs-alternes__carrousel.is-ready .blocs-alternes__piste {
		scroll-behavior: smooth;
	}
}

@media (prefers-reduced-motion: reduce) {
	.blocs-alternes {
		--ba-duree: 0s;
	}
}