/* =========================================================
   1. VARIABLES & TOKENS
   ========================================================= */

:root {
	--color-primary:    #E12122;
	--color-dark:       #454545;
	--color-bg:         #ffffff;
	--color-border:     #e0e0e0;
	--color-text:       #333333;
	--color-text-light: #ffffff;

	--font-body:        'Inter', system-ui, -apple-system, sans-serif;
	--font-heading:     'Inter', system-ui, -apple-system, sans-serif;

	/* Typographie (texte courant + hiérarchie) */
	--text-xs:          12px;
	--text-sm:          13px;
	--text-base:        14px;
	--text-md:          15px;
	--text-lg:          16px;
	--text-xl:          18px;
	--text-2xl:         20px;
	--text-3xl:         25px;

	--heading-1:        55px;
	--heading-2:        40px;
	--heading-3:        var(--text-3xl);
	--heading-4:        var(--text-2xl);
	--heading-5:        var(--text-xl);
	--heading-6:        var(--text-lg);

	--text-footer:           var(--text-base);
	--text-footer-nav:       var(--text-lg);
	--text-footer-contact:   var(--text-lg);
	--text-footer-copyright: var(--text-base);
	--text-footer-kicker:    var(--text-xs);

	--topbar-height:     36px;
	--nav-height:        90px;
	--nav-height-expanded: 150px;
	--nav-height-mobile: 80px;

	--transition:       0.25s ease;

	--hamburger-color:  #454545;
}

/* =========================================================
   2. RESET & BASE
   ========================================================= */

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

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	font-family: var(--font-body);
	font-size: var(--text-base);
	line-height: 1.65;
	color: var(--color-text);
	background-color: var(--color-bg);
	-webkit-font-smoothing: antialiased;
}

img,
video {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	color: var(--color-primary);
	text-decoration: none;
	transition: color var(--transition);
}

a:hover {
	color: #b81a1b;
}

ul,
ol {
	padding-left: 1.5em;
}

/* =========================================================
   3. BOOTSTRAP 5 GRID
   ========================================================= */

/* — CSS custom properties pour les gutters — */
:root {
	--bs-gutter-x: 1.5rem;
	--bs-gutter-y: 0;
}

/* — Containers — */
.container,
.container-fluid,
.container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm {
	width: 100%;
	padding-right: calc(var(--bs-gutter-x) * .5);
	padding-left: calc(var(--bs-gutter-x) * .5);
	margin-right: auto;
	margin-left: auto;
}

@media (min-width: 576px) {
	.container-sm, .container { max-width: 540px; }
}

@media (min-width: 768px) {
	.container-md, .container-sm, .container { max-width: 720px; }
}

@media (min-width: 992px) {
	.container-lg, .container-md, .container-sm, .container { max-width: 960px; }
}

@media (min-width: 1200px) {
	.container-xl, .container-lg, .container-md, .container-sm, .container { max-width: 1140px; }
}

@media (min-width: 1400px) {
	.container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container { max-width: 1320px; }
}

/* — Row — */
.row {
	--bs-gutter-x: 1.5rem;
	--bs-gutter-y: 0;
	display: flex;
	flex-wrap: wrap;
	margin-top: calc(-1 * var(--bs-gutter-y));
	margin-right: calc(-.5 * var(--bs-gutter-x));
	margin-left: calc(-.5 * var(--bs-gutter-x));
}

.row > * {
	flex-shrink: 0;
	width: 100%;
	max-width: 100%;
	padding-right: calc(var(--bs-gutter-x) * .5);
	padding-left: calc(var(--bs-gutter-x) * .5);
	margin-top: var(--bs-gutter-y);
}

/* — Columns base — */
.col { flex: 1 0 0%; }
.col-auto { flex: 0 0 auto; width: auto; }

.col-1  { flex: 0 0 auto; width:  8.33333333%; }
.col-2  { flex: 0 0 auto; width: 16.66666667%; }
.col-3  { flex: 0 0 auto; width: 25%; }
.col-4  { flex: 0 0 auto; width: 33.33333333%; }
.col-5  { flex: 0 0 auto; width: 41.66666667%; }
.col-6  { flex: 0 0 auto; width: 50%; }
.col-7  { flex: 0 0 auto; width: 58.33333333%; }
.col-8  { flex: 0 0 auto; width: 66.66666667%; }
.col-9  { flex: 0 0 auto; width: 75%; }
.col-10 { flex: 0 0 auto; width: 83.33333333%; }
.col-11 { flex: 0 0 auto; width: 91.66666667%; }
.col-12 { flex: 0 0 auto; width: 100%; }

.offset-1  { margin-left:  8.33333333%; }
.offset-2  { margin-left: 16.66666667%; }
.offset-3  { margin-left: 25%; }
.offset-4  { margin-left: 33.33333333%; }
.offset-5  { margin-left: 41.66666667%; }
.offset-6  { margin-left: 50%; }
.offset-7  { margin-left: 58.33333333%; }
.offset-8  { margin-left: 66.66666667%; }
.offset-9  { margin-left: 75%; }
.offset-10 { margin-left: 83.33333333%; }
.offset-11 { margin-left: 91.66666667%; }

/* sm ≥ 576px */
@media (min-width: 576px) {
	.col-sm      { flex: 1 0 0%; }
	.col-sm-auto { flex: 0 0 auto; width: auto; }
	.col-sm-1    { flex: 0 0 auto; width:  8.33333333%; }
	.col-sm-2    { flex: 0 0 auto; width: 16.66666667%; }
	.col-sm-3    { flex: 0 0 auto; width: 25%; }
	.col-sm-4    { flex: 0 0 auto; width: 33.33333333%; }
	.col-sm-5    { flex: 0 0 auto; width: 41.66666667%; }
	.col-sm-6    { flex: 0 0 auto; width: 50%; }
	.col-sm-7    { flex: 0 0 auto; width: 58.33333333%; }
	.col-sm-8    { flex: 0 0 auto; width: 66.66666667%; }
	.col-sm-9    { flex: 0 0 auto; width: 75%; }
	.col-sm-10   { flex: 0 0 auto; width: 83.33333333%; }
	.col-sm-11   { flex: 0 0 auto; width: 91.66666667%; }
	.col-sm-12   { flex: 0 0 auto; width: 100%; }
	.offset-sm-0  { margin-left: 0; }
	.offset-sm-1  { margin-left:  8.33333333%; }
	.offset-sm-2  { margin-left: 16.66666667%; }
	.offset-sm-3  { margin-left: 25%; }
	.offset-sm-4  { margin-left: 33.33333333%; }
	.offset-sm-5  { margin-left: 41.66666667%; }
	.offset-sm-6  { margin-left: 50%; }
	.offset-sm-7  { margin-left: 58.33333333%; }
	.offset-sm-8  { margin-left: 66.66666667%; }
	.offset-sm-9  { margin-left: 75%; }
	.offset-sm-10 { margin-left: 83.33333333%; }
	.offset-sm-11 { margin-left: 91.66666667%; }
}

/* md ≥ 768px */
@media (min-width: 768px) {
	.col-md      { flex: 1 0 0%; }
	.col-md-auto { flex: 0 0 auto; width: auto; }
	.col-md-1    { flex: 0 0 auto; width:  8.33333333%; }
	.col-md-2    { flex: 0 0 auto; width: 16.66666667%; }
	.col-md-3    { flex: 0 0 auto; width: 25%; }
	.col-md-4    { flex: 0 0 auto; width: 33.33333333%; }
	.col-md-5    { flex: 0 0 auto; width: 41.66666667%; }
	.col-md-6    { flex: 0 0 auto; width: 50%; }
	.col-md-7    { flex: 0 0 auto; width: 58.33333333%; }
	.col-md-8    { flex: 0 0 auto; width: 66.66666667%; }
	.col-md-9    { flex: 0 0 auto; width: 75%; }
	.col-md-10   { flex: 0 0 auto; width: 83.33333333%; }
	.col-md-11   { flex: 0 0 auto; width: 91.66666667%; }
	.col-md-12   { flex: 0 0 auto; width: 100%; }
	.offset-md-0  { margin-left: 0; }
	.offset-md-1  { margin-left:  8.33333333%; }
	.offset-md-2  { margin-left: 16.66666667%; }
	.offset-md-3  { margin-left: 25%; }
	.offset-md-4  { margin-left: 33.33333333%; }
	.offset-md-5  { margin-left: 41.66666667%; }
	.offset-md-6  { margin-left: 50%; }
	.offset-md-7  { margin-left: 58.33333333%; }
	.offset-md-8  { margin-left: 66.66666667%; }
	.offset-md-9  { margin-left: 75%; }
	.offset-md-10 { margin-left: 83.33333333%; }
	.offset-md-11 { margin-left: 91.66666667%; }
}

/* lg ≥ 992px */
@media (min-width: 992px) {
	.col-lg      { flex: 1 0 0%; }
	.col-lg-auto { flex: 0 0 auto; width: auto; }
	.col-lg-1    { flex: 0 0 auto; width:  8.33333333%; }
	.col-lg-2    { flex: 0 0 auto; width: 16.66666667%; }
	.col-lg-3    { flex: 0 0 auto; width: 25%; }
	.col-lg-4    { flex: 0 0 auto; width: 33.33333333%; }
	.col-lg-5    { flex: 0 0 auto; width: 41.66666667%; }
	.col-lg-6    { flex: 0 0 auto; width: 50%; }
	.col-lg-7    { flex: 0 0 auto; width: 58.33333333%; }
	.col-lg-8    { flex: 0 0 auto; width: 66.66666667%; }
	.col-lg-9    { flex: 0 0 auto; width: 75%; }
	.col-lg-10   { flex: 0 0 auto; width: 83.33333333%; }
	.col-lg-11   { flex: 0 0 auto; width: 91.66666667%; }
	.col-lg-12   { flex: 0 0 auto; width: 100%; }
	.offset-lg-0  { margin-left: 0; }
	.offset-lg-1  { margin-left:  8.33333333%; }
	.offset-lg-2  { margin-left: 16.66666667%; }
	.offset-lg-3  { margin-left: 25%; }
	.offset-lg-4  { margin-left: 33.33333333%; }
	.offset-lg-5  { margin-left: 41.66666667%; }
	.offset-lg-6  { margin-left: 50%; }
	.offset-lg-7  { margin-left: 58.33333333%; }
	.offset-lg-8  { margin-left: 66.66666667%; }
	.offset-lg-9  { margin-left: 75%; }
	.offset-lg-10 { margin-left: 83.33333333%; }
	.offset-lg-11 { margin-left: 91.66666667%; }
}

