@charset "utf-8";
/* Conserver ce commentaire pour adapter les sélecteurs de cette feuille de styles à Gutenberg - atelier-adapt-gutenberg */

/*============================================*\
#    Initialisation de la feuille de styles    #
\*============================================*/

/* VARIABLES */
:root{
/* COULEURS : */
	--couleur-blanc:#fff;			/* Blanc */
	--couleur-texte:#202f26;		/* Noir texte */
	--couleur-pale:#e9ecef;		/* Gris pâle */
	--couleur-principale:#68c924;	/* Couleur principale */
		--couleur-principale-txt:var(--couleur-texte);	/* Couleur principale */
	--couleur-profiles:#26beb9;	/* Couleur section Profilés Aluminium */
		--couleur-profiles-txt:var(--couleur-texte);	/* Couleur section Profilés Aluminium */
	--couleur-hydraulique:#c53738;	/* Couleur section Composants Hydraulique */
		--couleur-hydraulique-txt:var(--couleur-blanc);	/* Couleur section Composants Hydraulique */
	--couleur-pneumatique:#005464;	/* Couleur section Composants Pneumatiques */
		--couleur-pneumatique-txt:var(--couleur-blanc);	/* Couleur section Composants Pneumatiques */
	--couleur-automation:#ff9d00;	/* Couleur section Automation */
		--couleur-automation-txt:var(--couleur-texte);	/* Couleur section Automation */
/* STRUCTURE : */
	--dimStructure:11rem; /*............................... Dimension principale des éléments structurels du header*/
	--colH1:30vw; /*....................................... Largeur de la colonne du titre dans le header */
	--margesDefaut:3rem; /*................................ Espacement par défaut */
/* FORMULAIRES : champs */
	--form-input-bordColor:silver; /*.................... Couleur des contours de champs */
	--form-input-bordWidth:1px; /*......................... Épaisseur des contours de champs */
	--form-input-fondColor:white; /*..................... Couleur de fond des champs */
	--form-input-height:6rem; /*........................... Hauteur des champs */
/* FORMULAIRES : boutons */
	--form-bouton-bordColor:var(--couleur-principale); /*.. Couleur des contours de boutons */
	--form-bouton-bordWidth:2px; /*........................ Épaisseur des contours de boutons */
	--form-bouton-fondColor:transparent; /*.. Couleur des boutons et autres éléments interactifs */
	--form-bouton-textColor:var(--couleur-texte); /*.................... Couleur du texte des boutons */
/* FORMULAIRES : checkboxes/radio */
	--form-check-taille:3rem; /*........................... Taille des pastilles de checkboxes (entre autres) */
/* FORMULAIRES : autres */
	--outline:var(--couleur-texte) auto 2px;
	--outline-offset:2px;
	accent-color:var(--form-bouton-fondColor); /*.......... Couleur par défaut : checkbox, radio, range, progress */
/* ICÔNES : */
	--icon-dim:3.2rem; /*.................................. Largeur des pictos */
	--icon-couleur:currentColor; /*........................ Couleur des pictos */
	--icon-epaisseur:3px; /*............................... Épaisseur du trait */
	--icon-coins:round; /*................................. Aspect des coins : miter (pointus) ou round (arrondis) */
	--icon-extremites:round; /*............................ Aspect des extrémités : butt (droits), round (arrondis) ou square (droits + épaisseur) */
}
body:where(.single-post){ --colH1:50vw; }
@media(max-width:1440px){
	body{
		--dimStructure:8rem;
		--colH1:45vw;
		
		&:where(.single-post){ --colH1:60vw; }
	}
}
@media(max-width:980px){
	body{
		--dimStructure:6rem;
		--colH1:60vw;
		
		&:where(.single-post){ --colH1:80vw; }
	}
}
@media(max-width:600px){
	body{
		--dimStructure:5rem;
		--colH1:calc(100vw - var(--dimStructure) * 1.5 - var(--largScrollBar, 0));
	}
}

/* Global */
*,*::before,*::after{
	box-sizing:inherit;
	min-width:0;
	min-height:0;
}
html{
	box-sizing:border-box;
	font-size:62.5%;
	overflow-wrap:break-word;
	-webkit-text-size-adjust:100%;
	   -moz-text-size-adjust:100%;
		-ms-text-size-adjust:100%;
			text-size-adjust:100%;/*🧪Ajuste la taille du texte sur smartphone - https://developer.mozilla.org/en-US/docs/Web/CSS/text-size-adjust / https://caniuse.com/?search=text-size-adjust */
	-webkit-tap-highlight-color:transparent;/*[non-standard] Couleur de surlignage des liens cliqués - https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-tap-highlight-color */
	scroll-behavior:smooth;
	/* interpolate-size:allow-keywords;/*🧪Autorise les keywords (auto, min-content, fit-content...) dans les transitions - https://caniuse.com/?search=interpolate-size. Voir utilisation et alternative sur https://developer.chrome.com/docs/css-ui/animate-to-height-auto */
}
body{
	--largeur:calc(100vw - var(--largScrollBar,0) - (2 * var(--dimStructure))); /* Largeur de contenu maximale, adaptable sur différents supports */
	margin:0;
	color:var(--couleur-texte);
	font-family:Raleway,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
	font-size:1.6rem;
	line-height:1.5;
	min-height:100vh;
	background-color:var(--couleur-blanc);
}
html:not(.ready) *{ transition:none; /* Empêche les animations bizarres sur les liens, cf. scripts/main.js */ }


/* Blocs et structure */
p, address, ol, ul, dl, dt, dd{
	margin-top:0;
	margin-bottom:1em;
	text-wrap:pretty;
}
figure{ margin:0; }
nav ul, nav ol{
	padding:0;
	margin:0;
	list-style:none;
}
:where(.is-root-container) :is(ul,ol){
	--list-liLarg:0.4em; /* épaisseur des puces */
	--list-marg:0.4em; /* marge entre la puce et le texte */
	--list-shift:1em; /* décalage à gauche de la puce par rapport à l'alignement du texte */
	--list-olRatio:0.8; /* changement de taille de la numérotation */
	counter-reset:ol-count;
	list-style:none;
	padding:0;
}
:where(.is-root-container) :where(ul,ol) :is(ul, ol){ margin-bottom:0; }
:where(.is-root-container) ul{ padding-left:calc(var(--list-liLarg) + var(--list-marg) + var(--list-shift)); }
:where(.is-root-container) ol{ padding-left:calc((3ch * var(--list-olRatio)) + var(--list-marg)); }
:where(.is-root-container ul)>li{ text-indent:calc((var(--list-liLarg) + var(--list-marg)) * -1); }
:where(.is-root-container ol)>li{
	text-indent:calc(((3ch * var(--list-olRatio)) + var(--list-marg)) * -1);
	counter-increment:ol-count;
}
:where(.is-root-container) :where(ul,ol)>li::before{
	display:inline-block;
	margin:0 var(--list-marg) 0 0;
}
:where(.is-root-container ul)>li::before{
	content:"";
	background-color:var(--couleur-principale);
	width:var(--list-liLarg);
	height:var(--list-liLarg);
}
:where(.is-root-container ol)>li::marker{ content:none; }
:where(.is-root-container ol)>li::before{
	content:counter(ol-count) ".";
	color:var(--couleur-principale);
	font-weight:bolder;
	width:3ch;
	text-align:right;
	font-size:0.8em;
}
:where(.is-root-container) :where(ul,ol)>:where(li) *{ text-indent:0; }
blockquote{
	max-width:100%;
	margin-top:0;
	margin-bottom:1em;
}
details{ display:block; }
summary{ display:list-item; }
template, [hidden]{ display:none; }
hr{
	box-sizing:content-box;
	height:0;
	margin:1.5em 0;
	overflow:visible;
	clear:both;
	color:inherit;
	border:0;
	border-top:1px solid currentColor;
}

/* Titres */
/* ⚠ Si le margin-top ou les font-size sont modifiés, penser à les changer également dans le contexte titres × colonnes ci-après */
h1,h2,h3,h4,.h1,.h2,.h3,.h4{
	line-height:1.1;
	margin:2em auto 1em 0;
	text-wrap:balance;
}
h1:not(:where(.h2,.h3,.h4,.h5,.h6)),.h1{
	font-size:clamp(2.4rem, 4vw, 5rem);
	font-weight:bold;
}
h2:not(:where(.h1,.h3,.h4,.h5,.h6)),.h2{
	font-size:clamp(2.2rem, 3.1vw, 4rem);
	color: var(--couleur-principale);
}

h3:not(:where(.h1,.h2,.h4,.h5,.h6)),.h3{
	font-size:clamp(2rem, 1.9vw, 2.4rem);
	font-weight:bold;
	text-transform: uppercase;
	color: var(--couleur-principale);
}
h4:not(:where(.h1,.h2,.h3,.h5,.h6)),.h4{ font-size:1.5em;}
/* Marges titres × colonnes */
.wp-block-columns:has( .wp-block-column > :is(h2,.h2):first-child){ margin-top:calc(2 *  3  * 1em); } /* calc(margin-top * font-size * unité) */
.wp-block-columns:has( .wp-block-column > :is(h3,.h3):first-child){ margin-top:calc(2 *  2  * 1em); }
.wp-block-columns:has( .wp-block-column > :is(h4,.h4):first-child){ margin-top:calc(2 * 1.5 * 1em); }
:where(.wp-block-columns > .wp-block-column) > :is(h1,h2,h3,h4,.h1,.h2,.h3,.h4):first-child{ margin-top:0; }


@media (min-width:980px){
	h2:not(:where(.h1,.h3,.h4,.h5,.h6)),.h2{
		margin-right:40%;

		.wp-block-column &{ margin-right:0; }
	}
}

/* Inline */
b, strong{ font-weight:bolder; }
abbr[title]{
	text-decoration:underline dotted;
	border-bottom:none;
	cursor:help;
}
sub, sup{
	position:relative;
	font-size:0.75em;
	line-height:0;
	vertical-align:baseline;
}
sub{ bottom:-0.25em; }
sup{ top:-0.5em; }
small,
.details{
	font-size:80%;
	opacity:0.8;
}

/* Liens et ancres */
a{
	color:var(--couleur-principale);
	background-color:transparent;
}
[id]{ scroll-margin-top:1em; /* "Décolle" la cible d'une ancre lors d'un scroll */ }

/* Medias */
img, svg{
	height:auto;
	max-width:100%;
	vertical-align:middle;
	object-fit:cover;
	object-position:center center;
	border-style:none;
}
svg:not([fill]){ fill:currentColor; }
svg:not(:root){ overflow:hidden; }
video,
iframe{
	height:auto;
	max-width:100%;
	vertical-align:middle;
	border-style:none;
}
/*img[width][height], svg[width][height],
video[width][height],
embed[width][height],
iframe[width][height]{ aspect-ratio:attr(width) / attr(height); }*/
audio,
canvas{ vertical-align:middle; }

/* Éléments "techniques" */
pre, code, kbd, samp{
	font-family:monospace;
	font-size:1em;
}
pre{
	max-width:100%;
	margin-top:0;
	margin-bottom:1em;
	overflow:auto;
	line-height:normal;
	tab-size:2;
	white-space:pre-wrap;
}
code{ max-width:100%; }

/* Tableaux */
table{
	margin-bottom:1.5em;
	vertical-align:top;
	border-collapse:collapse;
}
td{ max-width:100%; }

/* Classes utilitaires */
@media not print{
	.print-only, .printOnly, .printonly{ display:none !important; }
}
.clearfix{ display:flow-root; }
:is(.no-marges, .noMarges, .nomarges) > :first-child{ margin-top:0; }
:is(.no-marges, .noMarges, .nomarges) > :last-child{ margin-bottom:0; }

/* Icônes */
:is(.atelier-icone,.atelier-icon) svg,
svg:is(.atelier-icone,.atelier-icon){
	overflow:visible;
	object-fit:contain;
	fill:none;
	stroke-miterlimit:10;
	width:var(--icon-dim);
	height:var(--icon-dim);
	stroke:var(--icon-couleur);
	stroke-width:var(--icon-epaisseur);
	stroke-linejoin:var(--icon-coins);
	stroke-linecap:var(--icon-extremites);
	transition:stroke 0.3s ease-out;
}
/* -menu / -menu-alt */
:is(.atelier-icon-menu,.atelier-icon-menu-alt) line{
	transform-origin:center center;
	transition:0.3s ease-out;
	transition-property:opacity, transform, stroke, stroke-width;
}
.atelier-icon-menu line:where(:nth-child(1)){ transform:translateY(calc((32px - var(--icon-epaisseur)) * -0.5)); }
.atelier-icon-menu line:where(:nth-child(4)){ transform:translateY(calc((32px - var(--icon-epaisseur)) * 0.5)); }
.atelier-icon-menu-alt line:where(:nth-child(1)){ transform:translateY(calc(var(--icon-epaisseur) * -2)); }
.atelier-icon-menu-alt line:where(:nth-child(4)){ transform:translateY(calc(var(--icon-epaisseur) * 2)); }
:where([aria-expanded="true"]) :is(.atelier-icon-menu,.atelier-icon-menu-alt) line:where(:nth-child(1),:nth-child(4)){ transform:translateY(0); opacity:0; }
:where([aria-expanded="true"]) :is(.atelier-icon-menu,.atelier-icon-menu-alt) line:where(:nth-child(2)){ transform:rotate(-45deg); }
:where([aria-expanded="true"]) :is(.atelier-icon-menu,.atelier-icon-menu-alt) line:where(:nth-child(3)){ transform:rotate(45deg); }

