@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-noir:#222;				/* Noir texte */
	--couleur-pale:#CBCAC2;				/* Gris pâle */
	--couleur-fonce: #000;             /*Noir*/
	--couleur-couleur-principale:#D94F45; /* Couleur principale */
	--couleur-couleur-secondaire:#26221E; /* Couleur secondaire */
	--couleur-couleur-principale-gris:     #B3B3B3 ;
    --couleur-couleur-secondaire-gris:     #686868 ;
    --couleur-couleur-secondaire-gris-clair:     #A8A8A8 ;
    --couleur-couleur-secondaire-gris-x-clair:     #F8F8F8 ;

	/* Gris */
    --gray-100: #f8f9fa ;
    --gray-200: #e9ecef ;
    --gray-300: #dee2e6 ;
    --gray-400: #ced4da ;
    --gray-500: #adb5bd ;
    --gray-600: #6c757d ;
    --gray-700: #495057 ;
    --gray-800: #343a40 ;
    --gray-900: #212529 ;
/* STRUCTURE : */
	--margesDefaut:3rem; /*....................................... Espacement par défaut */
	--largeur:1200px; /*.......................................... Largeur de contenu maximale, adaptable sur différents supports */
/* 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:4rem; /*.................................. Hauteur des champs */
/* FORMULAIRES : boutons */
	--form-bouton-bordColor:var(--couleur-couleur-principale); /*. Couleur des contours de boutons */
	--form-bouton-bordWidth:2px; /*............................... Épaisseur des contours de boutons */
	--form-bouton-fondColor:var(--couleur-couleur-principale); /*. Couleur des boutons et autres éléments interactifs */
	--form-bouton-textColor:white; /*........................... Couleur du texte des boutons */
/* FORMULAIRES : checkboxes/radio */
	--form-check-taille:3rem; /*.................................. Taille des pastilles de checkboxes (entre autres) */
/* FORMULAIRES : autres */
	--outline:var(--couleur-couleur-secondaire) 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) */
}
@media(max-width:1260px){
	:root{--largeur:960px;}
}
@media(max-width:980px){
	:root{--largeur:540px;}
}
@media(max-width:600px){
	:root{--largeur:300px;}
}

/*variables couleurs*/
.white{
    color: #fff !important;
    color: var(--couleur-blanc) !important;
}
.bg-white{
    background-color: #fff !important;
    background-color: var(--couleur-blanc) !important;
}
.bg-black{
    background-color: #000 !important;
    background-color: var(--couleur-noir) !important;
}
.color-primary{
    color: #D94F45  !important;
    color: var(--couleur-couleur-principale) !important;
}
.bg-color-primary{
    background-color: #D94F45 !important;
    background-color: var(--couleur-couleur-principale) !important;
}
.color-secondary{
    color: #26221E !important;
    color: var(--couleur-couleur-secondaire) !important;
}
.bg-color-secondary{
    background-color: #26221E  !important;
    background-color: var(--couleur-couleur-secondaire) !important;
}
.color-primary-grey{
    color: #CBCAC2 !important;
    color: var(--couleur-pale) !important;
}
.bg-primary-grey{
    background-color: #CBCAC2 !important;
    background-color: var(--couleur-pale) !important;
}

/* 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{
	margin:0;
	color:var(--couleur-couleur-secondaire);
	font-family:system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
	font-size:1.8rem;
	line-height:1.5;
	min-height:100vh;
	background-color:var(--couleur-blanc);
}
body: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-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-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;
}

.templatePageTextBloc ul {
	padding-left: 20px;
}
.templatePageTextBloc ul li {
	list-style: square;
}
.templatePageTextBloc ul li::marker{
	color: var(--couleur-couleur-principale);
}
/* 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:where(:not(.site-title)),h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.like-h1,.like-h2, .like-h3, .like-h4, .like-h5, .like-h6{
	line-height:1.1;
	margin: 0 0 3rem;
	text-wrap:balance;
	font-style: italic;
	font-weight: 700;
	color: var(--couleur-couleur-secondaire);
}
h1:where(:not(.site-title,.h2,.h3,.h4,.h5,.h6)),.h1{ font-size:7rem; font-weight:800; }
h1.site-title{ margin:0; font:inherit; }
h2:not(:where(.h1,.h3,.h4,.h5,.h6)),.h2{ font-size:3em;  }
h3:not(:where(.h1,.h2,.h4,.h5,.h6)),.h3{ font-size:2em;  }
h4:not(:where(.h1,.h2,.h3,.h5,.h6)),.h4{ font-size:1.5em;}

body:not(.home) h1 span,
body:not(.home) .like-h1 span{
	font-size: 3em;
	line-height: 1;
	display: block;
}
h2, .like-h2{
	font-size: 4.5rem;
	
}
h3, .like-h3{
	font-size: 3.6rem;
}
h4, .like-h4{
	font-size:3rem;
}
h5, .like-h5{
	font-size: 2.6rem;
}
h6, .like-h6{
	font-size: 2.2rem;
}
.before-title{
	font-size: 2.4rem;
	line-height: 3.5rem;
	display: block;
	font-weight: 700;
	font-style: italic;
	text-transform: uppercase;
	color: var(--couleur-couleur-principale);

}
/* Marges titres × colonnes */
.wp-block-columns:has( .wp-block-column > :is(h1,.h1):first-child){ margin-top:calc(2 *  4  * 1em); } /* calc(margin-top * font-size * unité) */
.wp-block-columns:has( .wp-block-column > :is(h2,.h2):first-child){ margin-top:calc(2 *  3  * 1em); }
.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; }

