/*
 * Homepage desktop header: let the opening artwork continue behind the
 * navigation, then return to the paper-white information canvas on scroll or
 * while an interaction layer is open. Mobile keeps its approved treatment.
 */
@media (min-width: 981px) {
  html.is-home-page {
    --header-h: 112px;
  }

  html.is-home-page .site-header {
    grid-template-rows: 76px 36px;
    min-height: var(--header-h);
    transition:
      transform 280ms cubic-bezier(0.22, 1, 0.36, 1),
      background-color 280ms ease,
      border-color 280ms ease;
  }

  html.is-home-page .site-header .brand-logo {
    align-self: start;
    margin-top: 4px;
  }

  html.is-home-page .site-header .header-nav > a {
    height: 36px;
  }

  html.is-home-page:not(.is-home-scrolled):not(.is-menu-open):not(.is-nav-panel-open):not(.is-site-search-open) .site-header,
  html.is-home-page:not(.is-home-scrolled):not(.is-menu-open):not(.is-nav-panel-open):not(.is-site-search-open) .site-header:hover,
  html.is-home-page:not(.is-home-scrolled):not(.is-menu-open):not(.is-nav-panel-open):not(.is-site-search-open) .site-header:focus-within {
    border-bottom-color: transparent;
    background: transparent;
    backdrop-filter: none;
  }

  html.is-home-page.is-home-scrolled .site-header,
  html.is-home-page.is-menu-open .site-header,
  html.is-home-page.is-nav-panel-open .site-header,
  html.is-home-page.is-site-search-open:not(.is-home-scrolled):not(.is-menu-open):not(.is-nav-panel-open) .site-header {
    border-bottom-color: var(--line);
    background: rgba(250, 250, 248, 0.97);
    backdrop-filter: none;
  }

  html.is-home-page .site-header .header-nav > a,
  html.is-home-page .site-header .language-toggle,
  html.is-home-page .site-header .site-search-open,
  html.is-home-page.is-home-hero-dark:not(.is-home-scrolled):not(.is-menu-open):not(.is-nav-panel-open) .site-header .header-nav > a,
  html.is-home-page.is-home-hero-dark:not(.is-home-scrolled):not(.is-menu-open):not(.is-nav-panel-open) .site-header .language-toggle,
  html.is-home-page.is-home-hero-dark:not(.is-home-scrolled):not(.is-menu-open):not(.is-nav-panel-open) .site-header .site-search-open {
    color: rgba(24, 25, 24, 0.82);
    text-shadow: none;
  }

  html.is-home-page .site-header .brand-logo-wordmark,
  html.is-home-page.is-home-hero-dark:not(.is-home-scrolled):not(.is-menu-open):not(.is-nav-panel-open) .site-header .brand-logo-wordmark {
    opacity: 0.92;
    filter: grayscale(1) brightness(0.56) contrast(1.08);
  }

  html.is-home-page .hero-home-concept-carousel {
    height: 100svh;
    min-height: 100svh;
    margin-top: 0;
  }

  html.is-home-page .hero-home-concept-carousel .hero-home-message {
    height: 100%;
    min-height: 100%;
  }

  html.is-home-page .hero-home-concept-carousel .hero-home-message__inner {
    bottom: clamp(20px, 3vh, 30px);
  }

  html.is-home-page .hero-home-concept-carousel .home-hero-slide img {
    object-position: center 40%;
  }
}

html.is-home-page:not(.is-home-scrolled):not(.is-menu-open):not(.is-nav-panel-open) .site-header .brand-logo-wordmark,
html.is-home-page.is-home-scrolled .site-header .brand-logo-wordmark,
html.is-home-page.is-menu-open .site-header .brand-logo-wordmark,
html.is-home-page.is-nav-panel-open .site-header .brand-logo-wordmark,
html.is-home-page.is-site-search-open .site-header .brand-logo-wordmark,
html.is-home-page.is-home-opening.is-brand-intro-playing:not(.is-menu-open):not(.is-nav-panel-open) .site-header .brand-logo-wordmark {
  opacity: 0.92 !important;
  filter: grayscale(1) brightness(0.56) contrast(1.08) !important;
}

html.is-home-page.is-home-hero-dark:not(.is-home-scrolled):not(.is-menu-open):not(.is-nav-panel-open) .site-header .brand-logo-wordmark {
  opacity: 0.96 !important;
  filter: brightness(0) invert(1) drop-shadow(0 4px 20px rgba(0, 0, 0, 0.28)) !important;
}

@media (max-width: 980px) {
  html.is-home-page .site-header .brand-logo {
    width: 84px;
    height: 60px;
  }

  html.is-home-page .site-header .brand-logo-wordmark-frame {
    width: 84px;
  }
}