/* xl ≥ 1200px */
@media (min-width: 1200px) {
	.col-xl      { flex: 1 0 0%; }
	.col-xl-auto { flex: 0 0 auto; width: auto; }
	.col-xl-1    { flex: 0 0 auto; width:  8.33333333%; }
	.col-xl-2    { flex: 0 0 auto; width: 16.66666667%; }
	.col-xl-3    { flex: 0 0 auto; width: 25%; }
	.col-xl-4    { flex: 0 0 auto; width: 33.33333333%; }
	.col-xl-5    { flex: 0 0 auto; width: 41.66666667%; }
	.col-xl-6    { flex: 0 0 auto; width: 50%; }
	.col-xl-7    { flex: 0 0 auto; width: 58.33333333%; }
	.col-xl-8    { flex: 0 0 auto; width: 66.66666667%; }
	.col-xl-9    { flex: 0 0 auto; width: 75%; }
	.col-xl-10   { flex: 0 0 auto; width: 83.33333333%; }
	.col-xl-11   { flex: 0 0 auto; width: 91.66666667%; }
	.col-xl-12   { flex: 0 0 auto; width: 100%; }
	.offset-xl-0  { margin-left: 0; }
	.offset-xl-1  { margin-left:  8.33333333%; }
	.offset-xl-2  { margin-left: 16.66666667%; }
	.offset-xl-3  { margin-left: 25%; }
	.offset-xl-4  { margin-left: 33.33333333%; }
	.offset-xl-5  { margin-left: 41.66666667%; }
	.offset-xl-6  { margin-left: 50%; }
	.offset-xl-7  { margin-left: 58.33333333%; }
	.offset-xl-8  { margin-left: 66.66666667%; }
	.offset-xl-9  { margin-left: 75%; }
	.offset-xl-10 { margin-left: 83.33333333%; }
	.offset-xl-11 { margin-left: 91.66666667%; }
}

/* xxl ≥ 1400px */
@media (min-width: 1400px) {
	.col-xxl      { flex: 1 0 0%; }
	.col-xxl-auto { flex: 0 0 auto; width: auto; }
	.col-xxl-1    { flex: 0 0 auto; width:  8.33333333%; }
	.col-xxl-2    { flex: 0 0 auto; width: 16.66666667%; }
	.col-xxl-3    { flex: 0 0 auto; width: 25%; }
	.col-xxl-4    { flex: 0 0 auto; width: 33.33333333%; }
	.col-xxl-5    { flex: 0 0 auto; width: 41.66666667%; }
	.col-xxl-6    { flex: 0 0 auto; width: 50%; }
	.col-xxl-7    { flex: 0 0 auto; width: 58.33333333%; }
	.col-xxl-8    { flex: 0 0 auto; width: 66.66666667%; }
	.col-xxl-9    { flex: 0 0 auto; width: 75%; }
	.col-xxl-10   { flex: 0 0 auto; width: 83.33333333%; }
	.col-xxl-11   { flex: 0 0 auto; width: 91.66666667%; }
	.col-xxl-12   { flex: 0 0 auto; width: 100%; }
	.offset-xxl-0  { margin-left: 0; }
	.offset-xxl-1  { margin-left:  8.33333333%; }
	.offset-xxl-2  { margin-left: 16.66666667%; }
	.offset-xxl-3  { margin-left: 25%; }
	.offset-xxl-4  { margin-left: 33.33333333%; }
	.offset-xxl-5  { margin-left: 41.66666667%; }
	.offset-xxl-6  { margin-left: 50%; }
	.offset-xxl-7  { margin-left: 58.33333333%; }
	.offset-xxl-8  { margin-left: 66.66666667%; }
	.offset-xxl-9  { margin-left: 75%; }
	.offset-xxl-10 { margin-left: 83.33333333%; }
	.offset-xxl-11 { margin-left: 91.66666667%; }
}

/* — Gutter utilities — */
.g-0  { --bs-gutter-x: 0;      --bs-gutter-y: 0; }
.g-1  { --bs-gutter-x: .25rem; --bs-gutter-y: .25rem; }
.g-2  { --bs-gutter-x: .5rem;  --bs-gutter-y: .5rem; }
.g-3  { --bs-gutter-x: 1rem;   --bs-gutter-y: 1rem; }
.g-4  { --bs-gutter-x: 1.5rem; --bs-gutter-y: 1.5rem; }
.g-5  { --bs-gutter-x: 3rem;   --bs-gutter-y: 3rem; }
.gx-0 { --bs-gutter-x: 0; }
.gx-1 { --bs-gutter-x: .25rem; }
.gx-2 { --bs-gutter-x: .5rem; }
.gx-3 { --bs-gutter-x: 1rem; }
.gx-4 { --bs-gutter-x: 1.5rem; }
.gx-5 { --bs-gutter-x: 3rem; }
.gy-0 { --bs-gutter-y: 0; }
.gy-1 { --bs-gutter-y: .25rem; }
.gy-2 { --bs-gutter-y: .5rem; }
.gy-3 { --bs-gutter-y: 1rem; }
.gy-4 { --bs-gutter-y: 1.5rem; }
.gy-5 { --bs-gutter-y: 3rem; }

/* — Flex alignment helpers — */
.align-items-start   { align-items: flex-start; }
.align-items-center  { align-items: center; }
.align-items-end     { align-items: flex-end; }
.justify-content-start   { justify-content: flex-start; }
.justify-content-center  { justify-content: center; }
.justify-content-end     { justify-content: flex-end; }
.justify-content-between { justify-content: space-between; }

/* =========================================================
   4. TYPOGRAPHY
   ========================================================= */

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
	font-family: var(--font-heading);
	font-weight: 400;
	line-height: 1.2;
	color: var(--color-text);
	margin-top: 0;
	margin-bottom: 0.5em;
}

h1, .h1 {
	font-size: var(--heading-1);
	font-weight: 500; /* medium */
	color: var(--color-primary);
}
h2, .h2 { font-size: var(--heading-2); }
h3, .h3 { font-size: var(--heading-3); }
h4, .h4 { font-size: var(--heading-4); }
h5, .h5 { font-size: var(--heading-5); }
h6, .h6 { font-size: var(--heading-6); }

p {
	margin-top: 0;
	margin-bottom: 1rem;
}

/* =========================================================
   5. HEADER
   ========================================================= */

.site-header {
	position: sticky;
	top: 0;
	z-index: 1000;
	background: var(--color-bg);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	--nav-height-current: var(--nav-height-expanded);
}

.site-header.is-sticky {
	--nav-height-current: var(--nav-height);
}

/* ── Topbar ── */

.header-topbar {
	position: relative;
	background: var(--color-primary);
	height: var(--topbar-height);
}

/* Biseau blanc à gauche — visible par défaut (caché uniquement quand le menu mobile est ouvert).
   S'aligne sur le bord gauche du container xxl (max-width: 1320px) quand il y a des gouttières. */
.header-topbar::before {
	content: '';
	position: absolute;
	left: 0; top: -1px; bottom: -1px; /* évite les filets (anti-aliasing clip-path) */
	width: 10%; /* fallback < 1400px */
	background: var(--color-bg);
	clip-path: polygon(0 0, 100% 0, calc(100% - 18px) 100%, 0 100%);
}

@media (min-width: 1400px) {
	.header-topbar::before {
		/* calc(50% - 660px) = demi-viewport moins demi-container, + 40px de chevauchement */
		width: calc(50% - 620px);
	}
}

@media (max-width: 991.98px) {
	.header-topbar::before {
		width: 20%;
	}

	body.is-mobile-menu-open .header-topbar::before {
		display: none;
	}
}

.header-topbar .container {
	height: 100%;
}

.header-topbar__inner {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	height: 100%;
	gap: 1.25rem;
}

/* Réseaux sociaux */
.topbar-socials {
	display: flex;
	align-items: center;
	gap: 0.625rem;
}

.topbar-socials a {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-text-light);
	font-size: 13px;
	line-height: 1;
	transition: opacity var(--transition);
	text-decoration: none;
}

.topbar-socials a:hover {
	opacity: 0.7;
	color: var(--color-text-light);
}

/* WPML */
.topbar-lang ul,
.topbar-lang .wpml-ls-legacy-list-horizontal {
	display: flex;
	align-items: center;
	gap: 0.25rem;
	list-style: none;
	margin: 0;
	padding: 0;
	border: none;
	background: transparent;
}

.topbar-lang a,
.topbar-lang .wpml-ls-link {
	color: var(--color-text-light) !important;
	font-size: 12px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	padding: 0 0.3rem;
	text-decoration: none;
	transition: opacity var(--transition);
}

.topbar-lang a:hover { opacity: 0.7; }

.topbar-lang .current span,
.topbar-lang .wpml-ls-current-language a {
	color: var(--color-text-light);
	opacity: 0.55;
	font-size: 12px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	padding: 0 0.3rem;
}

/* ── Header main ── */

.header-main .container {
	height: var(--nav-height-current);
	transition: height 0.2s ease;
}

.header-main__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 100%;
	gap: 2rem;
}

.header-main__logo {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	text-decoration: none;
}

.header-main__logo img {
	height: 120px;
	width: auto;
	display: block;
	transition: height 0.2s ease;
}

.header-main__logo-img--white { display: none; }

.site-header.is-sticky .header-main__logo img {
	height: 65px;
}

.header-main__logo span {
	font-size: 20px;
	font-weight: 700;
	color: var(--color-dark);
}

/* ── Navigation desktop ── */

.nav-desktop {
	display: flex;
	align-items: center;
	margin-left: auto;
}

.nav-menu {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	list-style: none;
	margin: 0;
	padding: 0;
}

.nav-menu > .menu-item {
	position: relative;
}

/* Pont invisible pour éviter de perdre le hover quand le sous-menu est décalé vers le bas */
.nav-menu > .menu-item.menu-item-has-children::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	height: 10px; /* doit matcher le +10px du sous-menu */
	background: transparent;
}

.nav-menu > .menu-item.menu-item-has-children > a {
	position: relative;
}

/* Chevron indicateur sous l'item (desktop) */
.nav-menu > .menu-item.menu-item-has-children > a::after {
	content: '';
	position: absolute;
	left: 50%;
	bottom: -6px;
	width: 6px;
	height: 6px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateX(-50%) rotate(45deg);
	opacity: 0.65;
	pointer-events: none;
}

.nav-menu > .menu-item > a {
	display: block;
	padding: 0.4rem 1.1rem;
	font-size: 13px;
	font-weight: 400;
	color: var(--color-text);
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	white-space: nowrap;
	transition: color var(--transition);
}

.nav-menu > .menu-item > a:hover,
.nav-menu > .menu-item.current-menu-item > a,
.nav-menu > .menu-item.current-page-ancestor > a,
.nav-menu > .menu-item.current-menu-parent > a {
	color: var(--color-primary);
}

/* Élément CTA biseau rouge — ajouter la classe CSS "is-cta" dans Admin > Apparence > Menus.
   Le biseau est entièrement contenu dans le box de l'élément (clip-path), pas de débord. */
.nav-menu > .menu-item.is-cta {
	margin-left: 0; /* même flux que les autres items, pas d'espace supplémentaire */
}

