html { scroll-behavior: smooth; }
body { font-family: 'IBM Plex Sans', sans-serif; }
.font-display { font-family: 'Archivo Black', sans-serif; }
.font-mono-sb { font-family: 'IBM Plex Mono', monospace; }
.chrome-text {
  background: linear-gradient(180deg, #f4f4f4 0%, #c9c9c9 45%, #8e8e8e 55%, #e7e7e7 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.font-bangers { font-family: 'Bangers', cursive; }

/* Halftone dot background: always-on via .wild-halftone, or wild-mode-only on any .page-hero */
.wild-halftone,
html.mode-wild .page-hero {
  position: relative;
  z-index: 0;
}
.wild-halftone::before, .wild-halftone::after,
html.mode-wild .page-hero::before, html.mode-wild .page-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: radial-gradient(rgba(255, 59, 71, 0.55) 1.8px, transparent 1.8px);
  background-size: 14px 14px;
}
.wild-halftone::before, html.mode-wild .page-hero::before { animation: dots-twinkle-a 2.4s ease-in-out infinite; }
.wild-halftone::after, html.mode-wild .page-hero::after { background-position: 7px 7px; animation: dots-twinkle-b 3.2s ease-in-out infinite; }
@keyframes dots-twinkle-a { 0%, 100% { opacity: .8; } 50% { opacity: .1; } }
@keyframes dots-twinkle-b { 0%, 100% { opacity: .1; } 50% { opacity: .8; } }
@media (prefers-reduced-motion: reduce) {
  .wild-halftone::before, .wild-halftone::after,
  html.mode-wild .page-hero::before, html.mode-wild .page-hero::after { animation: none; opacity: .4; }
}

/* Light wild-mode reskin, driven by the Corporate/Wild toggle in the nav on every page */
html.mode-wild .page-title {
  font-family: 'Bangers', cursive;
  letter-spacing: 0.5px;
  text-shadow: 3px 3px 0 #ff3b47, 6px 6px 0 #000;
}
html.mode-wild .page-eyebrow { color: #ffd200; }
html.mode-wild .nav-current { color: #ffd200; text-decoration-color: #ffd200; }
html.mode-wild .nav-cta {
  border-color: #000;
  background-color: #ff3b47;
  color: #0c0c0d;
  box-shadow: 3px 3px 0 #000;
}
html.mode-wild .nav-cta-mobile { color: #ffd200; }

/* Corporate/Wild Side mode toggle button + logo swap, shared by every page's nav */
html.mode-wild [data-mode-logo="wild"] { display: flex; }
html.mode-wild [data-mode-logo="corporate"] { display: none; }
html.mode-wild .mobile-menu-icon { color: #ffd200; }
html:not(.mode-wild) #btn-wild .fire-text {
  display: inline-block;
  background: linear-gradient(90deg, #8a8a8d 0%, #c97a3d 50%, #8a8a8d 100%);
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: fire-text-shift 8s ease-in-out infinite;
}
@keyframes fire-text-shift {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}
@media (prefers-reduced-motion: reduce) {
  html:not(.mode-wild) #btn-wild .fire-text { animation: none; }
}
