.ds-layout-masthead {
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto;
  max-width: 89.5rem;
  padding: 0 var(--ds-grid-gap);
  position: relative;
}

.ds-masthead {
  background: transparent;
  padding: 1rem 0 2rem;
  &.is-open,
  &.search-is-open {
    background: var(--ds-color-london-20);
    box-shadow: 0 0.125rem 0.25rem 0 rgba(0, 0, 0, 0.15);
  }
  &.account-is-open {
    background: var(--ds-color-london-100);
  }
}

.ds-masthead-nav {
  align-items: center;
  border-bottom: var(--ds-border-rule);
  border-top: var(--ds-border-rule);
  display: flex;
  flex: 1;
  flex-direction: row-reverse;
  margin: 0 0 0 1rem;
  width: 100%;
  .ds-masthead--secondary & {
    flex-direction: row;
  }
  .ds-masthead.is-open &,
  .ds-masthead.search-is-open & {
    border-color: var(--ds-color-london-35);
  }
}

.ds-masthead-nav-alpha {
  ul {
    align-items: center;
    display: flex;
  }
}

.ds-masthead-nav-alpha__item,
.ds-masthead-nav-beta__item {
  padding: 0 1rem;
}

.ds-masthead-nav-alpha__item {
  .ds-masthead-nav & {
    align-items: center;
    display: flex;
    height: 2rem;
  }
}

.ds-masthead-nav-beta__item--log-in {
  padding-right: 0;
  .ds-masthead-nav & {
    display: flex;
  }
  .ds-masthead.is-open &,
  .ds-masthead.account-is-open &,
  .ds-masthead.search-is-open & {
    border-color: var(--ds-color-london-100);
  }
}

.ds-masthead-nav-alpha__item--weekly-edition,
.ds-masthead-nav-alpha__item--the-world-in-brief {
  .ds-masthead-nav & {
    display: none;
  }
  .ds-masthead.account-is-open & {
    z-index: 98;
  }
}

.ds-masthead-nav-alpha__item--search {
  .ds-masthead-nav & {
    display: none;
  }
  .ds-masthead.account-is-open & {
    z-index: 98;
  }
}

.ds-masthead-nav-beta {
  display: flex;
  margin: 0 0 0 auto;
}

.ds-masthead-nav-beta__item {
  align-items: center;
  display: flex;
}

.ds-masthead-nav-beta__item--notification-bell {
  border-right: var(--ds-border-rule);
}

.ds-masthead-nav-beta__item--extra-item {
  border-right: var(--ds-border-rule);
  padding-right: 1rem;
  text-align: right;
  .ds-masthead.is-open &,
  .ds-masthead.search-is-open & {
    display: none;
  }
}

.ds-masthead-nav-alpha__item--menu {
  .ds-masthead.account-is-open & {
    z-index: 98;
  }
}

.ds-masthead-home {
  .ds-masthead.account-is-open & {
    z-index: 98;
  }
}

.ds-masthead-nav-beta__item--call-to-action {
  .ds-masthead & {
    border-right: var(--ds-border-rule);
    padding-left: 0;
    white-space: nowrap;
  }
  .ds-masthead.is-open &,
  .ds-masthead.search-is-open & {
    border-right: var(--ds-border-rule--inverse);
  }
  .ds-masthead.account-is-open & {
    z-index: 98;
  }
}

.ds-masthead-nav-lists {
  .ds-masthead:not(.is-open) & {
    clip: rect(0.0625rem, 0.0625rem, 0.0625rem, 0.0625rem);
    height: 0.0625rem;
    overflow: hidden;
    position: absolute;
    visibility: hidden;
    width: 0.0625rem;
  }
  .ds-masthead.is-open & {
    flex: 0 0 100%;
    margin: 1rem 0 0 0;
  }
  .ds-masthead-nav-alpha__item,
  .ds-masthead-nav-beta__item {
    border-bottom: var(--ds-border-rule--inverse);
    padding: 1rem 0 1rem;
    /* stylelint-disable-next-line no-descending-specificity */
    &--weekly-edition, /* stylelint-disable-next-line no-descending-specificity */
    &--the-world-in-brief {
      padding: 0 0 0.75rem;
    }
    /* stylelint-disable-next-line no-descending-specificity */
    &--weekly-edition {
      border: none;
      padding-top: 1rem;
    }
  }
}

.ds-masthead--secondary {
  .ds-masthead-nav-alpha__item {
    border: none;
  }
}

