/* Columns: two equal columns, each an optional image, a heading and text. */
.columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
}
.columns__item > img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background: var(--c-surface);
  margin-bottom: 24px;
}
.columns__item > img.columns__logo { object-fit: contain; padding: 16px; }
.columns__item h2 { text-align: center; font-size: 24px; margin-bottom: 1em; }
.columns__item p, .columns__item ol { padding: 0 8px; }
@media (max-width: 760px) {
  .columns { grid-template-columns: 1fr; }
}