/* Home page WOW (see js/wow.js). Only linked from index.html. */

/* The spark canvas sits on top of the hero text but never blocks clicks. */
.wow-canvas{
  position: absolute; inset: 0; z-index: 2;
  width: 100%; height: 100%;
  pointer-events: none;
  transition: opacity 0.6s ease;
}
/* The real text fades back in as the sparks rest (see settleSoon in js/wow-core.js). */
.hero-wordmark, .hero-wordmark span, .wow-word, .wow-word span{ transition: color 0.6s ease, text-shadow 0.6s ease; }

/* While sparks draw the wordmark, the real <h1> keeps its space but goes see-through.
   It is still there for screen readers, search engines and copy/paste. */
.wow-live, .wow-live span,
.wow-word.wow-live, .wow-word.wow-live span{
  color: transparent; text-shadow: none; animation: none;
}

/* The FOREST. label on the football page (a real element, so it also works without JS). */
.wow-word{
  font-family: var(--font-display); font-weight: 700; font-size: clamp(2.2rem, 7vw, 3.6rem);
  line-height: 1; letter-spacing: 0.04em; color: var(--chalk); margin: 0 0 var(--s3);
  text-shadow: 0 0 30px rgba(225,16,44,0.45);
}
.wow-word span{ color: var(--garibaldi); }

/* A soft red spotlight that follows the pointer across the hero or banner. */
.hero::before, .page-banner::before{
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: radial-gradient(420px circle at var(--mx, 25%) var(--my, 20%), rgba(225,16,44,0.20), transparent 70%);
  opacity: 0; transition: opacity 0.6s ease;
}
.hero:hover::before, .page-banner:hover::before{ opacity: 1; }