.nav-menu > .menu-item.is-cta > a {
	position: relative;
	padding-left: 1.3rem;
	padding-right: 1.5rem;
	color: var(--color-text-light) !important;
	z-index: 1;
}

/* Parallélogramme rouge — biseau des deux côtés dans la même direction (/ /).
   Les deux bords gauche et droit sont inclinés, contenu dans le box sans débord. */
.nav-menu > .menu-item.is-cta > a::before {
	content: '';
	position: absolute;
	inset: 0;
	background: var(--color-primary);
	clip-path: polygon(14px 0%, 100% 0%, calc(100% - 14px) 100%, 0% 100%);
	z-index: -1;
	transition: background var(--transition);
}

.nav-menu > .menu-item.is-cta > a:hover::before {
	background: #b81a1b;
}

/* Sous-menu desktop */
.nav-menu > .menu-item.menu-item-has-children > .sub-menu {
	display: none;
	position: absolute;
	top: calc(100% + 10px);
	left: 0;
	width: 100%;
	max-width: min(360px, calc(100vw - 2rem));
	background: var(--color-bg);
	border-top: 2px solid var(--color-primary);
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
	list-style: none;
	margin: 0;
	padding: 0.5rem 0;
	z-index: 100;
}

.nav-menu > .menu-item.menu-item-has-children:hover > .sub-menu,
.nav-menu > .menu-item.menu-item-has-children:focus-within > .sub-menu {
	display: block;
}

.nav-menu .sub-menu .menu-item > a {
	display: block;
	padding: 0.5rem 1rem;
	font-size: 14px;
	color: var(--color-dark);
	text-decoration: none;
	transition: color var(--transition), background var(--transition);
	white-space: nowrap;
}

.nav-menu .sub-menu .menu-item > a:hover {
	color: var(--color-primary);
	background: transparent;
}

/* Toggle bouton sous-menu — masqué en desktop */
.nav-desktop .submenu-toggle {
	display: none;
}

/* ── Burger ── */

.nav-burger {
	display: none !important; /* masqué en desktop, écrase hamburgers.css vendor */
}

/* Pas d'effet d'opacité sur le burger */
.nav-burger,
.nav-burger:hover,
.nav-burger:focus,
.nav-burger:active {
	opacity: 1 !important;
}

/* Harmoniser la couleur du hamburger (jonsuh/hamburgers) via variable */
.nav-burger .hamburger-inner,
.nav-burger .hamburger-inner::before,
.nav-burger .hamburger-inner::after {
	background-color: var(--hamburger-color) !important;
}

/* =========================================================
   6. NAVIGATION — MOBILE (< 992px)
   ========================================================= */

@media (max-width: 991.98px) {

	.header-main .container {
		height: var(--nav-height-mobile);
	}

	/* Mobile: logo 65px fixe + header non-dynamique (peu importe le scroll) */
	.site-header,
	.site-header.is-sticky {
		--nav-height-current: var(--nav-height-mobile);
	}

	.header-main__logo img,
	.site-header.is-sticky .header-main__logo img {
		height: 65px;
	}

	/* État menu mobile ouvert */
	body.is-mobile-menu-open .site-header {
		background: var(--color-primary);
		box-shadow: none;
	}

	body.is-mobile-menu-open .header-main {
		background: var(--color-primary);
	}

	body.is-mobile-menu-open .header-topbar {
		background: var(--color-primary);
	}

	/* Swap logo: blanc sur fond rouge */
	body.is-mobile-menu-open .header-main__logo-img--color { display: none; }
	body.is-mobile-menu-open .header-main__logo-img--white { display: block; }

	/* Burger en blanc */
	body.is-mobile-menu-open {
		--hamburger-color: #ffffff;
	}

	.nav-desktop {
		display: none;
	}

	.nav-burger {
		display: flex !important;
		align-items: center;
		justify-content: center;
	}

	.nav-mobile {
		display: none;
		position: fixed;
		top: calc(var(--topbar-height) + var(--nav-height-mobile));
		left: 0;
		width: 100%;
		height: calc(100dvh - var(--topbar-height) - var(--nav-height-mobile));
		overflow-y: auto;
		background: var(--color-primary);
		border-top: none;
		z-index: 998;
		padding: 2rem 0 2.5rem;
	}

	.nav-mobile.is-open {
		display: block;
	}

	.nav-mobile .nav-menu {
		flex-direction: column;
		align-items: center;
	}

	.nav-mobile .nav-menu > .menu-item > a {
		padding: 0.6rem 1.5rem;
		font-size: 16px;
		color: var(--color-text-light);
		border: none;
		text-align: center;
		text-transform: uppercase;
		letter-spacing: 0.06em;
		transition: opacity var(--transition);
	}

	.nav-mobile .nav-menu > .menu-item > a:hover {
		opacity: 0.8;
	}

	.nav-mobile .nav-menu > .menu-item.current-menu-item > a {
		font-weight: 700;
	}

	/* CTA en mobile : fond rouge plein, pas de biseau */
	.nav-mobile .nav-menu > .menu-item.is-cta {
		margin: 0.5rem 1.5rem;
	}

	.nav-mobile .nav-menu > .menu-item.is-cta > a {
		background: var(--color-primary);
		color: var(--color-text-light) !important;
		border: none;
		padding: 0.75rem 1.25rem;
	}

	.nav-mobile .nav-menu > .menu-item.is-cta > a::before {
		display: none;
	}

	/* Sous-menu mobile */
	.nav-mobile .menu-item-has-children {
		display: block;
	}

	.nav-mobile .menu-item-has-children > a {
		display: block;
	}

	.nav-mobile .submenu-toggle {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 28px;
		border: none;
		border-left: none;
		border-bottom: 1px solid var(--color-border);
		background: none;
		cursor: pointer;
		color: var(--color-text-light);
		transition: background var(--transition);
	}

	.nav-mobile .submenu-toggle[aria-expanded="true"] svg {
		transform: rotate(180deg);
	}

	.nav-mobile .submenu-toggle svg {
		transition: transform var(--transition);
	}

	.nav-mobile .sub-menu {
		display: none;
		width: 100%;
		list-style: none;
		padding: 0;
		margin: 0;
		background: transparent;
	}

	.nav-mobile .sub-menu.is-open {
		display: block;
	}

	.nav-mobile .sub-menu .menu-item > a {
		padding-left: 2.5rem;
		font-size: 14px;
		color: var(--color-text-light);
		text-align: center;
	}

}

@media (min-width: 992px) {
	.nav-burger { display: none; }
	.nav-mobile { display: none !important; }
}

/* =========================================================
   7. RÉSOLUTION CONFLITS WPBAKERY / BOOTSTRAP
   ========================================================= */

/* Neutraliser les marges négatives de .row dans les layouts WPBakery */
.vc_row .row {
	margin-right: 0;
	margin-left: 0;
}

.vc_row .row > * {
	padding-right: 0;
	padding-left: 0;
}

/* Restaurer les gutters Bootstrap quand .row est dans un .container WPBakery */
.wpb_column .container .row,
.wpb_column .container-fluid .row {
	margin-right: calc(-.5 * var(--bs-gutter-x));
	margin-left: calc(-.5 * var(--bs-gutter-x));
}

.wpb_column .container .row > *,
.wpb_column .container-fluid .row > * {
	padding-right: calc(var(--bs-gutter-x) * .5);
	padding-left: calc(var(--bs-gutter-x) * .5);
}

/* Éviter le double padding container dans les rows pleine largeur WPBakery */
.vc_row.vc_row-no-padding > .container,
.vc_row.vc_row-no-padding > .container-fluid {
	padding-left: 0;
	padding-right: 0;
}

/* WPBakery: permettre de désactiver l'overflow hidden des rows full width */
.vc_row[data-vc-full-width].noHidden {
	overflow: visible !important;
}

/* Rangée imbriquée dans une colonne (= inner row) : zone utile type .container,
   même si la rangée parente est en pleine largeur / stretch. */
.wpb_column > .vc_column-inner > .vc_row,
.wpb_column > .vc_column-inner > .vc_row-full-width-wrapper,
.wpb_column > .wpb_wrapper > .vc_row,
.wpb_column > .wpb_wrapper > .vc_row-full-width-wrapper,
.vc_row.vc_inner {
	box-sizing: border-box;
	position: relative;
	width: 100% !important;
	max-width: 100%;
	margin-right: auto !important;
	margin-left: auto !important;
	padding-right: calc(var(--bs-gutter-x) * .5);
	padding-left: calc(var(--bs-gutter-x) * .5);
	left: auto !important;
	right: auto !important;
}

.wpb_column > .vc_column-inner > .vc_row.vc_row-no-padding,
.wpb_column > .wpb_wrapper > .vc_row.vc_row-no-padding {
	padding-right: 0;
	padding-left: 0;
}

.wpb_column > .vc_column-inner > .vc_row-full-width-wrapper,
.wpb_column > .wpb_wrapper > .vc_row-full-width-wrapper {
	overflow: visible;
}

/* Annuler le breakout viewport des rows « stretch » imbriquées */
.wpb_column .vc_row[data-vc-full-width],
.wpb_column .vc_row[data-vc-full-width="true"] {
	width: 100% !important;
	max-width: 100% !important;
	margin-right: auto !important;
	margin-left: auto !important;
	left: auto !important;
	right: auto !important;
}

@media (min-width: 576px) {
	.wpb_column > .vc_column-inner > .vc_row,
	.wpb_column > .vc_column-inner > .vc_row-full-width-wrapper,
	.wpb_column > .wpb_wrapper > .vc_row,
	.wpb_column > .wpb_wrapper > .vc_row-full-width-wrapper,
	.vc_row.vc_inner {
		max-width: 540px;
	}
}

@media (min-width: 768px) {
	.wpb_column > .vc_column-inner > .vc_row,
	.wpb_column > .vc_column-inner > .vc_row-full-width-wrapper,
	.wpb_column > .wpb_wrapper > .vc_row,
	.wpb_column > .wpb_wrapper > .vc_row-full-width-wrapper,
	.vc_row.vc_inner {
		max-width: 720px;
	}
}

@media (min-width: 992px) {
	.wpb_column > .vc_column-inner > .vc_row,
	.wpb_column > .vc_column-inner > .vc_row-full-width-wrapper,
	.wpb_column > .wpb_wrapper > .vc_row,
	.wpb_column > .wpb_wrapper > .vc_row-full-width-wrapper,
	.vc_row.vc_inner {
		max-width: 960px;
	}
}

@media (min-width: 1200px) {
	.wpb_column > .vc_column-inner > .vc_row,
	.wpb_column > .vc_column-inner > .vc_row-full-width-wrapper,
	.wpb_column > .wpb_wrapper > .vc_row,
	.wpb_column > .wpb_wrapper > .vc_row-full-width-wrapper,
	.vc_row.vc_inner {
		max-width: 1140px;
	}
}

