.header {
  box-shadow: 0px 6px 10px rgba(102, 120, 145, 0.15);
  background-color: #fff;
  position: relative;
  z-index: 2; }
  .header ~ * {
    z-index: 1; }

.region-header {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
  display: grid;
  grid-template-areas: "branding . controls hamburger" "nav nav nav nav";
  grid-template-columns: 1fr 5vw minmax(min-content, auto) minmax(min-content, auto);
  grid-template-rows: auto;
  grid-gap: calc(30px * 0.5) 2vw;
  padding-top: calc(30px * 0.5); }
  @media (min-width: 992px) {
    .region-header {
      display: flex;
      flex-direction: row;
      padding-bottom: calc(30px * 0.5); } }
  @media (min-width: 992px) and (min-width: 576px) {
    .region-header {
      max-width: 540px; } }
  @media (min-width: 992px) and (min-width: 768px) {
    .region-header {
      max-width: 720px; } }
  @media (min-width: 992px) and (min-width: 992px) {
    .region-header {
      max-width: 960px; } }
  @media (min-width: 992px) and (min-width: 1200px) {
    .region-header {
      max-width: 1140px; } }
  @media (min-width: 992px) and (min-width: 1260px) {
    .region-header {
      max-width: 1260px; } }
  @media (min-width: 992px) and (min-width: 1360px) {
    .region-header {
      max-width: 1360px; } }
  @media (min-width: 992px) and (min-width: 1760px) {
    .region-header {
      max-width: 1760px; } }
  .region-header::after {
    content: none; }
  .region-header > .promotion--brand {
    grid-area: branding;
    align-self: center; }
  .region-header > .search,
  .region-header > .promotion--navigation-primary {
    grid-area: nav;
    margin-left: auto; }
  .region-header > .promotion--navigation-primary {
    flex: 1; }
  .region-header > .control {
    grid-area: controls;
    align-self: center; }
    @media (min-width: 992px) {
      .region-header > .control {
        margin-left: 1rem; }
        .search-is-active .region-header > .control {
          margin-left: 0; } }
  .region-header > .control--responsive-menu {
    grid-area: hamburger; }
  .region-header .logo--primary {
    max-width: 50vw; }