:root {
  --col-h: 65vh;
}

.gallery-wrapper {
  display: inline-grid;
  grid-template-rows: calc(var(--col-h) / 2 - var(--space-s) / 2) calc(var(--col-h) / 2 - var(--space-s) / 2);
  grid-auto-columns: var(--col-h);
  grid-auto-flow: column;
  gap: var(--space-s);
  padding-inline: var(--section-padding-inline);
  padding-right: var(--slider-end-space, var(--section-padding-inline));
  align-items: stretch;
}

.gallery-item {
  border-radius: var(--radius-2xl, 16px);
  overflow: hidden;
  position: relative;
  cursor: none;
  min-width: 0;
  min-height: 0;
  background: var(--color-base-l-2);
}

.gallery-item::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, var(--color-base-l-2) 25%, var(--color-base-l-3) 50%, var(--color-base-l-2) 75%);
  background-size: 400% 400%;
  animation: g-shimmer 1.6s ease infinite;
  opacity: 1;
  transition: opacity 0.4s ease;
  pointer-events: none;
}

.gallery-item.loaded::after { opacity: 0; }

@keyframes g-shimmer {
  0%   { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

.gallery-item:nth-child(3n+1) { grid-row: span 2; }
.gallery-item:nth-child(3n+2),
.gallery-item:nth-child(3n+3) { grid-row: span 1; }

.gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  pointer-events: none;
}

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

@media (max-width: 768px) {
  .gallery-item { cursor: pointer; }
}