/* ===== 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'),
          url('../fonts/opendyslexic/OpenDyslexic-Regular.woff') format('woff');
    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: 15px; right: auto;}
.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-primary);
  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;
  margin-top: var(--space-2xl);
  margin-bottom: var(--space-lg);
  padding-left: var(--space-lg);
  padding-right: var(--space-lg);
  position: relative;
}


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

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

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

@font-face {
  font-family: 'dancing-script';
  src: url('../fonts/DancingScript-SemiBold.woff2') format('woff2');
  font-display: swap;
}



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

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

:root {

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

  --font-primary: 'noto-regular', sans-serif;
  /* police principale */
  --font-primary-light: 'noto-light', sans-serif;
  /* police principale */
  --font-primary-bold: 'noto-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: 'dancing-script', sans-serif;
  /* police titre */


  /* 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 {

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

  --color-background-body: #000;

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

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

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

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

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

  --color-font: #F7DDAC;
  --color-light: #F7DDAC;
  --color-heading: #F7DDAC;
  --color-form: #000;

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

  --color-link: #FABC17;
  --color-link-hover: #F7DDAC;
  --color-link-visited: #FABC17;
  --color-link-light: whitesmoke;
  --color-link-hover: lightgrey;
  --color-link-visited: grey;

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

  --color-button: #FABC17;
  --color-button-hover: #F7DDAC;
  --color-texte-button: #000;

  /* Backgruond  ----------------- */

  --color-background-classic: ##000000;
  --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: #000;
  --color-background-sub-menu: lightgrey;
  --color-background-burger: black;
  --color-background-burger-line: whitesmoke;
  --color-menu-contact: #FABC17;
  --color-menu-texte-contact: #000;
  --color-menu-contact-hover: #F7DDAC;
  --color-menu-texte-contact-hover: #000;
  --color-link-menu: #FABC17;
  --color-link-menu-hover: #F7DDAC;
  --color-link-menu-active: #FABC17;
  --color-link-sub-menu: darkblue;
  --color-link-sub-menu-hover: purple;
  --color-link-sub-menu-active: darkcyan;

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

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

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

  --color-background-copyright: grey;

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

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

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

label.switch {
    display: none;
}

/* --------------------------------------------------
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: 1000;
}

.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; */

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

/* --color-font: #000;
  --color-light: white;
  --color-heading: #000000; */

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

/* --color-link: blue;
  --color-link-hover: red;
  --color-link-visited: green;
  --color-link-light: whitesmoke;
  --color-link-hover: lightgrey;
  --color-link-visited: grey; */

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

/* --color-button: #000000;
  --color-button-hover: grey;
  --color-texte-button: #ffffff; */

/* Backgruond  ----------------- */

/* --color-background-classic: #eae58a;
  --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: #000;
  --color-background-sub-menu: lightgrey;
  --color-background-burger: black;
  --color-background-burger-line: whitesmoke;
  --color-menu-contact: black;
  --color-menu-texte-contact: whitesmoke;
  --color-menu-contact-hover: grey;
  --color-link-menu: black;
  --color-link-menu-hover: lightgreen;
  --color-link-menu-active: lightgreen;
  --color-link-sub-menu: darkblue;
  --color-link-sub-menu-hover: purple;
  --color-link-sub-menu-active: darkcyan; */

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

/* --color-background-question-faq: #202020;
  --color-background-reponse-faq: whitesmoke;
  --color-texte-question-faq: whitesmoke;
  --color-texte-reponse-faq: #202020;
 */
/* Copyright  ----------------- */

/* --color-background-copyright: grey; */

/* } */



/* [data-theme="dark"] { */

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

/* --color-background-body: #000; */

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

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

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

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

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

/* --color-font: whitesmoke;
  --color-heading: whitesmoke; */

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

/* --color-link: lightblue;
  --color-link-hover: pink;
  --color-link-visited: lightgreen; */

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

/* --color-button: #ffffff;
  --color-button-hover: lightgrey;
  --color-texte-button: #000000; */

/* Backgruond  ----------------- */

