.hotel-gallery{
  display:grid;
  grid-template-columns: 1fr;
  gap:12px;
  border-radius:18px;
  overflow:hidden;
}

.hotel-gallery img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.gallery-main{
  aspect-ratio: 3 / 2;
  cursor: zoom-in;
  border-radius: 14px;
  overflow: hidden;
}

.gallery-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(70px, 1fr));
  grid-auto-rows: 1fr;
  gap:12px;
}

.gallery-grid img,
.gallery-more{
  aspect-ratio: 1 / 1;
  position:relative;
  cursor: zoom-in;
  overflow:hidden;
  border-radius:14px;
}

.gallery-more img{
  filter:brightness(.65);
}

.more-overlay{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  color:#fff;
  font-size:18px;
  font-weight:900;
  background: rgba(2,6,23,.35);
}

/* Mobile: stack, show only key images */
/*@media (max-width: 700px){
  .hotel-gallery{
    grid-template-columns: 1fr;
  }

  .gallery-grid{
    grid-template-columns: repeat(3, 1fr);
  }

  .gallery-grid img:nth-child(n+4){
    display:none;
  }

  .gallery-more{
    display:none;
  }
}*/

.lb{
  position:fixed; inset:0; z-index:9999;
  display:none; align-items:center; justify-content:center;
  background: rgba(2,6,23,.92);
  padding:14px;
}
.lb.open{display:flex}
.lb-img{
  width: min(1200px, 100%);
  height: min(85vh, 100%);
  object-fit: contain;
  border-radius:14px;
  background: rgba(255,255,255,.02);
  box-shadow: 0 25px 70px rgba(0,0,0,.45);
  user-select:none;
  -webkit-user-drag:none;
}
.lb-close{
  position:absolute; top:14px; right:14px;
  border:1px solid rgba(226,232,240,.25);
  background: rgba(255,255,255,.08);
  color:#e2e8f0;
  padding:10px 12px;
  border-radius:12px;
  cursor:pointer;
  font-weight:900;
}
.lb-close:hover{background: rgba(255,255,255,.12)}
.lb-nav{
  position:absolute;
  top:50%; transform: translateY(-50%);
  width:48px; height:70px;
  border-radius:14px;
  border:1px solid rgba(226,232,240,.25);
  background: rgba(255,255,255,.08);
  color:#e2e8f0;
  cursor:pointer;
  font-size:65px;
  padding-bottom: 20px;
  line-height:0;
  display:grid; place-items:center;
  user-select:none;
}
.lb-nav:hover{background: rgba(255,255,255,.12)}
.lb-nav.prev{left:14px}
.lb-nav.next{right:14px}
.lb-count{
  position:absolute; bottom:14px; left:50%;
  transform: translateX(-50%);
  color:#e2e8f0;
  font-size:12px;
  padding:8px 10px;
  border-radius:999px;
  border:1px solid rgba(226,232,240,.25);
  background: rgba(255,255,255,.08);
}

/* On small screens, keep controls usable */
@media (max-width:700px){
  .lb-nav{width:44px;height:44px}
  .lb-nav.prev{left:10px}
  .lb-nav.next{right:10px}
  .lb-close{top:10px; right:10px}
  .lb-count{bottom:10px}
  @media (max-width:560px){
    .hotel-gallery{margin: 0pc 10px;}
  }
}