/* ===== Plugin accessibilité Joomla (ba-accessibility) ===== */
:root{
    --ba-awidth:25em;
    --ba-abutton-size:6.4em;
    --ba-aradius: .6em;
    --ba-abg: #eff5ff;
    --ba-acolor: #37446a;
    --ba-aborder: #fff;
    --ba-abox-shadow: -1px -1px 0 0 rgba(0,0,0,.2), 1px 1px 0 0 rgba(255,255,255,.8);
    --ba-aprimary: #007aff;
    --ba-aprimary-shadow: rgba(0, 122, 255, 0.5);
}
@font-face {
    font-family: 'OpenDyslexic';
    font-style: normal;
    font-weight: 400;
    src:  url('../fonts/opendyslexic/OpenDyslexic-Regular.woff2') format('woff2');
    font-display: swap;
}
.ba__accessibility-dark-mode{
    --ba-abg: #242a35;
    --ba-acolor: #fff;
    --ba-aborder: rgba(127, 149, 187, 0.31);
    --ba-abox-shadow: -1px -1px 0 0 rgba(0,0,0,.3), 1px 1px 0 0 rgba(255,255,255,.2);
}
.ba__accessibility{display:flex;position:fixed; z-index:999999;left:auto;right:15px;top:30px;bottom: 30px;font-size: 1rem; -webkit-user-select:none;-ms-user-select:none;-moz-user-select:none;user-select:none}
.ba__accessibility *{box-sizing:border-box; font-size: inherit;}
.ba__accessibility svg{max-width: 100%; max-height: 100%; height: auto; display: block;}
.ba__accessibility-container{background: var(--ba-abg); color: var(--ba-acolor); border-radius:var(--ba-aradius); border: 1px solid var(--ba-aborder); box-shadow:0 0 2em rgba(29, 81, 164, 0.35);overflow:hidden; padding: .7em; display: block; width:var(--ba-awidth); height:100%; position: absolute; left: auto; right:calc(var(--ba-awidth) * -1.5); top: 0; transition: left .5s ease .1s, right .5s ease .1s;}
.ba__accessibility-body{overflow: auto; display: block;width: 100%; height: calc(100% - 3.2em);}
.ba__accessibility-body > *{display: flex; flex-wrap: wrap; border-radius:var(--ba-aradius); background: rgba(14, 36, 89, 0.1);box-shadow:var(--ba-abox-shadow); margin:.5em .2em .2em; padding: .5em;}
.ba__accessibility-body > * > :only-child{display: none !important;}
.ba__accessibility-body > * > :first-child{margin-top:0;}
.ba__accessibility-body > * > .ba__accessibility-title{display: block; width: 100%;font-weight:500;font-size: 1.2em;padding: 0 .3em .2em;}
.ba__accessibility [class*="-button"],
.ba__accessibility [class$="-slider"],
.ba__accessibility [class*="-color"]{width:calc(33.33% - .6em); height: var(--ba-abutton-size); border-radius:var(--ba-aradius); display: flex; justify-content: center;background: rgba(255, 255, 255, 0.2); margin: .3em; padding: .5em; flex-direction:column; text-align: center; cursor: pointer;border: 1px solid var(--ba-aborder); box-shadow: 0 0 2px rgba(0,0,0,.3);}
.ba__accessibility [class*="-button"] :last-child,
.ba__accessibility [class$="-slider"] label,
.ba__accessibility [class*="-color"] label{display: block; width: 100%; font-size:.8em;font-style: normal;text-transform: capitalize; margin: 0;}
.ba__accessibility [class$="-slider"] label,
.ba__accessibility [class*="-color"] label{width: 12em;display: flex;align-items: center; padding:0 .5em;}
.ba__accessibility [class*="-button"] svg{width: auto; height:2em;}
.ba__accessibility [class*="-button"]:hover{box-shadow:0 0 1em var(--ba-aprimary-shadow);}
.ba__accessibility [class$="-slider"],
.ba__accessibility [class*="-color"]{width:calc(100% - .5em); height: 3.6em; text-align: left;flex-direction: row; padding: 0;}
.ba__accessibility [class$="-slider"] svg{height:3em;}
.ba__accessibility .ba__accessibility-header{display: flex; justify-content: space-between; align-items: center;}
.ba__accessibility .ba__accessibility-header > *,
.ba__accessibility .ba__accessibility-header > *:hover{background: none !important; border: 0; box-shadow: none; width: 48px; height: 48px; padding: 0; margin: 0; font-size: 1.2em;display: flex; align-items: center; color: inherit !important; position: relative;}
.ba__accessibility .ba__accessibility-header > * i{display: none !important; position: absolute; left:50%; top:0; z-index: 5; background: rgba(110, 123, 157, 0.3);color: var(--ba-acolor); padding: .2em .5em; border-radius: var(--ba-aradius);width:auto !important;font-size: .6em !important;transform: translate(-50%, -45%);white-space: nowrap;}
.ba__accessibility .ba__accessibility-header > .ba__accessibility-logo-button{order: -1;}
.ba__accessibility .ba__accessibility-header > .ba__accessibility-title{width: 100%;padding: 0 .3em;font-weight: 600;text-transform: uppercase;}
.ba__accessibility > .ba__accessibility-action-button{background:var(--ba-aprimary); border-radius: 50%;display: flex;justify-content: center;align-items: center;color: #fff; fill:currentColor; border: 0;width: 4.3em;height: 4.3em;box-shadow: 0 0 2em rgba(0, 0, 0, .3); position: relative;}
.ba__accessibility > .ba__accessibility-action-button svg{height: 3em;}

.ba__accessibility .ba__accessibility-header .ba__accessibility-action-button:hover{color:#c61a1a !important;}
.ba__accessibility .ba__accessibility-reset-button:hover{color: var(--ba-aprimary) !important;}
.ba__accessibility .ba__accessibility-reset-button > svg,
.ba__accessibility .ba__accessibility-dark-mode-button > svg{width: 1.1em; height:1.1em;}
.ba__accessibility .ba__accessibility-reset-button:hover > i,
.ba__accessibility .ba__accessibility-dark-mode-button:hover > i,
.ba__accessibility .ba__accessibility-action-button:hover > i{display: block !important;}

.ba__accessibility-open .ba__accessibility-container{left: auto; right: 0;}
.ba__accessibility-open > [class*="-button"]{display: none !important;}

.ba__accessibility-slider-body > div{position: static; display: flex;align-items: center;}
.ba__accessibility-slider-body > div > i{position:relative;right:0;top:0;left: auto; background:rgba(95, 118, 153, 0.2);display: block;font-size: .6em;padding:.3em .5em;border-radius:1em;line-height: 1;width:8em;text-align: center;font-weight: bold;color:var(--ba-acolor); box-shadow: 1px 1px 0 rgba(255,255,255,.3),-1px -1px 0 rgba(0,0,0,.2);}
.ba__accessibility-slider-body[data-enable]> div > i{background:var(--ba-aprimary);color:#fff;}
.ba__accessibility-slider-body{display: flex; align-items: center; position: relative;}
.ba__accessibility-slider-body > i[class*="-button"]{width:3em; height:3em; padding: .3em 0;background: none;border: 0;box-shadow: none !important;}
.ba__accessibility-colour-body{display: flex; align-items: center; position: relative; padding-right: .5em;}
.ba__accessibility-colour-body > i[class*="-button"]{width:1.5em; height:1.5em; display: block;border-radius: 50%;margin: 0 3px 0 0; position: relative;}
.ba__accessibility-colour-body > .ba__accessibility-active::before,
.ba__accessibility-colour-body > .selected::before{position: absolute; left:9%; top:10%; width:80%; height:80%;content: '';z-index: 3; border-radius: 50%; border: 2px solid #fff; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%234AF90B' stroke-width='2' d='m5 12l5 5L20 7'/%3E%3C/svg%3E");}
.ba__accessibility-range-input{width:100%;height:1.5em;padding:0 .2em;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border: 0; outline: 0; box-shadow:none !important; border-radius: 1em; margin:.3em 0 0; display: none;}
.ba__accessibility-range-input:focus{border: 0; outline: 0 none;}
.ba__accessibility-range-input:focus::-webkit-slider-thumb{box-shadow:0 0 0 1px #fff,0 0 0 .25em var(--ba-aprimary-shadow)}
.ba__accessibility-range-input:focus::-moz-range-thumb{box-shadow:0 0 0 1px #fff,0 0 0 .25em var(--ba-aprimary-shadow)}
.ba__accessibility-range-input::-moz-focus-outer{border:0}
.ba__accessibility-range-input::-webkit-slider-thumb{width:1em;height:1em;margin-top:-.25em;-webkit-appearance:none;appearance:none;background-color:var(--ba-aprimary);border:0;border-radius:1em;cursor:-webkit-grab;cursor:grab;}
.ba__accessibility-range-input::-webkit-slider-thumb:active{-webkit-filter: sepia(30%);filter: sepia(30%);}
.ba__accessibility-range-input::-webkit-slider-runnable-track{width:100%;height:.5em;color:transparent;cursor:pointer;border:1px solid rgba(150,150,150,.15);border-radius:1em;background:linear-gradient(0deg,rgba(255, 255, 255, 0.2) 0%, rgba(56, 66, 88, 0.2) 100%);}
.ba__accessibility-range-input::-moz-range-thumb{width:1em;height:1em;-moz-appearance:none;appearance:none;background-color:var(--ba-aprimary);border:0;border-radius:1em;cursor:grab;}
.ba__accessibility-range-input::-moz-range-thumb:active{-webkit-filter: sepia(30%);filter: sepia(30%);}
.ba__accessibility-range-input::-moz-range-track{width:100%;height:.5em;color:transparent;cursor:pointer;border:1px solid rgba(150,150,150,.15);border-radius:1em;background:linear-gradient(0deg,rgba(255, 255, 255, 0.2) 0%, rgba(56, 66, 88, 0.2) 100%);}
.ba__accessibility-range-input[disabled]{background: none; opacity: .5;}


.ba__accessibility .ba__accessibility-active:not([class*="-color"]){background: var(--ba-aprimary); color: #fff;}

.ba__accessibility-left-font{text-align: left !important;}
.ba__accessibility-center-font{text-align: center !important;}
.ba__accessibility-right-font{text-align: right !important;}
.ba__accessibility-heading{outline: 2px solid #10c2fd !important;}
.ba__accessibility-link{outline:2px solid #ce16a9 !important;}
.ba__accessibility-hover:hover{background: rgba(250, 225, 1, 0.5) !important;}
.ba__accessibility-dyslexia-font,
.ba__accessibility-dyslexia-font *{font-family: OpenDyslexic,Arial,sans-serif !important;}
.ba__accessibility-readable-font,
.ba__accessibility-readable-font *{font-family: Tahoma,Arial,Helvetica,Verdana,sans-serif !important}



.ba__accessibility-hide-image body img,
.ba__accessibility-hide-image body > :not(.ba__accessibility) svg{display: none !important; opacity: 0 !important; visibility: hidden !important;}
.ba__accessibility-stop-animation,
.ba__accessibility-stop-animation *{transition: none !important;-webkit-animation-fill-mode: forwards !important;animation-fill-mode: forwards !important;-webkit-animation-iteration-count: 1 !important;animation-iteration-count: 1 !important;-webkit-animation-duration: 0.01s !important;animation-duration: 0.01s !important;}
.ba__accessibility-cursor,
.ba__accessibility-tip{position: fixed;z-index: 999999999;pointer-events: none;top:5em;left:5em;display: none;}
.ba__accessibility-big-cursor *{cursor: none !important;}
.ba__accessibility-big-cursor .ba__accessibility-cursor{width:4em;height:4em;background:rgba(255,0,0,.3);border-radius:50%;display: block;mix-blend-mode:difference; transform: translate(-50%, -50%);}
.ba__accessibility-mask-cursor .ba__accessibility-cursor{width:100%;height:15vh;background:transparent;border:10px solid #fff;border-left:0;border-right:0;box-shadow:0 0 0 100vh rgba(0, 0, 0, .8);transition:none;transform:translate(0,-50%);left:0 !important; display: block;}
.ba__accessibility-guide-cursor .ba__accessibility-cursor{width:25vw;height:8px;background:#000;border:#ff0 2px solid;transition:all .1s ease;transform-origin:center;transform:translate(-50%,50%); display: block;}
.ba__accessibility-guide-cursor .ba__accessibility-cursor::before{width:1.6em; height:1.6em; border: .8em solid; border-color: transparent transparent #ff0 transparent; position: absolute; left: calc(50% - .8em); top: auto; bottom: 100%; display: block; content: '';}
.ba__accessibility-read-mode body{background: #e3e6ec !important;}
.ba__accessibility-read-mode body > .ba__accessibility-readability{margin:0 auto;max-width:40em;font-size: 16px !important;line-height: 1.5 !important;background: #fff;color: #000;padding:1.5em;border-radius:var(--ba-aradius);overflow: hidden; box-shadow:0 0 1em var(--ba-aprimary-shadow);}
.ba__accessibility-magnifier .ba__accessibility-tip{background: rgba(0, 0, 0, .8); color: #fff; border-radius: 5px; padding: .3em .5em;display: none;font-size: 2em;line-height: 1;transform: translate(-50%, 15px);max-width: 650px;}



.ba__accessibility-blend-invert-blend{-webkit-filter: invert(1);filter: invert(1);}
.ba__accessibility-blend-grayscale-blend{-webkit-filter: grayscale(100%);filter: grayscale(100%);}
.ba__accessibility-blend-low-saturation-blend{-webkit-filter: saturate(50%);filter: saturate(50%);}
.ba__accessibility-blend-high-saturation-blend{-webkit-filter: saturate(200%);filter: saturate(200%);}
.ba__accessibility-blend-dark-contrast-blend > body,
.ba__accessibility-blend-dark-contrast-blend > body > .ba__accessibility-readability,
.ba__accessibility-blend-dark-contrast-blend .ba__accessibility-contrast{background: #000 !important; color: #fff !important; border-color: #fff !important;}
.ba__accessibility-blend-light-contrast-blend > body,
.ba__accessibility-blend-light-contrast-blend > body > .ba__accessibility-readability,
.ba__accessibility-blend-light-contrast-blend .ba__accessibility-contrast{background: #fff !important; color: #000 !important; border-color: #000 !important;}

.ba__accessibility-dark-mode-button.ba__accessibility-active{color: var(--ba-aprimary) !important;}

.ba__accessibility-iconpos-start .ba__accessibility{align-items: flex-start;}
.ba__accessibility-iconpos-end .ba__accessibility{align-items: flex-end;}
.ba__accessibility-iconpos-center .ba__accessibility{align-items: center;}

.ba__accessibility.ba__accessibility-hide{display:none !important;}
.ba__accessibility-static .ba__accessibility{position: static !important;}
.ba__accessibility-static .ba__accessibility > *{position: relative !important;}
.ba__accessibility-position-left .ba__accessibility{left: 20px; right: auto;bottom:20px}
.ba__accessibility-position-left .ba__accessibility .ba__accessibility-container{left: calc(var(--ba-awidth) * -1.5);}
.ba__accessibility-position-left .ba__accessibility-open .ba__accessibility-container{left:0; right: auto;}


.ba__accessibility:not(.ba__accessibility-open) > [class*="-button"]::after{content:'';width:0;height:0;border:.5em solid #0980ff; border-radius:50%;position:absolute;z-index:-1;top:50%;left:50%;transform:translate(-50%,-50%); opacity:0;-webkit-animation:ring 1.5s infinite;animation:ring 1.5s infinite; display: block;}
.ba__accessibility:not(.ba__accessibility-open) > [class*="-button"]:hover::after,
.ba__accessibility.ba__accessibility-open > [class*="-button"]::after{-webkit-animation: none;animation: none; display: none;}
@-webkit-keyframes ring {
0%{width:1em;height:1em;opacity:1;border-width:.5em}
100%{width:10em;height:10em;opacity:0;border-width:5em}
}
@keyframes ring {
0%{width:1em;height:1em;opacity:1;border-width:.5em}
100%{width:10em;height:10em;opacity:0;border-width:5em}
}

@media (max-width: 575px) {
    .ba__accessibility{--ba-awidth: 10rem !important;}
    .ba__accessibility [class*=title], .ba__accessibility-logo-button{display: none !important;}
    .ba__accessibility > * [class*="-button"]{width: calc(99% - .6em) !important;}
    .ba__accessibility [class$="-slider"], .ba__accessibility [class*="-color"]{height: auto !important;}
    .ba__accessibility-slider-body > i[class*="-button"]{width:1.8rem !important;}
    .ba__accessibility-colour-body > i[class*="-button"]{width: 1.5em !important;height: 1.5em !important;margin: 0 3px 3px 0 !important;}
    .ba__accessibility-colour-body{flex-wrap: wrap; padding: .5rem; justify-content: center;}
    .ba__accessibility-slider-body{flex-wrap: wrap;justify-content: center;padding: .5rem .5rem 0;}
    .ba__accessibility-slider-body > div{order: -1;}
    .ba__accessibility [class$="-slider"], .ba__accessibility [class*="-color"]{flex-wrap: wrap;}
    .ba__accessibility [class$="-slider"] label, .ba__accessibility [class*="-color"] label{font-size: .7em !important; margin-top: .3em !important;text-align: center !important;display: block !important;}
}

/* ===== Gestimark — thème visuel du site (gtm_template_5.1) ===== */
/* #region STRUCTURE ----------------------------------------------------------------------------------------------------- */

/* ---------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------------
STRUCTURE
------------------------------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------------------------- */

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  RESET
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* annule le zoom au double tap sur mobile */
* {
  touch-action: manipulation;
}

[id] {
    scroll-margin-top: 80px; /* Ajustez selon la hauteur de votre menu */
}

html {
  max-width: 2560px;
  height: 100%;
  margin: 0 auto;
  font-size: 22px;
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  display: flex;
  flex-direction: column;
  min-height: 100dvh;
  font-family: var(--font-secondary-ligth);
  background-color: var(--color-background-body);
  color: var(--color-font);
}

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

.gtm-wrapper {
  flex-grow: 1;
  position: relative;
}

@media screen and (min-width: 992px) { 
  .gtm-wrapper {
    padding-top: var(--space-lg);
    padding-bottom: var(--space-lg);
  }
}

/* Espace gauche/droite de la page : var(--space-lg) à TOUTES les largeurs (Gestimark 2026-09-28).
   Le gabarit ne l'appliquait qu'à partir de 375px, alors que les blocs à fond (.gtm-bg-*) sortent
   de ce padding par une marge négative de var(--space-lg) : sous 375px ils débordaient de l'écran
   (défilement latéral de 33px à 320px sur 8 pages). */
.gtm-wrapper {
  padding-left: var(--space-lg);
  padding-right: var(--space-lg);
}

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  TYPOGRAPHIES
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

@font-face {
  font-family: 'lato-regular';
  src: url('../fonts/lato-regular.woff2') format('woff2');
  font-display: swap;
}

@font-face {
  font-family: 'lato-light';
  src: url('../fonts/lato-light.woff2') format('woff2');
  font-display: swap;
}

@font-face {
  font-family: 'lato-bold';
  src: url('../fonts/lato-bold.woff2') format('woff2');
  font-display: swap;
}

@font-face {
  font-family: 'roboto-regular';
  src: url('../fonts/roboto-regular.woff2') format('woff2');
  font-display: swap;
}

@font-face {
  font-family: 'roboto-light';
  src: url('../fonts/roboto-light.woff2') format('woff2');
  font-display: swap;
}

@font-face {
  font-family: 'roboto-bold';
  src: url('../fonts/roboto-bold.woff2') format('woff2');
  font-display: swap;
}

@font-face {
  font-family: 'glegoo';
  src: url('../fonts/glegoo-bold.woff2') format('woff2');
  font-display: swap;
}

@font-face {
  font-family: 'neonderthaw';
  src: url('../fonts/neonderthaw-regular.woff2') format('woff2');
  font-display: swap;
}

@font-face {
  font-family: 'sacramento';
  src: url('../fonts/sacramento-regular.woff2') format('woff2');
  font-display: swap;
}


/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  VARIABLES
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* --------------------------------------------------
TYPOGRAPHIES 
-------------------------------------------------- */

:root {

  /* Polices ------------------------------------- */

  --font-primary: 'lato-regular', sans-serif; /* police principale */
  --font-primary-light: 'lato-light', sans-serif; /* police principale */
  --font-primary-bold: 'lato-bold', sans-serif; /* police principale */

  --font-secondary: 'roboto', sans-serif; /* police secondaire */
  --font-secondary-ligth: 'roboto-light', sans-serif; /* police secondaire */
  --font-secondary-bold: 'roboto-bold', sans-serif; /* police secondaire */
 
  --font-heading: 'roboto', sans-serif; /* police titre */
  
  --neonderthaw: 'neonderthaw', sans-serif;
  --glegoo: 'glegoo', sans-serif;
  --sacramento: 'sacramento', sans-serif;
  
  /* Tailles des polices ------------------------------------- */

  /* Typographie responsive - Mobile (320px) à Desktop XL (1920px+) */
  --font-size-xs: clamp(0.625rem, 0.5rem + 0.5vw, 0.875rem);        /* 10-14px */
  --font-size-sm: clamp(0.75rem, 0.625rem + 0.5vw, 1rem);           /* 12-16px */
  --font-size-md: clamp(0.875rem, 0.75rem + 0.5vw, 1.125rem);       /* 14-18px */
  --font-size-lg: clamp(1rem, 0.875rem + 0.5vw, 1.375rem);          /* 16-22px */
  --font-size-xl: clamp(1.125rem, 0.875rem + 1vw, 1.75rem);         /* 18-28px */
  --font-size-2xl: clamp(1.25rem, 0.875rem + 1.5vw, 2.25rem);       /* 20-36px */
  --font-size-3xl: clamp(1.5rem, 1rem + 2vw, 3rem);                 /* 24-48px */
  --font-size-4xl: clamp(1.875rem, 1rem + 3vw, 3.75rem);            /* 30-60px */
  --font-size-5xl: clamp(2rem, 1rem + 4vw, 4rem);                   /* 32-64px */

  --font-size-slogan: clamp(1.125rem, 0.875rem + 1vw, 1.75rem);     /* 18-28px */ 
  
}

/* --------------------------------------------------
COULEURS
-------------------------------------------------- */

/* Palette de couleurs ---------------------------- */
:root {

  --color-noir: #282729;
  --color-beige: #d4c1ae;
  --color-beige-fonce: #C3956A;

/* Body -------------------- */

  --color-background-body: transparent;

/* Gestimark  ----------------- */

  --color-gestimark-primary: #f19e1f;
  --color-gestimark-secondary: #ef5245;

/* Général  ----------------- */

  --color-primary: #f19e1f; 
  --color-secondary: #ef5245;

/* Fonts  ----------------- */ 

  --color-font: #282729;
  --color-light: white;
  --color-heading: #d4c1ae;
  --color-heading-2: #282729;
  --color-form: #000;

/* Liens  ----------------- */

  --color-link: #F1B322;
  --color-link-visited: #F1B322;
  --color-link-light: whitesmoke;
  --color-link-hover: #c3901b;

/* Boutons  ----------------- */

  --color-button: #282729;
  --color-button-hover: #c3901b;
  --color-texte-button: #ffffff;

/* Background  ----------------- */ 
 
  --color-background-classic: #d4c1ae; 
  --color-background-opacity: rgba(0, 0, 0, .5);
  --color-background-gradient: linear-gradient(0deg, rgba(34, 193, 195, 1) 0%, rgba(253, 187, 45, 1) 100%);
  --color-background-1: #e7acac;
  --color-background-2: #b9dfb9;
  --color-background-3: #b9b9d8;

/* Menu  ----------------- */ 

  --color-background-menu: white;
  --color-background-sub-menu: #d4c1ae;
  --color-background-burger: black;
  --color-background-burger-line: whitesmoke;
  --color-menu-contact: #000;
  --color-menu-texte-contact: #fff;
  --color-menu-contact-hover: grey;
  --color-link-menu: black;
  --color-link-menu-hover: #fff;
  --color-link-menu-active: #fff;
  --color-link-sub-menu: #000;
  --color-link-sub-menu-hover: #fff;
  --color-link-sub-menu-active: #fff;

/* FAQ  ----------------- */

  --color-background-question-faq: #d4c1ae;
  --color-background-reponse-faq: whitesmoke;
  --color-texte-question-faq: #000;
  --color-texte-reponse-faq: #202020;

/* Copyright  ----------------- */

  --color-background-copyright: #fff;

/* Dark mode ----------------- */

/* Switch */
  --color-background-switch-light: #4869e0;
  --color-background-switch-dark: #f1d710;
  --color-switch: whitesmoke;

/* Background */
  --color-background-dark-mode: #202020;
}

/* --------------------------------------------------
ESPACEMENTS
-------------------------------------------------- */

/* Marges et paddings ------------------------------------- */

:root {
  --space-xs: clamp(0.25rem, 0.5vw, 0.5rem); /* 4px → 8px */
  --space-sm: clamp(0.5rem, 1vw, 1rem); /* 8px → 16px */
  --space-md: clamp(1rem, 2vw, 1.5rem); /* 16px → 24px */
  --space-lg: clamp(1.5rem, 3vw, 2.5rem); /* 24px → 40px */
  --space-xl: clamp(2rem, 4vw, 3.5rem); /* 32px → 56px */
  --space-2xl: clamp(2.5rem, 5vw, 5rem); /* 40px → 80px */
  --space-3xl: clamp(3rem, 6vw, 6rem); /* 48px → 96px */
  --space-4xl: clamp(4rem, 8vw, 8rem); /* 64px → 128px */
  --space-5xl: clamp(5rem, 10vw, 12rem); /* 80px → 192px */ 
}


/* --------------------------------------------------
ESPACEMENTS
-------------------------------------------------- */

/* Bordures -------------------------------------  */

:root {
  --border: 2px solid red; /* Bordure tout autour de l'élément */
  --border-top: 2px solid red; /* Bordure top */
  --border-right: 2px solid red; /* Bordure right */
  --border-bottom: 2px solid red; /* Bordure bottom */
  --border-left: 2px solid red; /* Bordure left */

  --border-form: 1px solid #000; /* Bordure tout autour de l'élément */
  --border-form-top: 1px solid #000; /* Bordure du formulaire top */
  --border-form-right: 1px solid #000; /* Bordure du formulaire right */
  --border-form-bottom: 1px solid #000; /* Bordure du formulaire bottom */
  --border-form-left: 1px solid #000; /* Bordure du formumaire left */
}

/* Bord arrondis -------------------------------------  */

:root {
  --border-radius: 2vw; /* Tous les bords arrondis */
  --border-radius-button: 99px; /* Bords arrondis des boutons */
  --border-radius-circle: 50%; /* Crée un cerle à partir d'un élément carré */
  --border-radius-top-left: 2vw; /* Bord arrondi en haut à gauche */
  --border-radius-top-right: 2vw; /* Bord arrondi en haut à droite */
  --border-radius-bottom-left: 2vw; /* Bord arrondi en bas à gauche */
  --border-radius-bottom-right: 2vw; /* Bord arrondi en bas à droite */
}

/* --------------------------------------------------
MEDIA QUERIES
-------------------------------------------------- */

/* Grandes tablettes -------------------------------------  */

@media screen and (min-width: 1024px) and (max-width:1200px) {
  
  :root {
  --font-size-2xl: clamp(1.35rem, 2rem + 0.35vw, 2.5rem);
  --font-size-5xl: clamp(2rem, 3.05rem + 0.6vw, 3.5rem);
  }
}


/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  DARK MODE
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */


/* SWitch --------------------------------- */

.gtm-dark-mode {
  position: fixed;
  bottom: 10px;
  right: 10px;
}

.dark-mode-toggle {
  position: fixed;
  bottom: 10px;
  right: 10px;
  z-index: 999999999;
}

.switch {
  position: relative;
  display: inline-block;
  width: 34px;
  height: 20px;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var( --color-background-switch-dark);
  transition: background-color 0.4s;
  border-radius: var(--border-radius);
}

.slider:before {
  position: absolute;
  content: "";
  height: 14px;
  width: 14px;
  left: 3px;
  bottom: 3px;
  background-color: var(--color-switch);
  transition: transform 0.4s;
  border-radius: 50%;
}

input:checked+.slider {
  background-color: #007bff;
}

input:checked+.slider:before {
  transform: translateX(14px);
}

body.dark-mode input:checked+.slider {
  background-color: var( --color-background-switch-light);
}

[data-theme="light"] {

/* Gestimark  ----------------- */

  --color-gestimark-primary: #f19e1f;
  --color-gestimark-secondary: #ef5245;

/* Général  ----------------- */

  --color-primary: #f19e1f; 
  --color-secondary: #ef5245;

  --color-beige-fond: #d4c1ae;

/* Fonts  ----------------- */ 

  --color-font: #282729;
  --color-light: white;
  --color-heading: #d4c1ae;
  --color-heading-2: #282729;
  --color-form: #000;

/* Liens  ----------------- */

  --color-link: #F1B322;
  --color-link-light: whitesmoke;
  --color-link-hover: #c3901b;
  --color-link-visited: #F1B322;

/* Boutons  ----------------- */

  --color-button: #282729;
  --color-button-hover: #c3901b;
  --color-texte-button: #ffffff;

/* Background  ----------------- */ 
 
  --color-background-classic: #d4c1ae; 
  --color-background-opacity: rgba(0, 0, 0, .5);
  --color-background-gradient: linear-gradient(0deg, rgba(34, 193, 195, 1) 0%, rgba(253, 187, 45, 1) 100%);
  --color-background-1: #d4c1ae;
  --color-background-2: #b9dfb9;
  --color-background-3: #b9b9d8;

/* Menu  ----------------- */ 

  --color-background-menu: white;
  --color-background-sub-menu: #d4c1ae;
  --color-background-burger: black;
  --color-background-burger-line: whitesmoke;
  --color-menu-contact: #000;
  --color-menu-texte-contact: #fff;
  --color-menu-contact-hover: grey;
  --color-link-menu: black;
  --color-link-menu-hover: #fff;
  --color-link-menu-active: #fff;
  --color-link-sub-menu: #000;
  --color-link-sub-menu-hover: #fff;
  --color-link-sub-menu-active: #fff;

/* FAQ  ----------------- */

  --color-background-question-faq: #d4c1ae;
  --color-background-reponse-faq: whitesmoke;
  --color-texte-question-faq: #000;
  --color-texte-reponse-faq: #202020;

/* Copyright  ----------------- */

  --color-background-copyright: #fff;

  --color-background-dark-mode: #202020;

}



[data-theme="dark"] {

/* Body  ----------------- */

  --color-background-body: #202020;

/* Gestimark  ----------------- */

  --color-gestimark-primary: #bd7913;
  --color-gestimark-secondary: #a93a30;

/* Général  ----------------- */  

  --color-primary: #bd7913; 
  --color-secondary: #a93a30;

  --color-beige-fond: #d4c1ae33;

/* Fonts  ----------------- */ 

  --color-font: whitesmoke;
  --color-heading: #d4c1ae;
  --color-heading-2: #282729;
  --color-form: #000;

/* Liens  ----------------- */

  --color-link: #F1B322;
  --color-link-hover:#F1B322;
  --color-link-visited: #F1B322;
  --color-link-hover: #c3901b;

/* Boutons  ----------------- */

  --color-button: #F1B322;
  --color-button-hover: #c3901b;
  --color-texte-button: #fff;

/* Background  ----------------- */ 
 
  --color-background-classic: darkred; 
  --color-background-opacity: rgba(0, 0, 0, .5);
  --color-background-gradient: linear-gradient(0deg, rgb(15, 95, 96) 0%, rgb(122, 88, 17) 100%);
  --color-background-1: #8e6565;
  --color-background-2: #728c72;
  --color-background-3: #666682;

/* Menu  ----------------- */ 

  --color-background-menu: #202020;
  --color-background-sub-menu: #3d3d3d;
  --color-background-burger: #646464;
  --color-background-burger-line: whitesmoke;
  --color-menu-contact: #000;
  --color-menu-texte-contact: #202020;
  --color-menu-contact-hover: grey;
  --color-link-menu: #000;
  --color-link-menu-hover: grey;
  --color-link-menu-active: grey;
  --color-link-sub-menu: white;
  --color-link-sub-menu-hover: lightgrey;
  --color-link-sub-menu-active: grey;

/* FAQ  ----------------- */

  --color-background-question-faq: #d4c1ae;
  --color-background-reponse-faq: whitesmoke;
  --color-texte-question-faq: whitesmoke;
  --color-texte-reponse-faq: #fff;

/* Copyright  ----------------- */

  --color-background-copyright: #3d3d3d;

  --color-background-dark-mode: #d4c1ae33;

}

[data-theme="dark"] .gtm-logo-light {
   display: none;
}

[data-theme="dark"] .gtm-logo-dark {
  display: block;
}

[data-theme="dark"] .gtm-menu-centre .menu-item.default {
  display: none;
}

[data-theme="dark"] .gtm-menu-centre li.item-210 {
  display: flex;
}

[data-theme="dark"] .gtm-copyright-standard {
  filter: grayscale(1) brightness(2.5);
}








/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  MATRICE
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* GRILLE VERSION STRICTE -------------------------------------  */

.gtm-box-top-2-3, .gtm-box-top-4-5-6, .gtm-box-top-7-8-9-10, .gtm-box-bottom-2-3, .gtm-box-bottom-4-5-6, .gtm-box-bottom-7-8-9-10, .gtm-box-article {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
}

.moduletable, .com-content-article, form, .sitemap, .com-users-login {
  grid-column: span 12;
}

.com-content-category-blog {
  grid-column: span 12;
}

.gtm-1{grid-column:span 1;}.gtm-2{grid-column:span 2;}.gtm-3{grid-column:span 3;}.gtm-4{grid-column:span 4;}.gtm-5{grid-column:span 5;}.gtm-6{grid-column:span 6;}.gtm-7{grid-column:span 7;}.gtm-8{grid-column:span 8;}.gtm-9{grid-column:span 9;}.gtm-10{grid-column:span 10;}.gtm-11{grid-column:span 11;}.gtm-12{grid-column:span 12;}@media screen and (min-width:768px){.gtm-tablette-1{grid-column:span 1;}.gtm-tablette-2{grid-column:span 2;}.gtm-tablette-3{grid-column:span 3;}.gtm-tablette-4{grid-column:span 4;}.gtm-tablette-5{grid-column:span 5;}.moduletable.gtm-tablette-6{grid-column:span 6;}.gtm-tablette-7{grid-column:span 7;}.gtm-tablette-8{grid-column:span 8;}.gtm-tablette-9{grid-column:span 9;}.gtm-tablette-10{grid-column:span 10;}.gtm-tablette-11{grid-column:span 11;}.gtm-tablette-12{grid-column:span 12;}}@media screen and (min-width:1024px){.gtm-tablette-plus-1{grid-column:span 1;}.gtm-tablette-plus-2{grid-column:span 2;}.gtm-tablette-plus-3{grid-column:span 3;}.gtm-tablette-plus-4{grid-column:span 4;}.gtm-tablette-plus-5{grid-column:span 5;}.gtm-tablette-plus-6{grid-column:span 6;}.gtm-tablette-plus-7{grid-column:span 7;}.gtm-tablette-plus-8{grid-column:span 8;}.gtm-tablette-plus-9{grid-column:span 9;}.gtm-tablette-plus-10{grid-column:span 10;}.gtm-tablette-plus-11{grid-column:span 11;}.gtm-tablette-plus-12{grid-column:span 12;}}@media screen and (min-width:1200px){.gtm-ordinateur-1{grid-column:span 1;}.gtm-ordinateur-2{grid-column:span 2;}.gtm-ordinateur-3{grid-column:span 3;}.gtm-ordinateur-4{grid-column:span 4;}.gtm-ordinateur-5{grid-column:span 5;}.gtm-ordinateur-6{grid-column:span 6;}.gtm-ordinateur-7{grid-column:span 7;}.gtm-ordinateur-8{grid-column:span 8;}.gtm-ordinateur-9{grid-column:span 9;}.gtm-ordinateur-10{grid-column:span 10;}.gtm-ordinateur-11{grid-column:span 11;}.gtm-ordinateur-12{grid-column:span 12;}}

/* GRILLE VERSION FLEXIBLE -------------------------------------  */

.gtm-top1-free, .gtm-top2-free, .gtm-top3-free, .gtm-bottom1-free, .gtm-bottom2-free, .gtm-bottom3-free {display: grid;grid-template-columns: repeat(12, 1fr);}.moduletable.gtm-free-1 {grid-column: span 1; }.moduletable.gtm-free-2 {grid-column: span 2; }.moduletable.gtm-free-3 {grid-column: span 3; }.moduletable.gtm-free-4 {grid-column: span 4; }.moduletable.gtm-free-5 {grid-column: span 5; }.moduletable.gtm-free-6 {grid-column: span 6; }.moduletable.gtm-free-7 {grid-column: span 7; }.moduletable.gtm-free-8 {grid-column: span 8; }.moduletable.gtm-free-9 {grid-column: span 9; }.moduletable.gtm-free-10 {grid-column: span 10; }.moduletable.gtm-free-11 {grid-column: span 11; }.moduletable.gtm-free-12 {grid-column: span 12; }@media (min-width : 768px) {.moduletable.gtm-tablette-free-1 {grid-column: span 1; }.moduletable.gtm-tablette-free-2 {grid-column: span 2; }.moduletable.gtm-tablette-free-3 {grid-column: span 3; }.moduletable.gtm-tablette-free-4 {grid-column: span 4; }.moduletable.gtm-tablette-free-5 {grid-column: span 5; }.moduletable.gtm-tablette-free-6 {grid-column: span 6; }.moduletable.gtm-tablette-free-7 {grid-column: span 7; }.moduletable.gtm-tablette-free-8 {grid-column: span 8; }.moduletable.gtm-tablette-free-9 {grid-column: span 9; }.moduletable.gtm-tablette-free-10 {grid-column: span 10; }.moduletable.gtm-tablette-free-11 {grid-column: span 11; }.moduletable.gtm-tablette-free-12 {grid-column: span 12; }}@media (min-width : 1024px) {.moduletable.gtm-tablette-plus-free-1 {grid-column: span 1; }.moduletable.gtm-tablette-plus-free-2 {grid-column: span 2; }.moduletable.gtm-tablette-plus-free-3 {grid-column: span 3; }.moduletable.gtm-tablette-plus-free-4 {grid-column: span 4; }.moduletable.gtm-tablette-plus-free-5 {grid-column: span 5; }.moduletable.gtm-tablette-plus-free-6 {grid-column: span 6; }.moduletable.gtm-tablette-plus-free-7 {grid-column: span 7; }.moduletable.gtm-tablette-plus-free-8 {grid-column: span 8; }.moduletable.gtm-tablette-plus-free-9 {grid-column: span 9; }.moduletable.gtm-tablette-plus-free-10 {grid-column: span 10; }.moduletable.gtm-tablette-plus-free-11 {grid-column: span 11; }.moduletable.gtm-tablette-plus-free-12 {grid-column: span 12; }}@media (min-width : 1200px) {.moduletable.gtm-desktop-free-1 {grid-column: span 1; }.moduletable.gtm-desktop-free-2 {grid-column: span 2; }.moduletable.gtm-desktop-free-3 {grid-column: span 3; }.moduletable.gtm-desktop-free-4 {grid-column: span 4; }.moduletable.gtm-desktop-free-5 {grid-column: span 5; }.moduletable.gtm-desktop-free-6 {grid-column: span 6; }.moduletable.gtm-desktop-free-7 {grid-column: span 7; }.moduletable.gtm-desktop-free-8 {grid-column: span 8; }.moduletable.gtm-desktop-free-9 {grid-column: span 9; }.moduletable.gtm-desktop-free-10 {grid-column: span 10; }.moduletable.gtm-desktop-free-11 {grid-column: span 11; }.moduletable.gtm-desktop-free-12 {grid-column: span 12; }}

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  OPTIONS DE STRUCTURE
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* --------------------------------------------------
Marges et Padding 
-------------------------------------------------- */

/* Padding ------------------------------------- */

.gtm-no-padding {
  padding: 0;
}

.gtm-no-padding-top {
  padding-top: 0;
}

.gtm-no-padding-right {
  padding-right: 0;
}

.gtm-no-padding-bottom {
  padding-bottom: 0;
}

.gtm-no-padding-left {
  padding-left: 0;
}


/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  GENERAL
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* --------------------------------------------------
Images 
-------------------------------------------------- */

img {
  max-width: 100%;
  height: auto;
  border-radius: var(--border-radius);
}

.gtm-lien-logo img {
  border-radius: 0;
}

p img.float-start {
    display: inline;
    float: left;
    margin-right: 15px;
}

/* --------------------------------------------------
Titres, texte, liens, listes...
-------------------------------------------------- */

/* Titres ------------------------------------- */

h1 {
  font-size: var(--font-size-5xl);
  margin: 0 0 var(--space-md) 0;
  font-family: var(--neonderthaw);
  color: var(--color-beige-fonce);
  line-height: .9;
  font-weight: 400;

  /* Gestion des mots longs */
  hyphens: none; 
  word-break: normal; 
  overflow-wrap: normal;
}

h2 {
  font-size: var(--font-size-4xl);
  font-family: var(--glegoo);
  color: var(--color-heading);
  margin-bottom: var(--space-md);
  line-height: 1.2;
  
  /* Gestion des mots longs */
  hyphens: none; 
  word-break: normal; 
  overflow-wrap: normal;
}

h3 {
  font-size: var(--font-size-3xl);
  font-family: var(--glegoo);
  color: var(--color-heading-secondary);
  margin-bottom: var(--space-sm);
  line-height: 1.2;

  /* Gestion des mots longs */
  hyphens: none; 
  word-break: normal; 
  overflow-wrap: normal;
}

h4 {
  font-size: var(--font-size-4xl);
  font-family: var(--sacramento);
  color: var(--color-heading-secondary);
  margin-bottom: var(--space-sm);
  font-weight: 400;
  line-height: 1;

  /* Gestion des mots longs */
  hyphens: none; 
  word-break: normal; 
  overflow-wrap: normal;
}

h5 {
  font-size: var(--font-size-lg);
  font-family: var(--glegoo);
  color: var(--color-heading-secondary);
  margin-bottom: var(--space-sm);

  /* Gestion des mots longs */
  hyphens: none; 
  word-break: normal; 
  overflow-wrap: normal;
}

h6 {
  font-size: var(--font-size-md);
  /* font-family: var(--sacramento); */
  color: var(--color-heading-secondary);
  margin-bottom: var(--space-xs);

  /* Gestion des mots longs */
  hyphens: none; 
  word-break: normal; 
  overflow-wrap: normal;
}

/* Textes ------------------------------------- */

p {
  margin-bottom: var(--space-sm);

  /* Gestion des mots longs */
  hyphens: none; 
  word-break: normal; 
  overflow-wrap: normal;
}

blockquote {
  font-size: var(--font-size-lg);
  font-family: var(--font-secondary);
  margin-bottom: var(--space-sm);
}

figcaption {
  font-size: 12px;
}


/* Liens ------------------------------------- */

a {
  position: relative;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
  color: var(--color-link);
  transition: color .5s ease-in-out;
  margin-bottom: var(--space-xs);
}

a:visited {
  color: var(--color-link-visited);
}

a:hover {
  color: var(--color-link-hover);
}


a.gtm-lien-secondary {
  color: var(--color-link-light);
}

a.gtm-lien-secondary:hover {
  color: var(--color-link-light-hover);
}

a.gtm-lien-secondary:visited {
  color: var(--color-link-light-visited);
}

/* Boutons ------------------------------------- */

/* Version 01 */

a.gtm-btn-v1 {
  border-radius: var(--border-radius-button);
  margin-top: var(--space-md);
  margin-bottom: var(--space-xs);
  box-sizing: border-box;
  color: var(--color-texte-button);
  background-color: var(--color-link);
  padding: var(--space-xs) var(--space-md);
  touch-action: manipulation;
  display: inline-block;
  text-align: center;
  cursor: pointer;
  transition: background .2s ease-in-out,
              color .2s ease-in-out;
}

a.gtm-btn-v1:hover {
  color: var(--color-light);
  background-color: var(--color-button-hover);
}


/* Boutons lire la suite */

.readmore a.btn {
  border-radius: var(--border-radius-button);
  margin-top: var(--space-xs);
  margin-bottom: var(--space-xs);
  box-sizing: border-box;
  color: var(--color-texte-button);
  background-color: var(--color-button);
  padding: var(--space-xs) var(--space-sm);
  touch-action: manipulation;
  display: inline-block;
  text-align: center;
  cursor: pointer;
  transition: background .2s ease-in-out,
              color .2s ease-in-out;
}

.readmore a.btn:hover {
  color: var(--color-light);
  background-color: var(--color-button-hover);
}

/* Boutons de joomla */

.btn.btn-primary, .btn.btn-secondary {
  border: none;
  border-radius: var(--border-radius-button);
  margin-top: var(--space-xs);
  margin-bottom: var(--space-xs);
  box-sizing: border-box;
  color: var(--color-texte-button);
  background-color: var(--color-button);
  padding: var(--space-xs) var(--space-sm);
  touch-action: manipulation;
  display: inline-block;
  text-align: center;
  font-size: 22px;
  cursor: pointer;
  transition: background .2s ease-in-out,
              color .2s ease-in-out;
}

.btn.btn-primary:hover, .btn.btn-secondary:hover {
  color: var(--color-light);
  background-color: var(--color-button-hover);
}

/* Listes ------------------------------------- */

ul,
ol {
  margin-left: var(--space-lg);
  margin-bottom: var(--space-sm);
  font-size: var(--font-size-base);
}

ul li,
ol li {
  margin-bottom: var(--space-xs);
}

ol li a {
  display: unset;
}


/* Liste compte */

ul.mod-login__options {
  list-style-type: none;
  margin-left: 0;
}

ul.mod-login__options li a {
  font-size: var(--font-size-base);
}

/* --------------------------------------------------
OPTIONS DESIGN
-------------------------------------------------- */

/* Background --------------------------------------------- */

.gtm-bg-classic, .gtm-bg-opacity, .gtm-bg-gradient, .gtm-bg-1, .gtm-bg-2, .gtm-bg-3 {
  margin-left: calc(-1 * var(--space-lg));
  margin-right: calc(-1 * var(--space-lg));
  width: calc(100% + 2 * var(--space-lg));
  padding: var(--space-lg);
}

.gtm-bg-classic {
  background-color: var(--color-background-classic);
}

.gtm-bg-opacity {
  background-color: var(--color-background-opacity);
}

.gtm-bg-gradient {
  background-color: var(--color-background-gradient);
}

/* .gtm-bg-1 {
  background-color: var(--color-background-1);
  border-radius: 100% 0% 100% 0% / 0% 85% 35% 30%;
} */

.gtm-bg-1 {
  position: relative;
  overflow: hidden;
}

.gtm-bg-1::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--color-beige-fond);
  -webkit-mask-image: radial-gradient(120% 100% at 50% 0%, transparent 70%, black 70%);
          mask-image: radial-gradient(120% 100% at 50% 0%, transparent 70%, black 70%);
}

.gtm-bg-1 > * {
  position: relative; 
}

.gtm-bg-1 .gtm-btn-v1 {
  background-color: var(--color-link);
}

.gtm-bg-2 {
  background-color: var(--color-background-dark-mode);
}

.gtm-bg-2 * {
  color: #fff;
}

.gtm-bg-3 {
  background-color: var(--color-background-3);
}

/* Animations --------------------------------------------- */

/* Fade In */
.gtm-anim-1 {
  opacity: 0;
  transition: opacity 0.6s ease-out;
}
.gtm-anim-1.visible {
  opacity: 1;
}

/* Fade In Up */
.gtm-anim-2 {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}
.gtm-anim-2.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Zoom In */
.gtm-anim-3 {
  opacity: 0;
  transform: scale(0.8);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}
.gtm-anim-3.visible {
  opacity: 1;
  transform: scale(1);
}

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  FORMULAIRES
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* Gestimark 2026-09-28 : espace gauche/droite = var(--space-lg) du .gtm-wrapper SEULEMENT, aucun padding/margin horizontal ajouté hors blocs à fond (.gtm-bg-*, qui ont leur propre padding). */
.gtm-formulaire {
  padding: var(--space-lg) 0;
}

.gtm-formulaire h2 {
  font-size: var(--font-size-3xl);
}

.gtm-formulaire.gtm-form-contact h2 {
  font-size: var(--font-size-xl);
}

.formResponsive {
  margin: 0;
}

@media screen and (max-width: 767px) { 
  .formResponsive .formRow {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    column-gap: 20px;
  }

  .rsform .formSpan6 {
    width: 100% !important;
  }
}

.formResponsive .formRow {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    column-gap: 20px;
  }

.formResponsive .formRow::before, .formResponsive .formRow::after {
  display: none;
}

.formResponsive .formRow [class*=formSpan] {
  float: none;
  margin-left: 0;
}

.formSpan6 {
  width: calc(50% - 10px) !important;
}

.formResponsive input, .formResponsive textarea {
  width: 100%;
}

@media screen and (max-width: 992px) { 
  fieldset.rsfp-fieldset {
    display: flex;
    flex-direction: column;
  }
}
.formResponsive input[type=email], .formResponsive input[type=number], .formResponsive input[type=password], .formResponsive input[type=tel], .formResponsive input[type=text], .formResponsive input[type=url], .formResponsive select, .formResponsive textarea {
  font-family: var(--font-primary);
  font-size: var(--font-size-xs);
  color: var(--color-form);
  box-sizing: border-box;
}

.formResponsive input[type=email], .formResponsive input[type=number], .formResponsive input[type=password], .formResponsive input[type=tel], .formResponsive input[type=text], .formResponsive input[type=url], .formResponsive textarea {
  background-color: #fff;
  border: var(--border-form);
  box-shadow: none;
  transition: none;
  border: 2px solid var(--color-background-question-faq);
  border-radius: 20px;
  padding: 10px 10px;
}

.formResponsive input[type=email], .formResponsive input[type=number], .formResponsive input[type=password], .formResponsive input[type=tel], .formResponsive input[type=text], .formResponsive input[type=url] {
  height: 35px;
  border: 2px solid var(--color-background-question-faq);
  border-radius: 20px;
  padding: 10px 10px;
}

.formControlLabel {
  font-size: 22px;
  display: inline-block;
  margin-bottom: 5px;
  margin-top: 20px;
}

.formResponsive .formControls label {
  margin: 3px 15px 3px 0;
}

.formResponsive button[type=reset], .formResponsive button[type=submit], .formResponsive input[type=reset], .formResponsive input[type=submit] {

  /* Reset du bouton d'origine */

  background-image: none;
  background-repeat: unset;
  border: none;
  border-color: transparent;
  text-shadow: none;
  box-shadow: none;
  border-radius: var(--border-radius-button);
  margin-top: var(--space-xs);
  margin-bottom: var(--space-xs);
  box-sizing: border-box;
  color: var(--color-texte-button);
  font-size: 22px;
  background-color: var(--color-button);
  padding: var(--space-sm) var(--space-sm);
  touch-action: manipulation;
  display: inline-block;
  text-align: center;
  cursor: pointer;
  transition: background .2s ease-in-out,
              color .2s ease-in-out !important;
}

.formResponsive button[type=reset]:hover, .formResponsive button[type=submit]:hover, .formResponsive input[type=reset]:hover, .formResponsive input[type=submit]:hover {
  color: var(--color-light);
  background-color: var(--color-button-hover);

  /* Reset du bouton d'origine */

  text-shadow: none;
}

p.formDescription {
  margin: 0;
}

@media screen and (min-width: 768px) {
  .gtm-formulaire.gtm-form-contact {
    margin-top: 0;
  }
}

/* Gestimark 2026-09-28 : espace gauche/droite = var(--space-lg) du .gtm-wrapper SEULEMENT, aucun padding/margin horizontal ajouté hors blocs à fond (.gtm-bg-*, qui ont leur propre padding). */
/* @media screen and (min-width:768px) {
  .gtm-formulaire {
    max-width: 90%;
    margin: auto;
  }
} */

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  COMPTE
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */


.com-users-login {
  text-align: center;
  max-width: 400px;
  margin: auto;
  padding-top: var(--space-3xl);
}

.com-users-login input {
  height: 25px;
  border-radius: 0px;
  border: 1px solid;
  margin-top: 8px;
}

.com-users-login .control-group {
  margin-bottom: var(--space-sm);
}

.com-users-login .password-group .input-group {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.com-users-login .btn-secondary.input-password-toggle {
  font-size: 16px;
}


/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  COPYRIGHT
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

.gtm-container-copyright {
  padding-top: var(--space-md);
  padding-bottom: 0;
  padding-left: var(--space-md);
  padding-right: var(--space-md);
}

.gtm-copyright-dark {
  display: none;
}

.gtm-copyright {
  text-align: center;
  padding-left: var(--space-sm);
  padding-right: var(--space-sm);
  color: var(--color-text);
  font-size: 16px;
  margin-bottom: var(--space-xs);
}

.gtm-flinks {
  text-align: center;
  margin-bottom: var(--space-xs);
}

.gtm-flinks a {
  margin-top: var(--space-xs);
  color: var(--color-link);
  font-size: 16px;
}

.gtm-flinks a:hover {
  color: var(--color-link-hover);
}

.gtm-copyright-separator {
  font-size: 16px;
}

.gtm-copyright .moduletable.gtm-copyright-content {
  padding: var(--space-0);
}

.gtm-copy-anim-logo {
  margin: auto;
  max-width: 400px;
}

.gtm-copy-anim-logo .gtm-lien-gestimark {
  display: flex;
  justify-content: center;
  align-items: center;
}

a.gtm-lien-gestimark span {
  color: var(--color-text);
  letter-spacing: 1px;
  font-size: var(--font-size-xs);
  padding-right: var(--space-xs);
}

.gtm-copy-anim-logo .gtm-lien-gestimark img.gtm-g-gestimark {
  width: 35px;
  transform-origin: center;
  transition: all .2s ease-in-out;
}

.gtm-copy-anim-logo .gtm-lien-gestimark img.gtm-creation-de {
  width: 100px;
  padding-right: var(--space-xs);
}

.gtm-copy-anim-logo:hover .gtm-lien-gestimark img.gtm-g-gestimark {
  transform: rotate(-30deg);
}

.gtm-copyright-bg {
  padding: var(--space-md) var(--space-xs);
  background-color: var(--color-background-copyright);
}

.gtm-copyright-bg .gtm-flinks a {
  color: var(--color-link-light);
}

.gtm-copyright-bg .gtm-flinks a:hover {
  color: var(--color-link-light-hover);
}

.gtm-copyright-bg .gtm-copyright-separator {
  color: var(--color-light);
}

.gtm-copyright-bg .gtm-copyright {
  color: var(--color-light);
}

.gtm-copyright-dark {
  display: none;
}

.gtm-copyright-bg .gtm-copyright-standard {
  display: none;
}

.gtm-copyright-bg .gtm-copyright-dark {
  display: block;
}


/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  COOKIE
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */


/* image de cookie */

.cc-revoke.cc-bottom {
  position: relative;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%) !important;
  width: 100%;
  height: 50px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1268.1 1268.1'><g><circle fill='%23fff' cx='634' cy='634' r='626.2'/><path fill='%23000000' d='M448.7 783.8c-29.3 0-53.2 23.9-53.2 53.2s24 53.2 53.2 53.2 53.2-23.9 53.2-53.2-23.9-53.2-53.2-53.2zM1072.5 758.6c-29.3 0-53.2 23.9-53.2 53.2s24 53.2 53.2 53.2c3.4 0 6.9-.3 10.5-1.1 13.4-26.2 24.7-53.6 33.4-82.2-9-13.9-15.2-23.1-43.8-23.1zM516 418.1c-29.3 0-53.2 23.9-53.2 53.2s24 53.2 53.2 53.2 53.2-23.9 53.2-53.2-23.9-53.2-53.2-53.2zM223.3 412.3c29.5 0 53.2-31.9 53.2-53.2s-12.1-38.9-29.7-47.6c-9.2 11-18 22.4-26.3 34.2-9.5 13.6-18.3 27.6-26.5 42.1-1.9 3.4-3.7 6.8-5.5 10.2-.1.3-.3.5-.4.8 8.5 8.5 6.6 13.6 35.2 13.6zM1115.3 603.7c-36-1.9-67.7-23.2-82.9-56-2.9-6.5-8.7-11.4-15.7-13.3-7-2-14.3-.5-20.4 3.6-16.2 11.4-36 17.6-55.8 17.6s-33.6-4.6-48.1-13.1c-32.7-18.9-51.3-55.2-47.9-92.6.7-7.3-2-14.3-7-19.3s-12-7.8-19.3-7c-2.9.3-5.8.5-8.7.5-34.6 0-66.8-18.6-84-48.4-18.9-32.7-16.9-73.5 4.9-104.2 4.1-5.8 5.6-13.3 3.6-20.4-2-7-6.8-12.6-13.3-15.7-32.7-15.2-54.2-46.9-56.1-82.9-.8-12.9-11.3-22.9-24.1-23.1h-6.5c-137.7.2-262.7 55.8-353.8 145.6 26.8 18.4 44.4 49.1 44.4 84 0 56.1-45.3 101.5-101 101.5s-40.5-6.3-56.5-17.1c-24.1 58.8-37.4 123.2-37.4 190.6 0 278.1 226.2 504.3 504.3 504.3s330.4-90.1 420.8-226.6c-47.6-8.2-84-44.2-84-99.9s45.5-101.6 101.6-101.6 40.9 6.5 57.2 17.5c5.7-30.4 8.7-61.7 8.7-93.7v-6.5c-.3-12.8-10.2-23.3-23-23.9zM448.7 938.6c-56.1 0-101.6-45.5-101.6-101.6s45.5-101.6 101.6-101.6 101.6 45.5 101.6 101.6-45.5 101.6-101.6 101.6zM516 572.9c-56.1 0-101.6-45.5-101.6-101.6s45.5-101.6 101.6-101.6 101.6 45.5 101.6 101.6-45.5 101.6-101.6 101.6zM725.9 890.2c-72 0-130.6-58.6-130.6-130.6s58.5-130.6 130.6-130.6 130.6 58.6 130.6 130.6-58.6 130.6-130.6 130.6zM725.9 677.2c-45.3 0-82.3 37-82.3 82.3s37.1 82.3 82.3 82.3 82.3-37 82.3-82.3-37-82.3-82.3-82.3z'/></g></svg>");
  background-repeat: no-repeat;
  background-size: 30px;
  background-position: center;
  background-color: var(--color-background-body) !important;
  order: 999999;
    -webkit-animation: cookie 0.4ss .8s both;
  animation: cookie 0.4s .8s both;
  transition: background-image 0.3s ease;
  border-radius: 0;
}

.cc-revoke.cc-bottom:hover {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1268.1 1268.1'><g><circle fill='%23fff' cx='634' cy='634' r='626.2'/><path fill='%23404040' d='M448.7 783.8c-29.3 0-53.2 23.9-53.2 53.2s24 53.2 53.2 53.2 53.2-23.9 53.2-53.2-23.9-53.2-53.2-53.2zM1072.5 758.6c-29.3 0-53.2 23.9-53.2 53.2s24 53.2 53.2 53.2c3.4 0 6.9-.3 10.5-1.1 13.4-26.2 24.7-53.6 33.4-82.2-9-13.9-15.2-23.1-43.8-23.1zM516 418.1c-29.3 0-53.2 23.9-53.2 53.2s24 53.2 53.2 53.2 53.2-23.9 53.2-53.2-23.9-53.2-53.2-53.2zM223.3 412.3c29.5 0 53.2-31.9 53.2-53.2s-12.1-38.9-29.7-47.6c-9.2 11-18 22.4-26.3 34.2-9.5 13.6-18.3 27.6-26.5 42.1-1.9 3.4-3.7 6.8-5.5 10.2-.1.3-.3.5-.4.8 8.5 8.5 6.6 13.6 35.2 13.6zM1115.3 603.7c-36-1.9-67.7-23.2-82.9-56-2.9-6.5-8.7-11.4-15.7-13.3-7-2-14.3-.5-20.4 3.6-16.2 11.4-36 17.6-55.8 17.6s-33.6-4.6-48.1-13.1c-32.7-18.9-51.3-55.2-47.9-92.6.7-7.3-2-14.3-7-19.3s-12-7.8-19.3-7c-2.9.3-5.8.5-8.7.5-34.6 0-66.8-18.6-84-48.4-18.9-32.7-16.9-73.5 4.9-104.2 4.1-5.8 5.6-13.3 3.6-20.4-2-7-6.8-12.6-13.3-15.7-32.7-15.2-54.2-46.9-56.1-82.9-.8-12.9-11.3-22.9-24.1-23.1h-6.5c-137.7.2-262.7 55.8-353.8 145.6 26.8 18.4 44.4 49.1 44.4 84 0 56.1-45.3 101.5-101 101.5s-40.5-6.3-56.5-17.1c-24.1 58.8-37.4 123.2-37.4 190.6 0 278.1 226.2 504.3 504.3 504.3s330.4-90.1 420.8-226.6c-47.6-8.2-84-44.2-84-99.9s45.5-101.6 101.6-101.6 40.9 6.5 57.2 17.5c5.7-30.4 8.7-61.7 8.7-93.7v-6.5c-.3-12.8-10.2-23.3-23-23.9zM448.7 938.6c-56.1 0-101.6-45.5-101.6-101.6s45.5-101.6 101.6-101.6 101.6 45.5 101.6 101.6-45.5 101.6-101.6 101.6zM516 572.9c-56.1 0-101.6-45.5-101.6-101.6s45.5-101.6 101.6-101.6 101.6 45.5 101.6 101.6-45.5 101.6-101.6 101.6zM725.9 890.2c-72 0-130.6-58.6-130.6-130.6s58.5-130.6 130.6-130.6 130.6 58.6 130.6 130.6-58.6 130.6-130.6 130.6zM725.9 677.2c-45.3 0-82.3 37-82.3 82.3s37.1 82.3 82.3 82.3 82.3-37 82.3-82.3-37-82.3-82.3-82.3z'/></g></svg>");
}

@keyframes cookie {
  0% {  
    visibility: hidden;
    transform: translate(0%, 100%); 
  }
  100% {
    visibility: visible;
    transform: translate(0%, 0%); 
  }
}

/* grille du pop up */
.cc-message-text {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: repeat(3, auto);
  grid-column-gap: 0px;
  grid-row-gap: 0px;
}
  
.cc-message-text .p1 { 
  grid-area: 1 / 1 / 2 / 2; 
}

.cc-message-text .cc-checkboxes-container {
  grid-area: 2 / 1 / 3 / 2;
  margin-top: var(--space-xs);
  margin-bottom: var(--space-xs);
}

.cc-message-text .cc-compliance {
  grid-area: 3 / 1 / 4 / 2;
}

div.cc-window.cc-floating {
  padding: 2em 1.8em 3.5em 1.8em;
  min-width: 100%;
}

@media screen and (min-width: 640px) { 
  div.cc-window.cc-floating {
    transform: translateY(17px);
  }
}

@media screen and (min-width: 768px) { 
  div.cc-window.cc-floating {
    padding: 2em 1.8em 3em 1.8em;
  }
}

/* bouton fermeture popup */
.cc-close {
  top: 0.8em;
  right: 0.6em;
  font-size: var(--font-size-xs);  
}

/* boutons */
span.cc-cookie-settings-toggle, div.cc-window a.cc-btn {
  border-radius: var(--border-radius-button) !important;
  text-decoration: none !important;
  font-size: inherit;
}

span.cc-cookie-settings-toggle, .cc-btn.cc-allowall, .cc-btn.cc-deny, a.cc-btn.cc-allow {
  font-weight: 500;
  padding: var(--space-xs) !important;
  line-height: 1.2;
  height: inherit !important;
  font-size: inherit;
}

span.cc-cookie-settings-toggle:hover, .cc-btn.cc-allowall:hover, .cc-btn.cc-deny:hover, a.cc-btn.cc-allow:hover {
  background-color: var(--color-background-button-hover) !important;
  color: var(--color-text-light) !important;
}

/* lien politique de confidentialité et catégories de cookies */
a.cc-link.cc-privacy {
  margin-top: var(--space-xs);
  margin-bottom: var(--space-sm);
}

a.cc-link.cc-privacy:hover {
  color: var(--color-link-hover);
}

a.cc-link.cc-cookie-checkbox:hover label {
  color: var(--color-text-light);
}

/* alignement */
div.cc-checkboxes-container {
  align-items: center;
}

input.cc-cookie-checkbox+span:after, input.cc-cookie-checkbox+span:before {
  display: none;
}

input.cc-cookie-checkbox {
  appearance: auto !important;
  opacity: 1;
}

.cc-cookie-settings-toggler {
  display: none !important;
}

input.cc-cookie-checkbox:checked+span:after, input.cc-cookie-checkbox:checked+span:before {
  display: none !important;
}

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  SITEMAP
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* Gestimark 2026-09-28 : espace gauche/droite = var(--space-lg) du .gtm-wrapper SEULEMENT, aucun padding/margin horizontal ajouté hors blocs à fond (.gtm-bg-*, qui ont leur propre padding). */
.sitemap {
  padding-top: var(--space-4xl);
  padding-bottom: var(--space-lg);
}

.sitemap .folder {
  display: inline-block;
  padding-bottom: var(--space-sm);
}

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  ACCESSIBILITE
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

.ba__accessibility [class*="-button"] :last-child, .ba__accessibility [class$="-slider"] label, .ba__accessibility [class*="-color"] label {
    text-transform: inherit;
}

.ba__accessibility {
  z-index: 0;
  bottom: 15px;
  top: unset;
}

.ba__accessibility.ba__accessibility-open {
  top: 30px;
  z-index: 9999999;
}

.ba__accessibility > .ba__accessibility-action-button {
  background: var(--color-link);
  box-shadow: 0 0 2em rgba(0, 0, 0, 0);
}

.ba__accessibility-container {
  background: #fff;
}

.ba__accessibility-body > * {
  background: #fff;
  box-shadow: none;
  border: 1px solid #000;
  border-radius: 1vw;
}

.ba__accessibility-range-input::-webkit-slider-thumb {
  background-color: var(--color-beige) !important;   /* Chrome, Edge, Safari */
}
.ba__accessibility-range-input::-moz-range-thumb {
  background-color: var(--color-beige) !important;   /* Firefox */
}

.ba__accessibility [class*="-button"]:hover {
  box-shadow: 0 0 2px rgba(0, 0, 0, .3);
}

.ba__accessibility > .ba__accessibility-action-button {
  width: 2.5em;
  height: 2.5em;
}

.ba__accessibility:not(.ba__accessibility-open) > [class*="-button"]::after {
  animation: none !important;
  -webkit-animation: none !important;
}

.ba__accessibility {
  height: 3em; /* hauteur du SVG */
  /* overflow: hidden; */
  transition: height 0.4s ease;
  z-index: 99999999;
}

.ba__accessibility.ba__accessibility-open {
  height: calc(100% - 60px); /* hauteur totale de la section quand ouverte */
}

/* #endregion */

/* #region STYLE ----------------------------------------------------------------------------------------------------- */

/* ---------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------------
  STYLE
------------------------------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------------------------- */

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  LOGO HEADER
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

.gtm-logo-dark {
  display: none;
}

.gtm-logo-header {
  position: fixed;
  z-index: 11;
  top: 0px;
  left: 0px;
  padding: var(--space-sm);
  background-color: var(--color-background-menu);
  transition: top .2s ease-in-out;
  border-radius: 0 0 var(--border-radius-bottom-right) 0;
}

.gtm-logo-header .mod-custom .mod-custom {
  line-height: 0;
}

.gtm-lien-logo {
  line-height: 0;
}

.gtm-logo-header a {
  margin-bottom: 0;
  display: block;
}

.gtm-logo-header img {
  max-width: 120px;
}


.gtm-logo-header .gtm-footer-1-slogan {
  display: none;
}

@media screen and (min-width: 1200px) {
  .gtm-logo-header {
    top: 14px;
    left: 20px;
    padding: 0px;
    background-color: unset;
  }

  /* body.gtm-scrolled .gtm-logo-header {
    top: 10px;
  } */
}

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  HEROS
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* --------------------------------------------------
Hero 01 
-------------------------------------------------- */

.gtm-hero-1 {
  padding: 50px 0 0 0;
}

.gtm-hero-1 .mod-custom .gtm-hero-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.gtm-hero-1 .gtm-hero-texte-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: var(--space-xl);
  margin-top: 0;
}

.gtm-hero-1 .gtm-hero-texte-content .gtm-slogan {
  display: block;
  font-size: var(--font-size-slogan);
  margin-bottom: var(--space-md);
}

.gtm-hero-1 .gtm-hero-images {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  grid-template-rows: auto;
  grid-column-gap: var(--space-sm);
  grid-row-gap: var(--space-lg);
  padding: 0 var(--space-xl) var(--space-xl)var(--space-xl);
}

.gtm-hero-img-2, .gtm-hero-img-3 {
  display: none;
}

/* TABLETTE -------------------------------------  */

@media screen and (min-width: 768px) { 
  .gtm-hero-1 .gtm-hero-images {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: auto;
    grid-column-gap: var(--space-sm);
    grid-row-gap: var(--space-lg);
    padding: 0 var(--space-xl) var(--space-xl)var(--space-xl);
  }

  .gtm-hero-img-2, .gtm-hero-img-3 {
    display: block;
  }
}

@media screen and (min-width: 1024px) {

  .gtm-hero-1 .mod-custom .gtm-hero-container {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    min-height: 100dvh;
  }

  .gtm-hero-1 .gtm-hero-texte-content {
    width: 60%;
  }

  .gtm-hero-1 .gtm-hero-images {
    width: 40%;
    padding-right: var(--space-sm);
    margin-top: var(--space-2xl);
  }

  .gtm-hero-1 .gtm-hero-images {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-template-rows: repeat(8, 1fr);
    grid-column-gap: var(--space-lg);
    grid-row-gap: var(--space-lg);
  }

  .gtm-hero-1 .gtm-hero-img-1 { grid-area: 1 / 1 / 5 / 5; }
  .gtm-hero-1 .gtm-hero-img-2 { grid-area: 5 / 1 / 9 / 5; }
  .gtm-hero-1 .gtm-hero-img-3 { grid-area: 3 / 5 / 7 / 9; }

}



/* Texte : fade in up (rapide) */
.gtm-hero-1 h1,
.gtm-hero-1 .gtm-slogan,
.gtm-hero-1 .gtm-field-button {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUp 0.4s forwards; /* encore plus rapide */
}

/* Ordre et délais */
.gtm-hero-1 h1 {
  animation-delay: 0.1s;
  font-weight: 400;
}
.gtm-hero-1 .gtm-slogan {
  animation-delay: 0.3s; /* après h1 */
}
.gtm-hero-1 .gtm-field-button {
  animation-delay: 0.5s; /* commence après gtm-slogan, pas après les images */
}

/* Images : fade in simple */
.gtm-hero-1 .gtm-hero-img-1,
.gtm-hero-1 .gtm-hero-img-2,
.gtm-hero-1 .gtm-hero-img-3 {
  opacity: 0;
  animation: fadeIn 0.5s forwards; /* images légèrement plus lentes */
}

/* Début animation images juste après gtm-slogan */
.gtm-hero-1 .gtm-hero-img-1 {
  animation-delay: 0.5s;
  margin: auto;
}
.gtm-hero-1 .gtm-hero-img-2 {
  animation-delay: 0.7s;
}
.gtm-hero-1 .gtm-hero-img-3 {
  animation-delay: 0.9s;
}

/* Keyframes */
@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeIn {
  to {
    opacity: 1;
  }
}


/* --------------------------------------------------
Hero 02
-------------------------------------------------- */

.gtm-hero-2 {
  padding: 0px;
}

.gtm-hero-2 .mod-custom .gtm-hero-container {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  min-height: 80dvh;
}

.gtm-hero-2 .gtm-hero-texte-content {
  position: relative;
  z-index: 2;
  padding: var(--space-xl);
  text-align: center;
  max-width: 768px;
  margin: auto;
}

.gtm-hero-2 .gtm-hero-texte-content h1 {
  color: var(--color-light);
}

.gtm-hero-2 .gtm-hero-texte-content .gtm-slogan {
  display: block;
  font-size: var(--font-size-slogan);
  margin-bottom: var(--space-md);
  /* color: var(--color-light); */
}


.gtm-hero-2 .gtm-hero-images {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
}

.gtm-hero-2 .gtm-hero-images img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.gtm-hero-2 .mod-custom .gtm-hero-images::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background-color: var(--color-background);
}


/* Image : fade in simple (arrive en premier) */
.gtm-hero-2 .gtm-hero-images {
  opacity: 0;
  animation: fadeIn 0.5s forwards; /* durée identique aux images précédentes */
  animation-delay: 0.1s; /* commence en premier */
}

/* Texte : fade in up (rapide) */
.gtm-hero-2 h1,
.gtm-hero-2 .gtm-slogan,
.gtm-hero-2 .gtm-field-button {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUp 0.4s forwards; /* rapide */
}

/* Ordre et délais des textes */
.gtm-hero-2 h1 {
  animation-delay: 0.6s; /* après l'image */
}
.gtm-hero-2 .gtm-slogan {
  animation-delay: 0.8s;
}
.gtm-hero-2 .gtm-field-button {
  animation-delay: 1s;
}

/* Keyframes */
@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeIn {
  to {
    opacity: 1;
  }
}



/* --------------------------------------------------
Hero 03
-------------------------------------------------- */

.gtm-hero-3 {
  padding: 93px var(--space-md) 0 var(--space-md);
}

.gtm-hero-3 .mod-custom .gtm-hero-container {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
}

.gtm-hero-3 .gtm-hero-texte-content {
    width: 100%;
    padding: var(--space-md);
    order: 2;
}

.gtm-hero-3 .gtm-hero-texte-content {
  order: 1;
}

.gtm-hero-3 .gtm-hero-texte-content .gtm-groupe-slogan {
  display: flex;
  flex-direction: column;
}

.gtm-hero-3 .gtm-hero-texte-content .gtm-slogan {
  font-size: var(--font-size-slogan);
  margin-bottom: var(--space-sm);
}

.gtm-hero-3 .gtm-hero-images {
  width: 100%;
  height: 35dvh;
  overflow: hidden;
  position: relative;
}

.gtm-hero-3 .gtm-hero-images img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

#postuler .gtm-hero-3 .gtm-hero-images img {
  object-position: bottom;
}

/* DESKTOP -------------------------------------  */

@media screen and (min-width: 1200px) {

  .gtm-hero-3 {
    padding: var(--space-5xl) var(--space-md) 0 var(--space-md);
  }

  .gtm-hero-3 .gtm-hero-texte-content {
    display: flex;
    justify-content: space-around;
    align-items: center;
    column-gap: var(--space-lg);
  }

  .gtm-hero-3 .gtm-hero-texte-content .gtm-groupe-slogan {
    flex-direction: column;
    width: 50%;
    text-align: right;
  }

  .gtm-hero-3 .gtm-hero-images {
    /* height: 45dvh; */
    height: 65dvh;
  }
}

/* Texte : fade in up (rapide) */
.gtm-hero-3 h1,
.gtm-hero-3 .gtm-slogan,
.gtm-hero-3 .gtm-field-button {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUp 0.4s forwards; /* rapide */
}

/* Ordre et délais des textes */
.gtm-hero-3 h1 {
  animation-delay: 0.1s; /* arrive en premier */
}
.gtm-hero-3 .gtm-field-button {
  animation-delay: 0.3s; /* après h1 */
}
.gtm-hero-3 .gtm-slogan {
  animation-delay: 0.5s; /* après le bouton */
}

/* Image : fade in simple */
.gtm-hero-3 .gtm-hero-images {
  opacity: 0;
  animation: fadeIn 0.5s forwards; /* durée identique aux autres images */
  animation-delay: 0.7s; /* après le texte */
}

/* Keyframes */
@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeIn {
  to {
    opacity: 1;
  }
}

/* --------------------------------------------------
Hero 04
-------------------------------------------------- */
.gtm-hero-4 {
  padding: var(--space-2xl) 0 0;
}

/* Texte */
.gtm-hero-4 .gtm-hero-texte-content .gtm-slogan {
  display: block;
  font-size: var(--font-size-md);
  margin-bottom: var(--space-md);
}

@media screen and (min-width: 1200px) { 
  .gtm-hero-4 img {
    border-radius: var(--border-radius) 0 0 var(--border-radius);
  }

  .gtm-footer-4-img img {
    border-radius: 0 var(--border-radius) var(--border-radius) 0;
  }
}

/* --------------------------------------------------
GROUPE TEXTE – MOBILE / TABLETTE (<1200px)
Descend depuis le haut + chevauche image
-------------------------------------------------- */
.gtm-hero-4 .gtm-texte-groupe {
  position: relative;
  z-index: 0;  /* au-dessus de l'image */
  padding: var(--space-lg);
  background-color: #fff;
  box-shadow: 0px 0px 38px 5px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0px 0px 38px 5px rgba(0, 0, 0, 0.5);
  max-width: 90%;
  margin: auto;
  border-radius: var(--border-radius);
  opacity: 0;
  animation: fadeDownGroup 0.6s forwards;
  animation-delay: 0.1s;

  /* ombre subtile */
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08);
  margin-top: var(--space-md);
}

/* Images */
.gtm-hero-4 .gtm-hero-images {
  position: relative;
  z-index: -1;  /* en dessous du texte */
  width: 100%;
  height: 35vh;
  overflow: hidden;

  opacity: 0;
  animation: fadeIn 0.5s forwards;
  animation-delay: 1.3s;
}

.gtm-hero-4 .gtm-hero-images img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

#nous-joindre .gtm-hero-4 .gtm-hero-images img {
  object-position: 50% 25%;
}

/* Textes internes – cascade */
.gtm-hero-4 h1,
.gtm-hero-4 .gtm-slogan,
.gtm-hero-4 .gtm-field-button {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUp 0.4s forwards;
}

.gtm-hero-4 h1 {
  animation-delay: 0.7s;
  font-weight: 400;
}

.gtm-hero-4 .gtm-slogan {
  animation-delay: 0.9s;
  color: var(--color-heading-2);
}

.gtm-hero-4 .gtm-field-button {
  animation-delay: 1.1s;
}

/* Desktop ≥1200px : slide horizontal */
@media screen and (min-width: 1200px) {

  .gtm-hero-4 {
    min-height: 100dvh;
    padding: var(--space-5xl) 0 0 0;
  }

  .gtm-hero-4 .mod-custom .gtm-hero-container {
    min-height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .gtm-hero-4 .mod-custom .gtm-hero-container .gtm-hero-texte-content {
    width: 48%;
  }

  .gtm-hero-4 .gtm-texte-groupe {
    max-width: 100%;
    margin: auto;

    /* Slide horizontal desktop */
    animation: fadeLeftGroup 0.5s forwards;
    animation-delay: 0.1s;
  }

  .gtm-hero-4 .gtm-hero-images {
    width: 55%;
    height: 100dvh;
  }
}

/* --------------------------------------------------
ANIMATIONS
-------------------------------------------------- */

/* Mobile / tablette : descend depuis le haut vers position chevauchante renforcée */
@keyframes fadeDownGroup {
  from {
    opacity: 0;
    transform: translateY(-100px); /* commence en haut */
  }
  to {
    opacity: 1;
    transform: translateY(20px); /* chevauchement réduit de moitié (40px -> 20px), demandé le 2026-09-22 */
  }
}

/* Desktop : fade + slide horizontal */
@keyframes fadeLeftGroup {
  from {
    opacity: 0;
    transform: translateX(0);
  }
  to {
    opacity: 1;
    transform: translateX(12vw);
  }
}

/* Textes cascade */
@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Image fade simple */
@keyframes fadeIn {
  to {
    opacity: 1;
  }
}


/* --------------------------------------------------
Hero LIGHT
-------------------------------------------------- */

.gtm-hero-light {
  padding: 0px;
}

.gtm-hero-light .mod-custom .gtm-hero-container {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  min-height: 40vh;
}

.gtm-hero-light .gtm-hero-texte-content {
  position: relative;
  z-index: 2;
  padding: var(--space-4xl) var(--space-lg) var(--space-lg);
  text-align: center;
  max-width: 900px;
  margin: auto;
}

.gtm-hero-light .gtm-hero-texte-content h1 {
  color: var(--color-light);
}

.gtm-hero-light .gtm-hero-texte-content .gtm-slogan {
  display: block;
  font-size: var(--font-size-slogan);
  /* margin-bottom: var(--space-md); */
  color: var(--color-light);
}

.gtm-hero-light .gtm-hero-images {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
}

.gtm-hero-light .gtm-hero-images img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.gtm-hero-light .mod-custom .gtm-hero-images::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background-color: var(--color-background-opacity);
}

/* animation */

.gtm-hero-light {
  opacity: 0;
  animation: fadeIn 0.8s forwards; /* animation au chargement */
}

.gtm-hero-light {
  animation-delay: 0.2s; /* optionnel, pour un petit délai */
}

@keyframes fadeIn {
  to {
    opacity: 1;
  }
}


/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  ARTICLES
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* Retour en arrière */

.gtm-retour {
  text-align: center;
  padding: var(--space-4xl) var(--space-lg) var(--space-lg) var(--space-lg);
}

/* Introduction */

.gtm-article-introduction {
  text-align: center;
  padding-bottom: var(--space-xl);
}

.gtm-article-introduction .gtm-texte-introduction {
  font-size: var(--font-size-lg);
}

/* Section */

.gtm-article-section {
  display: flex;
  justify-content: center;
  flex-direction: column-reverse;
  gap: var(--space-lg);
  margin-bottom: var(--space-2xl);
  align-items: center;
}

.gtm-legende-image-section {
  font-size: 10px;
}

/* Description */

/* .gtm-article-description {
  margin-bottom: var(--space-2xl);
} */

.com-content-article.item-page figure.left.item-image, .com-content-article__body {
  /* position: sticky; */
  top: var(--space-2xl);
}

/* Appel à l'action */

.gtm-appel-action {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  justify-content: center; 
  gap: var(--space-md, 20px);
  max-width: 80%;
  margin: 0 auto;
  text-align: center;
}

.gtm-appel-action > div {
  display: flex;
  flex-direction: column; 
  align-items: center; 
  margin-bottom: var(--space-xl);
}

/* .gtm-contenu-texte-section, .gtm-image-section.gtm-img-section {
  padding: 0 var(--space-xl) var(--space-xl) var(--space-xl);
} */

@media (max-width: 600px) {
  .gtm-appel-action {
    grid-template-columns: 1fr; 
    gap: var(--space-xl, 30px); 
  }
}

/* DESKTOP ------------------------------------- */

@media screen and (min-width: 992px) {


  /* Section */

  .gtm-article-section {
    flex-direction: row;
  }

  .gtm-article-section {
    flex-direction: row;
  }

  .gtm-contenu-texte-section {
    width: 60%;
    position: sticky;
  }

  .gtm-article-image-section  {
    width: 40%;
  }

  /* Contenu de l'article de blogue */

  .gtm-texte-carriere  {
    padding-bottom: var(--space-lg);
  }

  figure.left.item-image {
    float: left;
    max-width: 50%;
    padding: 0 var(--space-md) var(--space-md) 0;
  }

  img.float-start {
    float: left;
    max-width: 300px;
  }

  .gtm-img-section {
    position: sticky;
    top: 20px;
  }
}

/* Appel à l'action */

.gtm-appel-action {
  display: grid;
  gap: var(--space-md, 20px);
  margin: 0 auto;
  text-align: center;
  position: relative;
  z-index: 0;
}

.gtm-appel-action.gtm-nb-btn-3 {
  grid-template-columns: repeat(3, 1fr);
}

.gtm-appel-action.gtm-nb-btn-2 {
  grid-template-columns: repeat(2, 1fr);
}

.gtm-appel-action.gtm-nb-btn-1 {
  grid-template-columns: auto;
}

.gtm-appel-action > div {
  display: flex;
  flex-direction: column; 
  align-items: center; 
}

.gtm-bouton1-wrapper.gtm-action-bg, .gtm-bouton2-wrapper.gtm-action-bg, .gtm-bouton3-wrapper.gtm-action-bg {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    gap: 20px;
    aspect-ratio: 1 / 1;
    width: 100%;
    max-width: 400px; /* optionnel */
    margin-top: var(--space-xl);
    min-width: 0; /* il faut déclarer la min-width sinon bug sur IPAD et ne descend pas plus bas que la gradeur de l'image */
}

.gtm-bouton1-wrapper.gtm-action-bg .img-btn-background, .gtm-bouton2-wrapper.gtm-action-bg .img-btn-background, .gtm-bouton3-wrapper.gtm-action-bg .img-btn-background {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.gtm-bouton1-wrapper.gtm-action-bg .img-btn-background img, .gtm-bouton2-wrapper.gtm-action-bg .img-btn-background img, .gtm-bouton3-wrapper.gtm-action-bg .img-btn-background img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* équivalent background-size: cover */
    object-position: center;
}


.gtm-bouton1-wrapper.gtm-action-bg h4, .gtm-bouton2-wrapper.gtm-action-bg h4, .gtm-bouton3-wrapper.gtm-action-bg h4,
.gtm-bouton1-wrapper.gtm-action-bg .custom-button-wrapper, .gtm-bouton2-wrapper.gtm-action-bg .custom-button-wrapper, .gtm-bouton3-wrapper.gtm-action-bg .custom-button-wrapper {
    position: relative;
    z-index: 2;
    color: #fff;
}


.gtm-bouton1-wrapper.gtm-action-bg .img-btn-background::after, .gtm-bouton2-wrapper.gtm-action-bg .img-btn-background::after, .gtm-bouton3-wrapper.gtm-action-bg .img-btn-background::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.35);
    z-index: 1;
}

@media (max-width: 600px) {
  .gtm-appel-action {
    display: flex;
    flex-direction: column;
    align-items: center;
    column-gap: var(--space-xl);
  }
}

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  LOGO SLIDER
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

.mod-logoslider {
  padding: 0;
  margin-bottom: var(--space-lg);
}

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  CHAMPS GENERAUX
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* Gestimark 2026-09-28 : espace gauche/droite = var(--space-lg) du .gtm-wrapper SEULEMENT, aucun padding/margin horizontal ajouté hors blocs à fond (.gtm-bg-*, qui ont leur propre padding). */
.gtm-article-introduction, .gtm-article-section {
  margin-bottom: 0;
  padding-top: var(--space-lg);
  padding-bottom: var(--space-lg);
}

.gtm-article-description {
  margin-bottom: 0;
  padding: var(--space-xl) 0;
}

/* .gtm-article-description {
  background-color: var(--color-noir);
  padding: var(--space-2xl);
}

.gtm-article-description h3, .gtm-article-description p {
  color: #fff;
} */


.gtm-appel-action {
  margin-bottom: 0;
  padding-top: var(--space-lg);
  padding-bottom: 0;
}

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  BLOGUE VERSION MODULE
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

.gtm-titre-blog {
  padding-top: var(--space-lg);
  padding-bottom: 0;
  padding-left: var(--space-lg);
  padding-right: var(--space-lg);
  margin-bottom: 0;
}

.gtm-texte-blog {
  padding-top: var(--space-lg);
  padding-bottom: var(--space-lg);
  padding-left: var(--space-lg);
  padding-right: var(--space-lg);
  margin-bottom: 0;
}

.gtm-blog-col > h3 {
  text-align: center;
  margin-bottom: var(--space-lg);
}

.mod-articlesnews__item {
  margin: 0 auto;
  /* padding-bottom: var(--space-lg); */
}

#faq .mod-articlesnews__item {
  margin: 0 auto var(--space-sm);
  padding-top: 0;
  padding-bottom: 0;
  /* padding-right: var(--space-lg);
  padding-left: var(--space-lg); */
}

#faq .mod-articlesnews__item:last-child {
  margin: 0 auto !important;
  padding-bottom: var(--space-lg);
}

.mod-articlesnews__item .gtm-texte-carriere {
  padding-bottom: 0;
}

/* Gestimark 2026-09-28 : espace gauche/droite = var(--space-lg) du .gtm-wrapper SEULEMENT, aucun padding/margin horizontal ajouté hors blocs à fond (.gtm-bg-*, qui ont leur propre padding). */
.mod-articlesnews.newsflash {
  padding: var(--space-lg) 0;
}

.gtm-blog-col {
  padding-top: var(--space-lg);
}

.mod-articlesnews__item .gtm-champs {
  max-width: 400px;
  margin: 0 auto;
  padding-top: var(--space-lg);
  padding-bottom: var(--space-lg);
  /* padding-left: var(--space-lg);
  padding-right: var(--space-lg); */
}

#faq .mod-articlesnews__item .gtm-champs {
  padding-top: 0;
  margin: 0;
  max-width: unset;
  padding-bottom: 0;
  padding-left: 0;
  padding-right: 0;
}

.gtm-rond .mod-articlesnews__item figure img {
  border-radius: 50%;
}

.gtm-blog-col .mod-articlesnews__item, .gtm-blog-col .mod-articlesnews__item a {
  text-align: center;
}

.gtm-liens-champs {
  display: block;
  max-width: fit-content;
  margin-left: auto;
  margin-right: auto;
}

.gtm-blog-ligne .mod-articlesnews__item {
  max-width: 550px;
  text-align: center;
  align-items: center;
}

.gtm-texte-blog {
  margin-bottom: 0;
}

@media screen and (min-width: 768px) { 
  .gtm-blog-col .mod-articlesnews__item .gtm-champs {
    max-width: 600px;
    padding-left: 0;
    padding-right: 0;
  }
}


/* DESKTOP ------------------------------------- */


@media screen and (min-width: 992px) {

  /* Gestimark 2026-09-28 : largeur 80 % centrée retirée (marge latérale supplémentaire). */
  /* .gtm-blog-ligne, .gtm-blog-col {
    max-width: 80%;
    margin: auto;
  } */

  .gtm-blog-col {
    padding-left: 0;
    padding-right: 0;
  }

/* Design en ligne ---------------- */

  .gtm-blog-ligne .mod-articlesnews__item {
    display: grid;
    grid-template-columns: repeat(2, auto);
    grid-template-rows: auto;
    grid-column-gap: var(--space-sm);
    grid-row-gap: 0px;
    margin-bottom: var(--space-md);
    max-width: unset;
    text-align: unset;
  }

  .gtm-blog-ligne .mod-articlesnews__item figure {
    max-width: 200px;
    line-height: 0;
    margin-bottom: 0;
  }

  .gtm-blog-ligne .mod-articlesnews__item .gtm-champs {
    align-content: center;
  }


  /* Design du blogue 2 colonnes ---------------- */

  .gtm-blog-col.gtm-blog-col-2 .mod-articlesnews {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: var(--space-xl);
    grid-row-gap: var(--space-xl);
  }

  /* Design du blogue 3 colonne --------------- */
  .gtm-blog-col.gtm-blog-col-3 .mod-articlesnews {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: var(--space-xl);
    grid-row-gap: var(--space-xl);
  }

  /* Design du blogue 4 colonne ---------------- */
  .gtm-blog-col.gtm-blog-col-4 .mod-articlesnews {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: var(--space-lg);
    grid-row-gap: var(--space-lg);
  }
}

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  SERVICES
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* --------------------------------------------------
Service 01
-------------------------------------------------- */

/* Gestimark 2026-09-28 : espace gauche/droite = var(--space-lg) du .gtm-wrapper SEULEMENT, aucun padding/margin horizontal ajouté hors blocs à fond (.gtm-bg-*, qui ont leur propre padding). */
.gtm-intro-service-1 {
  padding-top: var(--space-lg);
  padding-bottom: var(--space-lg);
}

.gtm-dev-service-1 {
  display: flex;
  justify-content: center;
  flex-direction: column-reverse;
  gap: var(--space-md);
  padding-top: var(--space-lg);
  padding-bottom: var(--space-lg);
  padding-left: var(--space-lg);
  padding-right: var(--space-lg);
  align-items: center;
}

.gtm-texte-service-1 {
  padding-bottom: var(--space-lg);
}

@media screen and (min-width: 992px) {
    .gtm-dev-service-1 {
      flex-direction: row;
      padding-right: 0;
    }

    .gtm-content-dev-service-1 {
      width: 50%;
    }

    .gtm-wrap-img-service-1 {
      width: 50%;
    }
}

/* --------------------------------------------------
Service 02
-------------------------------------------------- */

.gtm-texte-service-2 {
  margin-bottom: 0;
}

/* --------------------------------------------------
Service 03
-------------------------------------------------- */

.gtm-texte-service-3 {
  padding-bottom: var(--space-lg);
}

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  DEVENIR MEMBRE
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

.gtm-intro-membre {
  padding-top: var(--space-lg);
  padding-bottom: var(--space-lg);
  padding-left: var(--space-lg);
  padding-right: var(--space-lg);
}

.gtm-dev-membre {
  display: flex;
  justify-content: center;
  flex-direction: column-reverse;
  gap: var(--space-md);
  padding-bottom: var(--space-lg);
  padding-left: var(--space-lg);
  padding-right: var(--space-lg);
}

@media screen and (min-width: 992px) {
    .gtm-dev-membre {
      flex-direction: row;
      padding-right: 0;
    }

    .gtm-content-dev-membre {
      width: 50%;
    }

    .gtm-wrap-img-membre {
      width: 50%;
    }
}

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  NOUS SOUTENIR
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* Gestimark 2026-09-28 : espace gauche/droite = var(--space-lg) du .gtm-wrapper SEULEMENT, aucun padding/margin horizontal ajouté hors blocs à fond (.gtm-bg-*, qui ont leur propre padding). */
.gtm-intro-soutenir, .gtm-dons-intro-soutenir {
  padding-top: var(--space-lg);
  padding-bottom: var(--space-lg);
}

/* Gestimark 2026-09-28 : espace gauche/droite = var(--space-lg) du .gtm-wrapper SEULEMENT, aucun padding/margin horizontal ajouté hors blocs à fond (.gtm-bg-*, qui ont leur propre padding). */
.gtm-dev-soutenir, .gtm-dons-dev-soutenir {
  display: flex;
  justify-content: center;
  flex-direction: column-reverse;
  gap: var(--space-md);
  padding-top: var(--space-lg);
  padding-bottom: var(--space-lg);
  align-items: center;
}

@media screen and (min-width: 992px) {
    .gtm-dev-soutenir, .gtm-dons-dev-soutenir {
      flex-direction: row;
      padding-right: 0;
    }

    .gtm-content-dev-soutenir, .gtm-content-dev-dons {
      width: 50%;
    }

    .gtm-wrap-img-soutenir, .gtm-wrap-img-dons {
      width: 50%;
    }
}

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  NOUS JOINDRE
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* Gestimark 2026-09-28 : espace gauche/droite = var(--space-lg) du .gtm-wrapper SEULEMENT, aucun padding/margin horizontal ajouté hors blocs à fond (.gtm-bg-*, qui ont leur propre padding). */
.gtm-nous-joindre {
  padding-top: var(--space-lg);
  padding-bottom: var(--space-lg);
}

.gtm-adresse-nous-joindre {
  margin-bottom: var(--space-md);
}

.gtm-nous-joindre .gtm-adresse-num a {
  display: block;
  width: fit-content;
  margin-bottom: var(--space-sm);
}


/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  ACCORDÉONS
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* Style du conteneur de la question */
.faq-item {
  margin-bottom: 15px;
  overflow: hidden;
  transition: box-shadow 0.3s ease;
}


.faq-item h3 {
  font-size: var(--font-size-md);
  margin-bottom: 0;
}

/* Style du bouton question */
.faq-question {
  width: 100%;
  padding: var(--space-sm);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border: 2px solid var(--color-background-question-faq);
  border-radius: 8px;
  background-color: transparent;
  color: var(--color-texte-question-faq);
  text-align: left;
  transition: background 0.3s ease;
}

/* Icône + / − (2026-09-29) : dessinée en CSS (2 barres) au lieu du caractère « + » du HTML,
   masqué par font-size: 0 (gardé dans le HTML, aria-hidden). À l'ouverture, la barre verticale
   pivote de 90° et se superpose à l'horizontale : le + devient un − en douceur. */
.faq-icon {
  position: relative;
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  margin-left: var(--space-xs);
  font-size: 0;
  color: var(--color-texte-question-faq);
}

.faq-icon::before,
.faq-icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 14px;
  height: 2px;
  margin: -1px 0 0 -7px;
  border-radius: 1px;
  background-color: currentColor;
  transition: transform 0.3s ease;
}

/* Barre verticale du + */
.faq-icon::after {
  transform: rotate(90deg);
}

/* Ouvert : la barre verticale se couche → − */
.faq-item[aria-expanded="true"] .faq-icon::after {
  transform: rotate(180deg);
}

@media (prefers-reduced-motion: reduce) {
  .faq-icon::before,
  .faq-icon::after {
    transition: none;
  }
}

/* Style de la réponse (cachée par défaut) */
.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease, padding 0.3s ease;
  color: var(--color-texte-reponse-faq);
}

.faq-answer-content {
  padding: 0 var(--space-sm);
}

/* Réponse visible quand ouvert */
.faq-item[aria-expanded="true"] .faq-answer {
  max-height: 500px;
  padding: var(--space-sm) 0;
}

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  FOOTER
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* --------------------------------------------------
Footer 01 | 02 | 03 | 04
-------------------------------------------------- */

.gtm-footer-v1 {
  justify-content: center;
}

.gtm-footer-col-1 {
  max-width: 500px;
  padding-bottom: var(--space-lg);
}

.gtm-footer-col-1 .mod-custom, .gtm-footer-col-3 .mod-custom {
  display: flex;
  flex-direction: column;
}

.gtm-footer-col-1 .mod-custom img {
  padding-bottom: var(--space-sm);
}

.gtm-footer-col-3 a {
  margin-bottom: var(--space-sm);
}

.gtm-picto-ms {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: var(--space-sm);
}

.gtm-picto-ms a {
  line-height: 0;
}

.gtm-picto-ms a svg {
    fill: var(--color-link);
  transition: fill .2s ease-in-out;
}

.gtm-picto-ms a:hover svg {
  fill: var(--color-link-hover);
}

.gtm-picto-ms svg {
  width: 30px;
}

/* --------------------------------------------------
Footer 01 | 02 | 03 (sans la photo)
-------------------------------------------------- */

.gtm-footer-v1 {
  padding: var(--space-lg);
}

.gtm-footer-col-1 .gtm-logo-footer {
  width: 300px;
}

.gtm-footer-col-1, .gtm-footer-col-2, .gtm-footer-col-3 {
  margin-bottom: var(--space-lg);
}

.gtm-footer-col-1 .gtm-footer-1-slogan {
  display: block;
  font-size: var(--font-size-lg);
}

.gtm-footer-1-title-section {
  display: block;
  font-family: var(--font-primary-bold);
  font-size: var(--font-size-lg);
  text-transform: uppercase;
  margin-bottom: var(--space-sm);
}

.gtm-footer-col-4 ul {
  list-style: none;
  margin-left: 0px;
  font-size: var(--font-size-xs);
}

.gtm-footer-liste-horaire {
  font-family: var(--font-primary);
  list-style: none;
  margin-left: 0;
}

.gtm-footer-liste-horaire .gtm-footer-jour {
  font-family: var(--font-primary-bold);
}

.gtm-footer-ligne-img .mod-custom {
  display: grid;
  grid-template-columns: repeat(3, auto);
  grid-template-rows: auto;
  grid-column-gap: var(--space-md);
  justify-content: center;
}

.gtm-footer-ligne-img .mod-custom img:nth-child(1), .gtm-footer-ligne-img .mod-custom img:nth-child(3) {
  display: none;
}

/* TABLETTE -------------------------------------  */

@media screen and (min-width: 767px) {

  .gtm-footer-v1 {
    display: grid;
    grid-template-columns: repeat(2, auto);
    grid-template-rows: repeat(2, auto);
    grid-column-gap: var(--space-lg);
    grid-row-gap: var(--space-lg);
  }

  .gtm-footer-col-1 { grid-area: 1 / 1 / 2 / 2; }
  .gtm-footer-col-2 { grid-area: 1 / 2 / 2 / 3; }
  .gtm-footer-col-3 { grid-area: 2 / 1 / 3 / 2; }
  .gtm-footer-col-4 { grid-area: 2 / 2 / 3 / 3; }

  .gtm-footer-col-1, .gtm-footer-col-2, .gtm-footer-col-3 {
    margin-bottom: 0px;
  }

  .gtm-footer-ligne-img .mod-custom img:nth-child(1), .gtm-footer-ligne-img .mod-custom img:nth-child(3) {
    display: block;
  }

  .gtm-footer-col-1 .gtm-logo-footer {
    width: 300px;
  }
}

/* DESKTOP -------------------------------------  */

@media screen and (min-width: 1200px) {

  .gtm-footer-v1 {
    grid-template-columns: 1.5fr 1fr 1.5fr 1.5fr;
    grid-template-rows: auto;
    grid-column-gap: var(--space-lg);
  }

  .gtm-footer-col-1 { grid-area: 1 / 1 / 2 / 2;}
  .gtm-footer-col-2 { grid-area: 1 / 2 / 2 / 3;}
  .gtm-footer-col-3 { grid-area: 1 / 3 / 2 / 4;}
  .gtm-footer-col-4 { grid-area: 1 / 4 / 2 / 5;}

  .gtm-footer-col-1 .gtm-logo-footer {
    width: 450px;
  }
}

/* --------------------------------------------------
Footer 03 (photo)
-------------------------------------------------- */

.gtm-footer-3 {
  padding: 0px;
}

.gtm-footer-3-img .mod-custom {
  width: 100%;
  height: 35dvh;
  overflow: hidden;
  position: relative;
}

.gtm-footer-3-img .mod-custom img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* --------------------------------------------------
Footer 04
-------------------------------------------------- */

.gtm-footer-4 {
  padding: 0px;
}

.gtm-footer-4 .mod-custom {
  display: flex;
  flex-direction: column-reverse;
  justify-content: center;
}

.gtm-footer-4-img .mod-custom{
  width: 100%;
  height: 25dvh;
  overflow: hidden;
  position: relative;
}

.gtm-footer-4-img .mod-custom img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left;
}

.gtm-footer-4-right {
  padding: var(--space-lg);
}

.gtm-footer-4-img .mod-custom {
  box-shadow: 0px 0px 38px 5px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 0px 0px 38px 5px rgba(0, 0, 0, 0.1);
  border-radius: 0 var(--border-radius) var(--border-radius) 0;
}

.gtm-footer-4-right .gtm-footer-col-1 .mod-custom, .gtm-footer-4-right .gtm-footer-col-3 .mod-custom, .gtm-footer-4-right .gtm-footer-col-4 .mod-custom {
  display: block;
}


/* TABLETTE -------------------------------------  */

@media screen and (min-width: 768px) {

  .gtm-footer-4-right {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-column-gap: var(--space-lg);
    grid-row-gap: var(--space-lg);
    padding: var(--space-lg);
    width: 100%;
  }

  .gtm-footer-4-img .mod-custom{
    height: 50dvh;
  }

  .gtm-footer-4 .gtm-footer-col-1 { grid-area: 1 / 1 / 2 / 2; }
  .gtm-footer-4 .gtm-footer-col-2 { grid-area: 1 / 2 / 2 / 3; }
  .gtm-footer-4 .gtm-footer-col-3 { grid-area: 2 / 1 / 3 / 2; }
  .gtm-footer-4 .gtm-footer-col-4 { grid-area: 2 / 2 / 3 / 3; }

}

/* DESKTOP -------------------------------------  */

@media screen and (min-width: 1200px) {

  .gtm-footer-4 .mod-custom {
    flex-direction: row;
  }

  .gtm-footer-4-img {
    width: 50%;
    height: 100dvh;
  }

  .gtm-footer-4-right {
    width: 50%;
  }

  .gtm-footer-4-img .mod-custom{
    width: 100%;
    height: 100dvh;
    overflow: hidden;
    position: relative;
  }
}

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  MERCI / OUPS
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

.gtm-texte-merci {
  display: flex;
  align-items: center;
  padding-top: var(--space-2xl);
}

/* Merci et Oups : le titre principal est un h1, avec exactement le style des h2. */
.gtm-texte-merci h1 {
  font-size: var(--font-size-4xl);
  font-family: var(--glegoo);
  color: var(--color-heading);
  margin: 0 0 var(--space-md) 0;
  line-height: 1.2;
  font-weight: 700;
}

.gtm-img-merci .mod-custom, .gtm-img-oups .mod-custom {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  min-height: 50dvh;
  margin-right: calc(var(--space-lg) * -1);
  margin-left: calc(var(--space-lg) * -1);
}

#sitemap .gtm-hero-4 {
  display: none;
}

@media screen and (min-width: 768px) {
  .gtm-texte-merci {
    padding-top: 0;
  }

  .gtm-img-merci .mod-custom, .gtm-img-oups .mod-custom {
    min-height: 100dvh;
    margin-right: calc(var(--space-lg) * -1);
    margin-left: auto;
    margin-top: calc(var(--space-lg) * -1);
  }
}

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  POLITIQUE DE CONFIDENTIALITE
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

#politique-de-confidentialite .com-content-article.item-page {
  padding-top: var(--space-4xl);
  padding-left: var(--space-lg);
  padding-right: var(--space-lg);
}

#politique-de-confidentialite h2 {
  font-size: var(--font-size-xl);
}

