/* ==================================================================
   Guided — sticky header  (LOCAL PREVIEW ONLY)

   Only the stuck state is positioned. At rest the header is left
   exactly as authored, so the hero overlay and the published header
   height stay correct.

   It hides on the way down and returns on the way up: the bar is not
   worth permanent screen space, but reaching upward is exactly the
   moment someone wants it back.
   ================================================================== */

header.gs-stuck {
  position: fixed !important;
  top: 0; left: 0; right: 0;
  z-index: 900 !important;
  background: rgba(255, 255, 255, 0.82) !important;
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid rgba(0, 0, 0, 0.09) !important;
  transform: translateY(0);
  transition: transform 0.28s cubic-bezier(0.22, 0.9, 0.3, 1);
}

header.gs-stuck.gs-hidden { transform: translateY(-104%); }

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

/* the utility row ("Join the waitlist") is not worth 40px of a sticky
   bar — the nav keeps the page reachable and the CTA is never far */
header.gs-stuck > div:first-child { display: none !important; }

/* compress the logo row into a slim bar */
header.gs-stuck > div:last-child {
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  padding: 8px 40px !important;
}

header.gs-stuck img { width: 34px !important; height: 34px !important; }
header.gs-stuck nav { gap: 30px !important; font-size: 15px !important; }

/* the mobile menu, when open, must stay solid over the page */
header.gs-stuck.gs-open { background: #FFFFFF !important; }

@media (max-width: 1024px) {
  header.gs-stuck > div:last-child { padding: 8px 20px !important; }
  header.gs-stuck img { width: 30px !important; height: 30px !important; }
}

/* ------------------------------------------------------------------
   Trim the primary nav to four destinations.

   Research, Ages 6-16 and Homework help were anchors into the page you
   are already on — they duplicated scrolling rather than taking anyone
   anywhere. Our principles moves down to the footer with them. All four
   are still linked from the footer, so nothing becomes unreachable.

   Hidden with CSS, not removed: React owns this header and deleting one
   of its children throws removeChild on the next render and unmounts
   the whole page.
   ------------------------------------------------------------------ */
header nav a[href="#research"],
header nav a[href="#ages"],
header nav a[href="#homework"],
header nav a[href$="Our Principles.dc.html"] {
  display: none !important;
}

/* the mobile menu is a clone of the nav, so it needs the same trim */
.gs-navpanel a[href="#research"],
.gs-navpanel a[href="#ages"],
.gs-navpanel a[href="#homework"],
.gs-navpanel a[href$="Our Principles.dc.html"] {
  display: none !important;
}

/* the current page should not be a link to itself */
header nav a[aria-current="page"] { color: #0071E3 !important; }
