grid-area: именованные зоны header–main–footer
Сокращение для grid-template-areas.
Свойство `grid-area: main` привязывает элемент к имени из `grid-template-areas` — меньше магических координат `grid-column: 1 / 3`.
Один и тот же класс `.site-main` работает при смене карты зон на мобильном через media query.
- grid-area — MDN — Сокращение row/column area.
- grid-template-areas — MDN — Карта зон.
Доступность
Порядок в DOM не обязан совпадать с визуальным — не переставляйте фокус tab order только CSS-ом.