/* medium container width (md) */
h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
.s-before-footer__content__title,
.video-block__headings {
  color: #0E288B;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.03em;
}
.h-text-white h1,
.h-text-white .h1,
.h-text-white h2,
.h-text-white .h2,
.h-text-white h3,
.h-text-white .h3,
.h-text-white h4,
.h-text-white .h4,
.h-text-white h5,
.h-text-white .h5 {
  color: #fff;
}
h1,
.h1,
.s-before-footer__content__title {
  font-size: 40px;
  /* confirmed */
}
@media screen and (min-width: 768px) and (max-width: 1920px) {
  h1,
  .h1,
  .s-before-footer__content__title {
    font-size: calc(40px + (70 - 40) * ((100vw - 768px) / (1920 - 768)));
  }
}
@media screen and (min-width: 1920px) {
  h1,
  .h1,
  .s-before-footer__content__title {
    font-size: 70px;
  }
}
h2,
.h2 {
  font-size: 38px;
  /* confirmed */
}
@media screen and (min-width: 768px) and (max-width: 1920px) {
  h2,
  .h2 {
    font-size: calc(32px + (58 - 32) * ((100vw - 768px) / (1920 - 768)));
  }
}
@media screen and (min-width: 1920px) {
  h2,
  .h2 {
    font-size: 58px;
  }
}
h3,
.h3,
.video-block__headings {
  font-size: 28px;
  /* confirmed */
}
@media screen and (min-width: 768px) and (max-width: 1920px) {
  h3,
  .h3,
  .video-block__headings {
    font-size: calc(24px + (48 - 24) * ((100vw - 768px) / (1920 - 768)));
  }
}
@media screen and (min-width: 1920px) {
  h3,
  .h3,
  .video-block__headings {
    font-size: 48px;
  }
}
h4,
.h4 {
  font-size: 26px;
  /* confirmed */
}
@media screen and (min-width: 768px) and (max-width: 1920px) {
  h4,
  .h4 {
    font-size: calc(22px + (38 - 22) * ((100vw - 768px) / (1920 - 768)));
  }
}
@media screen and (min-width: 1920px) {
  h4,
  .h4 {
    font-size: 38px;
  }
}
h5,
.h5 {
  font-size: 22px;
  /* confirmed */
}
@media screen and (min-width: 768px) and (max-width: 1920px) {
  h5,
  .h5 {
    font-size: calc(18px + (28 - 18) * ((100vw - 768px) / (1920 - 768)));
  }
}
@media screen and (min-width: 1920px) {
  h5,
  .h5 {
    font-size: 28px;
  }
}
/* HERE PUT HELPERS CSS */
.h-hide {
  display: none;
}
.h-hide-mob {
  display: none !important;
}
@media screen and (min-width: 1024px) {
  .h-hide-mob {
    display: inherit !important;
  }
}
.h-hide-mob-only {
  display: none !important;
}
@media screen and (min-width: 768px) {
  .h-hide-mob-only {
    display: block !important;
  }
}
.h-hide-tablet-only {
  display: none !important;
}
@media screen and (min-width: 1023px) {
  .h-hide-tablet-only {
    display: block !important;
  }
}
.h-hide-tablet {
  display: inherit !important;
}
@media screen and (min-width: 768px) {
  .h-hide-tablet {
    display: none !important;
  }
}
.h-hide-desktop {
  display: inherit !important;
}
@media screen and (min-width: 1024px) {
  .h-hide-desktop {
    display: none !important;
  }
}
.h-bg-beige {
  background-color: #FBF2E8;
}
.h-layer-top {
  padding-top: 122px;
}
@media (min-width: 1025px) {
  .h-layer-top {
    padding-top: 190px;
  }
}
.pb-footer {
  padding-bottom: 104px;
}
@media (min-width: 1025px) {
  .pb-footer {
    padding-bottom: 104px;
  }
}
.h-video-responsive {
  overflow: hidden;
  padding-bottom: 56.25%;
  position: relative;
  height: 0;
}
.h-video-responsive iframe {
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  position: absolute;
}
.h-py-4xl,
.s-before-footer {
  padding-top: 56px;
  padding-bottom: 56px;
}
@media (min-width: 1025px) {
  .h-py-4xl,
  .s-before-footer {
    padding-top: 120px;
    padding-bottom: 120px;
  }
}
/**
 * BREAKPOINT (for-size)
 * 
 * deprecated
 */