/* --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: #000;
  --color-background-sub-menu: #3d3d3d;
  --color-background-burger: #646464;
  --color-background-burger-line: whitesmoke;
  --color-menu-contact: whitesmoke;
  --color-menu-texte-contact: #202020;
  --color-menu-contact-hover: grey;
  --color-link-menu: white;
  --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: #535353;
  --color-background-reponse-faq: whitesmoke;
  --color-texte-question-faq: whitesmoke;
  --color-texte-reponse-faq: #202020; */

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

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

/* } */

/* [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;
    margin-bottom: var(--space-4xl);
}

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

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

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

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

h1 {
  font-size: var(--font-size-3xl);
  margin: 0 0 var(--space-md) 0;
  font-family: var(--font-primary);
  color: var(--color-heading);

  /* Gestion des mots longs */
  /* word-wrap: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto; */
}

h2 {
  font-size: var(--font-size-4xl);
  font-family: var(--font-primary);
  color: var(--color-heading);
  margin-bottom: var(--space-md);

  /* Gestion des mots longs */
  /* word-wrap: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto; */
}

h3 {
  font-size: var(--font-size-3xl);
  font-family: var(--font-primary);
  color: var(--color-heading);
  margin-bottom: var(--space-sm);

  /* Gestion des mots longs */
  /* word-wrap: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto; */
}

h4 {
  font-size: var(--font-size-xl);
  font-family: var(--font-primary);
  color: var(--color-heading-secondary);
  margin-bottom: var(--space-sm);

  /* Gestion des mots longs */
  /* word-wrap: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto; */
}

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

  /* Gestion des mots longs */
  /* word-wrap: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto; */
}

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

  /* Gestion des mots longs */
  /* word-wrap: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto; */
}

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

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

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

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

/* Boutons de filtre des tags de la page Produits */

.gtm-filtres-produits li {
  display: inline-block;
  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) !important;
  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;
}

.gtm-filtres-produits li:hover {
  color: var(--color-texte-button);
  background-color: var(--color-button-hover);
}

.gtm-filtres-produits a {
  color: var(--color-texte-button);
}

li.list-group-item.list-group-item-action a {
  color: red;
}

/* 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-md);
  margin-bottom: var(--space-sm);
  font-size: var(--font-size-base);
}

ul li,
ol li {
  margin-bottom: var(--space-xs);
  text-align: left;
  color: var(--color-font) !important;
}

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

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

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

/* Permet de changer la couleur du texte selon la couleur du background */
/* 
.gtm-bg-1 * {
  color: var(--color-light);
} 

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

.gtm-bg-3 * {
  color: var(--color-light);
} 
*/

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

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

.gtm-anim-1.visible {
  opacity: 1;
}

/* Fade In Up */
.gtm-anim-2 {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.5s ease-out, transform 0.5s 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.5s ease-out, transform 0.5s ease-out;
}

.gtm-anim-3.visible {
  opacity: 1;
  transform: scale(1);
}

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

.gtm-formulaire.gtm-form-contact {
  margin-top: var(--space-2xl);
}

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

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



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

.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: 30px;
  height: 40px;
  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: contain;
  background-color: transparent !important;
  order: 999999;
  -webkit-animation: cookie 0.4ss .8s both;
  animation: cookie 0.4s .8s both;
  transition: background-image 0.3s ease;
}

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

/* 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-texte-button) !important;
}

/* lien politique de confidentialité et catégories de cookies */
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
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

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

#jmap_sitemap {
  margin-top: 30px;
}

@media screen and (min-width: 576px) { 
  #jmap_sitemap {
    margin-top: 40px;
  }
}

@media screen and (min-width: 992px) { 
  #jmap_sitemap {
    margin-top: 90px;
  }
}

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

.ba__accessibility>.ba__accessibility-action-button {
  background: var(--color-button-hover);
  color: #000;
}

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

.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: var(--space-xs);
  left: var(--space-xs);
  /* padding: var(--space-sm); */
  background-color: var(--color-background-menu);
  transition: top .2s ease-in-out;
  border-radius: 50%;
}

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

.gtm-logo-header a {
  margin-bottom: 0;
  width: 110px;
  height: 100px;
  background: #000;
  border-radius: 50%;
  position: relative;
}

.gtm-logo-header img {
  max-width: 160px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100px;
}

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