#politique-de-confidentialite h3 {
  font-size: var(--font-size-lg);
}

#politique-de-confidentialite form {
  padding-top: var(--space-xl);
  margin-left: 0;
  margin-right: 0;
  max-width: 100%;
}

.gtm-sommaire-politique {
  margin-bottom: var(--space-2xl);
}

/* #endregion */

/* #region MENU ----------------------------------------------------------------------------------------------------- */


/* ---------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------------
  MENU
------------------------------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------------------------- */

#gtm-menu .moduletable {
  padding: 0;
}

/* Menu centré ---------------------------------------- */

.gtm-logo-menu-header {
  max-width: 100px;
}

.gtm-menu-standard .menu-item.default, .gtm-menu-standard li.item-210, .gtm-menu-centre li.item-210  {
  display: none;
}

/* Masqué le titre du lien de menu Accueil */

.image-title.visually-hidden {
  display: none;
}

/* --------------------------------------------------
MENU MOBILE
-------------------------------------------------- */

/* Menu burger -------------------------------------  */

.gtmHeader .gtm-open-nav-menu {
  display: flex;
  position: fixed;
  top: var(--space-sm);
  right: var(--space-sm);
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background-color: var(--color-background-burger);
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  z-index: 10000000;
}

/* Barres du burger */
.gtmHeader .gtm-open-nav-menu span,
.gtmHeader .gtm-open-nav-menu span:before,
.gtmHeader .gtm-open-nav-menu span:after {
  display: block;
  position: relative;
  height: 2px;
  width: 20px;
  background-color: var(--color-background-burger-line);
  border-radius: var(--border-radius);
  transition: all 0.2s ease;
}

