Grid Dividers

.wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 24px;
  gap: 24px;
  max-width: 550px;
  margin: 0 auto;
}
.story img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  border-radius: 4px;
}
.featured.story {
  grid-column: 1 / -1;
}

<div class="wrapper">
  <article class="featured story">
    <img src="/course-materials/meerkat.jpg" alt="A curious meerkat pops up" />
    <h2>
      Study: Meerkats unseat dolphins as nature's smartest animal
    </h2>
    <p>
      Meanwhile, humans come in 4th, right after the surprisingly-wiley platypus.
    </p>
  </article>
  <article class="story">
    <img src="/course-materials/night-sky.jpg" alt="A vibrant shot of the night sky" />
    <h2>
      The Search for Extra-Terrestrial Life
    </h2>
    <p>
      In Ukraine, a team of dedicated interdisciplinary professionals work to answer one of history's longest unanswered questions: what's going on, up there?
    </p>
  </article>
  <article class="story">
    <img src="/course-materials/wall-art.jpg" alt="A colorfully-lit hallway" />
    <h2>
      The TIFF's Must-Watch List
    </h2>
    <p>
      As the Toronto International Film Festival picks up, 5 intrepid reporters will dedicate the week to watching every available film. At the top of the list so far: “Ephemeral Hallway”.
    </p>
  </article>
</div>