/*
 * RLL - Accueil, la feuille (v1.0.0, octobre 2026). Maquette : maquettes/accueil-2026-10/.
 *
 * Servie sur la page d'accueil seulement, quand la nouvelle version est active
 * (body.rll-acc-actif). Toutes les regles visent `.rll-acc` ou le lien du pied pose par
 * rll-accueil.php : sans eux, elle ne touche a rien.
 *
 * Specificite : le Kit pose `.elementor-kit-7 h1..h3` (Tahoma, petrole) et
 * `.elementor-kit-7 a` (souligne) en 0,1,1, et `a:hover` en 0,2,1 ; le theme Hello pose
 * ses marges de `p`, `ul`, `h*` en 0,0,1. Chaque element porte donc une classe, et chaque
 * regle commence par `.rll-acc .ac-…` (0,2,0 au moins).
 *
 * Les jetons sont declares sur `body.rll-acc-actif`, et non sur `:root` : les couleurs du
 * Kit vivent sur `body.elementor-kit-7`. Chaque couleur pointe d'abord vers le jeton du Kit.
 *
 * Gouttiere : celle de tout le site, menu compris (agent des marges, 01/10/2026) :
 * max(20px, (100% - 1150px) / 2). 20 px jusqu'a 1 190 px, 108 px a 1 366, 385 px a 1 920.
 */

