.sst-slider { position:relative; width:100%; max-width:var(--sst-slider-max-width,100%); margin-left:auto; margin-right:auto; overflow:hidden; background:#111; color:#fff; }
.sst-slider-viewport { position:relative; height:var(--sst-slider-height,480px); }
.sst-slider-slide { position:relative; width:100%; height:100%; overflow:hidden; }
.sst-transition-fade .sst-slider-slide:not([hidden]) { animation:sst-background-fade .4s ease both; }
.sst-transition-slide .sst-slider-slide:not([hidden]) { animation:sst-background-slide .4s ease both; }
/* Fade is the fallback if the browser does not support animated clip paths. */
.sst-transition-slices .sst-slider-slide:not([hidden]), .sst-transition-circle .sst-slider-slide:not([hidden]) { animation:sst-background-fade .5s ease both; }
@supports (clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%)) {
  .sst-transition-slices .sst-slider-slide:not([hidden]) { animation:sst-slices .8s ease-out both; }
}
@supports (clip-path: circle(1% at 50% 50%)) {
  .sst-transition-circle .sst-slider-slide:not([hidden]) { animation:sst-circle .7s ease-out both; }
}
.sst-slider-slide[hidden], .sst-slider-controls[hidden] { display:none !important; }
.sst-slider-media { position:absolute; inset:0; width:100%; height:100%; max-width:none; object-fit:cover; }
.sst-slider-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(0,0,0,.65),rgba(0,0,0,.18)); pointer-events:none; }
.sst-slider-graphic-wrap { position:absolute; top:5%; left:7%; right:7%; display:flex; z-index:1; pointer-events:none; }
.sst-graphic-align-left { justify-content:flex-start; }
.sst-graphic-align-center { justify-content:center; }
.sst-graphic-align-right { justify-content:flex-end; }
.sst-slider-graphic img { display:block; max-width:min(200px,25vw); max-height:100px; width:auto; height:auto; object-fit:contain; }
.sst-graphic-fade { animation:sst-slide-fade .6s ease both; }
.sst-graphic-up { animation:sst-graphic-up .6s ease both; }
.sst-graphic-down { animation:sst-graphic-down .6s ease both; }
.sst-graphic-left { animation:sst-graphic-left .6s ease both; }
.sst-slider-content { position:absolute; top:50%; left:7%; right:7%; transform:translateY(-50%); max-width:720px; z-index:1; text-align:left; text-shadow:0 1px 3px #111; pointer-events:none; }
.sst-align-center .sst-slider-content { margin:auto; text-align:center; }
.sst-align-right .sst-slider-content { margin-left:auto; text-align:right; }
.sst-slider-heading { color:#fff; margin:0 0 .4em; font-size:clamp(1.7rem,4vw,3.8rem); line-height:1.1; }
.sst-slider-content p { color:#fff; font-size:clamp(1rem,1.7vw,1.4rem); margin:0 0 1em; }
.sst-slider-button { display:inline-block; background:#df1822; color:#fff !important; text-decoration:none; font-weight:700; text-shadow:none; padding:.75em 1.2em; border-radius:4px; pointer-events:auto; }
.sst-slider-button:focus-visible, .sst-slider-controls button:focus-visible { outline:3px solid #fff; outline-offset:3px; }
.sst-slider-controls { position:absolute; z-index:2; inset:0; pointer-events:none; }
.sst-slider-controls button { position:absolute; pointer-events:auto; background:rgba(0,0,0,.74); color:#fff; border:1px solid #fff; border-radius:3px; min-width:38px; min-height:38px; cursor:pointer; }
.sst-slider-controls .sst-prev { left:8px; top:50%; transform:translateY(-50%); }
.sst-slider-controls .sst-next { right:8px; top:50%; transform:translateY(-50%); }
.sst-slider-controls .sst-pause { top:0; right:0; width:44px; height:44px; min-width:44px; min-height:44px; padding:0; border:0; background:linear-gradient(rgba(0,0,0,.74),rgba(0,0,0,.74)) center / 26px 26px no-repeat; font:11px/1 sans-serif; }
.sst-slider-status { position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.sst-animate-fade:not([hidden]) .sst-slider-content { animation:sst-slide-fade .6s ease both; }
.sst-animate-up:not([hidden]) .sst-slider-content { animation:sst-slide-up .6s ease both; }
.sst-animate-down:not([hidden]) .sst-slider-content { animation:sst-slide-down .6s ease both; }
.sst-animate-left:not([hidden]) .sst-slider-content { animation:sst-slide-left .6s ease both; }
@keyframes sst-slide-fade { from{opacity:0} to{opacity:1} }
@keyframes sst-slide-up { from{opacity:0;transform:translateY(calc(-50% + 24px))} to{opacity:1;transform:translateY(-50%)} }
@keyframes sst-slide-down { from{opacity:0;transform:translateY(calc(-50% - 24px))} to{opacity:1;transform:translateY(-50%)} }
@keyframes sst-slide-left { from{opacity:0;transform:translate(-24px,-50%)} to{opacity:1;transform:translate(0,-50%)} }
@keyframes sst-background-fade { from{opacity:0} to{opacity:1} }
@keyframes sst-background-slide { from{opacity:.5;transform:translateX(4%)} to{opacity:1;transform:translateX(0)} }
/* One continuous clip-path creates eight falling slices without cloning media. */
@keyframes sst-slices {
  0% { clip-path:polygon(0 0,100% 0,100% 0,87.5% 0,87.5% 0,75% 0,75% 0,62.5% 0,62.5% 0,50% 0,50% 0,37.5% 0,37.5% 0,25% 0,25% 0,12.5% 0,12.5% 0,0 0); }
  20% { clip-path:polygon(0 0,100% 0,100% 0,87.5% 0,87.5% 0,75% 0,75% 0,62.5% 0,62.5% 0,50% 0,50% 0,37.5% 0,37.5% 15%,25% 15%,25% 35%,12.5% 35%,12.5% 60%,0 60%); }
  40% { clip-path:polygon(0 0,100% 0,100% 0,87.5% 0,87.5% 0,75% 0,75% 20%,62.5% 20%,62.5% 40%,50% 40%,50% 60%,37.5% 60%,37.5% 80%,25% 80%,25% 100%,12.5% 100%,12.5% 100%,0 100%); }
  60% { clip-path:polygon(0 0,100% 0,100% 35%,87.5% 35%,87.5% 60%,75% 60%,75% 85%,62.5% 85%,62.5% 100%,50% 100%,50% 100%,37.5% 100%,37.5% 100%,25% 100%,25% 100%,12.5% 100%,12.5% 100%,0 100%); }
  80% { clip-path:polygon(0 0,100% 0,100% 85%,87.5% 85%,87.5% 100%,75% 100%,75% 100%,62.5% 100%,62.5% 100%,50% 100%,50% 100%,37.5% 100%,37.5% 100%,25% 100%,25% 100%,12.5% 100%,12.5% 100%,0 100%); }
  100% { clip-path:polygon(0 0,100% 0,100% 100%,87.5% 100%,87.5% 100%,75% 100%,75% 100%,62.5% 100%,62.5% 100%,50% 100%,50% 100%,37.5% 100%,37.5% 100%,25% 100%,25% 100%,12.5% 100%,12.5% 100%,0 100%); }
}
@keyframes sst-circle { from{clip-path:circle(0% at 50% 50%)} to{clip-path:circle(150% at 50% 50%)} }
@keyframes sst-graphic-up { from{opacity:0;transform:translateY(18px)} to{opacity:1;transform:translateY(0)} }
@keyframes sst-graphic-down { from{opacity:0;transform:translateY(-18px)} to{opacity:1;transform:translateY(0)} }
@keyframes sst-graphic-left { from{opacity:0;transform:translateX(-18px)} to{opacity:1;transform:translateX(0)} }
@media(max-width:600px) { .sst-slider.sst-slider-width-half{max-width:100%} .sst-slider-viewport{height:max(180px,calc(var(--sst-slider-height,480px) * .75))} .sst-slider-content{left:12%;right:12%;top:44%} }
@media(prefers-reduced-motion:reduce) { .sst-slider-content, .sst-slider-slide, .sst-slider-graphic { animation:none !important; } }
@media(forced-colors:active) { .sst-slider-controls .sst-pause { background:ButtonFace; color:ButtonText; border:1px solid ButtonText; } }