@media (--ds-viewport-max-medium) {
  .ds-masthead {
    &.is-open,
    &.account-is-open,
    &.search-is-open {
      box-sizing: border-box;
      left: 0;
      min-height: 100%;
      position: absolute;
      top: 0;
      width: 100%;
      z-index: 99;
    }
  }
  .ds-masthead-nav-alpha {
    .ds-masthead.is-open & {
      ul {
        justify-content: flex-end;
      }
    }
  }
  .ds-masthead-nav-beta__item {
    padding-left: 1rem;
  }
  .ds-masthead-nav-alpha__item {
    .ds-masthead.is-open & {
      .ds-navigation-link {
        font-size: var(--ds-type-scale-2);
        line-height: var(--ds-type-leading-upper);
      }
    }
  }
  .ds-masthead-nav-alpha__item--today {
    .ds-masthead.is-open & {
      border-bottom: 0;
      padding: 1rem 0 0;
      .ds-navigation-link {
        font-size: var(--ds-type-scale-3);
        line-height: var(--ds-type-leading-upper);
      }
    }
  }
  .ds-masthead-nav-alpha__item--weekly-edition,
  .ds-masthead-nav-alpha__item--the-world-in-brief {
    .ds-masthead.is-open & {
      .ds-navigation-link {
        font-size: var(--ds-type-scale-2);
        line-height: var(--ds-type-leading-upper);
      }
    }
  }
  .ds-navigation-link--icon-search,
  .ds-navigation-disclosure--icon-search {
    overflow: hidden;
    text-indent: -999rem;
  }
  .ds-masthead-nav-beta__item--search {
    .ds-masthead-nav & {
      display: none;
    }
    .ds-masthead.is-open & {
      .ds-navigation-link {
        font-size: var(--ds-type-scale-2);
        line-height: var(--ds-type-leading-upper);
        width: 100%;
      }
    }
  }
  .ds-masthead-nav-beta__item--call-to-action {
    .ds-masthead.is-open & {
      .ds-navigation-link {
        font-size: var(--ds-type-scale-2);
        line-height: var(--ds-type-leading-upper);
      }
    }
  }
}

@media (max-width: 29.9375rem) {
  .ds-masthead-nav-beta__item--call-to-action {
    .ds-masthead & {
      border-right: var(--ds-border-rule);
      padding-left: 0;
    }
  }
}

@media (max-width: 43.9375rem) {
  .ds-navigation-disclosure--icon-search {
    font-size: 0;
    &::before {
      margin: 0;
    }
    svg {
      display: none;
    }
  }
}

@media (--ds-viewport-max-large) {
  .ds-navigation-disclosure--icon-search {
    font-size: 0;
    &::before {
      margin: 0;
    }
    svg {
      display: none;
    }
  }
  .ds-masthead-nav {
    .ds-masthead--secondary & {
      .ds-masthead-nav-alpha__item:not(.ds-masthead-nav-alpha__item--menu) {
        display: none;
      }
    }
  }
}

@media (max-width: 67.9375rem) {
  .ds-masthead {
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    padding-top: 1.5rem;
  }
  .ds-masthead-nav-alpha__item--menu,
  .ds-masthead-nav-alpha__item--search {
    .ds-masthead.is-open &,
    .ds-masthead.account-is-open &,
    .ds-masthead.search-is-open & {
      border-color: var(--ds-color-london-35);
    }
  }
  .ds-masthead-nav-beta__item:not(.ds-masthead-nav-beta__item--call-to-action) {
    .ds-masthead--secondary & {
      display: flex;
    }
  }
  .ds-masthead-nav-beta__item--call-to-action {
    .ds-masthead.is-open & {
      .ds-navigation-link {
        width: 100%;
      }
    }
  }
  .ds-masthead--secondary {
    .ds-masthead-nav-lists {
      .ds-masthead-nav-beta__item--log-in {
        display: flex;
      }
    }
  }
}

@media (--ds-viewport-min-small) {
  .ds-masthead {
    padding-top: 1.25rem;
    .ds-masthead-nav-beta__item--call-to-action {
      border-right: var(--ds-border-rule);
      padding-right: 1rem;
    }
  }
  .ds-masthead-nav-alpha__item--weekly-edition,
  .ds-masthead-nav-alpha__item--the-world-in-brief {
    border-right: 0;
  }
  .ds-masthead-nav-alpha__item--menu {
    border: 0;
    margin-left: 0;
    padding-left: 0;
    padding-right: 1rem;
  }
  .ds-masthead-nav {
    flex-direction: row;
  }
}

@media (min-width: 30rem) {
  .ds-masthead-nav-alpha {
    margin-left: 0;
  }
}

@media (min-width: 30rem) and (--ds-viewport-max-medium) {
  .ds-masthead-nav-alpha__item--search {
    .ds-masthead:not(.ds-masthead--secondary) & {
      border-left: var(--ds-border-rule);
      border-right: var(--ds-border-rule);
      margin-left: -0.0625rem;
    }
    .ds-masthead.is-open &,
    .ds-masthead.search-is-open & {
      border-left: var(--ds-border-rule--inverse);
      border-right: var(--ds-border-rule--inverse);
    }
  }
}

