.blog-card-list {
  column-gap: var(--gutter);
  display: grid;
  row-gap: var(--baseline);

  >.col {
    align-items: stretch;
    background-color: var(--color-white);
    border-radius: var(--border-radius);
    border: 1px solid var(--color-iron-400);
    color: var(--color-downriver-400);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: var(--space-lg) var(--gutter);
    row-gap: var(--baseline);
    scroll-margin-top: calc(var(--space-lg) + 1.5 * var(--baseline));

    >.grid {
      display: grid;
      row-gap: var(--baseline);

      >.header-underline {
        color: var(--color-downriver-400);
      }
    }
  }
}

@media (min-width: 64rem) {
  .blog-card-list {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 75rem) {
  .blog-card-list {
    grid-template-columns: repeat(3, 1fr);
  }
}