@media (min-width: 1060px) {
  header {
    --pm-header-motion: 180ms ease;
    animation: pm-header-enter var(--pm-header-motion) both;
    transition:
      transform var(--pm-header-motion),
      opacity var(--pm-header-motion),
      background-color var(--pm-header-motion),
      border-color var(--pm-header-motion),
      box-shadow var(--pm-header-motion) !important;
    will-change: transform, opacity;
  }

  header > div,
  header a,
  header button,
  header span {
    transition:
      transform var(--pm-header-motion),
      opacity var(--pm-header-motion),
      color var(--pm-header-motion),
      background-color var(--pm-header-motion),
      border-color var(--pm-header-motion),
      box-shadow var(--pm-header-motion) !important;
  }

  header a:hover,
  header a:focus-visible,
  header button:hover,
  header button:focus-visible {
    transform: translateY(-1px);
  }
}

@keyframes pm-header-enter {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  header,
  header *,
  header *::before,
  header *::after {
    animation: none !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  header a:hover,
  header a:focus-visible,
  header button:hover,
  header button:focus-visible {
    transform: none !important;
  }
}
