/* =====================================================================
   STICKY AUTO-HIDING HEADER  (behaviour only — see js/sticky-header.js)

   The wrapper sits at the header's original origin inside #stage, so the
   header's own left/top are untouched and the resting render is unchanged.
   ===================================================================== */

#stickyHeader {
  position: absolute;
  left: 0;
  top: 0;
  width: 1280px;
  height: 0;
}

/* Only raised once actually scrolled, so at rest no stacking context is
   created and nothing about the resting paint changes. */
#stickyHeader.is-stuck { z-index: 9000; }

/* Figma OUT_CUBIC, matching the rest of the site's motion. */
.sticky-hdr {
  transition: transform 300ms cubic-bezier(0.215, 0.61, 0.355, 1),
              opacity   300ms cubic-bezier(0.215, 0.61, 0.355, 1);
}

.sticky-hdr.is-hidden {
  transform: translateY(var(--hdr-hide, -129px));
  opacity: 0;
  pointer-events: none;
}

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