@media screen and (min-width: 576px) {
  .gtm-logo-header a {
      width: 110px;
      height: 110px;
  }

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

@media screen and (min-width: 992px) {
  .gtm-logo-header a {
      width: 170px;
      height: 170px;
  }

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

  .gtm-hero-2 h1 {
    margin-top: 0;
  }
}

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

  .gtm-logo-header a {
      width: 190px;
      height: 190px;
  }

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

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


}

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

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

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

.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: var(--space-lg);
}

.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(3, 1fr);
  grid-template-rows: auto;
  grid-column-gap: var(--space-lg);
  grid-row-gap: var(--space-lg);
}

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

@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%;
  }

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

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

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


/* 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;
  margin-top: var(--space-2xl);
  /* 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: var(--space-3xl) 0 0;
}

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

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

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

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

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

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

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

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

/* 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-slogan);
  margin-bottom: var(--space-md);
}

/* --------------------------------------------------
GROUPE TEXTE – MOBILE / TABLETTE (<1200px)
Descend depuis le haut + chevauche image
-------------------------------------------------- */
.gtm-hero-4 .gtm-texte-groupe {
  position: relative;
  z-index: 2;
  /* au-dessus de l'image */
  padding: var(--space-lg);
  background-color: var(--color-background-classic);
  max-width: 90%;
  margin: auto;

  opacity: 0;
  animation: fadeDownGroup 0.6s forwards;
  animation-delay: 0.1s;

  /* ombre subtile */
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08);
}

/* Images */
.gtm-hero-4 .gtm-hero-images {
  position: relative;
  z-index: 1;
  /* en dessous du texte */
  width: 100%;
  height: 35dvh;
  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;
}

/* 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;
}

.gtm-hero-4 .gtm-slogan {
  animation-delay: 0.9s;
}

.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: 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;

    /* supprime chevauchement et ombre desktop */
    box-shadow: none;
  }

  .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(40px);
    /* position finale au-dessus de l'image */
  }
}

/* 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: 40dvh;
}

.gtm-hero-light .gtm-hero-texte-content {
  position: relative;
  z-index: 2;
  padding: var(--space-5xl) 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;
}

#nos-experiences .gtm-hero-light .gtm-hero-images img {
  object-position: 50% 16%;
}

#faq .gtm-hero-light .gtm-hero-images img {
  object-position: 50% 23%;
}

.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-xl) var(--space-md) 0;
}

/* 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-md);
  margin-bottom: var(--space-2xl);
}

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


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

@media (min-width: 1200px) {
  .gtm-appel-action>div {
    margin-bottom: 0;
  }
}

/* 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%;
  }

  .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-alert {
  padding-top: 30px;
}



/* 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, auto);
}

.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 */
}

.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;
  top: 13%;
}

.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 {
  width: 75%;
}

.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.2);
  z-index: 1;
}

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

@media (max-width: 900px) {
  .gtm-appel-action.gtm-nb-btn-3 {
    grid-template-columns: repeat(2, 1fr);
  }
}


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

.gtm-article-introduction,
.gtm-article-section,
.gtm-article-description {
  margin-bottom: var(--space-4xl);
}

.gtm-appel-action {
  margin-bottom: var(--space-xs);
}

.gtm-container-footer {
  margin-bottom: var(--space-lg);
}

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

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

.mod-articlesnews__item {
  margin: 0 auto var(--space-4xl);
}

#faq .mod-articlesnews__item {
  margin: 0 auto var(--space-sm);
}

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

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

/* .gtm-blog-col {
  padding-bottom: var(--space-2xl);
} */

.mod-articlesnews__item figure {
  max-width: 400px;
  margin: 0 auto var(--space-lg);
}

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

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


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

  .gtm-blog-ligne,
  .gtm-blog-col {
    max-width: 80%;
    margin: auto;
  }

  /* 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
-------------------------------------------------- */

.gtm-intro-service-1 {
  margin-bottom: var(--space-xl);
}


.gtm-dev-service-1 {
  display: flex;
  justify-content: center;
  flex-direction: column-reverse;
  gap: var(--space-md);
  padding-bottom: var(--space-xl);
}

.gtm-texte-service-2 {
  margin-bottom: var(--space-lg);
}

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

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

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

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

.gtm-intro-membre {
  padding-bottom: var(--space-xl);
}

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

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

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

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

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

.gtm-intro-soutenir,
.gtm-dons-intro-soutenir {
  padding-bottom: var(--space-xl);
}

