@charset "UTF-8";
/* Front-end styles for the UAX Node Hero block */
/* Compiled from src/styles/NodeHero.scss to assets/styles/NodeHero.css */
/* ---- Containment + static fallback (always visible) ---- */
.uax-node-hero {
  position: relative; /* stylelint-disable-line property-disallowed-list -- required for canvas overlay positioning */
  overflow: hidden;
  clip-path: inset(0); /* Hard clip — prevents shadowBlur bleed */
}

/* ---- Canvas layer — always in DOM, sized by absolute positioning ---- */
.uax-node-hero__canvas {
  position: absolute; /* stylelint-disable-line property-disallowed-list -- overlay positioning */
  inset: 0;
  inline-size: 100%;
  block-size: 100%;
  display: block;
  z-index: 0;
}

/* ---- JS-initialized: hide static fallback, canvas takes over ---- */
/* ---- Content stays above canvas ---- */
.uax-node-hero > .uax-node-hero__inner-container {
  position: relative; /* stylelint-disable-line property-disallowed-list -- stacking context */
  z-index: 3;
}

/* ---- Reduced motion: hide canvas, keep static JPEG ---- */
@media (prefers-reduced-motion: reduce) {
  .uax-node-hero__canvas {
    display: none;
  }
  .uax-node-hero[data-initialized] {
    background-image: revert !important; /* stylelint-disable-line declaration-no-important -- restore fallback */
  }
}