@media (min-width: 1400px) {
	.wpb_column > .vc_column-inner > .vc_row,
	.wpb_column > .vc_column-inner > .vc_row-full-width-wrapper,
	.wpb_column > .wpb_wrapper > .vc_row,
	.wpb_column > .wpb_wrapper > .vc_row-full-width-wrapper,
	.vc_row.vc_inner {
		max-width: 1320px;
	}
}

/* WPBakery — colonnes flex / fill : ≤ 992px (body = priorité sur CSS plugin) */
@media (max-width: 991.98px) {
	body .vc_row.vc_row-flex > .vc_column_container > .vc_column-inner > * {
		min-height: 0;
	}

	body .vc_col-has-fill > .vc_column-inner,
	body .vc_row-has-fill > .vc_column_container > .vc_column-inner {
		padding-top: 0;
	}
}

/* =========================================================
   7b. BLOCS WPBAKERY CUSTOM
   ========================================================= */

.prestation-home__media {
	position: relative;
	overflow: hidden;
	background: var(--color-border);
	border-bottom: 4px solid var(--color-primary);
}

.prestation-home__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: block;
}

.prestation-home__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.prestation-home__titlebar {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(255, 255, 255, 0.7);
	z-index: 2;
	top: 75%;
	align-content: center;
	justify-content: center;
}

.prestation-home__title {
	text-align: center;
	text-transform: uppercase;
	color: var(--color-dark);
	font-size: 25px;
	font-weight: 400;
	padding: 30px;
}

.prestation-home__desc {
	margin-top: 23px;
	margin-bottom: 35px;
	text-align: center;
	font-size: 14px;
	font-weight: 400;
}

/* — Bloc WPBakery « Bloc image + texte (split) » (starter_split_media) — */
/* Hauteur de ligne = max(texte, image). L’image impose sa hauteur via largeur 100 % + aspect-ratio ; le texte remplit la colonne sur toute la hauteur. */
.starter-split-media {
	display: grid;
	align-items: stretch;
	width: 100%;
	min-height: 0;
}

.starter-split-media--img-right {
	grid-template-columns: minmax(0, 34%) minmax(0, 66%);
	grid-template-areas: 'split-text split-media';
}

.starter-split-media--img-left {
	grid-template-columns: minmax(0, 66%) minmax(0, 34%);
	grid-template-areas: 'split-media split-text';
}

.starter-split-media__content {
	grid-area: split-text;
	min-width: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: clamp(28px, 5vw, 72px) clamp(20px, 4vw, 48px);
}

.starter-split-media__content-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	max-width: 100%;
	width: 100%;
	text-align: center;
}

.starter-split-media__picto {
	line-height: 1;
	margin: 0 0 1rem;
}

.starter-split-media__picto:empty {
	display: none;
}

.starter-split-media--scheme-red .starter-split-media__picto {
	color: var(--color-text-light);
	font-size: clamp(1.75rem, 3.5vw, 2.5rem);
}

/* Fond blanc : picto gris #999, zone 65×65 (le côté le plus long = 65px pour l’image) */
.starter-split-media--scheme-light .starter-split-media__picto {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 65px;
	height: 65px;
	margin: 0 0 1rem;
	color: #999999;
	flex-shrink: 0;
}

.starter-split-media--scheme-light .starter-split-media__picto i {
	font-size: 65px;
	line-height: 1;
}

.starter-split-media__picto-img {
	display: inline-block;
	width: clamp(44px, 7vw, 72px);
	height: auto;
	vertical-align: middle;
}

.starter-split-media--scheme-light .starter-split-media__picto-img {
	width: auto;
	height: auto;
	max-width: 65px;
	max-height: 65px;
	object-fit: contain;
	vertical-align: middle;
}

.starter-split-media__surtitle {
	margin: 0 0 0.5rem;
	font-size: 20px;
	font-weight: 400;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	line-height: 1.35;
}

.starter-split-media__title {
	margin: 0;
	font-family: var(--font-heading);
	font-size: clamp(1.35rem, 2.8vw, 2rem);
	font-weight: 700;
	line-height: 1.2;
}

.starter-split-media--scheme-light .starter-split-media__surtitle {
	color: var(--color-text);
}

.starter-split-media--scheme-light .starter-split-media__title {
	font-size: 35px;
	font-weight: 700;
	color: var(--color-text);
	line-height: 1.15;
}

.starter-split-media--scheme-red .starter-split-media__content {
	background: var(--color-primary);
	color: var(--color-text-light);
}

.starter-split-media--scheme-red .starter-split-media__surtitle {
	color: var(--color-text-light);
}

.starter-split-media--scheme-red .starter-split-media__title {
	color: var(--color-text-light);
}

.starter-split-media--scheme-light .starter-split-media__content {
	background: var(--color-bg);
	color: var(--color-text);
}

/* Colonne image : hauteur = contenu (ratio), pas étirement sur la hauteur du texte */
.starter-split-media__media {
	grid-area: split-media;
	align-self: start;
	width: 100%;
	min-width: 0;
	overflow: hidden;
	background: transparent;
}

.starter-split-media__figure {
	position: relative;
	width: 100%;
	margin: 0;
	overflow: hidden;
}

/* Ratios desktop : largeur = 100 % de la colonne 66 %, hauteur implicite via aspect-ratio */
@media (min-width: 992px) {
	.starter-split-media__figure--ar-1-1 {
		aspect-ratio: 1 / 1;
	}

	.starter-split-media__figure--ar-4-3 {
		aspect-ratio: 4 / 3;
	}

	.starter-split-media__figure--ar-16-9 {
		aspect-ratio: 16 / 9;
	}

	.starter-split-media__figure--ar-auto {
		aspect-ratio: auto;
	}

	.starter-split-media__figure--ar-auto .starter-split-media__photo {
		position: static;
		width: 100%;
		height: auto;
		max-width: 100%;
		object-fit: contain;
		display: block;
	}

	.starter-split-media__figure--ar-1-1 .starter-split-media__photo,
	.starter-split-media__figure--ar-4-3 .starter-split-media__photo,
	.starter-split-media__figure--ar-16-9 .starter-split-media__photo {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		max-width: none;
		object-fit: cover;
		object-position: center;
		display: block;
	}
}

@media (max-width: 991.98px) {
	.starter-split-media {
		grid-template-columns: 1fr !important;
		grid-template-areas:
			'split-text'
			'split-media';
	}

	.starter-split-media__content,
	.starter-split-media__media {
		width: 100%;
		max-width: 100%;
	}

	.starter-split-media__media {
		align-self: stretch;
	}

	.starter-split-media__figure {
		width: 100%;
	}

	.starter-split-media__figure--ar-auto .starter-split-media__photo {
		position: static;
		width: 100%;
		height: auto;
		max-width: 100%;
		object-fit: contain;
		display: block;
	}

	.starter-split-media__figure--ar-1-1 {
		aspect-ratio: 1 / 1;
	}

	.starter-split-media__figure--ar-4-3 {
		aspect-ratio: 4 / 3;
	}

	.starter-split-media__figure--ar-16-9 {
		aspect-ratio: 16 / 9;
	}

	.starter-split-media__figure--ar-1-1 .starter-split-media__photo,
	.starter-split-media__figure--ar-4-3 .starter-split-media__photo,
	.starter-split-media__figure--ar-16-9 .starter-split-media__photo {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		max-width: none;
		object-fit: cover;
		object-position: center;
	}

	.starter-split-media__figure--ar-auto {
		min-height: min(56vw, 280px);
	}
}

/* — Bloc WPBakery « Bloc texte + image (superposition) » (starter_text_image_overlap) — */
.starter-text-img {
	position: relative;
	width: 100%;
	overflow: visible;
	/* Compense translateY(30 %) sur l’image : 0,3 × hauteur = 0,3 × largeur × 515/704 */
	margin-bottom: calc(0.3 * (515 / 704) * min(42vw, 640px));
}

.starter-text-img__inner {
	position: relative;
	width: 100%;
}

.starter-text-img__panel {
	width: 90%;
	margin-left: 0;
	margin-right: auto;
	position: relative;
	z-index: 1;
	background: #454545;
	color: var(--color-text-light);
	padding: 70px;
	box-sizing: border-box;
}

.starter-text-img__wysiwyg {
	width: 50%;
	max-width: 100%;
}

.starter-text-img__wysiwyg :where(h1, h2, h3, h4, h5, h6) {
	color: #ffffff;
}

.starter-text-img__wysiwyg :where(strong, b) {
	color: #ffffff;
	font-weight: 700;
}

.starter-text-img__wysiwyg :where(em, i, cite) {
	color: #ffffff;
}

.starter-text-img__wysiwyg :where(a) {
	color: #ffffff;
	text-decoration: underline;
}

.starter-text-img__wysiwyg a:hover {
	opacity: 0.85;
}

.starter-text-img__wysiwyg :where(code, kbd) {
	color: #ffffff;
	background: rgba(255, 255, 255, 0.12);
}

.starter-text-img__wysiwyg :where(blockquote) {
	color: #ffffff;
	border-left-color: rgba(255, 255, 255, 0.35);
}

.starter-text-img__wysiwyg :where(ul, ol, li) {
	color: #ffffff;
}

.starter-text-img__wysiwyg > :first-child {
	margin-top: 0;
}

.starter-text-img__wysiwyg > :last-child {
	margin-bottom: 0;
}

.starter-text-img__wysiwyg + .starter-text-img__cta {
	margin-top: 30px;
}

.starter-text-img__cta {
	margin-top: 0;
	width: 50%;
	max-width: 100%;
}

.starter-text-img__cta-sep {
	border: none;
	width: 50px;
	height: 1px;
	margin: 0 0 30px;
	padding: 0;
	background: #fff;
}

.starter-text-img__cta-intro {
	margin: 0;
	font-size: var(--text-base);
	font-weight: 700;
	line-height: 1.5;
	color: var(--color-text-light);
}

.starter-text-img__cta-intro + .starter-text-img__cta-btn {
	margin-top: 10px;
}

.starter-text-img__cta-btn {
	display: inline-block;
	background: var(--color-primary);
	color: var(--color-text-light);
	border: 0;
	padding: 14px 34px;
	font-size: var(--text-base);
	font-weight: 700;
	letter-spacing: 0.04em;
	text-decoration: none;
	transition: background var(--transition), filter var(--transition);
}

.starter-text-img__cta-btn:hover,
.starter-text-img__cta-btn:focus-visible {
	background: #b81a1b;
	color: var(--color-text-light);
	text-decoration: none;
}

.starter-text-img__media {
	position: absolute;
	right: 0;
	top: 0;
	z-index: 2;
	width: min(42vw, 640px);
	aspect-ratio: 704 / 515;
	margin: 0;
	overflow: hidden;
	transform: translateY(30%);
}

