/* ======================================================================
   BMM Preload CSS (pre-hydration)
   Purpose: prevent layout flashes around breakpoint/JS init
   Loaded before main CSS. Dropped once body gets .bmm-ready
   ====================================================================== */

:root {
  /* Sensible fallback before JS writes the exact header height */
  --site-header-height: 64px;
}

/* Avoid transitions before hydration (prevents “blink” on breakpoint) */
body:not(.bmm-ready) .site-header,
body:not(.bmm-ready) .mega-menu,
body:not(.bmm-ready) .mega-dropdown,
body:not(.bmm-ready) #bmm-mobile {
  transition: none !important;
}

/* Keep dropdowns hidden until we’ve attached JS behaviors */
body:not(.bmm-ready) .mega-dropdown {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}

/* Mobile panel: keep fully hidden until hydrated */
body:not(.bmm-ready) #bmm-mobile,
body:not(.bmm-ready) [data-bmm-toggle],
body:not(.bmm-ready) #bmm-mobile-panel {
  transition: none !important;
}

/* Prevent accidental scroll-jumps from layout shifts on first paint */
body:not(.bmm-ready) .site-header {
  will-change: auto;
}

/* If fonts swap in later, avoid reflow storms */
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; }
}