/* ============================================================
   ANIM SHACK v6v — wordmark lumineux + typo matching le logo
   - Switch Black Ops One stencil → Bowlby One (rounded, organic,
     chunky — matches the brushy ink logo silhouette)
   - Boost color to crème vif + warm orange glow (replaces the
     heavy black halo that was killing luminosity)
   - Kill any inherited filter/blur on hero-type
   - Keep h1 readable + dominant the bokeh particles
============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Unbounded:wght@700;800;900&display=swap');

.hero-type,
#hero-type,
.hero-type-fill,
#hero-type .hero-type-fill{
  /* TYPO — Bowlby One = rounded chunky cabane warmth (matches "shack") */
  font-family: 'Bowlby One', 'Unbounded', 'Big Shoulders Display', Impact, sans-serif !important;
  font-weight: 400 !important;
  font-style: normal !important;
  letter-spacing: .01em !important;

  /* COLOR — crème vif lumineux (was rgb(245,230,211) cream dull) */
  color: #FFF8E7 !important;
  -webkit-text-fill-color: #FFF8E7 !important;

  /* KILL the cream gradient background-clip text + black halo */
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;

  /* TEXT SHADOW — warm copper/orange glow (no more black halo) */
  text-shadow:
    0 0 22px rgba(255, 140, 60, 0.42),
    0 0 44px rgba(255, 120, 40, 0.22),
    0 2px 6px rgba(20, 8, 0, 0.55) !important;

  /* KILL inherited blur from any scroll animation */
  filter: drop-shadow(0 0 18px rgba(255, 165, 80, 0.30)) !important;

  /* Z-INDEX — sit ABOVE bokeh particles */
  position: relative !important;
  z-index: 6 !important;
  opacity: 1 !important;
}

/* Strip the glitch ::before / ::after layers (RGB split) — they
   re-introduce visible dark/cyan edges that look like blur */
.hero-type::before,
.hero-type::after,
#hero-type::before,
#hero-type::after{
  display: none !important;
}

/* Slight scale-in on load — wordmark dominates the hero */
.hero-type, #hero-type{
  animation: wordmark-glow-pulse 4.8s ease-in-out infinite !important;
}
@keyframes wordmark-glow-pulse{
  0%, 100% {
    text-shadow:
      0 0 22px rgba(255, 140, 60, 0.42),
      0 0 44px rgba(255, 120, 40, 0.22),
      0 2px 6px rgba(20, 8, 0, 0.55);
  }
  50% {
    text-shadow:
      0 0 28px rgba(255, 155, 70, 0.55),
      0 0 60px rgba(255, 130, 50, 0.30),
      0 2px 6px rgba(20, 8, 0, 0.55);
  }
}

/* SR-only accessibility version (if ever needed) */
.sr-only{
  position: absolute;
  width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0);
  white-space: nowrap; border: 0;
}