/**
 * Particle Background Styles — Full-Page Canvas
 *
 * Single <canvas id="pl-particle-canvas"> appended to document.body by JS.
 * Covers entire viewport at position:fixed with additive blending.
 *
 * Z-index layering:
 *   Content (#brx-content):        z-index 10 (base content)
 *   Canvas (#pl-particle-canvas):  z-index 1000 (above header glass — pointer-events:none makes it safe)
 *   Header (.bricks-template-header): z-index 999 (sticky glass — set in style.css)
 *   Mobile menu wrapper:           z-index 10000 (above canvas)
 */

/* Full-page particle canvas — fixed overlay above content AND header */
#pl-particle-canvas {
  position: fixed;
  inset: 0;
  z-index: 1000;
  pointer-events: none;
  mix-blend-mode: screen;
  opacity: 0.72;
}

/* Content layer — below canvas overlay (canvas remains non-interactive) */
#brx-content {
  position: relative;
  z-index: 10;
}

/* Footer layer — below canvas overlay */
.bricks-template-footer {
  position: relative;
  z-index: 10;
}

/* Reduced motion — hide canvas entirely (JS also skips creation) */
@media (prefers-reduced-motion: reduce) {
  #pl-particle-canvas {
    display: none;
  }
}