.blog-meta {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  align-items: start;
  column-gap: 8px;
  color: var(--blog-purple);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  line-height: 1.45;
  text-transform: uppercase;
}

.blog-meta .blog-date {
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  text-transform: inherit;
}

.blog-keywords {
  align-self: center;
  color: inherit;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.07em;
  line-height: 1.35;
  text-transform: uppercase;
}

@media (max-width: 820px) {
  .blog-meta {
    column-gap: 7px;
  }

  .blog-keywords {
    font-size: 8px;
    letter-spacing: 0.045em;
  }
}