/*
Theme Name: ATERNO 2025
Author: Aterno
*/
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,
i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
	font-size: 100%
}

@font-face {
	font-family: 'Poppins';
	src: url('fonts/Poppins-Regular.woff2') format('woff2');
	font-style: normal;
	font-weight: 400;
	font-display: swap;
}
@font-face {
	font-family: 'Poppins';
	src: url('fonts/Poppins-Light.woff2') format('woff2');
	font-style: normal;
	font-weight: 300;
	font-display: swap;
}
@font-face {
	font-family: 'Poppins';
	src: url('fonts/Poppins-Medium.woff2') format('woff2');
	font-style: normal;
	font-weight: 500;
	font-display: swap;
}
@font-face {
	font-family: 'Poppins';
	src: url('fonts/Poppins-SemiBold.woff2') format('woff2');
	font-style: normal;
	font-weight: 600;
	font-display: swap;
}
@font-face {
	font-family: 'Poppins';
	src: url('fonts/Poppins-Bold.woff2') format('woff2');
	font-style: normal;
	font-weight: 700;
	font-display: swap;
}

:root {
	--bleuAterno: #030039;
	--media-text-gap: 24px; /* ecart block media-text */
	--fm-gap: 24px;
	--bullet-size: 8px;
	--bullet-gap: 6px;
	--inactive-opacity: 0.2;
	--transition-fast: 220ms;
}

html {
	font-size: 93.75%; /* 15px*/
}
body {
	position: relative;
	font-family: 'Poppins', sans-serif;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.6;
	color: var(--bleuAterno);
}

.notif {
    position: fixed;
    top: 30%;
    right: 0;
    width: min(500px, 90vw);
    min-width: 320px;
    z-index: 99999;
    transition: transform 0.4s ease;
    transform: translateX(100%); /* état initial hors écran */
}

.notif img {
    width: 100%;
    display: block;
    cursor: pointer;
}

.uecd {
	cursor: pointer;
}

.bleu {
	color: var(--bleuAterno);
}
.bgbleu {
	background-color: var(--bleuAterno);
}
.bggris {
	background-color: #fbfbfb;
	border-radius: 20px;
}
.btbleu {
	border: 1px solid var(--bleuAterno);
	color: var(--bleuAterno) !important;
}

span.gotoguide {
	color: var(--bleuAterno);
	text-decoration: underline;
	cursor: pointer;
}

ol, ul {
	margin: 1.6rem 0;
}

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

.alignright {
	float: right;
	margin: 0 0 20px 20px;
}

.alignleft {
	float: left;
	margin: 0 20px 20px 0;
}

.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 15px;
}

caption, td, th {
	font-weight: 400;
	text-align: left;
}


/* 1. Masquer les liens visuellement, mais accessibles aux lecteurs d’écran */
.skip-link {
	position: absolute;
	left: -9999px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* 2. Lorsqu'un lien reçoit le focus (via TAB), on l'affiche clairement */
.skip-link:focus {
	position: absolute;
	top: 10px;
	left: 10px;
	width: fit-content;
	height: auto;
	margin: 0; /* Remplacé par le positionnement top/left */
	padding: 0.5rem 1rem;
	background-color: #000;
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	z-index: 2001; /* La correction clé */
}

/* 3. Optionnel : aligner verticalement les liens s’ils sont plusieurs à être focusés */
.skip-links {
	position: absolute; /* Retiré du flux */
	top: 0;
	left: -9999px;
	margin: 0;
	padding: 0;
	list-style: none;
	z-index: 2001; /* Pour passer au-dessus du reste */
	background-color: var(--bleuAterno);
}
/* 3. Optionnel : aligner verticalement les liens s’ils sont plusieurs à être focusés */
.skip-links:focus-within {
	left: 0;
}
.skip-link-item {
	display: inline;
}

section {
	position: relative;
}

h1 {
	font-family: 'Poppins', sans-serif;
	font-size: 4rem; /* 60px */
	font-size: clamp(1.8rem, 1.4rem + 3vw, 4rem) !important; /* 27px 60px */
	font-style: normal;
	font-weight: 700;
	line-height: 100%;
	text-transform: uppercase;
	color: #ffffff;
	text-align: center;
	word-break: break-word;
}
@media (max-width: 768px) {
	h1 {
		text-align: left;
	}
}

h2 {
	text-decoration: none;
	color: var(--bleuAterno);
	font-family: 'Poppins', sans-serif;
	font-size: 2.13rem; /* 32px */
	font-size: clamp(1.6rem, 1.5rem + 1.5vw, 2.14rem);
	font-style: normal;
	font-weight: 700;
	line-height: 120%;
	text-transform: uppercase;
}
h3 {
	font-family: 'Poppins', sans-serif;
	font-size: 1.2rem; /* 18px */
	font-style: normal;
	font-weight: 700;
	line-height: 140%;
	color: var(--bleuAterno);
	text-transform: uppercase;
}
h4 {
	font-size: 1.2rem; /* 18px */
	font-style: normal;
	font-weight: 400;
	line-height: 140%;
	color: var(--bleuAterno);
}
h5 {
	font-size: 1.2rem; /* 18px */
	font-style: normal;
	font-weight: 400;
	line-height: 140%;
	color: var(--bleuAterno);
}
h6 {
	font-size: 1.2rem; /* 18px */
	font-style: normal;
	font-weight: 400;
	line-height: 140%;
	color: var(--bleuAterno);
}

p {
	color: var(--bleuAterno);
	font-size: 1rem; /* 15px */
	font-style: normal;
	font-weight: 400;
	line-height: 140%; /* 21px */
	margin: 1.6rem 0;
}

h2, h3, h4, h5, h6 p {
	margin-bottom: 1.733rem; /* 26px */
}

h1 + h2 {
	margin-top: 32px;
}

li {
	margin-left: 2rem;
	margin-bottom: 1.67rem;
}

p + ul {
	margin-top: 0.67rem;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
    /*width: 100%;*/
}
table, table td, table th {
	border: 1px solid var(--bleuAterno);
}
table td, table th {
	padding: 0.4rem;
}
table th {
    font-weight: 600;
}

.titre_long {
	max-width: 45%;
}
@media (max-width: 768px) {
	.titre_long {
		max-width: 100%;
	}
}

.left {
    float: left;
}
.right {
    float: right;
}

.yarpph {
	font-weight: 700;
}
.titre_home {
    width: 39%;
	margin: 32px 3% 0 0;
}
.img_produit {
	width: 53%;
}

table#tabproduit {
	/*width: 100%;*/
	border-collapse: collapse;
	border: none;
}

table#tabproduit th, table#tabproduit td {
	border: none;
	border-bottom: 1px solid #ddd;
	padding: 8px;
	text-align: left;
}

table#tabproduit th:first-child, table#tabproduit td:first-child {
	white-space: nowrap;
	width: 1px;
	max-width: none;
}
@media (max-width: 768px) {
	.left, .right {
		float: none;
		display: block;
	}
	.img_produit {
		width: 100%;
		max-width: 100%;
	}
	.titre_home {
		padding: 0 1.71rem;
	}
	table#tabproduit th:first-child, table#tabproduit td:first-child {
		width: auto;
	}
}

table + span {
	margin-top: 2.14rem; /* 32px; */
}
table + h2 {
	margin-top: 2.14rem; /* 32px; */
}

.uppercase {
	text-transform: uppercase;
}

.clear {
	clear: both;
	display: block;
	font-size: 0;
	height: 0;
	margin: 0;
	padding: 0;
	overflow: hidden;
}

.small, small {
	font-size: 0.875rem;
}

sub, sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -.3em;
}

sub {
	bottom: -.20em;
}

strong {
	font-weight: 700;
}

img {
	max-width: 100%;
	height: auto;
}
.wp-caption {
	width: auto !important;
}
address {
	font-style: normal;
}

.grecaptcha-badge { visibility: hidden !important; }

/*.size-auto, 
.size-full,
.size-large,
.size-medium,
.size-thumbnail */
/*.size-full {
	max-width: 100%;
	height: auto;
}*/

.center {
	margin-left: auto !important;
	margin-right: auto !important;
}
.centrer {
    text-align: center;
}
.centre-cta {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
}

a, a:visited, a:focus, a:active, a:hover {
	color: var(--bleuAterno);
	overflow-wrap: break-word;
}
a:focus-visible {
  outline: var(--bleuAterno) solid 2px !important;
}

/*FONT-WEIGHT
Value 	Common weight name
100 	Thin (Hairline)
200 	Extra Light (Ultra Light)
300 	Light
400 	Normal (Regular)
500 	Medium
600 	Semi Bold (Demi Bold)
700 	Bold
800 	Extra Bold (Ultra Bold)
900 	Black (Heavy)
950 	Extra Black (Ultra Black)
*/

#wrapper {
	position: relative;
	display: flex;
	justify-content: flex-start;
	flex-direction: row;
	flex-wrap: wrap;
	width: 100%;
	margin: 0 auto;
	padding: 0;
}

header#hfix {
	order: 1;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background-color: var(--bleuAterno);
    z-index: 2000;
    height: 88px;
	width: 100%;
	margin: 0;
	padding: 0;
}
header#form {
	order: 1;
	position: fixed;
	display: flex;
	width: 100%;
	height: 88px;
	padding: 1.34rem 1.6rem;
	justify-content: space-between;
	align-items: center;
	z-index: 2000;
	margin: 0;
	padding: 0;
	background-color: var(--bleuAterno);
    top: 0;
    left: 0;
    right: 0;
}
.navbarform {
	display: flex;
	justify-content: center;
	align-items: center;
	flex: 1 0 0;
}
.navbarform img {
	width: 257px;
	height: 80px;
}

main {
	order: 2;
	position: relative;
	background-color: #ffffff;
	margin: 0 auto;
	width: 100%;
	padding: 0;
}
footer {
	position: relative;
	order: 3;
	background-color: var(--bleuAterno);
	color: #ffffff;
	width: 100%;
	padding: 1.6rem;
	/*margin-top: 4.8rem;*/
}
@media (max-width: 768px) {
	footer {
		margin-top: 0;
	}
}

footer.footer__form {
	position: relative;
	order: 3;
	background-color: var(--bleuAterno);
	color: #ffffff;
	width: 100%;
	padding: 1.6rem;
	margin-top: 0;
}

.container {
	position: relative;
	width: 100%;
	margin: 0 auto;
}

.content {
	padding: 0 1.6rem; /* 24px */
}
@media (max-width: 768px) {
	.content {
		padding: 0 1.34rem; /* 20px */
	}
}
/*----------------------- PAGE SEO -------------------- */
.containerContent {
	position: relative;
	width: 100%;
}
.containerContent header {
	background-color: var(--bleuAterno);
	padding-bottom: 7.53rem; /* 113px */
}
.containerContent header p {
	color: #ffffff;
	margin: 2.13rem 0; /* 32px */
	text-align: center;
}
.containerContent .contenu {
	 max-width: 750px;
	 margin: 0 auto;
}
.container1col {
    max-width: 750px;
	margin: 0 auto;
	padding-top: 32px;
}

.img_home {
    display: block;
    margin: 0 auto;
}


/* --------------  Style de base pour le menu --------------- */
.navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
	height: 88px;
	z-index: 1000;
}
.navbar-header {
    display: flex;
    justify-content: start;
    align-items: center;
	padding: 0 0 0 1.6rem;
}
.navbar-header img {
  width: 257px;
  max-width: 100%;
  height: auto;
  object-fit: cover;
}

.navbar-toggle {
    display: none;
    flex-direction: column;
	justify-content: center;
	align-items: center;
    cursor: pointer;
    border: none;
    position: relative;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	background: #ffffff;
	box-shadow: 0 6px 25px 0 rgba(0, 0, 0, 0.10);
	margin-right: 1.6rem;
}

