@charset "UTF-8";
/* ==========================================================================
   CSS SPÉCIFIQUE À LA PAGE D'ACCUEIL (home.tpl)
   ========================================================================== */
/* 1. On annule la marge de sécurité du header.
      Le slider va remonter se coller tout en haut de l'écran (sous le header). */
#header + * {
  margin-top: var(--header-h, 100px);
}

/* 2. Quand on est tout en haut (.at-top), le header devient transparent */
/*#header.at-top {
  background-color: transparent !important;
  box-shadow: none !important;
  border-bottom: transparent !important;
  transition: background-color 0.3s ease-in-out;
}*/
/* (Optionnel) Passer le texte/logo en blanc quand le fond est transparent */
/*#header.at-top .nav-link,
#header.at-top .navbar-brand {
  color: #ffffff !important;
  transition: color 0.3s ease-in-out;
}*/
/* 3. SÉCURITÉ UX : On ajoute un padding interne en haut du slider.
      Cela empêche le texte (H2) de votre premier slide de remonter
      derrière le logo et le menu du header transparent. */
#magix-hero-slideshow {
  margin-bottom: calc(var(--spacer) * 2);
}
#magix-hero-slideshow .text-shadow {
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.7), 0 0 20px rgba(0, 0, 0, 0.3);
}

.magix-hero-slideshow .splide__track {
  aspect-ratio: 21/9;
  width: 100%;
  min-height: 400px;
}
@media (min-width: 992px) {
  .magix-hero-slideshow .splide__track {
    min-height: 600px;
  }
}

.magix-split-hero {
  background-color: #f9f7fd;
}
.magix-split-hero .content-col {
  position: relative;
  z-index: 2;
}
.magix-split-hero .content-wrapper {
  max-width: 750px;
}
.magix-split-hero .slider-col {
  position: relative;
  z-index: 1;
}
.magix-split-hero .slider-col::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 15%;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(to right, #f9f7fd 0%, rgba(249, 247, 253, 0) 100%);
}
.magix-split-hero .slider-col::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 5%;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(to left, #f9f7fd 0%, rgba(249, 247, 253, 0) 100%);
}
.magix-split-hero .splide__slide img,
.magix-split-hero .splide__slide picture {
  object-fit: cover;
  object-position: 70% 30%;
}
@media (max-width: 991.98px) {
  .magix-split-hero .row {
    flex-direction: column-reverse;
  }
  .magix-split-hero .slider-col::before {
    display: none;
  }
  .magix-split-hero .slider-col::after {
    top: auto;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 30%;
    background: linear-gradient(to top, #f9f7fd 0%, rgba(249, 247, 253, 0) 100%);
  }
}
.magix-split-hero .lead {
  font-weight: 500;
}

/*# sourceMappingURL=magixslideshow.css.map */