.gtm-dev-soutenir,
.gtm-dons-dev-soutenir {
  display: flex;
  justify-content: center;
  flex-direction: column-reverse;
  gap: var(--space-md);
  padding-bottom: var(--space-xl);
}

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

  .gtm-dev-soutenir,
  .gtm-dons-dev-soutenir {
    flex-direction: row;
  }

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

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


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


.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;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  transition: box-shadow 0.3s ease;
}

.faq-item:hover {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

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

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

/* Style de l'icône + */
.faq-icon {
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-texte-question-faq);
  font-size: 1.5em;
  font-weight: bold;
  transition: transform 0.3s ease;
  flex-shrink: 0;
  margin-left: var(--space-xs);
}

/* Rotation de l'icône quand ouvert */
.faq-item[aria-expanded="true"] .faq-icon {
  transform: rotate(45deg);
}

/* 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;
  background: var(--color-background-reponse-faq);
  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 {
    grid-column-gap: var(--space-md);
  }

  .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: 100dvh;
  overflow: hidden;
  position: relative;
}

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

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


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


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

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

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

@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
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* .com-content-article.item-page {
  margin-top: var(--space-5xl);
} */

#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-background-menu);
}

.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 {
  color: var(--color-link-menu-active);
}

/* 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;
}

/* Icône "+" : lignes horizontale et verticale */
.gtm-menu-item-has-children .separator::before,
.gtm-menu-item-has-children .separator::after {
  content: "";
  position: absolute;
  width: 10px;
  height: 1.5px;
  background-color: var(--color-link-menu);
  transition: all .3s ease;
}

/* Ligne verticale (avant) */
.gtm-menu-item-has-children .separator::before {
  top: 48%;
  right: -15px;
  transform: translateY(48%) rotate(-90deg);
}

/* Ligne horizontale */
.gtm-menu-item-has-children .separator::after {
  top: 48%;
  right: -15px;
  transform: translateY(48%);
}

/* Icône "+" transformée en "-" (lorsqu'actif) */
.gtm-menu-item-has-children.gtm-active .separator::before {
  transform: rotate(0deg);
}

/* Changement de couleur lorsqu'actif */
.gtm-menu-item-has-children.gtm-sous-menu-actif .separator::after,
.gtm-menu-item-has-children.gtm-sous-menu-actif .separator::before {
  background-color: var(--color-link-menu-active);
}

/* Pour les cas actifs supplémentaires */
.gtm-menu-item-has-children.gtm-sous-menu-actif .separator::after,
.gtm-menu-item-has-children.gtm-sous-menu-actif .separator::before {
  background-color: var(--color-link-menu-active);
}


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

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

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

  .menu .menu-item a,
  span.mod-menu__separator.separator {
    font-size: var(--font-size-4xl);
  }

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


  /* 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: -35px;
  }

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

/* 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: 80px;
    column-gap: 20px;
    list-style: none;
    margin: 0px;
    padding: 0 var(--space-sm);
    background-color: var(--color-background-menu);
    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);
    color: var(--color-link-menu);
    font-size: var(--font-size-sm);
    text-decoration: none;
    transition: color 0.2s ease-in-out;
  }

  .menu .menu-item>a:hover,
  .menu .menu-item>span:hover {
    color: var(--color-link-menu-hover);
  }

  .menu .menu-item.current>a,
  .menu-item.gtm-sous-menu-actif>a,
  .menu .menu-item.gtm-sous-menu-actif>span {
    color: var(--color-link-menu-active);
  }

  .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-menu-contact-hover);
    color: var(--color-menu-texte-contact-hover);
  }

  .gtm-menu-bouton>li:last-child a {
    color: var(--color-menu-texte-contact) !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;
    padding-right: var(--space-sm);
  }

  .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-menu);
    padding: var(--space-sm);
    opacity: 0;
    visibility: hidden;
    list-style: none;
    text-align: left;
    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;
}

.gtm-menu-footer-container a {
  color: var(--color-link);
}

.gtm-menu-footer-container a:hover {
  color: var(--color-link-hover);
}

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

/* #endregion */

/* ===== Additions Gestimark — site statique hidalgoexperience.com ===== */

