.gtm-hidden {
  display: none;
}

/* ----------------------------------------------------------------------------
ARRIERE PLAN
------------------------------------------------------------------------------ */

body {
  background: 
    linear-gradient(0deg, rgba(247,240,226,.7), rgba(247,240,226,.7)),
    url("data:image/svg+xml;utf8,<svg viewBox='0 0 300 300' xmlns='http://www.w3.org/2000/svg'><filter id='noiseFilter'><feTurbulence type='fractalNoise' baseFrequency='0.5' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23noiseFilter)'/></svg>");
  background-repeat: repeat;
  background-size: 300px 300px;
  overflow-x: hidden;
  }

  
/* ----------------------------------------------------------------------------
LOGO
------------------------------------------------------------------------------ */

.gtm-logo-hero {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1;
}

.gtm-logo-hero .gtm-custom {
  padding-top: 0px;
}

.gtm-logo-hero .gtm-custom img {
  width: 180px;
  background: 
    linear-gradient(0deg, rgba(247,240,226,.8), rgba(247,240,226,.8)),
    url("data:image/svg+xml;utf8,<svg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'><filter id='noiseFilter'><feTurbulence type='fractalNoise' baseFrequency='0.5' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23noiseFilter)'/></svg>");
  background-repeat: repeat;
  background-size: 400px 400px;
  padding: 20px 20px 15px 40px;
  border-bottom-right-radius: 20px;
}



/* ----------------------------------------------------------------------------
HERO
------------------------------------------------------------------------------ */

.gtm-box-hero {
  padding: 40px 20px !important;
}

.gtm-box-hero .gtm-custom {
  border-radius: var(--border-radius);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 65svh;
  position: relative;
}

.gtm-box-hero.gtm-hero-jase .gtm-custom {
  background-position: top center;
}

.gtm-box-hero.gtm-hero-jase.gtm-hero-center .gtm-custom {
  background-position: center center;
}

.gtm-box-hero .gtm-custom::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(0deg, rgba(247,240,226,.7), rgba(247,240,226,0));
  border-radius: var(--border-radius);
}

.gtm-box-hero .gtm-custom h2 {
  position: absolute;
  left: 50%;
  bottom: 0px;
  transform: translate(-50%, 50%);
  font-size: clamp(4rem, 12.5vw, 29.5rem);
  letter-spacing: 1vw;
  line-height: 1;
  width: 100%;
  text-align: center;
}

.gtm-box-hero .gtm-custom .gtm-baseline-hero {
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 30vw;
  min-width: 155px;
  transform: translate(-20%, 85%);
}


/* ----------------------------------------------------------------------------
IMAGE BOTTOM
------------------------------------------------------------------------------ */

.gtm-img-bottom {
  align-self: flex-end;
  transform: translateY(8vw);
}

.gtm-marge-img-bottom {
  margin-bottom: 8vw;
}

/* ----------------------------------------------------------------------------
IMAGE TOP
------------------------------------------------------------------------------ */

.gtm-img-top {
  transform: translateY(-12vw);
}

.gtm-img-top {
  margin-bottom: -12vw;
}

/* ----------------------------------------------------------------------------
SECTION DARK
------------------------------------------------------------------------------ */

.gtm-box-section-dark {
  color: var(--color-text-light);
  background-color: var(--color-primary); /* Couleur de fond */
  background-image: url('/images/serpentin.svg'); /* Texture SVG */
  background-repeat: no-repeat; /* Répète la texture si besoin */
  background-size: cover; /* ou contain, cover, ou une taille fixe comme 100px */
  background-position: center;
}

.gtm-box-section-dark h2, .gtm-box-section-dark h3, .gtm-box-section-dark h4, .gtm-box-section-dark h5, .gtm-box-section-dark h6, .gtm-box-section-dark p {
  color: var(--color-text-light);
}

.gtm-section-dark {
  display: flex;
  flex-direction: column-reverse;
  justify-content: space-around;
  align-items: center;
  gap: 80px;
  position: relative;
}


.label-dark-mode {
  visibility: hidden;
  display: none;
}

.gtm-small-text {
  max-width: 80%;
  margin: auto;
}

.gtm-section-dark div.gtm-img-top {
  width: 65%;
}

/* ------------- Formulaires -------------- */