.navbar-toggle.active {
	background: linear-gradient(180deg, #FFF600 0%, #FFD000 100%);
}

.navbar-toggle .icon-bar {
	display: block;
	width: 18px;
	height: 2px;
	background-color: var(--bleuAterno);
	margin: 3px 0;
	border-radius: 1px;
	transition: transform 0.3s ease, opacity 0.3s ease;
}

/* État actif — transformation en croix */
.navbar-toggle.active .icon-bar:nth-child(1) {
	transform: rotate(45deg) translate(5px, 5px);
}

.navbar-toggle.active .icon-bar:nth-child(2) {
	opacity: 0;
}

.navbar-toggle.active .icon-bar:nth-child(3) {
	transform: rotate(-45deg) translate(6px, -6px);
}

.navbar-collapse {
    display: flex;
    flex-direction: row;
    flex: 1;
    justify-content: space-between;
    align-items: center;
	padding: 0 0 0 0.57rem;
}
.navbar-cta {
    display: flex;
    align-items: center;
    gap: 10px;
	padding: 0 1.6rem;
}

.navbar-nav {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: row;
	align-items: center;
}

.navbar-nav li {
    margin: 0 1.42rem;
}
.navbar-nav a {
    color: #ffffff;
    text-decoration: none;
	font-weight: 600;
}
.navbar-nav a:hover {
	text-decoration: underline;
}

.sub-menu {
	display: none;
}

.current-menu-item a {
	font-weight: bold;
}

/* --- CUSTOM TABBAR + SEARCH STYLES --- */
.navbar-tabbar {
	position: fixed;
    top: 88px;
	background-color: var(--bleuAterno);
	height: 50px;
	width: 100%;
	transition: transform 0.3s ease;
	z-index: 900;	
}
.tabbar-nav { /* UL */
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0 1.6rem 0 1.6rem;
	margin: 0;
	height: 50px;
	border-top: 1px solid rgba(255, 255, 255, 0.15);
	border-bottom: 1px solid rgba(255, 255, 255, 0.15);
	gap: 20px;
}

.tabbar-nav .first-item {
	flex: 1;
	border-right: 1px solid rgba(255, 255, 255, 0.15);
}

.tabbar-nav .menu-item {
	margin-left: 0;
	margin-bottom: 0;
	height: 100%;
	display: flex;
	align-items: center;
	gap: 20px;
}

/*.tabbar-nav .menu-item:not(.first-item) {
	margin-left: 1rem;
}*/

.tabbar-nav .menu-item a {
	color: #ffffff;
	/*padding: 0 1.34rem;*/
	text-decoration: none;
	font-weight: 600;
	font-size: 0.94rem; /* 14px */
	height: 100%;
	display: flex;         /* Ajout de cette ligne */
	align-items: center;   /* Ajout de cette ligne */
}
.tabbar-nav .menu-item a:hover {
	text-decoration: underline;
}

/* Conteneur de recherche avec icône intégrée */
.search-wrapper {
	height: 100%;
	width: 100%;
	display: flex;
	align-items: center;
	position: relative;
}
.tabbar-nav .menu-item form {
	height: 100%;
	display: flex;
	align-items: center;
	width: 100%;
}
.search-wrapper button {
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	background: transparent;
	opacity: 0.7;
	border: none;
	cursor: pointer;
	padding: 0;
	z-index: 2;
}
.search-wrapper input[type="search"] {
	width: 100%;
	padding: 0.5rem 1.6rem;
	border: 0;
	font-family: 'Poppins', sans-serif;
	font-size: 14px;
	color: #b3b2c3;
	background: none;
}

.search-wrapper button.search-faq-button {
	opacity: 1;
	width: 24px;
	height: 24px;
	padding-left: 20px;
}
.search-wrapper input.search-faq-input {
	border-radius: 10px;
	border: 1.2px solid var(--bleuAterno);
	padding: 16px 20px 16px 45px;
	font-size: 14px;
	color: var(--bleuAterno);
}


/* ----------------------------------------------------------------------------- */
/* ----------------- MODULE GARANTIES SOLUTINS SOLAIRES  ----------------------- */
/* ----------------------------------------------------------------------------- */
.colonne__garanties_solaires {
	padding: 0 9.86%;
}
.colonne__garanties_solaires .wp-block-column {
	width: 33.33%;
}
.colonne__garanties_solaires .wp-block-column:first-child {
	width: 66.66%;
	margin-right: 9.86%;
}
@media (max-width: 1401px) {
	.colonne__garanties_solaires .wp-block-column {
		width: 40%;
	}
	.colonne__garanties_solaires .wp-block-column:first-child {
		width: 60%;
	}
}
@media (max-width: 989px) {
	.colonne__garanties_solaires {
		padding: 0;
	}
	.colonne__garanties_solaires .wp-block-column:first-child {
		margin-right: 0;
	}
}

.tabs-container {
	width: 100%;
}

.tabs-nav {
	display: flex;
	background: rgba(3, 0, 57, 0.10);
	border-radius: 10000px;
	margin-bottom: 24px;
}

.tab-button {
	flex: 1;
	padding: 10px;
	border: none;
	background: transparent;
	color: #000;
	font-size: 1rem;
	font-weight: 400;
	cursor: pointer;
	border-radius: 48px;
	transition: background-color 0.3s, color 0.3s;
	outline: none;
}

.tab-button.active {
	background-color: var(--bleuAterno);
	color: #fff;
}

.tab-content {
	display: none;
}

.tab-content.active {
	display: block;
}

.guarantee-card {
	padding: 24px;
	border-radius: 20px;
	margin-bottom: 24px;
	min-height: 218px;
	display: flex;
	flex-direction: column;
}

.guarantee-aterno {
	background: linear-gradient(254deg, #FFD000 12.05%, #FFF600 78.87%);
	color: var(--bleuAterno);
}

.guarantee-standard {
	background: #F2F2F2;
	color: var(--bleuAterno);
}

.guarantee-card h3 {
	color: var(--bleuAterno);
	font-size: 1.6rem; /* 24px; */
	font-style: normal;
	font-weight: 700;
	line-height: 110%; /* 26.4px */
	text-transform: uppercase;
	margin: 0 0 4px 0;
}

.guarantee-card .subtitle {
	color: var(--bleuAterno);
	font-size: 1.07rem; /* 16px; */
	font-style: normal;
	font-weight: 400;
	line-height: 100%; /* 16px */
	text-transform: uppercase;
	margin: 0;
	padding: 0;
}

.guarantee-card ul {
	list-style: none;
	padding: 0;
	margin: auto 0 0 0;
}

.guarantee-card li {
	display: flex;
	align-items: center;
	color: var(--bleuAterno);
	font-size: 1.07rem; /* 16px; */
	font-style: normal;
	font-weight: 600;
	line-height: 100%; /* 16px */
	margin: 0 0 8px 0;
	padding: 0;
}

.guarantee-card li::before {
	content: '';
	display: inline-block;
	width: 24px;
	height: 24px;
	margin-right: 8px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

/* Utilisation du SVG "check-icon" original */
.guarantee-aterno li::before {
	background-image: url("data:image/svg+xml,%3csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z' stroke='%2315803D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3e%3cpath d='M9 12L11 14L15 10' stroke='%2315803D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3e%3c/svg%3e");
}

/* Utilisation du SVG "cross-icon" original */
.guarantee-standard li::before {
	background-image: url("data:image/svg+xml,%3csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z' stroke='%23FF0000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3e%3cpath d='M15 9L9 15' stroke='%23FF0000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3e%3cpath d='M9 9L15 15' stroke='%23FF0000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3e%3c/svg%3e");
}

.guarantee-card li:last-child {
	margin-bottom: 0;
}


/* ----------------------------------------------------------------------------------- */
/* ----------------- MODULE ONDULEUR CENTRAL VS MICRO-ONDULEUR ----------------------- */
/* ----------------------------------------------------------------------------------- */
.aterno-comparison-module {
	gap: 10px;
	display: grid !important;
	grid-template-columns: repeat(4, 1fr); /* 4 colonnes de largeur égale */
	/*
	 * ÉTAPE 1 : Définir un modèle de 3 rangées pour la grille parente.
	 * La hauteur de chaque rangée s'adaptera au contenu le plus grand de cette rangée.
	*/
	grid-template-rows: auto auto auto;
}
/* --- Style de chaque colonne --- */
/* On préserve le regroupement en faisant de la colonne un conteneur Flex */
.aterno-comparison-column {
	/*
	 * ÉTAPE 2 : Chaque colonne devient elle-même un conteneur de grille
	 * et on lui dit d'occuper les 3 rangées que nous avons définies dans le parent.
	*/
	display: grid;
	grid-row: span 3; /* Occupe 3 rangées en hauteur */
	
	/*
	 * ÉTAPE 3 (LA MAGIE) : On dit à la grille de la colonne d'utiliser
	 * le modèle de rangées de son parent. Les 3 enfants (titre, boîte jaune, boîte grise)
	 * vont maintenant s'aligner parfaitement sur les rangées du parent.
	*/
	grid-template-rows: subgrid;
	
	/* On retire les styles Flexbox qui ne sont plus nécessaires */
	margin-bottom: 0; /* Le gap de la grille gère l'espacement */
	
}

/* --- Style des titres de chaque colonne (Durabilité, Ventilation, etc.) --- */
.comparison-title {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 10px;
	color: var(--bleuAterno);
}

.comparison-title .comparison-title-icon img {
	width: 28px !important;
	height: 28px !important;
	padding: 10px;
}

.comparison-title h3 {
	color: var(--bleuAterno);
	font-size: 1.6rem; /* 24px; */
	font-weight: 700;
	line-height: 100%; /* 24px */
	text-transform: uppercase;
	margin: 0;
}

/* --- Style commun aux boîtes de comparaison --- */
.comparison-box {
	display: flex;
	align-items: center;
	padding: 20px;
	border-radius: 8px;
	gap: 14px;
}

.comparison-box .comparison-icon img {
	width: 28px;
	height: 28px;
	display: block;
}

.comparison-text h4 {
	color: var(--bleuAterno);
	font-size: 1.07rem; /* 16px; */
	font-weight: 700;
	line-height: 100%; /* 16px */
	text-transform: uppercase;
	margin: 0 0 8px 0;
}

.comparison-text p {
	color: var(--bleuAterno);
	font-size: 0.94rem; /* 14px; */
	font-weight: 400;
	line-height: 100%; /* 14px */
	margin: 0;
}


/* --- Style spécifique à la boîte "positive" (jaune) --- */
.positive-box {
	background: linear-gradient(254deg, #FFD000 12.05%, #FFF600 78.87%);
	color: var(--bleuAterno);
}

/* --- Style spécifique à la boîte "négative" (grise) --- */
.negative-box {
	background-color: #f2f2f2;
	color: var(--bleuAterno);
}


/* --- RESPONSIVITÉ POUR MOBILE --- */
@media (max-width: 989px) {
	.aterno-comparison-module {
		grid-template-columns: repeat(2, 1fr);
	}
}
/* En dessous de 782px (point de rupture courant de WordPress), les colonnes s'empilent */
@media (max-width: 781px) {
	.aterno-comparison-module {
		grid-template-columns: 1fr;
	}

	.aterno-comparison-column {
		margin-bottom: 20px; /* Ajoute un espace entre les colonnes empilées */
	}
}

/* ---------------------------------------------------------- */
/* ----------------- MODULE INTERACTIF ---------------------- */
/* ---------------------------------------------------------- */
.feature-module {
	width: 100%;
}
.fm-inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: var(--fm-gap);
	align-items: center;
}
.fm-inner-gradient {
	background: linear-gradient(0deg, #F8F6F0 0%, #FFF 100%);
}

.fm-inner.reverse .fm-args {
	order: 2;
}
.fm-inner.reverse .fm-media-wrap {
	order: 1;
}

/* ARGUMENTS */
.fm-args {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: 14.7% 10%;
}
.fm-args-bg {
	border-radius: 20px;
	background: #FBFBFB;
}

.fm-arg {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 16px;
	align-items: flex-start;
	opacity: 0.2;
	cursor: pointer;
	padding-bottom: 36px;
	border-bottom: 2px solid rgba(3,0,57,0.1);
}
.fm-arg[aria-current="true"] {
	opacity: 1;
}
.fm-arg:last-child {
	border-bottom: none;
}
.fm-arg:not(:first-child) {
	padding-top: 36px;
}

/* --- CAS SINGLE ARGUMENT --- */
.feature-module.single-arg .fm-num {
	display: none;
}

.fm-num {
	color: var(--bleuAterno);
	font-size: clamp(2.14rem, calc(3vw + 1.34rem), 4.27rem);
	font-weight: 700;
	line-height: 100%; /* 64px */
	text-transform: uppercase;
	/* min-width: 50px; */
}
.fm-title {
	color: var(--bleuAterno);
	font-size: clamp(1.07rem, calc(1.5238vw + 0.67rem), 2.14rem);
	font-weight: 700;
	line-height: 110%; /* 35.2px */
	text-transform: uppercase;
    margin: 0 0 0.54rem 0;
}
.fm-desc {
	grid-column: 1 / -1;
}
.fm-desc p {
	color: var(--bleuAterno);
	font-size: 	0.94rem; /* 14px */
	font-weight: 400;
	line-height: 140%; /* 21px */
}

/* MEDIAS */
.fm-media-container {
	position: relative;
}

.fm-media-wrap {
	width: 100%;
	overflow: hidden;
	/*padding: 20px;*/
}
.fm-media-wrap-bg {
	border-radius: 20px;
	background: #FBFBFB;
}

.fm-media-slider {
	display: flex;
	width: 100%;
	transition: transform .4s ease;
}

.fm-media {
	flex: 0 0 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
}
.fm-media img,
.fm-media video {
	max-width: 100%;
	height: auto;
	display: block;
}


/* BULLETS */
.fm-bullets {
	justify-content: center;
	gap: var(--bullet-gap);
	margin-top: 34px;
	margin-bottom: 20px;
	display: none;
}
.fm-bullets button {
	width: var(--bullet-size);
	height: var(--bullet-size);
	border-radius: 50%;
	border: none;
	background: var(--bleuAterno);
	opacity: 0.3;
	cursor: pointer;
	padding: 0;
}
.fm-bullets button[aria-current="true"] {
	background: var(--bleuAterno);
	opacity: 1;
}

/* FLECHES */
.fm-nav {
	display: none;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10;
}
.fm-nav-right, .fm-nav-left {
    display: none;
    align-items: center;
    justify-content: center;
    border: none;
    width: 46px;
    height: 46px;
    border-radius: 50%;
	background-color: rgba(242, 242, 242, 1);
    cursor: pointer;
    pointer-events: all;
    transition: background-color 0.3s ease;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50%;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMzAiIHZpZXdCb3g9IjAgMCAzMCAzMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMC44NTc4NjUgMTVIMjkuMTQyMU0yOS4xNDIxIDE1TDE1IDAuODU3OTFNMjkuMTQyMSAxNUwxNSAyOS4xNDIyIiBzdHJva2U9IiMwMzAwMzkiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiB0cmFuc2Zvcm09InJvdGF0ZSgxODAgMTUgMTUpIi8+PC9zdmc+");
}
.fm-nav-right {
	transform: rotate(180deg);
	right: 10px;
}
.fm-nav-left {
	left: 10px;
}

.feature-module.single-arg .fm-nav-right, .feature-module.single-arg .fm-nav-left {
	background-color: rgba(3, 0, 57, 1);
	background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMzAiIHZpZXdCb3g9IjAgMCAzMCAzMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyBjbGlwLXBhdGg9InVybCgjY2xpcDBfODI1NF8xNzEwKSI+CiAgICA8cGF0aCBkPSJNMC44NTc4NjUgMTVIMjkuMTQyMU0yOS4xNDIxIDE1TDE1IDAuODU3OTFNMjkuMTQyMSAxNUwxNSAyOS4xNDIyIiBzdHJva2U9IiNGMkYyRjIiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiB0cmFuc2Zvcm09InJvdGF0ZSgxODAgMTUgMTUpIiAvPgogIDwvZz4KICA8ZGVmcz4KICAgIDxjbGlwUGF0aCBpZD0iY2xpcDBfODI1NF8xNzEwIj4KICAgICAgPHJlY3Qgd2lkdGg9IjMwIiBoZWlnaHQ9IjMwIiBmaWxsPSJ3aGl0ZSIvPgogICAgPC9jbGlwUGF0aD4KICA8L2RlZnM+Cjwvc3ZnPg==");
}

.feature-module.single-arg .fm-nav-right {
	right: 20px;
}
.feature-module.single-arg .fm-nav-left {
	left: 20px;
}

/* MOBILE */
@media(max-width:899px){
	.fm-inner {
		grid-template-columns: 1fr;
		row-gap: 0;
		padding: 48px 0 136px 0;
	}
	.fm-args {
		order: 3;
		padding: 0 20px;
	}
	.fm-media-wrap {
		order:1;
	}
	.fm-bullets {
		order: 2;
		display: flex;
	}
	.fm-arg {
		display: none;
		cursor: unset;
		padding-bottom: 0;
		border-bottom: none;
		padding-top: 0;
	}
	.fm-arg:not(:first-child) {
		padding-top: 0;
	}
	.fm-arg[aria-current="true"] {
		display: grid;
	}
	.fm-nav {
		display: flex;
	}

	/* Réorganisation sur mobile pour single-arg */
	.feature-module.single-arg .fm-inner {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
	}

	.feature-module.single-arg .fm-args, .feature-module.single-arg .fm-arg {
		display: contents;
	}

	.feature-module.single-arg .fm-args {
		order: 1;
		margin-bottom: 16px;
	}

	.feature-module.single-arg .fm-media-wrap {
		order: 2;
		margin-bottom: 16px;
	}

	.feature-module.single-arg .fm-desc {
		order: 3;
	}
	.feature-module.single-arg .fm-nav-left {
		left: -11px;
	}
	.feature-module.single-arg .fm-nav-right {
		right: -11px;
	}
}

/* Cas single argument = flèches visibles aussi en desktop */
.feature-module.single-arg .fm-nav {
	display: flex;
}


/* ------------------------ BLOCK MEDIA TEXT GUTENBERG ----------------- */

.wp-block-image img {
	border-radius: 20px;
}

.wp-block-image .aligncenter, .wp-block-image .alignleft, .wp-block-image .alignright, .wp-block-image.aligncenter, .wp-block-image.alignleft, .wp-block-image.alignright {
	display: table;
}

.wp-block-image .aligncenter {
	margin-left: auto ;
	margin-right: auto;
}

.has-text-align-center {
	text-align: center !important;
}
.has-text-align-left {
	text-align: left;
}
.has-text-align-right {
	text-align: right;
}

/* Styles de base pour les blocs media-text */
.wp-block-media-text {
    display: flex;
    flex-wrap: wrap; /* Passage à la ligne sur mobile */
    align-items: center; /* Alignement vertical par défaut */
    gap: var(--media-text-gap);
	padding: 4.54rem 0;
}

/* Styles pour le média (image) */
.wp-block-media-text__media {
    max-width: 100%;
}

/*.wp-block-media-text__media img {
    display: block;
    max-width: 684px;
    height: auto;
    border-radius: 20px;
    margin-left: auto; 
    margin-right: auto;
}*/

.wp-block-media-text__media img {
    display: block;
    width: auto !important; /* Force l'image à garder sa largeur naturelle */
    max-width: 100% !important; /* Empêche l'image de dépasser si l'écran est tout petit */
    height: auto;
    border-radius: 20px;
    margin-left: auto; 
    margin-right: auto;
}

/* Styles pour le contenu (texte) */
.wp-block-media-text__content {
    max-width: 100%;
}
@media (min-width: 1441px) {
    .wp-block-media-text__content {
        /* On ajoute du padding horizontal pour éviter que le texte
           ne soit trop large et difficile à lire. */
        padding-inline: 5%; /* Ajoute un espace à gauche ET à droite du contenu */
    }
}
/* Ajustements pour les écrans plus larges (768px ou plus) */
@media (min-width: 767px) {
    /*.wp-block-media-text {
        flex-wrap: nowrap;
    }*/

    /* Les deux colonnes font 50% de la largeur disponible */
    .wp-block-media-text__media,
    .wp-block-media-text__content {
        flex-basis: calc(50% - (var(--media-text-gap) / 2));
        flex-grow: 1; /* On utilise flex-grow: 1 pour qu'elles occupent bien l'espace */
        flex-shrink: 1;
    }

    /* Ordre pour le bloc avec image à droite */
    .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {
        order: 0;
    }
    .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media {
        order: 1;
    }
}

/* Classes pour l'alignement vertical */
.wp-block-media-text.is-vertically-aligned-top {
    align-items: flex-start;
}

.wp-block-media-text.is-vertically-aligned-bottom {
    align-items: flex-end;
}

.wp-block-media-text.is-vertically-aligned-center {
    align-items: center;
}

/* Styles pour le mobile (si image à droite, on la remet au-dessus) */
@media (max-width: 768px) {
    .wp-block-media-text {
		padding: 2.14rem 0;
    }
	.wp-block-media-text__media img {
		max-width: 100%;
	}
    .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media, .wp-block-media-text .wp-block-media-text__media {
        order: 1;
    }
	

	.wp-block-media-text__media {
		flex: 1; /* Permet à l'élément figure de s'étirer */
	}

	.wp-block-media-text__media img {
		/*width: 100%; */ /* Assure que l'image prend toute la largeur disponible */
		height: auto;
		object-fit: contain; /* Si tu veux conserver l'aspect ratio sans couper l'image */
	}
}

/*
 * Style générique pour le conteneur des colonnes Gutenberg
 */
.wp-block-columns {
	display: flex; /* Utilise Flexbox pour l'alignement des colonnes */
	flex-wrap: wrap; /* Permet aux colonnes de passer à la ligne sur les petits écrans */
	/*gap: 2em;*/ /* Espace entre les colonnes (ajustez selon vos besoins) */
}
/*.wp-block-columns.is-layout-flex {
	align-items: stretch;
}*/
/*
 * Style générique pour chaque colonne individuelle
 */
.wp-block-column {
	flex-grow: 1; /* Permet aux colonnes de grandir pour remplir l'espace disponible */
	flex-basis: 0; /* Base de largeur initiale avant la distribution de l'espace */
	/*align-self: auto !important; */
	align-self: auto;
}

/*
 * Gestion de la largeur des colonnes définie dans le back-office
 * Gutenberg ajoute un style en ligne "flex-basis" sur la colonne.
 * Ce sélecteur cible les colonnes qui ont un style en ligne, 
 * ce qui est le cas lorsque vous définissez une largeur en pourcentage.
 */
.wp-block-column[style*="flex-basis"] {
	flex-grow: 0; /* Empêche la colonne de grandir au-delà de sa largeur définie */
}

.wp-block-columns {
	display: flex;
	/* La propriété `align-items` définit l'alignement par défaut pour TOUTES les colonnes.
	 La valeur par défaut du navigateur est 'stretch', ce qui étire les colonnes
	 pour qu'elles aient toutes la même hauteur. Vous pouvez la laisser ou la
	 changer pour 'flex-start' si vous voulez que tout soit aligné en haut par défaut. */
	align-items: flex-start; /* Aligne toutes les colonnes centrées par défaut */
}

/* 2. Classes d'alignement pour une colonne SPÉCIFIQUE
 * Celles-ci surchargent le `align-items` du parent pour la colonne choisie.
---------------------------------------------------------------------- */

/**
 * Aligne la colonne en haut du conteneur.
 * (Ceci sera l'état par défaut si vous utilisez `align-items: flex-start;` ci-dessus)
 */
.wp-block-column.is-vertically-aligned-top {
	align-self: flex-start;
}

/**
 * Centre la colonne verticalement par rapport à la colonne la plus haute.
 */
.wp-block-column.is-vertically-aligned-center {
	align-self: center;
}

/**
 * Aligne la colonne en bas du conteneur.
 */
.wp-block-column.is-vertically-aligned-bottom {
	align-self: flex-end;
}

/*
 * Rendre les colonnes responsives sur les appareils mobiles
 * En dessous de 782px, les colonnes s'empileront verticalement.
 */
@media (max-width: 782px) {
	.wp-block-columns {
		flex-direction: column; /* Change la direction de la flexbox en verticale */
	}

	.wp-block-columns > .wp-block-column { /* L'utilisation de '>' rend le sélecteur plus spécifique */
		flex-basis: 100% !important;
		width: 100% !important; /* Ajout d'une largeur explicite pour plus de sûreté */
		max-width: none !important; /* C'EST LA LIGNE LA PLUS IMPORTANTE À AJOUTER */
		min-width: 0 !important; /* Annule aussi une éventuelle largeur minimale */
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.wp-block-column + .wp-block-column {
		margin-top: 32px;
	}
	.wp-block-columns.solutions > .wp-block-column:nth-of-type(2) {
		margin-top: 0 !important;
	}
}

/*
 * ========================================================================
 * Style générique pour le bloc Bannière (Cover) de Gutenberg
 * ========================================================================
 */

/* 1. Style de base du conteneur principal
--------------------------------------------- */
.wp-block-cover {
	position: relative; /* Contexte de positionnement pour les enfants */
	display: flex; /* Utilise Flexbox pour le centrage du contenu */
	justify-content: center; /* Centrage horizontal du conteneur interne */
	align-items: center; /* Centrage vertical du conteneur interne */
	width: 100%;
	overflow: hidden; /* Cache les parties de l'image/vidéo qui dépassent */
	background-size: cover; /* Par défaut, l'image de fond couvre tout le bloc */
	background-position: center center; /* Centre l'image de fond */
	background-repeat: no-repeat; /* Empêche la répétition par défaut */
}

/* 2. Style pour le média de fond (Image ou Vidéo)
--------------------------------------------- */
.wp-block-cover__image-background,
.wp-block-cover__video-background {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover; /* Fait en sorte que le média couvre le conteneur sans se déformer */
	z-index: 1; /* Se place sous le contenu et l'overlay */

	/* La propriété `object-position` est gérée en ligne par Gutenberg
	 lorsque l'utilisateur choisit un "Point de focalisation".
	 Ex: style="object-position: 20% 80%;"
	 Notre `object-fit: cover;` permet à cette propriété de fonctionner parfaitement. */
}

/* 3. Style pour l'overlay de couleur ou de dégradé
--------------------------------------------- */
.wp-block-cover__background {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 2; /* Se place au-dessus du média mais en dessous du contenu */

	/* L'opacité est gérée par les classes de Gutenberg, comme `.has-background-dim`
	 et `.has-background-dim-40` par exemple. */
}

.has-background-dim-10 {
	opacity: 0.1;
}
.has-background-dim-20 {
	opacity: 0.2;
}
.has-background-dim-30 {
	opacity: 0.3;
}
.has-background-dim {
	opacity: 0.5;
}
.has-background-dim-50 {
	opacity: 0.5;
}
.has-background-dim-80 {
	opacity: 0.8;
}
.has-background-dim-90 {
	opacity: 0.9;
}
.has-background-dim-100 {
	opacity: 1.0;
}

/* 4. Conteneur pour le contenu interne (textes, boutons...)
--------------------------------------------- */
.wp-block-cover__inner-container {
  position: relative; /* Pour s'assurer qu'il est bien positionné dans le flux */
  z-index: 3; /* Se place au-dessus de l'overlay et du média */
  width: 100%;
  padding: 1em; /* Ajoute un peu d'air autour du contenu */
  color: #ffffff; /* Couleur de texte par défaut pour une bonne lisibilité, à ajuster */
}

/* 5. Gestion des options spécifiques de l'éditeur
---------------------------------------------------------------------- */

/* Option "Arrière-plan fixe" (effet parallaxe) */
.wp-block-cover.has-background-parallax {
  /* WordPress utilise ici directement `background-image` sur le conteneur */
  background-attachment: fixed;
}

/* Option "Arrière-plan répété" */
.wp-block-cover.has-background-repeat {
  background-repeat: repeat;
  background-size: auto; /* On annule le 'cover' pour que la répétition soit visible */
}


/* 6. Améliorations pour le Responsive
---------------------------------------------------------------------- */
@media (max-width: 782px) {
  /* L'effet parallaxe (`background-attachment: fixed`) est souvent saccadé
     et peut causer des problèmes de performance sur les mobiles.
     Il est de bonne pratique de le désactiver sur les petits écrans. */
  .wp-block-cover.has-background-parallax {
    background-attachment: scroll !important;
  }

  /* On peut réduire la hauteur minimale sur mobile pour un meilleur affichage */
  .wp-block-cover {
    min-height: 300px; /* On force une hauteur plus petite que sur desktop */
  }
}


/*
 * ========================================================================
 * Style générique pour le bloc Boutons (Buttons) de Gutenberg
 * ========================================================================
 */

/* 1. Style de base du conteneur de boutons
---------------------------------------------------------------------- */
.wp-block-buttons {
  display: flex; /* Active le mode Flexbox */
  gap: 0.75em; /* Espace entre les boutons (horizontal ou vertical) */

  /* Par défaut, les boutons s'alignent horizontalement et peuvent passer à la ligne */
  flex-direction: row;
  flex-wrap: wrap; 
}

.wp-block-buttons.is-layout-flex {
	flex-wrap: nowrap;
	align-items: start;
}

/* 2. Style de base pour le bouton individuel (lien <a>)
 * C'est ici que vous définissez l'apparence de VOS boutons.
---------------------------------------------------------------------- */
.wp-block-button__link {
	/* Style visuel */
	display: inline-block; /* Pour que le padding et les marges fonctionnent correctement */
	text-align: left;
	text-decoration: none; /* Enlève le soulignement du lien */
	padding: 1.267rem 1.34rem; /* 19px 20px; */
	border-radius: 56px;
	border: 1px solid var(--bleuAterno);
	background: rgba(255,255,255,0.01);
	text-transform: uppercase;
	color: var(--bleuAterno);
	font-size: 0.87rem; /* 13px; */
	font-weight: 600;
	line-height: 120%; /* 16.8px */
	backdrop-filter: blur(16px);
}
.wp-block-button__link:hover {
	background: rgba(3,0,57, 0.1);
}


/* 3. Gestion des options de justification (alignement horizontal)
 * Gutenberg ajoute ces classes au conteneur `.wp-block-buttons`.
---------------------------------------------------------------------- */
.wp-block-buttons.is-content-justification-left {
  justify-content: flex-start;
}

.wp-block-buttons.is-content-justification-center {
  justify-content: center;
}

.wp-block-buttons.is-content-justification-right {
  justify-content: flex-end;
}

/* Cas spécial pour "Espace entre les éléments" */
.wp-block-buttons.is-content-justification-space-between {
  justify-content: space-between;
}


/* 4. Gestion de l'orientation
---------------------------------------------------------------------- */
.wp-block-buttons.is-vertical {
  flex-direction: column;
  /* Optionnel : on peut vouloir aligner les boutons à gauche en mode vertical */
  align-items: flex-start; 
}


/* 5. Gestion du passage à la ligne
 * Par défaut, le wrap est activé (`flex-wrap: wrap`).
 * Gutenberg ajoute `flex-wrap: nowrap` en style inline quand on décoche l'option.
 * Si vous voulez forcer le non-passage à la ligne avec une classe :
---------------------------------------------------------------------- */
.wp-block-buttons.is-nowrap {
  flex-wrap: nowrap;
  overflow-x: auto; /* Permet de scroller si les boutons dépassent */
}


/* 6. Améliorations pour le Responsive
---------------------------------------------------------------------- */
@media (max-width: 782px) {
	/*.wp-block-buttons .wp-block-button {
		width: 100%;
		margin-right: 0;
		margin-left: 0;
	}
	.wp-block-buttons .wp-block-button__link {
		width: 100%;
	}*/

  /* Force la justification au centre sur mobile pour un meilleur rendu,
     sauf si l'orientation est déjà verticale. */
  /*.wp-block-buttons:not(.is-vertical) {
    justify-content: center;
  }*/

  /* Sur les très petits écrans, on peut vouloir que les boutons prennent toute la largeur
     s'ils sont dans une colonne verticale. */
  .wp-block-buttons.is-vertical .wp-block-button {
    width: 100%;
  }
  
  .wp-block-buttons.is-vertical .wp-block-button__link {
    width: 100%; /* Le lien remplit tout son conteneur */
    box-sizing: border-box; /* S'assure que le padding n'augmente pas la largeur totale */
  }
}


/*
 * ========================================================================
 * Style générique pour le bloc Gallery de Gutenberg
 * ========================================================================
 */

/* Styles génériques pour le bloc Gallery de Gutenberg */
.wp-block-gallery {
    /* Surcharge le display: flex de Gutenberg pour utiliser grid */
    display: grid !important; /* Utilisez !important si nécessaire pour surcharger le style en ligne ou un autre CSS */
    gap: 24px; /* Gap par défaut, peut être surchargé */
    list-style: none;
    margin: 0;
    padding: 0;
}

/* S'assure que les galeries utilisant le layout flex de Gutenberg sont traitées comme une grille pour nos besoins */
.wp-block-gallery.is-layout-flex {
    display: grid !important; /* Important pour forcer le comportement de grille */
}

.wp-block-gallery.columns-1 {
    grid-template-columns: repeat(1, 1fr);
}

.wp-block-gallery.columns-2 {
    grid-template-columns: repeat(2, 1fr);
}

.wp-block-gallery.columns-3 {
    grid-template-columns: repeat(3, 1fr);
}

.wp-block-gallery.columns-4 {
    grid-template-columns: repeat(4, 1fr);
}

.wp-block-gallery.columns-5 {
    grid-template-columns: repeat(5, 1fr);
}

.wp-block-gallery.columns-6 {
    grid-template-columns: repeat(6, 1fr);
}

.wp-block-gallery .wp-block-image {
    margin: 0; /* Supprime la marge par défaut des figures imbriquées */
    overflow: hidden; /* S'assure que rien ne dépasse */
    display: flex; /* Utilise flexbox pour l'image et la légende */
    flex-direction: column; /* Empile l'image et la légende verticalement */
    height: 100%; /* Permet au conteneur de prendre la hauteur disponible dans la grille par défaut */
    /* La hauteur spécifique de 240px sera définie pour .gamme__radiateur .wp-block-image */
}

.wp-block-gallery .wp-block-image img {
    display: block;
    width: 100%;
    /* La hauteur sera gérée par flex-grow pour s'adapter à l'espace restant */
    object-fit: cover; /* L'image couvrira l'espace disponible, potentiellement coupée si le ratio est forcé */
    flex-grow: 1; /* L'image prend tout l'espace flexible restant */
}

/* Styles pour la légende (figcaption) - Toujours visible */
.wp-block-gallery .wp-block-image figcaption {
    flex-shrink: 0; /* Empêche la légende de rétrécir */
    height: auto; /* La légende prend sa hauteur naturelle */
}



/* Styles spécifiques pour la galerie .gamme__radiateur */
.wp-block-gallery.wp-block-gallery-1.gamme__radiateur {
	gap: 24px; /* Gap spécifique pour cette galerie */
}

.wp-block-gallery.gamme__radiateur .wp-block-image {
	border-radius: 13px;
	background-color: #FBFBFB;
	padding: 1.07rem; /* 16px */
    /*height: 240px;*/ /* Hauteur spécifique pour les images de cette galerie */
	box-sizing: border-box;
	aspect-ratio: 4 / 5;
}
.wp-block-gallery.gamme__radiateur .wp-block-image img {
    /* Avec height: 240px sur le parent .wp-block-image, et flex-grow: 1 sur img,
       l'image prendra 240px moins la hauteur de la légende.
       object-fit: cover est toujours essentiel pour remplir cet espace.
       Si l'image est coupée, cela signifie que son ratio d'aspect est trop différent
       de l'espace disponible (hauteur calculée - hauteur légende).
       
       Si vous voulez ÉVITER la coupure à tout prix, même si cela laisse des bandes
       vides ou réduit la taille de l'image, vous devriez changer object-fit: cover à object-fit: contain.
       Cependant, object-fit: cover est généralement préféré pour les galeries pour remplir l'espace.
       La "coupure" est inhérente à "cover" si le ratio du conteneur ne correspond pas.

       Si "coupée" signifie que la légende écrase l'image ou que l'image est trop petite,
       alors le flexbox gère bien le partage de l'espace.
       L'image prend l'espace restant après que la légende ait pris sa hauteur auto.
    */
    height: auto; /* Redondant ici car flex-grow: 1 gère la hauteur */
    min-height: 0; /* Important pour les éléments flex-grow dans certains cas */
}
/* Légende dans la galerie gamme de radiateurs */
.wp-block-gallery .wp-block-image figcaption {
	color: var(--bleuAterno);
	font-size: 1.07rem; /* 16px */
	font-weight: 600;
	line-height: 110%; /* 17.6px */
	text-transform: uppercase;
}
@media (max-width: 768px) {
	.wp-block-gallery.wp-block-gallery-1.gamme__radiateur {
		gap: 10px; /* Gap spécifique pour cette galerie */
	}
	.wp-block-gallery.gamme__radiateur .wp-block-image {
		padding: 1rem 0.8rem; /* 15px 12px */
		/*height: 224px; */ /* Hauteur spécifique pour les images de cette galerie */
	}
	.wp-block-gallery .wp-block-image figcaption {
		font-size: 1rem; /* 15px */
	}
}
/* Media queries pour la responsivité (exemple, ajustez si nécessaire) */
/*@media (max-width: 768px) {
    .wp-block-gallery.columns-2 {
        grid-template-columns: repeat(1, 1fr); /* Passe à une colonne sur mobile pour la galerie à 2 colonnes 
    }
    .wp-block-gallery.gamme__radiateur {
        grid-template-columns: repeat(1, 1fr); /* Assure une seule colonne pour la galerie spécifique sur mobile 
    }
}*/



.wp-block-gallery.wp-block-gallery-1.logo__reassurance {
	display: flex !important;
	gap: 2.14rem;
	justify-content: center;
 }
/*.wp-block-gallery.wp-block-gallery-1.logo__reassurance img {
	max-width: 80px !important;
	border-radius: 0;
}*/


/*---------------------- BLOCKS GUTENBERG ------------- */
/* pour les pages internes */
.hero__pad--top {
	padding-top: 210px;
}
/* pour les pages de formulaires */
.hero__form__pad--top {
	padding-top: 88px;
}
.text_align_left {
	text-align: left;
}
.center__col {
	align-self: center;
}
.mb30 {
	margin-bottom: 30px;
}
.hero__bg--home {
	background-image: url("ressources/monogramme-full.svg");
	background-repeat: no-repeat;
	background-position: calc(100% + 300px) calc(100% + 300px);
	background-size: min(100vw, 886px) auto; /* largeur max, hauteur auto */
	min-height: 800px;
	transition: background-size 0.5s ease-in-out;
}
.hero__content--home {
	width: 100% !important;
	padding-top: clamp(96px, 3rem + 14.24vw, 250px);
	padding-left: clamp(20px, 1.5rem + 5vw, 142px);
	/*padding-left: 9.86%;*/
	padding-right: clamp(20px, 1.5rem + 20vw, 482px);
	/*padding-right: 33.47%;*/
}
.hero__content--home p {
	max-width: 580px;
	margin: 1.87rem 0 2.7rem 0;
}
.hero__content--home .btn__outline {
	margin-bottom: 32px;
}

@media (max-width: 1080px) {
    .hero__bg--home {
		background-size: min(100vw, 85%) auto; /* largeur max, hauteur auto */
    }
}
@media (max-width: 768px) {
	.hero__bg--home {
		background: none;
	}
	.hero__content--home {
		padding-top: 96px;
		padding-left: 20px;
		padding-right: 20px;
	}
}
.mt32 {
	margin-top: 2.13rem; /* 32px; */
}
.mt24 {
	margin-top: 1.6rem; /* 24px; */
}
.mb24 {
	margin-bottom: 1.6rem; /* 24px; */
}

@media (max-width: 768px) {
	.mb24 {
		margin-bottom: 1.07rem; /* 16px */
	}
}

.mb32 {
	margin-bottom: 32px;
}

.hero__page_interne .wp-block-cover__inner-container {
	padding: clamp(40px,4vw,378px) clamp(20px,4vw,378px);
}

/* 1. Conteneur principal du Hero Block */
.hero__block {
    position: relative; /* Contexte de positionnement pour les enfants en position absolue */
    width: 100%;
    /*height: 70vh;*/ /* Hauteur de 70% de la fenêtre, à ajuster selon vos besoins */
    overflow: hidden; /* Empêche les éléments de déborder */
    display: flex;
	flex-direction: column;
    align-items: center; /* Centre le contenu verticalement */
    justify-content: start; /* Centre le contenu horizontalement */
	/*padding-top: 123px; 138px */
}
.hero__block--image {
	min-height: 660px;
}
.hero__block--fond {
	min-height: 496px;
}

/* 2. L'image de fond */
.hero__image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%; /* L'image prend 100% de la largeur du conteneur */
    height: 100%; /* L'image prend 100% de la hauteur du conteneur */
    object-fit: cover; /* Redimensionne l'image pour couvrir tout le conteneur sans la déformer */
    z-index: 1; /* Place l'image à l'arrière-plan */
}

/* 3. L'overlay de couleur/dégradé */
.hero__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Dégradé */
    background: 
        linear-gradient(158deg, rgba(0, 0, 0, 0.00) -1.44%, rgba(0, 0, 0, 0.50) 85.01%), 
        linear-gradient(0deg, rgba(0, 0, 0, 0.30) 0%, rgba(0, 0, 0, 0.30) 100%);
    z-index: 2; /* Se place au-dessus de l'image */
}

/* 4. Le conteneur du texte */
.hero__content {
    position: relative; /* Pas absolute, pour rester dans le flux normal centré par Flexbox */
    z-index: 3; /* Se place au-dessus de l'overlay */
    color: white;
    text-align: center;
    max-width: 1200px; /* Limite la largeur du texte pour une meilleure lisibilité */
    padding-top: 210px;
	padding-bottom: 91px;
    padding-left: clamp(20px, 5vw, 378px);
    padding-right: clamp(20px, 5vw, 378px);
}

.hero__content p {
	color: #ffffff;
	text-align: center;
	font-size: 1rem;
	font-weight: 400;
	line-height: 140%; /* 21px */
}

.wp-block-columns.hero__form {
	align-items: flex-start;
}

.wp-block-columns.hero__form h1 {
	font-size: clamp(1.8rem, 1.4rem + 3vw, 2.94rem) !important; /* 27px 44px */
}

.hero__form .wp-block-column .wp-block-cover {
	min-height: 800px;
	padding: 0;
}
.hero__form .wp-block-cover .wp-block-cover__inner-container {
	width: 90% !important;
/*	padding-left: clamp(20px, 4vw, 142px);
	padding-right: clamp(20px, 4vw, 142px);	*/
	padding-left: 20%;
	padding-right: 20%;
	align-self: center;
}
.hero__form .wp-block-cover__inner-container h1, .hero__form .wp-block-cover__inner-container p {
	text-align: left;
	color: #fff;
}

@media (max-width: 768px) {
	.hero__block {
		min-height: 351px;
		/*padding-top: 88px; */
		align-items: start;
	}
	.hero__content {
		padding-top: 160px;
		padding-bottom: 32px;
		padding-left: 20px;
		padding-right: 20px;
		width: 100%;
	}
	.hero__content p {
		text-align: left;
	}
	.hero__form .wp-block-cover .wp-block-cover__inner-container {
		width: 100% !important;
		padding-left: 20px;
		padding-right: 20px;
	}
}

/*
 * CSS pour la Galerie Paginée
 */

/* Conteneur principal de la grille d'images */
.galerie-grid {
    display: grid;
    /* Crée des colonnes flexibles d'au moins 300px */
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 24px; /* Espace entre les images */
    margin-bottom: 54px;
}

/* Chaque élément de la galerie (image + légende) */
.galerie-item {
    position: relative; /* Nécessaire pour positionner la légende */
    overflow: hidden; /* Cache les parties de la légende qui dépassent */
}

/* L'image dans la galerie */
.galerie-item img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 20px;
	margin-bottom: 16px;
}

.galerie-item .galerie-caption {
	text-align: left;
	flex-grow: 1; 
}

/*
 * CSS pour la Lightbox
 */

.realisation {
	cursor: zoom-in;
}
.lightbox {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.8);
	display: none;
	justify-content: center;
	align-items: center;
	z-index: 2000;
	cursor: zoom-out;
}
.lightbox img {
	max-width: 90%;
	max-height: 90%;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.7);
}
.no-scroll {
    overflow: hidden; /* Bloque le scroll vertical */
    height: 100vh; /* Empêche les décalages liés au contenu plus grand que la fenêtre */
}