/* h2 trop grand sur très petit mobile (retour client 2026-09-22) : --font-size-4xl est un clamp()
   dont le plancher (1.875rem = 41,25px, --font-size en base 22px — voir gtm-style.css) déborde du
   conteneur à 320px de large pour un titre contenant un mot long ("gastronomique") : mesuré et
   vérifié au navigateur, "gastronomique" (H2 "Vivez une expérience gastronomique péruvienne
   unique" de l'accueil) déborde dès 34px, tient à partir de 33px. Plancher réduit à 1.4rem
   (30,8px, marge de sécurité) pour ce point de rupture seulement — desktop/tablette inchangés. */
@media (max-width: 575px) {
  h2 {
    font-size: clamp(1.4rem, 1rem + 3vw, 1.875rem);
  }
}

@font-face {
  font-family: 'noto-bold';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/NotoSans-Bold.woff2') format('woff2');
  font-display: swap;
}

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

.hda-form-todo {
  background: #fff3cd;
  border: 1px solid #ffe69c;
  color: #664d03;
  padding: 0.75em 1em;
  margin-bottom: 1em;
  border-radius: 4px;
  font-size: var(--font-size-sm, 0.9rem);
}

.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, "noto-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: #202020;
  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 var(--color-button);
  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;
  /* Le gabarit met TOUS les liens en display:inline-block + margin-bottom (règle `a` de
     gtm-style.css) : sur petit mobile, le lien passait à la ligne en bloc et le point final de la
     phrase se retrouvait seul sur la ligne suivante (corrigé 2026-09-30). */
  display: inline;
  margin: 0;
}
.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;
}
/* Bouton principal : mêmes variables que a.gtm-btn-v1 (bouton réel du gabarit) — voir
   gtm-style.css. */
.mh-cc__btn {
  appearance: none;
  border: 1px solid var(--color-button);
  background: var(--color-button);
  color: var(--color-texte-button);
  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, color 0.2s ease-in-out;
}
.mh-cc__btn:hover {
  background: var(--color-button-hover);
  border-color: var(--color-button-hover);
}
/* Boutons secondaires (Personnaliser/Refuser) : traités en lien de style du gabarit (bordure +
   couleur de lien réelle) plutôt qu'en gris neutre inventé. */
.mh-cc__btn--ghost {
  background: transparent;
  color: var(--color-link);
  border-color: var(--color-link);
}
.mh-cc__btn--ghost:hover {
  background: var(--color-link);
  color: var(--color-texte-button);
  border-color: var(--color-link);
}
.mh-cc__btn:focus-visible {
  outline: 3px solid var(--color-button);
  outline-offset: 2px;
}

/* 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;
}
/* Puces coupées (corrigé 2026-09-30) : #jmap_sitemap est en overflow:hidden et les puces sont
   dessinées À GAUCHE de chaque ligne, hors de sa boîte. Premier niveau (titres de catégorie) :
   marge 0, puce entièrement hors cadre — donc jamais visible, déclarée sans puce. Second niveau :
   la marge du gabarit (--space-md) était plus étroite que la puce, rognée à gauche — élargie. */
.jmapcolumn .jmap_filetree > li {
  list-style: none;
}
.jmapcolumn .jmap_filetree ul {
  margin-left: 1.5em;
}
/* Lien sur 2 lignes (mobile) : les liens du gabarit sont en inline-block, la puce s'alignait sur
   la DERNIÈRE ligne du lien — ramenée sur la première. */
.jmapcolumn .jmap_filetree li a {
  vertical-align: top;
}

/* Pages /oups/ et /merci/ — image de droite injectée par un <style> propre à chaque page sous
   Joomla (module HTML personnalisé ciblé par son id précis — un identifiant Joomla interne, pas
   une convention Gestimark, mais gardé tel quel : c'est le seul endroit où chacun apparaît, un id
   stable et suffisant pour ces règles). */
#mod-custom198 {
  background-image: url('../img/hidalgo-oups.jpg');
}
#mod-custom195 {
  background-image: url('../img/merci.jpg');
}

