/* Zayed Gallery Engine — lightweight, no external deps */
.zayed-gallery {
  position: relative;
  width: 100%;
  --zg-cols: 3;
  --zg-gap: 12px;
  --zg-speed: 500ms;
  margin: 1.5rem 0;
}

.zayed-gallery__grid {
  display: grid;
  grid-template-columns: repeat(var(--zg-cols), 1fr);
  gap: var(--zg-gap);
}

/* Layout variants */
.zayed-gallery--masonry .zayed-gallery__grid {
  display: columns;
  columns: var(--zg-cols);
  column-gap: var(--zg-gap);
}
.zayed-gallery--masonry .zayed-gallery__item {
  break-inside: avoid;
  margin-bottom: var(--zg-gap);
  display: block;
}

.zayed-gallery--collage .zayed-gallery__grid {
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 140px;
}
.zayed-gallery--collage .zayed-gallery__item:nth-child(1) { grid-column: span 2; grid-row: span 2; }
.zayed-gallery--collage .zayed-gallery__item:nth-child(5) { grid-column: span 2; }

.zayed-gallery--justified .zayed-gallery__grid {
  display: flex;
  flex-wrap: wrap;
  gap: var(--zg-gap);
}
.zayed-gallery--justified .zayed-gallery__item {
  flex: 1 1 220px;
  max-width: 100%;
}

.zayed-gallery--mosaic .zayed-gallery__grid {
  grid-template-columns: repeat(6, 1fr);
  grid-auto-rows: 100px;
}
.zayed-gallery--mosaic .zayed-gallery__item:nth-child(3n+1) { grid-column: span 2; grid-row: span 2; }
.zayed-gallery--mosaic .zayed-gallery__item:nth-child(5n) { grid-column: span 3; }

.zayed-gallery--pinterest .zayed-gallery__grid {
  columns: var(--zg-cols);
  column-gap: var(--zg-gap);
}
.zayed-gallery--pinterest .zayed-gallery__item {
  break-inside: avoid;
  margin-bottom: var(--zg-gap);
}

.zayed-gallery--mixed .zayed-gallery__grid {
  grid-template-columns: 2fr 1fr 1fr;
  grid-auto-rows: minmax(160px, auto);
}
.zayed-gallery--mixed .zayed-gallery__item:first-child {
  grid-row: span 2;
}

