
/* ==========================================
   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;
  }
}

/* v18: Full-bleed particles remain BEHIND the entire hero content.
   Scope strictly to the homepage hero; do not alter other page layouts. */
body.home .dnj-hero,
body.front-page .dnj-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
body.home .dnj-hero > .dnj-cosmic-background,
body.front-page .dnj-hero > .dnj-cosmic-background {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 0 !important;
  pointer-events: none !important;
}
body.home .dnj-hero > .dnj-cosmic-cursor-glow,
body.front-page .dnj-hero > .dnj-cosmic-cursor-glow {
  z-index: 0 !important;
  pointer-events: none !important;
}
body.home .dnj-hero > :not(.dnj-cosmic-background):not(.dnj-cosmic-cursor-glow),
body.front-page .dnj-hero > :not(.dnj-cosmic-background):not(.dnj-cosmic-cursor-glow) {
  position: relative;
  z-index: 2;
}
body.home .dnj-hero .wp-block-image,
body.home .dnj-hero img,
body.front-page .dnj-hero .wp-block-image,
body.front-page .dnj-hero img {
  position: relative;
  z-index: 3;
}

/* v19: Homepage hero heading typography only.
   Preserve all existing particle, image, navigation and book styles. */
body.home .dnj-hero .dnj-hero-title,
body.front-page .dnj-hero .dnj-hero-title {
  font-size: clamp(2.35rem, 4.2vw, 3.5rem) !important;
  line-height: 1.12 !important;
  letter-spacing: -0.025em;
  overflow-wrap: normal;
}
@media (max-width: 600px) {
  body.home .dnj-hero .dnj-hero-title,
  body.front-page .dnj-hero .dnj-hero-title {
    font-size: clamp(2rem, 8.3vw, 2.65rem) !important;
    line-height: 1.14 !important;
  }
}
