* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  background: #FF6B1A;
  color: #1A1A1A;
  -webkit-font-smoothing: antialiased;
}
.font-mono, code { font-family: 'Space Mono', monospace; }

/* dotted texture for hero */
.dotgrid {
  background-image: radial-gradient(rgba(255,255,255,.5) 1.5px, transparent 1.5px);
  background-size: 22px 22px;
}

/* shimmer loading */
.shimmer::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.25) 50%, transparent 70%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
}
@keyframes shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* button pop */
.btn-pop {
  transition: transform .12s ease, box-shadow .12s ease;
  cursor: pointer;
}
.btn-pop:hover { transform: translateY(-3px); }
.btn-pop:active { transform: translateY(2px); }

/* reveal animation */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .6s cubic-bezier(.2,.7,.3,1), transform .6s cubic-bezier(.2,.7,.3,1);
}
.reveal.show {
  opacity: 1;
  transform: translateY(0);
}

/* steam wisps */
.steam {
  position: absolute;
  bottom: 0;
  width: 10px;
  height: 40px;
  background: rgba(255,255,255,.55);
  border-radius: 50%;
  filter: blur(6px);
  animation: rise 3s ease-out infinite;
  opacity: 0;
}
@keyframes rise {
  0% { transform: translateY(0) scale(1); opacity: 0; }
  20% { opacity: .6; }
  100% { transform: translateY(-70px) scale(2.2); opacity: 0; }
}

/* nicer selection */
::selection { background: #00C2FF; color: #1A1A1A; }

/* scrollbar flair */
::-webkit-scrollbar { width: 12px; }
::-webkit-scrollbar-track { background: #E24E00; }
::-webkit-scrollbar-thumb { background: #00C2FF; border-radius: 8px; border: 2px solid #E24E00; }