.hero-slider{position:relative;aspect-ratio:2.66/1;min-height:420px;overflow:hidden;background:#050505}
.hero-slider__track,.hero-slide{position:absolute;inset:0}
.hero-slide{opacity:0;visibility:hidden;transition:opacity .55s ease}
.hero-slide.is-active{opacity:1;visibility:visible;z-index:1}
.hero-slide__media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-slide:first-child .hero-slide__media{object-position:72% 48%}
.hero-slide__shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.58) 29%,rgba(0,0,0,.04) 68%)}
.hero-slide__content{position:relative;z-index:2;display:flex;min-height:100%;max-width:600px;padding:36px max(42px,calc((100vw - var(--page))/2));flex-direction:column;justify-content:center;align-items:flex-start}
.hero-slide__logo{width:clamp(125px,14vw,215px);height:auto;margin:0 0 10px;filter:drop-shadow(0 8px 24px #000)}
.hero-slide__content h2{font-size:clamp(34px,4vw,64px);font-style:italic;line-height:.92;text-transform:uppercase;margin:8px 0 12px}
.hero-slide__content p{max-width:440px;margin:0 0 18px;color:#ddd}
.hero-slider__arrow{position:absolute;z-index:4;top:50%;width:42px;height:52px;border:0;border-radius:4px;background:#0008;color:#fff;font-size:35px;line-height:1;transform:translateY(-50%);cursor:pointer}
.hero-slider__arrow--prev{left:12px}.hero-slider__arrow--next{right:12px}
.hero-slider__dots{position:absolute;z-index:4;left:50%;bottom:15px;display:flex;gap:8px;transform:translateX(-50%)}
.hero-slider__dots button{width:28px;height:4px;padding:0;border:0;background:#ffffff66;cursor:pointer}
.hero-slider__dots button.is-active{background:#1688ff}
@media(max-width:800px){
  .hero-slider{aspect-ratio:4/5;min-height:0}
  .hero-slide__media{object-position:68% center}
  .hero-slide:first-child .hero-slide__media{object-position:62% center}
  .hero-slide__shade{background:linear-gradient(0deg,rgba(0,0,0,.94) 0%,rgba(0,0,0,.12) 72%)}
  .hero-slide__content{justify-content:flex-end;max-width:none;padding:26px 22px 48px}
  .hero-slide__logo{width:125px;margin-bottom:4px}
  .hero-slide__content h2{font-size:34px}
  .hero-slide__content p{font-size:13px;margin-bottom:13px}
  .hero-slider__arrow{display:none}
}