/* Блок «Карточки» — каркас. */

.cab-cards__grid {
  list-style: none;
}
/* Картинка до краёв карточки: двойной класс сильнее, чем padding у .cab-card в скине */
.cab-card.cab-cards__item {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: 0;
}
.cab-cards__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--cab-space-3);
  padding: var(--cab-space-5);
}
.cab-cards__more {
  display: inline-flex;
  align-items: center;
  gap: var(--cab-space-2);
  margin-top: auto;
}
/* Ссылка заголовка растягивается на всю карточку */
.cab-cards__link::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}

/* overlay: текст поверх картинки, тёмный тон и затемнение */
.cab-cards--overlay .cab-cards__item {
  justify-content: flex-end;
  min-height: 320px;
  --cab-color-text: var(--cab-palette-inverse-text);
  --cab-color-muted: color-mix(in srgb, var(--cab-palette-inverse-text) 78%, transparent);
  --cab-color-line: color-mix(in srgb, var(--cab-palette-inverse-text) 22%, transparent);
  --cab-color-accent: var(--cab-palette-inverse-text);
  --cab-color-on-accent: var(--cab-palette-inverse-bg);
  color: var(--cab-color-text);
}
.cab-cards--overlay .cab-cards__media {
  position: absolute;
  inset: 0;
  aspect-ratio: auto;
}
.cab-cards--overlay .cab-cards__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, var(--cab-overlay), transparent 70%);
}
.cab-cards--overlay .cab-cards__body {
  position: relative;
  flex: 0 0 auto;
}
.cab-cards--overlay .cab-cards__media .cab-media__img,
.cab-cards--overlay .cab-cards__media .cab-media__placeholder {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: cover;
}

.cab-cards__footer {
  display: flex;
  justify-content: center;
  margin-top: var(--cab-space-7);
}