.gtm-box-section-dark .formResponsive input[type=email], .formResponsive input[type=number], .formResponsive input[type=password], .formResponsive input[type=tel], .formResponsive input[type=text], .formResponsive input[type=url], .formResponsive textarea {
  background-color: transparent;
  margin-top: 5px;
  border: 1px solid var(--color-text-light) !important;
  color: var(--color-text-light);
}

.formResponsive input[type=email]:focus, .formResponsive input[type=number]:focus, .formResponsive input[type=password]:focus, .formResponsive input[type=tel]:focus, .formResponsive input[type=text]:focus, .formResponsive input[type=url]:focus, .formResponsive textarea:focus {
  outline: 2px solid var(--color-text-light) !important;
}

@media screen and (max-width: 1200px) {
  .gtm-form-dark.formResponsive {
  margin-bottom: 70px;
}
}


/* formulaire faire partie de notre monde */ 

.gtm-section-dark-form .gtm-texte-section-dark {
  max-width: 80%;
  margin: auto;
}

.gtm-form-partie-monde p {
  color: var(--color-text-light);
}

.gtm-form-partie-monde .rsform-type-checkboxgroup .formBody #roles0-lbl, .gtm-form-partie-monde .rsform-type-checkboxgroup .formBody #roles1-lbl, .gtm-form-partie-monde .rsform-type-checkboxgroup .formBody #roles2-lbl {
  display: flex;
  flex-wrap: wrap; /* permet le retour à la ligne */
  align-items: center;
  gap: 1rem; /* espace entre les éléments, optionnel */
}

.gtm-form-partie-monde .rsform-type-checkboxgroup .formBody #roles0-lbl input, .gtm-form-partie-monde .rsform-type-checkboxgroup .formBody #roles1-lbl input, .gtm-form-partie-monde .rsform-type-checkboxgroup .formBody #roles2-lbl input {
  flex: 0 0 auto; /* ou width: 50%; */
  height: 20px;
  width: 20px;
}

.gtm-form-partie-monde .rsform-type-checkboxgroup .formBody #roles0-lbl h4, .gtm-form-partie-monde .rsform-type-checkboxgroup .formBody #roles1-lbl h4, .gtm-form-partie-monde .rsform-type-checkboxgroup .formBody #roles2-lbl h4 {
  flex: 0 0 auto; /* ou width: 50%; */
  margin-bottom: 0px;
}

.gtm-form-partie-monde .rsform-type-checkboxgroup .formBody #roles0-lbl p, .gtm-form-partie-monde .rsform-type-checkboxgroup .formBody #roles1-lbl p, .gtm-form-partie-monde .rsform-type-checkboxgroup .formBody #roles2-lbl p {
  flex: 0 0 100%; /* prend toute la ligne */
}

/* ----------- flèche ------------ */

.gtm-fleche {
  max-width: 40px;
  margin: auto;
}


/* ----------------------------------------------------------------------------
Texte Bottom
------------------------------------------------------------------------------ */

.gtm-text-bottom {
  align-self: flex-end;
  transform: translateY(10vw);
}

.gtm-marge-text-bottom {
  margin-bottom: 10vw;
}

/* ----------------------------------------------------------------------------
Section centrée
------------------------------------------------------------------------------ */

.gtm-section-centree .gtm-box-section-centree {
  text-align: center;
  max-width: 800px;
  margin: auto;
}

/* ----------------------------------------------------------------------------
Correction d'affichage mobile
------------------------------------------------------------------------------ */

.gtm-small-text-mob {
  max-width: 80%;
  margin: auto;
}


/* ----------------------------------------------------------------------------
APPELS À L'ACTION
------------------------------------------------------------------------------ */

.gtm-box-titre-action {
  margin-top: 3vw;
}

.gtm-box-titre-action h2 {
  margin-bottom: 0px;
  text-align: right;
}

.gtm-content-action {
  position: relative;
}

.gtm-content-action h2 a {
  position: absolute;
  bottom: 0px;
  width: 100%;
  color: var(--color-text-light);
  font-size: var(--font-size-heading);
  margin: 0;
  z-index: 2;
  background: #2A2B1D;
  background: linear-gradient(180deg, rgba(42, 43, 29, 0) 0%, rgba(42, 43, 29, 1) 100%);
}

 .gtm-img-left .gtm-content-action h2 a {
  text-align: right;
  border-bottom-right-radius: 30px;
  padding: 30px 20px 10px 10px;
}

