#main {
  width: 100%;
  min-width: var(--min-width);
  max-width: var(--max-width);
  margin-inline: auto;
  padding: var(--space-lg) var(--container-padding) 0;
  overflow-x: hidden;
}

#content {
  width: 100%;
  overflow: hidden;
}

#main.with-sidebar,
#main.without-sidebar {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-md);
}

@media (min-width: 768px) {
  #main.with-sidebar {
    grid-template-columns: clamp(250px, 27%, 300px) auto;
  }
}