/* === Hero slider (3x4) === */
.hero-slider{position:relative; width:min(100%,340px); aspect-ratio:3/4; border-radius:14px; overflow:hidden; border:1px solid #1c1c22; background:#0e0e12}
.hero-slide{position:absolute; inset:0; opacity:0; transition:opacity .55s ease; will-change:opacity}
.hero-slide.active{opacity:1}
.hero-slide img{width:100%; height:100%; display:block; object-fit:cover; object-position:center 20%}
.hero-dots{position:absolute; left:10px; bottom:10px; display:flex; gap:6px; z-index:2}
.hero-dots button{width:8px; height:8px; border-radius:999px; border:1px solid #2a2a32; background:rgba(0,0,0,.45); cursor:pointer}
.hero-dots button.active{background:#D4AF37; border-color:#D4AF37; box-shadow:0 0 0 4px rgba(212,175,55,.22)}