.carousel[data-v-3193e3c3] {
  position:relative;
  width:min(100vw,1200px);
  margin:0 auto;
  color:#fff;
  --slide-gap: clamp(220px, 95%, 820px)
}
.carousel__viewport[data-v-3193e3c3] {
  position:relative;
  height:clamp(145px,40vw,300px);
  isolation:isolate;
  touch-action:pan-y;
  user-select:none;
  -webkit-user-select:none;
  cursor:grab
}
.carousel__viewport.is-dragging[data-v-3193e3c3] {
  cursor:grabbing
}
.carousel__slide[data-v-3193e3c3] {
  position:absolute;
  top:50%;
  left:50%;
  height:min(80%,300px);
  aspect-ratio:21 / 9;
  border-radius:clamp(18px,4vw,32px);
  overflow:hidden;
  box-shadow:0 28px 70px -40px #000000a6;
  opacity:0;
  transition:transform .55s cubic-bezier(.17,.67,.37,1),opacity .45s ease,filter .55s ease,z-index .55s ease;
  z-index:1;
  background:#111;
  --translate-x: -50%;
  --translate-y: -50%;
  --scale: .7;
  --rotate: 0deg;
  --swipe-offset: 0px;
  --swipe-scale: 0;
  --swipe-rotate: 0deg;
  transform:translate(calc(var(--translate-x) + var(--swipe-offset)),var(--translate-y)) scale(calc(var(--scale) + var(--swipe-scale))) rotate(calc(var(--rotate) + var(--swipe-rotate)))
}
.carousel__slide--clickable[data-v-3193e3c3] {
  cursor:pointer
}
.carousel__viewport.is-dragging .carousel__slide--clickable[data-v-3193e3c3] {
  cursor:grabbing
}
.carousel__slide[data-v-3193e3c3] img,
.carousel__image[data-v-3193e3c3] {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block
}
.carousel__slide--center[data-v-3193e3c3] {
  opacity:1;
  --scale: 1;
  --rotate: 0deg;
  z-index:4;
  box-shadow:0 40px 45px #0000004d
}
.carousel__slide--left[data-v-3193e3c3] {
  opacity:.9;
  --translate-x: calc(-50% - var(--slide-gap));
  --scale: .7;
  --rotate: -6deg;
  --translate-y: -35%;
  z-index:3;
  filter:brightness(.8)
}
.carousel__slide--right[data-v-3193e3c3] {
  opacity:.9;
  --translate-x: calc(-50% + var(--slide-gap));
  --scale: .7;
  --rotate: 6deg;
  --translate-y: -35%;
  z-index:3;
  filter:brightness(.8)
}
.carousel__slide--hidden[data-v-3193e3c3] {
  opacity:0;
  pointer-events:none
}
.carousel__nav[data-v-3193e3c3] {
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:clamp(42px,8vw,54px);
  height:clamp(42px,8vw,54px);
  border-radius:50%;
  border:none;
  background:#11121a8c;
  color:#fff;
  display:grid;
  place-items:center;
  cursor:pointer;
  transition:background .3s ease,transform .3s ease;
  z-index:5;
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px)
}
.carousel__nav[data-v-3193e3c3]:hover {
  background:#11121abf;
  transform:translateY(-50%) scale(1.05)
}
.carousel__nav[data-v-3193e3c3]:active {
  transform:translateY(-50%) scale(.96)
}
.carousel__nav--prev[data-v-3193e3c3] {
  left:clamp(8px,4vw,38px)
}
.carousel__nav--next[data-v-3193e3c3] {
  right:clamp(8px,4vw,38px)
}
.carousel__dots[data-v-3193e3c3] {
  display:flex;
  justify-content:center;
  gap:clamp(8px,2vw,12px);
  z-index:99
}
.carousel__dot[data-v-3193e3c3] {
  z-index:99;
  width:10px;
  height:10px;
  border-radius:50%;
  border:none;
  background:#ffffff59;
  cursor:pointer;
  transition:transform .3s ease,background .3s ease
}
.carousel__dot--active[data-v-3193e3c3] {
  transform:scale(1.4);
  background:#f8f8f8
}
.carousel__dot[data-v-3193e3c3]:focus-visible {
  outline:2px solid #fff;
  outline-offset:3px
}
@media(max-width:640px) {
  .carousel[data-v-3193e3c3] {
    --slide-gap: clamp(220px, 95%, 820px)
  }
}
@media(prefers-reduced-motion:reduce) {
  .carousel__slide[data-v-3193e3c3],
  .carousel__nav[data-v-3193e3c3],
  .carousel__dot[data-v-3193e3c3] {
    transition:none
  }
}
