/* ---------- Split Hero (pool table visual) — home page ---------- */
.hero-split{
  position:relative; overflow:hidden;
  padding:0;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 92%);
}
.hero-slides{position:relative;}
.hero-slide{
  display:none; position:relative;
  align-items:center;
  padding:22px 0 76px;
  opacity:0;
  transition:opacity .45s ease;
}
.hero-slide.active{display:flex;}
.hero-slide.active.visible{opacity:1;}
.hero-slide .wrap{position:relative; z-index:2; width:100%;}
.hero-slide-bg{position:absolute; inset:0; z-index:0;}
.hero-slide-1 .hero-slide-bg{
  background:
    radial-gradient(900px 500px at 85% -10%, rgba(212,175,55,0.14), transparent 60%),
    linear-gradient(150deg, rgba(20,50,38,0.92) 0%, rgba(18,44,34,0.94) 45%, rgba(20,16,13,0.97) 100%),
    url('https://templateup.site/otaqo/wp-content/uploads/sites/44/2024/09/couple-dating-and-playing-snooker-2021-08-28-20-01-58-utc-min.jpg') center 30%/cover no-repeat;
}
.hero-slide-2 .hero-slide-bg{
  background:
    radial-gradient(900px 500px at 15% -10%, rgba(212,175,55,0.14), transparent 60%),
    linear-gradient(150deg, rgba(20,50,38,0.92) 0%, rgba(18,44,34,0.94) 45%, rgba(20,16,13,0.97) 100%),
    url('https://cousinslounge.com/imagesc/6.jpg') center 32%/cover no-repeat;
}
.hero-slide-3 .hero-slide-bg{
  background:
    radial-gradient(900px 500px at 85% -10%, rgba(212,175,55,0.14), transparent 60%),
    linear-gradient(150deg, rgba(20,50,38,0.92) 0%, rgba(18,44,34,0.94) 45%, rgba(20,16,13,0.97) 100%),
    url('https://cousinslounge.com/imagesc/10.jpg') center 32%/cover no-repeat;
}
.hero-dots{
  position:absolute; left:50%; bottom:20px; transform:translateX(-50%);
  display:flex; gap:10px; z-index:10;
}
.hero-dot{
  width:10px; height:10px; border-radius:50%; padding:0; cursor:pointer;
  border:1px solid rgba(239,231,214,0.5); background:rgba(239,231,214,0.2);
  transition:all .3s ease;
}
.hero-dot.active{width:28px; border-radius:6px; background:var(--gold); border-color:var(--gold);}

@media (max-width:860px){
  .hero-slide{padding:18px 0 64px;}
}
@media (max-width:520px){
  .hero-split{clip-path: polygon(0 0, 100% 0, 100% 100%, 0 96%);}
  .hero-slide{padding:16px 0 56px;}
  .hero-slide-1 .hero-slide-bg,
  .hero-slide-2 .hero-slide-bg{background-position:center 22%, center 22%, center 22%;}
  .hero-slide-3 .hero-slide-bg{background-position:center 22%, center 22%, center 22%;}
  .hero-dots{bottom:26px;}
}
