/* ============================================
   GALLERY CAROUSEL — masseuse detail
   ============================================ */

.gallery-carousel {
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: var(--radius-xl);
  background: var(--surface);
}

.gallery-carousel__track {
  display: flex;
  transition: transform var(--duration-lg) var(--ease);
}

.gallery-carousel__slide {
  flex-shrink: 0;
  width: 100%;
}

.gallery-carousel__slide--main .gallery-carousel__img {
  aspect-ratio: 3/4;
}

.gallery-carousel__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  aspect-ratio: 3/4;
}

.gallery-carousel__btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: var(--z-raised);
  width: 40px;
  height: 40px;
  border-radius: var(--radius-full);
  background: rgba(15,15,15,0.7);
  border: 1px solid var(--border-gold);
  color: var(--gold-light);
  font-size: var(--text-xl);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background var(--duration) var(--ease);
  -webkit-tap-highlight-color: transparent;
}

.gallery-carousel__btn:hover { background: rgba(15,15,15,0.9); }
.gallery-carousel__btn--prev { left: var(--sp-3); }
.gallery-carousel__btn--next { right: var(--sp-3); }

/* ---- Dots ---- */
.gallery-carousel__dots {
  display: flex;
  justify-content: center;
  gap: var(--sp-2);
  padding: var(--sp-3);
}

.gallery-carousel__dot {
  width: 8px;
  height: 8px;
  border-radius: var(--radius-full);
  background: var(--border-strong);
  transition: background var(--duration) var(--ease),
              transform var(--duration) var(--ease);
}

.gallery-carousel__dot--active {
  background: var(--gold);
  transform: scale(1.3);
}

/* ---- Lightbox overlay (managed by filters.js) ---- */
.lightbox {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.92);
  z-index: var(--z-modal);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--sp-8);
}

.lightbox[hidden] { display: none; }

.lightbox__img {
  max-width: 90vw;
  max-height: 90dvh;
  object-fit: contain;
  border-radius: var(--radius-lg);
}

.lightbox__close {
  position: absolute;
  top: var(--sp-4);
  right: var(--sp-4);
  width: 44px;
  height: 44px;
  border-radius: var(--radius-full);
  background: rgba(255,255,255,0.1);
  color: var(--text);
  font-size: var(--text-xl);
  display: flex;
  align-items: center;
  justify-content: center;
}