/* Biseau blanc sur l’image uniquement (repère : .hero-slider__bevel, cadré sur le figure) */
.starter-text-img__bevel {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 38%;
	background: rgba(255, 255, 255, 0.13);
	clip-path: polygon(41% 0%, 100% 0%, 100% 100%, 0% 100%);
	z-index: 1;
	pointer-events: none;
}

.starter-text-img__media img,
.starter-text-img__photo {
	position: relative;
	z-index: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	display: block;
}

/* Image WP : classe sur le wrapper img */
.starter-text-img__media .starter-text-img__photo {
	height: 100%;
}

@media (max-width: 991.98px) {
	.starter-text-img {
		margin-bottom: 0;
	}

	/* Sous le texte : marge basse du gris ≈ 20 % de la hauteur d’image (hauteur ∝ largeur × 515/704), puis image remontée en superposition */
	.starter-text-img__panel {
		width: 100%;
		padding-top: clamp(24px, 6vw, 70px);
		padding-right: clamp(24px, 6vw, 70px);
		padding-left: clamp(24px, 6vw, 70px);
		padding-bottom: calc(clamp(24px, 6vw, 70px) + (0.2 * (515 / 704) * 80%));
	}

	.starter-text-img__wysiwyg {
		width: 100%;
	}

	.starter-text-img__cta {
		width: 100%;
	}

	.starter-text-img__media {
		position: relative;
		right: auto;
		top: auto;
		transform: none;
		width: 80%;
		max-width: 80%;
		z-index: 2;
		margin-top: calc(-0.2 * (515 / 704) * 80%);
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 0;
	}

	/* Overlay biseau conservé sur l’image ; angle un peu plus doux en colonne */
	.starter-text-img__bevel {
		width: 42%;
		clip-path: polygon(38% 0%, 100% 0%, 100% 100%, 0% 100%);
	}
}

/* =========================================================
   7c. CONTACT FORM 7 — HOME (formulaire rouge)
   ========================================================= */

.cf7-home {
	background: var(--color-primary);
	color: var(--color-text-light);
	padding: clamp(28px, 4vw, 48px);margin-bottom: -28px;
	z-index: 30;
	position: relative;
}

.cf7-home .cf7-line {
	display: grid;
	grid-template-columns: 80px 1fr;
	align-items: center;
	gap: 24px;
	padding: 16px 0;
}

.cf7-home .cf7-label {
	font-size: var(--text-base);
	font-weight: 400;
}

.cf7-home .wpcf7-form-control-wrap {
	display: block;
}

.cf7-home input[type="text"],
.cf7-home input[type="email"],
.cf7-home input[type="tel"],
.cf7-home textarea {
	width: 100%;
	background: transparent;
	border: 0;
	border-bottom: 2px solid rgba(255, 255, 255, 0.7);
	outline: none;
	color: var(--color-text-light);
	font-size: var(--text-lg);
	padding: 6px 0;
}

.cf7-home textarea {
	min-height: 46px;
	resize: vertical;
}

.cf7-home ::placeholder {
	color: rgba(255, 255, 255, 0.75);
}

.cf7-home .cf7-actions {
	display: flex;
	justify-content: flex-end;
	padding-top: 18px;
}

.cf7-home input[type="submit"] {
	background: #fff;
	color: #000;
	border: 0;
	padding: 14px 34px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	cursor: pointer;
}

.cf7-home input[type="submit"]:hover {
	filter: brightness(0.95);
}

.cf7-home .wpcf7-not-valid-tip {
	color: #fff;
	margin-top: 8px;
	font-size: var(--text-xs);
}

/* CF7: message de retour en overlay sous le form */
.wpcf7 form {
	position: relative;
}

.wpcf7 form .wpcf7-response-output {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 40;
	background: #fff;
	margin: 0;
	border: 1px solid rgba(0, 0, 0, 0.15);
	color: #000;
	padding: 10px 14px;
}

@media (max-width: 991.98px) {
	.wpcf7 form .wpcf7-response-output {
		position: relative;
		margin-top: 12px;
	}
}

@media (max-width: 575.98px) {
	.cf7-home .cf7-line {
		grid-template-columns: 1fr;
		gap: 10px;
	}
}

/* =========================================================
   7d. BLOC WPBAKERY — CARTE GOOGLE + FORMULAIRE CONTACT
   ========================================================= */

/* Pleine largeur même si le bloc est dans le .container de la page */
.starter-contact-map {
	position: relative;
	left: 50%;
	right: 50%;
	width: 100vw;
	max-width: 100vw;
	margin-left: -50vw;
	margin-right: -50vw;
}

.starter-contact-map__map {
	position: relative;
	z-index: 1;
	width: 100%;
	height: var(--starter-contact-map-height, 480px);
	overflow: hidden;
	background: #e8e8e8;
}

.starter-contact-map__map-inner {
	width: 100%;
	height: 100%;
}

.starter-contact-map__map-inner iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
}

.starter-contact-map__band {
	position: relative;
	z-index: 2;
	background: var(--color-primary);
	color: var(--color-text-light);
	padding: 0;
}

.starter-contact-map__container {
	position: relative;
}

.starter-contact-map__layout {
	display: block;
	min-height: 0;
}

.starter-contact-map__info {
	max-width: none;
	margin-right: min(470px, 48%);
	padding-top: 50px;
	padding-bottom: 50px;
}

.starter-contact-map__company {
	margin: 0 0 10px;
	font-size: 22px;
	font-weight: 700;
	letter-spacing: 0.1em;
	line-height: 1.15;
	text-transform: uppercase;
}

.starter-contact-map__sep {
	display: block;
	width: 27px;
	height: 1px;
	margin: 0 0 14px;
	padding: 0;
	border: 0;
	background: var(--color-text-light);
}

.starter-contact-map__details {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 4px 70px;
}

.starter-contact-map__address {
	margin: 0;
	font-size: var(--text-lg);
	font-weight: 400;
	line-height: 1.35;
}

.starter-contact-map__address p {
	margin: 0;
}

.starter-contact-map__meta {
	display: grid;
	gap: 4px;
	font-size: var(--text-lg);
	font-weight: 600;
	line-height: 1.25;
	white-space: nowrap;
}

.starter-contact-map__meta a {
	color: inherit;
	text-decoration: none;
}

.starter-contact-map__meta a:hover,
.starter-contact-map__meta a:focus {
	text-decoration: underline;
}

.starter-contact-map__form-panel {
	position: absolute;
	z-index: 3;
	right: 0;
	bottom: 0;
	width: min(446px, 100%);
	margin: 0;
	background: var(--color-bg);
	color: var(--color-text);
	border: none !important;
	box-shadow: none;
	outline: none;
}

.starter-contact-map__form {
	position: relative;
	padding: 32px 36px 36px;
	border: none;
	outline: none;
}

/* CF7 dans le panneau blanc (maquette contact) */
.cf7-contact-map .wpcf7-form,
.cf7-contact-map .wpcf7 form {
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 0;
	border: none !important;
	box-shadow: none;
	outline: none;
}

.cf7-contact-map .cf7-line,
.cf7-contact-map p {
	margin: 0 0 0.75rem;
}

.cf7-contact-map .cf7-line:last-of-type,
.cf7-contact-map .cf7-line--message {
	margin-bottom: 0.75rem;
}

.cf7-contact-map .cf7-line {
	display: grid;
	grid-template-columns: 1fr;
	gap: 8px;
}

.cf7-contact-map .cf7-label,
.cf7-contact-map label {
	font-size: var(--text-sm);
	font-weight: 400;
	color: var(--color-text);
}

.cf7-contact-map .wpcf7-form-control-wrap {
	display: block;
}

.cf7-contact-map input[type="text"],
.cf7-contact-map input[type="email"],
.cf7-contact-map input[type="tel"] {
	width: 100%;
	padding: 8px 0;
	border: 0;
	border-bottom: 1px solid #b1b1b1;
	border-radius: 0;
	background: transparent;
	color: var(--color-text);
	font-size: var(--text-lg);
	outline: none;
}

.cf7-contact-map .cf7-line--message textarea,
.cf7-contact-map textarea.cf7-textarea {
	width: 100%;
	min-height: 90px;
	padding: 10px 12px;
	border: 1px solid #b1b1b1;
	border-radius: 0;
	background: transparent;
	color: var(--color-text);
	font-size: var(--text-lg);
	line-height: 1.4;
	resize: vertical;
	outline: none;
}

.cf7-contact-map ::placeholder {
	color: rgba(0, 0, 0, 0.45);
}

.cf7-contact-map .cf7-actions {
	order: 3;
	display: block;
	margin-top: 0.75rem;
	margin-bottom: 0;
	text-align: left;
}

.cf7-contact-map .cf7-actions p {
	margin: 0;
}

.cf7-contact-map .wpcf7-submit,
.cf7-contact-map p .wpcf7-submit {
	margin: 0;
}

.cf7-contact-map .cf7-feedback {
	display: none;
	min-height: 0;
	margin: 0;
	padding: 0;
}

.cf7-contact-map input[type="submit"] {
	padding: 12px 34px;
	border: 0;
	background: #b1b1b1;
	color: var(--color-text-light);
	font-size: var(--text-sm);
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	cursor: pointer;
}

.cf7-contact-map input[type="submit"]:hover {
	filter: brightness(0.92);
}

.cf7-contact-map .wpcf7-not-valid-tip {
	margin-top: 6px;
	font-size: var(--text-xs);
	color: var(--color-primary);
}

/* Message CF7 : au-dessus du bouton, hors flux du bandeau rouge (panneau en absolute) */
.cf7-contact-map .wpcf7 form .wpcf7-response-output {
	order: 2;
	position: relative;
	left: auto;
	right: auto;
	bottom: auto;
	z-index: 1;
	margin: 0.5rem 0 0;
	padding: 10px 12px;
	border: 1px solid rgba(0, 0, 0, 0.12);
	background: #f7f7f7;
	color: var(--color-text);
	font-size: var(--text-sm);
	line-height: 1.35;
	text-align: left;
}

.cf7-contact-map .wpcf7 form .wpcf7-response-output:empty {
	display: none !important;
}

.cf7-contact-map .wpcf7 form.invalid .wpcf7-response-output,
.cf7-contact-map .wpcf7 form.failed .wpcf7-response-output,
.cf7-contact-map .wpcf7 form.aborted .wpcf7-response-output {
	border-color: var(--color-primary);
	background: #fff5f5;
	color: var(--color-primary);
}

.cf7-contact-map .wpcf7 form.sent .wpcf7-response-output {
	border-color: #2e7d32;
	background: #f4faf4;
	color: #2e7d32;
}

