/* Critical first-paint rules (CSP blocks inline <style>). */

html.scroll-boot-pending {
  background: #0a1136 !important;
}

html.scroll-boot-pending body {
  opacity: 0 !important;
  visibility: hidden !important;
}

html.scroll-boot-pending #hero,
html.scroll-boot-pending .hero {
  visibility: hidden !important;
  opacity: 0 !important;
}

html.scroll-boot-pending::before {
  content: '' !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483645 !important;
  background: #0a1136 !important;
  pointer-events: none !important;
}

/*
 * Same wipe as .project-page-veil — do NOT put !important on clip-path.
 * Keyframes cannot override an !important clip-path, so the wipe would never run
 * and the veil would only vanish when JS removes the node.
 */
#home-enter-veil {
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  pointer-events: none;
  background: #0a1136;
  transform-origin: 50% 0%;
  clip-path: inset(0 0 0 0);
}

#home-enter-veil.is-leaving {
  animation: home-enter-veil-leave 0.9s cubic-bezier(0.76, 0, 0.24, 1) forwards;
}

@keyframes home-enter-veil-leave {
  0% {
    clip-path: inset(0 0 0 0);
  }
  100% {
    clip-path: inset(0 0 100% 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  #home-enter-veil.is-leaving {
    animation-duration: 0.01ms;
  }
}

/* Show merged plate first; reveal parallax layers together when ready */
.hero:not(.hero--layers-ready) .hero__layer,
.hero:not(.hero--layers-ready) .hero__cloud {
  opacity: 0 !important;
  visibility: hidden !important;
}