.alt-coll { background: var(--alt-co-bg); }

.alt-coll__facets { margin-bottom: 26px; }

.alt-coll__grid {
  display: grid;
  grid-template-columns: repeat(var(--alt-co-cols-d), minmax(0, 1fr));
  column-gap: var(--alt-co-gap);
  row-gap: var(--alt-co-gap-row, var(--alt-co-gap));
}

.alt-coll__empty { text-align: center; padding-block: 40px; }

.alt-coll__pagination { margin-top: 44px; display: flex; justify-content: center; }

/* The facets component ships its own layout; only the colours need to follow
   the Altira palette. */
.alt-coll .facets-sorting__summary,
.alt-coll .facets__summary { color: var(--alt-heading-color); font-family: var(--alt-font-heading); }

@media (max-width: 1279px) {
  .alt-coll__grid { grid-template-columns: repeat(var(--alt-co-cols-t), minmax(0, 1fr)); }
}

@media (max-width: 767px) {
  .alt-coll__grid { grid-template-columns: repeat(var(--alt-co-cols-m), minmax(0, 1fr)); column-gap: 16px; row-gap: 30px; }
  .alt-coll__pagination { margin-top: 30px; }
}