body.rll-acc-actif {
	--ac-papier: var(--e-global-color-rllpapier, #FCFBF8);
	--ac-surface: var(--e-global-color-rllsurface, #FFFFFF);
	--ac-encre: var(--e-global-color-text, #16211F);
	--ac-doux: var(--e-global-color-rlldoux, #4B5A57);
	--ac-petrole: var(--e-global-color-primary, #0E4D5A);
	--ac-clair: var(--e-global-color-rllclair, #BEDCD9);
	--ac-or: var(--e-global-color-accent, #F2C14E);
	--ac-or-encre: var(--e-global-color-rllortexte, #3A2C06);
	--ac-sauge: var(--e-global-color-secondary, #7AAE9B);
	--ac-filet: var(--e-global-color-rllfilet, #E4E6DF);
	--ac-champ: var(--e-global-color-rllchamp, #F3F5F1);
	--ac-surprofond: var(--e-global-color-rllsurprofond, #F1F7F6);
	--ac-filet-sombre: rgba(190, 220, 217, .28);

	--ac-voix: var(--e-global-typography-af71cb5-font-family, "Newsreader"), Georgia, serif;
	--ac-sans: var(--e-global-typography-text-font-family, "Instrument Sans"), system-ui, sans-serif;

	/* L'echelle verticale du site (agent des marges, 01/10/2026) : 8 / 16 / 26 / 56, servie
	   aussi pour les ecarts horizontaux. --ac-e1 (4 px) ne sert qu'aux decalages fins
	   (survol, contour de focus). */
	--ac-e1: 4px;
	--ac-v1: 8px;
	--ac-v2: 16px;
	--ac-v3: 26px;
	--ac-v4: 56px;

	/* La gouttiere commune du site, menu compris : max(20px, (100% - 1150px) / 2). */
	--ac-gouttiere: 20px;
	--ac-largeur: 1150px;
	--ac-bande: var(--ac-v4);
	--ac-lecture: 62ch;

	--ac-t-meta: 14px;
	--ac-t-petit: 15px;
	--ac-t-corps: 17px;
	--ac-t-chapo: 19px;
	--ac-t-voix: 21px;
	--ac-t-pointe: clamp(22px, 2.2vw, 27px);
	--ac-t-h3: 17px;
	--ac-t-h2: clamp(28px, 3.1vw, 40px);
	--ac-t-h1: clamp(38px, 5.4vw, 66px);
	--ac-t-prix: 23px;

	--ac-ic: 56px;
	--ac-ic-mob: 44px;
	--ac-ic-ligne: 36px;
	--ac-tel: 236px;
	--ac-telephones-max: 520px;
	--ac-dessin-max: 460px;
	--ac-illus: 180px;
	--ac-illus-large: 240px;
	--ac-portrait: 112px;
	--ac-bouton-h: 48px;
	--ac-barre-h: 76px;
	--ac-trait: 1px;
	--ac-trait-fort: 2px;
	--ac-fleche: 40px;

	--ac-duree: 260ms;
	--ac-courbe: cubic-bezier(.22, 1, .36, 1);
}

@media (min-width: 900px) { /* ds-allow-hardcode : point de rupture */
	body.rll-acc-actif {
		--ac-t-corps: 18px;
	}
}

/* ==================================================================== */
/* Le socle                                                              */
/* ==================================================================== */

.rll-acc,
.rll-acc *,
.rll-acc *::before,
.rll-acc *::after {
	box-sizing: border-box;
}

.rll-acc {
	background: var(--ac-papier);
	color: var(--ac-encre);
	font-family: var(--ac-sans);
	font-size: var(--ac-t-corps);
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

.rll-acc h1,
.rll-acc h2,
.rll-acc h3,
.rll-acc p,
.rll-acc ul,
.rll-acc ol,
.rll-acc li,
.rll-acc figure,
.rll-acc blockquote {
	margin: 0;
	padding: 0;
}

.rll-acc ul,
.rll-acc ol {
	list-style: none;
}

.rll-acc img {
	display: block;
	max-width: 100%;
	height: auto;
}

.rll-acc p {
	text-wrap: pretty;
}

.rll-acc strong {
	font-weight: 600;
	color: var(--ac-encre);
}

.rll-acc ::selection {
	background: var(--ac-or);
	color: var(--ac-or-encre);
}

.rll-acc a:focus-visible {
	outline: var(--ac-trait-fort) solid var(--ac-petrole);
	outline-offset: var(--ac-e1);
	box-shadow: none;
}

.rll-acc .ac-pertes a:focus-visible,
.rll-acc .ac-article--une a:focus-visible {
	outline-color: var(--ac-or);
}

.rll-acc .ac-col {
	padding-inline: max(var(--ac-gouttiere), calc((100% - var(--ac-largeur)) / 2));
}

.rll-acc .ac-bande {
	padding-block: var(--ac-bande);
}

.rll-acc .ac-h1,
.rll-acc .ac-h2 {
	font-family: var(--ac-voix);
	font-weight: 400;
	color: var(--ac-encre);
	text-wrap: balance;
	letter-spacing: -0.01em;
}

.rll-acc .ac-h2 {
	font-size: var(--ac-t-h2);
	line-height: 1.15;
}

.rll-acc .ac-bouton,
.rll-acc .ac-bouton:visited {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var(--ac-bouton-h);
	padding: var(--ac-v1) var(--ac-v3);
	background: var(--ac-or);
	color: var(--ac-or-encre);
	font: 600 var(--ac-t-petit)/1.2 var(--ac-sans);
	text-decoration: none;
	border: 0;
	border-radius: 0;
	transition: background-color var(--ac-duree) var(--ac-courbe);
}

.rll-acc .ac-bouton:hover,
.rll-acc .ac-bouton:focus-visible {
	background: color-mix(in srgb, var(--ac-or) 86%, var(--ac-encre));
	color: var(--ac-or-encre);
	text-decoration: none;
}

.rll-acc .ac-lien-fort,
.rll-acc .ac-lien-fort:visited {
	display: inline-flex;
	align-items: center;
	gap: var(--ac-v1);
	min-height: var(--ac-bouton-h);
	color: var(--ac-petrole);
	font-weight: 600;
	text-decoration: underline;
	text-decoration-thickness: var(--ac-trait);
	text-underline-offset: .2em;
}

.rll-acc .ac-lien-fort:hover {
	color: var(--ac-encre);
}

.rll-acc .ac-fleche-lien {
	flex: 0 0 auto;
	width: var(--ac-v2);
	height: var(--ac-v2);
	transition: transform var(--ac-duree) var(--ac-courbe);
}

.rll-acc a:hover .ac-fleche-lien {
	transform: translateX(var(--ac-e1));
}

/* ==================================================================== */
/* 1. L'ouverture                                                        */
/* ==================================================================== */

.rll-acc .ac-ouverture {
	padding-block: var(--ac-v4) var(--ac-bande);
}

.rll-acc .ac-ouverture__grille {
	display: grid;
	gap: var(--ac-v3);
}

.rll-acc .ac-h1 {
	font-size: var(--ac-t-h1);
	line-height: 1.04;
	letter-spacing: -0.02em;
	max-width: 13ch;
}

.rll-acc .ac-ouverture__qui {
	margin-top: var(--ac-v2);
	font-size: var(--ac-t-petit);
	color: var(--ac-doux);
}

.rll-acc .ac-ouverture__pointe {
	margin-top: var(--ac-v3);
	font-family: var(--ac-voix);
	font-size: var(--ac-t-pointe);
	line-height: 1.3;
	color: var(--ac-petrole);
	max-width: 30ch;
}

.rll-acc .ac-ouverture__chapo {
	margin-top: var(--ac-v2);
	font-size: var(--ac-t-chapo);
	line-height: 1.6;
	max-width: 54ch;
}

.rll-acc .ac-ouverture__action {
	margin-top: var(--ac-v3);
}

.rll-acc .ac-ouverture__img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	object-position: 50% 30%;
}

@media (min-width: 760px) { /* ds-allow-hardcode : point de rupture */
	.rll-acc .ac-ouverture {
		padding-block: var(--ac-v4) var(--ac-bande);
	}

	.rll-acc .ac-ouverture__grille {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
		column-gap: var(--ac-v4);
		align-items: center;
	}

	.rll-acc .ac-ouverture__img {
		aspect-ratio: 4 / 5;
	}
}

/* ==================================================================== */
/* 2. Les cinq savoir-faire                                              */
/* ==================================================================== */

/* L'ouverture porte deja la respiration du dessous : pas de double bande. */
.rll-acc .ac-savoirs {
	padding-top: 0;
}

.rll-acc .ac-savoirs__titre {
	margin-bottom: var(--ac-v3);
}

.rll-acc .ac-savoirs__grille {
	display: grid;
	gap: var(--ac-v2);
}

/* Sur telephone, l'icone tient a cote de la citation ; le titre et la phrase reprennent
   toute la largeur. */
.rll-acc .ac-savoir {
	display: grid;
	grid-template-columns: var(--ac-ic-mob) minmax(0, 1fr);
	column-gap: var(--ac-v2);
	align-items: start;
	padding: var(--ac-v2) var(--ac-v2) var(--ac-v3);
	background: var(--ac-surface);
	border: var(--ac-trait) solid var(--ac-filet);
}

.rll-acc .ac-savoir__icone {
	width: var(--ac-ic-mob);
	height: var(--ac-ic-mob);
	transition: transform var(--ac-duree) var(--ac-courbe);
}

.rll-acc .ac-savoir__citation {
	font-family: var(--ac-voix);
	font-size: var(--ac-t-chapo);
	font-style: normal;
	line-height: 1.3;
	color: var(--ac-encre);
	border: 0;
}

.rll-acc .ac-savoir__titre,
.rll-acc .ac-savoir__texte {
	grid-column: 1 / -1;
}

.rll-acc .ac-savoir__titre {
	margin-top: var(--ac-v2);
	font-family: var(--ac-sans);
	font-size: var(--ac-t-h3);
	line-height: 1.3;
	font-weight: 600;
	color: var(--ac-petrole);
}

.rll-acc .ac-savoir__texte {
	margin-top: 0;
	font-size: var(--ac-t-petit);
	line-height: 1.5;
	color: var(--ac-doux);
}

.rll-acc .ac-savoir:hover .ac-savoir__icone {
	transform: translateY(calc(-1 * var(--ac-e1))) rotate(-4deg);
}

@media (min-width: 600px) { /* ds-allow-hardcode : point de rupture */
	.rll-acc .ac-savoirs__grille {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--ac-v2);
	}

	.rll-acc .ac-savoir {
		grid-template-columns: minmax(0, 1fr);
		padding: var(--ac-v3);
	}

	.rll-acc .ac-savoir__icone {
		width: var(--ac-ic);
		height: var(--ac-ic);
		margin-bottom: var(--ac-v2);
	}

	.rll-acc .ac-savoir:last-child {
		grid-column: 1 / -1;
	}
}

@media (min-width: 1000px) { /* ds-allow-hardcode : point de rupture */
	/* Deux larges, puis trois : l'IA et les postes ouvrent. */
	.rll-acc .ac-savoirs__grille {
		grid-template-columns: repeat(6, minmax(0, 1fr));
		gap: var(--ac-v3);
	}

	.rll-acc .ac-savoir {
		grid-column: span 2;
		padding: var(--ac-v3) var(--ac-v3);
	}

	.rll-acc .ac-savoir:nth-child(-n+2) {
		grid-column: span 3;
	}

	.rll-acc .ac-savoir:nth-child(-n+2) .ac-savoir__citation {
		font-size: var(--ac-t-voix);
	}

	.rll-acc .ac-savoir:last-child {
		grid-column: span 2;
	}
}

/* ==================================================================== */
/* 3. Trois pertes, une seule cause                                      */
/* ==================================================================== */

.rll-acc .ac-pertes {
	background: var(--ac-petrole);
	color: var(--ac-surface);
}

.rll-acc .ac-pertes__grille {
	display: grid;
	gap: var(--ac-v3);
	grid-template-areas: "titre" "liste" "dessin" "fin";
}

.rll-acc .ac-pertes__titre {
	grid-area: titre;
	color: var(--ac-surface);
	max-width: 22ch;
}

.rll-acc .ac-pertes__liste {
	grid-area: liste;
	counter-reset: ac-perte;
	display: grid;
	gap: var(--ac-v3);
}

.rll-acc .ac-pertes__liste li {
	counter-increment: ac-perte;
	display: grid;
	grid-template-columns: var(--ac-v3) minmax(0, 1fr);
	column-gap: var(--ac-v2);
	color: var(--ac-clair);
	max-width: var(--ac-lecture);
}

.rll-acc .ac-pertes__liste li::before {
	content: counter(ac-perte);
	font-family: var(--ac-voix);
	font-size: var(--ac-t-h2);
	line-height: 1;
	color: var(--ac-sauge);
}

.rll-acc .ac-pertes__fin {
	grid-area: fin;
	display: grid;
	gap: var(--ac-v3);
}

.rll-acc .ac-pertes__cause {
	font-family: var(--ac-voix);
	font-size: var(--ac-t-pointe);
	line-height: 1.3;
	color: var(--ac-surface);
	max-width: 32ch;
}

.rll-acc .ac-pertes__generations {
	color: var(--ac-clair);
	max-width: var(--ac-lecture);
}

.rll-acc .ac-dessin {
	grid-area: dessin;
	max-width: var(--ac-dessin-max);
}

.rll-acc .ac-dessin__img {
	width: 100%;
	aspect-ratio: 1;
	border: var(--ac-trait) solid var(--ac-filet-sombre);
}

.rll-acc .ac-dessin__legende {
	margin-top: var(--ac-v2);
	font-style: normal;
	font-size: var(--ac-t-petit);
	line-height: 1.5;
	color: var(--ac-clair);
}

@media (min-width: 900px) { /* ds-allow-hardcode : point de rupture */
	.rll-acc .ac-pertes__grille {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
		grid-template-areas: "titre dessin" "liste dessin" "fin dessin";
		column-gap: var(--ac-v4);
		row-gap: var(--ac-v3);
		align-items: start;
	}

	.rll-acc .ac-dessin {
		align-self: center;
	}
}

/* Dans les tetes, puis ecrit */
.rll-acc .ac-passage {
	background: var(--ac-surprofond);
}

.rll-acc .ac-passage__grille {
	display: grid;
	gap: var(--ac-v2);
	align-items: center;
}

.rll-acc .ac-colonne {
	display: flex;
	flex-direction: column;
	padding: var(--ac-v3);
}

.rll-acc .ac-colonne__titre {
	font-family: var(--ac-sans);
	font-size: var(--ac-t-meta);
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.rll-acc .ac-colonne__liste {
	margin-top: var(--ac-v2);
	display: grid;
	gap: var(--ac-v2);
}

.rll-acc .ac-colonne__liste li {
	position: relative;
	padding-left: var(--ac-v3);
	font-family: var(--ac-voix);
	font-size: var(--ac-t-chapo);
	line-height: 1.35;
}

.rll-acc .ac-colonne__liste li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .55em;
	width: var(--ac-v1);
	height: var(--ac-v1);
}

.rll-acc .ac-colonne__fin {
	margin-top: var(--ac-v3);
	padding-top: var(--ac-v2);
	border-top: var(--ac-trait) solid var(--ac-filet);
	font-size: var(--ac-t-petit);
}

.rll-acc .ac-colonne--tetes {
	background: var(--ac-champ);
	color: var(--ac-doux);
}

.rll-acc .ac-colonne--tetes .ac-colonne__titre,
.rll-acc .ac-colonne--tetes .ac-colonne__liste li {
	color: var(--ac-doux);
}

.rll-acc .ac-colonne--tetes .ac-colonne__liste li::before {
	border: var(--ac-trait) solid var(--ac-doux);
}

.rll-acc .ac-colonne--ecrit {
	background: var(--ac-surface);
	border: var(--ac-trait) solid var(--ac-petrole);
}

.rll-acc .ac-colonne--ecrit .ac-colonne__titre {
	color: var(--ac-petrole);
}

.rll-acc .ac-colonne--ecrit .ac-colonne__liste li::before {
	background: var(--ac-petrole);
}

.rll-acc .ac-colonne--ecrit .ac-colonne__fin {
	color: var(--ac-petrole);
	font-weight: 600;
	border-top-color: var(--ac-petrole);
}

.rll-acc .ac-colonne__illus {
	width: 100%;
	max-width: var(--ac-illus);
	margin: 0 0 var(--ac-v2) auto;
}

.rll-acc .ac-passage__fleche {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--ac-petrole);
}

.rll-acc .ac-passage__fleche svg {
	width: var(--ac-fleche);
	height: var(--ac-fleche);
	transform: rotate(90deg);
}

/* Le seul mouvement de la page : la fleche se trace quand le bloc entre a l'ecran. Sans
   prise en charge des animations liees au defilement, elle est simplement dessinee. */
@supports (animation-timeline: view()) {
	@media (prefers-reduced-motion: no-preference) {
		.rll-acc .ac-passage__fleche path {
			stroke-dasharray: 60;
			animation: ac-tracer linear both;
			animation-timeline: view();
			animation-range: entry 20% cover 45%;
		}
	}
}

@keyframes ac-tracer {
	from { stroke-dashoffset: 60; }
	to { stroke-dashoffset: 0; }
}

@media (min-width: 760px) { /* ds-allow-hardcode : point de rupture */
	.rll-acc .ac-passage__grille {
		grid-template-columns: minmax(0, 1fr) var(--ac-fleche) minmax(0, 1fr);
		gap: var(--ac-v3);
	}

	.rll-acc .ac-passage__fleche svg {
		transform: none;
	}

	.rll-acc .ac-colonne {
		padding: var(--ac-v3);
	}

	.rll-acc .ac-colonne__illus {
		max-width: var(--ac-illus-large);
	}
}

/* ==================================================================== */
/* 4. Un exemple : le logiciel qui n'existait pas                        */
/* ==================================================================== */

.rll-acc .ac-exemple {
	background: var(--ac-surface);
}

.rll-acc .ac-exemple__grille {
	display: grid;
	gap: var(--ac-v4);
}

.rll-acc .ac-exemple__texte {
	display: grid;
	gap: var(--ac-v2);
	max-width: var(--ac-lecture);
	color: var(--ac-doux);
}

.rll-acc .ac-exemple__texte .ac-h2 {
	margin-bottom: var(--ac-v1);
}

.rll-acc .ac-licence {
	margin-block: var(--ac-v1);
	padding: var(--ac-v2) var(--ac-v3);
	background: var(--ac-champ);
	color: var(--ac-encre);
}

.rll-acc .ac-telephones {
	max-width: var(--ac-telephones-max);
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--ac-v2);
	align-items: start;
}

.rll-acc .ac-tel__ecran {
	overflow: hidden;
	background: var(--ac-surface);
	border: var(--ac-trait) solid var(--ac-filet);
}

.rll-acc .ac-tel__img {
	width: 100%;
	aspect-ratio: 9 / 16;
	object-fit: cover;
	object-position: top;
}

.rll-acc .ac-tel__titre {
	margin-bottom: var(--ac-v2);
	font-family: var(--ac-sans);
	font-size: var(--ac-t-petit);
	font-weight: 600;
	line-height: 1.3;
	color: var(--ac-petrole);
}

.rll-acc .ac-tel__legende {
	margin-top: var(--ac-v2);
	font-style: normal;
	font-size: var(--ac-t-meta);
	line-height: 1.5;
	color: var(--ac-doux);
}

@media (min-width: 900px) { /* ds-allow-hardcode : point de rupture */
	.rll-acc .ac-exemple__grille {
		grid-template-columns: minmax(0, 6fr) minmax(0, 6fr);
		column-gap: var(--ac-v4);
		align-items: start;
	}

	.rll-acc .ac-telephones {
		max-width: none;
		grid-template-columns: repeat(2, var(--ac-tel));
		justify-content: end;
		gap: var(--ac-v3);
	}

	.rll-acc .ac-tel--client {
		margin-top: var(--ac-v4);
	}
}

/* ==================================================================== */
/* 5. Derniers articles                                                  */
/* ==================================================================== */

.rll-acc .ac-articles__tete {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--ac-v2) var(--ac-v3);
	margin-bottom: var(--ac-v3);
}

.rll-acc .ac-articles__grille {
	display: grid;
	gap: var(--ac-v2);
}

.rll-acc .ac-article__lien,
.rll-acc .ac-article__lien:visited {
	display: flex;
	flex-direction: column;
	gap: var(--ac-v1);
	height: 100%;
	padding: var(--ac-v3);
	background: var(--ac-surface);
	border: var(--ac-trait) solid var(--ac-filet);
	color: var(--ac-encre);
	text-decoration: none;
	transition: border-color var(--ac-duree) var(--ac-courbe);
}

.rll-acc .ac-article__lien:hover {
	border-color: var(--ac-petrole);
	color: var(--ac-encre);
	text-decoration: none;
}

.rll-acc .ac-article__lien:hover .ac-article__titre {
	text-decoration: underline;
	text-decoration-thickness: var(--ac-trait);
	text-underline-offset: .18em;
}

.rll-acc .ac-article__meta {
	font-size: var(--ac-t-meta);
	color: var(--ac-doux);
	font-variant-numeric: tabular-nums;
}

.rll-acc .ac-article__meta b {
	font-weight: 600;
	color: var(--ac-petrole);
}

.rll-acc .ac-article__titre {
	font-family: var(--ac-voix);
	font-size: var(--ac-t-voix);
	line-height: 1.25;
	color: var(--ac-encre);
	text-wrap: balance;
}

.rll-acc .ac-article__ligne {
	font-size: var(--ac-t-petit);
	line-height: 1.5;
	color: var(--ac-doux);
}

.rll-acc .ac-article--une .ac-article__lien,
.rll-acc .ac-article--une .ac-article__lien:visited {
	background: var(--ac-petrole);
	border-color: var(--ac-petrole);
}

.rll-acc .ac-article--une .ac-article__lien:hover {
	border-color: var(--ac-or);
}

.rll-acc .ac-article--une .ac-article__titre {
	font-size: var(--ac-t-pointe);
	color: var(--ac-surface);
	max-width: 24ch;
}

.rll-acc .ac-article--une .ac-article__meta,
.rll-acc .ac-article--une .ac-article__ligne {
	color: var(--ac-clair);
}

.rll-acc .ac-article--une .ac-article__meta b {
	color: var(--ac-or);
}

@media (min-width: 760px) { /* ds-allow-hardcode : point de rupture */
	.rll-acc .ac-articles__grille {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--ac-v2);
	}

	.rll-acc .ac-article--une {
		grid-column: 1 / -1;
	}

	.rll-acc .ac-article--une .ac-article__lien {
		padding: var(--ac-v3);
	}
}

@media (min-width: 1000px) { /* ds-allow-hardcode : point de rupture */
	/* 6 / 3 / 3 : le plus recent prend la moitie. */
	.rll-acc .ac-articles__grille {
		grid-template-columns: minmax(0, 6fr) minmax(0, 3fr) minmax(0, 3fr);
		gap: var(--ac-v3);
	}

	.rll-acc .ac-article--une {
		grid-column: auto;
	}
}

/* ==================================================================== */
/* 6. Selon ce que vous cherchez                                         */
/* ==================================================================== */

.rll-acc .ac-orientation {
	background: var(--ac-surface);
}

.rll-acc .ac-orientation__grille {
	margin-top: var(--ac-v3);
	display: grid;
	border-top: var(--ac-trait) solid var(--ac-filet);
}

.rll-acc .ac-piste,
.rll-acc .ac-piste:visited {
	display: grid;
	grid-template-columns: var(--ac-ic-ligne) minmax(0, 1fr) var(--ac-v2);
	column-gap: var(--ac-v2);
	align-items: center;
	padding-block: var(--ac-v2);
	border-bottom: var(--ac-trait) solid var(--ac-filet);
	color: var(--ac-encre);
	text-decoration: none;
}

.rll-acc .ac-piste:hover {
	color: var(--ac-encre);
	text-decoration: none;
}

.rll-acc .ac-piste__icone {
	width: var(--ac-ic-ligne);
	height: var(--ac-ic-ligne);
}

.rll-acc .ac-piste__titre {
	display: block;
	font-family: var(--ac-voix);
	font-size: var(--ac-t-chapo);
	line-height: 1.3;
	color: var(--ac-encre);
}

.rll-acc .ac-piste:hover .ac-piste__titre {
	color: var(--ac-petrole);
}

.rll-acc .ac-piste__desc {
	display: block;
	margin-top: 0;
	font-size: var(--ac-t-petit);
	line-height: 1.45;
	color: var(--ac-doux);
}

.rll-acc .ac-piste .ac-fleche-lien {
	color: var(--ac-petrole);
}

@media (min-width: 760px) { /* ds-allow-hardcode : point de rupture */
	.rll-acc .ac-orientation__grille {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: var(--ac-v3);
	}

	.rll-acc .ac-piste {
		padding-block: var(--ac-v3);
	}
}

/* ==================================================================== */
/* 7. Ce que ca coute : chaque ligne reprend l'icone du savoir-faire chiffre */
/* ==================================================================== */

.rll-acc .ac-couts__grille {
	display: grid;
	gap: var(--ac-v3);
}

.rll-acc .ac-couts__intro {
	margin-top: var(--ac-v2);
	max-width: 40ch;
	color: var(--ac-doux);
}

.rll-acc .ac-couts__liste {
	border-top: var(--ac-trait) solid var(--ac-encre);
}

.rll-acc .ac-cout {
	display: grid;
	grid-template-columns: var(--ac-ic-ligne) minmax(0, 1fr);
	column-gap: var(--ac-v2);
	padding-block: var(--ac-v2);
	border-bottom: var(--ac-trait) solid var(--ac-filet);
}

.rll-acc .ac-cout__icone {
	grid-row: span 2;
	width: var(--ac-ic-ligne);
	height: var(--ac-ic-ligne);
}

.rll-acc .ac-cout__titre {
	font-family: var(--ac-voix);
	font-weight: 400;
	font-size: var(--ac-t-chapo);
	line-height: 1.3;
	color: var(--ac-encre);
}

.rll-acc .ac-cout__texte {
	font-size: var(--ac-t-petit);
	line-height: 1.45;
	color: var(--ac-doux);
}

.rll-acc .ac-cout__prix {
	grid-column: 2;
	margin-top: var(--ac-v1);
	font-family: var(--ac-voix);
	font-size: var(--ac-t-prix);
	line-height: 1.2;
	color: var(--ac-petrole);
	font-variant-numeric: tabular-nums lining-nums;
	white-space: nowrap;
}

@media (min-width: 760px) { /* ds-allow-hardcode : point de rupture */
	.rll-acc .ac-cout {
		grid-template-columns: var(--ac-ic-ligne) minmax(0, 1fr) auto;
		align-items: center;
		padding-block: var(--ac-v3);
	}

	.rll-acc .ac-cout__prix {
		grid-column: 3;
		grid-row: 1 / span 2;
		margin-top: 0;
		text-align: right;
	}
}

@media (min-width: 1000px) { /* ds-allow-hardcode : point de rupture */
	.rll-acc .ac-couts__grille {
		grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
		column-gap: var(--ac-v4);
		align-items: start;
	}

	.rll-acc .ac-couts__tete {
		position: sticky;
		top: calc(var(--ac-barre-h) + var(--ac-v3));
	}
}

/* ==================================================================== */
/* 8. Par ou commencer ?                                                 */
/* ==================================================================== */

.rll-acc .ac-fin {
	background: var(--ac-champ);
}

.rll-acc .ac-fin__grille {
	display: grid;
	gap: var(--ac-v3);
	align-items: center;
}

.rll-acc .ac-fin__portrait {
	width: var(--ac-portrait);
	height: var(--ac-portrait);
	object-fit: cover;
	object-position: 50% 20%;
}

.rll-acc .ac-fin__texte {
	margin-top: var(--ac-v2);
	max-width: 52ch;
	color: var(--ac-doux);
}

@media (min-width: 760px) { /* ds-allow-hardcode : point de rupture */
	.rll-acc .ac-fin__grille {
		grid-template-columns: var(--ac-portrait) minmax(0, 1fr) auto;
		column-gap: var(--ac-v3);
	}
}

/* ==================================================================== */
/* Le pied de page de l'accueil : le bouton devenu lien texte            */
/* ==================================================================== */

/* Ses deux conteneurs (haut et bas) sur la gouttiere commune : mesure au banc, le bas
   partait a 24 px et le haut a 24 px des 768 px, contre 20 pour le logo et la page.
   Les conteneurs Elementor lisent leur retrait dans --padding-left / --padding-right ;
   la regle du modele (.elementor-5042 .elementor-element.elementor-element-…) pese 0,3,0. */
body.rll-acc-actif .elementor-location-footer > .e-con {
	--padding-left: var(--ac-gouttiere);
	--padding-right: var(--ac-gouttiere);
}

/* Dedans, la rangee et ses colonnes portaient chacune 10 px de retrait : le texte du pied
   partait a 40 px sur telephone et a 128 px sur bureau. La rangee perd le sien, chaque
   colonne garde un ecart a droite seulement : le texte part sur la gouttiere. */
body.rll-acc-actif .elementor-location-footer > .e-con > .e-con-inner > .e-con {
	--padding-left: 0px;
	--padding-right: 0px;
}

body.rll-acc-actif .elementor-location-footer > .e-con > .e-con-inner > .e-con > .e-con {
	--padding-left: 0px;
	--padding-right: var(--ac-v3);
}


body.rll-acc-actif .rll-acc-pied-rdv {
	margin: 0;
}

body.rll-acc-actif .rll-acc-pied-rdv a.rll-acc-pied-rdv__lien,
body.rll-acc-actif .rll-acc-pied-rdv a.rll-acc-pied-rdv__lien:visited {
	display: inline-flex;
	align-items: center;
	gap: var(--ac-v1);
	min-height: var(--ac-bouton-h);
	color: var(--ac-or);
	font-family: var(--ac-sans);
	font-size: var(--ac-t-petit);
	font-weight: 600;
	text-decoration: underline;
	text-decoration-thickness: var(--ac-trait);
	text-underline-offset: .2em;
}

body.rll-acc-actif .rll-acc-pied-rdv a.rll-acc-pied-rdv__lien:hover {
	color: var(--ac-surface);
}

body.rll-acc-actif .rll-acc-pied-rdv a.rll-acc-pied-rdv__lien:focus-visible {
	outline: var(--ac-trait-fort) solid var(--ac-or);
	outline-offset: var(--ac-e1);
}

@media (prefers-reduced-motion: reduce) {
	.rll-acc *,
	.rll-acc *::before,
	.rll-acc *::after {
		transition: none !important;
	}
}