/*===============*\
#    Structure    #==================================================================================================================================
\*===============*/
.site-header,
.site-content,
.site-footer{
	display:flow-root;
	position:relative;
}
.scrolledHeader .site-header{
	/*position:sticky;*/
	top:0;
	left:0;
	right:0;
	/*transform:translateY(-100%);
	transition:none;*/
}
/*.scrolledHeaderToTop .site-header{
	transform:translateY(0%);
	transition:transform 0.3s ease-out;
}*/
.site-header{ z-index:2; }
.site-content,
.site-footer{ z-index:1; }
.site-content{ margin-inline:var(--dimStructure); }
.container,
.alignfull > .wp-block-group__inner-container{
	width:var(--largeur);
	max-width:100%;
	margin-inline:auto;
}
#page{ overflow-x:clip; }

/* Pager */
.nav-links{
	--icon-dim:1em;
	--gap:0.5em;
	display:flex;
	align-items:center;
	justify-content:center;
	text-align:center;
	font-size:2rem;
	gap:var(--gap);
	padding:var(--gap);
}
.nav-links > *{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	text-decoration:none;
	color:inherit;
	min-width:2em;
	padding:0.4em;
	height:2em;
	line-height:1;
	background-color:var(--couleur-pale);
}
.nav-links > .current{
	background:var(--couleur-principale);
	color:var(--couleur-blanc);
}

/* Motif de fond en "+" */
:where(.bg-motif-fonce,.bg-motif-clair){
	background:repeat center center / 114px 114px;
}
:where(.bg-motif-fonce){
	background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 114 114" fill="none" stroke="%23c6cecb" stroke-miterlimit="10" opacity=".2"><path d="M57 49.5v15"/><path d="M64.5 57h-15"/></svg>');
	background-color:var(--couleur-texte);
}
:where(.bg-motif-clair){
	background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 114 114" fill="none" stroke="%23c6cecb" stroke-miterlimit="10"><path d="M57 49.5v15"/><path d="M64.5 57h-15"/></svg>');
	background-color:var(--couleur-pale);
}
.mobile-menu-backdrop,
.header-search::backdrop{
	backdrop-filter:blur(5px);
	background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 114 114" fill="none" stroke="%23c6cecb" stroke-miterlimit="10" opacity=".2"><path d="M57 49.5v15"/><path d="M64.5 57h-15"/></svg>') repeat center center / 114px 114px rgb(from var(--couleur-texte) r g b / 0.9);
}



.message{
	--msg-couleur:var(--couleur-texte);
	padding:1em calc(1em + 0.5lh);
	border-left:5px solid var(--msg-couleur);
	background-color:rgb(from var(--msg-couleur) r g b / 0.1);
	width:max-content;
	max-width:min(80ch,100%);
}
.message > *:first-child{ margin-top:0; }
.message > *:last-child{ margin-bottom:0; }

/* Colonnes /*
#== Classes utilitaires ==============================================================================================================#
	• grid-section : crée des colonnes pour les viewports > 980px (par défaut)
	• grid-section12 : idem, mais les proportions sont indiquées différemment

   RESPONSIVE
	• grid-large : empile les blocs pour les viewports de largeur inférieure à 1440px au lieu de 980px
	• grid-small : empile les blocs pour les viewports de largeur inférieure à 600px au lieu de 980px

   RÉPARTITION
	• v-align-… : alignement vertical des colonnes (par défaut, étirées).
		v-align-top : alignées en haut
		v-align-center : colonnes centrées
	• h-align-… : répartition horizontale des colonnes (par défaut, espacées).
		h-align-left : alignées à gauche
		h-align-center : centrées
		h-align-right : alignées à droite

   MARGES
	• --cols-gap : espacement entre les colonnes

   COLONNES IRRÉGULIÈRES
    • --cols-prop (si .grid-section) : proportions des colonnes entre elles (par défaut 1fr 1fr)
    • --col-prop12 (si .grid-section12) : proportions des colonnes, par rapport à une grille de 12 colonnes (par défaut 6)

   GRILLE AUTOMATIQUE
	• grid-auto : crée des colonnes de largeur égale à --cols-larg et les répartit sur plusieurs lignes si besoin
	• grid-auto-fill : la largeur des colonnes peut s'agrandit de façon à remplir la fraction complète
	• --cols-larg : largeur d'une colonne (par défaut 300px), largeur minimale si .grid-auto-fill
*/
.grid-section,
.grid-section12,
.grid-auto,
.grid-auto-fill{
	--cols-gap:var(--margesDefaut);
	display:grid;
	gap:var(--cols-gap);
	justify-content:center;
	position:relative;
	grid-auto-flow:dense;
}
.grid-section{
	--cols-prop:1fr 1fr;
	grid-template-columns:var(--cols-prop);
}
.grid-section12{ grid-template-columns:repeat(12, 1fr); }
.grid-section12 > *{
	--col-prop12:6;
	grid-column:span var(--col-prop12);
}
.grid-auto,
.grid-auto-fill{
	--cols-larg:300px;
	grid-template-columns:repeat(auto-fill, var(--cols-larg));
}
.grid-auto-fill{ grid-template-columns:repeat(auto-fill, minmax(var(--cols-larg),1fr)); }
@media(max-width:1440px){
	:is(.grid-section,.grid-section12):where(.grid-large){ grid-template-columns:1fr; }
	:is(.grid-section,.grid-section12):where(.grid-large) > *{ grid-column:1; }
}
@media(max-width:980px){
	:is(.grid-section,.grid-section12):not(:where(.grid-small,.grid-large)){ grid-template-columns:1fr; }
	:is(.grid-section,.grid-section12):not(:where(.grid-small,.grid-large)) > *{ grid-column:1; }
}
@media(max-width:600px){
	:is(.grid-section,.grid-section12):where(.grid-small){ grid-template-columns:1fr; }
	:is(.grid-section,.grid-section12):where(.grid-small) > *{ grid-column:1; }
}
.v-align-top{ align-items:flex-start; }
.v-align-center{ align-items:center; }
.h-align-left{ justify-content:flex-start; }
.h-align-center{ justify-content:center; }
.h-align-right{ justify-content:flex-end; }







 
/*=================*\
#    Formulaires    #
#-------------------#
#    Classes utilitaires :
#    .form-optionnel : mention "optionnel" près d'un champ (à préférer au "*" obligatoire)
#    .switch : sur un <input type="checkbox/radio">, change l'aspect visuel
#    Structure d'une ligne classique :
#    <div class="form-ligne">
#    	<label class="form-label" for="champ_XXX">Nom du champ</label>
#    	<div class="form-champ">
#    		<input id="champ_XXX" ... />
#    	</div>
#    </div>
\*=================*/

/*==== Champs ===================================================================================*/
button,
input:where(:not([type="checkbox"]):not([type="radio"])),
::file-selector-button,
.bouton, .wp-block-button__link, .form--file-bouton,
textarea,
select,
optgroup{
	max-width:100%;
	height:auto;
	margin:0;
	overflow:visible;
	color:inherit;
	font:inherit;
	letter-spacing:inherit;
	text-transform:none;
	vertical-align:middle;
	background:none;
	appearance:none;
}

/* Empêche le zoom au double-tap */
a,
area,
button,[role="button"],
input:where(:not([type="range"])),
label,
select,
summary,
textarea,
[tabindex]{ touch-action:manipulation; }

/* Placeholder */
::placeholder,
:where(.form-labelInside) label{
	color:inherit;
	font-style:italic;
	opacity:0.8;
}

/*==== BOUTONS ====*/
/* Outline sur le faux bouton de .form-fileInput */
:where(.form-fileInput [type="file"]:focus-visible) + .form--file-bouton{
	outline:var(--outline);
	outline-offset:var(--outline-offset);
}
/* Tous les boutons */
button:where(:not(.slider-nav)),
[type="button"]:where(:not(.slider-nav)),
[type="reset"],
[type="submit"],
::file-selector-button,
.bouton, :is(a, button, input).wp-block-button__link, .form--file-bouton{
	display:inline-block;
	align-content:center;
	line-height:1.2;
	padding:1em calc(1em + 0.5lh);
	color:var(--form-bouton-textColor);
	border:var(--form-bouton-bordWidth) solid var(--form-bouton-bordColor);
	cursor:pointer;
	overflow:visible;
	user-select:none;
	text-decoration:none;
	transition:0.3s ease-out;
	transition-property:color, background-color, border-color;
	text-transform:uppercase;
	position:relative;
	background:var(--form-bouton-fondColor);

	/* Boutons contenant une icône et/ou du texte pour screen reader */
	&:where(:has(svg:only-child)){
		padding:calc(var(--icon-dim) * 0.5);
	}

	/* Survol et focus */
	:is(&):where(:not(:disabled)):is(:hover,:focus-visible){
		--form-bouton-fondColor:var(--couleur-principale);
	}
}
:where([type="file"]:where(:not(:disabled)):is(:hover,:focus-visible))::file-selector-button,
:where(.form-fileInput [type="file"]:where(:not(:disabled)):is(:hover,:focus-visible)) + .form--file-bouton{
	--form-bouton-fondColor:var(--couleur-principale);
}
:is(a, button, input).wp-block-button__link{
	--form-bouton-fondColor:var(--couleur-principale);
	background:white;
	min-height:var(--form-input-height);
	padding-right:calc(1em + 0.5lh + var(--form-input-height));
	box-shadow:inset calc(var(--form-input-height) * -1 - 1px) 0 0 -1px var(--form-bouton-fondColor);
	height:auto;

	&::before,
	&::after{
		content:"";
		border:0.1em none var(--couleur-blanc);
		border-right-style:solid;
		display:block;
		position:absolute;
		inset:auto auto calc(50% - 0.5em) calc(100% - var(--form-input-height) * 0.5 - 0.5em);
		width:1em;
		height:1em;
		font-size:2rem;
	}
	&::before{
		border-top-style:solid;
		margin:0;
		transition:margin 0.3s ease-out;
	}
	&::after{
		width:0;
		transform-origin:center bottom;
		transform:rotate(45deg);
		margin:0 0 0 -0.05em;
		transition:height 0.3s ease-out;
	}
	&:where(:hover,:focus-visible){
		background:var(--form-bouton-fondColor);
		&::before{
			margin:0 0 0.38em 0.38em;
		}
		&::after{
			height:1.5em;
		}
	}
}

/*==== CHAMPS DE TYPE TEXTE ====*/
[type="date"],
[type="datetime-local"],
[type="email"],
[type="month"],
[type="number"],
[type="password"],
[type="search"],
[type="tel"],
[type="text"],
[type="time"],
[type="url"],
[type="week"],
textarea,
select,
:where(.form-labelInside) label{
	vertical-align:middle;
	padding-block:calc((var(--form-input-height) - 2*var(--form-input-bordWidth) - 1lh)*0.5); /* hauteur - 2*bordure - line-height */
	padding-inline:calc(0.5em + 0.5lh);
	width:100%;
	height:var(--form-input-height);
	min-height:var(--form-input-height);
	border:var(--form-input-bordWidth) solid var(--form-input-bordColor);
	background-color:var(--form-input-fondColor);
}

/* TEXTAREA */
textarea{
	--textarea-lines:2;
	overflow:auto;
	resize:vertical;
	vertical-align:top;
	white-space:pre-wrap;
	height:calc(var(--form-input-height) + var(--textarea-lines) * 1lh); /* hauteur + (lignes-1)*line-height */
}
textarea[rows]{ --textarea-lines:attr(rows); }

/* NUMBER */
[type="number"]{ appearance:textfield; } /* Firefox : conversion en apparence textfield pour retirer les flèches mal gérées */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button{
	-moz-appearance:textfield;
	appearance:none;
	height:auto;
}

