Four Card Feature Section

Grid are not that difficult, have a look :

#first-card {
  grid-area: first-card;
}

#second-card {
  grid-area: second-card;
}

#third-card {
  grid-area: third-card;
}

#fourth-card {
  grid-area: fourth-card;
}

...and then, the magic happen !

.wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr 1fr;
  grid-template-areas:
               ". second-card ."
      "first-card second-card fourth-card"
      "first-card third-card fourth-card"
               ". third-card .";
  }

You can custom your own grids on Layoutit.