detail elements in two columns with flex or grid

Question

I have a two column layout with elements. I would like, that when individual detail item is expanded, the adjacent cell on left or right, stays of same height (closed). Or in other words, I would like to only expand one column height, not both. How can I achieve that with only CSS? PS.: I can use either grid, or flexbox (but I would prefer flexbox).

* {
  box-sizing: border-box;
}

summary {
  display: flex;
}

details {
  border: 1px solid black;
}

.grid {
  display: flex;
  flex-wrap: wrap;
  margin-left: -1rem;
}

.grid__item {
  width: calc(50% - 1rem / 2);
  flex-grow: 1;
  flex-shrink: 0;
  padding-left: 1rem;
  padding-bottom: 1rem;
}

<div class="grid">
  <div class="grid__item">
    <details>
      <summary>
        <h2>Title</h2>
      </summary>
      <div class="content">
        <p>"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
          irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."</p>
      </div>
    </details>
  </div>
  <div class="grid__item">
    <details>
      <summary>
        <h2>Title</h2>
      </summary>
      <div class="content">
        <p>"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
          irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."</p>
      </div>
    </details>
  </div>
  <div class="grid__item">
    <details>
      <summary>
        <h2>Title</h2>
      </summary>
      <div class="content">
        <p>"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
          irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."</p>
      </div>
    </details>
  </div>
  <div class="grid__item">
    <details>
      <summary>
        <h2>Title</h2>
      </summary>
      <div class="content">
        <p>"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
          irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."</p>
      </div>
    </details>
  </div>
  <div class="grid__item">
    <details>
      <summary>
        <h2>Title</h2>
      </summary>
      <div class="content">
        <p>"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
          irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."</p>
      </div>
    </details>
  </div>
  <div class="grid__item">
    <details>
      <summary>
        <h2>Title</h2>
      </summary>
      <div class="content">
        <p>"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
          irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."</p>
      </div>
    </details>
  </div>
</div>