/**
 * FLEXBOX (flex)
 * 
 * @mixin .flex(@wrap: nowrap, @justify: flex-start, @align-items: stretch, @align-content: stretch, @direction: row)
 * @param {mixed} @wrap Taille
 * @param {mixed} @justify Règle
 * @param {mixed} @align-items Règle2
 * @param {mixed} @align-content Règle2
 * @param {mixed} @direction Règle2
 */
/**
 * FLUID TYPOGRAPHY (fluid-type)
 * Défini une typo fluide entre 2 breakpoints à partir d'une taille de font minimum et maximum.
 * 
 * @mixin .fluid-type(@min_width, @max_width, @min-font-size, @max-font-size)
 * @param {int} @min_width Taille d'écran de départ
 * @param {int} @max_width Taille d'écran d'arrivée
 * @param {int} @min-font-size Taille du texte pour la taille d'écran de départ
 * @param {int} @max-font-size Taille du texte pour la taille d'écran d'arrivée
 */
/**
 * STRETCHED LINK (stretched-link)
 * Permet de rendre tout un bloc cliquable grâce au pseudo-élément `::after` de l'élément `<a>` enfant.
 */
.stretched-link {
  position: relative;
}
.stretched-link a[href]::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 10;
}
/**
 * ASPECT RATIO (fixed-ratio)
 * Permet de définir le ratio d'un conteneur et indique à ses déscendants direct de recouvrir tout le bloc.
 */
/**
 * VIEWPORT SIZE (vw-size)
 * Permet de calculer une taille en VW à partir d'une taille en PX
 */
/**
 * GRID (grid)
 */
/* resource : https://css-tricks.com/an-auto-filling-css-grid-with-max-columns/ */
/**
 * FLEXGRID (flexgrid)
 */
/**
 * ASPECT-RATIO (aspect-ratio)
 */
.s-before-footer {
  background-color: #FBF2E8;
  display: flex;
  justify-content: center;
  align-items: center;
}
.s-before-footer__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 4vw;
  margin: 24px;
  background: center / contain no-repeat url(../js/59d83e8a49fc94dfea80.svg);
}
@media (min-width: 1025px) {
  .s-before-footer__content {
    padding: 50px 13vw;
    margin: unset;
  }
}
.s-before-footer__content__title {
  font-weight: 900;
  letter-spacing: -0.03em;
  text-transform: uppercase;
  color: #A17234;
  padding-bottom: 40px;
  text-align: center;
}
.video-block {
  padding: 30px;
  border-radius: 16px;
}
@media (min-width: 1025px) {
  .video-block {
    padding: 80px;
  }
}
.video-block__headings {
  text-align: center;
  color: #0E288B;
}
.video-block__headings span {
  color: #A17234;
}
.video-block__description {
  font-size: 22px;
  text-align: center;
  color: #A17234;
  font-weight: 400;
  padding: 30px 0;
}
.video-block__yt {
  display: flex;
  justify-content: center;
  margin: 0 auto 0;
  max-width: 900px;
}
.video-block__yt .h-video-responsive {
  width: 100%;
}
.video-block__yt .video-classic {
  width: 100%;
  height: auto;
}
.history-swiper .swiper-container {
  width: 100%;
  height: 100%;
}
.history-swiper .swiper-slide img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border-radius: 10px;
  aspect-ratio: 644/386;
}
.history-swiper {
  width: 100%;
  height: auto;
  max-width: unset !important;
  overflow: hidden;
  position: relative;
  --swiper-theme-color: #0e288b;
}
.history-swiper .swiper-wrapper {
  display: flex;
  max-width: unset;
}
.history-swiper .swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
}