/* ── Sticky header: pinned + smooth collapse ────────────────────────────
   #header stays position:sticky so page content never reflows when the
   compact style activates. The collapse animates via height / max-height /
   opacity instead of an instant display:none snap. */

#header {
  position: sticky;
  top: 0;
  z-index: 1030;
  transition: height .4s cubic-bezier(.22, .61, .36, 1),
              opacity .3s ease;
}

#header .header-body {
  transition: min-height .4s cubic-bezier(.22, .61, .36, 1),
              padding .4s cubic-bezier(.22, .61, .36, 1),
              background .35s ease,
              box-shadow .35s ease;
}

/* No backdrop-filter on the pinned header: a blurred backdrop repaints
   every scroll frame (huge cost on weak GPUs). A near-opaque background
   looks the same but scrolls on the compositor for free. Also narrow the
   critical CSS `transition:all` so the filter/backdrop never tweens. */
#header.sticky-header-active .header-body {
  background: rgba(255, 255, 255, .94) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: min-height .4s cubic-bezier(.22, .61, .36, 1),
              padding .4s cubic-bezier(.22, .61, .36, 1),
              background .35s ease,
              box-shadow .35s ease !important;
}
html[data-theme="dark"] #header.sticky-header-active .header-body {
  background: rgba(10, 14, 26, .96) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

#header .header-logo,
#header .rsb-header-logo,
#header .rsb-3d-logo,
#header .rsb-3d-logo-inner {
  transition: all .45s cubic-bezier(.4, 0, .2, 1);
}

/* Rows hidden in the compact state collapse smoothly. display:flex here
   overrides the critical CSS `display:none !important` (same specificity,
   this file loads later) so the height animation can actually play. */
#header .header-nav-top,
#header .header-row.pt-3 {
  overflow: hidden;
  max-height: 240px;
  visibility: visible;
  transition: min-height .4s cubic-bezier(.22, .61, .36, 1),
              max-height .4s cubic-bezier(.22, .61, .36, 1),
              opacity .28s ease,
              padding .4s cubic-bezier(.22, .61, .36, 1),
              margin .4s cubic-bezier(.22, .61, .36, 1),
              visibility 0s;
}

#header.sticky-header-active .header-nav-top,
#header.sticky-header-active .header-row.pt-3 {
  display: flex !important;
  min-height: 0 !important;
  max-height: 0 !important;
  opacity: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  border-width: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
  /* let the collapse finish before hiding it from focus */
  transition: min-height .4s cubic-bezier(.22, .61, .36, 1),
              max-height .4s cubic-bezier(.22, .61, .36, 1),
              opacity .28s ease,
              padding .4s cubic-bezier(.22, .61, .36, 1),
              margin .4s cubic-bezier(.22, .61, .36, 1),
              visibility 0s linear .42s;
}

/* Desktop: one sticky bar. An inline height on #header fights the
   menu and leaves a gap while the top row collapses. */
@media (min-width: 992px) {
  #header {
    height: auto !important;
    transition: none !important;
    overflow: visible !important;
  }
  #header .header-body,
  #header .header-nav,
  #header .header-nav-main {
    overflow: visible !important;
    transition: background .15s ease, box-shadow .15s ease !important;
  }
  #header .header-nav-top,
  #header .header-row.pt-3,
  #header.sticky-header-active .header-nav-top,
  #header.sticky-header-active .header-row.pt-3 {
    transition: opacity .12s ease !important;
  }
}

/* Desktop: one sticky bar. An inline height on #header fights the
   menu and leaves a gap while the top row collapses. */
@media (min-width: 992px) {
  #header {
    height: auto !important;
    transition: none !important;
    overflow: visible !important;
  }
  #header .header-body,
  #header .header-nav,
  #header .header-nav-main {
    overflow: visible !important;
    transition: background .15s ease, box-shadow .15s ease !important;
  }
  #header .header-nav-top,
  #header .header-row.pt-3,
  #header.sticky-header-active .header-nav-top,
  #header.sticky-header-active .header-row.pt-3 {
    transition: opacity .12s ease !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #header,
  #header .header-body,
  #header .header-logo,
  #header .rsb-header-logo,
  #header .rsb-3d-logo,
  #header .rsb-3d-logo-inner,
  #header .header-nav-top,
  #header .header-row.pt-3 {
    transition-duration: 0.01ms !important;
  }
}