.gallery-img {
  cursor: zoom-in;
  transition: transform .15s ease-in-out;
}

.gallery-img:hover {
  transform: scale(1.02);
}

.img-modal-body {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  max-height: 80vh;
  user-select: none;
  background: #0b0b0b;
  touch-action: none;
  /* Hammer.js */
}

.img-modal-body img {
  max-width: 100%;
  max-height: 100%;
  transform-origin: center center;
  transition: transform 0.2s ease-out;
  cursor: grab;
  will-change: transform;
}

.img-modal-body img:active {
  cursor: grabbing;
}

.zoom-controls .btn {
  min-width: 44px;
}

@media (max-width: 576px) {
  .zoom-controls .btn {
    min-width: 36px;
    padding: .25rem .5rem;
  }
}