.hda-hidden {
  display: none;
}
.hda-contact-form {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  margin: 0;
  padding: 0;
  font-family: var(--font-primary);
  color: var(--color-font);
}
.hda-contact-form__row {
  display: flex;
  gap: var(--space-sm);
}
.hda-contact-form__row > * {
  flex: 1 1 0;
  min-width: 0;
}
.hda-contact-form__field {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin: 0;
  padding: 0;
}
.hda-contact-form__label {
  font-size: var(--font-size-md);
}
.hda-contact-form__required {
  color: var(--color-font);
  font-style: normal;
}
.hda-contact-form input[type="text"],
.hda-contact-form textarea {
  display: block;
  width: 100%;
  box-sizing: border-box;
  margin: 0;
  padding: 0.6em 0.75em;
  border: 0;
  border-radius: 0;
  background: #fff;
  color: #202020;
  font: inherit;
  font-size: var(--font-size-md);
}
.hda-contact-form textarea {
  min-height: 8em;
  resize: vertical;
}
.hda-contact-form input:focus,
.hda-contact-form textarea:focus {
  outline: 3px solid var(--color-link);
  outline-offset: 0;
}
.hda-contact-form__error {
  margin: 0;
  color: var(--color-secondary);
  font-size: var(--font-size-sm);
}
.hda-contact-form__submit {
  appearance: none;
  width: 100%;
  margin: 0;
  padding: var(--space-sm);
  border: 0;
  border-radius: var(--border-radius-button);
  background: var(--color-button);
  color: var(--color-texte-button);
  font: inherit;
  font-size: var(--font-size-md);
  cursor: pointer;
  transition: background-color .2s ease-in-out;
}
.hda-contact-form__submit:hover,
.hda-contact-form__submit:focus-visible {
  background: var(--color-button-hover);
}
/* Une seule colonne sur mobile (Prénom/Nom, Courriel/Téléphone empilés) — demande de la cliente
   du 2026-09-22, reconduite. */
@media (max-width: 575px) {
  .hda-contact-form__row {
    flex-direction: column;
  }
}

.ba__accessibility .ba__accessibility-dark-mode-button {
  display: none !important;
}

/* Défilement latéral sur petits téléphones (< 375px) — corrigé le 2026-09-29. 3 causes mesurées à
   320px (toutes les autres largeurs testées étaient déjà sans débordement) :
   1) accueil : le mot le plus long du h1 du héros (« gastronomique », 238px) + le padding
      var(--space-xl) des deux côtés (2 × 44px) = boîte de 326px, plus large que l'écran ; */
@media (max-width: 374px) {
  .gtm-hero-2 .gtm-hero-texte-content {
    padding-left: var(--space-md);
    padding-right: var(--space-md);
  }
}
/* 2) adresse courriel en gros caractères (page Ateliers, 22px) : un seul « mot » insécable, plus
      large que la colonne — coupure autorisée seulement si elle ne tient pas ; */
a[href^="mailto:"] {
  overflow-wrap: anywhere;
}
.cf-turnstile {
  container-type: inline-size;
}
@container (max-width: 299px) {
  .cf-turnstile > div {
    transform: scale(0.9);
    transform-origin: left top;
  }
}
@container (max-width: 269px) {
  .cf-turnstile > div {
    transform: scale(0.8);
  }
}
@container (max-width: 239px) {
  .cf-turnstile > div {
    transform: scale(0.75);
  }
}


/* Logo de l'en-tête (corrigé 2026-09-30) : l'image est un rectangle à fond noir (500×303) posé
   dans un rond noir. Sous 576px, le rond était un ovale de 110×100px et l'image faisait 100px de
   large : sa diagonale (117px) dépassait, les 4 coins sortaient du rond. Rond remis à 110×110px et
   image à 94px (mêmes valeurs que le palier 576px du gabarit, diagonale 110px) ; overflow:hidden
   sur le rond en garde-fou à toutes les largeurs (les coins de l'image sont du noir uni). */
/* Fond du logo remis rond (2026-09-30) : sous 1200px, le conteneur porte lui aussi un fond noir
   arrondi à 50 % ; le lien en inline-block y laissait ~6,5px d'espace de ligne sous le rond →
   conteneur plus haut que large (170×176,5), donc fond ovale qui dépassait sous le rond.
   Lien en bloc : conteneur = rond exact. */
.gtm-logo-header a {
  display: block;
  overflow: hidden;
}
@media screen and (max-width: 575px) {
  .gtm-logo-header a {
    height: 110px;
  }
  .gtm-logo-header img {
    width: 94px;
  }
}