#breadcrumbs, .yoast-breadcrumbs {
	display: flex;
	align-items: center;
	gap: 4px;
	justify-content: center;
	margin: 0 0 1.6rem 0; /* 24px */
	z-index: 3; /* Se place au-dessus de l'overlay */
	text-align: center;
}
.yoast-breadcrumbs, .yoast-breadcrumbs a, .yoast-breadcrumbs a:visited, .yoast-breadcrumbs a:link, .yoast-breadcrumbs a:focus, .yoast-breadcrumbs a:active,
#breadcrumbs, #breadcrumbs a, #breadcrumbs a:visited, #breadcrumbs a:link, #breadcrumbs a:focus, #breadcrumbs a:active {
	color: #FFF;
	font-size: 0.8rem; /* 12px;*/
	line-height: 140%; /* 16.8px */
	font-style: normal;
	font-weight: 400;
}
#breadcrumbs a:hover, .yoast-breadcrumbs a:hover {
	text-decoration: underline;
}

@media (max-width: 768px) {
	#breadcrumbs, .yoast-breadcrumbs {
		justify-content: start;
		text-align: left;
	}
}

.group__mp {
	padding: 0 1.6rem; /* 0 24px */
	margin: 6.7rem 0; /* 72px 41.8rem 0  100px  6.7rem */
}
.group__centrer {
	padding: 0 1.6rem; /* 0 24px */
	margin: 4.8rem auto;
	max-width: 684px;
}
.column__centrer {
	padding: 0 9.8%;
	margin: 4.8rem auto;
	justify-content: space-between;
	gap: 11.6%;
}

