m-b-01

HTML

<article>

  <section>
  <div class="purple"></div>
  <div class="salmon"></div>
  </section>
  
  <section>
    <div class="red"></div>
  </section>
  
</article>

CSS

article {
  margin: 0 ausuto;
  padding-top: 2rem;
}

section {
  max-width: 500px;
  margin: 0 auto;
  height: 280px;
  display: flex;
  flex-direction: row;
  margin-bottom: 2rem;
}

div {
  flex: 1
}

.purple {
  /* brand */
  background: rgba(83, 0, 191, 1);
  /* adjust: less saturation */
  /* background: #6318c6; */
  background: #5c0fbf;
  flex: 1.2;
}

.salmon {
  background: rgba(255, 96, 92, 1);
  /* adjust: lower saturation, cooler */
  background: #fc6373;
}

.red {
  background: #f81f44;
  max-height: 40px;
}