Grid-area, why is my header not spanning across both areas?

body {
  display: grid;
  grid-template-areas:
    "header header"
    "section1 section2"
    "section3 section4";
  grid-template-rows: 100px 1fr 1fr;
  grid-template-columns: 1fr 1fr;