/* ============================================================================= * Rahkar — sticky + glassmorphism header (SITE-WIDE) and the homepage hero overlap. * * Loaded globally, AFTER header.css (a verbatim base). Uses the standard glass * tokens from glass.css so the header matches every other frosted surface. * * Behaviour (per the owner): * • EVERY non-home page: the header is frosted-glass + sticky. * • HOMEPAGE, at the very top (over the 100vh hero video): the header is FULLY * TRANSPARENT and shows only the logo + icons (desktop: cart/account; mobile: * hamburger + cart). Search form + category bar are hidden. * • HOMEPAGE, once you start scrolling: the WHOLE header turns to frosted glass * and everything comes back — desktop = logo + search + category bar + icons; * mobile = the mobile row + the search row — and it stays floating (fixed) * over the content all the way to the bottom of the page. * * The scrolled/at-top switch is driven by home-hero.js, which toggles * `rh-scrolled` on from the scroll position (NOT an IntersectionObserver * sentinel — a 100vh hero put the sentinel at the fold and mis-fired on load). * * Header breakpoint matches header.css: desktop ≥ 901px, mobile ≤ 900px. * Header root: `.rahkar-site-header`, wrapped by `