/* 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-couleur-principale);
	background-color:transparent;
}
[id]{ scroll-margin-top:1em; /* "Décolle" la cible d'une ancre lors d'un scroll */ }

/* Medias */
img, svg, figure{
	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{
	border:none;
	margin:auto;
	width:100%;
	margin-bottom:1.5em;
	vertical-align:top;
	border-collapse:collapse;
}
table caption{
	color: var(--couleur-blanc);
	font-size: 0.9em;
	font-weight:bold;
	margin:5px 0;
	text-align:left;
}
th{
	padding: 2rem;
	
}
td{
	max-width:100%;
	border: none;
	padding:2rem;
}

/* 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; }
.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; }
.container,
.alignfull > .wp-block-group__inner-container{
	width:var(--largeur);
	max-width:100%;
	margin-inline:auto;
}

/*header*/
.headertopBar {
	position: relative;
    padding: 15px 0;
	z-index:1;
}
.main-navigation ul.site-header-menu--level-1-ul {
	color: var(--couleur-blanc);
	display: flex;
	align-items: center;
	gap:30px;
}
.main-navigation ul.site-header-menu--level-1-ul li{
	position: relative;
}
.main-navigation ul.site-header-menu--level-1-ul li a::after {
	content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 100%;
    height: 3px;
    background-color: var(--couleur-couleur-principale);
    transform: scaleX(0);
    transform-origin: center;
    transition: transform .2s ease-in-out;
    z-index: 99999;
    opacity: 0;
}
.main-navigation ul.site-header-menu--level-1-ul li.current-menu-item a::after {
	transform: scaleX(1);
    transition: transform .2s ease-in-out;
    opacity: 1;
}
/*.main-navigation ul.site-header-menu--level-1-ul li:not(:nth-last-child(-n+2)) {
    padding-left: 40px; /* Appliquer le padding seulement aux éléments qui ne sont pas les deux derniers */
	/*transition: 0.8s all;
}*/
.main-navigation ul.site-header-menu--level-1-ul li:not(:nth-last-child(-n+2)):hover {
    color: var(--couleur-couleur-secondaire-gris-clair);
	transition: 0.8s all;
}
.main-navigation ul.site-header-menu--level-1-ul .btn-contact {
	background-color: var(--couleur-fonce);
	border-color: var(--couleur-fonce);
	padding: 1rem 3rem;
}
.main-navigation ul.site-header-menu--level-1-ul .btn-contact:hover {
	background-color: var(--couleur-couleur-secondaire-gris);
	border-color: var(--couleur-couleur-secondaire-gris);
}
.main-navigation ul.site-header-menu--level-1-ul .btn-phone{
	/* padding: 0.5rem 1.5rem; */
	color: var(--couleur-blanc);
	background-color: var(--couleur-couleur-principale);
	padding: 1rem 3rem;
}
.main-navigation ul.site-header-menu--level-1-ul .btn-phone:hover{
	/* padding: 0.5rem 1.5rem; */
	color: var(--couleur-couleur-principale);
	background-color: transparent;
	border-color: var(--couleur-couleur-principale);
}

.header-container {
	position: absolute;
	left:0;
	right: 0;
}
.headerPage.entry-header .header-container  {
	top:70px;
}
.header-container .site-header-logo {
	position: relative;
	padding: 30px 0;
	z-index: 1;
}
.header-container .site-header-logo img {
	width: 197px;
}

/*En-tête*/
/* .headerPage {
	margin-top: -160px;
} */
.headerPage.headerPage-home {
	position: relative;
}
.headerPage.headerPage-home::after {
	content:"";
	position: absolute;
	right: 0;
	bottom: 0;
	background-image: url(/wp-content/themes/atelier/design/codirel-header-page.png);
	width: 294px;
	height: 337px;
}
.headerPage.headerPage-home .text {
	z-index: 1;
}
.headerPage.headerPage-home .overlay {
	position: absolute;
	left:0;
	bottom: 0;
	top: 0;
	right: 0;
	background: linear-gradient(135deg, #707070 50%, transparent 50%);
	opacity: 0.8;
}
.headerPage.entry-header {
	padding: 18rem 0;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
.headerPage.entry-header .headerPage-content .headerPage-content-text {
	position: relative;
	z-index: 1;
}
.headerPage-text {
	font-style: italic;
	font-size: 4.4rem;
	line-height: 5.3rem;
}

/*Footer*/
#footer-inner {
	padding:10rem 0;
}
#footer-inner .footer-title {
	font-weight: 700;
	margin-bottom: 25px;
}

#legal-notice .footer-navigation ul#menu-menu-footer {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
#legal-notice ul li a {
    font-size: 1.6rem;
    color: #797979;
	transition: 0.8s all;
}
#legal-notice ul li a:hover {
	color: var(--couleur-blanc);
	transition: 0.8s all;
}
#legal-notice ul:not(.headertopBarRs) li:not(:last-child) a::after {
    content: "|";
    margin: 0 10px;
}

