.categories {
  background-color: var(--page-content-background-white-color);
  border-block-end: 2px solid var(--page-categories-border-color);
  padding-block: 2rem;
  padding-inline: 1rem;
}

.categories .container {
  align-items: flex-start;
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(var(--row-item-count), 1fr);
  justify-content: center;
}

.categories a {
  --shine-from-color: var(--body-font-color-shining);
  --shine-to-color: var(--body-font-color);
  color: inherit;
  text-align: center;
}

.categories a h2 {
  font-size: 1rem;
  padding-block-start: 1rem;
  word-break: break-word;
}

.categories a img {
  height: 48px;
  width: auto;
}

@media (max-width: 991.98px) {
  .categories .container {
    gap: 0.5rem;
  }

  .categories a h2 {
    font-size: 0.875rem;
  }

  .categories .container {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 575.98px) {
  .categories .container {
    gap: 0.25rem;
  }

  .categories a h2 {
    font-size: 0.7rem;
  }
}