.ockham-scroll-slider {
    --ockham-scroll-duration: 20s;
    --ockham-scroll-distance: 0px;
    --ockham-hover-scale: 1.05;
    --ockham-image-opacity: 1;
    --ockham-hover-opacity: 1;
    --ockham-overlay-bg: rgba(0,0,0,.45);
    --ockham-overlay-icon-color: #fff;
    --ockham-overlay-icon-size: 28px;
    position: relative;
    width: 100%;
}

.ockham-scroll-slider__viewport {
    overflow: hidden;
    width: 100%;
}

.ockham-scroll-slider__track {
    display: flex;
    align-items: flex-start;
    width: max-content;
    gap: 20px;
    animation-name: ockham-scroll-slider-marquee;
    animation-duration: var(--ockham-scroll-duration);
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    will-change: transform;
    backface-visibility: hidden;
    transform: translateZ(0);
}

.ockham-scroll-slider[data-direction="right"] .ockham-scroll-slider__track {
    animation-direction: reverse;
}

.ockham-scroll-slider[data-pause-on-hover="yes"]:hover .ockham-scroll-slider__track,
.ockham-scroll-slider.is-out-of-view .ockham-scroll-slider__track {
    animation-play-state: paused;
}

.ockham-scroll-slider__item {
    flex: 0 0 auto;
    min-width: 0;
    align-self: flex-start;
}

.ockham-scroll-slider:not(.is-logo-mode):not(.ockham-scroll-text.is-auto-width) .ockham-scroll-slider__item {
    width: 200px;
}

.ockham-scroll-slider__media {
    position: relative;
    display: block;
    overflow: hidden;
    width: 100%;
    height: 120px;
    line-height: 0;
}

.ockham-scroll-slider.is-logo-mode .ockham-scroll-slider__media {
    width: auto;
}

.ockham-scroll-slider__img-el {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: inherit;
    object-fit: contain;
    opacity: var(--ockham-image-opacity);
    transition: transform .25s ease, opacity .25s ease, filter .25s ease;
    vertical-align: top;
}

.ockham-scroll-slider.is-logo-mode .ockham-scroll-slider__img-el {
    width: auto !important;
    max-width: 100% !important;
}

.ockham-scroll-slider.hover-enabled .ockham-scroll-slider__item:hover .ockham-scroll-slider__img-el {
    transform: scale(var(--ockham-hover-scale));
    opacity: var(--ockham-hover-opacity);
}

.ockham-scroll-slider.hover-enabled .ockham-scroll-slider__item:hover .ockham-scroll-slider__media[data-grayscale-hover="yes"] .ockham-scroll-slider__img-el {
    filter: grayscale(1);
}

.ockham-scroll-slider__lightbox-trigger {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    border-radius: inherit;
    cursor: pointer;
    appearance: none;
    z-index: 2;
}

.ockham-scroll-slider__overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--ockham-overlay-bg);
    color: var(--ockham-overlay-icon-color);
    opacity: 0;
    transition: opacity .2s ease;
    pointer-events: none;
}

.ockham-scroll-slider.overlay-always .ockham-scroll-slider__overlay,
.ockham-scroll-slider.has-lightbox.has-overlay .ockham-scroll-slider__item:hover .ockham-scroll-slider__overlay,
.ockham-scroll-slider.has-lightbox.has-overlay .ockham-scroll-slider__lightbox-trigger:focus-visible .ockham-scroll-slider__overlay {
    opacity: 1;
}

.ockham-scroll-slider__overlay-icon {
    display: inline-flex;
    width: var(--ockham-overlay-icon-size);
    height: var(--ockham-overlay-icon-size);
}

.ockham-scroll-slider__overlay-icon svg {
    width: 100%;
    height: 100%;
    fill: currentColor;
}

.ockham-scroll-slider__lightbox {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, .88);
    padding: 24px;
    z-index: 999999;
}

.ockham-scroll-slider__lightbox.is-open {
    display: flex;
}

.ockham-scroll-slider__lightbox-img {
    display: block;
    max-width: min(92vw, 1600px);
    max-height: 92vh;
    width: auto;
    height: auto;
    object-fit: contain;
}

.ockham-scroll-slider__lightbox-close {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 999px;
    background: rgba(255,255,255,.12);
    color: #fff;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
}

.ockham-scroll-text .ockham-scroll-slider__track {
    align-items: stretch;
    text-rendering: geometricPrecision;
}

.ockham-scroll-text .ockham-scroll-slider__item {
    display: flex;
    align-items: stretch;
}

.ockham-scroll-text.is-auto-width .ockham-scroll-slider__item {
    width: auto !important;
    flex: 0 0 auto;
}

.ockham-scroll-text__item-inner {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 100%;
}

.ockham-scroll-text__content {
    display: block;
    white-space: nowrap;
}

@keyframes ockham-scroll-slider-marquee {
    from { transform: translate3d(0, 0, 0); }
    to { transform: translate3d(calc(-1 * var(--ockham-scroll-distance)), 0, 0); }
}