.gtmHeader .gtm-open-nav-menu span:before {
  content: "";
  top: -7px;
  position: absolute;
}

.gtmHeader .gtm-open-nav-menu span:after {
  content: "";
  top: 7px;
  position: absolute;
}

/* Burger transformé en croix */
.gtm-hidden-scrolling .gtmHeader .gtm-open-nav-menu span {
  background-color: transparent !important;
}

.gtm-hidden-scrolling .gtmHeader .gtm-open-nav-menu span:before {
  transform: rotate(45deg);
  top: 0;
}

.gtm-hidden-scrolling .gtmHeader .gtm-open-nav-menu span:after {
  transform: rotate(-45deg);
  top: 0;
}

/* Navigation principale -------------------------------------  */

.gtmHeader {
  position: fixed;
  width: 100%;
  min-height: 100dvh;
  display: flex;
  justify-content: center;
  align-items: center;
  top: -100%;
  z-index: 1;
  background-color: transparent;
  transition: all 0.5s ease;
}

.gtmHeader.gtmOpen {
  top: 0;
  z-index: 100;
  background-color: var(--color-beige);
}

.menu {
  display: flex;
  flex-direction: column;
  align-items: center;
  list-style: none;
  margin: 0;
}


.menu .menu-item a, span.mod-menu__separator.separator  {
  text-decoration: none;
  font-size: var(--font-size-xl);
  color: var(--color-link-menu);
  margin-bottom: 0;
  padding-bottom: 0;
}

