/* BellexFire Launch — Brand Tokens
   Fonts loaded via HTML <link>: Orbitron (display) + Inter (body) */

:root {
  /* Core brand */
  --bxf-base:        #0a0418;
  --bxf-magenta:     #ff2bd6;
  --bxf-purple:      #a855f7;
  --bxf-deep-purple: #7c3aed;
  --bxf-neon-pink:   #ff2d95;
  --bxf-cyan:        #00d4ff;

  /* Surfaces */
  --bg-dark:    #0a0418;
  --bg-card:    #120822;
  --bg-surface: #0e0618;
  --bg-overlay: rgba(10, 4, 24, 0.88);

  /* Borders */
  --border-default:     rgba(255, 255, 255, 0.08);
  --border-glow:        rgba(255, 43, 214, 0.22);
  --border-glow-strong: rgba(255, 43, 214, 0.55);

  /* Typography */
  --text-primary:   #f0e6ff;
  --text-secondary: #a78bca;
  --text-muted:     #6b5080;
  --text-inverse:   #0a0418;

  /* Launch accent */
  --launch-accent:     #ff2bd6;
  --launch-accent-dim: rgba(255, 43, 214, 0.14);
  --launch-glow:       0 0 40px rgba(255, 43, 214, 0.28);

  /* Gradients */
  --grad-hero:    linear-gradient(160deg, #0a0418 0%, #120822 50%, #0e0618 100%);
  --grad-magenta: linear-gradient(135deg, #ff2bd6, #a855f7);
  --grad-text:    linear-gradient(135deg, #ff2bd6 0%, #a855f7 50%, #ff2d95 100%);

  /* Shadows */
  --shadow-card:  0 8px 32px rgba(0, 0, 0, 0.45);
  --shadow-hover: 0 20px 60px rgba(0, 0, 0, 0.5), 0 0 40px rgba(255, 43, 214, 0.15);

  /* Motion */
  --transition:        0.3s ease;
  --transition-smooth: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);

  /* Radius */
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;
}