/* ═══════════════════════════════════════════════
   HERO SLIDESHOW
   ═══════════════════════════════════════════════ */
.hero-slideshow{
  position:relative;
  height:420px;
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow:0 20px 60px -16px rgba(42,32,24,.35);
  background:var(--cream-alt);
}

.hs-track{
  display:flex;
  height:100%;
  transition:transform .65s cubic-bezier(.4,0,.2,1);
  will-change:transform;
}

.hs-slide{
  min-width:100%;
  height:100%;
  position:relative;
  overflow:hidden;
}
.hs-slide img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform 6s ease;
}
.hs-slide.active img{
  transform:scale(1.05);
}
.hs-slide-caption{
  position:absolute;
  bottom:0; left:0; right:0;
  background:linear-gradient(0deg,rgba(42,32,24,.75) 0%,transparent 100%);
  padding:1.8rem 1.2rem .8rem;
  color:#fff;
  font-family:var(--font-display);
  font-size:.88rem;
  font-weight:600;
  opacity:0;
  transition:opacity .4s ease .3s;
}
.hs-slide.active .hs-slide-caption{
  opacity:1;
}

/* Arrows */
.hs-arrow{
  position:absolute;
  top:50%; transform:translateY(-50%);
  width:44px; height:44px;
  border-radius:50%;
  border:none;
  background:rgba(255,255,255,.22);
  color:#fff;
  font-size:1.3rem;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  z-index:10;
  transition:background .15s, transform .15s;
  line-height:1;
}
.hs-arrow:hover{ background:rgba(255,255,255,.42); transform:translateY(-50%) scale(1.08); }
.hs-prev{ left:12px; }
.hs-next{ right:12px; }

/* Dot indicators */
.hs-dots{
  position:absolute;
  bottom:12px; left:50%; transform:translateX(-50%);
  display:flex; gap:6px; z-index:10;
}
.hs-dot{
  width:8px; height:8px;
  border-radius:50%;
  background:rgba(255,255,255,.5);
  border:none;
  cursor:pointer;
  transition:background .2s, transform .2s;
  padding:0;
}
.hs-dot.active{
  background:#fff;
  transform:scale(1.3);
}

/* Progress bar */
.hs-progress{
  position:absolute;
  bottom:0; left:0;
  height:3px;
  background:var(--orange);
  z-index:10;
  width:0%;
  transition:none;
}
.hs-progress.animating{
  transition:width 5s linear;
  width:100%;
}

/* Mobile: smaller */
@media(max-width:768px){
  .hero-slideshow{ height:260px; border-radius:var(--radius-md); }
  .hero-mobile-photos{ display:none; } /* replaced by slideshow */
  .hs-arrow{ width:36px; height:36px; font-size:1.1rem; }
}
@media(max-width:480px){
  .hero-slideshow{ height:210px; }
}
