/*
 * RLL - Navigation, la feuille (v1.0.0, octobre 2026).
 *
 * Toutes les regles visent `.rll-n` (la barre et le panneau) ou un conteneur d'en-tete
 * qui contient `.rll-n` : sans la nouvelle barre, cette feuille ne touche a rien.
 *
 * Les jetons sont declares sur `body`, et non sur `:root` : les couleurs du Kit Elementor
 * vivent sur `body.elementor-kit-7`. Declares sur `:root`, ils retomberaient toujours sur
 * leur valeur de repli. Chaque couleur pointe d'abord vers le jeton du Kit.
 *
 * Specificite : le Kit souligne `.elementor-kit-7 a` (0,1,1) et colore `a:hover` (0,2,1) ;
 * le theme Hello peint `button:hover` et `[type=button]:focus` (0,2,0). Les regles d'ici
 * commencent donc toutes par `.rll-n` suivi d'un element ou d'une classe, et redisent
 * fond, bordure, couleur et soulignement dans chaque etat.
 */

body {
	--rn-papier: var(--e-global-color-rllpapier, #FCFBF8);
	--rn-surface: var(--e-global-color-rllsurface, #FFFFFF);
	--rn-encre: var(--e-global-color-text, #16211F);
	--rn-doux: var(--e-global-color-rlldoux, #4B5A57);
	--rn-petrole: var(--e-global-color-primary, #0E4D5A);
	--rn-or: var(--e-global-color-accent, #F2C14E);
	--rn-or-encre: var(--e-global-color-rllortexte, #3A2C06);
	--rn-sauge: var(--e-global-color-secondary, #7AAE9B);
	--rn-filet: var(--e-global-color-rllfilet, #E4E6DF);
	--rn-champ: var(--e-global-color-rllchamp, #F3F5F1);
	--rn-surprofond: var(--e-global-color-rllsurprofond, #F1F7F6);
	--rn-voile: rgba(14, 33, 31, .5);

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

	--rn-t-xs: 13px;
	--rn-t-s: 14px;
	--rn-t-m: 15px;
	--rn-t-l: 17px;
	--rn-t-xl: 21px;

	--rn-e1: 4px;
	--rn-e2: 8px;
	--rn-e3: 12px;
	--rn-e4: 16px;
	--rn-e5: 20px;
	--rn-e6: 24px;
	--rn-e8: 32px;

	--rn-cible: 48px;
	--rn-cible-sm: 40px;
	--rn-barre-h: 76px;
	--rn-barre-h-mob: 72px;
	--rn-largeur: 1150px;
	--rn-retrait: 10px;
	--rn-colonne: 600px;
	--rn-gouttiere: clamp(16px, 4vw, 32px);
	--rn-logo-h: 52px;
	--rn-logo-l: 186px;
	--rn-logo-l-tab: 150px;
	--rn-logo-h-tab: 60px;
	--rn-sm-l: 340px;
	--rn-sm-l-large: 460px;
	--rn-pont: 14px;
	--rn-icone: 18px;
	--rn-chevron: 12px;
	--rn-tiret: 10px;
	--rn-chevron-l: 32px;

	--rn-trait: 1px;
	--rn-trait-fort: 2px;
	--rn-trait-or: 3px;
	--rn-decalage: 5px;

	--rn-duree: 260ms;
	--rn-duree-courte: 150ms;
	--rn-instant: 0s;
	--rn-courbe: cubic-bezier(.22, 1, .36, 1);
	--rn-glisse: 16px;
	--rn-plan: 1000;
}

/* La mise en page d'octobre 2026 (rll-mise-en-page.php) : une seule gouttiere, 20 px, et la
   colonne de 1 150 px sans retrait, comme les pages vitrine et /articles. */
body.rll-mep-actif {
	--rn-gouttiere: 20px;
	--rn-retrait: 0px;
}

/* ==================================================================== */
/* Les morceaux communs                                                  */
/* ==================================================================== */

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

.rll-n {
	font-family: var(--rn-sans);
	color: var(--rn-encre);
	-webkit-font-smoothing: antialiased;
}

.rll-n ::selection {
	background: var(--rn-or);
	color: var(--rn-or-encre);
}

.rll-n a,
.rll-n a:hover,
.rll-n a:focus,
.rll-n a:visited {
	text-decoration: none;
	box-shadow: none;
}

.rll-n a:focus-visible,
.rll-n button:focus-visible {
	outline: var(--rn-trait-fort) solid var(--rn-petrole);
	outline-offset: var(--rn-e1);
	box-shadow: none;
}

.rll-n button,
.rll-n button:hover,
.rll-n button:focus,
.rll-n button:active {
	margin: 0;
	border-radius: 0;
	box-shadow: none;
	text-transform: none;
	letter-spacing: normal;
	text-decoration: none;
	white-space: nowrap;
	-webkit-user-select: none;
	user-select: none;
	cursor: pointer;
}

.rll-n ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.rll-n .rn-sr {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.rll-n .rn-ico {
	width: var(--rn-icone);
	height: var(--rn-icone);
	flex: none;
}

.rll-n .rn-chev {
	width: var(--rn-chevron);
	height: var(--rn-chevron);
	flex: none;
	transition: transform var(--rn-duree) var(--rn-courbe);
}

/* L'action : la seule chose en or. */
.rll-n a.rn-action,
.rll-n a.rn-action:visited {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: var(--rn-cible);
	padding: 0 var(--rn-e5);
	background: var(--rn-or);
	color: var(--rn-or-encre);
	font-family: var(--rn-sans);
	font-size: var(--rn-t-m);
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
}

.rll-n a.rn-action:hover {
	background: var(--rn-or);
	color: var(--rn-or-encre);
	text-decoration: underline;
	text-underline-offset: var(--rn-decalage);
}

.rll-n a.rn-action:focus-visible {
	outline-color: var(--rn-encre);
}

/* ==================================================================== */
/* L'en-tete d'Elementor, reconnu a son contenu, jamais a un identifiant */
/* ==================================================================== */

/* Le conteneur de bureau s'aligne sur la colonne du site (1 150 px, retrait de 10). */
.elementor-location-header > .e-con:has(.rll-n) {
	padding-inline: max(var(--rn-gouttiere), calc((100% - var(--rn-largeur)) / 2 + var(--rn-retrait)));
	flex-wrap: nowrap;
	align-items: center;
	column-gap: var(--rn-e5);
}

.elementor-location-header > .e-con:has(.rll-n) > .elementor-widget-nav-menu {
	flex: 1 1 auto;
	width: auto;
	max-width: none;
	margin: 0;
}

.elementor-widget-nav-menu .elementor-widget-container:has(> .rll-n) {
	display: block;
}

/* Sur telephone : le conteneur de bureau s'affiche (logo et bouton « Menu »), celui qui ne
   portait que la pastille se retire. Elementor 4.3.3 masque par
   `.elementor .elementor-hidden-mobile{display:none}` (0,2,0), sans !important. La pastille
   ne se retire que si la nouvelle barre est bien la : sinon elle reste le seul moyen
   d'ouvrir un menu. */
@media (max-width: 767px) { /* ds-allow-hardcode : point de rupture d'Elementor */
	.elementor-location-header.elementor > .e-con.elementor-hidden-mobile:has(.rll-n) {
		display: var(--display, flex);
	}

	.elementor-location-header:has(.rll-n) > .e-con:has(.elementor-widget-icon a[href*="popup%3Aopen"]) {
		display: none;
	}
}

/* Sous 1 180 px, la barre ne tient plus cinq entrees lisibles : logo, action, bouton
   « Menu ». Mesure : les cinq entrees, le logo et l'action demandent environ 1 130 px. */
@media (max-width: 1179px) { /* ds-allow-hardcode : point de rupture mesure */
	.elementor-location-header > .e-con:has(.rll-n) {
		min-height: var(--rn-barre-h);
		padding-block: var(--rn-e2);
	}

	.elementor-location-header > .e-con:has(.rll-n) > .elementor-widget-nav-menu {
		flex: 0 0 auto;
		order: 3;
	}

	.elementor-location-header > .e-con:has(.rll-n) > .elementor-widget-button {
		margin-left: auto;
		order: 2;
	}

	.elementor-location-header > .e-con:has(.rll-n) > .elementor-widget-image {
		flex: 0 0 auto;
		width: auto;
		max-width: none;
		margin: 0;
		order: 1;
	}

	.elementor-location-header > .e-con:has(.rll-n) > .elementor-widget-image img {
		display: block;
		width: var(--rn-logo-l-tab);
		height: var(--rn-logo-h-tab);
		max-width: none;
		object-fit: contain;
		object-position: left center;
	}
}

/* Sur telephone, le logo perd sa devise (illisible a cette taille) et garde le nom :
   on montre les lignes 10 a 150 de l'image de 200, a 52 px de haut. Les capitales de
   « Repousse les Limites » y font 9 px. */
@media (max-width: 767px) { /* ds-allow-hardcode : point de rupture d'Elementor */
	.elementor-location-header > .e-con:has(.rll-n) {
		min-height: var(--rn-barre-h-mob);
	}

	.elementor-location-header > .e-con:has(.rll-n) > .elementor-widget-image img {
		width: var(--rn-logo-l);
		height: var(--rn-logo-h);
		object-fit: cover;
		object-position: left 17%;
	}

	.elementor-location-header > .e-con:has(.rll-n) > .elementor-widget-nav-menu {
		margin-left: auto;
	}
}

/* Tant que l'ancienne barre d'Elementor est servie (mode `apercu`, ou `?rll_nav=0`), elle
   ne montre pas les deux entrees ajoutees au menu 572 pour la nouvelle : cinq entrees en
   capitales la feraient deborder des 1 366 px. WordPress pose les classes du menu sur `li`. */
.elementor-nav-menu li.rll-nav-articles,
.elementor-nav-menu li.rll-nav-pied {
	display: none;
}

/* Le panneau ouvert : l'action de la barre ne double pas celle du panneau, et les bulles
   d'assistance se retirent (regle existante dans rll-correctifs, sur `rll-popup-ouvert`). */
html.rn-ouvert {
	overflow: hidden;
}

html.rn-ouvert .elementor-location-header .elementor-widget-button {
	visibility: hidden;
}

/* La page montre deja l'action (haut de l'accueil, pied de page) : celle de la barre
   s'efface sans rien deplacer, et revient quand l'autre sort de l'ecran (navigation.js). */
.elementor-location-header:has(.rll-n) .elementor-widget-button {
	transition: opacity var(--rn-duree) var(--rn-courbe), visibility var(--rn-instant) linear;
}

html.rn-action-ailleurs .elementor-location-header:has(.rll-n) .elementor-widget-button {
	visibility: hidden;
	opacity: 0;
	transition: opacity var(--rn-duree) var(--rn-courbe), visibility var(--rn-instant) linear var(--rn-duree);
}

/* ==================================================================== */
/* La barre de bureau                                                    */
/* ==================================================================== */

.rll-n.rn-barre-nav {
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

.rll-n .rn-nav__liste {
	display: flex;
	align-items: center;
}

.rll-n .rn-nav__item {
	position: relative;
	margin: 0;
	padding: 0;
}

.rll-n .rn-nav__ligne {
	display: flex;
	align-items: center;
}

.rll-n a.rn-nav__lien,
.rll-n a.rn-nav__lien:visited {
	position: relative;
	display: flex;
	align-items: center;
	min-height: var(--rn-cible);
	padding: 0 var(--rn-e3);
	font-family: var(--rn-sans);
	font-size: var(--rn-t-m);
	font-weight: 500;
	line-height: 1.2;
	color: var(--rn-encre);
	white-space: nowrap;
}

.rll-n a.rn-nav__lien::after {
	content: "";
	position: absolute;
	left: var(--rn-e3);
	right: var(--rn-e3);
	bottom: var(--rn-e3);
	height: var(--rn-trait);
	background: currentColor;
	transform: scaleX(0);
	transform-origin: left;
	transition: transform var(--rn-duree) var(--rn-courbe);
}

.rll-n a.rn-nav__lien:hover {
	color: var(--rn-petrole);
}

.rll-n a.rn-nav__lien:hover::after {
	transform: scaleX(1);
}

/* La page courante et son parent : couleur, graisse et filet d'or, jamais la seule couleur. */
.rll-n a.rn-nav__lien[aria-current="page"],
.rll-n .rn-nav__item.est-ancetre > .rn-nav__ligne > a.rn-nav__lien {
	color: var(--rn-petrole);
	font-weight: 600;
}

.rll-n a.rn-nav__lien[aria-current="page"]::after,
.rll-n .rn-nav__item.est-ancetre > .rn-nav__ligne > a.rn-nav__lien::after {
	transform: scaleX(1);
	height: var(--rn-trait-fort);
	background: var(--rn-or);
}

.rll-n .rn-a-enfants a.rn-nav__lien {
	padding-right: var(--rn-e1);
}

.rll-n .rn-a-enfants a.rn-nav__lien::after {
	right: var(--rn-e1);
}

.rll-n button.rn-nav__deplier,
.rll-n button.rn-nav__deplier:hover,
.rll-n button.rn-nav__deplier:focus {
	display: grid;
	place-items: center;
	width: var(--rn-chevron-l);
	height: var(--rn-cible);
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--rn-doux);
}

.rll-n button.rn-nav__deplier:hover {
	color: var(--rn-petrole);
}

.rll-n button.rn-nav__deplier[aria-expanded="true"] .rn-chev {
	transform: rotate(180deg);
}

/* Le deroulant : papier, filet fin, l'or seulement pour dire « ouvert ». Aucune ombre. */
.rll-n .rn-sm {
	position: absolute;
	top: calc(100% + (var(--rn-barre-h) - var(--rn-cible)) / 2);
	left: 0;
	z-index: var(--rn-plan);
	width: var(--rn-sm-l);
	background: var(--rn-papier);
	border: var(--rn-trait) solid var(--rn-filet);
	border-top: var(--rn-trait-or) solid var(--rn-or);
	visibility: hidden;
	opacity: 0;
	transform: translateY(calc(-1 * var(--rn-e1)));
	transition: opacity var(--rn-duree-courte) var(--rn-courbe), transform var(--rn-duree-courte) var(--rn-courbe), visibility var(--rn-instant) linear var(--rn-duree-courte);
}

.rll-n .rn-sm::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 100%;
	height: var(--rn-pont);
}

.rll-n .rn-a-enfants--droite > .rn-sm {
	left: auto;
	right: 0;
}

.rll-n .rn-sm--large {
	width: var(--rn-sm-l-large);
}

.rll-n .rn-a-enfants.est-ouvert > .rn-sm {
	visibility: visible;
	opacity: 1;
	transform: none;
	transition-delay: var(--rn-instant);
}

@media (hover: hover) and (pointer: fine) {
	.rll-n .rn-a-enfants:hover > .rn-sm {
		visibility: visible;
		opacity: 1;
		transform: none;
		transition-delay: var(--rn-instant);
	}
}

.rll-n .rn-sm__liste li {
	margin: 0;
}

.rll-n .rn-sm__liste li + li a.rn-sm__lien {
	border-top: var(--rn-trait) solid var(--rn-filet);
}

.rll-n a.rn-sm__lien,
.rll-n a.rn-sm__lien:visited {
	display: block;
	padding: var(--rn-e3) var(--rn-e5);
	color: var(--rn-encre);
	background: transparent;
}

.rll-n .rn-sm__titre {
	display: block;
	font-family: var(--rn-voix);
	font-size: var(--rn-t-l);
	font-weight: 400;
	line-height: 1.25;
}

.rll-n .rn-sm__ligne {
	display: block;
	margin-top: var(--rn-e1);
	font-family: var(--rn-sans);
	font-size: var(--rn-t-xs);
	line-height: 1.4;
	color: var(--rn-doux);
}

.rll-n a.rn-sm__lien:hover,
.rll-n a.rn-sm__lien:focus-visible,
.rll-n a.rn-sm__lien[aria-current="page"] {
	background: var(--rn-surprofond);
	color: var(--rn-encre);
}

.rll-n a.rn-sm__lien:hover .rn-sm__titre,
.rll-n a.rn-sm__lien[aria-current="page"] .rn-sm__titre {
	color: var(--rn-petrole);
}

.rll-n a.rn-sm__lien[aria-current="page"] .rn-sm__titre {
	font-weight: 600;
}

.rll-n a.rn-sm__pied,
.rll-n a.rn-sm__pied:visited {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--rn-e3);
	min-height: var(--rn-cible);
	padding: 0 var(--rn-e5);
	border-top: var(--rn-trait) solid var(--rn-filet);
	background: var(--rn-champ);
	font-family: var(--rn-sans);
	font-size: var(--rn-t-s);
	font-weight: 600;
	line-height: 1.3;
	color: var(--rn-petrole);
}

.rll-n a.rn-sm__pied:hover {
	color: var(--rn-petrole);
	text-decoration: underline;
	text-underline-offset: var(--rn-decalage);
}

.rll-n .rn-meta {
	display: block;
	font-family: var(--rn-sans);
	font-size: var(--rn-t-xs);
	line-height: 1.4;
	color: var(--rn-doux);
}

.rll-n .rn-meta b {
	font-weight: 600;
	color: var(--rn-petrole);
}

.rll-n a.rn-sm__vedette,
.rll-n a.rn-sm__vedette:visited {
	display: block;
	padding: var(--rn-e4) var(--rn-e5);
	background: var(--rn-surface);
	border-bottom: var(--rn-trait) solid var(--rn-filet);
	color: var(--rn-encre);
}

.rll-n .rn-sm__vedette-titre {
	display: block;
	margin-top: var(--rn-e1);
	font-family: var(--rn-voix);
	font-size: var(--rn-t-xl);
	font-weight: 400;
	line-height: 1.2;
	text-wrap: balance;
}

.rll-n a.rn-sm__vedette:hover .rn-sm__vedette-titre,
.rll-n a.rn-sm__vedette[aria-current="page"] .rn-sm__vedette-titre {
	color: var(--rn-petrole);
}

/* Le bouton « Menu » : cache au bureau, seul declencheur sous 1 180 px. */
.rll-n a.rn-ouvrir,
.rll-n a.rn-ouvrir:visited {
	display: none;
	align-items: center;
	justify-content: center;
	gap: var(--rn-e2);
	min-width: var(--rn-cible);
	min-height: var(--rn-cible);
	padding: 0 var(--rn-e4);
	border: var(--rn-trait) solid var(--rn-filet);
	background: var(--rn-surface);
	color: var(--rn-encre);
	font-family: var(--rn-sans);
	font-size: var(--rn-t-m);
	font-weight: 600;
	line-height: 1;
}

.rll-n a.rn-ouvrir:hover {
	border-color: var(--rn-petrole);
	color: var(--rn-petrole);
}

@media (max-width: 1179px) { /* ds-allow-hardcode : point de rupture mesure */
	.rll-n .rn-nav {
		display: none;
	}

	.rll-n a.rn-ouvrir {
		display: inline-flex;
	}
}

/* Sous 360 px, le mot « Menu » cede la place : il reste l'icone, dans une cible de 48. */
@media (max-width: 359px) { /* ds-allow-hardcode : point de rupture mesure */
	.rll-n a.rn-ouvrir {
		padding: 0;
	}

	.rll-n a.rn-ouvrir span {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
	}
}

/* ==================================================================== */
/* Le panneau                                                            */
/* ==================================================================== */

/* Plein ecran a toutes les largeurs ou il sert : rien de la page ne reste visible
   derriere, donc aucune action en double. La tete reprend la place exacte de la barre :
   le logo ou etait le logo, « Fermer » ou etait « Menu ». */
dialog.rll-n.rn-panneau {
	position: fixed;
	inset: 0;
	width: 100%;
	max-width: 100%;
	height: 100%;
	height: 100dvh;
	max-height: 100dvh;
	margin: 0;
	padding: 0;
	border: 0;
	background: var(--rn-papier);
	color: var(--rn-encre);
	overflow: hidden;
}

dialog.rll-n.rn-panneau::backdrop {
	background: var(--rn-voile);
}

dialog.rll-n.rn-panneau[open] {
	animation: rn-entree var(--rn-duree) var(--rn-courbe);
}

@keyframes rn-entree {
	from {
		opacity: 0;
		transform: translateY(calc(-1 * var(--rn-glisse)));
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	dialog.rll-n.rn-panneau[open] {
		animation: none;
	}

	.rll-n .rn-chev,
	.rll-n a.rn-nav__lien::after,
	.rll-n .rn-sm {
		transition: none;
	}
}

.rll-n .rn-feuille {
	display: flex;
	flex-direction: column;
	height: 100%;
	container-type: inline-size;
}

.rll-n .rn-feuille__haut {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--rn-e4);
	min-height: var(--rn-barre-h);
	padding: var(--rn-e2) var(--rn-gouttiere);
	background: var(--rn-surface);
	border-bottom: var(--rn-trait) solid var(--rn-filet);
}

.rll-n a.rn-logo-lien {
	display: flex;
	align-items: center;
	min-height: var(--rn-cible);
}

.rll-n img.rn-logo-img {
	display: block;
	width: var(--rn-logo-l-tab);
	height: var(--rn-logo-h-tab);
	max-width: none;
	object-fit: contain;
	object-position: left center;
}

.rll-n .rn-logo-texte {
	font-family: var(--rn-voix);
	font-size: var(--rn-t-xl);
	color: var(--rn-petrole);
}

.rll-n button.rn-fermer,
.rll-n button.rn-fermer:hover,
.rll-n button.rn-fermer:focus {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--rn-e2);
	min-width: var(--rn-cible);
	min-height: var(--rn-cible);
	padding: 0 var(--rn-e4);
	border: var(--rn-trait) solid var(--rn-filet);
	background: var(--rn-surface);
	color: var(--rn-encre);
	font-family: var(--rn-sans);
	font-size: var(--rn-t-m);
	font-weight: 600;
	line-height: 1;
}

.rll-n button.rn-fermer:hover {
	border-color: var(--rn-petrole);
	color: var(--rn-petrole);
}

.rll-n .rn-feuille__liste {
	flex: 1;
	min-height: 0;
	overflow-x: hidden;
	overflow-y: auto;
	overscroll-behavior: contain;
	padding: var(--rn-e1) max(var(--rn-gouttiere), calc((100% - var(--rn-colonne)) / 2)) var(--rn-e5);
}

.rll-n .rn-entree {
	margin: 0;
	border-bottom: var(--rn-trait) solid var(--rn-filet);
}

.rll-n a.rn-entree__lien,
.rll-n a.rn-entree__lien:visited {
	display: block;
	min-width: 0;
	padding: var(--rn-e3) 0;
	color: var(--rn-encre);
}

.rll-n .rn-entree__titre {
	display: block;
	font-family: var(--rn-voix);
	font-size: var(--rn-t-xl);
	font-weight: 400;
	line-height: 1.15;
	overflow-wrap: anywhere;
}

.rll-n .rn-entree__ligne {
	display: block;
	margin-top: var(--rn-e1);
	font-family: var(--rn-sans);
	font-size: var(--rn-t-s);
	line-height: 1.4;
	color: var(--rn-doux);
}

.rll-n a.rn-entree__lien:hover .rn-entree__titre {
	color: var(--rn-petrole);
}

.rll-n a.rn-entree__lien[aria-current="page"] .rn-entree__titre,
.rll-n .rn-entree.est-ancetre > a.rn-entree__lien .rn-entree__titre {
	color: var(--rn-petrole);
	text-decoration: underline;
	text-decoration-color: var(--rn-or);
	text-decoration-thickness: var(--rn-trait-fort);
	text-underline-offset: var(--rn-decalage);
}

.rll-n .rn-entree__rang {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: start;
	column-gap: var(--rn-e3);
}

.rll-n button.rn-entree__deplier,
.rll-n button.rn-entree__deplier:hover,
.rll-n button.rn-entree__deplier:focus {
	display: inline-flex;
	align-items: center;
	gap: var(--rn-e2);
	min-height: var(--rn-cible);
	margin-top: var(--rn-e1);
	padding: 0 var(--rn-e3);
	border: var(--rn-trait) solid var(--rn-filet);
	background: var(--rn-surface);
	color: var(--rn-doux);
	font-family: var(--rn-sans);
	font-size: var(--rn-t-xs);
	font-weight: 500;
	line-height: 1;
}

.rll-n button.rn-entree__deplier:hover {
	border-color: var(--rn-petrole);
	color: var(--rn-petrole);
}

.rll-n button.rn-entree__deplier[aria-expanded="true"] .rn-chev {
	transform: rotate(180deg);
}

.rll-n .rn-enfants {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	margin: calc(-1 * var(--rn-e1)) 0 var(--rn-e3);
}

.rll-n .rn-enfants[hidden] {
	display: none;
}

.rll-n .rn-enfants li {
	margin: 0;
	min-width: 0;
}

.rll-n .rn-enfants a,
.rll-n .rn-enfants a:visited {
	display: flex;
	align-items: center;
	gap: var(--rn-e3);
	min-height: var(--rn-cible-sm);
	font-family: var(--rn-sans);
	font-size: var(--rn-t-m);
	line-height: 1.25;
	color: var(--rn-doux);
}

.rll-n .rn-enfants a::before {
	content: "";
	flex: none;
	width: var(--rn-tiret);
	height: var(--rn-trait);
	background: var(--rn-sauge);
}

.rll-n .rn-enfants a:hover,
.rll-n .rn-enfants a[aria-current="page"] {
	color: var(--rn-petrole);
}

.rll-n .rn-enfants a[aria-current="page"] {
	font-weight: 600;
}

@container (min-width: 440px) { /* ds-allow-hardcode : seuil du panneau */
	.rll-n .rn-enfants {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		column-gap: var(--rn-e4);
	}
}

/* La seconde porte : « Articles » sur une bande a part, avec le dernier paru. */
.rll-n .rn-lire {
	margin: var(--rn-e4) 0 0;
	padding: var(--rn-e1) var(--rn-e4) var(--rn-e4);
	background: var(--rn-surprofond);
	border-bottom: 0;
}

.rll-n a.rn-dernier,
.rll-n a.rn-dernier:visited {
	display: block;
	padding: var(--rn-e3) var(--rn-e4);
	background: var(--rn-surface);
	border: var(--rn-trait) solid var(--rn-filet);
	color: var(--rn-encre);
}

.rll-n .rn-dernier__titre {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
	margin-top: var(--rn-e1);
	font-family: var(--rn-voix);
	font-size: var(--rn-t-l);
	font-weight: 400;
	line-height: 1.3;
}

.rll-n a.rn-dernier:hover .rn-dernier__titre {
	color: var(--rn-petrole);
}

.rll-n a.rn-dernier[aria-current="page"] {
	border-color: var(--rn-petrole);
}

.rll-n .rn-zone {
	margin: var(--rn-e4) 0 0;
	font-family: var(--rn-sans);
	font-size: var(--rn-t-xs);
	line-height: 1.4;
	color: var(--rn-doux);
	letter-spacing: .02em;
}

/* Le pied : l'action et les coordonnees, toujours a l'ecran. */
.rll-n .rn-feuille__bas {
	flex: none;
	display: grid;
	gap: var(--rn-e2);
	padding: var(--rn-e4) max(var(--rn-gouttiere), calc((100% - var(--rn-colonne)) / 2)) calc(var(--rn-e3) + env(safe-area-inset-bottom, 0px));
	background: var(--rn-surface);
	border-top: var(--rn-trait) solid var(--rn-filet);
}

.rll-n .rn-coord {
	display: flex;
	flex-wrap: wrap;
	column-gap: var(--rn-e6);
	min-width: 0;
}

.rll-n .rn-coord a,
.rll-n .rn-coord a:visited {
	display: inline-flex;
	align-items: center;
	gap: var(--rn-e2);
	min-height: var(--rn-cible-sm);
	min-width: 0;
	font-family: var(--rn-sans);
	font-size: var(--rn-t-s);
	line-height: 1.3;
	color: var(--rn-encre);
}

.rll-n .rn-coord a:hover {
	color: var(--rn-petrole);
	text-decoration: underline;
	text-underline-offset: var(--rn-decalage);
}

.rll-n .rn-coord .rn-ico {
	color: var(--rn-petrole);
}

.rll-n .rn-mail-long {
	display: none;
}

@container (min-width: 370px) { /* ds-allow-hardcode : l'adresse entiere tient */
	.rll-n .rn-mail-long {
		display: inline;
	}

	.rll-n .rn-mail-court {
		display: none;
	}
}

/* Sur telephone : barre de 72, logo recadre, comme dans l'en-tete. */
@media (max-width: 767px) { /* ds-allow-hardcode : point de rupture d'Elementor */
	.rll-n .rn-feuille__haut {
		min-height: var(--rn-barre-h-mob);
	}

	.rll-n img.rn-logo-img {
		width: var(--rn-logo-l);
		height: var(--rn-logo-h);
		object-fit: cover;
		object-position: left 17%;
	}
}

@media (max-width: 359px) { /* ds-allow-hardcode : point de rupture mesure */
	.rll-n button.rn-fermer {
		padding: 0;
	}

	.rll-n button.rn-fermer span {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
	}
}

/* Ecran court (iPhone SE, telephone a l'horizontale) : la liste se resserre en titres,
   pour que la seconde porte reste a l'ecran sans defiler. Les villes restent, en fin de
   liste : aucune information ne disparait, elle demande au plus un geste. */
@media (max-height: 700px) { /* ds-allow-hardcode : hauteur mesuree */
	.rll-n .rn-feuille__liste .rn-entree__ligne {
		display: none;
	}

	.rll-n .rn-feuille__liste a.rn-entree__lien {
		padding: var(--rn-e2) 0;
	}

	.rll-n button.rn-entree__deplier {
		margin-top: 0;
	}

	.rll-n .rn-dernier__titre {
		-webkit-line-clamp: 2;
	}
}