#header {
  --topbar-padding: 1.5vw;
  background: transparent;
}

#header.shrink {
  --topbar-padding: 0.9vw;
}

#header .header-announcement-bar-wrapper {
  min-height: 44px;
  padding-top: max(0px, calc(var(--topbar-padding) - 20px));
  padding-bottom: max(0px, calc(var(--topbar-padding) - 20px));
  background: #f7f7f8;
  opacity: 1;
  border-bottom: 1px solid rgba(24, 24, 27, 0.1);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6),
    0 4px 20px rgba(24, 24, 27, 0.06);
}

#header .header-background {
  background: transparent;
}

#header .header-title-text a,
#header .header-nav-item a,
#header .header-menu-nav-item a {
  color: #18181b;
}

#header .burger-inner > div {
  background-color: #18181b;
}

#header .header-nav-item--active a,
#header .header-menu-nav-item--active .header-menu-nav-item-content {
  background-image: none;
  text-decoration-line: underline;
  text-decoration-style: wavy;
  text-decoration-color: currentColor;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
}

#header .header-menu-bg {
  background: #f7f7f8;
}

@media only screen and (pointer: coarse) and (max-width: 1024px),
  screen and (max-width: 799px) {
  #header {
    --topbar-padding: 3vw;
  }

  #header.shrink {
    --topbar-padding: min(3vw, 1vmax);
  }
}

@supports (backdrop-filter: blur(20px)) or (-webkit-backdrop-filter: blur(20px)) {
  #header .header-announcement-bar-wrapper {
    background: rgba(255, 255, 255, 0.58);
    -webkit-backdrop-filter: blur(20px) saturate(160%);
    backdrop-filter: blur(20px) saturate(160%);
  }
}

@media (prefers-reduced-transparency: reduce) {
  #header .header-announcement-bar-wrapper {
    background: #f7f7f8;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}