/* Adobe fonts */
/* .mundial{
  font-family: "mundial", sans-serif;
  font-weight: 400;
  font-style: normal;
  } */
  
  /* Variables */
  /* :root {
    --brand-primary: #4F5F0A;
    --brand-secondary: #C6A530;
    --bg-lightgrey: #F3F2F1;
    --neutral-dark: #090808;
    --neutral-light: #fff;
    } */
    

/* Navigation Links */
.c-realisatiecarousel__entry{
    height: 420px !important;
}

@media (max-width: 576px){
    .c-realisatiecarousel__entry{
        height: 300px !important;
    }
}

.c-realisatiecarousel__content{
    height: 100%;
    opacity: 0;
    transition: opacity 0.3s ease;
}

@media (max-width: 1024px){
    /* hover op de parent swiper-slide zelf */
    .swiper-slide:hover .c-realisatiecarousel__content,
    .swiper-slide-duplicate:hover .c-realisatiecarousel__content {
        opacity: 1;
    }
}

/* Zorg ervoor dat de niet-actieve slides niet geklikt kunnen worden */
@media(min-width: 1025px){
    
    .swiper-slide{
        pointer-events: none;
    }
    
    /* hover op de parent swiper-slide zelf */
    .swiper-slide-next:hover .c-realisatiecarousel__content,
    .swiper-slide-duplicate-next:hover .c-realisatiecarousel__content {
        opacity: 1;
    }

    .swiper-slide-next,
    .swiper-slide-duplicate-next{
        pointer-events: all;
    }

    .c-realisatiecarousel .swiper-slide{
        transition: all 0.3s ease !important;
        opacity: 0.25;
    }
    .c-realisatiecarousel .swiper-slide-next, .c-realisatiecarousel .swiper-slide-duplicate-next{
        opacity: 1;
    }

}


/* Buttons */
:root{
    --carouselbtn-offset: 3rem;
}

.c-realisatiecarousel .elementor-swiper-button{
    padding: 6px;
    border: 2px solid var(--brand-primary) !important;
    border-radius: 50%;
    background-color: #fff !important;
    transition: all 0.3s ease;
    transform: translateX(-50%) !important;
}
.c-realisatiecarousel .elementor-swiper-button *{
    fill: var(--brand-primary) !important;
    transition: all 0.3s ease;
}

.c-realisatiecarousel .elementor-swiper-button:hover{
    background-color: var(--brand-primary) !important;
}
.c-realisatiecarousel .elementor-swiper-button:hover *{
    fill: #fff !important;
}

.c-realisatiecarousel .elementor-swiper-button-next{
    position: absolute;
    bottom: 0;
    left: calc(50% + var(--carouselbtn-offset));
    top: unset !important;
    right: unset !important;
}

.c-realisatiecarousel .elementor-swiper-button-prev{
    position: absolute;
    bottom: 0;
    left: calc(50% - var(--carouselbtn-offset)) !important;
    top: unset !important;
    right: unset !important;
}