.wl-header {
  position: relative;
  z-index: 30;
  color: var(--color-on-dark);
  background: var(--color-dark);
  border: 0;
  backdrop-filter: none;
}

.wl-header--over-hero {
  position: absolute;
  inset: auto 0 auto;
  background: transparent;
}

.wl-header__inner {
  position: relative;
  min-height: var(--header-height);
  gap: var(--header-gap);
  padding-block: 0;
  padding-inline: max(var(--space-page-fluid), calc((100% - var(--container-max)) / 2));
}

.wl-header__top { display: contents; }

.wl-header__inner::after {
  content: '';
  pointer-events: none;
  position: absolute;
  bottom: 0;
  inset-inline: max(var(--space-page-fluid), calc((100% - var(--container-max)) / 2));
  height: 1px;
  background: rgba(var(--color-on-dark-rgb), 0.48);
}

.wl-header__brand {
  flex: 0 0 var(--header-logo-width);
  line-height: 0;
}

.wl-header__brand img {
  display: block;
  width: 100%;
}

.wl-header__navigation {
  display: flex;
  align-items: center;
  gap: var(--header-gap);
  font-size: var(--header-font-size);
  font-weight: 400;
}

.wl-menu {
  align-items: center;
  gap: var(--header-nav-gap);
}

.wl-menu a,
.wl-header__cta,
.wl-lang a {
  text-decoration: none;
  white-space: nowrap;
}

.wl-menu a {
  display: inline-block;
  padding-block: 14px;
}

.wl-menu a:hover,
.wl-lang a:hover {
  text-decoration: underline;
  text-underline-offset: 0.35em;
}

.wl-header__cta {
  font-family: var(--font-button);
  padding: var(--header-cta-py) var(--header-cta-px);
  border: 1px solid rgba(var(--color-on-dark-rgb), 0.8);
  border-radius: var(--radius-pill);
  background: rgba(var(--color-on-dark-rgb), 0.12);
  transition: background-color 160ms ease;
}

.wl-header__cta:hover {
  background: rgba(var(--color-on-dark-rgb), 0.25);
}

.wl-lang {
  position: relative;
  z-index: 1;
}

.wl-lang__toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  cursor: pointer;
  list-style: none;
}

.wl-lang__toggle::-webkit-details-marker { display: none; }

.wl-lang__toggle::after {
  content: '';
  width: 7px;
  height: 7px;
  border: solid currentColor;
  border-width: 0 1px 1px 0;
  transform: translateY(-2px) rotate(45deg);
  transition: transform 280ms ease;
}

.wl-lang[open]:not(.is-closing) .wl-lang__toggle::after {
  transform: translateY(2px) rotate(225deg);
}

.wl-lang__list {
  position: absolute;
  top: 100%;
  inset-inline-start: -12px;
  padding: 4px;
  min-width: 72px;
  list-style: none;
  margin: 0;
  border: 1px solid rgba(var(--color-on-dark-rgb), 0.25);
  border-radius: var(--radius-sm);
  background: var(--color-dark);
}

.wl-lang__item a {
  display: block;
  padding: 12px;
}

.wl-lang__item.is-current { display: none; }
.wl-lang.is-animating .wl-lang__list { overflow: hidden; }

.wl-header__toggle { display: none; }

.wl-skip-link {
  position: fixed;
  z-index: 1000;
  top: 8px;
  left: 8px;
  padding: 14px 20px;
  color: var(--color-dark);
  background: var(--color-on-dark);
  transform: translateY(-160%);
}

.wl-skip-link:focus { transform: translateY(0); }

:where(a, button, summary):focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 5px;
}

@media (max-width: 1100px) {
  .wl-header__inner { display: block; min-height: 0; }
  .wl-header__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: var(--header-height);
  }
  .wl-header__navigation {
    width: 100%;
    flex-direction: column;
    align-items: center;
    gap: var(--space-sm);
    padding-block: var(--space-md) var(--space-lg);
    font-size: 16px;
  }
  .wl-header__nav .wl-menu {
    width: 100%;
    align-items: stretch;
    flex-direction: column;
    gap: 0;
  }
  .wl-header__nav .wl-menu > li { text-align: center; }
  .wl-menu a { display: block; }
  .wl-header__cta { align-self: center; }
  .wl-header__toggle:not([hidden]) {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 7px;
    width: 44px;
    height: 44px;
    padding: 10px;
    background: transparent;
    border: 0;
    color: inherit;
    cursor: pointer;
  }
  .wl-header__toggle span {
    display: block;
    width: 24px;
    height: 1px;
    background: currentColor;
    transition: transform 160ms ease;
  }
  .wl-header.has-menu-js:not(.is-menu-open) .wl-header__navigation { display: none; }
  .wl-header.is-menu-open,
  .wl-header:not(.has-menu-js) { background: var(--color-dark); }
  .wl-header.is-menu-open .wl-header__navigation {
    max-height: calc(100dvh - var(--header-height) - 32px);
    overflow-y: auto;
  }
  .wl-header.is-menu-open .wl-header__toggle span:first-child { transform: translateY(4px) rotate(45deg); }
  .wl-header.is-menu-open .wl-header__toggle span:last-child { transform: translateY(-4px) rotate(-45deg); }
  .wl-lang.is-mobile { width: 100%; }
  .wl-lang.is-mobile .wl-lang__toggle { display: none; }
  .wl-lang.is-mobile .wl-lang__list,
  .wl-lang.is-mobile:not([open]) > .wl-lang__list {
    position: static;
    display: flex;
    justify-content: center;
    gap: var(--space-lg);
    width: 100%;
    min-width: 0;
    padding: 0;
    border: 0;
    background: transparent;
  }
  .wl-lang.is-mobile .wl-lang__item.is-current { display: block; }
  .wl-lang.is-mobile .wl-lang__item a { padding: 8px 12px; }
  .wl-lang.is-mobile .wl-lang__item.is-current a { font-weight: 600; }
}

@media (prefers-reduced-motion: reduce) {
  .wl-header__cta,
  .wl-lang__toggle::after,
  .wl-header__toggle span { transition: none; }
}


.wl-header__nav { position: relative; }

.wl-menu-indicator {
  position: absolute;
  inset-inline-start: 0;
  bottom: 7px;
  height: 1px;
  background: currentColor;
  opacity: 0;
  pointer-events: none;
}

.wl-menu-indicator.is-ready {
  transition: transform 380ms cubic-bezier(0.22, 1, 0.36, 1), width 380ms cubic-bezier(0.22, 1, 0.36, 1), opacity 160ms ease;
}

.wl-menu-indicator.is-visible { opacity: 1; }

@media (min-width: 1101px) {
  .has-moving-underline .wl-menu a:hover { text-decoration: none; }
}

@media (max-width: 1100px) {
  .wl-menu-indicator { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .wl-menu-indicator.is-ready { transition: none; }
}