.hero-slideshow{overflow:hidden;isolation:isolate}
.hero-frames{position:absolute;inset:0;overflow:hidden;background:var(--hero)}
.hero-frames .hero-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:0;transition:opacity 1.4s cubic-bezier(.25,.1,.25,1);will-change:opacity,transform}
.hero-frames .hero-frame.is-active{opacity:1;z-index:1}
.hero-slideshow::after{z-index:2}
.hero-slideshow figcaption,.hero-slideshow .hero-image-link{z-index:3}
.hero-slideshow figcaption b{font-weight:400}
.hero-slide-dots,.hero-slide-controls{position:absolute;z-index:3;display:flex;align-items:center;gap:5px;top:22px}
.hero-slide-dots[hidden],.hero-slide-controls[hidden]{display:none}
.hero-slide-dots{left:23px;padding:3px 7px;border:1px solid #ffffff26;border-radius:30px;background:#17211835;backdrop-filter:blur(12px)}
.hero-slide-dots button{width:25px;height:26px;padding:8px 3px;display:grid;place-items:center;background:transparent;border:0}
.hero-slide-dots span{position:relative;display:block;width:15px;height:3px;border-radius:3px;background:#ffffff70;overflow:hidden;transition:width .4s,background .4s}
.hero-slide-dots span i{position:absolute;inset:0;background:#fff;border-radius:inherit;transform:scaleX(0);transform-origin:left;opacity:0}
.hero-slide-dots [aria-current=true] span{width:23px;background:#ffffff40}
.hero-slide-dots [aria-current=true] span i{opacity:1}
.hero-slide-controls{right:23px;gap:7px}
.hero-slide-controls button{display:grid;place-items:center;width:36px;height:36px;border:1px solid #ffffff35;border-radius:50%;color:#fff;background:#17211840;backdrop-filter:blur(12px);transition:background .25s,transform .25s}
.hero-slide-controls svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.hero-slide-controls .play-symbol{display:none}
.hero-slide-pause[aria-pressed=true] .pause-symbol{display:none}
.hero-slide-pause[aria-pressed=true] .play-symbol{display:block}
@media(hover:hover){.hero-slide-controls button:hover{background:#48614bcc;transform:translateY(-1px)}.hero-slide-dots button:hover span{background:#ffffff60}}
@media(max-width:600px){.hero-slide-dots,.hero-slide-controls{top:14px}.hero-slide-dots{left:16px}.hero-slide-controls{right:16px}.hero-slide-controls button{width:34px;height:34px}}
@media(prefers-reduced-motion:reduce){.hero-frames .hero-frame,.hero-slide-dots span,.hero-slide-controls button{transition:none}}