@media (max-width: 991.98px) {
	.starter-contact-map__info {
		margin-right: 0;
		padding-top: 50px;
		padding-bottom: 50px;
	}

	.starter-contact-map__details {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.starter-contact-map__meta {
		white-space: normal;
	}

	.starter-contact-map__form-panel {
		position: relative;
		right: auto;
		bottom: auto;
		width: 100%;
		margin-top: 24px;
	}

}

/* =========================================================
   8. UTILITAIRES
   ========================================================= */

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

.clearfix::after {
	content: "";
	display: table;
	clear: both;
}

/* Ligne bas de section (WPBakery vc_row) */
.linebottom {
	background-image: linear-gradient(var(--color-primary), var(--color-primary));
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: 33% 16px;
}
body .vc_row > .vc_column_container.p-inner-xl .vc_column-inner {
	padding: 180px 100px;
}
/* Espacement (scale 0.25rem, identique à Bootstrap) */
.mt-0 { margin-top: 0; }
.mt-1 { margin-top: .25rem; }
.mt-2 { margin-top: .5rem; }
.mt-3 { margin-top: 1rem; }
.mt-4 { margin-top: 1.5rem; }
.mt-5 { margin-top: 3rem; }

.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: .25rem; }
.mb-2 { margin-bottom: .5rem; }
.mb-3 { margin-bottom: 1rem; }
.mb-4 { margin-bottom: 1.5rem; }
.mb-5 { margin-bottom: 3rem; }

.pt-0 { padding-top: 0; }
.pt-1 { padding-top: .25rem; }
.pt-2 { padding-top: .5rem; }
.pt-3 { padding-top: 1rem; }
.pt-4 { padding-top: 1.5rem; }
.pt-5 { padding-top: 3rem; }

.pb-0 { padding-bottom: 0; }
.pb-1 { padding-bottom: .25rem; }
.pb-2 { padding-bottom: .5rem; }
.pb-3 { padding-bottom: 1rem; }
.pb-4 { padding-bottom: 1.5rem; }
.pb-5 { padding-bottom: 3rem; }

.py-0 { padding-top: 0; padding-bottom: 0; }
.py-1 { padding-top: .25rem; padding-bottom: .25rem; }
.py-2 { padding-top: .5rem; padding-bottom: .5rem; }
.py-3 { padding-top: 1rem; padding-bottom: 1rem; }
.py-4 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.py-5 { padding-top: 3rem; padding-bottom: 3rem; }

/* Utilitaires custom (xs/s/m/l/xl/xxl) */
:root {
	--space-xs: 0.25rem;
	--space-s:  0.5rem;
	--space-m:  1rem;
	--space-l:  1.5rem;
	--space-xl: 3rem;
	--space-xxl: 5rem;
}

/* Padding */
.p-xs { padding: var(--space-xs); }
.p-s  { padding: var(--space-s); }
.p-m  { padding: var(--space-m); }
.p-l  { padding: var(--space-l); }
.p-xl { padding: var(--space-xl); }
.p-xxl { padding: var(--space-xxl); }

.pt-xs { padding-top: var(--space-xs); }
.pt-s  { padding-top: var(--space-s); }
.pt-m  { padding-top: var(--space-m); }
.pt-l  { padding-top: var(--space-l); }
.pt-xl { padding-top: var(--space-xl); }
.pt-xxl { padding-top: var(--space-xxl); }

.pb-xs { padding-bottom: var(--space-xs); }
.pb-s  { padding-bottom: var(--space-s); }
.pb-m  { padding-bottom: var(--space-m); }
.pb-l  { padding-bottom: var(--space-l); }
.pb-xl { padding-bottom: var(--space-xl); }
.pb-xxl { padding-bottom: var(--space-xxl); }

.pl-xs { padding-left: var(--space-xs); }
.pl-s  { padding-left: var(--space-s); }
.pl-m  { padding-left: var(--space-m); }
.pl-l  { padding-left: var(--space-l); }
.pl-xl { padding-left: var(--space-xl); }
.pl-xxl { padding-left: var(--space-xxl); }

.pr-xs { padding-right: var(--space-xs); }
.pr-s  { padding-right: var(--space-s); }
.pr-m  { padding-right: var(--space-m); }
.pr-l  { padding-right: var(--space-l); }
.pr-xl { padding-right: var(--space-xl); }
.pr-xxl { padding-right: var(--space-xxl); }

.ptb-xs { padding-top: var(--space-xs); padding-bottom: var(--space-xs); }
.ptb-s  { padding-top: var(--space-s);  padding-bottom: var(--space-s); }
.ptb-m  { padding-top: var(--space-m);  padding-bottom: var(--space-m); }
.ptb-l  { padding-top: var(--space-l);  padding-bottom: var(--space-l); }
.ptb-xl { padding-top: var(--space-xl); padding-bottom: var(--space-xl); }
.ptb-xxl { padding-top: var(--space-xxl); padding-bottom: var(--space-xxl); }
body .ptb-extra { padding-top: 180px; padding-bottom: 180px; }

@media (max-width: 991.98px) {
	body .ptb-extra {
		padding-top: 40px;
		padding-bottom: 40px;
	}
}

.plr-xs { padding-left: var(--space-xs); padding-right: var(--space-xs); }
.plr-s  { padding-left: var(--space-s);  padding-right: var(--space-s); }
.plr-m  { padding-left: var(--space-m);  padding-right: var(--space-m); }
.plr-l  { padding-left: var(--space-l);  padding-right: var(--space-l); }
.plr-xl { padding-left: var(--space-xl); padding-right: var(--space-xl); }
.plr-xxl { padding-left: var(--space-xxl); padding-right: var(--space-xxl); }

/* Margin */
.m-xs { margin: var(--space-xs); }
.m-s  { margin: var(--space-s); }
.m-m  { margin: var(--space-m); }
.m-l  { margin: var(--space-l); }
.m-xl { margin: var(--space-xl); }
.m-xxl { margin: var(--space-xxl); }

.mt-xs { margin-top: var(--space-xs); }
.mt-s  { margin-top: var(--space-s); }
.mt-m  { margin-top: var(--space-m); }
.mt-l  { margin-top: var(--space-l); }
.mt-xl { margin-top: var(--space-xl); }
.mt-xxl { margin-top: var(--space-xxl); }

.mb-xs { margin-bottom: var(--space-xs); }
.mb-s  { margin-bottom: var(--space-s); }
.mb-m  { margin-bottom: var(--space-m); }
.mb-l  { margin-bottom: var(--space-l); }
.mb-xl { margin-bottom: var(--space-xl); }
.mb-xxl { margin-bottom: var(--space-xxl); }

/* Marge basse négative fixe (chevauchement de section) */
body .mb-n80,body .wpb_content_element.mb-n80 { margin-bottom: -80px; }
body .mt-n80,body .wpb_content_element.mt-n80 { margin-top: -80px; }
body .mb-n80 .ptb-content > .vc_column-inner > .wpb_wrapper{
	padding-top: 60px;
	padding-bottom: 100px;
}
body .mt-n80 .ptb-content > .vc_column-inner > .wpb_wrapper{
	padding-top: 100px;
	padding-bottom: 60px;
}
.ml-xs { margin-left: var(--space-xs); }
.ml-s  { margin-left: var(--space-s); }
.ml-m  { margin-left: var(--space-m); }
.ml-l  { margin-left: var(--space-l); }
.ml-xl { margin-left: var(--space-xl); }
.ml-xxl { margin-left: var(--space-xxl); }

.mr-xs { margin-right: var(--space-xs); }
.mr-s  { margin-right: var(--space-s); }
.mr-m  { margin-right: var(--space-m); }
.mr-l  { margin-right: var(--space-l); }
.mr-xl { margin-right: var(--space-xl); }
.mr-xxl { margin-right: var(--space-xxl); }

.mtb-xs { margin-top: var(--space-xs); margin-bottom: var(--space-xs); }
.mtb-s  { margin-top: var(--space-s);  margin-bottom: var(--space-s); }
.mtb-m  { margin-top: var(--space-m);  margin-bottom: var(--space-m); }
.mtb-l  { margin-top: var(--space-l);  margin-bottom: var(--space-l); }
.mtb-xl { margin-top: var(--space-xl); margin-bottom: var(--space-xl); }
.mtb-xxl { margin-top: var(--space-xxl); margin-bottom: var(--space-xxl); }

.mlr-xs { margin-left: var(--space-xs); margin-right: var(--space-xs); }
.mlr-s  { margin-left: var(--space-s);  margin-right: var(--space-s); }
.mlr-m  { margin-left: var(--space-m);  margin-right: var(--space-m); }
.mlr-l  { margin-left: var(--space-l);  margin-right: var(--space-l); }
.mlr-xl { margin-left: var(--space-xl); margin-right: var(--space-xl); }
.mlr-xxl { margin-left: var(--space-xxl); margin-right: var(--space-xxl); }

.text-center { text-align: center; }
.text-left   { text-align: left; }
.text-right  { text-align: right; }

/* Texte clair : classe « text-light » sur une section, ligne ou colonne WPBakery */
body .text-light,
body .text-light :where(
	p, h1, h2, h3, h4, h5, h6,
	li, dt, dd,
	span, strong, em, b, i, small,
	label, figcaption, blockquote, cite,
	a
) {
	color: var(--color-text-light);
}

body .text-light a:hover,
body .text-light a:focus-visible {
	color: var(--color-text-light);
	opacity: 0.85;
}

.d-flex { display: flex; }
.d-none { display: none; }
.d-block { display: block; }

/* Image WPBakery (wpb_single_image) : classe « img-biseau-blanc » sur l’élément (champ Classe CSS). */
.wpb_single_image.img-biseau-blanc .vc_single_image-wrapper {
	position: relative;
	overflow: hidden;
}
.mb-n80 img{
	border:10px solid var(--color-bg);
}

.mt-n80 img{
	border:10px solid var(--color-bg);
}
.wpb_single_image.img-biseau-blanc .vc_single_image-wrapper::after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 38%;
	background: rgba(255, 255, 255, 0.4);
	clip-path: polygon(41% 0%, 100% 0%, 100% 100%, 0% 100%);
	z-index: 1;
	pointer-events: none;
}

.wpb_single_image.img-biseau-blanc .vc_single_image-img {
	position: relative;
	z-index: 0;
	display: block;
	width: 100%;
	height: auto;
}

/* =========================================================
   9. FOOTER
   ========================================================= */

.site-footer {
	position: relative;
	padding: 90px 0;
	border-top: 1px solid var(--color-border);
	font-size: var(--text-footer);
	overflow: hidden;
}

/* Footer (maquette Enersteel) : tout sur une ligne */

.site-footer .container {
	position: relative;
	z-index: 1;
}
@media (max-width: 1400px) {
	.prestation-home__titlebar{
		top: 70%;
	}
}
/* Biseau gris à droite — visible uniquement quand il y a des gouttières (≥ 1400px).
   Même principe que le biseau blanc de la topbar. */
@media (min-width: 1400px) {
	.site-footer::after {
		content: '';
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: calc(50% - 450px);
    background: rgba(202, 202, 202, 0.3);
    clip-path: polygon(0% 100%, 20% 0%, 100% 0%, 100% 100%);
    pointer-events: none;
    z-index: 0;
	}
}