@media (max-width: 768px) {
	.group__mp {
		padding: 0 1.34rem; /* 0 20px */
		margin: 3.2rem 0; /* 48px 0 */
	}
	.group__centrer {
		width: 100%;
		padding: 0 1.34rem; /* 0 20px */
		margin: 3.2rem 0; /* 48px 0 */
	}
	.column__centrer {
		padding: 0 1.34rem; /* 0 20px */
		margin: 3.2rem 0; /* 48px 0 */
		width: 100%;
	}
}



.simulateur {
	border-radius: 36px;
}

.simulateur .wp-block-cover__inner-container {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.wp-block-cover.simulateur {
	padding: clamp(2.13rem, calc(2.1390vw + 1.69rem), 2.67rem);
	align-items: stretch;
	min-height: 672px;
}


.wp-block-cover.simulateur .wp-block-cover__inner-container {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  /*height: 100%;*/
}

.simulateur p {
	text-align: left;
	color: var(--bleuAterno);
	font-size: clamp(1.33rem, calc(0.7619vw + 1.14rem), 1.87rem); /* 20px 28px */
	font-weight: 400;
	line-height: 110%; /* 30.8px */
	text-transform: uppercase;
}

.solutions {
  gap: 0;
}

.solutions p {
	color: #FFF;
	/*font-size: 1.067rem;*/ /* 16px; */
	font-size: clamp(0.94rem, 0.8286rem + 0.1905vw, 1.067rem);
	font-style: normal;
	font-weight: 700;
	line-height: 140%; /* 22.4px */
	text-transform: uppercase;
	margin: 0;
}
.solutions h2 {
	margin: 1.6rem 0;
}
.solutions .wp-block-cover {
	padding: 0;
}


.nouveautes .wp-block-cover {
	padding: 1.34rem !important;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	aspect-ratio: 330 / 392;
	max-height: 392px;
}
.nouveautes .wp-block-cover img {
	border-radius: 20px;
}
.nouveautes .wp-block-cover .wp-block-cover__inner-container {
	width: auto !important;
}
.nouveautes .wp-block-cover__inner-container {
	align-self: flex-end;
}
.nouveautes h3 {
	font-size: 1.34rem;
	margin-top: 1.2rem; /* 18px */
	margin-bottom: 0.94rem; /* 14px */
}
.nouveautes p {
	margin-top: 0;
	margin-bottom: 1.34rem;
}

/*.is-style-rounded img {
	border-radius: 99999px;
}*/


.block__agences, .block__interview {
	max-height: 664px !important;
	min-height: 664px !important;
}
.block__agences, .block__interview {
	border-radius: 20px;
	padding: clamp(2.13rem, calc(1.3333vw + 1.79rem), 3.07rem) clamp(2.13rem, calc(8.1905vw + 0.00rem), 7.87rem); /* 32px 46px / 32px 118px */
}
.block__interview.wp-block-cover {
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.80) 0%, rgba(0, 0, 0, 0.80) 100%), #000000;
/*  background: 
        linear-gradient(158deg, rgba(0, 0, 0, 0.00) -1.44%, rgba(0, 0, 0, 0.50) 85.01%), 
        linear-gradient(0deg, rgba(0, 0, 0, 0.30) 0%, rgba(0, 0, 0, 0.30) 100%);*/
}

.garanties > div.wp-block-column {
	align-self: stretch;
}
.garanties > div.wp-block-column {
	padding: clamp(4.00rem, calc(0.9524vw + 3.75rem), 4.67rem) clamp(3.87rem, calc(8.7619vw + 1.59rem), 10.00rem); /* 70px 150px */ /* 60px 58px */
}
.garanties > div.wp-block-column > p:first-child {
	color: var(--bleuAterno);
	/*font-size: 14rem; / 210px */
	font-size: clamp(12.40rem, calc(2.2857vw + 11.81rem), 14.00rem);
	font-weight: 700;
	line-height: 84%; /* 21px */
	text-transform: uppercase;
	/*margin: 0 0 1.34rem 0; */ /* 20px */
	margin: 0;
}
.garanties > div.wp-block-column > p:nth-child(2) {
	color: var(--bleuAterno);
	font-size: 1.33rem; /* 20px */
	font-weight: 700;
	text-transform: uppercase;
	margin: 1.33rem 0 0.667rem 0;
}
.garanties > div.wp-block-column > p:nth-child(3) {
	color: var(--bleuAterno);
	font-size: 0.94rem; /* 14px */
	font-weight: 400;
	margin: 0;
}
.wp-block-columns.colonnes__slider.garanties > .wp-block-column .wp-block-image img {
	border-radius: 50% !important;
}

.garanties > div.wp-block-column {
	padding: 4rem 3.90rem; /* 60px 58px */
}

.wp-block-columns + .wp-block-columns {
	margin-top: 56px;
}
@media (max-width: 768px) {
	.wp-block-columns + .wp-block-columns {
		margin-top: 44px;
	}
	
}
@media (max-width: 989px) {
	.garanties > div.wp-block-column > p:first-child, .garanties > div.wp-block-column > p:nth-child(2), .garanties > div.wp-block-column > p:nth-child(3) {
		text-align: center;
	}
    .wp-block-group.group__mp.guarantee .slider-nav {
        display: block; /* On s'assure qu'il est visible */
        position: absolute;
        top: 62%;
        transform: translateY(-50%);
        width: 100%;
        left: 0;
        z-index: 10;
        pointer-events: none;
    }
}

/*------------ POPIN VIDEO TECHNICIEN -------------*/
#video-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.85);
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease;
  z-index: 9999;

  /* ✅ Garantit que l'overlay prend tout l'écran */
  width: 100%;
  height: 100vh;
}

#video-overlay.active {
  opacity: 1;
  visibility: visible;
}

#video-wrapper {
  position: relative;

  /* ✅ Utilisation de la hauteur dynamique */
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

#video-player {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #000;
  display: block;
}


#video-close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 52px;
  height: 52px;
  padding: 0;
  border: none;
  border-radius: 50%;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0,0,0,0.25);
  z-index: 1000;
}

#video-close svg {
  display: block;
  width: 52px;
  height: 52px;
  pointer-events: none;
}
#video-close svg line {
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
}





figure + h2, figure + h3 {
	margin-top: 24px;
	min-height: 50px;
}

@media (max-width: 768px) {
	figure + h2, figure + h3 {
		margin-top: 24px;
		min-height: unset;
	}
}

/*figure + h2 {
	margin-top: 48px;
}*/


/* ------------------ PAGES PRODUITS INERTIE ----------------- */
.blocgaranties {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	padding: 10px;
}

.colgarantie {
	flex: 1;
	min-width: 220px;
	background: #f8f8f8;
	padding: 20px;
	text-align: center;
	border-radius: 8px;
	font-weight: bold;
}

@media (max-width: 900px) {
	.colgarantie {
		flex: 1 1 45%;
	}
}

@media (max-width: 600px) {
	.colgarantie {
		flex: 1 1 100%;
	}
}