.menu-item.current > a, .menu-item.gtm-sous-menu-actif > a, .menu .menu-item.gtm-sous-menu-actif > span {
  border-bottom: 1px solid var(--color-noir);
}

/* Sous-menu -------------------------------------  */

.gtm-menu-item-has-children .gtm-sub-menu {
  position: relative;
  max-height: 0;
  overflow: hidden;
  visibility: hidden;
  opacity: 0;
  margin-left: 0;
  margin-bottom: 0;
  transition: all 0.2s ease-in-out;
  text-align: center;
}

.gtm-menu-item-has-children.gtm-active .gtm-sub-menu {
  visibility: visible;
  opacity: 1;
}

.gtm-menu-item-has-children .gtm-sub-menu li {
  margin: var(--space-sm) 0 0 0;
}

.gtm-menu-item-has-children.gtm-active .gtm-sub-menu li:last-child {
  padding: 0 0 var(--space-sm) 0;
}

.gtm-menu-item-has-children .gtm-sub-menu li a {
  font-size: var(--font-size-md);
}

.gtm-menu-item-has-children.gtm-sous-menu-actif .gtm-sub-menu li {
    color: var(--color-link-menu-active);
}

/* Icône + -------------------------------------  */
/* 
.gtm-menu-item-has-children .separator {
  position: relative;
  cursor: pointer;
} */




