.cms-gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 12px;
  margin: 1.25rem 0;
}
.cms-gallery-item {
  display: block;
  padding: 0;
  border: 0;
  border-radius: 8px;
  overflow: hidden;
  background: #e8e8e8;
  cursor: zoom-in;
  aspect-ratio: 4 / 3;
}
.cms-gallery-item img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .2s ease; }
.cms-gallery-item:hover img,
.cms-gallery-item:focus-visible img { transform: scale(1.04); }
.cms-gallery-lightbox {
  position: fixed !important;
  left: 50% !important;
  top: 50% !important;
  right: auto !important;
  bottom: auto !important;
  transform: translate(-50%, -50%) !important;
  margin: 0 !important;
  width: min(96vw, 1200px) !important;
  max-width: 96vw !important;
  max-height: 94vh !important;
  height: 94vh !important;
  padding: 3.5rem 4rem 3rem;
  border: 0;
  border-radius: 12px;
  background: #101521;
  color: #fff;
  overflow: hidden;
}
.cms-gallery-lightbox::backdrop { background: rgb(0 0 0 / 88%); }
.cms-gallery-lightbox figure { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: .75rem; width: 100%; height: 100%; margin: 0; }
.cms-gallery-lightbox figure img { display: block; max-width: 100%; max-height: 76vh; object-fit: contain; }
.cms-gallery-lightbox figcaption { color: #fff; text-align: center; }
.cms-gallery-lightbox button { position: absolute; display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid rgb(255 255 255 / 35%); border-radius: 50%; background: rgb(255 255 255 / 12%); color: #fff; font: 32px/1 sans-serif; cursor: pointer; }
.cms-gallery-lightbox button:hover { background: rgb(255 255 255 / 25%); }
.cms-lightbox-close { top: 1rem; right: 1rem; }
.cms-lightbox-prev, .cms-lightbox-next { top: 50%; transform: translateY(-50%); }
.cms-lightbox-prev { left: .75rem; }
.cms-lightbox-next { right: .75rem; }
.cms-lightbox-count { position: absolute; right: 0; bottom: .75rem; left: 0; text-align: center; color: #fff; }
@media (max-width: 600px) {
  .cms-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .cms-gallery-lightbox { width: 100vw !important; max-width: 100vw !important; height: 100dvh !important; max-height: 100dvh !important; padding: 3.5rem 3rem; border-radius: 0; }
  .cms-gallery-lightbox figure img { max-height: 76dvh; }
}