/* Decorative only: canvas never intercepts links or obscures the hero copy. */
#hero-art {
  isolation: isolate;
}

#deco-atmosphere {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
  user-select: none;
  mix-blend-mode: screen;
  opacity: 0.9;
}

/* A brief silver-to-blue reveal; the page content remains immediately usable. */
@media (prefers-reduced-motion: no-preference) {
  body:not(.motion-paused) #hero-art > img {
    animation: deco-art-arrive 760ms ease-out both;
  }
}

@keyframes deco-art-arrive {
  from { opacity: 0.5; filter: brightness(1.13); }
  to { opacity: 1; filter: brightness(1); }
}

@media (max-width: 640px) {
  #deco-atmosphere { opacity: 0.76; }
}

body.motion-paused #hero-art > img,
body.page-inactive #hero-art > img,
body.hero-away #hero-art > img {
  animation-play-state: paused;
}

@media (prefers-reduced-motion: reduce) {
  #hero-art > img { animation: none !important; }
}