Как использовать flexbox в оболочке?

Question

Возникли некоторые проблемы при попытке создать определенный c раздел с помощью flexbox, но также внутри оболочки.

Мне нужно сделать так, чтобы он выглядел следующим образом:

В настоящее время мой код выглядит следующим образом:

Вот мои коды HTML / CSS:

.feature p {
  font-size: 39px;
  color: #333333;
  max-width: 400px;
}

.feature {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  background: #F6F8FA;
  height: 425px;
}

.firstSection {
  display: flex;
}

<section class="firstSection">
  <img src="https://picsum.photos/300/400" alt="van driving on a road next to a hill">
  <div>
    <img src="https://picsum.photos/400/200" alt="surfer on ocean">
    <div class="feature">
      <h2>Feature</h2>
      <p>Lorem ipsum dolor sit amet, consectetur</p>
      <a href="http://google.com" class="blueButton">Read More</a>
    </div>
  </div>
</section>

Если я попытаюсь добавить обертку в качестве второго класса, она полностью искажается, а не то, что я ищу. Я также попытался добавить другой тег как дочерний элемент тега, но это тоже не сработало. ПОМОГИТЕ!

Фрагмент обёртки ниже:

.wrapper {
  max-width: 1140px;
  width: 90%;
  margin: 0 auto;
}