/* rs-lite — minimal stand-in for Slider Revolution 6.
   The original rs6.css/rs6.min.js were never archived, so this drives the
   existing <rs-module>/<rs-slide>/<rs-layer> markup directly: same slides,
   same layer positions, same 1920x800 design canvas. */

rs-module-wrap {
    visibility: visible !important;
    display: block;
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #fff;
}

rs-module {
    display: block;
    position: relative;
    width: 100%;
    overflow: hidden;
}

rs-slides {
    display: block;
    position: absolute !important;
    inset: 0;
    overflow: hidden !important;
}

rs-slide {
    display: block;
    position: absolute !important;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity .8s ease;
    z-index: 1;
}

rs-slide.rsl-active {
    opacity: 1;
    visibility: visible;
    z-index: 2;
}

rs-slide > img.rev-slidebg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    display: block;
}

/* the 1920x800 design canvas, scaled to fit the viewport */
.rsl-canvas {
    position: absolute;
    top: 0;
    left: 50%;
    width: 1920px;
    height: 800px;
    transform-origin: top left;
    pointer-events: none;
}

.rsl-canvas rs-layer {
    position: absolute;
    display: block;
    margin: 0;
    pointer-events: auto;
    box-sizing: border-box;
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .7s ease, transform .7s ease;
}

rs-slide.rsl-active .rsl-canvas rs-layer {
    opacity: 1;
    transform: translateY(0);
}

/* stagger the layers in, the way the original entrance animation did */
rs-slide.rsl-active .rsl-canvas rs-layer:nth-child(1) { transition-delay: .10s }
rs-slide.rsl-active .rsl-canvas rs-layer:nth-child(2) { transition-delay: .20s }
rs-slide.rsl-active .rsl-canvas rs-layer:nth-child(3) { transition-delay: .30s }
rs-slide.rsl-active .rsl-canvas rs-layer:nth-child(4) { transition-delay: .40s }
rs-slide.rsl-active .rsl-canvas rs-layer:nth-child(5) { transition-delay: .50s }
rs-slide.rsl-active .rsl-canvas rs-layer:nth-child(6) { transition-delay: .60s }
rs-slide.rsl-active .rsl-canvas rs-layer:nth-child(7) { transition-delay: .70s }
rs-slide.rsl-active .rsl-canvas rs-layer:nth-child(8) { transition-delay: .80s }

.rsl-canvas rs-layer.rev-btn {
    display: inline-block;
    text-decoration: none;
    white-space: nowrap;
    transition: opacity .7s ease, transform .7s ease, background-color .25s ease, color .25s ease;
}

.rsl-canvas rs-layer.rev-btn:hover { text-decoration: none }

/* arrows */
.rsl-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 46px;
    height: 46px;
    border: 0;
    border-radius: 50%;
    background: rgba(1, 118, 213, .85);
    color: #fff;
    font-size: 20px;
    line-height: 46px;
    text-align: center;
    cursor: pointer;
    z-index: 20;
    padding: 0;
    opacity: 0;
    transition: opacity .25s ease, background-color .25s ease;
}

rs-module-wrap:hover .rsl-nav { opacity: 1 }
.rsl-nav:hover  { background: #0176d5 }
.rsl-nav.rsl-prev { left: 18px }
.rsl-nav.rsl-next { right: 18px }

/* thumbnail strip */
.rsl-thumbs {
    position: absolute;
    left: 50%;
    bottom: 14px;
    transform: translateX(-50%);
    display: flex;
    gap: 8px;
    z-index: 20;
}

.rsl-thumbs button {
    width: 54px;
    height: 27px;
    padding: 0;
    border: 2px solid rgba(255, 255, 255, .75);
    border-radius: 3px;
    background-size: cover;
    background-position: center;
    cursor: pointer;
    opacity: .55;
    transition: opacity .2s ease, border-color .2s ease, transform .2s ease;
}

.rsl-thumbs button:hover { opacity: .9 }

.rsl-thumbs button.rsl-on {
    opacity: 1;
    border-color: #0176d5;
    transform: translateY(-2px);
}

@media (max-width: 767px) {
    .rsl-nav   { width: 36px; height: 36px; line-height: 36px; font-size: 16px }
    .rsl-thumbs { display: none }
}