.header-sticky {
  z-index: 30;
  position: sticky;
  inset-block-start: 0;
  pointer-events: none;
}

.header-sticky.header-scrolled .header__bottom {
  box-shadow: 0 4px 18px rgba(var(--color-foreground), 0.1);
}

body:not(.header-pinned) .header-scrolled {
  pointer-events: none;
}

body:not(.header-pinned) .header-scrolled .header {
  transform: translateY(-100%);
}