/* --------------------------------------------------
MEDIA QUERIES
-------------------------------------------------- */

/* TABLETTE -------------------------------------  */

@media screen and (min-width: 768px) {
  .gtm-menu-item-has-children .separator {
    display: block;
    width: 100%;
    text-align: center;
  }


/* Icône + -------------------------------------  */

  /* Icône "+" : lignes horizontale et verticale */
  /* .gtm-menu-item-has-children .separator::before,
  .gtm-menu-item-has-children .separator::after {
    width: 25px;
    height: 3.5px;
  } */

  /* Ligne verticale (avant) */
  /* .gtm-menu-item-has-children .separator::before {
    right: 0;
  } */

  /* Ligne horizontale */
  /* .gtm-menu-item-has-children .separator::after {
    right: 0;
  } */
}

/* DESKTOP -------------------------------------  */

@media screen and (min-width: 1200px) {

  .gtm-menu-item-has-children .gtm-sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 200px;
    background-color: #fff;
    opacity: 0;
    visibility: hidden;
    max-height: none;
    transition: opacity 0.3s ease, visibility 0.3s ease;
  }

  .gtm-menu-item-has-children:hover .gtm-sub-menu,
  .gtm-menu-item-has-children:focus-within .gtm-sub-menu {
    opacity: 1;
    visibility: visible;
  }

  /* Masquer burger */
  .gtmHeader .gtm-open-nav-menu {
    display: none;
    z-index: 9;
  }

  .gtmHeader {
    position: fixed;
    top: 0;
    left: 0;
    min-height: auto;
    background-color: transparent;
    display: flex;
    z-index: 10;
  }

  .gtmHeader .gtmContainer {
    width: 100%;
  }

  .menu {
    display: flex;
    align-items: center;
    flex-direction: row;
    width: 100%;
    height: 100px;
    column-gap: 20px;
    list-style: none;
    margin: 0px;
    padding: 0 var(--space-sm);
    background-color: var(--color-beige);
    transition: all .3s ease-in-out;
  }

  /* body.gtm-scrolled .menu {
    height: 60px;
  } */

  /* Alignement de menu -------------------------------------- */

