department-of-veterans-affairs/vets-website

/* use flexbox to arrange contents of the Hub Component */
.hub-cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: units(4) units(2);

  /* direct descendants of .hub-cards, presumably "cards" */
  > * {
    /* small screens: display 1 card per row -- 100% width */
    flex-basis: 100%;

    @include media($medium-screen) {
      /* medium+ screens: display 2 cards per row -- 1/2 width minus column gap */
      flex-basis: calc(50% - 16px);
    }
  }
}

/* runt prevention -- https://www.google.com/search?q=runt+typography */
.small-screen--line-break-at-32-characters {
  display: inline-block;
  max-width: 32ch;

  @include media($medium-screen) {
    display: unset;
    max-width: unset;
  }
}

.medium-screen--line-break-at-40-characters {
  display: unset;
  max-width: unset;

  @include media($medium-screen) {
    display: inline-block;
    max-width: 40ch;
  }
}