.elli-partner-slider {
    --elli-partner-slider-visible-items: 4;

    position: relative;
    color: var(--elli-partner-slider-color, var(--color-deep-teal, #00393f));
}

.elli-partner-slider__header {
    max-inline-size: 56rem;
    margin-block-end: var(--elli-partner-slider-header-spacing, 2rem);
}

.elli-partner-slider__title {
    margin: 0;
    color: var(--elli-partner-slider-title-color, var(--color-deep-teal, #00393f));
}

.elli-partner-slider__intro {
    margin-block-start: 0.75rem;
    color: var(--elli-partner-slider-text-color, var(--color-gray-medium, #5a7073));
}

.elli-partner-slider__intro > :last-child {
    margin-block-end: 0;
}

.elli-partner-slider__viewport {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--elli-partner-slider-control-gap, 1.5rem);
}

.elli-partner-slider__track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc(
        (100% - ((var(--elli-partner-slider-visible-items) - 1) * var(--elli-partner-slider-gap, 1.5rem)))
        / var(--elli-partner-slider-visible-items)
    );
    gap: var(--elli-partner-slider-gap, 1.5rem);
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: inline mandatory;
    scroll-behavior: smooth;
    scrollbar-width: none;
    padding-block: 0.125rem;
}

.elli-partner-slider__track::-webkit-scrollbar {
    display: none;
}

.elli-partner-slider__track:focus-visible {
    outline: var(--jsd-elli-focus-ring-width, 3px) solid var(--jsd-elli-focus-ring-color, var(--color-coral, #f7451d));
    outline-offset: var(--jsd-elli-focus-ring-offset, 3px);
    box-shadow: var(--jsd-elli-focus-ring-shadow, none);
}

.elli-partner-slider__item {
    min-inline-size: 0;
    scroll-snap-align: start;
    padding: 20px 12px;
    border-radius: 16px;
    border: 0.909px solid rgba(0, 57, 63, 0.1);
    background: #FFF;
    display: flex;
    justify-content: center;
    align-items: center;
}

.elli-partner-slider__card {
    display: flex;
    align-items: center;
    justify-content: center;
    min-block-size: var(--elli-partner-slider-card-height, 10.5rem);
    padding: var(--elli-partner-slider-card-padding, 2rem);
    border: 1px solid var(--elli-partner-slider-card-border-color, var(--color-sand-border, #e6dcd1));
    border-radius: var(--elli-partner-slider-card-radius, 1.5rem);
    background: var(--elli-partner-slider-card-bg, var(--color-white, #ffffff));
    color: var(--elli-partner-slider-color, var(--color-deep-teal, #00393f));
    text-decoration: none;
    transition:
        border-color 180ms ease,
        box-shadow 180ms ease,
        transform 180ms ease;
}

a.elli-partner-slider__card:hover {
    border-color: var(--elli-partner-slider-card-hover-border-color, var(--color-turquoise-30, rgba(5, 229, 207, 0.3)));
    box-shadow: 0 0.75rem 1.75rem rgba(0, 57, 63, 0.08);
    transform: translateY(-0.125rem);
}

.elli-partner-slider__card:focus-visible {
    outline: var(--jsd-elli-focus-ring-width, 3px) solid var(--jsd-elli-focus-ring-color, var(--color-coral, #f7451d));
    outline-offset: var(--jsd-elli-focus-ring-offset, 3px);
    box-shadow: var(--jsd-elli-focus-ring-shadow, none);
}

.elli-partner-slider__logo {
    display: block;
    inline-size: auto;
    max-inline-size: 100%;
    max-block-size: var(--elli-partner-slider-logo-max-height, 7.5rem);
    object-fit: contain;
}

.elli-partner-slider__control {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: var(--elli-partner-slider-control-size, 4rem);
    block-size: var(--elli-partner-slider-control-size, 4rem);
    border: 1px solid var(--elli-partner-slider-control-border-color, var(--color-deep-teal-20, rgba(0, 57, 63, 0.2)));
    border-radius: 999rem;
    background: var(--elli-partner-slider-control-bg, var(--color-white, #ffffff));
    color: var(--elli-partner-slider-control-color, var(--color-deep-teal, #00393f));
    font: inherit;
    font-size: 2.25rem;
    line-height: 1;
    cursor: pointer;
    transition:
        background-color 180ms ease,
        border-color 180ms ease,
        color 180ms ease,
        opacity 180ms ease;
}

.elli-partner-slider__control:hover {
    border-color: var(--elli-partner-slider-control-hover-border-color, var(--color-turquoise, #05e5cf));
    background: var(--elli-partner-slider-control-hover-bg, var(--color-turquoise, #05e5cf));
    color: var(--elli-partner-slider-control-hover-color, var(--color-deep-teal, #00393f));
}

.elli-partner-slider__control:focus-visible {
    outline: var(--jsd-elli-focus-ring-width, 3px) solid var(--jsd-elli-focus-ring-color, var(--color-coral, #f7451d));
    outline-offset: var(--jsd-elli-focus-ring-offset, 3px);
    box-shadow: var(--jsd-elli-focus-ring-shadow, none);
}

.elli-partner-slider__item:focus-within {
    scroll-snap-align: start;
}

.elli-partner-slider__track:focus {
    scroll-margin-inline: 1rem;
}

.elli-partner-slider__viewport {
    overflow: visible;
}


.elli-partner-slider__control[disabled] {
    opacity: 0.35;
    cursor: default;
    pointer-events: none;
}

.elli-partner-slider__control span {
    display: block;
    transform: translateY(-0.2rem);
}

@media (max-width: 1199.98px) {
    .elli-partner-slider {
        --elli-partner-slider-visible-items: 4;
    }
}

@media (max-width: 991.98px) {
    .elli-partner-slider {
        --elli-partner-slider-visible-items: 3;
    }

    .elli-partner-slider__viewport {
        gap: 1rem;
    }
}

@media (max-width: 767.98px) {
    .elli-partner-slider {
        --elli-partner-slider-visible-items: 2;
    }

    .elli-partner-slider__viewport {
        grid-template-columns: minmax(0, 1fr);
    }

    .elli-partner-slider__track {
        grid-row: 1;
    }

    .elli-partner-slider__control {
        position: absolute;
        z-index: 2;
        inset-block-start: 50%;
        inline-size: 3rem;
        block-size: 3rem;
        font-size: 1.75rem;
        transform: translateY(-50%);
    }

    .elli-partner-slider__control--prev {
        inset-inline-start: 0.75rem;
    }

    .elli-partner-slider__control--next {
        inset-inline-end: 0.75rem;
    }

    .elli-partner-slider__card {
        min-block-size: 8.75rem;
        padding: 1.5rem;
    }
}

@media (max-width: 575.98px) {
    .elli-partner-slider {
        --elli-partner-slider-visible-items: 1;
    }
}

@media (prefers-reduced-motion: reduce) {
    .elli-partner-slider,
    .elli-partner-slider * {
        scroll-behavior: auto !important;
        transition: none !important;
        animation: none !important;
    }
}