.gtm-menu-gauche {
  justify-content: flex-start;
}

.gtm-menu-centre {
  justify-content: center;
}

.gtm-menu-droit {
  justify-content: flex-end;
}

.gtm-logo-header.gtm-logo-droit {
  right: 20px;
  left: auto;
}

.gtm-logo-header.gtm-logo-gauche {
  right: auto;
  left: 20px;
}

.gtm-logo-header.gtm-logo-none {
  display: none;
}


/* Navigation principale -------------------------------------  */

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

  .menu .menu-item > a, .menu .menu-item > span {
    font-family: var(--font-primary-bold);
    color: var(--color-link-menu);
    font-size: var(--font-size-sm);
    text-decoration: none;
    transition: all 0.2s ease-in-out;
  }

  .menu .menu-item > a:hover, .menu .menu-item > span:hover {
    border-bottom: 1px solid var(--color-noir);
  }

  /* Page active soulignée (demande du 2026-09-30 ; le gabarit l'annulait ici avec 0px).
     :has(.current) : souligne aussi le parent (« À propos ») d'une page de sous-menu, sans
     dépendre du JS (qui compare des URL et échoue quand l'adresse finit par / au lieu de index.html).
     Le logo (lien Accueil) n'est pas souligné. */
  .menu .menu-item.current > a,
  .menu .menu-item:has(.current) > span,
  .menu-item.gtm-sous-menu-actif > a, .menu .menu-item.gtm-sous-menu-actif > span {
    border-bottom: 1px solid var(--color-noir);
  }

  .menu .menu-item.default.current > a {
    border-bottom: 0;
  }

  .gtm-menu-bouton > li:last-child {
    background-color: var(--color-menu-contact);
    border-radius: var(--border-radius);
    height: auto;
    padding: var(--space-xs) var(--space-sm);
    transition: background .2s ease-in-out,
                color .2s ease-in-out;
  }

  .gtm-menu-bouton > li:last-child:hover {
    background-color: var(--color-noir);
  }

  .gtm-menu-bouton > li:last-child a {
    color: #fff !important;
    border-bottom: 0 !important;
  }

  .gtm-menu-bouton > li:last-child:hover a {
    color: var(--color-menu-texte-contact-hover);
  }

