/* ─────────────────────────────────────────────────────────────
   Page heroes ("Home › Resources" bands) — the launching-page look:
   deep navy, dotted texture, drifting orange/violet glows and faint
   concentric rings. Loaded after every page stylesheet so it wins.
   Applies to .page-hero (notices, resources, team, about, course
   locator, details) and the newer .gl-hero / .ss-hero variants.
   ───────────────────────────────────────────────────────────── */
.page-hero, .gl-hero, .ss-hero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background:
    radial-gradient(60vw 60vw at -10% -30%, rgba(243,117,42,.32), transparent 60%),
    radial-gradient(55vw 55vw at 110% 130%, rgba(45,41,128,.85), transparent 60%),
    radial-gradient(30vw 30vw at 45% 110%, rgba(106,76,255,.22), transparent 60%),
    var(--navy-dark, #110E3A) !important;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

/* dotted texture + rings */
.page-hero::before, .gl-hero::before, .ss-hero::before {
  content: '' !important;
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-image:
    radial-gradient(circle at 50% 50%, transparent 0 calc(30vmin - 1px), rgba(255,255,255,.06) calc(30vmin - 1px) 30vmin, transparent 30vmin),
    radial-gradient(circle at 50% 50%, transparent 0 calc(46vmin - 1px), rgba(255,255,255,.05) calc(46vmin - 1px) 46vmin, transparent 46vmin),
    radial-gradient(circle at 50% 50%, transparent 0 calc(65vmin - 1px), rgba(255,255,255,.04) calc(65vmin - 1px) 65vmin, transparent 65vmin),
    radial-gradient(circle, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: 100% 100%, 100% 100%, 100% 100%, 34px 34px;
  background-position: 70% 50%, 70% 50%, 70% 50%, 0 0;
}

/* drifting glow blobs */
.page-hero::after, .gl-hero::after, .ss-hero::after {
  content: '';
  position: absolute; inset: -40% -20%; z-index: 0; pointer-events: none;
  background:
    radial-gradient(28vw 28vw at 18% 40%, rgba(243,117,42,.28), transparent 65%),
    radial-gradient(26vw 26vw at 82% 70%, rgba(106,76,255,.28), transparent 65%);
  filter: blur(30px);
  animation: hero-drift 18s ease-in-out infinite alternate;
}
@keyframes hero-drift {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to   { transform: translate3d(4vw, 3vw, 0) scale(1.12); }
}

/* the old diagonal "slash" panel and the newer glow blobs are no longer needed */
.page-hero .hero-slash, .gl-hero .slash, .ss-hero .slash, .ss-hero .glow { display: none !important; }

/* keep the content above the effects */
.page-hero > .container, .page-hero > .hero-inner, .page-hero .hero-inner,
.gl-hero > .container, .ss-hero > .container, .page-hero .page-hero-inner { position: relative; z-index: 1; }

@media (prefers-reduced-motion: reduce) {
  .page-hero::after, .gl-hero::after, .ss-hero::after { animation: none; }
}
