//
// Default page layout without grid
//

.page-layout-xl--default,
.page-layout-md--default,
.page-layout-md--no-margin {
  padding: $spacer-sm;
}

//
// Media Queries
//

@media screen and (min-width: $grid-breakpoint-md) {
  // Landing Page width, content max-width is 1440px
  .page-layout-xl--default {
    width: $default-page-layout-width-xl;
    max-width: $default-page-layout-content-width-xl;
  }

  .page-layout-md--no-margin {
    margin: 0 auto;
  }

  // Content Page width, content max-width is 800px
  .page-layout-md--no-margin,
  .page-layout-md--default {
    width: $default-page-layout-width-md;
    max-width: $default-page-layout-content-width-md;
  }

  // Unified spacings for both variants
  .page-layout-xl--default,
  .page-layout-md--default {
    margin: $default-page-layout-margin auto;
  }

  main > .page-layout-xl--default,
  main > .page-layout-md--default {
    &:first-child {
      margin-top: $default-page-layout-to-top-margin;
    }
  }
}