/* @group Example
------------------------------------ */

.slider-news .splide__track {
    overflow: visible;
}

.slider-news .img-box :is(video, img, iframe) {
    height: 100%;
}

.slider-news .splide__slide>a {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.slider-news .splide__slide .splide__slide p {
    text-transform: none;
}

.slider-news .splide__arrow {
    position: static;
    transform: none;
    opacity: 1;
    color: var(--white);
}

.slider-news .splide__arrows {
    pointer-events: none;
}

.slider-news .splide__arrows .splide__arrow {
    pointer-events: all;
}

.slider-news .splide__arrows p {
    color: var(--white);
    text-transform: uppercase;
    --fw: 500;
    --ff: var(--titleFont);
    --ls: 0.05em;
}

.slider-news header h2 {
    --ls: 0.008em;
    color: var(--tower-red);
    margin-bottom: 1rem;
}

/* .slider-news .row {
    overflow: hidden;
    padding-inline: 0 !important;
} */

.slider-news {
    overflow: hidden;
}


.slider-news .img-box>* {
    pointer-events: none;
}


.slider-news h3 {
    text-transform: uppercase;
}

.slider-news .splide__list {
    transition: transform 0.5s !important;
}

.slider-news .splide__arrows button {
    font-size: 2.4rem;
}

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

    .slider-news {
        --_hover-opacity: 0;
        position: relative;
    }

    .slider-news header h2 {
        --fw: 500;
    }

    .slider-news .is-prev,
    .slider-news .splide__slide:has(+ .is-prev) {
        opacity: 0;
        pointer-events: none;
    }

    #wrapper .slider-news:hover {
        --_hover-opacity: 1;
    }


    .slider-news h2 {
        margin: 0 !important;
    }

    .slider-news header {
        margin-bottom: -1rem;
    }

    .slider-news header h2 {
        --fs: 2.3rem;
    }



    .slider-news .splide {
        height: 36.4rem;
    }

    .slider-news .splide__arrow i {
        font-size: 4.6rem;
    }

    #wrapper .slider-news .splide__slide:not(.is-active) :is(p, h3) {
        opacity: 0;
    }

    .slider-news .splide__slide.is-active .img-box {
        position: relative;
    }

    .slider-news .splide__arrows,
    .slider-news .splide__slide .img-box::after,
    .slider-news .splide__slide :is(p, h3, .img-box) {
        transition: 0.5s;
    }

    .slider-news .splide__arrows,
    .slider-news .splide__slide.is-active .img-box::after {
        opacity: var(--_hover-opacity);
    }

    .slider-news .splide__slide.is-active .img-box::after {
        content: '';
        inset: 0;
        background: rgba(0, 0, 0, 0.60);
        pointer-events: none;
        position: absolute;
    }



    .slider-news .splide,
    .slider-news .splide__slide.is-active {
        width: 38.65rem !important;
    }

    .slider-news .splide__slide:not(.is-active) {
        width: 28.5rem !important;
    }


    .slider-news .splide__slide .img-box {
        height: 19.2rem;
    }

    .slider-news .splide__slide.is-active .img-box,
    .slider-news .splide__arrows {
        height: 26.1rem;
        position: relative;
    }

    .slider-news :is(.splide__arrows, #important) {
        display: flex;
        position: absolute;
        inset: 0;
        padding-inline: calc((var(--gap-desktop) * 0.5) + 1.3rem);
        justify-content: space-between;
        align-items: center;
        translate: 1.1rem 0;
    }

}

@media only screen and (min-width : 0) and (max-width : 960px) {



    .slider-news .splide {
        padding-inline: calc(var(--gap-mobile) * 0.5);
        width: 100%;
    }

    .slider-news .splide {
        height: 37.8rem;
    }

    .slider-news .splide__slide .img-box {
        height: 19.2rem;
    }

    .slider-news .splide__slide.is-active .img-box,
    .slider-news .splide__arrows {
        height: 26.1rem;
        position: relative;
    }

}

/* @end */


/* Animations
------------------------------------ */
:where(#wrapper) .contenedor .elemento {
    opacity: 0;
    --duration: 1s;
}

:where(#wrapper) .contenedor.animateActive .elemento {
    animation: fade var(--duration) forwards;
    animation-delay: var(--delay, 0);
}

:where(#wrapper) .contenedor.animateActive .elemento {
    --delay: 0.3s;
}

/* CMS */


.editor-styles-wrapper .slider-news .splide a {
    pointer-events: none;
}