/* ============================================================
   NERVE WEB FUNNEL — self-contained styles.
   Mirrors the Nerve design-system tokens (tokens/*.css) so this
   folder can be deployed to Vercel on its own, with no path
   dependency on the rest of the design system.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=DM+Serif+Display&display=swap');

:root {
  /* fonts */
  --font-sans: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-serif: 'DM Serif Display', Georgia, 'Times New Roman', serif;

  /* surfaces */
  --color-background: #000000;
  --color-surface: #0B0B0D;
  --color-surface-alt: #111113;
  --color-surface-raised: #1B1B1E;
  --color-glass: rgba(16,16,16,0.91);
  --surface-input: #111113;

  /* brand violet */
  --color-primary: #8B5CF6;
  --color-primary-deep: #4C1D95;
  --color-primary-bright: #7C3AED;
  --color-purple: #C084FC;
  --color-accent: #D8B4FE;

  /* signals */
  --color-green: #7DD3AE;
  --color-xp: #F7D774;
  --color-streak: #D8B4FE;
  --color-danger: #F87171;

  /* text */
  --color-text-primary: #FFFFFF;
  --color-text-secondary: #D7D2DE;
  --color-text-muted: #8B8792;

  /* borders */
  --color-border: #27272A;
  --border-hairline: rgba(255,255,255,0.09);
  --border-hairline-strong: rgba(255,255,255,0.15);
  --border-violet: rgba(139,92,246,0.40);

  /* radius */
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-2xl: 28px;
  --radius-full: 999px;

  /* glow / shadow */
  --glow-sm: 0 6px 14px rgba(139,92,246,0.14);
  --glow-md: 0 10px 28px rgba(139,92,246,0.22);
  --glow-lg: 0 12px 34px rgba(139,92,246,0.45);
  --shadow-card: 0 8px 28px rgba(139,92,246,0.18);

  /* gradients */
  --gradient-screen: radial-gradient(120% 80% at 50% 118%, rgba(139,92,246,0.24) 0%, rgba(15,15,18,0.08) 46%, rgba(0,0,0,0) 78%), linear-gradient(180deg, #000000 0%, #08050D 58%, #000000 100%);
  --gradient-primary: linear-gradient(90deg, #241334 0%, #7C3AED 50%, #1B1022 100%);
  --gradient-premium: linear-gradient(90deg, #30124F 0%, #8B5CF6 50%, #271134 100%);
  --gradient-orb: linear-gradient(135deg, #3B1858 0%, #8B5CF6 55%, #2A1237 100%);
  --gradient-glass: linear-gradient(160deg, rgba(255,255,255,0.05) 0%, rgba(139,92,246,0.12) 50%, rgba(255,255,255,0.02) 100%);
}