/* ==========================================================================
   NANO QWI DESIGN TOKENS
   ========================================================================== */

:root {
  /* --- Colors --- */
  --color-bg-main: #050505;
  --color-bg-sub: #0c0c0c;
  --color-surface: #121212;
  --color-surface-hover: #1a1a1a;

  --color-text-main: #f4f4f5;
  --color-text-muted: #a1a1aa;
  --color-text-subtle: #52525b;

  /* --- Accent Colors --- */
  --color-accent: #a3e635; /* Cinematic Lime */
  --color-accent-hover: #b5f028;
  --color-accent-subtle: rgba(163, 230, 53, 0.12);

  /* Neon Pink & Neon Yellow */
  --color-neon-pink: #ff1a8c;
  --color-neon-pink-hover: #ff4da6;
  --color-neon-pink-subtle: rgba(255, 26, 140, 0.15);

  --color-neon-yellow: #faff00;
  --color-neon-yellow-hover: #ffff4d;
  --color-neon-yellow-subtle: rgba(250, 255, 0, 0.15);

  --color-border: rgba(255, 255, 255, 0.08);
  --color-border-hover: rgba(163, 230, 53, 0.4);

  /* --- Typography --- */
  --font-heading: 'Outfit', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-body: 'Inter', "Noto Sans JP", -apple-system, BlinkMacSystemFont, sans-serif;

  /* --- Spacing --- */
  --section-py: clamp(5rem, 10vw, 9rem);
  --container-max: 1440px;
  --container-px: clamp(1.25rem, 5vw, 3.5rem);

  /* --- Transitions & Easing --- */
  --transition-fast: 0.2s ease;
  --transition-base: 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-slow: 0.6s cubic-bezier(0.16, 1, 0.3, 1);

  /* --- Shadows & Glow --- */
  --glow-accent: 0 0 30px rgba(163, 230, 53, 0.25);
  --glow-pink: 0 0 30px rgba(255, 26, 140, 0.35);
  --glow-yellow: 0 0 30px rgba(250, 255, 0, 0.35);
  --shadow-card: 0 16px 40px rgba(0, 0, 0, 0.6);
}