.gtm-img-right .gtm-content-action h2 a {
  text-align: left;
  border-bottom-left-radius: 30px;
  padding: 30px 10px 10px 20px;
}


.gtm-content-action .gtm-lien-img {
  display: block;
  line-height: 0;
}


.gtm-img-left .gtm-content-action img {
  border-top-right-radius: 30px;
  border-bottom-right-radius: 30px;
}

.gtm-img-right .gtm-content-action img {
  border-top-left-radius: 30px;
  border-bottom-left-radius: 30px;
}

/* ----------------------------------------------------------------------------
On jase
------------------------------------------------------------------------------ */

.gtm-horaires {
  display: flex;
  flex-wrap: wrap;
  gap: 25px;
}


/* ----------------------------------------------------------------------------
FOOTER
------------------------------------------------------------------------------ */

.gtm-content-footer {
  background-color: #2a2b1d;
  color: var(--color-text-light);
  border-top: 4px solid var(--color-text-light);
  overflow-y: hidden;
  margin-top: 5vw;
  padding-top: 3vw;
  padding-bottom: 0px;
}

.gtm-content-footer p {
  color: var(--color-text-light);
}


.gtm-content-footer .gtm-custom  {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(3, auto);
  grid-column-gap: 20px;
  grid-row-gap: 0px;
}
  
.gtm-baseline-footer { 
  grid-area: 1 / 1 / 2 / 3; 
  display: flex;
  flex-direction: column;
}
.gtm-footer-coordonnees { grid-area: 2 / 1 / 3 / 2; }
.gtm-horaire-suivre { grid-area: 2 / 2 / 3 / 3; }
.gtm-lettres-shad { grid-area: 3 / 1 / 4 / 3; }


.gtm-baseline-footer .gtm-baseline-sans-serif {
  font-family: var(--font-heading);
  font-size: clamp(2.5rem, 5vw, 5.8rem);
}

.gtm-footer-titre {
  font-family: var(--font-heading);
  font-size: clamp(1.4rem, 4vw, 2rem);
  margin-bottom: 15px;
}

.gtm-footer-baseline-script .gtm-script {
  width: 25vw;
  min-width: 180px;
  transform: translateY(-35px);
}

.gtm-box-footer-ms {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.gtm-liens-ms {
  display: flex;
  justify-content: center;
  align-items: center;
}

.gtm-liens-ms svg {
  margin-left: 5px;
}

.gtm-box-footer-ms svg {
  width: 30px;
  fill: var(--color-secondary);
  transition: fill .2s ease-in-out;
}

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

.gtm-lettres-shad {
  display: flex;
  justify-content: center;
  align-items: baseline;
  line-height: .6;
  padding-top: 8vw;
}

.gtm-lettres-shad span {
  font-family: var(--font-heading);
  color: var(--color-secondary);
  text-transform: uppercase;
  font-size: clamp(3rem, 27.5vw, 29.5rem);
}

.gtm-lettres-shad .gtm-lettre {
  transform: translateY(5vw);
  transition: transform .3s ease-in-out;
  cursor: grab;
}

.gtm-lettres-shad .gtm-lettre:hover  {
  transform: translateY(-2vw);
}

.gtm-lettres-shad .gtm-lettre-e {
  padding-right: 35px;
}


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

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

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

  .gtm-box-footer-ms {
    flex-direction: row;
    align-items: center;
    gap: 15px;
  }
}

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

/* ----------------------------------------------------------------------------
Section dark
------------------------------------------------------------------------------ */

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

  .gtm-section-dark div.gtm-texte-section-dark {
    width: 40%;
  }

/* ----------------------------------------------------------------------------
Correction d'affichage mobile
------------------------------------------------------------------------------ */

  .gtm-small-text-mob {
    max-width: 100%;
    margin: auto;
  }

/* ----------------------------------------------------------------------------
Correction d'affichage mobile
------------------------------------------------------------------------------ */

  .gtm-big-padding-left {
    padding-left: 15vw;
  }

  .gtm-small-text {
    max-width: 80%;
    margin: 0;
  }

}