.site-footer__row {
	display: flex;
	align-items: center;
	gap: clamp(14px, 1.5vw, 20px);
	justify-content: space-between;
}

.site-footer__copyrightbar {
	background: var(--color-dark);
	color: var(--color-text-light);
	padding: 14px 0;
	font-size: var(--text-footer-copyright);
}

.copyrightbar__inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 8px;
	text-align: center;
}

.copyrightbar__brand {
	margin-right: 14px;
}

.copyrightbar__pages {
	margin-right: 14px;
}

.copyrightbar__sep {
	opacity: 0.65;
	padding: 0 6px;
}

.copyrightbar__link {
	color: inherit;
	text-decoration: none;
}

.copyrightbar__link:hover {
	text-decoration: underline;
}

.copyrightbar__text p {
	display: inline;
	margin: 0;
}

.site-footer__brand {
	flex: 0 0 auto;
	margin-right: clamp(16px, 3vw, 56px);
}

.site-footer__middle {
	flex: 1 1 auto;
	display: flex;
	align-items: stretch;
	justify-content: space-around;
	gap: clamp(16px, 2vw, 28px);
	min-width: 0;
}

.site-footer__socials {
	flex: 0 0 auto;
	margin-left: clamp(16px, 3vw, 56px);
}

.site-footer__logo img {
	display: block;
	max-width: 180px;
	width: 100%;
	height: auto;
}

.site-footer__logo-text {
	font-weight: 700;
	letter-spacing: 0.02em;
}

.site-footer__nav {
	flex: 0 1 auto;
	min-width: 0;
}

/* Variante simple: pages_en_footer = liste de pages */
.footer-links {
	column-count: 2;
	column-gap: 32px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.footer-links li {
	break-inside: avoid;
	margin: 0 0 0px;
}

.footer-links a {
	text-decoration: none;
	font-weight: 400;
	font-size: var(--text-footer-nav);
	color: inherit;
}

.footer-links a:hover {
	text-decoration: underline;
	color: inherit;
}

/* Variante colonnes: titre + liens dessous (si ACF repeater) */
.footer-columns-inline {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 14px 28px;
}

.footer-col-inline__title {
	margin: 0 0 8px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-size: var(--text-footer-kicker);
}

.footer-col-inline__links {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 6px;
}

.footer-col-inline__links a {
	text-decoration: none;
	opacity: 0.9;
}

.footer-col-inline__links a:hover {
	text-decoration: underline;
	opacity: 1;
}

.site-footer__separator-vertical {
	flex: 0 0 4px;
	align-self: stretch;
	height: auto;
	min-height: 0;
	background: #000;
}

.site-footer__contact {
	flex: 0 0 auto;
	display: grid;
	gap: 6px;
	line-height: 1.35;
}

.site-footer__company {
	font-weight: 600;
	font-size: var(--text-footer-contact);
	color: var(--color-primary);
	margin: 0;
}

.site-footer__address {
	font-weight: 400;
	font-size: var(--text-footer-contact);
	color: var(--color-primary);
	margin: 0;
}

.site-footer__address p,
.site-footer__address br {
	margin: 0;
}

.site-footer__address p {
	margin: 0;
}

.site-footer__meta-link {
	text-decoration: none;
	display: inline-block;
	width: fit-content;
	font-weight: 600;
	font-size: var(--text-footer-contact);
	color: var(--color-text);
}

.site-footer__meta-link:hover {
	text-decoration: underline;
}

.site-footer__socials {
	flex: 0 0 auto;
	display: grid;
	justify-items: end;
	gap: 10px;
}

.footer-socials {
	display: flex;
	gap: 10px;
	margin-bottom: 0;
}

.footer-socials a {
	width: 36px;
	height: 36px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #E12122;
	border-radius: 999px;
	text-decoration: none;
	color: #fff;
	transition: transform 0.15s ease, background 0.15s ease, filter 0.15s ease;
}

.footer-socials a i {
	color: currentColor;
}

.footer-socials a:hover {
	transform: translateY(-1px);
	filter: brightness(0.92);
}

.site-footer__copyright {
	margin: 0;
	text-align: right;
	opacity: 0.8;
}

@media (max-width: 991.98px) {
	.footer-links {
		column-count: 1;
	}

	.site-footer__row {
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		text-align: center;
	}

	.site-footer__middle {
		width: 100%;
		justify-content: center;
		flex-direction: column;
		align-items: center;
	}

	.site-footer__nav {
		width: 100%;
		margin-bottom: 30px;
	}

	.site-footer__separator-vertical {
		display: none;
	}

	.site-footer__socials {
		justify-items: center;
		margin-left: 0;
	}

	.site-footer__brand {
		margin-right: 0;
		margin-bottom: 30px;
	}

	.site-footer__contact {
		justify-items: center;
		margin-bottom: 30px;
	}

	.footer-socials {
		justify-content: center;
	}

	.site-footer__copyright { text-align: center; }
}

/* =========================================================
   10. HERO SLIDER
   ========================================================= */

.hero-slider {
	position: relative;
	width: 100%;
	height: calc(100vh - var(--topbar-height) - var(--nav-height-current, var(--nav-height)));
	min-height: 400px;
	overflow: hidden;
	background: var(--color-dark);
}

.hero-slider__track {
	position: relative;
	width: 100%;
	height: 100%;
}

/* ── Slide ── */

.hero-slider__slide {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	opacity: 0;
	transition: opacity 0.7s ease;
	display: flex;
	align-items: flex-end;
	padding-bottom: 10%;
}

.hero-slider__slide.is-active {
	opacity: 1;
	z-index: 1;
}

/* Lien couvre tout le slide */
.hero-slider__link {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: block;
	cursor: pointer;
}

/* ── Overlay sombre gauche ── */

.hero-slider__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		to right,
		rgba(0, 0, 0, 0.60) 0%,
		rgba(0, 0, 0, 0.30) 50%,
		rgba(0, 0, 0, 0.05) 100%
	);
	z-index: 1;
	pointer-events: none;
}

/* ── Biseau blanc transparent droite ── */

.hero-slider__bevel {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 38%;
	background: rgba(255, 255, 255, 0.13);
	clip-path: polygon(290px 0%, 100% 0%, 100% 100%, 0% 100%);
	z-index: 1;
	pointer-events: none;
}

/* ── Contenu texte ── */

.hero-slider__slide > .container {
	position: relative;
	z-index: 3;
}

.hero-slider__content {
	max-width: 580px;
}

.hero-slider__titre {
	font-family: var(--font-body);
	font-size: 70px;
	font-weight: 300;
	color: #ffffff;
	line-height: 1.2;
	text-transform: uppercase;
	margin: 0;
	text-shadow: 0 2px 16px rgba(0, 0, 0, 0.4);
}
.font18{
	font-size: 18px;

}
/* ── Flèches Font Awesome ── */

.hero-slider__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 4;
	background: none;
	border: none;
	color: #ffffff;
	font-size: 52px;
	line-height: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	padding: 0;
	opacity: 0.75;
	transition: opacity 0.2s ease;
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
}

.hero-slider__arrow:hover {
	opacity: 1;
}

.hero-slider__arrow--prev {
	left: 1.5rem;
}

.hero-slider__arrow--next {
	right: 1.5rem;
}

/* ── Dots ── */

.hero-slider__dots {
	position: absolute;
	bottom: 1.5rem;
	left: 50%;
	transform: translateX(-50%);
	z-index: 4;
	display: flex;
	gap: 0.5rem;
}

.hero-slider__dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	border: 2px solid rgba(255, 255, 255, 0.7);
	background: transparent;
	cursor: pointer;
	transition: background 0.2s ease, border-color 0.2s ease;
	padding: 0;
}

.hero-slider__dot.is-active {
	background: #ffffff;
	border-color: #ffffff;
}

@media (max-width: 991.98px) {
	.hero-slider {
		height: calc(100vh - var(--topbar-height) - var(--nav-height-mobile));
	}
}

@media (max-width: 767.98px) {
	.hero-slider__titre {
		font-size: clamp(24px, 6vw, 34px);
	}

	.hero-slider__bevel {
		display: none;
	}

	.hero-slider__arrow {
		font-size: 38px;
	}

	.hero-slider__arrow--prev {
		left: 0.5rem;
	}

	.hero-slider__arrow--next {
		right: 0.5rem;
	}
}

/* =========================================================
   11. SINGLE RÉALISATION
   ========================================================= */

/* ── Section principale ── */

.realisation-main {
	background: rgba(217, 217, 217, 0.37);
	padding: 4rem 0;
}

.realisation-main__row {
	align-items: flex-start;
	gap: 2rem 0;
}

@media (min-width: 992px) {
	.realisation-main__row {
		align-items: center;
	}
}