/* Nous joindre — espace entre les coordonnées et le formulaire (2026-09-30, demande utilisateur) :
   les 2 colonnes se touchaient (0px) dès 768px ; sur mobile, l'écart passe de --space-2xl à --space-3xl. */
@media screen and (max-width: 767.98px) {
  .gtm-formulaire.gtm-form-contact {
    margin-top: var(--space-3xl);
  }
}
@media screen and (min-width: 768px) {
  .moduletable.gtm-form.gtm-tablette-6 {
    padding-left: var(--space-xl);
  }
}

.menu .menu-item.current > a,
.menu .menu-item.hda-menu-parent-actif > a,
.menu .menu-item:has(.current) > span,
.menu .menu-item.gtm-sous-menu-actif > span {
  color: var(--color-link-menu-hover);
}
@media screen and (min-width: 1200px) {
  .gtm-sub-menu .menu-item.current > a {
    color: var(--color-link-sub-menu-hover);
  }
  .gtm-menu-bouton > li.current:last-child {
    background-color: var(--color-menu-contact-hover);
  }
  .gtm-menu-bouton > li.current:last-child > a {
    color: var(--color-menu-texte-contact-hover);
  }
}

.hda-anim-entree {
  animation: hda-entree 0.5s ease-out 0.3s backwards;
}
@keyframes hda-entree {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
}
@media (prefers-reduced-motion: reduce) {
  .hda-anim-entree {
    animation: none;
  }
}

/* Accordéon : pas de marge sous le titre de la question, pour le même espace au-dessus et
   au-dessous du texte dans le bouton (demande utilisateur 2026-09-30). */
.faq-item h3 {
  margin-bottom: 0;
}

/* Bandeau de témoins sur mobile (2026-10-01) : plus compact (base de police du gabarit : 22px), boutons
   centrés, X flottant (le texte ne le contourne que sur ses premières lignes). Les 56px à gauche des
   boutons laissent libre le coin du bouton d'accessibilité flottant (68 × 66px, à 15px du bas et de la
   gauche) sans bande vide sous les boutons. Mesuré à 320px : bandeau à 36 % de la hauteur, 0 chevauchement. */
@media screen and (max-width: 767px) {
  .mh-cc__box {
    padding: 0.75rem 0.9rem;
  }
  .mh-cc__close {
    position: static;
    float: right;
    width: 1.8rem;
    height: 1.8rem;
    margin: -0.55rem -0.6rem 0.2rem 0.4rem;
    font-size: 1.3rem;
  }
  .mh-cc__text {
    font-size: 0.62rem;
    margin-bottom: 0.6rem;
    padding-right: 0;
  }
  .mh-cc__actions {
    justify-content: center;
    align-content: center;
    gap: 0.4rem;
    min-height: 40px;
    margin-left: 56px;
  }
  .mh-cc__btn {
    font-size: 0.62rem;
    padding: 0.45rem 0.7rem;
  }
}

/* Merci et Oups : le titre principal est un h1, avec exactement le style des h2 (2026-10-01). */
.gtm-texte-merci h1 {
  font-size: var(--font-size-4xl);
  font-family: var(--font-primary);
  margin: 0 0 var(--space-md) 0;
}
@media (max-width: 575px) {
  .gtm-texte-merci h1 {
    font-size: clamp(1.4rem, 1rem + 3vw, 1.875rem);
  }
}


/* ===== 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);
    }
    
/* Revue du 6 octobre 2026, P22 — niveaux de titre corrigés (hiérarchie H1 > H2 > H3 continue sur Nos produits
   et Nous joindre) : la balise change, l'apparence reste exactement celle de l'ancien niveau. */
h2.gtm-niveau-h3 { font-size: var(--font-size-3xl); margin-bottom: var(--space-sm); }
h3.gtm-niveau-h4 { font-size: var(--font-size-xl); color: var(--color-heading-secondary); margin-bottom: var(--space-sm); }
/* P22 — dimensions width/height ajoutées aux images (la page ne « saute » plus au chargement) : la hauteur reste
   calculée d'après la largeur, comme avant. :where() = priorité nulle, toute règle existante l'emporte. */
:where(img[width][height]) { height: auto; }