.Article {
  display: grid;
  grid-template-areas: 'main';
  grid-template-columns: 1fr;
}

.Article--withToc {
  gap: var(--base-size-48);
  grid-template-areas: 'main aside';
  grid-template-columns: 1fr 200px;
}

.main {
  grid-area: main;
  max-width: 100%;
  overflow-x: hidden;
}

.aside {
  grid-area: aside;
  position: relative;
}

@media screen and (max-width: 1023px) {
  .Article--withToc {
    grid-template-areas:
      'aside'
      'main';
    grid-template-columns: 1fr;
  }
}

@media screen and (min-width: 2048px) {
  .Article--withToc {
    grid-template-areas: 'main';
    grid-template-columns: 1fr;
  }
}
