/* Тёмная плашка каталога. Единственный тёмный блок темы. */
@layer theme.components {

.catalog-promo {
  display: grid;
  padding: clamp(24px, 4vw, 40px);
  border-radius: var(--radius-xl);
  background: var(--color-bg-dark);
  box-shadow: var(--shadow-promo);
  color: var(--color-text-inverse);
  gap: 32px;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
  align-items: start;
}
.catalog-promo .section__title { color: var(--color-text-inverse); }
.catalog-promo__text { color: var(--color-text-on-dark); }
.catalog-promo__perks {
  display: grid;
  margin: 18px 0 0;
  padding: 0;
  gap: 10px;
  list-style: none;
  color: var(--color-text-on-dark-muted);
  font-size: var(--font-size-small);
}
.catalog-promo__perks li { padding-inline-start: 20px; position: relative; }
.catalog-promo__perks li::before {
  content: "";
  position: absolute;
  inset-block-start: .55em;
  inset-inline-start: 0;
  inline-size: 8px;
  block-size: 8px;
  border-radius: 50%;
  background: var(--color-accent);
}

@media (max-width: 860px) { .catalog-promo { grid-template-columns: minmax(0, 1fr); } }

}
