:root{--dot-size:12px;}
*{box-sizing:border-box}
.ssp.slider{position:relative;overflow:hidden;background:#000}
.ssp .slides{position:relative;height:100%;min-height:280px}
.ssp .slide{position:absolute;inset:0;opacity:0;transition:opacity .6s ease,transform .6s ease;display:flex;align-items:center;justify-content:center;will-change:transform,opacity}
.ssp .slide img{width:100%;height:100%;display:block;will-change:transform,filter}
.ssp .slide .overlay{position:absolute;inset:0;pointer-events:none}
.ssp .slide .overlay.gradient{background:linear-gradient(180deg, rgba(0,0,0,.2), rgba(0,0,0,.45))}
.ssp .slide .content{position:absolute;left:4%;bottom:8%;max-width:46%;color:#fff;padding:16px}
.ssp .slide .content h2{margin:0 0 8px;font-size:28px}
.ssp .btn{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;text-decoration:none}
.ssp .btn.img-btn{padding:0;background:transparent}
.ssp .btn.img-btn img{height:40px;width:auto;display:block}
.ssp .slide.active{opacity:1;z-index:3}
.ssp .arrow{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.9);border:0;padding:10px;border-radius:50%;cursor:pointer;z-index:6}
.ssp .arrow.prev{left:12px}.ssp .arrow.next{right:12px}
.ssp .dots{position:absolute;left:50%;transform:translateX(-50%);bottom:12px;display:flex;gap:8px;z-index:6}
.ssp .dots button{width:var(--dot-size);height:var(--dot-size);border-radius:50%;border:0;cursor:pointer}

/* Hover effects on linked slides */
.ssp a.img-link.hover-zoom img{transition:transform .3s ease}
.ssp a.img-link.hover-zoom:hover img{transform:scale(1.03)}
.ssp a.img-link.hover-lighten img{transition:filter .3s ease}
.ssp a.img-link.hover-lighten:hover img{filter:brightness(1.1)}
.ssp a.img-link.hover-both img{transition:transform .3s ease, filter .3s ease}
.ssp a.img-link.hover-both:hover img{transform:scale(1.03);filter:brightness(1.1)}

/* Ken Burns keyframes (duration set inline per instance) */
@keyframes kenburns{0%{transform:scale(1);}50%{transform:scale(1.05);}100%{transform:scale(1);}}

/* Responsive */
@media (min-width:1025px){.ssp.slider.hide-desktop{display:none!important;}}
@media (min-width:768px) and (max-width:1024px){.ssp.slider.hide-tablet{display:none!important;}}
@media (max-width:767px){.ssp.slider.hide-mobile{display:none!important;}}
@media (max-width:900px){.ssp .slide .content{max-width:70%;left:6%;bottom:6%}.ssp .slide .content h2{font-size:22px}}
@media (max-width:600px){.ssp .slide .content{position:static;padding:16px;background:rgba(255,255,255,.02);max-width:100%}.ssp .slides{min-height:220px}}
