main .article { grid-area: article; }
main .sidebar { grid-area: sidebar; }
main .advert { grid-area: advert; }
main {
  display: grid;
  gap: calc(var(--spacing) * 4);
  grid-template-areas: 'article' 'sidebar' 'advert';
}
@media (min-width: 700px) {
  main {
    grid-template-columns: 2fr 1fr;
    grid-template-areas:
    'article sidebar'
    'article advert';
  }
}

main .sidebar, main .advert {
  border: 1px solid black;
}