*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { background: #0a0a14; font-family: 'Space Grotesk', sans-serif; color: #e2e8f0; overflow-x: hidden; }

/* Grid background */
.grid-bg {
  background-image: linear-gradient(rgba(124,58,237,0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(124,58,237,0.04) 1px, transparent 1px);
  background-size: 60px 60px;
}

/* Glow effects */
.glow-purple { box-shadow: 0 0 40px rgba(124,58,237,0.3), 0 0 80px rgba(124,58,237,0.1); }
.glow-cyan { box-shadow: 0 0 40px rgba(6,182,212,0.3), 0 0 80px rgba(6,182,212,0.1); }
.text-glow { text-shadow: 0 0 30px rgba(124,58,237,0.5); }

/* Gradient text */
.grad-purple { background: linear-gradient(135deg, #a78bfa, #e879f9); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.grad-cyan { background: linear-gradient(135deg, #06b6d4, #a78bfa); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.grad-btn { background: linear-gradient(135deg, #7c3aed, #06b6d4); }
.grad-btn:hover { background: linear-gradient(135deg, #6d28d9, #0891b2); }

/* Noise overlay */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.03'/%3E%3C/svg%3E");
  pointer-events: none;
  z-index: 0;
  opacity: 0.4;
}

/* Orb */
.orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  pointer-events: none;
}

/* Reveal animation */
.reveal { opacity: 0; transform: translateY(30px); transition: opacity .7s ease, transform .7s ease; }
.revealed { opacity: 1; transform: translateY(0); }

/* Header scroll */
header { transition: background .3s, backdrop-filter .3s, box-shadow .3s; }
header.scrolled { background: rgba(10,10,20,0.95) !important; backdrop-filter: blur(20px); box-shadow: 0 1px 0 rgba(124,58,237,0.2); }

/* Card */
.service-card { background: rgba(15,15,31,0.8); border: 1px solid rgba(124,58,237,0.15); transition: border-color .3s, transform .3s, box-shadow .3s; }
.service-card:hover { border-color: rgba(124,58,237,0.5); transform: translateY(-4px); box-shadow: 0 20px 60px rgba(124,58,237,0.15); }

/* Form inputs */
.form-input {
  width: 100%;
  background: rgba(15,15,31,0.8);
  border: 1px solid rgba(124,58,237,0.2);
  color: #e2e8f0;
  border-radius: 12px;
  padding: 14px 18px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 15px;
  transition: border-color .3s, box-shadow .3s;
  outline: none;
}
.form-input::placeholder { color: rgba(226,232,240,0.3); }
.form-input:focus { border-color: rgba(124,58,237,0.6); box-shadow: 0 0 0 3px rgba(124,58,237,0.1); }

/* Step number */
.step-num {
  font-family: 'Space Grotesk', sans-serif;
  font-size: clamp(2rem, 6vw, 5rem);
  font-weight: 700;
  line-height: 1;
  flex-shrink: 0;
  min-width: 2ch;
  background: linear-gradient(135deg, #7c3aed, #06b6d4);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* AI response */
#ai-response { background: rgba(6,182,212,0.05); border: 1px solid rgba(6,182,212,0.2); border-radius: 12px; padding: 20px; display: none; }

/* Nav mobile */
#mobile-menu { display: none; }
#mobile-menu.open { display: flex; }

/* Scrollbar */
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: #0a0a14; }
::-webkit-scrollbar-thumb { background: #7c3aed; border-radius: 4px; }

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
}
