.two-col {
    display: flex;
    flex-wrap: wrap;         
    margin: 0 -16px;
    box-sizing: border-box;
  }
  .two-col > .col {
    padding: 0 16px;
    width: 100%;
    margin-bottom: 24px;
    min-width: 0;           
  }

  /* On mobile: force col-1 content to the start */
  @media (max-width: 767px) {
    .two-col > .col-25,
    .two-col > .col-30 {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
    }
  }

  /* Between 768px and 1022px → 30/70 */
  @media (min-width: 768px) and (max-width: 1022px) {
    .two-col { flex-wrap: nowrap; }
    .two-col > .col-30 { flex: 0 0 30%; max-width: 30%; }
    .two-col > .col-70 { flex: 0 0 70%; max-width: 70%; }
  }

  /* From 1023px up → 25/75 */
  @media (min-width: 1023px) {
    .two-col { flex-wrap: nowrap; }
    .two-col > .col-25 { flex: 0 0 25%; max-width: 25%; }
    .two-col > .col-75 { flex: 0 0 75%; max-width: 75%; }
  }

  /* Add spacing to staff bio paragraphs */
  .two-col .card p {
    margin-top: 1em;
    margin-bottom: 1em;
  }