Как сверстать такое на grid?

Question

[wakenbyWork]

Есть такой макет:

Макет

Знаю как сделать через auto-fit чтобы все карточки были одинакового размера:

.grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(304px, 1fr));
  grid-gap: 20px;
}

А как сделать как в макете?

Comments

[wakenbyWork]

Ankhena, Спасибо большое! Можете в ответ это вынести? Я бы выбрал как правильное решение

Answer 1

[Ankhena]

Большим ячейкам задаете grid-column: span 2

Answer 2

[Denis Melnikov]

На чистом вроде, для блока с 2мя ячейками

grid-column-start: 2;   
grid-column-end: 3;