/* RECHERCHE */
[type="search"]::-webkit-search-decoration,
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-results-button,
[type="search"]::-webkit-search-results-decoration {
	appearance:none; /* macOS Chrome et Safari : retire le padding */
	display:none; /* Supprime le 'x' à droite du champ quand du texte est entré */
}

/* COULEUR */
[type="color"]{
	background:none;
	width:var(--form-check-taille);
	height:var(--form-check-taille);
	border:none;
	padding:0;
}
[type="color"]::-webkit-color-swatch-wrapper{ padding:0; }
/* NB : dupliquer le code pour -webkit et -moz- ci-après */
[type="color"]::-webkit-color-swatch{
	border:none;
	border-radius:50%;
}[type="color"]::-moz-color-swatch{
	border:none;
	border-radius:50%;
}

/* RANGE */
[type="range"]{
	-webkit-appearance:none;
	appearance:none;
	width:100%;
	outline:none;
}
[type="range"]::-webkit-slider-thumb{ /* (curseur pour WebKit/Blink) */
	-webkit-appearance:none;
	appearance:none;
	margin-top:calc(var(--form-check-taille)/-3 - var(--form-input-bordWidth));
	height:var(--form-check-taille);
	width:var(--form-check-taille);
	border:none;
	border-radius:50%;
	background-color:var(--form-bouton-fondColor);
	cursor:ew-resize;
}
[type="range"]:focus::-webkit-slider-thumb{ outline:auto 5px -webkit-focus-ring-color; }
[type="range"]::-moz-range-thumb{ /* (curseur pour Firefox) */
	-webkit-appearance:none;
	appearance:none;
	margin-top:calc(var(--form-check-taille)/-3 - var(--form-input-bordWidth));
	height:var(--form-check-taille);
	width:var(--form-check-taille);
	border:none;
	border-radius:50%;
	background-color:var(--form-bouton-fondColor);
	cursor:ew-resize;
}
[type="range"]:focus::-moz-range-thumb{ outline:auto; }
[type="range"]::-webkit-slider-runnable-track {
	width:100%;
	height:calc(var(--form-check-taille)/3);
	background-color:var(--form-input-fondColor);
	border:var(--form-input-bordWidth) solid var(--form-input-bordColor);
	border-radius:var(--form-check-taille);
}
[type="range"]::-moz-range-track {
	width:100%;
	height:calc(var(--form-check-taille)/3);
	background-color:var(--form-input-fondColor);
	border:var(--form-input-bordWidth) solid var(--form-input-bordColor);
	border-radius:var(--form-check-taille);
}

/* DATES */
[type="date"]::-webkit-inner-spin-button,
[type="time"]::-webkit-inner-spin-button{ appearance:none; }

/* SELECT */
select:not([multiple]){
	padding-right:calc(var(--form-input-height) + 1em);
	border-radius:0;
	background:url("icon.php?i=navB") no-repeat right calc(var(--form-input-height)*0.25) center / calc(var(--form-input-height)*0.5),
	linear-gradient(var(--form-input-fondColor), var(--form-input-fondColor)) no-repeat right top / var(--form-input-height) var(--form-input-height),
	var(--form-input-fondColor);
	height:var(--form-input-height);
}
select:where([multiple]){
	height:auto;
	max-height:none;
	overflow-y:scroll;
	padding:0;
	border:var(--form-input-bordWidth) solid var(--form-input-bordColor);
	background-color:var(--form-input-fondColor);
}
select:where([multiple]) option{
	padding:0.5em 1em;
	margin:var(--form-bouton-bordWidth);
}
:where(select[multiple]) option:checked{
	color:var(--form-bouton-textColor);
	background-color:var(--form-bouton-fondColor);
}

/* CHECKBOX / RADIO */
[type="checkbox"],
[type="radio"]{
	margin:0 0.3em 0 0;
	padding:0;
	appearance:none;
	vertical-align:middle;
	cursor:pointer;
	display:inline-block;
}
:is([type="checkbox"],[type="radio"]):not(.switch){
	width:var(--form-check-taille);
	height:var(--form-check-taille);
	border:var(--form-input-bordWidth) solid var(--form-input-bordColor);
}
[type="radio"]:not(.switch),
[type="radio"]:not(.switch)::before{ border-radius:50%; }
:is([type="checkbox"],[type="radio"]):not(.switch)::before{
	--form-check-marge:4px;
	content:"";
	background-color:var(--form-bouton-fondColor);
	display:block;
	width:calc(100% - var(--form-check-marge) * 2);
	height:calc(100% - var(--form-check-marge) * 2);
	margin:var(--form-check-marge);
	transform:scale(0);
	transition:transform .1s ease-out;
}
[type="checkbox"]:not(.switch):checked::before,
[type="radio"]:not(.switch):checked::before{ transform:scale(1); }
:is(.wpcf7-checkbox,.wpcf7-radio,.gfield_checkbox,.gfield_radio){
	display:flex;
	flex-wrap:wrap;
	gap:1em;
}
.form-list :is(.wpcf7-checkbox,.wpcf7-radio,.wpcf7-list-item,.gfield_checkbox,.gfield_radio,.gchoice){
	display:block;
	margin-bottom:1em;
}
.wpcf7-list-item label:where(:has(input):has(.wpcf7-list-item-label)),
.gchoice label:where(:has(input):has(.gform-field-label)){
	display:flex;
	flex-wrap:nowrap;
	align-items:flex-start;
}
.wpcf7-list-item label:where(:has(input):has(.wpcf7-list-item-label)) input,
.gchoice label:where(:has(input):has(.gform-field-label)) input{
	flex:0 0 auto;
}
.wpcf7-list-item label:where(:has(input):has(.wpcf7-list-item-label)) .wpcf7-list-item-label,
.gchoice label:where(:has(input):has(.gform-field-label)) .gform-field-label{
	flex:1 1 auto;
	line-height:1.2;
	padding-block:calc((var(--form-check-taille) - 1.2em)/2);
}

/* Aspect "switch" */
.switch {
	border-radius:var(--form-check-taille);
	width:calc(var(--form-check-taille)*2);
	height:var(--form-check-taille);
	line-height:var(--form-check-taille);
	font-size:calc(var(--form-check-taille) * 0.4);
	box-shadow:inset calc(var(--form-check-taille) * -1) 0 0 var(--form-bouton-bordWidth) currentColor,
	           inset 0 0 0 var(--form-bouton-bordWidth) currentColor;
	transition:box-shadow .3s ease-out;
	background-color:#fff;
}
.switch:checked {
	box-shadow:inset var(--form-check-taille) 0 0 var(--form-bouton-bordWidth) var(--couleur-principale),
	           inset 0 0 0 var(--form-bouton-bordWidth) var(--couleur-principale);
}
.switch::before,
.switch::after {
	font-weight:bold;
	color:#fff;
}
.switch::before {
	content:"✕";
	float:right;
	margin-right:calc(var(--form-check-taille) * 0.4);
}
.switch:checked::before {
	content:"✓";
	float:left;
	margin-left:calc(var(--form-check-taille) * 0.4);
}

/* FICHIERS */
::file-selector-button{
	margin-right:0.25em;
}
/* Pour utiliser cet aspect, le champ doit être dans un élément contenant la classe .form-fileInput */
.form-fileInput{
	display:inline-block;
	position:relative;
}
.form-fileInput [type="file"]{
	position:absolute;
	inset:0;
	opacity:0;
	z-index:1;
	overflow:hidden;
}

/* AUTRES CHAMPS */
progress{
	display:inline-block;
	width:100%;
	vertical-align:baseline;
}
output{ display:inline-block; }

/*==== Structure ================================================================================*/
fieldset{
	padding:0;
	border:1px solid var(--form-input-bordColor);
}
legend{
	display:table;
	max-width:100%;
	padding:0 0.5em;
	color:inherit;
	white-space:normal;
	border:0;
}
label{
	display:inline-block;
	cursor:pointer;
}
.form-ligne:where(:not(.wp-block-column)){ margin-block:var(--margesDefaut); }
.form-optionnel{
	font-size:0.8em;
	color:limegreen;
}
.form-label{
	display:block;
	margin:0 auto 0.5em 0;
	inline-size:fit-content;
}

/* Éléments inactifs */
:disabled{
	opacity:0.7;
	cursor:not-allowed;
}

/* .form-labelInside : le label contenu dans le bloc se comporte comme un placeholder et se déplace lorsque le champ est focus ou renseigné */
.form-labelInside{
	position:relative;
	padding-top:calc(var(--form-input-height) / 2);
}
.form-labelInside label{
	position:absolute;
	top:calc(var(--form-input-height) / 2);
	border-color:transparent;
	background:none;
	margin:0;
	transition:0.3s ease-out;
	transition-property:padding, opacity, font-size, font-style, top;
	pointer-events:none;
}
.form-labelInside label::after{
	content:" :";
	opacity:0;
	transition:opacity 0.3s ease-out;
}
.form-labelInside:is(:not(:has(input:placeholder-shown)),:has(input:focus)) label{
	padding:0;
	font-size:0.8em;
	opacity:1;
	font-style:normal;
	top:0;
}
.form-labelInside:is(:not(:has(input:placeholder-shown)),:has(input:focus)) label::after{opacity:1;}

/* Contact Form 7 */
.wpcf7-response-output:not(:empty){
	border:1px solid silver;
	border-left:4px solid currentColor;
	padding:1em 2em;
	margin:2em 0;
	background-color:white;
}
input.wpcf7-not-valid{color:red;}
.wpcf7-not-valid-tip{
	color:red;
	font-size:0.8em;
	display:block;
}

/* Badge Invisible reCaptcha */
.grecaptcha-badge{z-index:3;}


/* Protection des emails (effet visuel uniquement, protection réelle via php/js) */
a[data-class="atelier-emph"]:not(.done) .emphrplc{filter:blur(0.2em);}

.acf-actions a{ text-decoration:none; }