.realisation-main__infos {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.realisation-main__titre {
	font-size: 35px;
	font-style: normal;
	font-weight: 500;
	letter-spacing: 3.5px;
	text-transform: uppercase;
	color: var(--color-dark);
	margin: 0 0 8px;
	line-height: 1.1;
}

.realisation-main__sous-titre {
	color: #999;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 1.2px;
	text-transform: uppercase;
	margin: 0 0 10px;
}

.realisation-main__sep {
	border: none;
	width: 46px;
	height: 1px;
	background: #000;
	margin: 0 0 10px;
}

.realisation-main__pays {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	font-size: var(--text-md);
	font-weight: 500;
	color: var(--color-dark);
}

.realisation-main__flag {
	font-size: 24px;
	line-height: 1;
}

.realisation-main__desc {
	font-size: var(--text-md);
	line-height: 1.7;
	color: var(--color-text);
	margin-bottom: 25px;
}

.realisation-main__desc p {
	margin: 0 0 0.75rem;
}

.realisation-main__desc p:last-child {
	margin-bottom: 0;
}

.realisation-main__carte {
	margin: 0;
}

.realisation-main__carte img {
	width: 100%;
	height: auto;
	object-fit: cover;
}

.realisation-main__aside {
	display: flex;
	flex-direction: column;
	gap: 0;
	min-width: 0;
}

/* Stats dans la colonne droite */
.realisation-main__stats {
	background: var(--color-primary);
}

.realisation-main__stats .row {
	--bs-gutter-x: 0;
}

.realisation-main__stats .col-12:nth-child(1) .realisation-stat,
.realisation-main__stats .col-md-4:nth-child(1) .realisation-stat { background: #E43738; }

.realisation-main__stats .col-12:nth-child(2) .realisation-stat,
.realisation-main__stats .col-md-4:nth-child(2) .realisation-stat { background: #C02B2C; }

.realisation-main__stats .col-12:nth-child(3) .realisation-stat,
.realisation-main__stats .col-md-4:nth-child(3) .realisation-stat { background: #B91415; }

/* Galerie carrée (2 images côte à côte, sans gouttière) */
.realisation-gallery {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0;
	width: 100%;
	min-height: 0;
}

.realisation-gallery__item {
	display: block;
	position: relative;
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	cursor: zoom-in;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	min-width: 0;
	min-height: 0;
}

.realisation-gallery__item:focus-visible {
	outline: 2px solid var(--color-primary);
	outline-offset: -2px;
}

/* <img class="realisation-gallery__img"> */
.realisation-gallery__item > img.realisation-gallery__img {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	max-height: none;
	min-height: 0;
	object-fit: cover;
	object-position: center;
	display: block;
	transition: transform var(--transition);
}

/* <picture class="realisation-gallery__img"> + WebP */
.realisation-gallery__item > picture.realisation-gallery__img {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	overflow: hidden;
	margin: 0;
	line-height: 0;
	display: block;
	transition: transform var(--transition);
}

.realisation-gallery__item > picture.realisation-gallery__img img {
	width: 100%;
	height: 100%;
	max-width: none;
	max-height: none;
	min-width: 100%;
	min-height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}

.realisation-gallery__item:hover > img.realisation-gallery__img,
.realisation-gallery__item:hover > picture.realisation-gallery__img,
.realisation-gallery__item:focus-visible > img.realisation-gallery__img,
.realisation-gallery__item:focus-visible > picture.realisation-gallery__img {
	transform: scale(1.03);
}

/* Lightbox fiche réalisation */
.realisation-lightbox {
	position: fixed;
	inset: 0;
	z-index: 10000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1.5rem;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity var(--transition), visibility var(--transition);
}

.realisation-lightbox.is-open {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.realisation-lightbox__backdrop {
	position: absolute;
	inset: 0;
	margin: 0;
	padding: 0;
	border: 0;
	background: rgba(0, 0, 0, 0.88);
	cursor: pointer;
}

.realisation-lightbox__dialog {
	position: relative;
	z-index: 1;
	max-width: min(1200px, 100%);
	max-height: calc(100vh - 3rem);
	display: flex;
	align-items: center;
	justify-content: center;
}

.realisation-lightbox__img {
	display: block;
	max-width: 100%;
	max-height: calc(100vh - 3rem);
	width: auto;
	height: auto;
	object-fit: contain;
}

.realisation-lightbox__close {
	position: absolute;
	top: -2.5rem;
	right: 0;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	color: #fff;
	font-size: 2rem;
	line-height: 1;
	cursor: pointer;
	opacity: 0.85;
	transition: opacity var(--transition);
}

.realisation-lightbox__close:hover,
.realisation-lightbox__close:focus-visible {
	opacity: 1;
}

/* ── Blocs stats rouges (legacy — section pleine largeur retirée du template) ── */

.realisation-stats {
	background: transparent;
	padding: 2rem 0 0;
}

.realisation-stats__inner {
	background: var(--color-primary);
}

.realisation-stats__inner .row {
	--bs-gutter-x: 0;
}

.realisation-stat {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	padding: 75px 30px 75px 75px;
	height: 100%;
}

.realisation-main__stats .realisation-stat {
	padding: clamp(32px, 3.5vw, 56px) clamp(16px, 2vw, 28px) clamp(32px, 3.5vw, 56px) clamp(24px, 2.5vw, 48px);
}

/* Couleurs de fond par bloc (gauche → droite) */
.realisation-stats__inner .col-12:nth-child(1) .realisation-stat,
.realisation-stats__inner .col-md-4:nth-child(1) .realisation-stat { background: #E43738; }

.realisation-stats__inner .col-12:nth-child(2) .realisation-stat,
.realisation-stats__inner .col-md-4:nth-child(2) .realisation-stat { background: #C02B2C; }

.realisation-stats__inner .col-12:nth-child(3) .realisation-stat,
.realisation-stats__inner .col-md-4:nth-child(3) .realisation-stat { background: #B91415; }

.realisation-stat__picto {
	flex-shrink: 0;
	color: #ffffff;
	opacity: 1;
}

.realisation-stat__picto svg {
	display: block;
	max-height: 35px;
	width: auto;
	height: auto;
}

.realisation-stat__content {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
}

.realisation-stat__label {
	color: #FFF;
	font-size: 11px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	text-transform: uppercase;
}

.realisation-stat__value {
	color: #FFF;
	font-size: 15px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

.realisation-stat--puissance .realisation-stat__value {
	font-weight: 700;
}

@media (max-width: 767.98px) {
	.realisation-stat {
		padding: 75px 30px 75px 75px;
	}
}

/* ── Image bas de page ── */

.realisation-footer-img {
	padding-bottom: 2rem;
}

.realisation-footer-img__inner {
	position: relative;
	overflow: hidden;
	line-height: 0;
}

.realisation-footer-img__img {
	width: 100%;
	object-fit: cover;
	display: block;
}
.realisation-footer-img__img img {
width: 100%;
}
.realisation-footer-img__bevel {
	position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 35%;
  background: rgba(255, 255, 255, 0.4);
  clip-path: polygon(0% 0%, 51% 0%, 100% 100%, 0% 100%);
  pointer-events: none;
}

@media (max-width: 767.98px) {
	.realisation-main__stats .realisation-stat {
		padding: 40px 24px 40px 40px;
	}

	.realisation-main {
		padding: 2.5rem 0;
	}

	.realisation-main__titre {
		font-size: 28px;
	}
}

/* ── Shortcode [enersteel_realisations_grid] (maquette Réalisations / hover Seolis) ── */

.realisation-grid {
	width: 100%;
}

.realisation-grid__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0;
}

.realisation-grid__item {
	margin: 0;
	padding: 0;
	min-width: 0;
	/* Permet à la tuile de respecter le ratio malgré l’intrinsic min-height de l’image (grille CSS). */
	min-height: 0;
}

.realisation-grid__link {
	display: block;
	position: relative;
	overflow: hidden;
	aspect-ratio: 440 / 443;
	min-height: 0;
	color: #fff;
	text-decoration: none;
	-webkit-tap-highlight-color: transparent;
}

.realisation-grid__link:hover,
.realisation-grid__link:focus-visible {
	color: #fff;
	text-decoration: none;
}

.realisation-grid__media {
	position: absolute;
	inset: 0;
	display: block;
	overflow: hidden;
	z-index: 0;
}

/* <img class="realisation-grid__img"> (legacy) */
.realisation-grid__link .realisation-grid__media > img.realisation-grid__img {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	max-height: none;
	min-height: 0;
	object-fit: cover;
	object-position: center;
}

/* <picture class="realisation-grid__img"> + WebP (object-fit sur <picture> ne cible pas l’img) */
.realisation-grid__link picture.realisation-grid__img {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	overflow: hidden;
	margin: 0;
	line-height: 0;
}

.realisation-grid__link picture.realisation-grid__img img {
	max-width: inherit;
	object-fit: cover;
	object-position: center;
	display: block;
	min-width: 100%;
	min-height: 100%;
}

.realisation-grid__media--empty {
	background: #c8c8c8;
}

.realisation-grid__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: rgba(0, 0, 0, 0.5);
	transition: background var(--transition);
	pointer-events: none;
}

/* Triangle droit bas-droite : décalé de 5 % du bord droit et du bas */
.realisation-grid__corner {
	position: absolute;
	right: 5%;
	bottom: 5%;
	z-index: 2;
	width: min(28vw, 163px);
	height: min(23vw, 135px);
	background: var(--color-primary);
	clip-path: polygon(100% 0, 100% 100%, 0 100%);
	opacity: 0;
	transform: translate(6px, 6px);
	transition: opacity var(--transition), transform var(--transition);
	pointer-events: none;
}

@media (hover: hover) and (pointer: fine) {
	.realisation-grid__link:hover .realisation-grid__overlay,
	.realisation-grid__link:focus-visible .realisation-grid__overlay {
		background: rgba(0, 0, 0, 0.3);
	}

	.realisation-grid__link:hover .realisation-grid__corner,
	.realisation-grid__link:focus-visible .realisation-grid__corner {
		opacity: 1;
		transform: translate(0, 0);
	}
}

.realisation-grid__text {
	position: absolute;
	inset: 0;
	z-index: 3;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 1rem 0.75rem;
	pointer-events: none;
}

.realisation-grid__title {
	font-family: var(--font-heading);
	font-size: 35px;
	font-weight: 700;
	line-height: 1.1;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	margin: 0 0 0.35em;
	max-width: 100%;
}

.realisation-grid__meta {
	font-family: var(--font-body);
	font-size: 20px;
	font-weight: 500;
	line-height: 1.2;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	margin: 0;
	max-width: 100%;
}

@media (max-width: 991.98px) {
	.realisation-grid__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.prestation-home__titlebar {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		background: rgba(255, 255, 255, 0.7);
		z-index: 2;
		top: 75%;
		align-content: center;
		justify-content: center;
	}
}

@media (max-width: 575.98px) {
	.realisation-grid__list {
		grid-template-columns: 1fr;
	}
}

@media (prefers-reduced-motion: reduce) {
	.realisation-grid__overlay,
	.realisation-grid__corner {
		transition: none;
	}
}

/* =========================================================
   12. PAGE SUB HERO (sous-bandeau hors accueil : H1 + fil d’Ariane Yoast)
   ========================================================= */

.page-sub-hero {
	position: relative;
	width: 100%;
	padding: 80px 0;
	overflow: hidden;
}

.page-sub-hero__gradient {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 160px;
	background: rgba(239, 238, 238, 0.8);
	filter: blur(50px);
	pointer-events: none;
	z-index: 0;
	transform: translateY(-25%);
}

.page-sub-hero__inner {
	position: relative;
	z-index: 1;
	text-align: center;
}

.page-sub-hero__title {
	margin: 0 0 15px;
	padding: 0;
	color: #e12122;
	text-align: center;
	font-size: 55px;
	font-weight: 500;
	line-height: 45px;
	letter-spacing: 8.25px;
	text-transform: uppercase;
}

.page-sub-hero__breadcrumbs {
	color: #9f9f9f;
	text-align: center;
	font-size: 12px;
	font-weight: 400;
	line-height: 45px;
	letter-spacing: 0.96px;
	text-transform: uppercase;
}

.page-sub-hero__breadcrumbs a {
	color: inherit;
	text-decoration: none;
}

.page-sub-hero__breadcrumbs a:hover,
.page-sub-hero__breadcrumbs a:focus {
	text-decoration: underline;
}

.page-sub-hero__breadcrumbs #breadcrumbs,
.page-sub-hero__breadcrumbs .yoast-breadcrumbs,
.page-sub-hero__breadcrumbs span {
	color: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
}

/* =========================================================
   13. PRINT
   ========================================================= */

@media print {
	.site-header,
	.site-footer,
	.nav-burger,
	.nav-mobile {
		display: none;
	}

	a[href]::after {
		content: " (" attr(href) ")";
		font-size: 0.75em;
	}

	a[href^="#"]::after,
	a[href^="javascript:"]::after {
		content: "";
	}
}