/* ------------------- CTA --------------------------- */
/*------ Bouton CTA Documentation   ------- */
a.btn__cta--header {
	color: #000000;
}
.btn__cta {
	font-size: 0.94rem; /* 14px */
	font-weight: 600;
	padding: 0.94rem 1.6rem; /* 14px 24px */
	display: inline-block;
	width: fit-content;
	border-radius: 9999px;
	background: linear-gradient(180deg, #FFF600 0%, #FFD000 73.61%);
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
}
.btn__cta:hover {
	background: #FFF501;
}



.btn__cta__guide .wp-block-button__link {
	font-size: 0.94rem; /* 14px */
	font-weight: 600;
	padding: 0.94rem 1.6rem; /* 14px 24px */
	display: inline-block;
	width: fit-content;
	border-radius: 9999px;
	background: linear-gradient(180deg, #FFF600 0%, #FFD000 73.61%);
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	color: #000000;
	border: none;
}
.btn__cta__guide .wp-block-button__link:hover {
	background: #FFF501;
}
@media (max-width: 768px) {
	.wp-block-buttons.btn__cta__guide .wp-block-button {
		width: 100%;
	}
	.btn__cta__guide .wp-block-button__link {
		width: 100%;
	}
}

.bouton__retour .wp-block-button__link {
	color: #000000;
	font-size: 0.94rem; /* 14px */
	font-weight: 600;
	padding: 0.94rem 1.6rem; /* 14px 24px */
	display: inline-block;
	width: fit-content;
	border-radius: 9999px;
	border: none;
	background: linear-gradient(180deg, #FFF600 0%, #FFD000 73.61%);
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
}
.bouton__retour .wp-block-button__link:hover {
	background: #FFF501;
}
@media (max-width: 768px) {
	.wp-block-buttons.bouton__retour .wp-block-button {
		width: 100%;
	}
	.bouton__retour .wp-block-button__link {
		width: 100%;
	}
}


/*------ Bouton Contactez-nous / Devis ------- */
.btn__outline {
	font-size: 0.94rem; /* 14px */
	font-weight: 600;
	border: 1px solid #ffffff;
	color: #ffffff !important;
	background: var(--bleuAterno);
	padding: 0.94rem 1.6rem; /* 14px 24px */
	border-radius: 9999px;
	display: inline-block;
	width: fit-content;
	max-width: 100%;
	text-decoration: none !important;
	text-transform: uppercase;
	cursor: pointer;
	backdrop-filter: blur(16px);
}
.btn__outline:hover {
	background: rgba(255,255,255,0.5);
}

/*------ Bouton Demander le prix ------- */
.btn__outline--prix {
	color: #ffffff !important;
	background: var(--bleuAterno);
	border: 1px solid var(--bleuAterno);
	padding: 0.94rem 1.6rem; /* 14px 24px */
	border-radius: 9999px;
	display: block;
	width: fit-content;
	max-width: 100%;
	text-decoration: none !important;
	text-transform: uppercase;
	font-weight: 400;
	cursor: pointer;
	font-size: 0.94rem; /* 14px; */
	margin: 0.67rem auto;
	text-align: center;
}
.btn__outline--prix:hover {
	background: rgba(255,255,255,0.5);
	color: var(--bleuAterno) !important;
}


.btn__bleu {
	color: #fff;
	font-size: 0.94rem; /* 14px; */
	font-style: normal;
	font-weight: 600;
	line-height: 120%; /* 16.8px */
	text-transform: uppercase;
	background-color: var(--bleuAterno);
	border: 1px solid var(--bleuAterno);
	cursor: pointer;
	padding: 0.94rem 1.6rem; /* 14px 24px */
	border-radius: 9999px;
	display: inline-block;
	width: fit-content;
	max-width: 100%;
	text-decoration: none !important;
	text-align: center;
	backdrop-filter: blur(16px);
}
.btn__bleu:hover {
	border: 1px solid var(--bleuAterno);
	color: var(--bleuAterno);
	background-color: #fff;
}
.btn__blanc {
	color: var(--bleuAterno);
	font-size: 0.94rem; /* 14px; */
	font-style: normal;
	font-weight: 600;
	line-height: 120%; /* 16.8px */
	text-transform: uppercase;
	background-color: #fff;
	border: 1px solid var(--bleuAterno);
	cursor: pointer;
	padding: 0.94rem 1.6rem; /* 14px 24px */
	border-radius: 9999px;
	display: inline-block;
	width: fit-content;
	max-width: 100%;
	text-decoration: none !important;
	text-align: center;
}
.btn__blanc:hover {
	background: rgba(3,0,57, 0.1);
	backdrop-filter: blur(16px);
}

.bouton__blanc .wp-block-button__link {
	color: var(--bleuAterno);
	font-size: 0.94rem; /* 14px; */
	font-style: normal;
	font-weight: 600;
	line-height: 120%; /* 16.8px */
	text-transform: uppercase;
	background-color: #fff;
	border: 1px solid var(--bleuAterno);
	cursor: pointer;
	padding: 0.94rem 1.6rem; /* 14px 24px */
	border-radius: 56px;
	display: inline-block;
	width: fit-content;
	max-width: 100%;
	text-decoration: none !important;
	text-align: center;
	backdrop-filter: blur(16px);
}
.bouton__blanc .wp-block-button__link:hover {
	background: rgba(3,0,57, 0.1);
}
@media (max-width: 768px) {
	.wp-block-buttons.bouton__blanc .wp-block-button {
		width: 100%;
	}
	.bouton__blanc .wp-block-button__link {
		width: 100%;
	}
}

.btn__blanc_simulateur {
	color: var(--bleuAterno);
	font-size: 0.94rem; /* 14px; */
	font-style: normal;
	font-weight: 600;
	line-height: 120%; /* 16.8px */
	text-transform: uppercase;
	background-color: #fff;
	border: 1px solid #fff;
	cursor: pointer;
	padding: 0.94rem 1.6rem; /* 14px 24px */
	border-radius: 9999px;
	display: inline-block;
	width: fit-content;
	max-width: 100%;
	text-decoration: none !important;
	text-align: center;
}
.btn__blanc_simulateur:hover {
	color: #fff;
	background-color: var(--bleuAterno);
	border: 1px solid var(--bleuAterno);
}
@media (max-width: 768px) {
	.btn__blanc_simulateur {
		width: 100%;
	}
}

.btn__savoirplus .wp-block-button__link {
	padding: 1.267rem 1.34rem; /* 19px 20px; */
	border-radius: 56px;
	border: 1px solid #fff;
	background: rgba(255,255,255,0.01);
	text-transform: uppercase;
	color:#FFF;
	font-size: 0.94rem; /* 14px; */
	font-weight: 600;
	line-height: 120%; /* 16.8px */
	cursor: pointer;
	backdrop-filter: blur(16px);
	text-align: center;
	width: fit-content;
}
.btn__savoirplus .wp-block-button__link:hover {
	background: rgba(255,255,255,0.5);
}
@media (max-width: 768px) {
	.wp-block-buttons.btn__savoirplus .wp-block-button {
		width: 100%;
	}
	.btn__savoirplus .wp-block-button__link {
		width: 100%;
	}
}

.btn__ensavoirplus .wp-block-button__link {
	padding: 1.267rem 1.34rem; /* 19px 20px; */
	width: 180px !important;
	border-radius: 56px;
	border: 1px solid var(--bleuAterno);
	background: rgba(255,255,255,1);
	text-transform: uppercase;
	color:var(--bleuAterno);
	font-size: 0.94rem; /* 14px; */
	font-weight: 600;
	line-height: 120%; /* 16.8px */
	cursor: pointer;
	backdrop-filter: blur(16px);
}
.btn__ensavoirplus .wp-block-button__link:hover {
	color: #fff;
	background: rgba(3,0,57,0.5);
}
@media (max-width: 768px) {
	.wp-block-buttons.btn__ensavoirplus .wp-block-button {
		width: 100%;
	}
	.btn__ensavoirplus .wp-block-button__link {
		width: 100%;
	}
}

.btn__header {
	display: inline-block;
	padding: 1.267rem 1.34rem; /* 19px 20px; */
	width: fit-content;
	max-width: 100%;
	border-radius: 56px;
	border: 1px solid #fff;
	background: rgba(255,255,255,0.01);
	text-transform: uppercase;
	color:#FFF;
	font-size: 0.94rem; /* 14px; */
	font-weight: 600;
	line-height: 120%; /* 16.8px */
	cursor: pointer;
	backdrop-filter: blur(16px);
}
@media (max-width: 768px) {
	.btn__header {
		width: 100%;
	}
}


.btn__decouvrir .wp-block-button__link {
	background: none;
	color: var(--bleuAterno);
	font-size:  0.94rem; /* 14px; */
	font-weight: 600;
	line-height: 140%; /* 19.6px */
	text-transform: uppercase;
	position: relative;
	border: none;
	padding: 0;
	text-decoration: none;
	cursor: pointer;
	backdrop-filter: blur(16px);
}
.btn__decouvrir .wp-block-button__link::after {
    content: ''; 
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: -25px; 
    width: 20px;
    height: 20px;
    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTUuODMzMDEgNS44MzMyNUgxNC4xNjYzVjE0LjE2NjYiIHN0cm9rZT0iIzAzMDAzOSIgc3Ryb2tlLXdpZHRoPSIxLjYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNNS44MzMwMSAxNC4xNjY2TDE0LjE2NjMgNS44MzMyNSIgc3Ryb2tlPSIjMDMwMDM5IiBzdHJva2Utd2lkdGg9IjEuNiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPg==');
    background-size: contain;
    background-repeat: no-repeat;
}
.btn__decouvrir .wp-block-button__link:hover {
	text-decoration: underline;
}

.tag__nouveau .wp-block-button__link {
	display: flex;
	padding: 0.667rem 1.34rem; /* 10px 20px; */
	justify-content: center;
	align-items: center;
	align-self: end;
	gap: 10px;
	color: #000;
	font-size: 0.8rem; /* 12px; */
	font-style: normal;
	font-weight: 700;
	line-height: 110%; /* 13.2px */
	text-transform: uppercase;
	border-radius: 100px;
	background: linear-gradient(70deg, #31C6EB -24.89%, #5DFFCC 19.01%, #FFF600 58.03%, #FFD000 102.91%);
	cursor: unset;
	border: none;
}

.tag__installation .wp-block-button__link {
	display: flex;
	padding: 0.667rem 1.34rem; /* 10px 20px; */
	justify-content: center;
	align-items: center;
	align-self: end;
	gap: 10px;
	color: #000;
	font-size: 0.8rem; /* 12px; */
	font-style: normal;
	font-weight: 700;
	line-height: 110%; /* 13.2px */
	text-transform: uppercase;
	border-radius: 100px;
	background: #fff;
	cursor: unset;
	border: none;
}

.btn__simulation {
	font-size: 0.94rem; /* 14px */
	font-weight: 600;
	border: 1px solid #ffffff;
	color: #ffffff !important;
	padding: 1.34rem 1.6rem; /* 19px 24px */
	border-radius: 56px;
	display: flex;
	align-items: center;
	gap: 0.533rem;
	width: fit-content;
	height: 48px;
	text-decoration: none !important;
	text-transform: uppercase;
	cursor: pointer;
	background: rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(16px);
	margin: 2.14rem 0;
}
.btn__simulation::before {
	content: '';
	display: inline-block;
	width: 32px;
	height: 20px;
	background-image: url('ressources/icone-simulation.png');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}
.btn__simulation:hover {
	background: rgba(255,255,255,0.5);
	backdrop-filter: blur(16px);
}

.btn__simulation.btbleu {
	border: 1px solid var(--bleuAterno);
	color: var(--bleuAterno) !important;
}

.btn__diagnostic .wp-block-button__link {
	font-size: 0.94rem; /* 14px */
	font-weight: 600;
	border: 1px solid var(--bleuAterno);
	color: var(--bleuAterno) !important;
	padding: 1.34rem 1.6rem; /* 19px 24px */
	border-radius: 56px;
	display: flex;
	align-items: center;
	gap: 0.533rem;
	width: fit-content;
	height: 48px;
	text-decoration: none !important;
	text-transform: uppercase;
	cursor: pointer;
	background: rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(16px);
	margin: 1.6rem 0;
}
.btn__diagnostic .wp-block-button__link::before {
	content: '';
	display: inline-block;
	width: 28px;
	height: 20px;
	background-image: url('ressources/icone-simulation.png');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}
.btn__diagnostic.wp-block-button__link :hover {
	background: rgba(255,255,255,0.5);
}
 


.btn__contenu .wp-block-button__link {
	display: inline-block;
	padding: 1.267rem 1.34rem; /* 19px 20px; */
	border-radius: 56px;
	border: 1px solid var(--bleuAterno);
	background: rgba(255,255,255,0.01);
	text-transform: uppercase;
	color: var(--bleuAterno);
	font-size: 0.87rem; /* 13px; */
	font-weight: 600;
	line-height: 120%; /* 16.8px */
	text-align: center;
	backdrop-filter: blur(16px);
	cursor: pointer;
}
.btn__contenu .wp-block-button__link:hover {
	background: rgba(3,0,57, 0.1);
}
@media (max-width: 768px) {
	.wp-block-buttons.btn__contenu .wp-block-button {
		width: 100%;
	}
	.btn__contenu .wp-block-button__link {
		width: 100%;
	}
}


/* -------------------------------- FORMULAIRES ------------- */
.wpcf7 {
	display: flex;
	max-width: 448px;
	width: 100%;
	margin: 0 auto;
}
.wpcf7 fieldset {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 24px;
	align-self: stretch;
	margin-bottom: 44px;
}
form fieldset:last-of-type {
	margin-bottom: 0;
}
.wpcf7 fieldset legend {
	font-size: 1.33rem; /* 20px */
	color: var(--bleuAterno);
	font-weight: 700;
	line-height: 120%; /* 24px */
	text-transform: uppercase;
	margin-bottom: 24px;
}
.wpcf7-form-control {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
}
.wpcf7-form .wpcf7-list-item {
	width: 100%;
	padding: 10px 16px;
	align-items: flex-start;
	border-radius: 8px;
	border: 1px solid rgba(3, 0, 57, 0.10);
	margin: 0;
}
.wpcf7-list-item-label {
	color: var(--bleuAterno);
	font-family: Poppins;
	font-size: 0.94rem; /* 14px */
	font-style: normal;
	font-weight: 400;
	line-height: 140%; /* 19.6px */
	cursor: pointer;
	flex: 1 0 0;
}

.wpcf7-list-item label {
	display: flex;
	align-items: flex-start; /* Aligne le haut de la case et le début du texte */
	gap: 11px; /* Applique l'espacement entre la case et le texte */
}

/* 2. Empêchez la case à cocher de rétrécir */
.wpcf7-list-item input[type="checkbox"] {
	flex-shrink: 0;
	margin-top: 3px; /* Optionnel : Ajustement pour un alignement vertical parfait avec le texte */
}

/* 3. (Optionnel) Nettoyez votre CSS existant pour éviter la redondance */
.wpcf7-form .wpcf7-list-item {
	/* Vous pouvez retirer 'display: flex' et 'gap' de cette règle car ils sont maintenant gérés par le label */
	width: 100%;
	padding: 10px 16px;
	border-radius: 8px;
	border: 1px solid rgba(3, 0, 57, 0.10);
	margin: 0;
}

input[type="submit"] {
	border: none;
	margin-top: 24px;
}

.input__wrapper {
	display: flex;
	gap: 8px;
	align-self: stretch;
}

.label__input__group {
	position: relative;
	flex: 1;
	width: 100%;
}

.label__input__group label {
	position: absolute;
	left: 16px;
	top: -9px;
	background: #FFF;

	color: var(--bleuAterno);
	font-size: 0.8rem; /* 12px;*/
	font-style: normal;
	font-weight: 500;
	line-height: 140%; /* 16.8px */
	z-index: 10;
}
.label__input__group input, .label__input__group textarea {
	padding: 10px 16px;
	border-radius: 8px;
	border: 1px solid var(--bleuAterno);
	background: #FFF;
	color: var(--bleuAterno);
	font-size: 0.94rem; /* 14px; */
	font-weight: 400;
	line-height: 20px; /* 142.857% */
	width: 100%;
}
.label__input__group input::placeholder {
	color: var(--bleuAterno);
	opacity: 0.2;
}

.label__input__group select {
	padding: 10px 16px;
	border-radius: 8px;
	border: 1px solid var(--bleuAterno);
	background: #FFF;
	color: var(--bleuAterno);
	font-size: 0.94rem; /* 14px; */
	font-weight: 400;
	line-height: 20px; /* 142.857% */
	width: 100%;
}

label, input {
	cursor: pointer;
}
.requis {
	font-size: 0.8rem;
}
.wpcf7-validation-errors, span.wpcf7-not-valid-tip {
    color: #d4101c;
    font-size: 0.8rem; /*12px; */
}

.xdsoft_datetimepicker.xdsoft_inline {
	position: relative !important;
}
.xdsoft_datetimepicker {
	z-index:800 !important;
}
.xdsoft_datetimepicker .xdsoft_label {
	z-index:800 !important;
}

.visually-hidden {
	position: absolute;
	border: 0;
	margin: -1px;
	padding: 0;
	clip: rect(0 0 0 0);
	overflow: hidden;
	height: 1px;
	width: 1px;
}

.monogramme {
	background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTkwIiBoZWlnaHQ9IjU5MiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBjbGlwLXBhdGg9InVybCgjYSkiPjxwYXRoIGQ9Im02NjEuMzIyIDcxMC4zNzktNy4xNzgtMTY4LjM1MmMxLjg3MyA0My4xMDEtMTMuMzE2IDg2LjkyOC00NS43NzMgMTIxLjIwMS0zMi40NTggMzQuMzc2LTc2LjE1MSA1Mi42NTUtMTIwLjU3MiA1NC42MjhsLTMyNC45OTEgMTMuOTE3Yy0uMTA0LTIuODA0LS40MTYtNS41MDQtLjQxNi04LjMwOFY0NDIuOTQ4bDI4MC4xNTQtMjgwLjQxM2MyOS40NDEtMjkuNDk1IDcwLjAxMy00Ny41NjYgMTE0Ljg1LTQ3LjU2NiA0NC44MzcgMCA4NC42ODEgMTcuODYzIDExMy45MTMgNDYuNzM2TDU1Ny4yOTIgNDcuNTY2QzUyNy45NTUgMTguMTc1IDQ4Ny4zODMgMCA0NDIuNDQyIDBjLTQ0Ljk0MSAwLTg1LjQwOSAxOC4xNzUtMTE0Ljg1IDQ3LjU2Nkw0Ny42NDYgMzI3Ljk4QzE1LjkxNiAzNTkuNjU1IDAgNDAxLjMwMiAwIDQ0Mi44NDR2MjgwLjUxN2MwIDQxLjU0MiAxNS45MTcgODMuMTg5IDQ3LjY0NiAxMTQuOTY5IDMxLjczIDMxLjc4IDczLjIzNyA0Ny42NyAxMTQuODUgNDcuNjdoMTYyLjQ5NS0uMjA4IDE3MC4yOThjNDQuNDIxLTEuODY5IDg4LjExNC0yMC4wNDQgMTIwLjU3Mi01NC4zMTcgMzIuNDU3LTM0LjI3MyA0Ny41NDItNzguMjA0IDQ1LjY2OS0xMjEuMzA0eiIgZmlsbD0idXJsKCNiKSIvPjxwYXRoIGQ9Im04MzguNDg2IDMyNy4wNDEtMTMyLjQzMS0xMzIuMjFjLTI5LjQ0LTI5LjE4My02OS45MDgtNDcuMjU0LTExNC41MzctNDcuMjU0LTQ0LjYyOSAwLTg1LjQwOSAxOC4xNzUtMTE0Ljg1IDQ3LjQ2MmwyNDYuOTY4IDI0Ni41NTV2MjgyLjE3OWMwIDQxLjQzOC0xNS44MTIgODIuOTgxLTQ3LjY0NSAxMTQuNjU3LTMxLjYyNiAzMS42NzYtNzMuMjM4IDQ3LjQ2My0xMTQuODUgNDcuNDYzaDE2Mi4zOTJjNDEuNTA4IDAgODMuMTItMTUuNzg3IDExNC44NDktNDcuNDYzIDMxLjcyOS0zMS42NzYgNDcuNTQyLTczLjExNSA0Ny41NDItMTE0LjY1N1Y0NDEuNTk0YzAtNDEuNTQyLTE1LjkxNy04Mi45ODEtNDcuNTQyLTExNC42NTdsLjEwNC4xMDR6IiBmaWxsPSJ1cmwoI2MpIi8+PC9nPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iYiIgeDE9Ii00MjUuNzA4IiB5MT0iMTMwMS4zMSIgeDI9IjEyOTguNjkiIHkyPSI4MzAuODQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIj48c3RvcCBvZmZzZXQ9Ii4xNjgiIHN0b3AtY29sb3I9IiMzMUM2RUIiLz48c3RvcCBvZmZzZXQ9Ii4zODUiIHN0b3AtY29sb3I9IiM1REZGQ0MiLz48c3RvcCBvZmZzZXQ9Ii41NzciIHN0b3AtY29sb3I9IiNGRkY2MDAiLz48c3RvcCBvZmZzZXQ9Ii43OTgiIHN0b3AtY29sb3I9IiNGRkQwMDAiLz48L2xpbmVhckdyYWRpZW50PjxsaW5lYXJHcmFkaWVudCBpZD0iYyIgeDE9IjIxNy4xNCIgeTE9IjEyMzEuOTgiIHgyPSIxMzAzLjM4IiB5Mj0iMTAxNS4xNyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiPjxzdG9wIG9mZnNldD0iLjE2OCIgc3RvcC1jb2xvcj0iIzMxQzZFQiIvPjxzdG9wIG9mZnNldD0iLjM4NSIgc3RvcC1jb2xvcj0iIzVERkZDQyIvPjxzdG9wIG9mZnNldD0iLjU3NyIgc3RvcC1jb2xvcj0iI0ZGRjYwMCIvPjxzdG9wIG9mZnNldD0iLjc5OCIgc3RvcC1jb2xvcj0iI0ZGRDAwMCIvPjwvbGluZWFyR3JhZGllbnQ+PGNsaXBQYXRoIGlkPSJhIj48cGF0aCBmaWxsPSIjZmZmIiBkPSJNMCAwaDg4NS45MjV2ODg2SDB6Ii8+PC9jbGlwUGF0aD48L2RlZnM+PC9zdmc+);
	background-position: right bottom;
	background-repeat: no-repeat;
}

.stars {
	display: inline-block;
	margin: 15px 0 10px 0;
}
.star.off, .star.on, .star.half {
	display: inline-block;
	width: 50px;
	height: 50px;
}
.small_star.on, .small_star.off, .small_star.half {
	display: inline-block;
	width: 20px;
	height: 20px;
}
.etoileBleu {
    fill: var(--bleuAterno);
    fill-opacity: 1;
/*  stroke: #ec7316;
    stroke-opacity: 1;
    stroke-width: 1;*/
}
.etoileJaune {
	fill: #FFD000;
    fill-opacity: 1;
}
.etoileGrise {
	fill: #7c651e;
    fill-opacity: 1;
}

.avis_verifies {
	display: flex;
	align-items: center;
	gap: 12px;
}
.avis_verifies__sep {
	width: 0;
	align-self: stretch;
}
.avis_verifies__sep--blanc {
	stroke-width: 1px;
	stroke: #ffffff;
	opacity: 0.5;
}
.avis_verifies__note {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 3px;
}
.avis_verifies__note--txt {
	color: #ffffff;
	text-align: center;
	font-size: 1.07rem;
	font-weight: 500;
	line-height: 120%;
}
.avis_verifies__note--etoile {
	display: flex;
	align-items: center;
	gap: 0.822px;
}
.etoileav {
	width: 18px;
	height: auto;
}
.logoav {
	width: 93px;
	height: auto;
}
.avis_verifies__header__avis {
	display: flex;
	justify-content: center;
	margin-top: 32px;
	flex-direction: column;
}
.avis_verifies__header__avis .avis_verifies {
	justify-content: center;
}
/*.avis_verifies__header__avis .btn__outline {
	display: flex;
	justify-content: center;
}*/
@media (max-width: 768px) {
	.avis_verifies__header__avis {
		justify-content: start;
	}
	.avis_verifies__header__avis .avis_verifies {
		justify-content: start;
	}
	/*.avis_verifies__header__avis .btn__outline {
		display: inline-block;
	}*/
}


.land {
    fill: #f6f6f6;
    fill-opacity: 1;
    stroke: #ec7316;
    stroke-opacity: 1;
    stroke-width: 1;
    cursor: pointer;
}
.land:hover {
    fill: #ec7316;
    transition: fill 0.3s;
}
.is-active {
    fill: #ec7316;
}

.wp-pagenavi {
    clear: both;
    margin: 30px 0;
}
.wp-pagenavi a,
.wp-pagenavi a:link,
.wp-pagenavi a:visited,
.wp-pagenavi a:focus,
.wp-pagenavi a:active,
.wp-pagenavi span {
    display: inline-block;
	color: var(--bleuAterno);
    background-color: #ffffff;
    margin: 0 0.3em 10px;
    padding: 10px 20px;
    text-decoration: none;
	border-radius: 8px;
	border: 1.5px solid rgba(3, 0, 57, 0.20);
	font-size: 1.143rem;
	font-weight: 600;
	line-height: 140%;
}
.wp-pagenavi a.page {
	color: var(--bleuAterno);
    background-color: #ffffff;
	border-radius: 8px;
	border: 1.5px solid rgba(3, 0, 57, 0.20);
}
.wp-pagenavi a.page:hover {
	color: var(--bleuAterno);
    background-color: #ffffff;
	border-radius: 8px;
	border: 1.5px solid var(--bleuAterno);
}
.wp-pagenavi a.previouspostslink, .wp-pagenavi a.nextpostslink {
	color: var(--bleuAterno);
    background-color: #ffffff;
	border-radius: 8px;
	border: 1.5px solid rgba(3, 0, 57, 0.20);
}
.wp-pagenavi a.previouspostslink:hover, .wp-pagenavi a.nextpostslink:hover {
	color: var(--bleuAterno);
    background-color: #ffffff;
	border-radius: 8px;
	border: 1.5px solid var(--bleuAterno);
}

.wp-pagenavi span.pages {
    color: #051F3B;
    background-color: #ffffff;
	border: 1px solid #666666;
}
.wp-pagenavi span.current {
	color: var(--bleuAterno);
    background-color: #ffffff;
	border-radius: 8px;
	border: 1.5px solid var(--bleuAterno);
}

.resume {
	padding: 10px 15px;
	border: 1px solid #ccc;
	border-radius: 8px;
	margin: 20px 0;
}

.summary-container {
	border: 1px solid #ccc;
	border-radius: 8px;
	margin-bottom: 32px;
	overflow: hidden;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.summary-header {
	background-color: #f7f7f7;
	padding: 10px 15px;
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.summary-header p {
	margin: 0;
}
.toggle-button {
	font-size: 16px;
	background: none;
	border: none;
	cursor: pointer;
}
.summary-content {
	display: none;
	padding: 10px 15px;
	background-color: #fff;
}
.summary-content ul {
	margin: 0;
	padding: 0;
}
.summary-content ul li {
	margin-bottom: 5px;
}
.summary-content ul li a {
	text-decoration: none;
	color: var(--bleuAterno);
}
.summary-content ul li a:hover {
	text-decoration: underline;
}

/* ---------------  Bloc Avis Footer --------------- */
.group__avis {
	position: relative;
	overflow: hidden;
}
.group__avis_contenu {
	background-color: var(--bleuAterno);
	height: 1056px;
	min-height: 1056px;
	position: relative; 
	z-index: 1;
	margin-top: 184px;
	width: 100%;
	padding: 1.6rem; /* 24px */
}
.group__avis_contenu::before {
	content: "";
	position: absolute;
	z-index: -1;
	top: -119px;
	left: -636px;
	width: 1320px;
	height: 1322px;
	background-image: url("ressources/monogramme-full.svg");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: left center;
}
@media (max-width: 1380px) {
	.group__avis_contenu::before {
		left: calc(-636px + (100vw - 1380px) * 0.9);
	}
}
@media (max-width: 768px) {
	/* Force table to not be like tables anymore */
	.container1col table, .container1col thead, .container1col tbody, .container1col th, .container1col td, .container1col tr {
		display: block;
	}	
	td {
		position: relative;
		padding-left: 50%;
	}	
	td:before {
		content: attr(data-label);
		position: absolute;
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
	}
	.group__avis_contenu {
		margin-top: 0;
		padding: 4rem 1.34rem; /* 60px 20px */
		height: auto;
		min-height: 778px;
	}
	.group__avis_contenu::before {
		background: none;
		height: auto;
		min-height: 778px;
	}
}
.group__avis_verifies {
	display: flex;
	flex-direction: column;
	width: 710px;
	margin-left: auto;
	margin-right: 9px;
	margin-top: 156px;
	margin-bottom: 53px;
}
.group__avis_cta {
	display: flex;
	flex-direction: row;
	align-items: start;
}
.group__avis_cta :last-child {
	margin-left: auto;
}
@media (max-width: 768px) {
	.group__avis_cta {
		flex-direction: column;
		align-items: start;
	}
	.group__avis_verifies {
		display: flex;
		flex-direction: column;
		width: 100%;
		margin: 0;
	}
	.group__avis_cta :last-child {
		margin-left: 0;
	}
}
.group__avis_verifies h2 {
	color: #fff;
}
/* -------------------- Slider ------------------------ */
.slider-container {
	position: relative;
	width: 100%;
	max-width: 1200px;
	margin: 50px auto;
	/*padding: 20px 10px;*/
	padding: 0;
	/*overflow: hidden;*/
}
.slider {
	display: flex;
	transition: transform 0.5s cubic-bezier(0.445, 0.05, 0.55, 0.95);
	gap: 24px;
}
.slider-viewport {
	width: 100%;
	overflow: hidden;
	padding: 1px;
}
.slider-content {
    display: flex;
	flex: 1;
    flex-direction: column;
	justify-content: start;
	align-items: flex-start;
}
.slider-content p {
	margin: 0;
}
.slider-item {
	border: 1px solid var(--bleuAterno);
	border-radius: 20px 20px 20px 0;
	background: #FFF;
	padding: 1rem; /* 15px */
	max-width: 330px;
	width: 330px;
/*	max-height: 434px;
	height: 434px;	*/
	display: flex;
	flex: 0 0 auto;
	flex-direction: column;
	justify-content: start;
	align-items: flex-start;
	flex-grow: 1;
}

.slider-item h2, .slider-item h3 {
    margin-bottom: 6px;
}
.slider-item h2, .slider-item h2 a, .slider-item h3, .slider-item h3 a, .slider-item h3 span {
    color: var(--bleuAterno);
    text-decoration: none;
    font-size: 1.07rem;
    text-transform: none;
}
.slider-item h2 a:hover, .slider-item h3 a:hover {
    text-decoration: underline;
}
.slider-item img {
	width: 100%;
	height: auto;
	object-fit: cover;
	margin-bottom: 10px;
	border-radius: 8px;
	cursor: pointer;
}
.slider-cta {
	margin-top: auto;
	margin-bottom: 0;
}

/* --------------Slider Avis ------------------------ */
.slider-connexe-container {
	position: relative;
	width: 100%;
	max-width: 1200px;
	margin: 50px auto;
	padding: 0;
}
.slider-connexe-container .slider-item {
	border: 1px solid var(--bleuAterno);
	border-radius: 20px 20px 20px 0;
	background: #FFF;
	padding: 1rem; /* 15px */
	max-width: 330px;
	width: 330px;
/*	max-height: 380x;
	height: 380px;	*/
	display: flex;
	flex: 0 0 auto;
	flex-direction: column;
	justify-content: start;
	align-items: flex-start;
	flex-grow: 1;
}

/* --------------Slider Avis ------------------------ */
.slider-avis-container {
	position: relative;
	width: 100%;
	margin: 0 auto;
	padding: 0;
	/*overflow: hidden;*/
}
.slider-avis-container .slider-item {
	border: none;
	border-radius: 20px 20px 20px 0;
	background: #FFF;
	padding: 2.7rem; /* 40px */
	max-width: 330px;
	width: 330px;
/*	height: 434px;
	max-height: 434px;	*/
	display: flex;
	flex: 0 0 auto;
	flex-direction: column;
	justify-content: start;
	align-items: flex-start;
}
.slider-avis-container .slider-content {
    display: flex;
	flex: 1;
    flex-direction: column;
	justify-content: start;
	align-items: flex-start;
	flex-grow: 1;
}
.slider-avis-container .slider-content p {
	margin: 0;
}
.slider-avis-container .slider-content p.avis-note {
	color: var(--bleuAterno);
	font-size: 0.94rem; /*14px */
	font-weight: 400;
	line-height: 20px; /* 142.857% */
	margin-bottom: 0.467rem; /* 7px */
}
.slider-avis-container .slider-content p.avis-contenu {
	color: var(--bleuAterno);
	font-size: 0.94rem; /* 14px */
	font-weight: 600;
	line-height: 130%; /* 18.2px */
	margin-top: 2.14rem; /* 32px */
	margin-bottom: 2.14rem; /* 32px */
}
.slider-avis-container .slider-content p.avis-nom {
	color: var(--bleuAterno);
	font-size: 0.94rem; /* 14px */
	font-weight: 700;
	line-height: 20px; /* 142.857% */
	display: block;
	margin-top: auto;
	margin-bottom: 0;
}
@media (max-width: 768px) {
	.slider-avis-container .slider-item {
		max-width: 350px;
		width: 100%;
/*/		max-height: 384px;
		height: 384px;	*/
		padding: 2.94rem 3.07rem; /* 44px 46px */
	}
}

/* ------------- Slider Navigation styles -------------------------- */
.slider-navigation {
    position: absolute;
    top: 35%;
	left: 0;
	right: 0;
    transform: translateY(-35%);
    display: flex;
    padding: 0;
    pointer-events: none;
	z-index: 10;
}

.nav-button {
    position: absolute;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    width: 46px;
    height: 46px;
    border-radius: 50%;
	background-color: rgba(242, 242, 242, 1);
    cursor: pointer;
    pointer-events: all;
    transition: background-color 0.3s ease;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50%;
}

#prevButton, #nextButton {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMzAiIHZpZXdCb3g9IjAgMCAzMCAzMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMC44NTc4NjUgMTVIMjkuMTQyMU0yOS4xNDIxIDE1TDE1IDAuODU3OTFNMjkuMTQyMSAxNUwxNSAyOS4xNDIyIiBzdHJva2U9IiMwMzAwMzkiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiB0cmFuc2Zvcm09InJvdGF0ZSgxODAgMTUgMTUpIi8+PC9zdmc+");
}
#nextButton {
	transform: rotate(180deg);
}

.slider-prev {
    left: 12px;
    transform: translateX(-50%);
}

.slider-next {
	right: -12px;
	transform: translateX(50%);
}

.nav-button:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
.slider-navigation-hidden {
    display: none !important;
}

.slider-avis-container .slider-navigation {
    top: 50%;
    transform: translateY(-50%);
}

/* -------------------------------------------------------------- */
/* -------------- SLIDER COLONNES SUR MOBILE -------------------- */
/* -------------------------------------------------------------- */
/* =================================================================== */
/* Carrousel pour mobile sur le bloc .colonnes__slider (Version Corrigée) */
/* =================================================================== */
.wp-block-columns.args .wp-block-column {
	border-radius: 15px;
	background-color: #FBFBFB;
	padding: 2.67rem;
}

.slider-nav {
	display: none;
}
@media (max-width: 989px) {

	/* 1. CONTENEUR DU CARROUSEL
	--------------------------------------------------------------------*/
	/* On force l'affichage en ligne et on empêche le retour à la ligne.
	   L'ajout de !important est crucial pour surcharger la règle de base
	   .wp-block-columns { flex-direction: column; } */
	.wp-block-columns.colonnes__slider {
		flex-direction: row !important;
		flex-wrap: nowrap;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none; /* Pour Firefox */
        gap: var(--fm-gap);
		align-items: stretch;
	}

	/* Masquer la barre de défilement pour Chrome, Safari et Edge */
	.wp-block-columns.colonnes__slider::-webkit-scrollbar {
		display: none;
	}


	/* 2. CHAQUE SLIDE DU CARROUSEL
	--------------------------------------------------------------------*/
	/* Ce sélecteur est plus spécifique que le ".wp-block-columns > .wp-block-column"
	   de votre thème, ce qui lui permet de surcharger les styles d'empilement. */
	.wp-block-columns.colonnes__slider > .wp-block-column {
		/* On annule les styles d'empilement de votre thème */
		flex-basis: 100% !important; /* Largeur d'une slide */
		width: 100% !important;
		margin: 0 !important;   /* Annule touts les marges d'empilement */

		/* Propriétés essentielles pour le carrousel */
		flex-shrink: 0; /* Empêche les slides de rétrécir */
		scroll-snap-align: start; /* Point d'accroche du défilement */
		align-self: auto !important; 
	}

    /* On retire la marge ajoutée par le thème entre les colonnes empilées */
	.wp-block-columns.colonnes__slider > .wp-block-column + .wp-block-column {
		margin-top: 0 !important;
        margin-left: 0 !important; /* La propriété 'gap' gère l'espacement */
	}

	/* 3. NAVIGATION AVEC FLÈCHES
	--------------------------------------------------------------------*/
    /* On s'assure que le conteneur a une position relative */
    .wp-block-group__inner-container {
        position: relative;
    }

    /* Conteneur des boutons */
    .colonnes__slider + .slider-nav {
        display: block; /* On s'assure qu'il est visible */
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 100%;
        left: 0;
        z-index: 10;
        pointer-events: none;
    }

    /* Style commun aux boutons */
    .slider-nav__button {
        position: absolute;
		border: none;
		background-color: rgba(3, 0, 57, 1);
		width: 46px;
		height: 46px;
		border-radius: 50%;
		cursor: pointer;
		pointer-events: all;
		background-repeat: no-repeat;
		background-position: center;
		background-size: 50%;
    }

    /* Bouton Précédent (gauche) */
    .slider-nav__button--prev, .slider-nav__button--next {
		background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMzAiIHZpZXdCb3g9IjAgMCAzMCAzMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyBjbGlwLXBhdGg9InVybCgjY2xpcDBfODI1NF8xNzEwKSI+CiAgICA8cGF0aCBkPSJNMC44NTc4NjUgMTVIMjkuMTQyMU0yOS4xNDIxIDE1TDE1IDAuODU3OTFNMjkuMTQyMSAxNUwxNSAyOS4xNDIyIiBzdHJva2U9IiNGMkYyRjIiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiB0cmFuc2Zvcm09InJvdGF0ZSgxODAgMTUgMTUpIiAvPgogIDwvZz4KICA8ZGVmcz4KICAgIDxjbGlwUGF0aCBpZD0iY2xpcDBfODI1NF8xNzEwIj4KICAgICAgPHJlY3Qgd2lkdGg9IjMwIiBoZWlnaHQ9IjMwIiBmaWxsPSJ3aGl0ZSIvPgogICAgPC9jbGlwUGF0aD4KICA8L2RlZnM+Cjwvc3ZnPg==");
    }
    .slider-nav__button--prev {
        left: -11px;
    }

    /* Bouton Suivant (droite) */
    .slider-nav__button--next {
        right: -11px;
		transform: rotate(180deg);
    }
    
    /* Classe pour cacher les boutons */
	.slider-nav__button:disabled {
		opacity: 0.5;
		cursor: not-allowed;
        pointer-events: none;
    }
}


/* ----------------- PAGES AVIS ---------------------- */

.column__video {
	position: relative;
}
.column__video video {
	border-radius: 20px;
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.40) 0%, rgba(0, 0, 0, 0.40) 100%), #F2F2F2;
}

.btn__play {
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
	font-size: 0.94rem; /* 14px */
	font-weight: 600;
	border: 1px solid #ffffff;
	color: #ffffff !important;
	padding: 1.34rem 1.34rem; /* 19px 20px */
	border-radius: 56px;
	display: flex;
	align-items: center;
	gap: 0.533rem;
	width: fit-content;
	height: 48px;
	text-decoration: none !important;
	text-transform: uppercase;
	cursor: pointer;
	background: rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(16px);
	/*margin: 2.14rem auto;*/
	white-space: nowrap;
}
.btn__play::before {
	content: '';
	display: inline-block;
	width: 18px;
	height: 18px;
	background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTEiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxMSAxNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMC41IDAuMjVMMTEgN0wwLjUgMTMuNzVWMC4yNVoiIGZpbGw9IndoaXRlIi8+PC9zdmc+");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.avis_header_content {
	width: 558px;
    min-width: 320px;
}
.avis_header_content p {
	color: var(--bleuAterno);
	font-size: 1.067rem; /* 16px; */
	font-weight: 400;
	line-height: 140%; /* 22.4px */
}


/*.avis_grille {
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	height: 962px;
	gap: 24px;
}*/
.avis_grille {
    column-width: 260px;
    /* Définit l'espace entre les colonnes */
    column-gap: 24px;
    /* Pour s'assurer que le padding est bien géré */
    width: 100%;
}

.un_avis {
	/* La hauteur sera déterminée par le contenu */
	border-radius: 20px;
	border: 1px solid rgba(3, 0, 57, 0.20);
	background: #FBFBFB;
	padding: 24px;
	break-inside: avoid;
	margin-bottom: 24px;
	min-height: 250px;
	display: flex;
	flex-direction: column;
}

@media (max-width: 480px) {
	.un_avis {
		flex-basis: 100%;
	}
}

.un_avis_content {
    display: flex;
	flex: 1;
    flex-direction: column;
	justify-content: start;
	align-items: flex-start;
}

.un_avis_bloc_note {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	margin-bottom: 20px;
}
.un_avis_etoile {
	display: flex;
	align-items: center;
	gap: 1.25px;
}
.un_avis_note {
	color: var(--bleuAterno);
	font-size: 1rem;
	font-weight: 400;
	line-height: 140%; /* 21px */
}
.un_avis_contenu {
	color: var(--bleuAterno);
	font-size: 1rem;
	font-weight: 400;
	line-height: 140%; /* 21px */
}
.un_avis_nom {
	margin-top: auto;
	margin-bottom: 0;
	color: var(--bleuAterno);
	font-size: 1rem;
	font-weight: 400;
	line-height: 140%; /* 21px */
}


/* ----------------------- PAGES LE MAG -----------------------------*/
.le_mag_container {
    display: flex;
    gap: 2rem;
    margin: 1.6rem auto 2.14rem auto;
	padding: 0 1.6rem 4.8rem 1.6rem; /* 24px 72px 24px */
	border-bottom: 1px solid #F2F2F2;
}
@media (max-width: 768px) {
	.le_mag_container {
		padding: 0 1.34rem; /* 20px */
		flex-direction: column;
	}
}

.section_alaune, .section_derniers_articles  {
	flex: 1;
}
.titre_section {
	color: var(--bleuAterno);
	font-size: 2.14rem; /* 32px; */
	font-weight: 700;
	line-height: 100%; /* 32px */
	text-transform: uppercase;
}

.article_meta {
    display: flex;
    align-items: center;
    margin-bottom: 1.067rem;
	margin-top: 1.067rem;
}
section article img {
	border-radius: 8px;
	max-width: 100%;
}
.article_alaune h3 {
	color: var(--bleuAterno);
	font-size: 1.34rem; /* 20px; */
	font-weight: 700;
	line-height: 120%; /* 24px */
	text-transform: none;
}

.article_category {
	display: inline-flex;
	padding: 0 9px;
	justify-content: center;
	align-items: center;
	gap: 8px;
	border-radius: 10000px;
	border: 1px solid var(--bleuAterno);
	color: var(--bleuAterno);
	font-size: 0.94rem; /* 14px; */
	font-weight: 400;
	line-height: 140%; /* 19.6px */
	text-transform: uppercase;
}
.grille_derniers_articles {
	display: grid;
	grid-template-columns: 1fr 1fr; /* Deux colonnes de taille égale */
	gap: 1.6rem;
}
/*@media (max-width: 768px) {
    .grille_derniers_articles {
        grid-template-columns: 1fr;
    }
}*/

.grille_dernier_article {
	overflow: hidden;
}
.grille_dernier_article img {
	height: auto;
	max-height: 220px;
	max-width: 100%;
	width: auto;
}


.category_header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.067rem;
    width: 100%;
}
.category_header h2 {
	margin: 0;
}

