/* Nouveautés HBF : mise en page reprise de la page « Nos univers produits ». */
.hbf-nv {
	--hbf-nv-titre: #ff5e15;
	--hbf-nv-texte: #444444;
	--hbf-nv-bouton: #394049;
	--hbf-nv-bouton-survol: #ff5e15;
	/* Espace vertical entre deux nouveautés : réglage « Espace entre deux nouveautés »
	   (envoyé en style en ligne), plafonné sur tablette et mobile. */
	--hbf-nv-espace-base: 80px;
	--hbf-nv-espace: var(--hbf-nv-espace-base);
	/* Proportions image / écart / texte (mêmes que les anciennes rangées WPBakery).
	   Ajustables dans Apparence > Personnaliser > CSS additionnel si besoin. */
	--hbf-nv-col-image: 47.5fr;
	--hbf-nv-col-texte: 42fr;
	--hbf-nv-ecart: 10.5%;
	display: flex;
	flex-direction: column;
	gap: var(--hbf-nv-espace);
	margin: 0;
	padding: 0;
}

.hbf-nv .hbf-nv__item {
	display: grid;
	grid-template-columns: minmax(0, var(--hbf-nv-col-image)) minmax(0, var(--hbf-nv-col-texte));
	column-gap: var(--hbf-nv-ecart);
	align-items: center;
	margin: 0;
	padding: 0;
}

.hbf-nv .hbf-nv__item--reverse {
	grid-template-columns: minmax(0, var(--hbf-nv-col-texte)) minmax(0, var(--hbf-nv-col-image));
}

.hbf-nv .hbf-nv__item--reverse .hbf-nv__media {
	order: 2;
}

.hbf-nv .hbf-nv__item--no-image {
	grid-template-columns: minmax(0, 1fr);
}

.hbf-nv .hbf-nv__media {
	margin: 0;
	line-height: 0;
}

.hbf-nv .hbf-nv__media a {
	display: block;
}

.hbf-nv .hbf-nv__img {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
	margin: 0;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

.hbf-nv--ratio .hbf-nv__img {
	aspect-ratio: 3 / 2;
	object-fit: cover;
}

.hbf-nv .hbf-nv__title {
	margin: 0 0 28px;
	padding: 0;
	color: var(--hbf-nv-titre);
	font-family: inherit;
	font-size: 24px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: normal;
	text-transform: none;
}

.hbf-nv .hbf-nv__text {
	color: var(--hbf-nv-texte);
	font-size: 17px;
	line-height: 1.76;
}

.hbf-nv .hbf-nv__text p {
	margin: 0 0 1em;
}

.hbf-nv .hbf-nv__text > :last-child {
	margin-bottom: 0;
}

.hbf-nv .hbf-nv__text a {
	color: inherit;
	text-decoration: underline;
}

.hbf-nv .hbf-nv__action {
	margin: 44px 0 0;
	padding: 0;
}

.hbf-nv a.hbf-nv__btn {
	display: inline-block;
	padding: 12px 32px;
	border: 0;
	border-radius: 999px;
	background: var(--hbf-nv-bouton);
	color: #ffffff;
	font-family: inherit;
	font-size: 18px;
	font-weight: 500;
	line-height: 1.4;
	text-decoration: none;
	transition: background-color 0.2s ease;
}

.hbf-nv a.hbf-nv__btn:hover,
.hbf-nv a.hbf-nv__btn:focus-visible {
	background: var(--hbf-nv-bouton-survol);
	color: #ffffff;
	text-decoration: none;
}

.hbf-nv a.hbf-nv__btn:focus-visible {
	outline: 2px solid var(--hbf-nv-bouton);
	outline-offset: 3px;
}

.hbf-nv .hbf-nv__sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Apparition en fondu (la classe hbf-nv--js n’est ajoutée que si le script tourne). */
.hbf-nv--anim.hbf-nv--js .hbf-nv__body {
	opacity: 0;
	transition: opacity 0.8s ease 0.2s;
}

.hbf-nv--anim.hbf-nv--js .hbf-nv__item.is-visible .hbf-nv__body {
	opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
	.hbf-nv--anim.hbf-nv--js .hbf-nv__body {
		opacity: 1;
		transition: none;
	}
}

@media (max-width: 1024px) {
	.hbf-nv {
		--hbf-nv-espace: min(var(--hbf-nv-espace-base), 80px);
	}

	.hbf-nv .hbf-nv__item {
		column-gap: 6%;
	}

	.hbf-nv .hbf-nv__item,
	.hbf-nv .hbf-nv__item--reverse {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}

	.hbf-nv .hbf-nv__item--no-image {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (max-width: 767px) {
	.hbf-nv {
		--hbf-nv-espace: min(var(--hbf-nv-espace-base), 56px);
	}

	.hbf-nv .hbf-nv__item,
	.hbf-nv .hbf-nv__item--reverse {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 28px;
	}

	.hbf-nv .hbf-nv__item--reverse .hbf-nv__media {
		order: 0;
	}

	.hbf-nv .hbf-nv__title {
		margin-bottom: 16px;
		font-size: 22px;
	}

	.hbf-nv .hbf-nv__text {
		font-size: 16px;
	}

	.hbf-nv .hbf-nv__action {
		margin-top: 28px;
	}
}