.photo-album {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
  max-width: 1080px;
  margin: 10% auto;
  padding: 20px;
}

.photo-clip {
  position: relative;
  aspect-ratio: 1/1;
  height: 100%;
  max-height: 200px;
  overflow: hidden;
  border-radius: 5px;
}

.photo-wrapper {
  position: absolute;
  height: 100%;
  left: 50%;
  top: 50%;
  clip-path: inset(10%);
  transform: translate(-50%, -50%) scale(1.25);
  z-index: 1;
}

.photo-clip:hover {
  overflow: visible;
}

.photo-clip:hover .photo-wrapper {
  clip-path: none;
  transform: translate(-50%, -50%) scale(1.5);
  z-index: 2;
}

@media (max-width: 768px) {
  .photo-album {
    grid-template-columns: repeat(2, 1fr);
  }
}