.section_categorie:first-child {
	border-top: none;
	margin-top: 0;
	padding-top: 0;
}
.section_categorie {
	margin-top: 4.8rem;
	padding-top: 2.14rem;
	padding-bottom: 2.14rem;
	border-top: 1px solid #F2F2F2;
}

.section_categorie .slider-container {
	max-width: 100vw;
	margin-top: 0;
}

.section_categorie .slider-container .slider-item {
  border: none;
}

/* Conteneur pour les flèches */
.section_categorie .slider-navigation {
    display: flex;
    gap: 0.87rem;
	
    position: relative;
    top: unset;
	left: unset;
	right: unset;
    transform: none
}
.arrow-btn {
    position: relative;
    top: unset;
    display: flex;
    justify-content: center;
    align-items: center;
}

.content_article {
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
}
@media (max-width: 768px) {
	.content_article {
		max-width: 100%;
	}
}

.grille_articles {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
    gap: 1.6rem;
}

/* ---------------------------  ACCORDEON --------------------------- */
.accordion__group {
	overflow: hidden;
	margin-bottom: 1.34rem;
	margin-top: 2.14rem;
	width: 100%;
}
.accordion__item {
	position: relative;
	background-color: #fff;
	border-bottom: 1px solid rgba(3, 0, 57, 0.10);
}

.titre-niveau-3 {
	margin-top: 4.8rem; /* 72px */
	margin-bottom: 1.733rem; /* 26px */
}
.accordion__header {
	background-color: #fff;
	padding: 2.14rem 0; /* 32px */
	width: 100%;
	text-align: left;
	border: none;
	cursor: pointer;
	display: flex;
	align-items: start;
	justify-content: space-between;
	position: relative;
}
@media (max-width: 768px) {
	.accordion__header {
		padding: 1.6rem 0; /* 24px */
	}
}

.accordion__item.open .accordion__header {
	padding: 2.14rem 0 1.07rem 0;
}
@media (max-width: 768px) {
	.accordion__item.open .accordion__header {
		padding: 1.6rem 0 1.07rem 0;
	}
}
.accordion__header .icon {
	flex-shrink: 0; /* Empêche l'icône de se réduire si le titre est trop long */
	transition: transform 0.3s ease; /* Applique une transition douce à la rotation */
    margin-left: auto; /* Pousse l'icône vers la droite */
}

/* Rotation de l'icône lorsque l'accordéon est ouvert */
.accordion__item.open .accordion__header .icon {
	transform: rotate(180deg);
}
.accordion__header h3 {
	margin: 0;
	padding-right: 10px;
	font-size: 1.2rem; /* 18px */
	font-weight: 700;
	line-height: 140%;
	text-transform: none;
}
.accordion__content {
	margin: 0;
	padding-bottom: 2.14rem;
}
@media (max-width: 768px) {
	.accordion__content {
		padding-bottom: 1.6rem;
	}
}
.accordion__content ul { /* ul */ 
	display: block;
	list-style: inherit;
	padding: 0;
	margin: 0;
}
.accordion__content li {
	margin: 0;
	padding: 0;
	margin-left: 2rem;
	margin-bottom: 1.67rem;
	background: none;
}
.accordion__content li a {
	padding: 0;
    display: inline;
	font-size: 1rem; /* 15px; */
	font-weight: 400;
	line-height: 140%; /* 21px */
	text-transform: none;
}
.accordion__content p {
	color: var(--bleuAterno);
	font-size: 1rem; /* 15px; */
	font-weight: 400;
	line-height: 140%; /* 21px */
	margin: 0;
	padding: 0;
}
.accordion__content p + p {
	margin-top: 1.6rem;
}


/* -------------------------- FAQ ----------------------------------------*/
.accordion__group.faq .accordion__item {
	background-color: #fbfbfb;
	padding: 2.14rem;
}
@media (max-width: 768px) {
	.accordion__group.faq .accordion__item {
		padding: 1.6rem;
	}
}
.accordion__group.faq .accordion__item:first-child {
	border-radius: 20px 20px 0 0;
}
.accordion__group.faq .accordion__item:last-child {
	border-radius: 0 0 20px 20px;
	border: none;
}
.accordion__group.faq .accordion__header {
	background-color: #fbfbfb;
	padding: 0;
}
.accordion__group.faq .accordion__item.open .accordion__header {
	padding: 0 0 1.07rem 0 /* 16px */
}

.accordion__group.faq .accordion__content {
	padding-bottom: 0;
}


.content_header {
	padding: 4.8rem clamp(20px, calc(1.25rem + 34.23vw - 117.5px), 378px);
	text-align: center;
}
.content_header:nth-child(2) {
	padding-bottom: 2.67rem;
	text-align: center;
}

