/* ==========================================
   DR. NORMAN JOHNSON
   COSMIC PARTICLE HERO
   ========================================== */

.dnj-hero {
  position: relative;
  isolation: isolate;
}

/* Full-size decorative particle layer */

.dnj-cosmic-background {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

/* Connected particle network */

.dnj-cosmic-network {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

/* Individual glowing cyan particles */

.dnj-cosmic-particle {
  position: absolute;
  display: block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(103, 232, 249, 0.7);
  box-shadow: 0 0 12px #67e8f9;
  pointer-events: none;
}

/* Cyan cursor-following glow */

.dnj-cosmic-cursor-glow {
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  width: 256px;
  height: 256px;
  border-radius: 50%;
  background: rgba(34, 211, 238, 0.1);
  filter: blur(64px);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

/* Ensure Gutenberg hero content
   appears above decorative elements. */

.dnj-hero > .dnj-hero-content {
  position: relative;
  z-index: 2;
}

/* Prevent decoration from blocking buttons */

.dnj-hero .wp-block-button__link {
  position: relative;
  z-index: 3;
}

/* Accessibility: reduced motion */

@media (prefers-reduced-motion: reduce) {
  .dnj-cosmic-particle {
    animation: none !important;
  }

  .dnj-cosmic-cursor-glow {
    display: none;
  }
}