@media screen and (min-width: 992px) {
  .gtm-content-footer .gtm-custom {
    display: grid;
    grid-template-columns: 2fr repeat(2, 1fr);
    grid-template-rows: repeat(2, auto);
    grid-column-gap: 20px;
  }
    
  .gtm-baseline-footer { grid-area: 1 / 1 / 2 / 2; }
  .gtm-footer-coordonnees { grid-area: 1 / 2 / 2 / 3; }
  .gtm-horaire-suivre { grid-area: 1 / 3 / 2 / 4; }
  .gtm-lettres-shad { grid-area: 2 / 1 / 3 / 4; }

  .gtm-footer-baseline-script .gtm-script {
    transform: translateY(-5vw);
  }
}

/* ---------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------------
  ANIMATIONS AU SCROLL
------------------------------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------------------------- */

@media screen and (min-width: 992px) {
  .gtm-animate {
  opacity: 0;
  transition: all 0.7s ease;
}

/* === FADE === */
.gtm-visible.gtm-fade-in {
  opacity: 1;
}

/* === SLIDES === */
.gtm-slide-in {
  transform: translateY(40px);
}
.gtm-visible.gtm-slide-in {
  opacity: 1;
  transform: translateY(0);
}

.gtm-slide-left {
  transform: translateX(-40px);
}
.gtm-visible.gtm-slide-left {
  opacity: 1;
  transform: translateX(0);
}

.gtm-slide-right {
  transform: translateX(40px);
}
.gtm-visible.gtm-slide-right {
  opacity: 1;
  transform: translateX(0);
}

.gtm-slide-up {
  transform: translateY(40px);
}
.gtm-visible.gtm-slide-up {
  opacity: 1;
  transform: translateY(0);
}

/* === ZOOM === */
.gtm-zoom-in {
  transform: scale(0.95);
}
.gtm-visible.gtm-zoom-in {
  opacity: 1;
  transform: scale(1);
}

/* === FLIP === */
.gtm-flip-in {
  transform: rotateY(90deg);
  transform-origin: left;
}
.gtm-visible.gtm-flip-in {
  opacity: 1;
  transform: rotateY(0);
}

/* === ROTATE === */
.gtm-rotate-in {
  transform: rotate(-5deg);
}
.gtm-visible.gtm-rotate-in {
  opacity: 1;
  transform: rotate(0);
}

/* === POP === */
.gtm-pop-in {
  transform: scale(0.8);
}
.gtm-visible.gtm-pop-in {
  opacity: 1;
  transform: scale(1.05);
  transition: transform 0.5s ease, opacity 0.5s ease;
}

}


/* ---------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------------------------------------
  ANIMATIONS PAGE CHARGE
------------------------------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------------------------- */

/* Base invisible */
.gtm-load {
  opacity: 0;
  animation-fill-mode: forwards;
}

/* Fade-in */
.gtm-load-fade-in {
  animation: gtm-fade-in 0.8s ease-out forwards;
}

/* Slide-in (depuis le bas) */
.gtm-load-slide-in {
  animation: gtm-slide-in 0.8s ease-out forwards;
}

/* Slide-left (depuis la gauche) */
.gtm-load-slide-left {
  animation: gtm-slide-left 0.8s ease-out forwards;
}

/* Slide-down (depuis le haut) */
.gtm-load-slide-down {
  animation: gtm-slide-down 0.8s ease-out forwards;
}

/* Delays */
.gtm-delay-1 { animation-delay: 0.6s; }
.gtm-delay-2 { animation-delay: 1s; }
.gtm-delay-3 { animation-delay: 1.6s; }
.gtm-delay-4 { animation-delay: 1.9s; }

/* Keyframes */
@keyframes gtm-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes gtm-slide-in {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: none; }
}

@keyframes gtm-slide-left {
  from { opacity: 0; transform: translate(-30%, 85%); }
  to { opacity: 1; transform: translate(-20%, 85%); }
}

@keyframes gtm-slide-down {
  from { opacity: 0; transform: translateY(-30px); }
  to { opacity: 1; transform: none; }
}



.gtm-box-section-cadeau {
  display: flex;
  flex-direction: row-reverse;
  justify-content: center;
  align-items: center;
  gap: 30px;
}

@media screen and (max-width: 768px) {
  .gtm-box-section-cadeau {
    flex-direction: column;
}
}

#gtm-custom232, #gtm-custom233 {
  display: block;
}