/* Desktop page-guide readability: isolate navigation content from page imagery. */
@media (min-width: 1121px) {
  html body .site-header > .nav-mega {
    background: #f7f6f2 !important;
    border-color: rgba(35, 43, 45, 0.16) !important;
    box-shadow:
      0 34px 84px rgba(24, 29, 31, 0.22),
      0 8px 24px rgba(24, 29, 31, 0.1),
      inset 0 1px 0 #fff !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  html body .site-header > .nav-mega::after {
    opacity: 0.32 !important;
  }

  html body .site-header .nav-mega-intro {
    border: 0 !important;
    background:
      radial-gradient(circle at 86% 18%, rgba(79, 173, 166, 0.24), transparent 30%),
      linear-gradient(148deg, #263437, #182326) !important;
    background:
      radial-gradient(circle at 86% 18%, color-mix(in srgb, var(--nav-accent) 38%, transparent), transparent 30%),
      linear-gradient(148deg, #263437, #182326) !important;
    box-shadow:
      0 18px 40px rgba(22, 29, 31, 0.2),
      inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
  }

  html body .site-header .nav-mega-intro > p {
    color: rgba(218, 239, 235, 0.82) !important;
  }

  html body .site-header .nav-mega-intro h2 {
    color: #fff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.16) !important;
  }

  html body .site-header .nav-mega-intro > span {
    color: rgba(255, 255, 255, 0.76) !important;
  }

  html body .site-header .nav-mega-number {
    color: rgba(255, 255, 255, 0.1) !important;
  }

  html body .site-header .nav-mega-guide {
    margin: 0 10px !important;
    border: 1px solid rgba(39, 48, 50, 0.1) !important;
    border-radius: 20px !important;
    background: #efeee9 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.86) !important;
  }

  html body .site-header .nav-mega-guide > p {
    color: #5d514b !important;
  }

  html body .site-header .nav-mega-guide-link,
  html body .site-header .nav-mega-guide-link:nth-child(2),
  html body .site-header .nav-mega-guide-link:nth-child(3) {
    border-color: rgba(44, 53, 55, 0.13) !important;
    background: #fff !important;
    box-shadow:
      0 8px 20px rgba(34, 39, 41, 0.07),
      inset 0 1px 0 #fff !important;
  }

  html body .site-header .nav-mega-guide-link > span {
    color: #1f2729 !important;
  }

  html body .site-header .nav-mega-guide-link > small {
    color: #62686a !important;
  }

  html body .site-header .nav-mega-guide-link:hover,
  html body .site-header .nav-mega-guide-link:focus-visible {
    border-color: color-mix(in srgb, var(--nav-accent) 46%, #879092) !important;
    background: color-mix(in srgb, var(--nav-accent) 7%, #fff) !important;
    box-shadow:
      0 16px 32px rgba(34, 39, 41, 0.12),
      inset 0 1px 0 #fff !important;
  }

  html body .site-header .nav-mega-specials {
    background: #ebeae5 !important;
    border-color: rgba(44, 53, 55, 0.11) !important;
  }

  html body .site-header .nav-mega-special:not(.is-live) {
    background: #fff !important;
    border-color: rgba(44, 53, 55, 0.12) !important;
  }

  html body .site-header .nav-mega-special:not(.is-live) strong {
    color: #252c2e !important;
  }

  html body .site-header .nav-mega-special:not(.is-live) small {
    color: #62686a !important;
  }
}