.hero-carousel-shell{position:relative}
.hero-carousel-track{
  display:flex;
  width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
}
.hero-carousel-track::-webkit-scrollbar{display:none}
.hero-carousel-track>.hero{flex:0 0 100%;width:100%;scroll-snap-align:start;scroll-snap-stop:always}
.vale-hero{display:block;background:#30251e}
.vale-hero>picture,.vale-hero>picture img{display:block;width:100%;height:100%}
.vale-hero>picture img{object-fit:cover;object-position:center 40%}
.vale-hero:after{background:linear-gradient(90deg,#080807aa,transparent 58%),linear-gradient(0deg,#08080780,transparent 35%)}
.vale-hero .hero-copy{top:25%;transform:none}
.vale-hero .collection-logo{width:min(320px,100%);max-height:200px;margin-bottom:12px;filter:none}
.vale-hero h2{margin:0;font:400 clamp(18px,1.7vw,26px)/1.25 Italiana,Georgia,serif}
.hero-carousel-dots{
  position:absolute;
  z-index:5;
  right:0;
  bottom:20px;
  left:0;
  display:flex;
  justify-content:center;
  gap:12px;
  pointer-events:none;
}
.hero-carousel-dots button{
  width:12px;
  height:12px;
  padding:0;
  border:1.5px solid #fff;
  border-radius:50%;
  background:transparent;
  box-shadow:0 1px 4px #080807b8;
  cursor:pointer;
  pointer-events:auto;
}
.hero-carousel-dots button.active{background:#fff}
.hero-carousel-dots button:focus-visible{outline:2px solid var(--gold-soft);outline-offset:4px}

@media(min-width:761px){
  .hero-carousel-shell,.hero-carousel-track{height:min(100vh,66.6667vw)}
  .hero-carousel-track>.hero{height:100%;min-height:0}
  .ambar-hero>img.desktop-concept{height:100%;object-fit:cover;object-position:center top}
  .ambar-hero .hero-copy{top:29%}
  .vale-hero>picture,.vale-hero>picture img{width:100%;height:100%}
  .vale-hero>picture img{object-fit:cover;object-position:center 46%}
  .vale-hero .hero-copy{left:7vw;top:51%;transform:translateY(-42%);width:min(430px,42vw)}
}

@media(max-width:760px){
  .vale-hero>picture img{object-position:center}
  .hero-carousel-track{
    display:flex;
    width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    touch-action:pan-x pan-y;
  }
  .hero-carousel-track::-webkit-scrollbar{display:none}
  .hero-carousel-track>.hero{
    flex:0 0 100%;
    width:100%;
    scroll-snap-align:start;
    scroll-snap-stop:always;
  }
  .ambar-hero .hero-copy{bottom:max(38px,calc(env(safe-area-inset-bottom) + 28px))}
  .vale-hero{display:block;height:100svh;min-height:0;background:#30251e}
  .vale-hero>picture,.vale-hero>picture img{display:block;width:100%;height:100%}
  .vale-hero>picture img{object-fit:cover;object-position:center}
  .vale-hero:after{background:linear-gradient(0deg,#0808079c,transparent 48%)}
  .vale-hero .hero-copy{
    position:absolute;
    z-index:3;
    top:auto;
    right:0;
    bottom:max(50px,calc(env(safe-area-inset-bottom) + 40px));
    left:0;
    width:100%;
    padding:0 16px;
    transform:none;
    color:#fff9f1;
    text-align:center;
    text-shadow:0 1px 8px #080807a8;
  }
  .vale-hero .collection-logo{width:min(210px,62vw);max-height:130px;margin:0 auto 10px;filter:none}
  .vale-hero h2{margin:0;font:400 17px/1.3 Italiana,Georgia,serif;letter-spacing:.4px}
  .vale-hero .outline{margin-top:12px;border-color:#fff9f1}
  .hero-carousel-dots{
    position:absolute;
    z-index:5;
    right:0;
    bottom:max(6px,env(safe-area-inset-bottom));
    left:0;
    display:flex;
    justify-content:center;
    gap:12px;
    pointer-events:none;
  }
}
