.site-header {
  transform: translateY(0);
  transition: transform 280ms cubic-bezier(.22, 1, .36, 1);
  will-change: transform;
}

.site-header.is-hidden {
  transform: translateY(calc(-100% - 2px));
}

@media (prefers-reduced-motion: reduce) {
  .site-header {
    transition: none;
  }
}