/* Baseline styling for outer-most site wrappers and structures */

.page-wrap {
  display: grid;
  grid-template-areas:
    "mobile-nav-fixed"
    "header"
    "header-feature"
    "page-body"
    "footer-feature-extra"
    "footer-feature"
    "footer";
}

.mobile-nav-bottom .page-wrap {
  grid-template-areas:
    "header"
    "header-feature"
    "page-body"
    "footer-feature-extra"
    "footer-feature"
    "footer"
    "mobile-nav-fixed";
}

.page-body {
  grid-area: page-body;
  width: 100%;
  padding: var(--spacing-variable-xl) var(--spacing-variable-xl) var(--spacing-variable-2xl) var(--spacing-variable-xl);
}

.page-body .content {
  max-width: var(--max-width-content-main);
  margin-left: auto;
  margin-right: auto;
}

.blog-landing .page-body {
  padding-bottom: 0;
}


/* Page Header */

.page-header {
  grid-area: header;
}

.page-header .header-inner {
  display: flex;
  justify-content: space-between;
  gap: 32px;
  align-items: center;
}




.feature-section {
  padding: var(--spacing-variable-3xl) var(--spacing-variable-xl);
}

.header-feature {
  grid-area: header-feature;
}

.footer-feature {
  grid-area: footer-feature;
}








/* Page Footer */

.page-footer {
  grid-area: footer;
}

.footer-inner {
  display: flex;
  width: 100%;
  max-width: var(--max-width-page-inner);
  flex-direction: column;
  align-items: center;
  flex: 1 0 0;
  margin-left: auto;
  margin-right: auto;
}