/* 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-couleur-principale);
	color:var(--couleur-blanc);
}

/* 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 à 1260px 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,
.is-layout-grid{
	--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,
.is-layout-grid{
	--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)); }
.is-layout-grid{ grid-template-columns:repeat(auto-fill, minmax(min(12rem,100%),1fr)); }
@media(max-width:1260px){
	: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"],
[class*="btn-"],
::file-selector-button,
.bouton, .wp-block-button__link, .form--file-bouton{
	display:inline-block;
	line-height:1.2;
	padding:1rem 3.5rem;
	background:var(--form-bouton-fondColor);
	color:var(--form-bouton-textColor)!important;
	border:var(--form-bouton-bordWidth) solid var(--form-bouton-bordColor);
	cursor:default;
	overflow:visible;
	user-select:none;
	text-decoration:none;
	transition:0.3s ease-out;
	transition-property:color, background-color, border-color;
	cursor: pointer;
	font-weight: 600;

	/* 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(&):not(:disabled):is(:hover,:focus-visible),
	:where([type="file"]:not(:disabled):is(:hover,:focus-visible))::file-selector-button,
	:where(.form-fileInput [type="file"]:not(:disabled):is(:hover,:focus-visible)) + .form--file-bouton{
		--form-bouton-bordColor:var(--couleur-couleur-secondaire);
		--form-bouton-fondColor:var(--couleur-couleur-secondaire);
		--form-bouton-textColor:var(--couleur-blanc);
	}
}

/*bouton : rouge*/
.btn-primary,
.btn-primary:link,
.btn-primary:visited {
	background: var(--couleur-couleur-principale);
	color: var(--couleur-blanc);
	border: 1px solid var(--couleur-couleur-principale);
}
.btn-primary:hover,
.btn-primary:focus{
	background: transparent;
	color: var(--couleur-couleur-principale)!important;
}

/*==== 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(--form-bouton-fondColor),
	           inset 0 0 0 var(--form-bouton-bordWidth) var(--form-bouton-fondColor);
}
.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;
}

.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)));}


/* Liens */

a, a:link,a:visited{
	text-decoration: none;
	color: var(--couleur-couleur-secondaire-light-grey);
}
#wrapper a, #wrapper a:link,#wrapper a:visited{
	color: var(--couleur-couleur-secondaire);
}

/*================*\
#    NAVIGATION    #
\*================*/

.slider-indicators-dark .slider-indicators>*, .slider-indicators-dark.slider-indicators>* {
	background-color: #CBCAC2!important;
	width:31px;
	height: 31px;
}
.slider-indicators .active {
	background-color: var(--couleur-couleur-principale)!important;
}

/*============================================*\
#      Style de la page d'accueil     #
\*============================================*/



.home h1{
    color: var(--white);
}

.bigger_title{
    font-size: 8rem;
    font-weight: 900;
}

.first-word{
    color: var(--color-primary);
}
.smaller_title{
    font-size: 4.8rem;
    line-height: 6.4rem;
    letter-spacing: 0.2px;
    font-weight: 300;
    text-transform: initial;
}

.localisation{
    font-size: 2.4rem;
    line-height: 3rem;
    font-weight: 300;
    text-transform: initial;
    margin-bottom: 7rem;
}

.more_home_item{
    border: 1px solid #E7EBF0;
}
.more_home_item .picto {
	width: 125px;
}

.activities_home_bg {
	background: linear-gradient(to bottom, #CBCAC2 50%, #FFF 50%);
	position: relative;
}
#activities_home {
	padding: 10em 0 12em 0;
	-webkit-clip-path: polygon(0 5%, 100% 0%, 100% 95%, 0% 100%);
    clip-path: polygon(0 5%, 100% 0%, 100% 95%, 0% 100%);
}
#activities_home .activities-content h2 {
	color: var(--couleur-blanc);
}
#activities_home .blocVignettesCarrefours-itemContent .image-activity img {
	filter: grayscale(100%);
}