/* Navigation secondaire -------------------------------------  */

  .gtm-menu-item-has-children {
    position: relative;
  }

  .gtm-menu-item-has-children .gtm-sub-menu {
    position: absolute;
    z-index: 10;
    top: 100%;
    left: 0;
    min-width: 250px;
    max-height: 10000px;
    background-color: var(--color-background-sub-menu);
    padding: var(--space-sm);
    opacity: 0;
    visibility: hidden;
    list-style: none;
    text-align: left;
    border-radius: 0 0 1vw 1vw;
    transition: all 0.3s ease;
  }

  .gtm-menu-item-has-children:hover .gtm-sub-menu,
  .gtm-menu-item-has-children:focus-within .gtm-sub-menu {
    opacity: 1;
    visibility: visible;
  }

  .gtm-menu-item-has-children .gtm-sub-menu li {
      margin: var(--space-sm) 0 0 0;
  }

  .gtm-menu-item-has-children .gtm-sub-menu li:nth-child(1) {
      margin-top: 0px;
  }

  .gtm-sub-menu .menu-item a {
    color: var(--color-link-sub-menu);
    padding-bottom: var(--space-xs);
  }

  .gtm-sub-menu .menu-item a:hover {
    color: var(--color-link-sub-menu-hover);
  }

  .gtm-menu-item-has-children .gtm-sub-menu li a {
    font-size: var(--font-size-xs);
  }