/* Items */
.zayed-gallery__item {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-m, 14px);
  background: var(--ivory, #FBF9F4);
  margin: 0;
  opacity: 0;
  transform: translateY(12px);
  animation: zg-in var(--zg-speed) ease forwards;
}
.zayed-gallery__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.45s ease, filter 0.35s ease;
}
.zayed-gallery__item:hover img {
  transform: scale(1.04);
}
.zayed-gallery__item figcaption {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: 10px 14px;
  background: linear-gradient(transparent, rgba(22,33,27,0.75));
  color: #fff;
  font-size: 0.85rem;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.zayed-gallery__item:hover figcaption {
  opacity: 1;
}

@keyframes zg-in {
  to { opacity: 1; transform: none; }
}

/* Transition modifiers (extra flavour on top of base animation) */
.zayed-trans-zoom-in { transform: scale(0.92); }
.zayed-trans-zoom-out { transform: scale(1.08); }
.zayed-trans-fade-left { transform: translateX(-18px); }
.zayed-trans-fade-right { transform: translateX(18px); }
.zayed-trans-slide-up { transform: translateY(24px); }
.zayed-trans-slide-down { transform: translateY(-24px); }
.zayed-trans-flip-x { transform: perspective(600px) rotateX(12deg); }
.zayed-trans-flip-y { transform: perspective(600px) rotateY(12deg); }
.zayed-trans-rotate-in { transform: rotate(-4deg) scale(0.96); }
.zayed-trans-bounce-in { transform: scale(0.9); }
.zayed-trans-blur-in { filter: blur(6px); opacity: 0; }
.zayed-trans-elastic-in { transform: scale(0.85); }
.zayed-trans-scale-up { transform: scale(0.88); }
.zayed-trans-swing { transform: rotate(-3deg); }
.zayed-trans-reveal { clip-path: inset(0 100% 0 0); }

/* Carousel / slider / fullscreen */
.zayed-gallery--carousel,
.zayed-gallery--slider,
.zayed-gallery--fullscreen {
  overflow: hidden;
}
.zayed-gallery__track {
  display: flex;
  transition: transform var(--zg-speed) cubic-bezier(0.25, 0.8, 0.25, 1);
  will-change: transform;
}
.zayed-gallery--carousel .zayed-gallery__item,
.zayed-gallery--slider .zayed-gallery__item,
.zayed-gallery--fullscreen .zayed-gallery__item {
  flex: 0 0 100%;
  min-width: 100%;
  opacity: 1;
  transform: none;
  animation: none;
  height: 420px;
}
.zayed-gallery--slider .zayed-gallery__item { height: 520px; }
.zayed-gallery--fullscreen .zayed-gallery__item { height: 70vh; min-height: 360px; }

.zayed-gallery__prev,
.zayed-gallery__next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 50%;
  background: rgba(255,255,255,0.92);
  color: var(--ink, #16211B);
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
  box-shadow: var(--shadow-soft, 0 4px 14px rgba(22,33,27,0.08));
  transition: background 0.2s, transform 0.2s;
}
.zayed-gallery__prev:hover,
.zayed-gallery__next:hover {
  background: #fff;
  transform: translateY(-50%) scale(1.06);
}
.zayed-gallery__prev { left: 12px; }
.zayed-gallery__next { right: 12px; }

.zayed-gallery__dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 14px;
}
.zayed-gallery__dots button {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  border: none;
  background: var(--line-strong, rgba(22,33,27,0.24));
  cursor: pointer;
  padding: 0;
  transition: background 0.2s, transform 0.2s;
}
.zayed-gallery__dots button.is-active {
  background: var(--gold, #C89B3C);
  transform: scale(1.25);
}

/* Carousel style variants (visual flavour) */
.zayed-carousel--coverflow .zayed-gallery__item {
  transform-origin: center;
  transition: transform var(--zg-speed), opacity var(--zg-speed);
}
.zayed-carousel--kenburns .zayed-gallery__item img {
  animation: zg-kenburns 12s ease-in-out infinite alternate;
}
@keyframes zg-kenburns {
  from { transform: scale(1); }
  to   { transform: scale(1.12) translate(-2%, -1%); }
}
.zayed-carousel--cube .zayed-gallery__track {
  transform-style: preserve-3d;
}
.zayed-carousel--cards .zayed-gallery__item {
  box-shadow: var(--shadow, 0 12px 32px rgba(22,33,27,0.14));
}

/* Lightbox (simple) */
.zayed-lightbox {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: rgba(10,14,12,0.92);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease;
}
.zayed-lightbox.is-open {
  opacity: 1;
  pointer-events: auto;
}
.zayed-lightbox img {
  max-width: 92vw;
  max-height: 88vh;
  object-fit: contain;
  border-radius: 8px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.45);
}
.zayed-lightbox__close {
  position: absolute;
  top: 18px;
  right: 22px;
  width: 42px;
  height: 42px;
  border: none;
  border-radius: 50%;
  background: rgba(255,255,255,0.15);
  color: #fff;
  font-size: 1.4rem;
  cursor: pointer;
}
.zayed-lightbox__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  border: none;
  border-radius: 50%;
  background: rgba(255,255,255,0.12);
  color: #fff;
  font-size: 1.8rem;
  cursor: pointer;
}
.zayed-lightbox__prev { left: 16px; }
.zayed-lightbox__next { right: 16px; }

/* Responsive */
@media (max-width: 900px) {
  .zayed-gallery--grid .zayed-gallery__grid,
  .zayed-gallery--masonry .zayed-gallery__grid,
  .zayed-gallery--pinterest .zayed-gallery__grid {
    --zg-cols: 2;
  }
  .zayed-gallery--collage .zayed-gallery__grid,
  .zayed-gallery--mosaic .zayed-gallery__grid {
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 120px;
  }
  .zayed-gallery--mixed .zayed-gallery__grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 560px) {
  .zayed-gallery__grid {
    --zg-cols: 1 !important;
  }
  .zayed-gallery--carousel .zayed-gallery__item,
  .zayed-gallery--slider .zayed-gallery__item {
    height: 280px;
  }
  .zayed-gallery--fullscreen .zayed-gallery__item {
    height: 50vh;
  }
}
