.gym-showcase {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 3px;
  margin-top: 2.5rem;
  margin-bottom: 3.5rem;
}

.gym-showcase__item {
  position: relative;
  overflow: hidden;
  aspect-ratio: 3 / 4;
  background: rgb(18 18 22);
}

.gym-showcase__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.gym-showcase__item:hover img {
  transform: scale(1.04);
}

.gym-showcase__item--wide {
  grid-column: span 2;
  aspect-ratio: 16 / 10;
}

.gym-showcase__item--tall {
  grid-row: span 2;
  aspect-ratio: auto;
}

@media (width >= 768px) {
  .gym-showcase {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 4px;
  }

  .gym-showcase__item--leg-press {
    grid-column: span 4;
  }

  .gym-showcase__item--platforms {
    grid-column: span 8;
    aspect-ratio: 16 / 9;
  }

  .gym-showcase__item--panatta {
    grid-column: span 4;
  }

  .gym-showcase__item--hammer {
    grid-column: span 4;
  }

  .gym-showcase__item--minimal {
    grid-column: span 4;
  }

  .gym-showcase__item--equip-a,
  .gym-showcase__item--equip-b,
  .gym-showcase__item--equip-c {
    grid-column: span 4;
    aspect-ratio: 3 / 4;
  }
}