<div class="flex-container">
  <div class="flex-item"></div>
  <div class="flex-item"></div>
  <div class="flex-item"></div>
  <div class="flex-item"></div>
</div>

.flex-container {
  --gap: 40px;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap);
}

.flex-item {
  background: #f00;
  width: calc(50% - var(--gap) / 2);
  height: 200px;
}