@media (--ds-viewport-min-medium) {
  .ds-masthead {
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
    padding-top: 1.25rem;
  }
  .ds-layout-masthead {
    padding-left: var(--ds-grid-gutter);
    padding-right: var(--ds-grid-gutter);
  }
  .ds-masthead-nav {
    flex-direction: row;
    .ds-masthead-nav-beta__item--call-to-action {
      border-right: var(--ds-border-rule);
      padding-left: 0;
      .ds-masthead.is-open &,
      .ds-masthead.search-is-open & {
        border-right: var(--ds-border-rule--inverse);
      }
    }
  }
  .ds-masthead-nav-beta__item--log-in {
    padding-right: 0;
    .ds-masthead-nav-lists & {
      display: flex;
    }
    .ds-masthead-nav & {
      display: flex;
    }
  }
  .ds-masthead-nav-alpha__item--search {
    .ds-masthead:not(.ds-masthead--secondary) & {
      border-right: var(--ds-border-rule);
      display: flex;
      margin-top: -0.125rem;
    }
    .ds-masthead.search-is-open &,
    .ds-masthead:not(.ds-masthead--secondary).is-open & {
      border-right: var(--ds-border-rule--inverse);
    }
  }
  .ds-masthead-nav-alpha__item--menu {
    .ds-masthead:not(.ds-masthead--secondary) & {
      border-right: var(--ds-border-rule);
      padding: 0 1rem;
    }
    .ds-masthead.search-is-open &,
    .ds-masthead:not(.ds-masthead--secondary).is-open & {
      border-right: var(--ds-border-rule--inverse);
    }
    &.ds-masthead-nav-alpha__item {
      .ds-masthead:not(.ds-masthead--secondary) & {
        padding-left: 0.25rem;
      }
    }
  }
  .ds-masthead-nav-alpha ul {
    flex-direction: row;
  }
  .ds-masthead-nav-alpha__item,
  .ds-masthead-nav-beta__item {
    .ds-masthead.is-open .ds-masthead-nav-lists & {
      &:not(&--weekly-edition):not(&--the-world-in-brief) {
        padding: 1.125rem 0 1rem;
      }
    }
  }
}

@media (min-width: 44rem) {
  .ds-masthead-nav-beta__item--call-to-action {
    .ds-masthead.is-open:not(.ds-masthead--secondary) .ds-masthead-nav-lists & {
      display: none;
    }
  }
  .ds-masthead-nav-alpha__item--search {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }
}

@media (--ds-viewport-min-large) {
  .ds-masthead {
    padding-top: 1.5rem;
  }
  .ds-menu-disclosure,
  .ds-navigation-link--icon-account,
  .ds-navigation-disclosure--icon-account,
  .ds-navigation-link--icon-search {
    .ds-masthead-nav & {
      margin-top: -0.125rem;
    }
  }
  .ds-masthead-nav-alpha__item,
  .ds-masthead-nav-beta__item {
    padding: 0 1rem;
  }
  .ds-masthead-nav-alpha__item--search {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .ds-masthead-nav-beta__item--log-in {
    margin-top: -0.1875rem;
    padding-right: 0;
  }
  .ds-masthead-nav-alpha__item--weekly-edition,
  .ds-masthead-nav-alpha__item--the-world-in-brief {
    .ds-masthead-nav-lists & {
      display: none;
    }
    .ds-masthead-nav & {
      border-right: var(--ds-border-rule);
      display: flex;
      .ds-masthead.is-open &,
      .ds-masthead.search-is-open & {
        border-right: var(--ds-border-rule--inverse);
      }
    }
  }
  .ds-masthead-nav-alpha__item--menu {
    &.ds-masthead-nav-alpha__item {
      padding-left: 2rem;
    }
    .ds-masthead--secondary & {
      display: none;
      padding-right: 0;
    }
  }
  .ds-masthead-nav {
    .ds-masthead--secondary & {
      flex-direction: row;
    }
  }
  .ds-masthead-nav-beta {
    .ds-masthead--secondary & {
      margin-left: auto;
    }
  }
}

@media (min-width: 68rem) {
  .ds-masthead-nav {
    .ds-masthead--secondary & {
      flex-direction: row;
    }
  }
}

@media (--ds-viewport-min-xlarge) {
  .ds-masthead-nav-lists {
    > ul {
      display: grid;
      grid-column-gap: var(--ds-grid-gutter);
      grid-template: auto / repeat(12, 1fr);
    }
  }
}

@media (--ds-viewport-max-small) {
  .ds-masthead-nav-beta__item--log-in {
    padding: 0;
  }
  .ds-masthead {
    .ds-masthead-nav-beta__item--call-to-action {
      + .ds-masthead-nav-beta__item--log-in {
        .ds-account-disclosure__arrow {
          display: none;
        }
      }
    }
    &.is-open {
      .ds-masthead-nav-beta__item--call-to-action {
        border-right: none;
      }
    }
  }
  .ds-masthead-nav {
    flex-direction: row;
    .ds-masthead-nav-beta__item {
      border-right: none;
    }
  }
  .ds-masthead-nav-alpha__item {
    padding: 0;
  }
}

@media (max-width: 19.5625rem) {
  .ds-masthead-nav {
    margin-left: 0;
  }
  .ds-layout-masthead > a {
    margin-right: 1rem;
  }
  .ds-masthead-nav-alpha__item--menu {
    padding: 1rem 1rem 1rem 0;
  }
  .ds-masthead-nav-beta__item--log-in {
    padding: 1rem 0 1rem 0;
    white-space: nowrap;
  }
}

/* stylelint-disable-next-line */
.ds-masthead-nav-lists>ul.link-groups {
  > li {
    grid-column: auto / span 2;
  }
}