/* Контейнер сетки */
.masonry {
  margin: 1.5em 0;
  padding: 0;
  column-gap: 1.5em; /* Стандартный отступ между колонками */
  font-size: 1em;
  line-height: 2.1em;
}

/* Элементы сетки */
.item {
  display: inline-block; /* Важно для Multi-column Layout */
  background: #fff;
  padding: 1em;
  margin: 0 0 1.5em;
  width: 100%;
  box-sizing: border-box; /* Учитывает padding в ширине элемента */
  box-shadow: 2px 2px 4px 0 #ccc;
  break-inside: avoid; /* Исправление: карточка не будет разрываться */
}

/* Адаптивные правила */
@media (min-width: 300px)  { .masonry { column-count: 1; } }
@media (min-width: 600px)  { .masonry { column-count: 2; } }