/* ============================================
   HYPER G - CSS Custom Properties
   ============================================ */

:root {
  /* Background Colors */
  --bg-primary: #0a0a0b;
  --bg-secondary: #111113;
  --bg-tertiary: #18181b;

  /* Text Colors */
  --text-primary: #fafafa;
  --text-secondary: #a1a1aa;
  --text-muted: #52525b;

  /* Border Colors */
  --border-color: rgba(255, 255, 255, 0.06);
  --border-highlight: rgba(255, 255, 255, 0.12);

  /* Accent Colors */
  --accent-cyan: #06b6d4;
  --accent-purple: #a855f7;
  --accent-blue: #3b82f6;
  --accent-pink: #ec4899;
  --accent-green: #c8e34a;

  /* Glow Colors */
  --glow-cyan: rgba(6, 182, 212, 0.4);
  --glow-purple: rgba(168, 85, 247, 0.4);

  /* Cube Face Colors */
  --face-time-place: rgba(6, 182, 212, 0.08);
  --face-time-thing: rgba(100, 120, 220, 0.08);
  --face-place-thing: rgba(140, 90, 230, 0.08);
  --face-border-time-place: rgba(6, 182, 212, 0.3);
  --face-border-time-thing: rgba(100, 120, 220, 0.3);
  --face-border-place-thing: rgba(140, 90, 230, 0.3);

  /* Gradients */
  --gradient-primary: linear-gradient(135deg, #06b6d4 0%, #3b82f6 50%, #a855f7 100%);
  --gradient-text: linear-gradient(90deg, #06b6d4 0%, #3b82f6 35%, #a855f7 65%, #ec4899 100%);

  /* Spacing */
  --nav-height: 80px;
  --section-padding: 8rem 4rem;
  --section-padding-mobile: 5rem 2rem;

  /* Typography */
  --font-heading: 'Barlow', sans-serif;
  --font-body: 'Outfit', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: 'Space Mono', monospace;

  /* Transitions */
  --transition-fast: 0.3s ease;
  --transition-smooth: 0.4s cubic-bezier(0.4, 0, 0.2, 1);

  /* Z-index scale */
  --z-grid: -1;
  --z-content: 1;
  --z-nav: 1000;
  --z-mobile-menu: 999;
  --z-loader: 10000;
  --z-noise: 9999;
}