/* ─── promo slider ─── */
#slider div.slides div.slide a.btn-green {
    margin: 1.9rem 0 0;
}


div.slider-wrap { position: relative; height: 37.5rem; overflow: hidden; width: 100%; }
#slider { position: relative; height: 37.5rem; margin: 0 auto; overflow: hidden; }
#slider div.slides { position: absolute; top: 0; bottom: 0; left: 0; width: 100%; overflow: hidden; }
#slider div.slides div.slide { position: absolute; top: 0; bottom: 0; left: 0; width: 100%; transform: translateX(100%); will-change: transform; }
#slider div.slides div.slide:first-child { transform: translateX(0); }

#slider div.slides div.slide img.slide-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
#slider div.slides div.slide div.details { position: relative; width: 92%; max-width: 70.5rem; height: 100%; margin: 0 auto; z-index: 9; }

/* thumbnails */

#slider div.thumbs { position: relative; width: 92%; max-width: 70.5rem; margin: 0 auto; display: none; }
#slider div.thumbs ul { display: block; position: absolute; top: 9.6rem; right: 0; text-align: right; list-style: none; }
#slider div.thumbs ul li { display: block; float: left; width: 0.9rem; height: 0.9rem; margin-left: 0.4rem; }
#slider div.thumbs ul li a { display: block; width: 0.9rem; height: 0.9rem; border-radius: 0.9rem; background: rgba(255,255,255,0.4); transition: background-color 0.2s; }
#slider div.thumbs ul li a:hover,
#slider div.thumbs ul li a.active { background: rgba(190,189,0,1); }

/* controls */

#slider button.prev,
#slider button.next,
#slider .slider-pause { position: absolute; display: none; z-index: 5; }

#slider button.prev,
#slider button.next { width: 4.4rem; height: 4.8rem; top: 46%; border: 0; padding: 0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 56 56'%3E%3Cpath fill='%23fff' d='M41.47 27.88 15.54 2l1-1 26.93 26.88C34.4 37.1 25.1 46.1 16.05 55.38L15 54.4z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center; background-size: auto 3.6rem; background-color: rgba(0,0,0,0.5); cursor: pointer; transition: background-color 0.2s; }
#slider button.prev { left: 0; transform: scaleX(-1); }
#slider button.next { right: 0; }
#slider button.prev:hover,
#slider button.next:hover { background-color: rgba(0,0,0,0.9); }

#slider .slider-pause { bottom: 0.75rem; right: 0.75rem; width: 2.2rem; height: 2.2rem; padding: 0; border: 0; border-radius: 0; background: rgba(0,0,0,0.45); color: #fff; font-size: 1rem; line-height: 2.2rem; text-align: center; cursor: pointer; transition: background-color 0.2s; }
#slider .slider-pause:hover { background: rgba(0,0,0,0.7); }
#slider .slider-pause:focus-visible { outline: 0.15rem solid #bedd00; outline-offset: 0.15rem; }

/* active states */

#slider[data-slider-active] button.prev,
#slider[data-slider-active] button.next,
#slider[data-slider-active] .slider-pause { display: block; }

#slider[data-slider-active]:not([data-single]) div.thumbs { display: block; }

#slider[data-slider-active][data-single] button.prev,
#slider[data-slider-active][data-single] button.next,
#slider[data-slider-active][data-single] div.thumbs { display: none; }

/* responsive */

@media screen and (max-width: 1190px) {
    #slider button.next { right: 1.3rem; }
    #slider button.prev { right: 6.3rem; left: auto; }
}

@media screen and (max-width: 1100px) {
    div.slider-wrap { height: 0; padding-bottom: 60.9375%; }
    #slider { height: 0; padding-bottom: 60.9375%; }
}

@media screen and (max-width: 750px) {
    div.slider-wrap { display: none; }
    html[data-mobile="true"] div.slider-wrap[data-slider-mobile="swipe"] { display: block; }
    html[data-mobile="true"] div.slider-wrap[data-slider-mobile="swipe"] #slider button.prev,
    html[data-mobile="true"] div.slider-wrap[data-slider-mobile="swipe"] #slider button.next { display: none; }
}