/* RGPD Youtube et ACF map */
.youtube-iframe-rgpd,
.youtube-iframe-axeptio,
.acf-map,
.osm-map{
	overflow:hidden;
	position:relative;
}
.acf-map,
.osm-map{
	width:100%;
	height:400px;
}
.youtube-iframe-rgpd::before,
.youtube-iframe-axeptio::before{
	content:"";
	display:block;
	padding-top:56.25%;
}
.youtube-iframe-rgpd > *,
.youtube-iframe-axeptio > *,
.acf-map.inactive > *{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
.youtube-iframe-rgpd-vignette,
.youtube-iframe-axeptio-vignette{
	background:no-repeat center center / contain #000;
	filter:blur(10px);
}
.acf-map-rgpd-vignette,
.acf-map-axeptio-vignette{
	background:linear-gradient(120deg,#9cc0f9 0%,#e8eaed 12%,#e8eaed 88%,#b4dfc0 100%) #e8eaed;
}
.youtube-iframe-rgpd-inner,
.youtube-iframe-axeptio-inner,
.acf-map-rgpd-inner,
.acf-map-axeptio-inner{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	padding:1em 2em;
}
.youtube-iframe-rgpd-inner,
.youtube-iframe-axeptio-inner{
	background:rgba(0,0,0,0.8);
	color:#fff;
	--couleur-texte:#fff;

	& *{ color:inherit; }
}

.acf-map .acf-map-rgpd-inner,
.acf-map .acf-map-axeptio-inner{
	position:relative;
	background:rgba(0,0,0,0.15);
	color:#000;
}
.acf-map:not(.inactive) img,
.acf-map:not(.inactive) button{
	max-width:inherit;
	object-fit:inherit;
	background:inherit;
	padding:inherit;
	display:inherit;
	cursor:inherit;
}
.acf-map .marker{ display:none; }

.leaflet-container{
	font-size:1.2rem;
}
.leaflet-container .leaflet-marker-pane img{
	filter:drop-shadow(0px 0px 4px rgba(0,0,0,0.3));
}


/*============*\
#    FORMES    #
\*============*/
/* Triangles */
.shape-triangle{
	--shape-angle:0deg;
	height:var(--icon-dim);
	aspect-ratio:cos(30deg);
	clip-path: polygon(0% 0%, 100% 50%, 0% 100%);
	transform-origin:center;
	transform:rotate(var(--shape-angle));
}
.shape-triangle-circ{
	--shape-angle:90deg;
	--shape-padd:calc(0.5 * var(--icon-dim) - cos(45deg) * 0.5 * var(--icon-dim));
	--shape-color:#fff;
	aspect-ratio:1;
	width:var(--icon-dim);
	border-radius:50%;
	padding:var(--shape-padd);
}
.shape-triangle-circ::before{
	content:"";
	display:block;
	background-color:var(--shape-color);
	width:calc(var(--icon-dim) - var(--shape-padd) * 2);
	height:calc(var(--icon-dim) - var(--shape-padd) * 2);
	clip-path: polygon(
		calc(50% + 50% * sin(var(--shape-angle) + (0 * 360deg) / 3))
		calc(50% + 50% * cos(var(--shape-angle) + (0 * 360deg) / 3)),
		calc(50% + 50% * sin(var(--shape-angle) + (1 * 360deg) / 3))
		calc(50% + 50% * cos(var(--shape-angle) + (1 * 360deg) / 3)),
		calc(50% + 50% * sin(var(--shape-angle) + (2 * 360deg) / 3))
		calc(50% + 50% * cos(var(--shape-angle) + (2 * 360deg) / 3))
	);
}
/* Hexagones */
.shape-hex{
	height:var(--icon-dim);
	aspect-ratio:1/cos(30deg);
	clip-path:polygon(50% -50%, 100% 50%, 50% 150%, 0% 50%);
	padding-inline:calc(1 / cos(30deg) * 0.25 * var(--icon-dim));
}
.shape-hexalt{
	width:var(--icon-dim);
	aspect-ratio:cos(30deg);
	clip-path:polygon(-50% 50%, 50% 0%, 150% 50%, 50% 100%);
	padding-block:calc(1 / cos(30deg) * 0.25 * var(--icon-dim));
}
.shape-hex.shift{ margin-inline:calc(1 / cos(30deg) * -0.25 * var(--icon-dim)); }
.shape-hexalt.shift{ margin-block:calc(1 / cos(30deg) * -0.25 * var(--icon-dim)); }
/* Étoiles */
.shape-star{
	--shape-angle:180deg;
	--shape-inner:30%;
	width:var(--icon-dim);
	height:var(--icon-dim);
	clip-path: polygon(
		calc(50% + 50% * sin(var(--shape-angle) + (0 * 360deg) / 5))
		calc(50% + 50% * cos(var(--shape-angle) + (0 * 360deg) / 5)),
		calc(50% + calc(50% - var(--shape-inner)) * sin(var(--shape-angle) + (0 * 360deg + 180deg) / 5))
		calc(50% + calc(50% - var(--shape-inner)) * cos(var(--shape-angle) + (0 * 360deg + 180deg) / 5)),
		calc(50% + 50% * sin(var(--shape-angle) + (1 * 360deg) / 5))
		calc(50% + 50% * cos(var(--shape-angle) + (1 * 360deg) / 5)),
		calc(50% + calc(50% - var(--shape-inner)) * sin(var(--shape-angle) + (1 * 360deg + 180deg) / 5))
		calc(50% + calc(50% - var(--shape-inner)) * cos(var(--shape-angle) + (1 * 360deg + 180deg) / 5)),
		calc(50% + 50% * sin(var(--shape-angle) + (2 * 360deg) / 5))
		calc(50% + 50% * cos(var(--shape-angle) + (2 * 360deg) / 5)),
		calc(50% + calc(50% - var(--shape-inner)) * sin(var(--shape-angle) + (2 * 360deg + 180deg) / 5))
		calc(50% + calc(50% - var(--shape-inner)) * cos(var(--shape-angle) + (2 * 360deg + 180deg) / 5)),
		calc(50% + 50% * sin(var(--shape-angle) + (3 * 360deg) / 5))
		calc(50% + 50% * cos(var(--shape-angle) + (3 * 360deg) / 5)),
		calc(50% + calc(50% - var(--shape-inner)) * sin(var(--shape-angle) + (3 * 360deg + 180deg) / 5))
		calc(50% + calc(50% - var(--shape-inner)) * cos(var(--shape-angle) + (3 * 360deg + 180deg) / 5)),
		calc(50% + 50% * sin(var(--shape-angle) + (4 * 360deg) / 5))
		calc(50% + 50% * cos(var(--shape-angle) + (4 * 360deg) / 5)),
		calc(50% + calc(50% - var(--shape-inner)) * sin(var(--shape-angle) + (4 * 360deg + 180deg) / 5))
		calc(50% + calc(50% - var(--shape-inner)) * cos(var(--shape-angle) + (4 * 360deg + 180deg) / 5))
	);
}
/* Graphiques circulaires */
.graph-circ{
	width:var(--icon-dim);
	height:var(--icon-dim);
	mask: conic-gradient(#000 calc(var(--progress) * 1turn), transparent calc(var(--progress) * 1turn + 0.5grad), transparent 0) intersect,
		  radial-gradient(50% 50%, transparent calc(100% - var(--icon-epaisseur)), #000 calc(100% - var(--icon-epaisseur) + 1px), #000 0 calc(100% - 1px), transparent);
}
/* Onglets */
.shape-onglet-outer{
	display:flex;
	align-items:flex-end;
	justify-content:flex-start;
	flex-wrap:wrap;
}
.shape-onglet{
	--shape-round:1em; /* Épaisseur des arrondis */
	--shape-space:2px; /* Espace entre les onglets */
	position:relative;
	margin:calc(var(--shape-round) * -1) calc(var(--shape-round) * -1 + var(--shape-space) / 2) 0;
	min-height:calc(var(--shape-round)*3);
	border:var(--shape-round) solid transparent;
	border-bottom:0;
	border-radius:calc(2*var(--shape-round)) calc(2*var(--shape-round)) 0 0;
	background-clip:border-box;
	align-content:center;
	--shape-onglet-rg:linear-gradient(transparent 0 0);
	--shape-onglet-rd:linear-gradient(transparent 0 0);
	mask:var(--shape-onglet-rg), var(--shape-onglet-rd), linear-gradient(#000 0 0) padding-box;
}
.shape-onglet.rleft{
	--shape-onglet-rg:radial-gradient(100% 100% at 0 0, transparent calc(100% - 1px), #000) 0 100% / var(--shape-round) var(--shape-round) no-repeat;
	margin-left:calc(var(--shape-space) / 2);
}
.shape-onglet.rright{
	--shape-onglet-rd:radial-gradient(100% 100% at 100% 0, transparent calc(100% - 1px), #000) 100% 100% / var(--shape-round) var(--shape-round) no-repeat;
	margin-right:calc(var(--shape-space) / 2);
}
.shape-onglet::before{
	--shape-shadow-h:0.5em; /* Hauteur de l'ombre */
	--shape-shadow-o:0.15; /* Intensité de l'ombre */
	content:"";
	position:absolute;
	inset:auto calc(var(--shape-round) * -1) 0;
	height:var(--shape-shadow-h);
	background:linear-gradient(rgba(0,0,0,0), rgba(0,0,0,var(--shape-shadow-o)));
}
.shape-onglet.active::before{opacity:0;}
/* Bulle */
.shape-bulle{
	--shape-dim:1em;
	position:relative;
	background-clip:border-box;
	border:0 solid transparent;
}
.shape-bulle:where(.posL,.posLT,.posLB){border-left-width:var(--shape-dim);}
.shape-bulle:where(.posT,.posTL,.posTR){border-top-width:var(--shape-dim);}
.shape-bulle:where(.posR,.posRT,.posRB){border-right-width:var(--shape-dim);}
.shape-bulle:where(.posB,.posBL,.posBR){border-bottom-width:var(--shape-dim);}
.shape-bulle:where(.posL){clip-path:polygon(var(--shape-dim) 0,100% 0,100% 100%,var(--shape-dim) 100%,var(--shape-dim) calc(50% + var(--shape-dim)),0 50%,var(--shape-dim) calc(50% - var(--shape-dim)));}
.shape-bulle:where(.posLT){clip-path:polygon(0 0,100% 0,100% 100%,var(--shape-dim) 100%,var(--shape-dim) var(--shape-dim));}
.shape-bulle:where(.posTL){clip-path:polygon(0 0,var(--shape-dim) var(--shape-dim),100% var(--shape-dim),100% 100%,0 100%);}
.shape-bulle:where(.posT){clip-path:polygon(0 var(--shape-dim),calc(50% - var(--shape-dim)) var(--shape-dim),50% 0,calc(50% + var(--shape-dim)) var(--shape-dim),100% var(--shape-dim),100% 100%,0 100%);}
.shape-bulle:where(.posTR){clip-path:polygon(0 var(--shape-dim),calc(100% - var(--shape-dim)) var(--shape-dim),100% 0,100% 100%,0 100%);}
.shape-bulle:where(.posRT){clip-path:polygon(0 0,100% 0,calc(100% - var(--shape-dim)) var(--shape-dim),calc(100% - var(--shape-dim)) 100%,0 100%);}
.shape-bulle:where(.posR){clip-path:polygon(0 0,calc(100% - var(--shape-dim)) 0,calc(100% - var(--shape-dim)) calc(50% - var(--shape-dim)),100% 50%,calc(100% - var(--shape-dim)) calc(50% + var(--shape-dim)),calc(100% - var(--shape-dim)) 100%,0 100%);}
.shape-bulle:where(.posRB){clip-path:polygon(0 0,calc(100% - var(--shape-dim)) 0,calc(100% - var(--shape-dim)) calc(100% - var(--shape-dim)),100% 100%,0 100%);}
.shape-bulle:where(.posBR){clip-path:polygon(0 0,100% 0,100% 100%,calc(100% - var(--shape-dim)) calc(100% - var(--shape-dim)),0 calc(100% - var(--shape-dim)));}
.shape-bulle:where(.posB){clip-path:polygon(0 0,100% 0,100% calc(100% - var(--shape-dim)),calc(50% + var(--shape-dim)) calc(100% - var(--shape-dim)),50% 100%,calc(50% - var(--shape-dim)) calc(100% - var(--shape-dim)),0 calc(100% - var(--shape-dim)));}
.shape-bulle:where(.posBL){clip-path:polygon(0 0,100% 0,100% calc(100% - var(--shape-dim)),var(--shape-dim) calc(100% - var(--shape-dim)),0 100%);}
.shape-bulle:where(.posLB){clip-path:polygon(var(--shape-dim) 0,100% 0,100% 100%,0 100%,var(--shape-dim) calc(100% - var(--shape-dim)));}



/*============*\
#    HEADER    #===================================================================================
\*============*/
/* Structure principale */
.site-header-inner{
	display:grid;
	grid-template-columns:var(--dimStructure) calc(var(--dimStructure) * 172 / 112) auto max-content;
	grid-template-rows:var(--dimStructure) var(--dimStructure);
	grid-template-areas:
		"search      logo     altmenu  devis        "
		"description mainmenu mainmenu accessibilite";
}
.site-header-logo{ grid-area:logo; }
.site-header-logo h1.site-title{ margin:0; }
.header-devis{ grid-area:devis; }
.header-accessibilite{ grid-area:accessibilite; }
@media(max-width:980px){
	.site-header-inner{
		grid-template-columns:calc(var(--dimStructure) * 172 / 112) auto var(--dimStructure) var(--dimStructure) max-content;
		grid-template-areas:
			"logo . search mobilemenu devis        "
			".    . .      .          accessibilite";
	}
}
@media(max-width:600px){
	.site-header-inner{
		grid-template-columns:calc(var(--dimStructure) * 172 / 112) var(--dimStructure) var(--dimStructure) 1fr;
		grid-template-areas:
			"logo search mobilemenu devis        "
			".    .      .          accessibilite";
	}
}

/* Recherche */
.header-search-toggle{
	--icon-epaisseur:2px;
	grid-area:search;
	background:none;
	box-shadow:none;
	padding:0;
	border:none;
	cursor:pointer;

	&::before{
		content:"";
		transition:transform 0.3s cubic-bezier(0.5, 2.5, 0.7, 0.3);
		background:var(--couleur-principale);
		position:absolute;
		inset:calc(50% - 0.5em) calc(50% - 0.5em) auto auto;
		transform-origin:center;
		transform:scale(0);
		width:1em;
		height:1em;
		font-size:calc(var(--icon-dim) * 2);
		z-index:-1;
		border-radius:50%;
	}

	&:is(:hover,:focus-visible){
		background:none;

		&::before{ transform:scale(1); }
	}
}
.header-search{
	border:none;
	box-shadow:0 0 20px 0 rgba(0,0,0,0.3), 0 0 60px 0 var(--couleur-texte);

}
.search-submit{
	border:none;
	--form-bouton-fondColor:var(--couleur-principale);
}
@media(max-width:980px){
	.header-search-toggle{ --icon-dim:2.4rem; }
}

/* Bouton demande de devis */
.header-devis{
	background:var(--couleur-principale);
	color:var(--couleur-blanc);
	font-weight:bold;
	display:flex;
	align-items:center;
	justify-content:center;
	text-decoration:none;
	padding:0.5em calc(0.5em + 0.5lh);
	gap:0.2em;
	text-wrap:balance;
	line-height:1;
}
.header-devis-icon{ flex:0 0 auto; }
.header-devis-icon svg{
	width:2em;
	height:2em;
	color:var(--couleur-texte);
}
@media(min-width:1441px){
	.header-devis{
		font-size:2rem;
	}
}
@media(max-width:600px){
	.header-devis{
		padding-inline:0.5em;
	}
}

/* Accroche */
.site-header-description{
	grid-area:description;
	position:relative;
	font-size:1.8rem;
	font-weight:300;
	text-transform:uppercase;
}
.site-description-inner{
	width:max-content;
	position:absolute;
	right:50%;
	top:-0.5lh;
	transform-origin:right center;
	transform:rotate(-90deg);
	z-index:0;
}
.site-description-inner b{
	color:var(--couleur-principale);
	margin-inline:0.3em;
}
@media(max-width:980px){
	.site-header-description{ display:none; }
}

/*================*\
#    NAVIGATION    #
\*================*/
@media(min-width:981px){
	.menu-toggle{ display:none; }
	[role="menubar"]{
		display:flex;
		position:relative;
	}
	[role="menubar"] :where(:not(.megamenu-container)) > :where([class*="--level-2-ul"]),
	[role="menubar"] .megamenu{
		position:absolute;
		top:100%;
		height:0;
		padding-block:0;
		overflow-y:clip;
		interpolate-size:allow-keywords;
		transition:0.3s ease-out;
		transition-property:height,padding-block;
		z-index:1;
	}
	[role="menubar"] :is([aria-expanded="true"] + :is(.megamenu,[class*="--level-2-ul"])){ height:auto; }

	/* Menu princpal */
	.main-navigation{ grid-area:mainmenu; }
	.main-menu--level-1-ul{
		position:static;
		width:max-content;
		width:100%;
		justify-content:flex-end;
	}
	.main-menu--level-1-li{
		flex:0 0 calc(var(--dimStructure) * 2.2);
		max-width:25%;
	}
	.main-menu--level-1-a{
		display:block;
		height:var(--dimStructure);
		background:var(--couleur-pale);
		color:var(--couleur-texte);
		text-decoration:none;
		text-align:center;
		align-content:center;
		padding:0.5em 1em;
		text-wrap:balance;
		box-shadow:inset 0 -11px 0 -1px var(--mainmenu-bgcolor,var(--couleur-principale));
		font-weight:bold;
		line-height:1.2;
		text-transform:uppercase;
		transition:0.3s ease-out;
		transition-property:box-shadow,color;
	}
	:not(:last-child) > .main-menu--level-1-a{ border-right:1px solid var(--couleur-texte); }
	.main-menu--level-1-li:is(:hover,:focus-visible) .main-menu--level-1-a{
		box-shadow:inset 0 calc(var(--dimStructure) * -1 - 1px) 0 -1px var(--mainmenu-bgcolor,var(--couleur-principale));
		color:var(--mainmenu-color,var(--couleur-texte));
	}
	/* Megamenu */
	.megamenu{
		position:absolute;
		left:0;
		top:auto;
		width:100%;
		background:var(--couleur-blanc);
		box-shadow:0 0 30px 0 rgba(0,0,0,0.3);
	}
	.megamenu-container{
		padding-block:4rem;
	}
	.main-menu--level-2-ul{ --cols-larg:220px; }
	.main-menu--level-2-a{
		font-size:2rem;
		font-weight:bold;
		text-wrap:balance;
		text-decoration:none;
		line-height:1.2;
		color:var(--mainmenu-bgcolor);
		position:relative;
		display:block;
	}
	.main-menu--level-2-a::before{
		content:"";
		inset:-10px;
		position:absolute;
		z-index:1;
		background:var(--mainmenu-bgcolor);
		pointer-events:none;
		transform:scale(0);
		transform-origin:center center;
		opacity:0;
		mix-blend-mode:multiply;
		transition:0.3s ease-out;
		transition-property:transform, opacity;
	}
	.main-menu--level-2-a:is(:hover,:focus-visible)::before{
		transform:scale(1);
		opacity:0.4;
	}
	.megamenu-img{
		display:block;
		width:100%;
		height:150px;
		margin-bottom:0.5em;
	}
	.megamenu-footer{
		display:flex;
		align-items:center;
		justify-content:center;
		gap:var(--margesDefaut);
		padding-top:4rem;
	}
	.megamenu-footer a{ flex:0 0 auto; }
	.megamenu-footer::before,
	.megamenu-footer::after{
		content:"";
		flex:1 1 auto;
		height:0;
		border-top:1px solid var(--couleur-texte);
	}

	/* Menu secondaire */
	.alt-navigation{
		grid-area:altmenu;
		align-content:center;
		padding:0 2em;
	}
	.alt-menu--level-1-ul{
		gap:0 2em;
		flex-wrap:wrap;
	}
	.alt-menu--level-1-li{
		position:relative;
	}
	.alt-menu--level-1-a{
		display:block;
		color:inherit;
		text-decoration:none;
		font-weight:300;
		min-height:calc(var(--dimStructure) / 2);
		align-content:center;
	}
	.alt-menu--level-1-a::after{
		content:"";
		position:absolute;
		inset:calc(50% + 0.6lh) auto auto 0;
		width:0%;
		border-bottom:0.4em solid var(--couleur-principale);
		transition:width 0.3s ease-out;
	}
	:where(.alt-menu--level-1-li:is(:hover,:focus-visible)) .alt-menu--level-1-a::after{ width:100%; }
	.alt-menu--level-2-ul{
		width:max-content;
		min-width:calc(100% + 2em);
		max-width:240px;
		left:-1em;
		background:var(--couleur-blanc);
		padding-bottom:0;
	}
	.alt-menu--level-2-a{
		display:block;
		background:var(--couleur-blanc);
		padding:0.2em 1em;
		font-weight:300;
		text-decoration:none;
		color:inherit;
		transition:0.3s ease-out;
		transition-property:color, background-color;
	}
	.alt-menu--level-2-a:is(:hover,:focus-visible){
		background:var(--couleur-principale);
		color:var(--couleur-blanc);
	}
	.alt-menu--level-1-a[aria-expanded="true"] + .alt-menu--level-2-ul{padding-bottom:0.5em; }

	
}
@media(min-width:981px) and (max-width:1440px){
	.main-navigation,
	.alt-navigation{ font-size:0.92em; }
}
.mobile-menu{
	position:fixed;
	inset:0;
	z-index:3;
	pointer-events:none;
	opacity:0;
	transition:opacity 0.3s ease-out;
}
.mobile-menu-backdrop{
	position:absolute;
	inset:0;
	z-index:-1;
}
.mobile-menu-inner{
	background:var(--couleur-blanc);
	width:max-content;
	max-width:calc(100% - 3rem * 1.5);
	height:100%;
	overflow-y:auto;
	padding-block:1em;
	transform:translateX(calc(-100% - 1px));
	transition:transform 0.3s ease-out;
}
.mobile-menu-close{
	position:absolute;
	right:0;
	top:0;
	text-decoration:none;
	width:1.5em;
	height:1.5em;
	--icon-dim:1em;
	font-size:3rem;
	color:var(--couleur-blanc);
	text-align:center;
	align-content:center;
	line-height:1;
	font-weight:300;
}
.mobile-menu-close svg{
	display:block;
	margin-inline:auto;
}
@media(max-width:980px){
	.main-navigation,
	.alt-navigation,
	.megamenu-img,
	.megamenu-footer{ display:none; }
	.menu-toggle{
		grid-area:mobilemenu;
		border:none;
		--icon-dim:2.4rem;
		--icon-epaisseur:2px;

		&:is(:hover,:focus-visible){ background:none; }
	}
	.menu-toggle[aria-expanded="true"] + .mobile-menu{
		pointer-events:all;
		opacity:1;

		& .mobile-menu-inner{ transform:translateX(calc(0% - 0px)); }
	}
	.megamenu-container{ width:auto; }
	.mobile-menu-inner :is(ul,li){
		display:block;
		margin:0;
		padding:0;
	}
	.mobile-menu-inner a{
		display:block;
		text-decoration:none;
		color:var(--couleur-texte);
		font-weight:300;
		line-height:1.1;
		padding:0.5em 2rem;
	}
	.mobile-menu-inner [class*="-menu--level-1-a"]{
		color:var(--mainmenu-bgcolor, var(--couleur-principale));
		font-weight:400;
		text-transform:uppercase;
		padding-top:1em;
	}
	.mobile-menu-inner [class*="-menu--level-2-a"]{
		padding-left:4rem;
	}
}


/* Header publication */
.content-header{
	margin-right:calc(var(--dimStructure) * -1);
	position:relative;
	padding-top:min(calc(var(--ar) * 100% - 2*var(--dimStructure)), 450px);
	display:flow-root;
}
.content-header::after{
	content:"";
	width:1em;
	height:1em;
	font-size:calc(var(--dimStructure) * 0.7);
	position:absolute;
	inset:auto 1em calc(var(--dimStructure) - 1em) auto;
	background:var(--couleur-blanc);
	box-shadow:-1em 0 0 0 var(--couleur-pale), 0 -1em 0 0 var(--couleur-blanc), 1em 0 0 0 var(--couleur-principale);
}
.content-header-img{
	position:absolute;
	inset:calc(var(--dimStructure) * -1) 0 var(--dimStructure);
	z-index:-1;
}
.content-header-img img{
	width:100%;
	height:100%;
	opacity:0.5;
}

.header-breadcrumb{
	margin-top:1em;
	padding-block:0.5em;
	padding-left:clamp(calc(1.3 * 2.4rem), calc(1.3 * 4vw), calc(1.3 * 5rem));
	color:var(--couleur-principale);
	text-shadow:0 0 0.4em rgb(from var(--couleur-texte) r g b);
	width:var(--colH1);
	background:rgb(from var(--couleur-texte) r g b / 0.7);
}
.contrasts .header-breadcrumb{ background:var(--couleur-texte); }
.header-breadcrumb p{ margin:0; }
.header-breadcrumb a{
	color:var(--couleur-blanc);
	text-decoration:none;
}

.header-titre-outer{
	background:var(--couleur-principale);
	color:var(--couleur-blanc);
	width:var(--colH1);
	min-height:calc(var(--dimStructure) * 2);
	align-content:center;
	position:relative;
	font-size:clamp(2.4rem, 4vw, 5rem);
}
.header-titre-outer.pneumatique-et-fluides{
		background:var(--couleur-pneumatique);
	color:var(--couleur-blanc);
}
.header-titre-outer::before,
.header-titre-outer::after{
	content:"";
	display:block;
	position:absolute;
	width:1em;
	height:1em;
	font-size:0.2em;
	color:var(--couleur-pale);
	background:currentColor;
	--sens:1;/* 1 ou -1 */
	box-shadow:calc((1em - 1px) * var(--sens)) 0 0 0 currentColor, calc(1.5em * var(--sens)) 0 0 0 currentColor, 0 calc((1em - 1px) * var(--sens)) 0 0 currentColor, 0 calc(1.5em * var(--sens)) 0 0 currentColor;
}
.header-titre-outer::before{
	inset:-1em auto auto 1.5em;
}
.header-titre-outer::after{
	inset:auto 1.5em 0 auto;
	--sens:-1;
}
.header-titre-outer h1{
	margin:0;
	color:inherit;
	padding:0.5em 1.3em;
	font-size:1em;
}

@media(max-width:980px){
	.content-header-img{
		z-index:1;
	}
	.content-header{ margin-inline:calc(var(--dimStructure) * -1); }
	.header-titre-outer h1,
	.header-breadcrumb{ padding-left:var(--dimStructure); z-index:2;position:relative;}
	.header-titre-outer{z-index:3;}
}
@media(max-width:600px){
	.content-header::after{ font-size:calc(var(--dimStructure) * 0.5); }
}


/*================*\
#    BLOCS ACF    #
\*================*/

.bloc-slider-numerote .preambule {
	font-size:2rem;
	font-weight:bold;
	z-index:2;
	position:relative;
}
.bloc-slider-numerote h2{
	z-index:2;
	position:relative;
}
.slider-container.slider-container-slider-realisation{
	margin-right:0;
	padding-top:5em;
}
/* Bloc carousel numéroté */
.bloc-slider-numerote{
	position:relative;
	background: #e9ecef;
    z-index: 3;
	padding-bottom: 4em;

}
.background-slider-num{
	position: absolute;
	width:100%;
	height:70%;
	content:"";
	left:0;
	top:-5%;
	z-index:0;
}
.item-slider-realisations{
	position:relative;
	padding:2em;
	color:inherit;
	text-decoration:none;
	display:block;
}
.index-number-item-slider-realisations{
	position:absolute;
    z-index: 5;
    color: white;
    padding-left: 20px;
    margin-top: -14rem;
    font-size: 16rem;
    font-weight: lighter;
}
.visual-item-slider-realisation{
	position:relative;
	overflow:hidden;
	aspect-ratio: 123/142;
}
.img-slider-realisations{
    filter: grayscale(100%);
    position: absolute;
    z-index: 1;
    width: 100%;
	height:100%;
    object-fit: cover;
    transform: scale(1);
    transition: all 0.2s ease-in-out;
}
.cache-hover{
	background: #000;
	z-index:3;
	opacity: 0.45;
	content:"";
	position:absolute;
	top:0;
	left:0;
	height:100%;
	width:100%;
	transition:all 0.2s ease-in-out;
}
.title-slider-realistion{
	text-transform: uppercase;
	color:var(--couleur-principale);
}

.item-slider-realisations:hover .cache-hover{
	opacity: 0;
}
.item-slider-realisations:hover .img-slider-realisations{
	transform:scale(1.3);
}
.wp-block-button__link.button-slider-realisations{
	margin-top:2em;
}

.slider-numerote-header{
	display:flex;
	align-items:flex-end;
	justify-content:space-between;
	gap:3em;
	flex-wrap:wrap;
}
.slider-numerote-titre{
	max-width:540px;
	width:fit-content;
	flex:1 0 auto;
}
.slider-numerote-nav-outer{
	width:fit-content;
	flex:0 0 auto;
	display:flex;
	align-items:center;
	justify-content:flex-end;
	gap:30px;
}
.slider-numerote-nav-outer .slider-nav{
	position:relative;
	left:unset;top:unset;right:unset;bottom:unset;
	background:var(--couleur-principale);
	padding:0.5em 1em;
}
.slider-indicators>*{ background-color:var(--couleur-principale); }
.bloc-slider-numerote .slider-indicators{
	--swiffy-slider-indicators-dim:1em;
	margin-block:1em 0;
}

/* Bloc image de fond */
.container-bloc-image-fond{
	display:flex;
	justify-content: space-between;
}
.container-bloc-image-fond .col-1-bloc-image-fond{
	width:37%;
}
.col-2-bloc-image-fond{
	width:45%;
	background:var(--couleur-texte);
	color:white;
	margin-bottom:-2em;
	margin-top:15em;
	z-index:20;
}
.content-bloc-image-fond-texte{
	padding:5em;
}
.content-bloc-image-fond-texte h3{
	text-transform: uppercase;
	color:var(--couleur-principale);
}
.col-2-bloc-image-fond::after{
	content: "";
    width: 1em;
    height: 1em;
    font-size: calc(var(--dimStructure)* 0.7);
    position: absolute;
    /* inset: auto 1em calc(var(--dimStructure) - 1em) auto; */
    right: -1em;
    bottom: 16px;
    background: var(--couleur-principale);
    box-shadow: 0 -1em 0 0 var(--couleur-pale), 1em 0 0 0 var(--couleur-blanc);
	
}
.wp-block-button__link.button-bloc-image-fond{
	color:var(--couleur-blanc);
	background:var(--form-bouton-fondColor);
	box-shadow: inset calc(var(--form-input-height)* -1 - 1px) 0 0 -1px var(--couleur-blanc);
	&::before, &::after {
		border: 0.1em none var(--couleur-texte);
		color:var(--couleur-texte);
	}
}
@media(max-width:980px){
	.container-bloc-image-fond .col-1-bloc-image-fond{
		width:0%;
	}
	.col-2-bloc-image-fond{
		width:100%;
	}
	.content-bloc-image-fond-texte{
		padding:20px;
	}
	.col-2-bloc-image-fond{
		margin-top:0;
		margin-bottom:0;
	}
	.background-slider-num{
		position: relative;
		top:2em;;
	}
}


/* FOOTER */


.prefooter-plus.bg-motif-clair{
	padding-block: 10em;
	text-align:center;
	background-color:var(--couleur-blanc);
}
.footer-bottom-principale{
	padding-block: 5em;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap:30px;
}
.logo-footer{
	width:170px;
}
.social-footer-icons-container{
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	padding-top:20px;
}
.footer-social-item{
	color: #000000;
	margin-right: 30px;
}
.title-agence-footer{
font-size:clamp(1.5rem, 1.3vw, 2rem);
text-transform:uppercase;

}
.tel-agence-footer{
	color:var(--couleur-principale);
	font-size:clamp(1.6rem, 1.3vw, 2.2rem);
	font-weight:bold;
	white-space:nowrap;

}
.mail-agence-footer{
	text-decoration: none;
	color:var(--couleur-texte);
	font-size:clamp(1.4rem, 1.3vw, 1.8rem);
}
.footer-bottom-principale .widget_block{
	max-width:23%;
}
.footer-navigation .menu {
	text-align:right;
}
.footer-navigation .menu li{
	padding-bottom:20px;
}
.footer-navigation .menu li a {
	text-decoration: none;
	color:#89928D;

}
@media(max-width:1440px){
	.footer-bottom-principale{ flex-wrap:wrap; }
	.footer-navigation{ flex:1 0 100%; }
}
@media(min-width:981px) and (max-width:1440px){
	.footer-navigation .menu{
		display:flex;
		align-items:baseline;
		justify-content:center;
		gap:2em;
	}
}
@media(max-width:980px){
	.logo-footer{
		margin-bottom:30px;
	}
	.footer-bottom-principale{
		display:block;
		text-align:center;
	}
	.footer-navigation .menu{
		text-align:center;
	}
	.footer-bottom-principale .widget_block{
		max-width:100%;
		margin-bottom:30px;
	}
	.social-footer-icons-container{
		justify-content:center;
		margin-bottom:1em;
	}
	.footer-social-item{
		margin-inline:15px;
	}
}

.prefooter-contact-zone{
	display:flex;
	justify-content: flex-start;
	align-items: flex-end;
}
.col1-hand{
	width:25%;
}
.col-2-texte-presentation{
	width:35%;
	padding:4em;
}
.col-2-texte-presentation h2{
	width:100%;
}
.col-3-personnage{
	width:15%;
}
@media(max-width:980px){
	.prefooter-contact-zone{
		display:block;
		text-align:center;
	}
	.col1-hand, .col-2-texte-presentation, .col-3-personnage{
		width:100%;
	}
	.col-2-texte-presentation, .col-3-personnage{
		padding:1em;
		text-align:center;
	}
}
.zone-formulaire-prefooter{
	padding:4em;
}
@media(min-width:981px){
	.container.small-container {
		width:calc(var(--largeur) * 0.75);
		position:relative;
		z-index:2;
	}
}
@media(max-width:980px){
	.zone-formulaire-prefooter{
		 padding:1em;
	}
	.container.small-container {
		width:100%;
		position:relative;
		z-index:2;
	}
}

.h3-formulaire{
	text-transform:uppercase;
	color:var(--couleur-blanc);
}
.zone-formulaire-prefooter .wpcf7-form :is(
	[type="date"],
	[type="email"],
	[type="number"],
	[type="tel"],
	[type="text"],
	[type="url"],
	textarea,
	select,
	::file-selector-button
),
.zone-formulaire-prefooter .wpcf7-form ::file-selector-button{
	border:none;
	border-bottom:1px solid var(--couleur-texte);
	background-color: rgb(from var(--couleur-texte) r g b / 0.1);
}
.zone-formulaire-prefooter .wpcf7-form :is(
	[type="radio"],
	[type="checkbox"]
){ border-color:var(--couleur-texte); }
.zone-formulaire-prefooter .wpcf7-form :is(
	[type="radio"],
	[type="checkbox"]
)::before{ background:var(--couleur-texte); }
.zone-formulaire-prefooter .wpcf7-form .wpcf7-not-valid-tip,
.zone-formulaire-prefooter .input.wpcf7-not-valid{
	color:var(--couleur-texte);
}
.prefooter-contact-zone{
	padding-top: 10em;
}
.prefooter-contact-form{
	position:relative;
	display:block;
	padding-bottom:15em;
}
.prefooter-contact-form::after{
	position:absolute;
	content:"";
	width:100%;
	display:block;
	left:0;
	top:30%;
	height:80%;
	background-color:var(--couleur-pale);
	z-index:0;
}
.zone-formulaire-prefooter .wpcf7-form .wpcf7-submit   {
	border: 2px solid var(--couleur-texte);
	color: var(--couleur-blanc);
	background: var(--couleur-texte);
}

/* Liste Domaine activité */

.container-domaines-list{
	display:flex;
	justify-content: flex-start;
	align-items: center;
	flex-wrap: wrap;
	--cols-gap:5rem;
}
.item-domaine-in-list{
	padding:3em ;
	width:30%;
}
.container-picto-domaine{
	height:45px;
	margin-bottom:10px;
}
.item-domaine-in-list-picto-domaine{
	max-height:45px;
	margin-bottom:10px;
}

.container-img-domaine{
	aspect-ratio: 241/160;
	position:relative;
	overflow:hidden;
	border-bottom-right-radius: 30px;
	filter: brightness(60%);
	transition: all 0.2s ease-in;
}
.container-img-domaine:hover{
	filter: brightness(100%);
}
.title-domaine-activite{
    font-size: 2.7rem;
    font-weight: bold;
    margin-block: 0.5em;
    color: var(--couleur-principale);
}
@media(max-width:1200px){
	.item-domaine-in-list{
		padding:1em ;
		width:45%;
	}
}
@media(max-width:600px){
	.item-domaine-in-list{
		padding:1em ;
		width:90%;
	}
}
/* RESUME PRODUIT */
.automation {
	color:var(--couleur-automation);
}
.hydraulique-et-flexibles {
	color:var(--couleur-hydraulique);
}
.pneumatique-et-fluides {
	color:var(--couleur-pneumatique);
}
.profiles-aluminium-et-convoyeurs{
	color:var(--couleur-profiles);
}
.automation ul li, .automation p, .hydraulique-et-flexibles ul li, .hydraulique-et-flexibles p, .pneumatique-et-fluides ul li, .pneumatique-et-fluides p, .profiles-aluminium-et-convoyeurs ul li, .profiles-aluminium-et-convoyeurs p{
	color:var(--couleur-texte);
}	
.item-produit-resume{
	padding:2em;
	text-decoration:none;
}
.extrait-item-produit-resume{
	color:var(--couleur-texte)
}
.visual-item-produit{
	background-color: var(--couleur-pale);
	aspect-ratio: 241/160;
	position:relative;
	overflow:hidden;
	border-top-left-radius: 50px;
	filter: brightness(80%);
	transition: all 0.2s ease-in;
}
.visual-item-produit img{
	position:absolute;
	height:100%;
}
.title-produit-resume{
	text-transform:uppercase;
	font-weight:normal;
}
.profiles-aluminium-et-convoyeurs .title-produit-resume{
	 color:var(--couleur-profiles);
}
.item-produit-resume .fake-button {
	border-bottom:1px solid currentColor;
}
.intitule-bouton-item-produit-resume{
	text-transform:uppercase;
	color:var(--couleur-texte);
}
.fake-button{
	display:inline-block;
	padding:10px;
	position:relative;
	padding-right:70px;
	&::before,
	&::after{
		content:"";
		border:0.1em none currentColor;
		border-right-style:solid;
		display:block;
		position:absolute;
		inset:auto auto calc(50% - 0.5em) calc(100% - var(--form-input-height) * 0.5 - 0.5em);
		width:1em;
		height:1em;
		font-size:2rem;
	}
	&::before{
		border-top-style:solid;
		margin:0;
		transition:margin 0.3s ease-out;
	}
	&::after{
		width:0;
		transform-origin:center bottom;
		transform:rotate(45deg);
		margin:0 0 0 -0.05em;
		transition:height 0.3s ease-out;
	}
	&:where(:hover,:focus-visible){
		
		&::before{
			margin:0 0 0.38em 0.38em;
		}
		&::after{
			height:1.5em;
		}
	}
}

/* LISTE PRODUIT */

.liste-produit-container, .liste-realisations-container{
	display:flex;
	align-items:flex-start;
	justify-content: flex-start;
	flex-wrap: wrap;
}
.liste-produit-container .item-produit-resume , .liste-realisations-container .item-slider-realisations{
	width:25%;
	margin-bottom:3em;
}
.liste-produit-container.liste-produit-container-industrial-shields .item-produit-resume{
	width:30%;
}

/* Styles pour le moteur de recherche des réalisations */
.filtre-realisations {
    margin-bottom: 3rem;
    padding: 2rem;
    background-color: var(--couleur-pale);
    border-radius: 4px;
}

.form-filtre-realisations {
    width: 100%;
}

.filtre-item {
    margin-bottom: 1rem;
}

.filtre-actions {
    display: flex;
    align-items: flex-end;
}

.btn-reset {
    display: inline-block;
    padding: 1em calc(1em + 0.5lh);
    color: var(--couleur-texte);
    border: var(--form-bouton-bordWidth) solid var(--couleur-texte);
    text-decoration: none;
    text-transform: uppercase;
    transition: 0.3s ease-out;
    transition-property: color, background-color, border-color;
}

.btn-reset:hover {
    background-color: var(--couleur-texte);
    color: var(--couleur-blanc);
}

.no-results {
    padding: 2rem;
    text-align: center;
    font-size: 1.8rem;
    color: var(--couleur-texte);
}

@media (max-width: 980px) {
    .form-filtre-realisations .grid-section {
        grid-template-columns: 1fr;
    }
    
    .filtre-actions {
        justify-content: flex-start;
        margin-top: 1rem;
    }
	.liste-produit-container, .liste-realisations-container{
		display:block;
	}
	.liste-produit-container .item-produit-resume , .liste-realisations-container .item-slider-realisations{
		width:100% !important;
		margin-bottom:2em;
		display:block;
	}
}
.fake-button-realisation{
	display:inline-block;
	padding:10px;
	text-decoration:none;
	border-bottom:1px solid var(--couleur-principale);
	position:relative;
	padding-right:70px;
	&::before,
	&::after{
		content:"";
		border:0.1em none var(--couleur-principale);
		border-right-style:solid;
		display:block;
		position:absolute;
		inset:auto auto calc(50% - 0.5em) calc(100% - var(--form-input-height) * 0.5 - 0.5em);
		width:1em;
		height:1em;
		font-size:2rem;
	}
	&::before{
		border-top-style:solid;
		margin:0;
		transition:margin 0.3s ease-out;
	}
	&::after{
		width:0;
		transform-origin:center bottom;
		transform:rotate(45deg);
		margin:0 0 0 -0.05em;
		transition:height 0.3s ease-out;
	}
	&:where(:hover,:focus-visible){
		
		&::before{
			margin:0 0 0.38em 0.38em;
		}
		&::after{
			height:1.5em;
		}
	}
}


/*=====================*\
#    OFFRES D'EMPLOI    #
\*=====================*/
.emploi-items{
	padding-top:5em;
}
.emploi-item{
	width:1200px;
	max-width:100%;
	border-bottom:1px solid currentColor;
	margin-left:auto;
	padding-block:3em;
}
.emploi-item-titre{
	margin:0 0 1em 0;
}
.emploi-item-titre a{
	color:inherit;
	text-decoration:none;
}
.emploi-data{
	display:flex;
	align-items:baseline;
	justify-content:flex-start;
	flex-wrap:wrap;
	gap:1em 2em;
}
.emploi-data-item{ flex:1 0 290px; }
.emploi-data-item svg{
	vertical-align:text-bottom;
	color:var(--couleur-principale);
}

.emploi-titre{ margin-right:0; }
.emploi-titre div{
	color:var(--couleur-texte);
	font-weight:300;
}
.emploi-contenu{
	display:flex;
	align-items:stretch;
	justify-content:flex-start;
	--cols-gap:calc(var(--margesDefaut)*2);
}
.emploi-contenu-gauche{ max-width:540px; }
.emploi-contenu-droite{ flex-grow:1; }
.emploi-data-item-fiche{
	display:flex;
	align-items:baseline;
	justify-content:flex-start;
	gap:0.5ch;
	border-bottom:1px solid var(--couleur-principale);
	padding-block:0.5em;
}
.emploi-data-item-icon{ flex:0 0 auto; }
.emploi-data-item-textes{ flex:1 1 auto; }

.zone-formulaire-prefooter h2{
	color:var(--couleur-blanc);
	margin-top:0;
	margin-right:0;
}
.search-field{
	min-width:380px;
}
#search-filter-form-4146 ul {
	display:block;
}
#search-filter-form-4146 ul li{
	display:block;
	width:100%;
}
.sf-input-checkbox:checked::before{
	    background: var(--couleur-texte);
}























/* Titres */
/* ⚠ Si le margin-top ou les font-size sont modifiés, penser à les changer également dans le contexte titres × colonnes ci-après */
/* HOME 
h1:not(:where(.h2,.h3,.h4,.h5,.h6)),.h1{ font-size:clamp(3rem, 7.5vw, 7rem);  text-transform: uppercase; }
h1 .small{
	font-size:clamp(1.5rem, 7.5vw, 5rem)
}*/
.container-detail-produit{
	display:flex;
	align-items:flex-start;
	flex-direction: row;
}
.col-contenu-produit{
	width: var(--colH1);
	padding:2em;
	background:#E7EBEE;
	padding-bottom:8em;
}
.col-slider-detail-produit{
	position:sticky;
	top:0;
	display: block;
	width:calc(var(--largeur) - var(--colH1));
}

@media(max-width:980px){
	.container-detail-produit{
		display:flex;
		flex-direction: column-reverse;
	}
	.col-contenu-produit, .col-slider-detail-produit{
		width:100%;
	}
}
.col-slider-detail-produit .swiffy-slider ul li img{
	width:100%;
}
.realisation-avec-produit-section {
	padding: 4em 0;
}
.section-produit-compementaire-container{
	padding-top:5em;
}
.section-produit-compementaire-container .preambule{text-align:center;}
.section-produit-compementaire-container .h2-detail-produit{
	margin-right:0;
	text-align:center;
}
.automation {
	color:var(--couleur-automation);
}
.hydraulique-flexibles {
	color:var(--couleur-hydraulique);
}
.pneumatique-fluides {
	color:var(--couleur-pneumatique);
}
.profiles-aluminium-convoyeurs {
	color:var(--couleur-profiles);
}
.container-detail-produit.profiles-aluminium-convoyeurs .h2, .container-detail-produit.profiles-aluminium-convoyeurs h2, .profiles-aluminium-convoyeurs h2,
.container-detail-produit.profiles-aluminium-convoyeurs .h3, .container-detail-produit.profiles-aluminium-convoyeurs h3{
	color:var(--couleur-profiles);
	width:100%;
}
.container-detail-produit.automation .h2, .container-detail-produit.automation h2,.automation h2,
.container-detail-produit.automation .h3, .container-detail-produit.automation h3{
	color:var(--couleur-automation);
	width:100%;
}
.container-detail-produit.hydraulique-flexibles  .h2, .container-detail-produit.hydraulique-flexibles  h2, .hydraulique-flexibles  h2,
.container-detail-produit.hydraulique-flexibles  .h3, .container-detail-produit.hydraulique-flexibles  h3{
	color:var(--couleur-hydraulique);
	width:100%;
}
.container-detail-produit.pneumatique-fluides  .h2, .container-detail-produit.pneumatique-fluides  h2, .pneumatique-fluides  h2,
.container-detail-produit.pneumatique-fluides  .h3, .container-detail-produit.pneumatique-fluides  h3{
	color:var(--couleur-pneumatique);
	width:100%;
}
.container-detail-realisation{
	display:flex;
	flex-direction: row;;
}
.col-contenu-realisation{
	width: var(--colH1);
	padding:4em 0;
}
.col-content-realisation{
	display: inline-block;
	width:calc(var(--largeur) - var(--colH1));
	padding: 0 3em;
}
.col-content-realisation h2{
	width:100%;
}
.domaine-concerne-detail-realisation{
	display:block;
	color:var(--couleur-texte);
	border-bottom:1px solid var(--couleur-principale);
	text-decoration:none;
	padding:10px;
	padding-left:0;
}
.domaine-concerne-detail-realisation svg {
	max-width:40px;
}
.onctainer-picto-domaine{
	width:50px;
	display:inline-block;
}
.button-col-gauche-single-realisation-container{
	margin-top:5em;
}
.bloc-image-fond-detail-realisation{
	margin: 10em 0 15em 0;
}
.section-chiffre-cle-realisation-detail{
	margin:10em 0;
}
.chiffre-item-item-chiffre{
	font-weight:bold;
	font-size:7rem;
	color:var(--couleur-principale);
}
.texte-chiffre-cle{
	font-weight:2.4rem;
	text-transform:uppercase;
	font-weight:bold;
}
.title-chiffre-cles{
	color:var(--couleur-principale);
	text-transform: uppercase;
}
@media (max-width:980px){
	.container-detail-realisation{
		flex-direction: column;
	}
	.col-contenu-realisation{
		width:100%;
	}
	.col-content-realisation{
		width:100%;
		padding:0;
	}
}
.searchandfilter .sf-field-post-meta-domaines_dactivite_concerne 
.searchandfilter .sf-field-post-meta-domaines_dactivite_concerne  ul{
	display:block;
}
.searchandfilter .sf-field-post-meta-domaines_dactivite_concerne  ul li{
	width:100%;
	display:block;
	margin-bottom:1em;
}
/*================================*\
#    CONTENU DATES (Historique)    #
\*================================*/
.text-center{
	text-align:center;
}
.contenu-dates-gauche{
	align-self: flex-start;
	height:100vh;
	display:flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	position:sticky;
	top:0;
	font-size:clamp(8rem,16vw,12rem);
	overflow-y: hidden;
	overflow-x:visible;
	font-weight:700;
	letter-spacing: -0.05em;
	line-height:1em;
	pointer-events: none;
	text-transform:uppercase;
}
.contenu-title-defilant-gauche{ position:relative; }
.contenu-title-defilant-gauche > div{
	opacity:0;
	white-space: nowrap;
	transition:0.3s ease-out;
	transition-property: color, opacity, top;
	position:absolute;
	left:0;
	top:calc(50% - 0.5em - 1.6em);
	z-index: 0;
}
.contenu-title-defilant-gauche > div.active{
	color:var(--couleur-principale);
	opacity:1;
	z-index:1;
	top:calc(50% - 0.5em + 0em);
}
.contenu-title-defilant-gauche > div.active-near{
	color:white;
	text-shadow: 0 0 2px #000; /* horizontal-offset vertical-offset 'blur' colour */
  -moz-text-shadow: 0 0 2px #000;
  -webkit-text-shadow: 0 0 2px #000;
	opacity:0.55;
}
.contenu-title-defilant-gauche > div.active-prev{ top:calc(50% - 0.5em - 2em); }
.contenu-title-defilant-gauche > div.active-next{ top:calc(50% - 0.5em + 2em); }
.contenu-title-defilant-gauche > div.active-next + div{ top:calc(50% - 0.5em + 4em); }

.contenu-defilant-gauche{
	flex: 0 0 auto;
	width:60%;
}        
.contenu-dates-droite{
	flex: 0 0 auto;
	width: 38%;
}
.container-cols-defilant{
	display:flex;
	align-items: center;
}
.contenu-dates-item{
	padding:2em 0;
}
.big-container-element-texte-image-liste-defilant{
	display:flex;
	flex-direction:row;
	align-items: center;;
}
.texte-container-liste-defilante-item{
	width:60%;
	padding:2em;
}
.image-container-liste-defilante-item{
	width:40%;
}
.texte-container-liste-defilante-item p {
	font-size:2rem;
}
@media (max-width:980px){
	.contenu-dates-gauche{ display:none; }
	.contenu-defilant-gauche{
		width:100%;
	}
	.contenu-dates-droite{
		width:100%;
	}
	.big-container-element-texte-image-liste-defilant{
		flex-direction:column;
	}
	.texte-container-liste-defilante-item{
		width:100%;
		padding:1em;
	}
}

/*================================*\
#    Liste domaoine fond vert    #
\*================================*/

.bloc-liste-domaine-fond-vert{
	margin-top: 15em;;
}
.bloc-liste-domaine-fond-vert{
	padding:5em 0;
}
.h2-liste-domaine-fond-vert{
	color:white;
	width:45%;
}
.container-flex-bloc-liste-domaine-fond-vert{
	display:flex;
	justify-content: space-between;
}
.col-liste-domaine{
	width:45%;
	padding-left:calc((100vw - var(--largeur))/ 2 );
}
.list-domaine-fond-vert a{
	color:var(--couleur-texte);
	text-decoration:none;
	display:block;
	padding:10px 0;
	position:relative;
	border-bottom:1px solid white;
	&::before,
	&::after{
		content:"";
		border:0.1em none white;
		border-right-style:solid;
		display:block;
		position:absolute;
		inset:auto auto calc(50% - 0.5em) calc(100% - var(--form-input-height) * 0.5 - 0.5em);
		width:1em;
		height:1em;
		font-size:2rem;
	}
	&::before{
		border-top-style:solid;
		margin:0;
		transition:margin 0.3s ease-out;
	}
	&::after{
		width:0;
		transform-origin:center bottom;
		transform:rotate(45deg);
		margin:0 0 0 -0.05em;
		transition:height 0.3s ease-out;
	}
	&:where(:hover,:focus-visible){
		
		&::before{
			margin:0 0 0.38em 0.38em;
		}
		&::after{
			height:1.5em;
		}
	}
}

.col-img-bloc-liste-domaine-fond-vert{
	margin-top:-27em;
}
@media (max-width:980px){
	.container-flex-bloc-liste-domaine-fond-vert{
		display:flex;
		flex-direction: column-reverse;
	}
	.col-liste-domaine, .col-img-bloc-liste-domaine-fond-vert{
		width:100%;
		margin-top:2em;
	}
}



/*================================*\
#    Slider HOME   #
\*================================*/
.container-video-home{
	position:relative;
	inset: calc(var(--dimStructure)* -1) 0 var(--dimStructure);
}
.cache-video-header-home{
	position:absolute;
	top:0;
	left:0;
	content:"";
	display:block;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.6);
	pointer-events: none;
}
.header-titre-outer.header-titre-outer-home{
	background: transparent;
    position: absolute;
    top: 10vh;
    left: 5vw;

}
.titre-header-home{
 padding:1em;
}
.small-uppercase-title{
	text-transform:uppercase;
	font-size:4rem;
}
.title-white{
	text-transform: uppercase;
	color:white;
	font-weight:bold;
	font-size: 6rem;
}

.text-anim {
    border-right: 2px solid var(--couleur-principale); /* Curseur effet machine à écrire */
    padding-right: 5px;
    display: inline-block;
    white-space: nowrap;
}
.title-white.text-anim{
	color:var(--couleur-principale);
	padding-left:1em;
}
.second-uppercase{
	text-align:right;
	padding-right:2em;

}
.preambule-header-home{
	font-size: 1.6rem;
    width: 23vw;
}
.wp-block-button__link.button-header-home{
	font-size:1.8rem;
	color:white;
	background: transparent;
}
@media (max-width:1700px){
	.small-uppercase-title{
		font-size:2rem;
	}
	.title-white{
		font-size:2rem;
	}
	.preambule-header-home{
		width:50vw;
	}
}
@media (max-width:1350px){
	.preambule-header-home, .wp-block-button__link.button-header-home {
		display:none;
	}
}
@media(max-width:980px){
	.header-titre-outer.header-titre-outer-home{
		background: none;
		position: relative;
		top: 0;
		left: 0;
		width: 100%;
		margin-block:20px;
		padding: 1em;
	}
	.container-video-home,
	.container-video-home video{
		position:absolute;
		inset:0;
		width:100%;
		height:100%;
		object-fit:cover;
		object-position:center;
	}
	.content-header{
		background:black;
	}
	.content-header::after{
		display:none;
	}
}
iframe{
	height:400px !important;
}
.header-rappel-toggle{
	position: absolute;
    background: rgba(0, 0, 0, 0.6);
    bottom: 0;
    right: 0;
    padding: 3em;
    border: none;
    text-transform: none;
    text-align: center;
    color: white;
	padding-bottom:4em;
}
.container-callback-zone-header-home{
	display:flex;
	justify-content:center;
	align-items:center;
}
.header-callback-popup{
    border: none;
	background:transparent;
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.3), 0 0 60px 0 var(--couleur-texte);
}
.header-callback-popup::backdrop{
	background:rgba(0, 0, 0, 0.7);
}
.conainter-buttons-popup{
	display:flex;
	justify-content:center;
	align-items:stretch;
}
.callbackbtn {
	text-align:center;
	padding:2em;
	text-decoration:none;
	margin-inline: 5px;;
}
.callback-btn-1{
	background-color: var(--couleur-principale);
	color:white;
	border-bottom-right-radius: 35px;
}
.callback-btn-2{
	background-color: white;
	color:var(--couleur-texte);
	border-bottom-left-radius: 35px;
}
@media (max-width:980px){
	.header-rappel-toggle{
		display:none;
	}
}
.--couleur-hydraulique h2, .--couleur-hydraulique h3 , .hydraulique-flexibles h2, .hydraulique-flexibles h3 {
	color:var(--couleur-hydraulique);
}
.--couleur-profiles h2, .--couleur-profiles h3 , .profiles-aluminium-convoyeurs h2, .profiles-aluminium-convoyeurs h3 {
	color:var(--couleur-profiles);
}
.--couleur-pneumatique h2, .--couleur-pneumatique h3 , .pneumatique-et-fluides h2, .pneumatique-et-fluides h3 {
	color:var(--couleur-pneumatique);
}
.--couleur-automation h2, .--couleur-automation h3, .automation h2, .automation h3 {
	color:var(--couleur-automation);
}
.col-contenu-produit p {
	color:var(--couleur-texte);
}
.bloc-liste-realisation {
	padding-top:10em;
}
@media (max-width:1400px){
	.big-container-element-texte-image-liste-defilant {
		display:block
	}
	.texte-container-liste-defilante-item{
		width:100%;
		padding:0;
	}
	
}
@media(min-width:1200px){
	.bloc-logo-grille-item{
		width:20%;
		display: flex;
		justify-content: center;
		align-items: center;
		aspect-ratio: 1/1;
	}
}
@media (max-width:1199px){
	.bloc-logo-grille-item{
		width:30%;
		display: flex;
		justify-content: center;
		align-items: center;
		aspect-ratio: 1/1;
	}
}
@media (max-width:980px){
	.bloc-logo-grille-item{
		width:45%;
		display: flex;
		justify-content: center;
		align-items: center;
		aspect-ratio: 1/1;
	}
}

/*================================*\
#    CONTENU CHIFFRES              #
\*================================*/
.container-contenu-chiffres{
	display:flex;
}
.gutter-simple{
	width:var(--outerMarges);
}
.contenu-dates-gauche{
	align-self: flex-start;
	height:100vh;
	display:flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	/*position:sticky;*/
	top:0;
	font-size:clamp(2rem,16vw,5rem);
	overflow-y: hidden;
	overflow-x:visible;
    font-family: "Helvetica Neue";
	font-weight:900;
	letter-spacing: -0.05em;
	line-height:1em;
	pointer-events: none;
	transition:opacity 0.3s ease-out;
}
.contenu-liste-defilante-container.current .contenu-dates-gauche{
	position: fixed;
}
.contenu-dates-gauche-dates{ position:relative; }
.contenu-dates-gauche-dates > div{
	opacity:0;
	white-space: nowrap;
	transition:0.3s ease-out;
	transition-property: color, opacity, top;
	position:absolute;
	left:0;
	top:calc(50% - 0.5em - 1.6em);
	z-index: 0;
}
.contenu-dates-gauche-dates > div.active{
	color:var(--couleur-principale);
	opacity:1;
	z-index:1;
	top:calc(50% - 0.5em + 3.8em);
}
.contenu-dates-gauche-dates > div.active-near{
	color:#ddd;
	opacity:0.35;
}
.contenu-dates-item{
	padding: 3em;
	padding-right:0;
    border-bottom: 1px solid var(--couleur-texte);
}

.contenu-dates-gauche-dates > div.active-prev{ top:calc(50% - 0.5em + 1.6em); }
.contenu-dates-gauche-dates > div.active-next{ top:calc(50% - 0.5em + 5.4em); }
.contenu-dates-gauche-dates > div.active-next + div{ top:calc(50% - 0.5em + 1.6em); }
.contenu-dates-svg-progression{ stroke:var(--couleur-couleur-principale); }
@media(max-width:980px){
	.contenu-dates-gauche{ display:none; }
}
@media(min-width:1115px){
	.contenu-dates-droite{
		width:60%;
	}
}
@media(min-width:981px){
	.contenu-liste-defilante .contenu-dates-gauche{
		opacity:0;
	}
	.contenu-dates-gauche{
        width: 55%;
		padding-left:3rem;
		position: fixed;
	}
	.contenu-liste-defilante.current .contenu-dates-gauche{
		opacity:1;
	}
	.contenu-dates-droite{
		        width: 63%;
        margin-left: 37%;
	}
	.contenu-liste-defilante-container{
		position: relative;
		overflow: hidden;
	}
}
.bloc-liste-domaine-fond-vert{
	z-index:2;
	position: relative;
}

.has-large-font-size {
	font-size: 3.5rem;
    font-weight: 100;
}

.searchandfilter ul{
	list-style: none;;
	display:flex;
	flex-direction: row;
	flex-wrap:wrap;
	justify-content:flex-start;
	align-items: center;
	width:100%;
	gap:0 var(--margesDefaut);
	margin-left:0;
	padding-left:0;
}
.searchandfilter ul li{
	position: relative;
	text-indent:0;
}
.searchandfilter ul li::before{
	display:none;
}
.searchandfilter ul li[data-sf-field-type="taxonomy"][data-sf-field-input-type="radio"]{
	width:100%;
	flex:1 1 100%;
}
.searchandfilter ul li[data-sf-field-type="taxonomy"][data-sf-field-input-type="radio"] ul{ gap:1em; }
.searchandfilter ul li[data-sf-field-type="taxonomy"][data-sf-field-input-type="radio"] li{
	& input{ display:none; }
	& label{
		background-color:#eee;
		padding:0.5em;
		align-content:center;
		padding:0.5em 1em;
		border-radius:4em;
	}
	&.sf-option-active label{ background-color:var(--couleur-principale); }
}

.chosen-container .chosen-results{
	display:block;
}
.searchandfilter select.sf-input-select{
	width:100%;
	height:var(--form-input-height);
	padding:0 1em;
	border-radius:0;
	background: transparent;
	border:none;
	border-bottom:1px solid var(--couleur-texte);
	background-color:transparent;
	color:var(--couleur-texte);
	font-size:1.6rem;
}
.other-properties{
	color:#000;
}

@media (max-width:980px){
	.searchandfilter ul{
		flex-direction: column;
	}
	.searchandfilter ul li{
		width:100%;
	}
	.searchandfilter select.sf-input-select{
		width:100%;
	}
}
.header-call-to-action-producttt{
	position: absolute;
	bottom: 0;
	display: flex;
	flex-direction: row;
	background: var(--couleur-principale);
	margin-left: var(--colH1);
	width: calc(100% - var(--colH1) - (2 * 11rem * 1.05));
	top:calc(1.05 * var(--dimStructure));
}

.wp-block-button__link.bloc-button-special-product{
	--form-bouton-fondColor: #000000;
    background: white;
    min-height: var(--form-input-height);
    padding-right: calc(1em + 0.5lh + var(--form-input-height));
    box-shadow: inset calc(var(--form-input-height) * -1 - 1px) 0 0 -1px var(--form-bouton-fondColor);
    border: 2px solid #000;
	margin-top:20px;
}
.title-call-to-action-zone{
	font-weight: bold;
    font-size: 2rem;
    text-align: left;
    color: #fff;
}
.col-3-personnage.col-perso-special-product-call-to-action{
    position: absolute;
    right: 3em;
    bottom: 0;

}
.col-2-texte-presentation-call-to-action{
	padding:1em 4em;
}

 .header-call-to-action-product{
  flex-direction: column;
  position: relative;
  margin-left:0;
  width:100%;
 }
 .col-2-texte-presentation-call-to-action{
  padding:1em;
 }

@media (max-width:980px){
	.header-call-to-action-producttt{
		display:none;
	}
}


.slider-nav{ z-index:1;}
.slider-indicators li::before{ content:none; }




.toTop{
	display:block;
	position:fixed;
	bottom:10px;
	right:10px;
	width:1.5em;
	height:1.5em;
	font-size:3rem;
	z-index:1;
	background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><path fill="none" stroke="%23fff" d="M2 2.5h12M7.979 13.906V4.957m4.13 3.889L7.98 4.715l-4.131 4.13" stroke-width="1"/></svg>') no-repeat center center / 1em 1em var(--couleur-principale);
	border-radius:50%;
	text-decoration:none;
	transition:0.3s ease-out;
	transition-property: opacity, background-color;
	opacity:0;
	pointer-events:none;

	&:is(:hover,:focus-within){
		background-color:var(--couleur-texte);
	}
}
.scrolledHeader .toTop{
	opacity:1;
	pointer-events:all;
}


.search-result-item{
	background:#fff;
	box-shadow:0 3px 7px rgba(0,0,0,0.15);
	padding:0;
}
.search-result-item--image{
	aspect-ratio:2;
}
.search-result-item--contenu{
	padding:1em 1.5em;
	& h2{ font-size:1.4em;
		& a{ text-decoration:none; }
	}
}