/**
 * DILOGO Portfolio : grille, cartes, filtres et fiche projet.
 *
 * Tout suit les couleurs et la police globales du kit Elementor du site
 * (variables --e-global-*), avec les valeurs actuelles en secours.
 */

.dlp-portfolio,
.dlp-accueil,
.dlp-eventail,
.dlp-projet {
	--dlp-fond: var(--e-global-color-8755956, #0A0819);
	--dlp-titre: var(--e-global-color-secondary, #F3F3F7);
	--dlp-texte: var(--e-global-color-text, #D5D5E8);
	--dlp-accent: var(--e-global-color-accent, #0056B3);
	--dlp-principal: var(--e-global-color-primary, #002B5B);
	--dlp-lumiere: var(--e-global-color-d1bleu1, #A1DBFF);
	--dlp-verre: linear-gradient(180deg, #F3F3F714 0%, #F3F3F705 100%);
	--dlp-bord: rgba(243, 243, 247, .12);
	--dlp-bord-fort: rgba(161, 219, 255, .35);
	--dlp-rayon: 1.25rem;
	font-family: var(--e-global-typography-text-font-family, "Syne"), sans-serif;
	color: var(--dlp-texte);
}

.dlp-projet {
	background: var(--dlp-fond);
	overflow: hidden;
}

.dlp-projet .screen-reader-text,
.dlp-portfolio .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* ------------------------------------------------------------------ *
 * Éléments communs
 * ------------------------------------------------------------------ */

.dlp-pastille {
	display: inline-block;
	margin: 0 0 1rem;
	padding: .375rem .875rem;
	border: 1px solid var(--dlp-bord-fort);
	border-radius: .5rem;
	background: rgba(0, 86, 179, .18);
	color: var(--dlp-titre);
	font-size: .8125rem;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: .01em;
}

.dlp-bouton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	min-height: 2.875rem;
	padding: .75rem 1.5rem;
	border: 1px solid transparent;
	border-radius: 50rem;
	font-size: .9375rem;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	transition: background-color .25s ease, border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}

.dlp-bouton:hover,
.dlp-bouton:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 .5rem 1.75rem rgba(0, 86, 179, .45);
}

.dlp-bouton:focus-visible,
.dlp-filtre:focus-visible,
.dlp-carte__lien:focus-visible,
.dlp-cadre__lien:focus-visible,
.dlp-ariane a:focus-visible,
.dlp-appel__retour a:focus-visible {
	outline: 2px solid var(--dlp-lumiere);
	outline-offset: 3px;
}

.dlp-bouton--principal,
.dlp-bouton--principal:visited {
	background: var(--dlp-accent);
	color: var(--dlp-titre);
}

.dlp-bouton--principal:hover,
.dlp-bouton--principal:focus-visible {
	background: var(--dlp-principal);
	border-color: var(--dlp-bord-fort);
	color: var(--dlp-titre);
}

.dlp-bouton--secondaire,
.dlp-bouton--secondaire:visited {
	background: var(--dlp-verre);
	border-color: rgba(243, 243, 247, .18);
	color: var(--dlp-titre);
	backdrop-filter: blur(8px);
}

.dlp-bouton--secondaire:hover,
.dlp-bouton--secondaire:focus-visible {
	border-color: var(--dlp-bord-fort);
	color: var(--dlp-titre);
}

.dlp-boutons {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem;
	margin: 1.75rem 0 0;
}

.dlp-boutons--centre {
	justify-content: center;
}

/* ------------------------------------------------------------------ *
 * Filtres
 * ------------------------------------------------------------------ */

.dlp-filtres {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: .625rem;
	margin: 0 0 1rem;
}

.dlp-filtres--types {
	margin-bottom: 2.25rem;
}

.dlp-filtres[hidden],
.dlp-filtre[hidden],
.dlp-carte[hidden],
.dlp-vide[hidden] {
	display: none;
}

.dlp-portfolio .dlp-filtre {
	padding: .625rem 1.25rem;
	border: 1px solid rgba(243, 243, 247, .18);
	border-radius: 50rem;
	background: var(--dlp-verre);
	color: var(--dlp-texte);
	font-family: inherit;
	font-size: .9375rem;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}

.dlp-portfolio .dlp-filtre:hover,
.dlp-portfolio .dlp-filtre:focus {
	background: var(--dlp-verre);
	border-color: var(--dlp-bord-fort);
	color: var(--dlp-titre);
}

.dlp-portfolio .dlp-filtre.is-actif,
.dlp-portfolio .dlp-filtre.is-actif:hover {
	background: var(--dlp-accent);
	border-color: var(--dlp-accent);
	color: var(--dlp-titre);
}

.dlp-portfolio .dlp-filtre--type {
	padding: .5rem 1rem;
	font-size: .875rem;
}

.dlp-portfolio .dlp-filtres--types .dlp-filtre.is-actif,
.dlp-portfolio .dlp-filtres--types .dlp-filtre.is-actif:hover {
	background: rgba(0, 86, 179, .3);
	border-color: var(--dlp-lumiere);
	color: var(--dlp-titre);
}

/* Un seul projet après filtrage : la carte reste centrée. */
.dlp-grille.is-seul {
	grid-template-columns: minmax(0, 46rem);
	justify-content: center;
}

@media (max-width: 767px) {
	.dlp-filtres {
		gap: .5rem;
	}

	.dlp-portfolio .dlp-filtre {
		padding: .5rem .875rem;
		font-size: .8125rem;
	}

	.dlp-portfolio .dlp-filtre--type {
		padding: .4375rem .75rem;
		font-size: .75rem;
	}
}

/* ------------------------------------------------------------------ *
 * Grille et cartes
 * ------------------------------------------------------------------ */

.dlp-grille {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr));
	gap: 1.5rem;
}

.dlp-grille--1 {
	grid-template-columns: minmax(0, 46rem);
	justify-content: center;
}

@media (min-width: 768px) {
	.dlp-grille--2 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.dlp-carte {
	min-width: 0;
}

.dlp-carte__lien {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	border: 1px solid var(--dlp-bord);
	border-radius: var(--dlp-rayon);
	background: var(--dlp-verre);
	color: var(--dlp-texte);
	text-decoration: none;
	transition: border-color .3s ease, transform .3s ease, box-shadow .3s ease;
}

.dlp-carte__lien:hover,
.dlp-carte__lien:focus-visible {
	border-color: var(--dlp-bord-fort);
	transform: translateY(-4px);
	box-shadow: 0 1.25rem 3rem rgba(0, 43, 91, .55);
	color: var(--dlp-texte);
}

.dlp-carte__visuel {
	display: block;
	position: relative;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: #11102a;
}

.dlp-carte__image,
.dlp-carte__vide {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top center;
	transition: transform .6s ease;
}

.dlp-carte__lien:hover .dlp-carte__image {
	transform: scale(1.04);
}

.dlp-carte__corps {
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	padding: 1.5rem;
}

.dlp-carte__corps .dlp-pastille {
	margin-bottom: .875rem;
	font-size: .75rem;
}

.dlp-carte__titre {
	margin: 0 0 .625rem;
	color: var(--dlp-titre);
	font-family: var(--e-global-typography-primary-font-family, "Syne"), sans-serif;
	font-size: 1.375rem;
	font-weight: 700;
	line-height: 1.25;
}

.dlp-carte__texte {
	display: block;
	margin: 0 0 1.25rem;
	font-size: .9375rem;
	line-height: 1.6;
}

.dlp-carte__plus {
	display: inline-flex;
	gap: .375rem;
	margin-top: auto;
	color: var(--dlp-lumiere);
	font-size: .9375rem;
	font-weight: 600;
}

.dlp-carte__lien:hover .dlp-carte__plus span {
	transform: translateX(3px);
}

.dlp-carte__plus span {
	transition: transform .25s ease;
}

/* ------------------------------------------------------------------ *
 * Éventail de l'accueil
 *
 * Le script ne fait que régler --p, de 0 (cartes empilées) à 1 (éventail
 * ouvert) selon le défilement. Chaque carte porte son écart au centre (--o),
 * sa valeur absolue (--a) et son plan (--z). --h vaut 1 au survol.
 * ------------------------------------------------------------------ */

.dlp-eventail {
	--dlp-carte-l: 15rem;
	--dlp-ecart: 11.5rem;
	--dlp-angle: 9deg;
	--dlp-chute: 1.5rem;
	--p: 1;
}

.dlp-eventail.is-anime {
	--p: 0;
}

.dlp-eventail__scene {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: flex-start;
	height: calc(var(--dlp-carte-l) * 1.55 + var(--dlp-chute) * 3 + 2rem);
	margin: 1rem auto 0;
	perspective: 80rem;
}

.dlp-eventail__carte {
	--h: 0;
	position: absolute;
	top: 1rem;
	left: 50%;
	z-index: var(--z);
	display: block;
	width: var(--dlp-carte-l);
	aspect-ratio: 2 / 3.1;
	margin-left: calc(var(--dlp-carte-l) / -2);
	overflow: hidden;
	border: 1px solid rgba(161, 219, 255, .22);
	border-radius: 1.125rem;
	background: #15142e;
	box-shadow: 0 1.75rem 3.5rem rgba(0, 0, 0, .55), 0 0 0 1px rgba(0, 86, 179, .2);
	transform:
		translateX(calc(var(--o) * var(--dlp-ecart) * var(--p)))
		translateY(calc(var(--a) * var(--dlp-chute) * var(--p) - var(--h) * 1.75rem))
		rotate(calc(var(--o) * (var(--dlp-angle) * var(--p) + 1.5deg * (1 - var(--p))) * (1 - var(--h))))
		scale(calc(1 + var(--h) * .05));
	transform-origin: 50% 110%;
	transition: transform .5s cubic-bezier(.22, .61, .36, 1), box-shadow .4s ease, border-color .4s ease, filter .4s ease;
	will-change: transform;
}

.dlp-eventail.is-anime .dlp-eventail__carte {
	transition: transform .12s linear, box-shadow .4s ease, border-color .4s ease, filter .4s ease;
}

.dlp-eventail.is-anime .dlp-eventail__carte:hover,
.dlp-eventail.is-anime .dlp-eventail__carte:focus-visible {
	transition: transform .45s cubic-bezier(.22, .61, .36, 1), box-shadow .4s ease, border-color .4s ease;
}

.dlp-eventail__carte:hover,
.dlp-eventail__carte:focus-visible {
	--h: 1;
	z-index: 20;
	border-color: var(--dlp-lumiere);
	box-shadow: 0 2.5rem 5rem rgba(0, 0, 0, .6), 0 0 2.5rem rgba(0, 86, 179, .55);
}

.dlp-eventail__scene:hover .dlp-eventail__carte:not(:hover) {
	filter: brightness(.6) saturate(.8);
}

.dlp-eventail__carte:focus-visible {
	outline: 2px solid var(--dlp-lumiere);
	outline-offset: 4px;
}

.dlp-eventail__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top center;
}

.dlp-eventail__etiquette {
	position: absolute;
	left: .75rem;
	right: .75rem;
	bottom: .75rem;
	padding: .4375rem .75rem;
	border: 1px solid rgba(161, 219, 255, .3);
	border-radius: 50rem;
	background: rgba(10, 8, 25, .78);
	backdrop-filter: blur(6px);
	color: var(--dlp-titre);
	font-size: .75rem;
	font-weight: 600;
	line-height: 1.25;
	text-align: center;
	opacity: calc(.35 + var(--p) * .65);
	transform: translateY(calc((1 - var(--p)) * .5rem));
	transition: opacity .3s ease, transform .3s ease;
}

@media (max-width: 1024px) {
	.dlp-eventail {
		--dlp-carte-l: 12rem;
		--dlp-ecart: 8rem;
		--dlp-angle: 8deg;
	}
}

@media (max-width: 767px) {
	.dlp-eventail {
		--dlp-carte-l: 8.25rem;
		--dlp-ecart: 2.75rem;
		--dlp-angle: 6deg;
		--dlp-chute: .75rem;
	}

	.dlp-eventail__etiquette {
		left: .375rem;
		right: .375rem;
		bottom: .375rem;
		padding: .3125rem .375rem;
		font-size: .625rem;
	}

	.dlp-eventail__scene:hover .dlp-eventail__carte:not(:hover) {
		filter: none;
	}
}

/* ------------------------------------------------------------------ *
 * Apparition au défilement et inclinaison des cartes
 * (seulement quand le script a démarré : sans lui, tout reste visible)
 * ------------------------------------------------------------------ */

.dlp-revele {
	opacity: 0;
	transform: translateY(1.75rem);
	transition: opacity .7s ease, transform .7s cubic-bezier(.22, .61, .36, 1);
	transition-delay: var(--dlp-delai, 0s);
}

.dlp-revele.is-visible {
	opacity: 1;
	transform: none;
}

.dlp-carte.is-incline .dlp-carte__lien {
	transform: perspective(60rem) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translateY(-4px);
	transition: transform .12s ease-out, border-color .3s ease, box-shadow .3s ease;
}

@media (prefers-reduced-motion: reduce) {
	.dlp-eventail,
	.dlp-eventail.is-anime {
		--p: 1;
	}

	.dlp-eventail__carte,
	.dlp-eventail.is-anime .dlp-eventail__carte {
		transition: none;
	}

	.dlp-revele {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

.dlp-vide {
	margin: 2rem 0 0;
	text-align: center;
	color: var(--dlp-texte);
}

.dlp-accueil__action {
	margin: 2.5rem 0 0;
	text-align: center;
}

/* ------------------------------------------------------------------ *
 * Fiche projet
 * ------------------------------------------------------------------ */

.dlp-conteneur {
	width: min(100% - 2rem, 75rem);
	margin-inline: auto;
}

.dlp-hero {
	position: relative;
	padding: 7.5rem 0 3rem;
	background: radial-gradient(60rem 30rem at 50% -10%, rgba(0, 86, 179, .35), transparent 70%);
	text-align: center;
}

.dlp-ariane {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: .5rem;
	margin: 0 0 1.25rem;
	font-size: .875rem;
	color: var(--dlp-texte);
}

.dlp-ariane a,
.dlp-ariane a:visited {
	color: var(--dlp-lumiere);
	text-decoration: none;
}

.dlp-ariane a:hover {
	text-decoration: underline;
}

.dlp-hero__titre {
	max-width: 50rem;
	margin: 0 auto 1rem;
	color: var(--dlp-titre);
	font-family: var(--e-global-typography-primary-font-family, "Syne"), sans-serif;
	font-size: clamp(2rem, 1.4rem + 2.6vw, 3.25rem);
	font-weight: 700;
	line-height: 1.15;
	text-wrap: balance;
}

.dlp-hero__texte {
	max-width: 44rem;
	margin: 0 auto;
	font-size: 1.0625rem;
	line-height: 1.7;
}

.dlp-hero .dlp-boutons {
	justify-content: center;
}

.dlp-infos {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr));
	gap: 1rem;
	max-width: 56rem;
	margin: 2.75rem auto 0;
	padding: 1.25rem 1.5rem;
	border: 1px solid var(--dlp-bord);
	border-radius: var(--dlp-rayon);
	background: var(--dlp-verre);
	text-align: left;
}

.dlp-infos div {
	min-width: 0;
}

.dlp-infos dt {
	margin: 0 0 .25rem;
	color: var(--dlp-lumiere);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.dlp-infos dd {
	margin: 0;
	color: var(--dlp-titre);
	font-size: 1rem;
	font-weight: 600;
	overflow-wrap: anywhere;
}

.dlp-couverture {
	padding: 1rem 0 2rem;
}

.dlp-section {
	padding: 4.5rem 0;
}

.dlp-section--serree {
	padding: 2.5rem 0;
}

.dlp-titre-section {
	margin: 0 0 2rem;
	color: var(--dlp-titre);
	font-family: var(--e-global-typography-primary-font-family, "Syne"), sans-serif;
	font-size: clamp(1.625rem, 1.3rem + 1.3vw, 2.375rem);
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	text-wrap: balance;
}

.dlp-galerie .dlp-conteneur,
.dlp-galerie .dlp-pastille {
	text-align: center;
}

.dlp-galerie .dlp-conteneur > .dlp-pastille {
	display: table;
	margin-inline: auto;
}

/* Contenu rédigé dans l'éditeur */

.dlp-contenu {
	max-width: 48rem;
	font-size: 1.0625rem;
	line-height: 1.75;
}

.dlp-contenu > * + * {
	margin-top: 1.25rem;
}

.dlp-contenu h2,
.dlp-contenu h3 {
	margin-top: 3rem;
	color: var(--dlp-titre);
	font-family: var(--e-global-typography-primary-font-family, "Syne"), sans-serif;
	font-weight: 700;
	line-height: 1.25;
}

.dlp-contenu h2 {
	font-size: clamp(1.5rem, 1.25rem + 1vw, 2rem);
}

.dlp-contenu h3 {
	font-size: 1.25rem;
}

.dlp-contenu h2:first-child,
.dlp-contenu h3:first-child {
	margin-top: 0;
}

.dlp-contenu p,
.dlp-contenu li {
	color: var(--dlp-texte);
}

.dlp-contenu strong {
	color: var(--dlp-titre);
}

.dlp-contenu a {
	color: var(--dlp-lumiere);
}

.dlp-contenu ul {
	padding: 0;
	list-style: none;
}

.dlp-contenu ul li {
	position: relative;
	padding-left: 1.75rem;
}

.dlp-contenu ul li + li {
	margin-top: .625rem;
}

.dlp-contenu ul li::before {
	content: "";
	position: absolute;
	top: .65em;
	left: .25rem;
	width: .5rem;
	height: .5rem;
	border-radius: 50%;
	background: var(--dlp-lumiere);
	box-shadow: 0 0 .75rem rgba(161, 219, 255, .7);
}

/* Livrables d'une identité visuelle */

.dlp-livrables {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: .75rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.dlp-livrables li {
	display: inline-flex;
	align-items: center;
	gap: .625rem;
	padding: .75rem 1.25rem;
	border: 1px solid var(--dlp-bord);
	border-radius: 50rem;
	background: var(--dlp-verre);
	color: var(--dlp-titre);
	font-weight: 600;
}

.dlp-livrables li.is-non {
	color: rgba(213, 213, 232, .5);
}

.dlp-livrables__icone {
	display: inline-grid;
	place-items: center;
	width: 1.5rem;
	height: 1.5rem;
	border-radius: 50%;
	background: var(--dlp-accent);
	color: var(--dlp-titre);
	font-size: .8125rem;
}

.dlp-livrables li.is-non .dlp-livrables__icone {
	background: rgba(243, 243, 247, .08);
}

/* Cadres des captures */

.dlp-cadre {
	margin: 0;
	text-align: center;
}

.dlp-cadre__lien {
	display: block;
	position: relative;
	color: inherit;
	text-decoration: none;
}

.dlp-cadre figcaption {
	margin-top: .875rem;
	font-size: .875rem;
	color: var(--dlp-texte);
}

.dlp-cadre__image {
	display: block;
	width: 100%;
	height: auto;
}

.dlp-cadre--ecran,
.dlp-cadre--page {
	--dlp-cadre-bord: rgba(243, 243, 247, .14);
}

.dlp-cadre--ecran .dlp-cadre__lien,
.dlp-couverture .dlp-cadre--ecran,
.dlp-cadre--page .dlp-cadre__lien {
	overflow: hidden;
	border: 1px solid var(--dlp-cadre-bord);
	border-radius: 1rem;
	background: #15142e;
	box-shadow: 0 2rem 4rem rgba(0, 0, 0, .45), 0 0 0 1px rgba(0, 86, 179, .15);
}

.dlp-cadre__barre {
	display: flex;
	gap: .375rem;
	padding: .75rem 1rem;
	border-bottom: 1px solid var(--dlp-cadre-bord, rgba(243, 243, 247, .14));
	background: rgba(243, 243, 247, .04);
}

.dlp-cadre__barre i {
	width: .625rem;
	height: .625rem;
	border-radius: 50%;
	background: rgba(243, 243, 247, .22);
}

.dlp-cadre__barre i:first-child {
	background: #ff5f57;
}

.dlp-cadre__barre i:nth-child(2) {
	background: #febc2e;
}

.dlp-cadre__barre i:nth-child(3) {
	background: #28c840;
}

.dlp-couverture .dlp-cadre--visuel .dlp-cadre__image {
	border-radius: var(--dlp-rayon);
	box-shadow: 0 2rem 4rem rgba(0, 0, 0, .45);
}

/* Page complète : la capture défile dans sa fenêtre au survol */
.dlp-cadre--page .dlp-cadre__fenetre {
	display: block;
	height: 34rem;
	overflow: hidden;
}

.dlp-cadre--page .dlp-cadre__image {
	transition: transform 9s ease-in-out;
}

.dlp-cadre--page .dlp-cadre__lien:hover .dlp-cadre__image,
.dlp-cadre--page .dlp-cadre__lien:focus-visible .dlp-cadre__image {
	transform: translateY(calc(-100% + 34rem));
}

@media (prefers-reduced-motion: reduce) {
	.dlp-cadre--page .dlp-cadre__image,
	.dlp-carte__image,
	.dlp-bouton,
	.dlp-carte__lien {
		transition: none;
	}
}

.dlp-galerie__ecrans {
	display: grid;
	gap: 2rem;
}

@media (min-width: 1024px) {
	.dlp-galerie__ecrans {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.dlp-galerie__ecrans .dlp-cadre--page {
		grid-row: span 2;
	}

	.dlp-galerie__ecrans .dlp-cadre--page .dlp-cadre__fenetre {
		height: 100%;
		min-height: 30rem;
		max-height: 44rem;
	}

	.dlp-galerie__ecrans .dlp-cadre--page .dlp-cadre__lien {
		display: flex;
		flex-direction: column;
		height: 100%;
	}
}

.dlp-galerie__sous-titre {
	margin: 4rem 0 1.75rem;
	color: var(--dlp-titre);
	font-size: 1.25rem;
	font-weight: 700;
	text-align: center;
}

.dlp-galerie__mobiles {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 2rem;
}

.dlp-cadre--mobile {
	width: min(100%, 17.5rem);
}

.dlp-cadre--mobile .dlp-cadre__fenetre {
	display: block;
	overflow: hidden;
	padding: .5rem;
	border: 1px solid rgba(243, 243, 247, .18);
	border-radius: 2.25rem;
	background: #15142e;
	box-shadow: 0 2rem 4rem rgba(0, 0, 0, .5), inset 0 0 0 2px rgba(161, 219, 255, .08);
}

.dlp-cadre--mobile .dlp-cadre__image {
	border-radius: 1.75rem;
}

.dlp-galerie__visuels {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
	gap: 1.5rem;
	align-items: start;
	margin-top: 3rem;
}

.dlp-galerie__visuels:first-of-type,
.dlp-galerie .dlp-titre-section + .dlp-galerie__visuels {
	margin-top: 0;
}

.dlp-cadre--visuel .dlp-cadre__fenetre {
	display: block;
	overflow: hidden;
	border: 1px solid var(--dlp-bord);
	border-radius: 1rem;
	box-shadow: 0 1.25rem 3rem rgba(0, 0, 0, .4);
	transition: transform .3s ease, border-color .3s ease;
}

.dlp-cadre--visuel .dlp-cadre__lien:hover .dlp-cadre__fenetre {
	transform: translateY(-4px);
	border-color: var(--dlp-bord-fort);
}

/* Témoignage */

.dlp-avis {
	max-width: 46rem;
	margin: 0 auto;
	padding: 2.25rem;
	border: 1px solid var(--dlp-bord);
	border-radius: var(--dlp-rayon);
	background: var(--dlp-verre);
	text-align: center;
}

.dlp-avis__etoiles {
	color: #FFC400;
	font-size: 1.125rem;
	letter-spacing: .2em;
}

.dlp-avis blockquote {
	margin: 1rem 0 1.25rem;
	padding: 0;
	border: 0;
}

.dlp-avis blockquote p {
	margin: 0;
	color: var(--dlp-titre);
	font-size: 1.1875rem;
	line-height: 1.65;
}

.dlp-avis blockquote p::before {
	content: "« ";
}

.dlp-avis blockquote p::after {
	content: " »";
}

.dlp-avis figcaption strong {
	display: block;
	color: var(--dlp-titre);
}

.dlp-avis figcaption span {
	font-size: .875rem;
	color: var(--dlp-lumiere);
}

/* Appel final */

.dlp-appel {
	padding: clamp(2.5rem, 2rem + 3vw, 4.5rem) 1.5rem;
	border: 1px solid var(--dlp-bord-fort);
	border-radius: 1.5rem;
	background: radial-gradient(40rem 20rem at 50% 120%, rgba(0, 86, 179, .45), transparent 70%), var(--dlp-verre);
	text-align: center;
}

.dlp-appel__titre {
	margin: 0 0 1rem;
	color: var(--dlp-titre);
	font-family: var(--e-global-typography-primary-font-family, "Syne"), sans-serif;
	font-size: clamp(1.625rem, 1.3rem + 1.4vw, 2.5rem);
	font-weight: 700;
	line-height: 1.2;
	text-wrap: balance;
}

.dlp-appel > p {
	max-width: 36rem;
	margin: 0 auto;
	line-height: 1.7;
}

.dlp-appel__retour {
	margin-top: 1.75rem !important;
	font-size: .9375rem;
}

.dlp-appel__retour a,
.dlp-appel__retour a:visited {
	color: var(--dlp-lumiere);
	text-decoration: none;
}

.dlp-appel__retour a:hover {
	text-decoration: underline;
}

@media (max-width: 767px) {
	.dlp-hero {
		padding: 6rem 0 2rem;
	}

	.dlp-section {
		padding: 3rem 0;
	}

	.dlp-cadre--page .dlp-cadre__fenetre {
		height: 26rem;
	}

	.dlp-cadre--page .dlp-cadre__lien:hover .dlp-cadre__image {
		transform: translateY(calc(-100% + 26rem));
	}

	.dlp-galerie__mobiles {
		gap: 1.25rem;
	}

	.dlp-cadre--mobile {
		width: calc(50% - .625rem);
	}

	.dlp-cadre--mobile .dlp-cadre__fenetre {
		padding: .3125rem;
		border-radius: 1.5rem;
	}

	.dlp-cadre--mobile .dlp-cadre__image {
		border-radius: 1.2rem;
	}

	.dlp-boutons .dlp-bouton {
		width: 100%;
	}
}