/* Quietcation menu type: exactly two responsive states.
   Every navigation item uses the same scale. */

html[data-qc-mobile-page] body :is(.menu-overlay__nav, .site-menu-overlay__nav) a {
  box-sizing: border-box !important;
  color: #f5f1e8 !important;
  font-family: "larken", "Newsreader", Georgia, serif !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  letter-spacing: -.025em !important;
  text-decoration: none !important;
  text-transform: none !important;
}

/* Match the index navigation above the mobile breakpoint. */
@media (min-width: 761px) {
  html[data-qc-mobile-page] body :is(.menu-overlay__nav, .site-menu-overlay__nav) a {
    font-size: 48px !important;
  }
}

/* The five links keep the same calm scale and rhythm site-wide. */
html[data-qc-mobile-page] body :is(.menu-overlay__nav, .site-menu-overlay__nav) {
  row-gap: 16px !important;
}

@media (max-width: 760px) {
  html[data-qc-mobile-page] body :is(.menu-overlay__nav, .site-menu-overlay__nav) a {
    font-size: 34px !important;
  }
  html[data-qc-mobile-page] body :is(.menu-overlay__nav, .site-menu-overlay__nav) {
    row-gap: 13px !important;
  }
}

/* A single gap controls spacing; never add margins on top of it. */
html[data-qc-mobile-page] body :is(.menu-overlay__nav, .site-menu-overlay__nav) a + a {
  margin-top: 0 !important;
}

/* Place pages keep the masthead over the hero until the first scroll. The
   palette stylesheet also serves beige editorial pages, so this more specific
   place-only state must come last: no green hairline and light controls on the
   transparent hero header. */
html.qc-place-page body:not(.menu-open) > .masthead:not(.is-scrolled),
html.qc-place-page body:not(.menu-open) > .masthead:not(.is-scrolled) :is(a, button) {
  background: transparent !important;
  background-color: transparent !important;
  border-bottom-color: transparent !important;
  color: #f5f1e8 !important;
}

html.qc-place-page body:not(.menu-open) > .masthead:not(.is-scrolled) {
  border-bottom: 0 !important;
  box-shadow: none !important;
}

html.qc-place-page body:not(.menu-open) > .masthead:not(.is-scrolled) .menu-toggle span {
  background-color: #f5f1e8 !important;
}