CSS Grid - Как добавить grid-row-row-gap после каждых 2 строк

Question

Следующий код - моя попытка создать пробелы после 2 строк. Это правильный способ добавить пробел после 2 строк или есть лучший способ сделать это?

[https://jsfiddle.net/jmjjeena/gjnhtks5/12/]

<--------- HTML -------->
<div class="container">
 <div class="sub-wrapper">
  <div>Name</div>
  <div>ABC</div>
 </div>
 <div class="sub-wrapper">
  <div>Address</div>
  <div>19 street</div>
 </div>
 <div class="sub-wrapper">
  <div>Notes</div>
  <div>add all notes here</div>
 </div>
</div>

<------------ CSS --------->
`body {
 padding: 20px;
 font-family: Helvetica;
 background-color: white;
 }

.container {
 display: grid;
 grid-template-columns: 1fr;
 grid-row-gap: 1em;
 grid-auto-rows: 1fr;
 box-sizing: border-box;
 border: 1px solid grey;
 border-radius: 5px;
 text-align: justify;
}

.sub-wrapper {
 display: grid;
 grid-template-columns: 1fr;
 grid-auto-rows: min-content;
 justify-content: start;
}`