#testimonies_home .name{
    font-style: italic;
    color: var(--color-primary-grey);
    margin-top: 3rem;
}
#testimonies_home{
    padding-bottom: 30rem;
    margin-bottom: -12rem;
}
#testimonies_home p{
    font-style: italic;
}
#testimonies_home .name::after,
#testimonies_home .name::before{
    content: '';
    display: inline-block;
    width: 50px;
    height: 3px;
    background-color: var(--color-primary-grey);
    -webkit-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
            transform: translateY(-100%);

}
#testimonies_home .name::after{
    margin-left: 30px;
}
#testimonies_home .name::before{
    margin-right: 30px;
}
.testimonies_listing .slider-nav {
	top:inherit;
	bottom: -10%;
	background-color: var(--couleur-couleur-principale);
	filter: none;
}
.testimonies_listing .slider-nav.slider-nav-prev {
	left:40%;
}
.testimonies_listing .slider-nav.slider-nav-next {
	right: 40%;
}

@media (min-width: 1000px){

    .activities_home_bg::before,
    .activities_home_bg::after
    {
        content: '';
        background-repeat: no-repeat;
		background-size: cover;
        display: block;
        width: 283px;
        height: 318px;
        position: absolute;
    }
    .activities_home_bg::before{
        background-image: url(/wp-content/themes/atelier/design/element_logo.png);
        right: 0;
        top: -70px;
        background-position: top right;
		z-index: 1;
    }
    .activities_home_bg::after{
        background-image: url(/wp-content/themes/atelier/design/element_logo.png);
        left: 0;
        bottom: -140px;
        background-position: top left;
    }
}

/*================*\
#    RESPONSIVE   #
\*================*/
@media(min-width:981px){
	.menu-toggle{ display:none; }
	[role="menubar"]{
		display:flex;
		position:relative;
	}
	[role="menubar"] :where([class*="--level-2-ul"]){
		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"] :where([aria-expanded="true"] + [class*="--level-2-ul"]){ height:auto; }
}

/* Tablette */
@media (min-width:768px) and (max-width:1199px){
	h1, .like-h1{
		font-size: 6rem;
	}
	body:not(.home) h1 span, body:not(.home) .like-h1 span{
		font-size: 6rem;
	}
	h2, .like-h2{
		font-size: 4rem;
	}
	h3, .like-h3{
		font-size: 3rem;
	}
	h4, .like-h4{
		font-size:2.4rem;
	}
	h5, .like-h5{
		font-size: 2.2rem;
	}
	h6, .like-h6{
		font-size: 2rem;
	}
}

@media (max-width:768px) {
	h1, .like-h1{
		font-size: 4.5rem;
	}
	
	/* h1 span, .like-h1 span{
		font-size: 1.4em !important;
	} */
	h2, .like-h2{
		font-size: 3rem;
	}
	h3, .like-h3{
		font-size: 2.5rem;
	}
	h4, .like-h4{
		font-size:2rem;
	}
	.main-homeTitle .kalam{
		font-size: 3.4em !important;
	}
	.main-homeTitle h1{
		font-size: 1.8em !important;
	}
	.before-title {
		font-size: 1.7rem;
	}

	.headerPage-text {
        font-size: 2.3rem!important;
        line-height: 3rem!important;
    }

	/*footer*/
	#footer-inner {
    	padding: 4rem 0;
	}

	body {
		font-size: 1.6rem;
	}
	[class*="btn-"] {
		padding: 1rem 2.5rem;
		text-align: center;
	}
}

@media (max-width:1260px) {
	.main-navigation ul.site-header-menu--level-1-ul li:not(:nth-last-child(-n+2)) {
		padding-left: 0;
	}
	.main-navigation ul.site-header-menu--level-1-ul {
    	gap: 20px;
	}

	.headerPage-text {
    	font-size: 3rem;
    	line-height: 3.5rem;
	}
}

@media (max-width:1000px) {
	.header-container {
    	position: inherit;
	}
	.site-header-logo img {
		width: 150px;
	}
	.headerPage.entry-header {
    	padding: 13rem 0;
	}

	#activities_home {
    	padding: 7em 0 7em 0;
	}

	.image.cover img {
		padding:0;
		margin-bottom: 20px;
	}
}

@media (max-width:981px) {
	.main-navigation ul.site-header-menu--level-1-ul {
		display: none;
	}
	#site-navigation {
		width: 100%;
	}
	.main-navigation.active .site-header-menu--level-1-ul {
		display: flex!important;
		flex-direction: column;
	}

	.testimonies_listing .slider-nav.slider-nav-prev {
		left:0;
	}
	.testimonies_listing .slider-nav.slider-nav-next {
		right: 0;
	}
}