/* Unicorn Studio aura.
   Decorative WebGL layer that sits behind the glass-strip container.
   Because .site-main .container has a backdrop-filter (see base.css),
   the aura gets softened into an ambient glow rather than competing
   with content. Pointer-events: none so it never intercepts clicks. */

.unicorn-aura {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;

  /* The TWG Unicorn scene (project SrJYfPcDUR4StI3maLL6) is already a
     light teal/blue wash on a near-white background, not a dark scene
     with bright auras. Screen-blending it against a light page washes
     the color out to near-white. Let it render normally at full
     opacity so the color is actually visible; the glass-strip
     container on top (see hero.css .hero--aura) softens it behind
     the copy via backdrop-filter blur. */
  opacity: 1;

  /* Fade at the top and bottom edges so the aura blends into the
     adjacent sections instead of ending in a hard line. */
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    black 8%,
    black 88%,
    transparent 100%
  );
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    black 8%,
    black 88%,
    transparent 100%
  );
}

/* The Unicorn Studio runtime mounts a <canvas> into this node. We set
   explicit width/height so the runtime has a layout size to sample
   before the canvas is inserted. */
.unicorn-aura__scene {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.unicorn-aura__scene canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
}

/* Reduced-motion users get a clean static strip. The aura component's
   inline loader already skips initialization for this case, so the
   canvas never renders — we just hide the empty container so there's
   no layout surprise. */
@media (prefers-reduced-motion: reduce) {
  .unicorn-aura { display: none; }
}
