/* @group   Slider with Description
------------------------------------ */

.slider-with-description {
	position: relative;
	z-index: var(--z-index-lowest);
}

.slider-with-description .has-paragraph-eyebrow-font-size {
    text-transform: uppercase;
}

.slider-with-description ul.wp-block-list li {
    padding-left: 2.4rem;
    position: relative;
    --lh: 100%;
}

.slider-with-description ul.wp-block-list li:not(:last-child) {
    margin-bottom: 1.2rem;
}

.slider-with-description ul.wp-block-list li:before {
    content: "";
    position: absolute;
    left: 1rem;
    top: 1rem;
    width: 0.3rem;
    height: 0.3rem;
    background-color: var(--fresh-lawn);
}

.slider-with-description .bp-slider :is(.img-box, .bp-multimedia) {
    height: 37.5rem;
}

.slider-with-description :is(.splide__pagination, #important) {
    bottom: -4rem;
    justify-content: flex-start !important;
    padding: 0 !important;
    gap: 1rem;
}

.slider-with-description .splide__pagination__page {
    width: 1.5rem;
    height: 1.5rem;
}

.slider-with-description .bp-slider .splide__pagination__page {
    border: 1px solid var(--midnight-musings);
}

@media only screen and (min-width: 961px) {
    .slider-with-description ul.wp-block-list li {
        padding-left: 2.8rem;
        max-width: 90%;
    }

    .slider-with-description ul.wp-block-list li:not(:last-child) {
        margin-bottom: 1.5rem;
    }

    .slider-with-description ul.wp-block-list li:before {
        left: 1.4rem;
        width: 0.4rem;
        height: 0.4rem;
    }

    .slider-with-description .bp-slider :is(.img-box, .bp-multimedia) {
        height: 73.4vh;
    }

    .slider-with-description .column-slider {
        padding-inline: 0 !important;
    }

    .slider-with-description :is(.splide__pagination, #important) {
        bottom: -4.3rem;
    }

    .slider-with-description .splide__pagination__page {
        width: 1.3rem;
        height: 1.3rem;
    }
}

@media only screen and (min-width: 0) and (max-width: 960px) {
    .slider-with-description .row {
        flex-direction: column-reverse !important;
    }

    .slider-with-description .slider-group {
        margin-bottom: 5rem;
    }

    .slider-with-description:has(.has-paragraph-eyebrow-font-size) .slider-group {
        margin-bottom: 3rem;
    }

    .slider-with-description .splide__pagination {
        position: static;
        margin-top: 2.5rem;
    }

    .slider-with-description .column-text :is(.wp-block-list, .has-paragraph-body-copy-font-size) {
        max-width: 77% !important;
    }
}

/* @end */

:where(.editor-styles-wrapper) .slider-with-description ul {
    list-style-type: none;
    padding: 0;
    margin: 0 !important;
}

:where(.editor-styles-wrapper) .slider-with-description ul * {
    font-family: var(--font-degular);
}

:where(.editor-styles-wrapper) .slider-with-description .slider-group {
    --desktop-w: 50% !important;
}



/* ANIMATION */
:where(#wrapper) .slider-with-description :is(.column-text, .slider-group) {
    opacity: 0;
}

:where(#wrapper) .slider-with-description.animateActive :is(.column-text, .slider-group) {
    animation-delay: var(--delay, 0);
}

:where(#wrapper) .slider-with-description.animateActive .slider-group {
    animation: fade var(--anim-duration) ease forwards;
    --delay: 0.3s;
}


@media only screen and (min-width: 961px) {
    :where(#wrapper) .slider-with-description:is(.reversed).animateActive .column-text {
        animation: fadeRight var(--anim-duration) ease forwards;
        --delay: 0.6s;
    }

    :where(#wrapper) .slider-with-description:not(.reversed).animateActive .column-text {
        animation: fadeLeft var(--anim-duration) ease forwards;
        --delay: 0.6s;
    }
}

@media only screen and (min-width: 0) and (max-width: 960px) {
    :where(#wrapper) .slider-with-description .column-text.animateActive {
        animation: fadeLeft var(--anim-duration) ease forwards;
        --delay: 0.6s;
    }
}