/* ════════════════════════════════════════════════════════════════
   MYTHOS HOME — homepage-only cinematic layer
   Logo Genesis · warp starfield · hero blur-reveal · odometer reels
════════════════════════════════════════════════════════════════ */

/* ── Logo Genesis — particles assemble over the header logo ── */
.myth-logo-stage { position: relative; display: inline-flex; }
.myth-logo-cv {
  position: absolute; inset: 0; width: 100%; height: 100%;
  pointer-events: none; z-index: 2;
}

/* ── Warp starfield canvas (injected into hero behind content) ── */
#mythWarp {
  position: absolute; inset: 0; width: 100%; height: 100%;
  z-index: 0; pointer-events: none; opacity: .85;
}
.qhp-hero > .container { position: relative; z-index: 2; }

/* ── Odometer reels (hero stats) ── */
.ph-counter .m-col {
  display: inline-block; height: 1em; overflow: hidden;
  vertical-align: bottom; line-height: 1;
}
.ph-counter .m-reel {
  display: flex; flex-direction: column;
  transform: translateY(0);
  transition: transform 2.2s cubic-bezier(.22, 1, .36, 1);
}
.ph-counter .m-reel span { height: 1em; line-height: 1; display: block; }
.ph-counter .m-sep { display: inline-block; }

@media (prefers-reduced-motion: reduce) {
  #mythWarp, .myth-logo-cv { display: none !important; }
}