.thematiques {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 2.14rem 0;
}
.thematiques ul { /* ul */ 
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 24px;
	align-self: stretch;
	justify-content: flex-start;
	list-style: none;
	padding: 0;
	margin: 0;
}
.thematiques li {
	margin: 0;
	background-color: #f2f2f2;
	border-radius: 20px;
	width: clamp(350px, 28.33vw, 390px);
	/*flex-grow: 1;*/ /* Permet au bloc de grandir pour remplir l'espace restant */
}
.thematiques li a {
	padding: 1.34rem; /* 20px */
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    text-decoration: none;
	color: var(--bleuAterno);
	font-size: 1.067rem; /* 16px; */
	font-weight: 700;
	line-height: 110%; /* 17.6px */
	text-transform: uppercase;
}
.icone-faq {
	display: inline-flex;
	padding: 7px;
	align-items: center;
	gap: 7px;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiMwMzAwMzkiIHN0cm9rZT0iI2ZmZmZmZiIgc3Ryb2tlLXdpZHRoPSIwLjkzIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwYXRoIGQ9Ik0wLjQgN0gxMy42TTEzLjYgN0w3IDAuNE0xMy42IDdMNyAxMy42Ii8+PC9zdmc+");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 14px 14px;
	border-radius: 50%;
	background-color: var(--bleuAterno);
	width: 28px;
	height: 28px;
}
video {
	max-width: 100%;
}
@media (max-width: 768px) {
	video {
		width: 100%;
	}
	.content_header {
		padding: 3.733rem 0; /* 1.34rem; */
		text-align: left;
	}
	.content_header:nth-child(2) {
		padding-bottom: 2.14rem; /* 32px */
		text-align: left;
	}
	.titre-niveau-3 {
		margin-top: 3.733rem; /* 56px */
	}
	.thematiques ul { /* ul */ 
		flex-direction: column;
		gap: 20px;
	}
	.thematiques li {
		width: 100%;
	}
}


/* ----------------  PAGES AGENCES ------------------------------------------- */
.liste_agences {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 0;
}
.liste_agences ul { /* ul */ 
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 24px;
	align-self: stretch;
	justify-content: flex-start;
	list-style: none;
	padding: 0;
	margin: 0;
}
.liste_agences li {
	display: flex;
	width: 330px;
	height: 160px;
	padding: 24px;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
	border-radius: 20px;
	background: #F2F2F2;
	margin: 0;
	/*flex-grow: 1;*/ /* Permet au bloc de grandir pour remplir l'espace restant */
}
@media (max-width: 768px) {
	.liste_agences li {
		width: 100%;
	}
}
.liste_agences li a {
	text-decoration: none;
}

.agences_content {
    position: relative; /* Pas absolute, pour rester dans le flux normal centré par Flexbox */
    z-index: 3; /* Se place au-dessus de l'overlay */
    color: var(--bleuAterno);
    max-width: 1200px; /* Limite la largeur du texte pour une meilleure lisibilité */
    padding-top: 91px;
	padding-bottom: 91px;
/*    padding-left: clamp(20px, 5vw, 378px);
    padding-right: clamp(20px, 5vw, 378px);*/
	margin: 0 auto;
}

/* -- Colonne de gauche : Informations -- */
.contact-info {
	padding-inline: 20%;
}
@media (max-width: 1024px) {
	.contact-info {
		padding-inline: 0;
	}
}
.info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.6rem 0;
    margin-bottom: 2.5rem;
	align-items: start;
}

.info-block {
    /* Ce conteneur n'a plus besoin de logique d'alignement complexe. */
    /* On peut juste lui donner un peu d'espace en bas si besoin. */
}
.info-block p {
	margin: 0;
}
.info-block a {
	text-decoration: none;
	color: var(--bleuAterno);
}

/* Style de base pour tous les titres avec icônes */
.info-title {
    font-size: 1.07rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--bleuAterno);
    margin: 0 0 0.93rem 0;
    background-repeat: no-repeat;
    background-position: left center; /* Positionne l'icône à gauche, centrée verticalement */
    background-size: 24px;
    padding-left: 30px;
    min-height: 24px;
    display: flex;
    align-items: center;
}

/* Assignation de chaque icône à sa classe */
.icon-address {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230A1943' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'%3e%3c/path%3e%3ccircle cx='12' cy='10' r='3'%3e%3c/circle%3e%3c/svg%3e");
}
.icon-clock {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230A1943' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3ccircle cx='12' cy='12' r='10'%3e%3c/circle%3e%3cpolyline points='12 6 12 12 16 14'%3e%3c/polyline%3e%3c/svg%3e");
}
.icon-phone {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230A1943' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z'%3e%3c/path%3e%3c/svg%3e");
}

.agence__socials ul {
	display: flex;
	gap: 0.67rem;
	padding: 0;
	margin: 0;
	list-style: none;
	flex-wrap: wrap;
}

.agence__socials li {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background-color: white;
	position: relative;
	margin-left: 0;
	margin-bottom: 0;
}

.agence__socials li a {
	position: relative;
	display: block;
	width: 50px;
	height: 50px;
	text-align: center;
	text-decoration: none;
}

.agence__socials li::before {
	content: '';
	position: absolute;
	inset: 0;
	background-size: 100%;
	background-position: center;
	background-repeat: no-repeat;
}

.agence__socials .icon-facebook::before {
	background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIHZpZXdCb3g9IjAgMCA1MCA1MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjUwIiBoZWlnaHQ9IjUwIiByeD0iMjUiIGZpbGw9IiMwMzAwMzkiLz4KPHBhdGggZD0iTTI3IDI2LjVIMjkuNUwzMC41IDIyLjVIMjdWMjAuNUMyNyAxOS40NyAyNyAxOC41IDI5IDE4LjVIMzAuNVYxNS4xNEMzMC4xNzQgMTUuMDk3IDI4Ljk0MyAxNSAyNy42NDMgMTVDMjQuOTI4IDE1IDIzIDE2LjY1NyAyMyAxOS43VjIyLjVIMjBWMjYuNUgyM1YzNUgyN1YyNi41WiIgZmlsbD0id2hpdGUiLz4KPC9zdmc+");
}
.agence__socials .icon-instagram::before {
	background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIHZpZXdCb3g9IjAgMCA1MCA1MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjUwIiBoZWlnaHQ9IjUwIiByeD0iMjUiIGZpbGw9IiMwMzAwMzkiLz4KPHBhdGggZD0iTTIwLjggMTVIMjkuMkMzMi40IDE1IDM1IDE3LjYgMzUgMjAuOFYyOS4yQzM1IDMwLjczODMgMzQuMzg4OSAzMi4yMTM1IDMzLjMwMTIgMzMuMzAxMkMzMi4yMTM1IDM0LjM4ODkgMzAuNzM4MyAzNSAyOS4yIDM1SDIwLjhDMTcuNiAzNSAxNSAzMi40IDE1IDI5LjJWMjAuOEMxNSAxOS4yNjE3IDE1LjYxMTEgMTcuNzg2NSAxNi42OTg4IDE2LjY5ODhDMTcuNzg2NSAxNS42MTExIDE5LjI2MTcgMTUgMjAuOCAxNVpNMjAuNiAxN0MxOS42NDUyIDE3IDE4LjcyOTUgMTcuMzc5MyAxOC4wNTQ0IDE4LjA1NDRDMTcuMzc5MyAxOC43Mjk1IDE3IDE5LjY0NTIgMTcgMjAuNlYyOS40QzE3IDMxLjM5IDE4LjYxIDMzIDIwLjYgMzNIMjkuNEMzMC4zNTQ4IDMzIDMxLjI3MDUgMzIuNjIwNyAzMS45NDU2IDMxLjk0NTZDMzIuNjIwNyAzMS4yNzA1IDMzIDMwLjM1NDggMzMgMjkuNFYyMC42QzMzIDE4LjYxIDMxLjM5IDE3IDI5LjQgMTdIMjAuNlpNMzAuMjUgMTguNUMzMC41ODE1IDE4LjUgMzAuODk5NSAxOC42MzE3IDMxLjEzMzkgMTguODY2MUMzMS4zNjgzIDE5LjEwMDUgMzEuNSAxOS40MTg1IDMxLjUgMTkuNzVDMzEuNSAyMC4wODE1IDMxLjM2ODMgMjAuMzk5NSAzMS4xMzM5IDIwLjYzMzlDMzAuODk5NSAyMC44NjgzIDMwLjU4MTUgMjEgMzAuMjUgMjFDMjkuOTE4NSAyMSAyOS42MDA1IDIwLjg2ODMgMjkuMzY2MSAyMC42MzM5QzI5LjEzMTcgMjAuMzk5NSAyOSAyMC4wODE1IDI5IDE5Ljc1QzI5IDE5LjQxODUgMjkuMTMxNyAxOS4xMDA1IDI5LjM2NjEgMTguODY2MUMyOS42MDA1IDE4LjYzMTcgMjkuOTE4NSAxOC41IDMwLjI1IDE4LjVaTTI1IDIwQzI2LjMyNjEgMjAgMjcuNTk3OSAyMC41MjY4IDI4LjUzNTUgMjEuNDY0NUMyOS40NzMyIDIyLjQwMjEgMzAgMjMuNjczOSAzMCAyNUMzMCAyNi4zMjYxIDI5LjQ3MzIgMjcuNTk3OSAyOC41MzU1IDI4LjUzNTVDMjcuNTk3OSAyOS40NzMyIDI2LjMyNjEgMzAgMjUgMzBDMjMuNjczOSAzMCAyMi40MDIxIDI5LjQ3MzIgMjEuNDY0NSAyOC41MzU1QzIwLjUyNjggMjcuNTk3OSAyMCAyNi4zMjYxIDIwIDI1QzIwIDIzLjY3MzkgMjAuNTI2OCAyMi40MDIxIDIxLjQ2NDUgMjEuNDY0NUMyMi40MDIxIDIwLjUyNjggMjMuNjczOSAyMCAyNSAyMFpNMjUgMjJDMjQuMjA0NCAyMiAyMy40NDEzIDIyLjMxNjEgMjIuODc4NyAyMi44Nzg3QzIyLjMxNjEgMjMuNDQxMyAyMiAyNC4yMDQ0IDIyIDI1QzIyIDI1Ljc5NTYgMjIuMzE2MSAyNi41NTg3IDIyLjg3ODcgMjcuMTIxM0MyMy40NDEzIDI3LjY4MzkgMjQuMjA0NCAyOCAyNSAyOEMyNS43OTU2IDI4IDI2LjU1ODcgMjcuNjgzOSAyNy4xMjEzIDI3LjEyMTNDMjcuNjgzOSAyNi41NTg3IDI4IDI1Ljc5NTYgMjggMjVDMjggMjQuMjA0NCAyNy42ODM5IDIzLjQ0MTMgMjcuMTIxMyAyMi44Nzg3QzI2LjU1ODcgMjIuMzE2MSAyNS43OTU2IDIyIDI1IDIyWiIgZmlsbD0id2hpdGUiLz4KPC9zdmc+");
}

/* -- Carte Agent -- */
.agent-card {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    background-color: #f2f2f2;
    border-radius: 80px; /* Bords très arrondis */
    padding: 0.8rem;
    margin-bottom: 2.14rem;
}

.agent-card img {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
}

.agent-name {
    font-weight: 700;
    font-size: 1.07rem;
    color: var(--bleuAterno);
    margin: 0 0 0.25rem 0;
}

.agent-role {
    margin: 0;
    color: var(--bleuAterno);
}

/* -- Boutons d'action -- */
.action-buttons {
    display: flex;
    gap: 0.67rem;
	justify-content: space-between;
}
@media (max-width: 768px) {
	.action-buttons {
		flex-direction: column;
	}
}
.btn__decouvrir__agence {
	background: none;
	color: var(--bleuAterno);
	font-size:  0.94rem; /* 14px; */
	font-weight: 600;
	line-height: 140%; /* 19.6px */
	text-transform: uppercase;
	position: relative;
	border: none;
	padding: 0;
	text-decoration: none;
}

.btn__decouvrir__agence::after {
    content: ''; 
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: -25px; 
    width: 20px;
    height: 20px;
    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTUuODMzMDEgNS44MzMyNUgxNC4xNjYzVjE0LjE2NjYiIHN0cm9rZT0iIzAzMDAzOSIgc3Ryb2tlLXdpZHRoPSIxLjYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNNS44MzMwMSAxNC4xNjY2TDE0LjE2NjMgNS44MzMyNSIgc3Ryb2tlPSIjMDMwMDM5IiBzdHJva2Utd2lkdGg9IjEuNiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPg==');
    background-size: contain;
    background-repeat: no-repeat;
}
.btn__decouvrir__agence:hover {
	text-decoration: underline;
}

/* ------------------------------ FOOTER -------------------------------- */
.footer__top {
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
	justify-content: space-between;
}

.footer__column {
	flex: 1 1 200px;
	min-width: 180px;
	align-items: flex-start; /* empêche l’étirement des enfants */
}
.footer__column--tel {
	display: inline-flex;
	align-items: center;
	margin: 1.43rem 0;
}
.footer__column--tel .icon-tel {
	padding-right: 0.714rem;
	display: inline-flex;
	align-items: center;
}
.footer__column--title {
	font-size: 1rem;
	margin-bottom: 1.2rem;
	margin-top: 0;
	opacity: 0.5;
	font-weight: 700;
	display: block;
}

.footer__column ul, .footer__column li {
  list-style: none;
  padding: 0;
  margin: 0;
}
.footer__column li {
	margin-bottom: 0.5rem;
}

.footer__column a {
	color: #ffffff;
	text-decoration: none;
	font-size: 1rem;
	line-height: 140%; /* 21px */
	font-weight: 400;
}

.footer__column a:hover {
	color: #ffffff;
	text-decoration: underline;
}

.footer__socials {
	display: flex;
	gap: 1rem;
}

.footer__bottom {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	padding-top: 1.5rem;
	margin-top: 15rem;
	font-size: 1rem;
	font-weight: 500;
}
.footer__bottom__form {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	padding-top: 0;
	margin-top: 0;
	font-size: 1rem;
	font-weight: 500;
}
.footer__right {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 1.5rem;
	margin-left: auto;
	opacity: 0.5;
}
.footer__right span {
	font-size: 1rem;
	font-weight: 500;
}
.footer__bottom__form .footer__right {
	margin-right: auto;
	margin-top: 2.14rem;
}
.footer__links ul {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 1.6rem; /* 24px */
	padding: 0;
	margin: 0;
}
.footer__links li {
	padding: 0;
	margin: 0;
}
.footer__links a, .footer__links a:visited, .footer__links a:focus, .footer__links a:active {
	color: #ffffff;
	text-decoration: none;
}
.footer__links a:hover {
	color: #ffffff;
	text-decoration: underline;
}

.footer__bottom__form p.info-legal {
	width: 100%;
	color: #ffffff;
	font-size: 0.87rem; /* 13px */
	font-style: normal;
	font-weight: 400;
	line-height: 140%;
	margin: 0;
	opacity: 0.5;
	text-align: center;
}
.footer__bottom__form p.info-legal a, .footer__bottom__form p.info-legal a:visited, .footer__bottom__form p.info-legal a:focus, .footer__bottom__form p.info-legal a:active {
	text-decoration: underline;
	color: inherit;
}
@media (max-width: 768px) {
	.footer__bottom__form p.info-legal {
		text-align: left;
	}
}

/* === Social links avec icônes CSS === */
.footer__socials ul {
	display: flex;
	gap: 0.533rem;
	padding: 0;
	margin: 0;
	list-style: none;
	flex-wrap: wrap;
}

.footer__socials li {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background-color: white;
	position: relative;
}

.footer__socials li a {
	position: relative;
	display: block;
	width: 50px;
	height: 50px;
	text-align: center;
	text-decoration: none;
}

/* Icônes via pseudo-éléments sur le LI selon la classe */
.footer__socials li::before {
	content: '';
	position: absolute;
	inset: 0;
	background-size: 50% auto;
	background-position: center;
	background-repeat: no-repeat;
}

/* Icônes spécifiques */
.footer__socials .icon-facebook::before {
	background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTE0IDEzLjVoMi41bDEtNEgxNHYtMmMwLTEuMDMgMC0yIDItMmgxLjVWMi4xNGMtLjMyNi0uMDQzLTEuNTU3LS4xNC0yLjg1Ny0uMTRDMTEuOTI4IDIgMTAgMy42NTcgMTAgNi43djIuOEg3djRoM1YyMmg0di04LjV6IiBmaWxsPSIjMDMwMDM5Ii8+PC9zdmc+");
}

.footer__socials .icon-instagram::before {
	background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcuOCAyaDguNEMxOS40IDIgMjIgNC42IDIyIDcuOHY4LjRhNS44IDUuOCAwIDAgMS01LjggNS44SDcuOEM0LjYgMjIgMiAxOS40IDIgMTYuMlY3LjhBNS44IDUuOCAwIDAgMSA3LjggMnptLS4yIDJBMy42IDMuNiAwIDAgMCA0IDcuNnY4LjhDNCAxOC4zOSA1LjYxIDIwIDcuNiAyMGg4LjhhMy42IDMuNiAwIDAgMCAzLjYtMy42VjcuNkMyMCA1LjYxIDE4LjM5IDQgMTYuNCA0SDcuNnptOS42NSAxLjVhMS4yNSAxLjI1IDAgMSAxIDAgMi41IDEuMjUgMS4yNSAwIDAgMSAwLTIuNXpNMTIgN2E1IDUgMCAxIDEgMCAxMCA1IDUgMCAwIDEgMC0xMHptMCAyYTMgMyAwIDEgMCAwIDYgMyAzIDAgMCAwIDAtNnoiIGZpbGw9IiMwMzAwMzkiLz48L3N2Zz4=");
}

.footer__socials .icon-youtube::before {
	background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0ibTEwIDE1IDUuMTktM0wxMCA5djZ6bTExLjU2LTcuODNjLjEzLjQ3LjIyIDEuMS4yOCAxLjkuMDcuOC4xIDEuNDkuMSAyLjA5TDIyIDEyYzAgMi4xOS0uMTYgMy44LS40NCA0LjgzLS4yNS45LS44MyAxLjQ4LTEuNzMgMS43My0uNDcuMTMtMS4zMy4yMi0yLjY1LjI4LTEuMy4wNy0yLjQ5LjEtMy41OS4xTDEyIDE5Yy00LjE5IDAtNi44LS4xNi03LjgzLS40NC0uOS0uMjUtMS40OC0uODMtMS43My0xLjczLS4xMy0uNDctLjIyLTEuMS0uMjgtMS45LS4wNy0uOC0uMS0xLjQ5LS4xLTIuMDlMMiAxMmMwLTIuMTkuMTYtMy44LjQ0LTQuODMuMjUtLjkuODMtMS40OCAxLjczLTEuNzMuNDctLjEzIDEuMzMtLjIyIDIuNjUtLjI4IDEuMy0uMDcgMi40OS0uMSAzLjU5LS4xTDEyIDVjNC4xOSAwIDYuOC4xNiA3LjgzLjQ0LjkuMjUgMS40OC44MyAxLjczIDEuNzN6IiBmaWxsPSIjMDMwMDM5Ii8+PC9zdmc+");
}

.footer__socials .icon-linkedin::before {
	background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTYuOTQgNWEyIDIgMCAxIDEtNC0uMDAyIDIgMiAwIDAgMSA0IC4wMDJ6TTcgOC40OEgzVjIxaDRWOC40OHptNi4zMiAwSDkuMzRWMjFoMy45NHYtNi41N2MwLTMuNjYgNC43Ny00IDQuNzcgMFYyMUgyMnYtNy45M2MwLTYuMTctNy4wNi01Ljk0LTguNzItMi45MWwuMDQtMS42OHoiIGZpbGw9IiMwMzAwMzkiLz48L3N2Zz4=");
}



.mobile, .novisible {
  visibility: hidden;
  position: absolute;
  left: -9999px;
}


