Using two rows solves the issue.

Given the following HTML (just a simplified version of what was provided):

<div class="grid-container">
  <label>
    Pin
  </label>
  <div class="or">OR</div>
  <label>
    Mailing Address
  </label>

  <input type="text" />
  <input type="text" />
</div>

The following CSS puts it in two rows with the .or div spanning through the two rows:

.grid-container  {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  column-gap: 16px;
}

.or {
  grid-column: 2;
  grid-row: 1/3;
  background: red;
}

I added a background-color so you can see the OR cell spanning.