.realisations-carousel {
    position: relative;
}

.realisations-carousel .splide__slide {
    position: relative;
}

.realisations-carousel .splide__slide img {
    width: 100%;
    height: 700px;
    object-fit: cover;
    display: block;
    border-radius: 0px 160px 0px 160px !important;
    z-index: 0;
}

.realisations-carousel .splide__slide::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(21, 21, 21, 0.50);
    pointer-events: none;
    border-radius: 0px 160px 0px 160px !important;
    z-index: 1;
}

.fleches-custom {
  position: absolute;
  top: 80px;
  left: 80px;
  display: flex;
  gap: 20px;
  z-index: 10;
}

.fleche {
  width: 48px;
  height: 48px;
  padding: 0;
  cursor: pointer;
}

.fleche svg {
  width: 100%;
  height: 100%;
  fill: var(--wp--preset--color--primaire);
  transition: fill 0.3s ease;
  background: white;
  border-radius: 100%;
}

/* HOVER : change la couleur de la flèche */
.fleche:hover svg {
  fill: #CED0E1;
  background: rgb(0, 0, 0);
}

/*contenu*/ 
.realisation {
  position: relative;
}

.realisation .contenu {
  position: absolute;
  bottom: 80px;
  left: 80px;
  right: 80px;
  z-index: 5;
  color: white;
  max-width: 500px;
}