.fizz-layout-sidebar-main {
  --sidebar-max-width: 248px;
  display: grid;
  grid-template-columns: 1fr;
}

@media (min-width: $breakpoint-m) {
  .fizz-layout-sidebar-main {
    gap: $spacing-32;
    grid-template-columns: var(--sidebar-max-width) 1fr;
    grid-template-areas: "sidebar main";
    [data-grid-area="sidebar"] {
      grid-area: sidebar;
    }
    [data-grid-area="main"] {
      grid-area: main;
    }
  }
}