/* Icône + -------------------------------------  */


  /* Icône "+" : lignes horizontale et verticale */
  /* .gtm-menu-item-has-children .separator::before,
  .gtm-menu-item-has-children .separator::after {
    width: 10px;
    height: 1.5px;
  } */

  /* Ligne verticale (avant) */
  /* .gtm-menu-item-has-children .separator::before {
    right: -15px;
  } */

  /* Ligne horizontale */
  /* .gtm-menu-item-has-children .separator::after {
    right: -15px;
  }

  .gtm-menu-item-has-children .separator::before,
  .gtm-menu-item-has-children .separator::after {
    background-color: var(--color-link-menu);
  }

  .gtm-menu-item-has-children:hover .separator::before,
  .gtm-menu-item-has-children:hover .separator::after {
    transform: rotate(0deg);
    background-color: var(--color-link-menu-hover);
  }

  .gtm-menu-item-has-children.active .separator::after,
  .gtm-menu-item-has-children.active .separator::before {
    background-color: var(--color-link-menu-active);
  } */

}

/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
  MENU FOOTER
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

.gtm-footer-4 * .gtm-menu-footer-container {
  display: flex;
  flex-direction: column;
}

#mod-custom230 a {
  font-size: 16px;
  font-family: var(--font-primary);
}

/* #endregion */







.hda-reveal {
  opacity: 0;
  transition: opacity 0.15s ease;
}
.hda-reveal.is-visible {
  opacity: 1;
}
@media (prefers-reduced-motion: reduce) {
  .hda-reveal {
    transition: none;
  }
}

.formResponsive .formSpan12 {
  width: 100%;
}
/* Rangées à 2 colonnes (≥ 768px) : un libellé sur 2 lignes (ex. « Nom de l'école/garderie/… »)
   décalait son champ par rapport à celui d'à côté. Grille + subgrid : les libellés d'une rangée
   partagent la même hauteur (alignés en bas), les champs démarrent donc à la même hauteur, même
   quand un message d'erreur s'affiche sous l'un d'eux. Sous 768px : colonne unique du gabarit. */
@media screen and (min-width: 768px) {
  .formResponsive .ccl-zform-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 20px;
  }
  .formResponsive .ccl-zform-split .formSpan6 {
    width: auto !important;
    display: grid;
    grid-row: span 2;
    grid-template-rows: subgrid;
  }
  .formResponsive .ccl-zform-split .formControlLabel {
    align-self: end;
  }
}
/* Sous 768px : une seule colonne (spécification cliente, champs à 100 %). La règle du gabarit
   (.rsform .formSpan6) dépend d'un conteneur .rsform absent sur /nous-joindre/ — les champs y
   restaient sur 2 colonnes de ~145px en mobile (trouvé en testant à 375px). */
@media screen and (max-width: 767px) {
  .formResponsive .formSpan6 {
    width: 100% !important;
  }
}
.formResponsive input[type=date] {
  font-family: var(--font-primary);
  font-size: var(--font-size-xs);
  color: var(--color-form);
  background-color: #fff;
  height: 35px;
  border: 2px solid var(--color-background-question-faq);
  border-radius: 20px;
  padding: 10px 10px;
  box-sizing: border-box;
}
.formResponsive input[type=file] {
  margin-top: 5px;
}
/* Widget anti-pourriel Turnstile (2026-09-30) : même espace au-dessus que entre les autres champs (20px).
   15px + les 5px laissés sous la zone Message (textarea en ligne) = 20px. */
.formResponsive .cf-turnstile {
  margin-top: 15px;
}
/* Messages d'erreur : masqués au départ, affichés par validation.js (style.display = 'block'). */
.ccl-zform-error {
  display: none;
  margin: 4px 0 0;
  color: #c0392b;
  font-size: var(--font-size-xs);
}
/* Cases à cocher (disponibilités) : case devant le texte (demande 2026-09-28). Chaque paire
   case + texte est un bloc inline-flex insécable : s'il n'entre pas au complet dans ce qui reste de
   la ligne, il passe entier à la ligne suivante (jamais une case d'un côté et son texte coupé de
   l'autre) ; plus large que la colonne, il ne dépasse pas (max-width) et seul son texte revient à
   la ligne, à droite de la case. Annule le width:100% que gtm-style.css donne à tous les input. */
.ccl-zform-choices {
  border: 0;
  margin: 20px 0 0 0;
  padding: 0;
  min-width: 0;
}
.ccl-zform-choices legend {
  padding: 0;
}
.ccl-zform-choices label {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  gap: 8px;
  cursor: pointer;
}
.formResponsive .ccl-zform-choices input[type=checkbox] {
  width: auto;
  margin: 0;
}

.mh-cc {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  display: flex;
  justify-content: center;
  padding: 1rem;
  pointer-events: none;
}
.mh-cc__box {
  max-width: 760px;
  width: 100%;
  background: #fff;
  color: #202020;
  border-radius: 10px;
  box-shadow: 0 12px 40px rgba(32, 32, 32, 0.22);
  padding: 1.25rem 1.4rem;
  font-family: var(--font-primary, 'lato-regular', sans-serif);
  pointer-events: auto;
  position: relative;
}
/* X de fermeture (2026-09-28) — même effet que Refuser (voir site.js). */
.mh-cc__close {
  appearance: none;
  position: absolute;
  top: 0.4rem;
  right: 0.4rem;
  width: 2.25rem;
  height: 2.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
  transition: color 0.2s ease-in-out;
}
.mh-cc__close:hover {
  color: var(--color-link-hover);
}
.mh-cc__close:focus-visible {
  outline: 3px solid currentColor;
  outline-offset: 2px;
}
.mh-cc__text {
  margin: 0 0 0.9rem;
  padding-right: 1.75rem;
  font-size: 0.95rem;
  line-height: 1.5;
}
.mh-cc__text a {
  color: var(--color-link);
  text-decoration: underline;
  font-weight: 700;
}
.mh-cc__text a:hover {
  color: var(--color-link-hover);
}
.mh-cc__cats[hidden] {
  display: none;
}
.mh-cc__cats {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  margin: 0 0 1rem;
  font-size: 0.92rem;
}
.mh-cc__cats label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
}
.mh-cc__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  justify-content: flex-end;
}
/* Couleurs des 3 boutons fixées explicitement en dur (pas les variables --color-button du thème,
   qui changent entre mode clair/sombre) : demande explicite du 2026-09-22 — les 3 boutons
   (Personnaliser/Refuser/Accepter) partagent le même fond #f1b322, sans contour, même survol
   #c3901b (qui correspondait déjà à --color-button-hover du site, gardé identique). */
.mh-cc__btn {
  appearance: none;
  border: none;
  background: #f1b322;
  color: #000; /* 2026-09-29 : texte noir (blanc sur jaune illisible, contraste 1,9) */
  font: inherit;
  font-weight: 700;
  font-size: 0.9rem;
  padding: var(--space-xs) var(--space-sm);
  border-radius: var(--border-radius-button);
  cursor: pointer;
  line-height: 1;
  transition: background 0.2s ease-in-out;
}
.mh-cc__btn:hover {
  background: #c3901b;
}
.mh-cc__btn--ghost {
  background: #f1b322;
  color: #000;
  border: none;
}
.mh-cc__btn--ghost:hover {
  background: #c3901b;
  color: #000;
}
.mh-cc__btn:focus-visible {
  outline: 3px solid #f1b322;
  outline-offset: 2px;
}
/* Mobile : texte plus petit, et boutons centrés à droite d'un coin libre de 70 px. Le bouton d'accessibilité
   (68 × 66 px, à 20 px du bas et de la gauche) couvre ainsi un coin vide du bandeau, ni texte ni bouton, et la
   hauteur minimale des boutons garde le texte au-dessus de lui, sans bande vide sous les boutons.
   Le X est flottant, à la même place : le texte ne le contourne que sur ses premières lignes, puis prend toute
   la largeur. */
@media screen and (max-width: 767px) {
  .mh-cc__close {
    position: static;
    float: right;
    margin: -0.85rem -1rem 0.25rem 0.5rem;
  }
  .mh-cc__text {
    font-size: 0.7rem;
    padding-right: 0;
  }
  .mh-cc__actions {
    justify-content: center;
    align-content: center;
    min-height: 40px;
    margin-left: 70px;
  }
  .mh-cc__btn {
    font-size: 0.7rem;
  }
}

/* Page /sitemap/ — mêmes deux règles (minimales) que le site en ligne ; le reste (liste à puces
   imbriquées) reprend les styles par défaut du navigateur, sans habillage Gestimark. */
#jmap_sitemap {
  overflow: hidden;
}
.jmapcolumn {
  float: left;
  width: 100%;
}
.jmapcolumn .jmap_filetree {
  margin-left: 0;
}

/* Boutons : TOUS jaunes (#F1B322, survol #c3901b) à texte NOIR, dans les 2 modes (demandes du
   2026-09-29 — blanc sur jaune illisible : contraste 1,9 ; noir sur jaune : 11,2). Le gabarit
   définit --color-button par thème (#282729 en clair → boutons readmore, btn-primary/secondary et
   « Soumettre » des formulaires étaient foncés) : on fixe les 3 variables pour tous les thèmes
   (même spécificité que les blocs [data-theme], placé après → l'emporte). a.gtm-btn-v1 est jaune
   par --color-link. Survol : le gabarit y met --color-light (blanc) → forcé en noir. « * » :
   .gtm-bg-2 * force du blanc sur tout descendant. */
:root,
[data-theme="light"],
[data-theme="dark"] {
  --color-button: #F1B322;
  --color-button-hover: #c3901b;
  --color-texte-button: #000;
}
a.gtm-btn-v1,
a.gtm-btn-v1:hover,
a.gtm-btn-v1 *,
.readmore a.btn:hover,
.btn.btn-primary:hover,
.btn.btn-secondary:hover,
.formResponsive button[type=submit]:hover,
.formResponsive button[type=reset]:hover,
.formResponsive input[type=submit]:hover,
.formResponsive input[type=reset]:hover {
  color: #000;
}

/* Widget d'accessibilité en mode sombre : panneau noir, texte blanc (demande du 2026-09-29).
   Le gabarit force un fond blanc (#fff) et des bordures noires au panneau et à ses blocs : on
   inverse les deux. La variante sombre du plugin (.ba__accessibility-dark-mode) n'est pas
   utilisée, elle garderait le fond blanc du gabarit. */
[data-theme="dark"] .ba__accessibility-container {
  --ba-acolor: #fff;
  background: #000;
  color: #fff;
  border-color: #fff;
}
[data-theme="dark"] .ba__accessibility-body > * {
  background: #000;
  border-color: #fff;
}

/* Images de héros et image du pied de page : coins carrés jusqu'à 1199px (demande du 2026-09-30).
   À partir de 1200px, les arrondis du gabarit restent inchangés. Le conteneur de l'image du pied
   de page (overflow: hidden + arrondi à droite) arrondirait l'image malgré tout : remis à 0 aussi. */
@media screen and (max-width: 1199px) {
  .gtm-hero-images img,
  .gtm-footer-4-img img,
  .gtm-footer-4-img .mod-custom {
    border-radius: 0;
  }
}

/* ===== Style du menu pied de page (extrait des pages sources) ===== */

    .gtm-menu-footer-container {
        display: flex;
        flex-direction: column;
    }
    .gtm-menu-footer-container a {
        font-size: 16px;
        font-family: var(--font-primary);
    }