/* =============================================
   variables.css — Slystore — Signal/Circuit theme
   ============================================= */
:root {
  --black: #070a12;
  --cream: #e8f4f8;
  --card: #0e1420;
  --border: #1c2740;

  --orange: #00e5ff;       /* accent cyan signal — reused var name for compatibility with styles.css */
  --orange-lt: #5cf2ff;
  --orange-dk: #00b8cc;

  --violet: #a855f7;
  --gold: #ffd166;
  --red: #ff5c7a;
  --green: #3ddc97;
  --blue: #00e5ff;
  --pink: #ff6fb5;

  --grey-md: #5c6b85;
  --grey-lt: #92a4c2;

  --font-display: 'Space Grotesk', sans-serif;
  --font-body: 'Inter', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;

  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-xl: 18px;

  --padding-x: clamp(20px, 4vw, 48px);
  --transition: 0.25s ease;

  --shadow-card: 0 4px 24px rgba(0,0,0,.4);
  --shadow-hover: 0 0 0 1px rgba(0,229,255,.4), 0 12px 32px rgba(0,229,255,.15);
  --glow: 0 0 20px rgba(0,229,255,.35);
}