/** Shopify CDN: Minification failed

Line 206:1 Expected "}" to go with "{"

**/
section.slideShow {
    coretex-slideshow-custom {
        display: block;
        position: relative;
        overflow: clip;
        width: 100%;

        --slidePadding: 2rem;
    }

    coretex-slideshow-custom li { margin: 0 }

    coretex-slideshow-custom [slideshow-container] {
        display: flex;
        align-items: flex-start;
        transition: height 250ms ease-in-out;

        max-height: var(--heightDesktop);

        @media (min-width: 1920px) { max-height: var(--heightMonitor) }
        @media (max-width: 777px) { max-height: var(--heightMobile) }
    }

    @media(min-width: 778px) { coretex-slideshow-custom[auto-height="desktop"] [slideshow-slide] img { height: fit-content } }
    @media(max-width: 777px) { coretex-slideshow-custom[auto-height="mobile"] [slideshow-slide] img { height: fit-content } }

    /* Mobile: 1 full-width slide */
    coretex-slideshow-custom [slideshow-slide] {
        position: relative;
        flex: 0 0 100%;
        min-width: 0;
        user-select: none;

        box-sizing: border-box;
    }

    @media (max-width: 778px) {
        coretex-slideshow-custom [slideshow-slide] {
            padding: var(--slidePadding);
        }
    }

    /* Desktop: 4 slides visible (25% each) */
    @media (min-width: 778px) {
        coretex-slideshow-custom [slideshow-slide] {
            flex: 0 0 25%;
        }
    }

    coretex-slideshow-custom [slideshow-slide] img {
        display: block;
        width: 100%;
        height: calc(var(--heightDesktop, 700px) - (var(--slidePadding) * 2));
        object-fit: cover;
        object-position: var(--imagePosition);

        @media (min-width: 1920px) { height: calc(var(--heightMonitor, 700px) - (var(--slidePadding) * 2)) }
        @media (max-width: 777px) { height: calc(var(--heightMobile, 600px) - (var(--slidePadding) * 2)) }
    }

    coretex-slideshow-custom [slideshow-slide] video {
        display: block;
        width: 100%;
        height: calc(var(--heightDesktop, 700px) - (var(--slidePadding) * 2));
        object-fit: cover;
        object-position: var(--imagePosition);

        @media (min-width: 1920px) { height: calc(var(--heightMonitor, 700px) - (var(--slidePadding) * 2)) }
        @media (max-width: 777px) { height: calc(var(--heightMobile, 600px) - (var(--slidePadding) * 2)) }
    }

    coretex-slideshow-custom svg.svgph { height: fit-content }

    coretex-slideshow-custom [slideshow-slide] .meta {
        padding: var(--padding);
        pointer-events: none;

        & > x-flex { height: 100% }
    }

    coretex-slideshow-custom slider-controls {
        display: block;
        padding: var(--margin);
        margin: 1.2rem 0 1.3rem;

        .paginationNav { position: relative; }

        /* Both arrows grouped together on the right side; pagination stays centered. */
        .pag-arrows {
            position: absolute;
            right: 0;
            top: 50%;
            transform: translateY(-50%);
            gap: var(--space-1, .5rem);
        }

        /* Arrows are hidden via JS (is-hidden class) when there's nothing left to
           scroll in that direction. visibility (not display) is used so each
           arrow keeps its layout space and the other arrow's position never shifts. */
        .pag-arrows .is-hidden {
            visibility: hidden;
            pointer-events: none;
        }

        [control-dots] { gap: var(--padding) }

        button.control-dot {
            --buttonPadding: var(--space-0);
            --buttonRadius: 100vw;

            background: var(--bgColor);
            border: var(--globalBorderSafe);
            width: .5rem;
            height: .5rem;

            &.is-selected { background: var(--color) }
        }

        /* --- Mobile: overlay controls directly on the image --- */
        @media (max-width: 777px) {
            position: absolute;
            inset: var(--slidePadding);
            margin: 0;
            padding: 0;
            z-index: 2;
            pointer-events: none;

            .paginationNav {
                height: 100%;
                width: 100%;
            }

            /* dots / numbers pinned to bottom-center over the image */
            .paginationNav > x-cell[order="2"] {
                position: absolute;
                bottom: var(--margin, 1.6rem);
                left: 50%;
                transform: translateX(-50%);
                pointer-events: auto;
            }

            /* Ignore the x-flex layout entirely — pin each arrow directly
               to its own edge of the slide, independent of the other. */
            .pag-arrows {
                position: static;
                display: contents;
            }

            .pag-arrows button {
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                pointer-events: auto;
                --buttonPadding: var(--space-0);
                padding: .6rem;
                width: auto;
                min-width: 0;
                max-width: max-content;
            }

            .pag-arrows button[control-prev] { left: 0; }
            .pag-arrows button[control-next] { right: 0; }

            i.g-arrowRight { fill: #fff; }
            i.g-arrowLeft { fill: #fff; }

            button.control-dot {
            --buttonPadding: var(--space-0);
            --buttonRadius: 100vw;

            background: transparent;
            border: 0.1rem solid #fff;
            width: .5rem;
            height: .5rem;

            &.is-selected { background: #fff; }
        }
    }

    coretex-slideshow-custom [slideshow-slide] .meta x-flex > x-cell {
        text-align: var(--textAlignDesktop, left);
        word-break: break-word;
    overflow-wrap: break-word;

        @media (max-width: 777px) {
            text-align: var(--textAlignMobile, center);
        }

        p {
            font-size: 1.6rem;
            color: #ffffff;
        }

        @media (max-width: 777px) {
            p {
                font-size: 1.3rem;
                color: #ffffff;
            }
        }
    }
}