/* ==========================================================================
   Styles pour le sous-menu déroulant (Desktop)
   ========================================================================== */

/* Conteneur principal pour le sous-menu déroulant */
.submenu-dropdown-container {
	position: fixed;
	/* Positionné sous le header (88px) et la barre d'onglets (50px) */
	top: 88px;
	left: 0;
	right: 0;
	background-color: var(--bleuAterno);
	z-index: 2000; /* Au-dessus du contenu, mais sous le header */
	padding: 4.625rem 1.6rem 1.5rem 1.6rem;
	/* Bords inférieurs arrondis comme demandé */
	border-bottom-left-radius: 24px;
	border-bottom-right-radius: 24px;
	/* Démarrage hors de l'écran et transition douce */
	transform: translateX(-100%);
	transition: transform 0.4s cubic-bezier(0.2, 1, 0.5, 1);
	visibility: hidden;
	/* S'assure que le menu ne dépasse pas de la hauteur visible de l'écran */
	max-height: calc(100vh - 138px);
	overflow-y: auto; /* Permet le défilement si le sous-menu est très long */
	width: 354px;
}

/* Classe ajoutée via JavaScript pour afficher le conteneur */
.submenu-dropdown-container.is-open {
    transform: translateX(0);
    visibility: visible;
}

/* Styles pour la liste et les liens dans le sous-menu */
.submenu-dropdown-container .sub-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.submenu-dropdown-container .sub-menu li {
    margin: 0;
}

.submenu-dropdown-container .sub-menu a {
    display: block;
    padding: 1rem 0;
    color: #ffffff;
    text-decoration: none;
    font-weight: 600;
	font-size: 1.143rem;
}

.submenu-dropdown-container .sub-menu a:hover,
.submenu-dropdown-container .sub-menu a:focus-visible {
    text-decoration: underline;
}

/* Fond qui sert à la fois de déclencheur de fermeture et pour l'effet visuel */
.menu-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 350; /* Doit être juste en dessous du conteneur du sous-menu */
    display: none; /* Masqué par défaut */
}

/* Affiche le fond lorsque le menu est actif */
.menu-backdrop.is-active {
    display: block;
}

/* Effet de flou appliqué via JavaScript sur le contenu principal et le footer */
main.is-blurred,
footer.is-blurred {
    filter: blur(5px);
    transition: filter 0.4s ease;
}


/* ==========================================================================
   Style pour l'élément visuel dans le sous-menu
   ========================================================================== */

/* On cible l'élément de menu qui a notre classe personnalisée CH */
.submenu-dropdown-container .submenu-simul-ch {
    margin-top: 30px !important;
}

/* Image pour le lien du simulateur de chauffage */
.submenu-dropdown-container .submenu-simul-ch a {
	border-radius: 20px;
    display: block;
    width: 100%;
    min-height: 367px;
    background-image: url('ressources/simulateur-economies-de-chauffage.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 0;
}

/* on masque l'ancre de lien */
.submenu-dropdown-container .submenu-simul-ch a {
    font-size: 0; /* Masque le texte pour la plupart des navigateurs */
    text-indent: -9999px; /* Déplace le texte hors de l'écran */
    overflow: hidden;
    color: transparent; /* Assure que le texte n'est pas visible */
}


/* On cible l'élément de menu qui a notre classe personnalisée SOL */
.submenu-dropdown-container .submenu-simul-sol {
    margin-top: 30px !important;
}

/* Image pour le lien du simulateur solaire */
.submenu-dropdown-container .submenu-simul-sol a {
	border-radius: 20px;
    display: block;
    width: 100%;
    min-height: 302px;
    background-image: url('ressources/simulateur-solaire.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 0;
}

/* on masque l'ancre de lien */
.submenu-dropdown-container .submenu-simul-sol a {
    font-size: 0; /* Masque le texte pour la plupart des navigateurs */
    text-indent: -9999px; /* Déplace le texte hors de l'écran */
    overflow: hidden;
    color: transparent; /* Assure que le texte n'est pas visible */
}

/* Cache le bouton "Retour" spécifiquement dans le menu déroulant du bureau */
.submenu-dropdown-container .submenu-header {
	display: none;
}
/* Nouveau style pour l'en-tête du sous-menu (qui contiendra le bouton retour) */
.submenu-header {
	list-style: none; /* Enlève la puce du <li> */
	padding: 0.8rem 0;
	margin-bottom: 1rem;
	border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.submenu-back-button {
	background: none;
	border: none;
	padding: 0;
	color: #fff;
	font-size: 1.143rem;
	font-weight: 600;
	cursor: pointer;
	display: flex;
	align-items: center;
	opacity: 0.7;
	transition: opacity 0.2s;
}
.submenu-back-button:hover {
	opacity: 1;
}
.submenu-back-button::before {
	content: '';
	display: inline-block;
	width: 0.6em;
	height: 0.6em;
	border-top: 2px solid #fff;
	border-left: 2px solid #fff;
	transform: rotate(-45deg);
	margin-right: 0.8rem;
}

@media (max-width: 1142px) {
	.hero__form .wp-block-column .wp-block-cover {
		min-height: 496px;
		padding: 0;
	}
	.input__wrapper {
		flex-direction: column;
		gap: 24px;
		flex-wrap: wrap;
	}
	footer {
		padding-bottom: 12rem;
	}
	.footer__column--title {
		font-size: 1.2rem;
	}
	.footer__column a {
		font-size: 1.2rem;
		font-weight: 500;
	}
	.footer__right {
		margin-left: 0;
	}
	.footer__right span {
		font-size: 1.066rem;
	}
	.mobile {
		visibility: visible;
		position: static;
		left: auto;
	}
    .slider-item {
		width: auto;
    }
	
	.navbar-header {
		padding: 0 0 0 1.34rem;
	}
	.navbar-header img {
		width: 100%;
		max-width: 100%;
		height: auto;
	}
    .navbar-toggle {
        display: flex;
		z-index: 1950;
		margin-right: 1.34rem;
    }
	/* Fait en sorte que le body ne scrolle pas quand le menu est ouvert */
	body.menu-mobile-ouvert {
		overflow: hidden;
	}

	/* 
	   CORRECTION 1 : Cacher tout ce qui dépasse horizontalement
	   C'est la correction la plus importante pour supprimer la barre de scroll.
	*/
	.navbar-collapse {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh; /* Fallback pour les anciens navigateurs */
		height: 100dvh; /* Unité moderne qui s'adapte à l'interface du navigateur mobile */
		background-color: var(--bleuAterno);
		
		display: flex; /* S'assure qu'il est bien en flex */
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;

		/* Padding général pour l'overlay */
		padding: 88px 0 0 0; /* On ne met plus de padding horizontal ici */
		
		transform: translateX(-100%);
		transition: transform 0.4s cubic-bezier(0.2, 1, 0.5, 1);
		visibility: hidden;
		z-index: 1900;

		/* Correction clé : Cache tout ce qui est poussé en dehors du menu sur l'axe X */
		overflow-x: hidden;
	}

	.navbar-collapse.active {
		transform: translateX(0);
		visibility: visible;
	}

	/*
	   CORRECTION 2 : Le conteneur des menus doit occuper l'espace disponible
	   et servir de "scène" pour les transitions.
	*/
	.navbar-collapse .navbar-nav {
		flex-direction: column;
		width: 100%;
		align-items: flex-start;
		
		position: relative;
		flex-grow: 1;
		
		/* Correction clé : on spécifie le comportement pour chaque axe */
		overflow-y: auto;      /* Permet le scroll vertical si la liste est longue */
		overflow-x: hidden;    /* Interdit le scroll horizontal, ce qui supprime la barre */

		padding: 0 1.6rem;
	}

	/*
	   CORRECTION 3 : Le sous-menu est une nouvelle "vue" par-dessus la précédente.
	*/
	.navbar-collapse .sub-menu {
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		
		padding: 0 1.6rem; /* Le padding est hérité de son conteneur .navbar-nav */
		margin: 0;
		list-style: none;
		
		background-color: var(--bleuAterno); /* Le fond masque le menu précédent */
		transform: translateX(100%); /* Caché sur la droite par défaut */
		transition: transform 0.3s ease-in-out;
		
		z-index: 10; /* Assure qu'il passe PAR-DESSUS le menu parent */
		overflow-y: auto; /* Permet au sous-menu de scroller si son contenu est long */
	}
	
	/* Affiche le sous-menu en le faisant glisser en place */
	.navbar-collapse .menu-item-has-children.submenu-open > .sub-menu {
		transform: translateX(0);
	}
	
	/* Styles pour les liens du menu mobile */
	.navbar-collapse .navbar-nav a {
		font-weight: 600;
		font-size: 1.143rem;
		padding: 0.8rem 0;
		display: block;
		width: 100%;
	}

	.navbar-collapse .menu-item-has-children > a {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	/*.navbar-collapse .menu-item-has-children > a::after {
		content: '';
		display: inline-block;
		width: 0.6em;
		height: 0.6em;
		border-top: 2px solid #fff;
		border-right: 2px solid #fff;
		transform: rotate(45deg);
		margin-right: 1rem;
	}*/

	/*
	   CORRECTION 4 : Le bloc CTA reste en bas et n'est pas couvert.
	   Il n'est PAS dans la zone de scroll de .navbar-nav
	*/
	.navbar-collapse .navbar-cta {
		display: flex;
		flex-direction: column;
		gap: 1.5rem;
		width: 100%;
		padding: 2rem 1.6rem; /* Padding pour l'espacement */
		margin-top: auto; /* Force à se coller en bas si flex-grow est utilisé plus haut */
		/*border-top: 1px solid rgba(255, 255, 255, 0.15);*/
		background-color: var(--bleuAterno); /* Assure un fond solide */
	}

	.navbar-collapse .btn__cta, .navbar-collapse .btn__outline {
		width: 100%;
		text-align: center;
		font-size: 1.066rem;
	}
	
	
	.navbar-tabbar {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		top: unset;
		height: 72px;
		background-color: var(--bleuAterno);
		z-index: 1001;
		border-top: 1px solid rgba(255, 255, 255, 0.15);
	}

	.tabbar-nav {
		justify-content: space-around;
		padding: 0;
		height: 72px;
		border: none;
	}

	.tabbar-nav .menu-item {
		flex-direction: column;
		justify-content: center;
		align-items: center;
		flex: 1;
		height: 100%;
		border-right: none;
		gap: 0;
	}

	.tabbar-nav .first-item {
		border-right: none;
		cursor: pointer;
	}

	.tabbar-nav .menu-item a {
		font-size: 0.8rem;
		text-align: center;
		padding: 0;
		line-height: 1.2;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 2px;
		opacity: 0.5;
		width: 100%;
		height: auto;
	}

	/* ICÔNES POUR MOBILE */
	/* Pseudo-élément pour afficher les icônes au-dessus du texte */
	.tabbar-nav .menu-item a::before {
		content: '';
		display: block;
		width: 24px;
		height: 24px;
		background-size: contain;
		background-repeat: no-repeat;
		background-position: center;
		margin-bottom: 2px;
	}

	.tabbar-nav .menu-item form {
		display: none;
	}

	/* 2. Style du formulaire lorsqu'il devient visible grâce à la classe .search-form--active */
	.tabbar-nav .menu-item form.search-form--active {
		display: flex;
		position: fixed;
		bottom: 72px;
		left: 0;
		width: 100%;
		background: none;
		z-index: 1002;
		height: 50px;
		opacity: 1 !important;
	}
	.tabbar-nav .menu-item form.search-form--active .search-wrapper {
		background-color: var(--bleuAterno);
	}
	.tabbar-nav .menu-item form.search-form--active .search-wrapper input {
		padding: 0.5rem 0.5rem 0.5rem 3.57rem;
	}
	.tabbar-nav .menu-item form.search-form--active .search-wrapper button {
		padding: 0 1rem 0 1.64rem;
	}
				
	.tabbar-nav .menu-item-search::before {
		content: '';
		display: block;
		width: 24px;
		height: 24px;
		background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjUiIGhlaWdodD0iMjUiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0ibTIxLjc1IDIxLjUtNC4zNC00LjM0TTExLjc1IDE5LjVhOCA4IDAgMSAwIDAtMTYgOCA4IDAgMCAwIDAgMTZ6IiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+PC9zdmc+);
		background-size: contain;
		background-repeat: no-repeat;
		background-position: center;
		margin-bottom: 2px;
		opacity: 0.5;
	}

	/* Label "Rechercher" pour la recherche */
	.tabbar-nav .menu-item-search::after {
		content: "Rechercher";
		display: block;
		color: #fff;
		font-size: 0.8rem;
		font-weight: 600;
		text-align: center;
		line-height: 1.2;
		opacity: 0.5;
	}

	/* Icône agences */
	.tabbar-nav .icon-agences a::before {
		background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjUiIGhlaWdodD0iMjUiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0ibTIzLjQ2MSA5LjM2LTMuNTg2LTMuNThBNC4zOTQgNC4zOTQgMCAwIDAgMTYuNzcgNC41Yy0xLjIxIDAtMi4zMTMuNDktMy4xMSAxLjI4Nmw2LjY4OSA2LjY4djcuNjQzYTQuMzczIDQuMzczIDAgMCAxLTEuMjg5IDMuMTA2IDQuMzg0IDQuMzg0IDAgMCAxLTMuMTA5IDEuMjg1aDQuNGE0LjM5IDQuMzkgMCAwIDAgNC4zOTgtNC4zOXYtNy42NDRhNC4zOCA0LjM4IDAgMCAwLTEuMjg5LTMuMTA3di4wMDF6IiBmaWxsPSIjZmZmIi8+PHBhdGggZD0ibTE4LjY2NCAxOS43NDQtLjE5NS00LjU2MWE0LjQ4MyA0LjQ4MyAwIDAgMS0xLjIzOSAzLjI4NCA0Ljc1OCA0Ljc1OCAwIDAgMS0zLjI2NiAxLjQ3OWwtOC44MDMuMzc3Yy0uMDA0LS4wNzUtLjAxLS4xNS0uMDEtLjIyNlYxMi41bDcuNTktNy41OTZhNC4zNzYgNC4zNzYgMCAwIDEgMy4xMS0xLjI5YzEuMjE2IDAgMi4yOTIuNDg0IDMuMDg2IDEuMjY3bC0zLjA4OC0zLjA5QTQuMzgxIDQuMzgxIDAgMCAwIDEyLjc0LjVhNC4zODMgNC4zODMgMCAwIDAtMy4xMSAxLjI5TDIuMDQgOS4zODNhNC4zOTQgNC4zOTQgMCAwIDAtMS4yODkgMy4xMTNILjc1djcuNmE0LjM5NSA0LjM5NSAwIDAgMCAxLjI4OSAzLjExMSA0LjM4MyA0LjM4MyAwIDAgMCAzLjExIDEuMjloNC40bC0uMDE1LS4wMDJjLjA5IDAgLjE4Mi4wMDMuMjguMDAzaDQuMzQ0YTQuNzU4IDQuNzU4IDAgMCAwIDMuMjY2LTEuNDcxIDQuNDgzIDQuNDgzIDAgMCAwIDEuMjM5LTMuMjg1di4wMDJ6IiBmaWxsPSIjZmZmIi8+PC9zdmc+);
	}

	/* Icône FAQ */
	.tabbar-nav .icon-faq a::before {
		background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjUiIGhlaWdodD0iMjUiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTEyLjI1IDIyLjVjNS41MjMgMCAxMC00LjQ3NyAxMC0xMHMtNC40NzctMTAtMTAtMTAtMTAgNC40NzctMTAgMTAgNC40NzcgMTAgMTAgMTB6IiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+PHBhdGggZD0iTTkuMzQgOS41YTMgMyAwIDAgMSA1LjgzIDFjMCAyLTMgMy0zIDNNMTIuMjUgMTcuNWguMDEiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz48L3N2Zz4=);
	}

	/* Icône devis */
	.tabbar-nav .icon-devis a::before {
		background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjUiIGhlaWdodD0iMjUiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTguMjUgMi41djRNMTIuMjUgMi41djRNMTYuMjUgMi41djRNMTguMjUgNC41aC0xMmEyIDIgMCAwIDAtMiAydjE0YTIgMiAwIDAgMCAyIDJoMTJhMiAyIDAgMCAwIDItMnYtMTRhMiAyIDAgMCAwLTItMnpNOC4yNSAxMC41aDZNOC4yNSAxNC41aDhNOC4yNSAxOC41aDUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz48L3N2Zz4=);
	}

}

@media (max-width: 768px) {
	.navbar-header img {
	  width: 85%;
	  max-width: 100%;
	  height: auto;
	  object-fit: cover;
	}
	.footer__column:first-child {
		padding-bottom: 2.666rem; /* 40px */
		border-bottom: 1px solid #4a486e;
	}
	.avis_verifies {
		margin-top: 20px;
		margin-bottom: 20px;
	}
	.avis_verifies__note--txt {
		font-size: 1.466rem; /* 22px */
	}
	.etoileav {
		width: 24px;
		height: auto;
	}
	.logoav {
		width: 128px;
		height: auto;
	}
	.nouveautes h3 {
		margin-top: 1.6rem; /* 24px */
	}
	.solutions .wp-block-cover .wp-block-cover__inner-container {
		padding: 0 1.34rem;
		width: 100%;
	}
	.simulateur .btn__blanc, .simulateur .btn__bleu {
		align-self: center;
		text-align: center;
		padding: 1.34rem; /* 20px 20px */
		width: 100%;
	}
	.btn__cta, .btn__outline, .btn__blanc, .btn__bleu {
		width: 100%;
		padding: 1.34rem; /* 20px 20px */
		text-align: center;
	}
	.wpcf7 {
		padding: 0 1.34rem; /* 20px */
	}
	
	.hero__form .wp-block-cover {
		justify-content: start;
	}
	.hero__form .wp-block-cover__inner-container {
		padding: 0 1.34rem; /* 20px */
	}
	.navbarform {
		justify-content: start;
		padding: 0 1.34rem;
	}
	/*.navbarform img {
		width: 130px;
		height: 40px;
	}*/
	
	.container1col, .contenu {
		padding: 0 1.71rem;
        width: 100%;
	}
	.btn__outline, .btn__simulation {
		width: 100%;
		text-align: center;
		justify-content: center;
	}
	.cta__documentation--footer {
		position: fixed;
		bottom: 5rem;
		left: 0;
		width: 100%;
		background: none;
		padding: 1rem;
		text-align: center;
		z-index: 1000;
	}
}
/* Bloque l'effet width:100% + flex-grow pour la galerie logo__reassurance */
.wp-block-gallery.wp-block-gallery-1.logo__reassurance .wp-block-image {
  width: auto !important;
  flex: 0 0 auto !important; /* empêche l'élément figure de forcer la taille */
  align-items: center !important; /* si tu veux centrer verticalement l'image */
  justify-content: center !important;
}

.wp-block-gallery.wp-block-gallery-1.logo__reassurance .wp-block-image img {
  width: 80px !important;       /* force largeur exacte */
  max-width: none !important;   /* évite conflit avec d'autres max-width */
  height: auto !important;
  flex: none !important;        /* neutralise flex-grow */
  object-fit: contain !important;/* évite la coupure */
  display: block !important;
}