/* ============================================================
   LITHIUM.IE — Design Tokens
   Edit this file to retheme the entire site.
   ============================================================ */

:root {
  /* --- Core backgrounds --- */
  --color-bg:              #000000;
  --color-bg-card:         #0d0d0d;
  --color-bg-card-hover:   #141414;
  --color-bg-nav:          rgba(0, 0, 0, 0.85);
  --color-bg-overlay:      rgba(0, 0, 0, 0.6);

  /* --- Brand greens --- */
  --color-green:           #1a4a2e;
  --color-green-mid:       #2d7a4f;
  --color-green-glow:      #3ddc84;
  --color-green-subtle:    rgba(61, 220, 132, 0.08);

  /* --- Brand purples --- */
  --color-purple:          #2d1b4e;
  --color-purple-mid:      #6b3fa0;
  --color-purple-glow:     #a855f7;
  --color-purple-subtle:   rgba(168, 85, 247, 0.08);

  /* --- Text --- */
  --color-text:            #e8e8e8;
  --color-text-muted:      #888888;
  --color-text-faint:      #444444;
  --color-heading:         #ffffff;

  /* --- Borders & dividers --- */
  --color-border:          rgba(255, 255, 255, 0.08);
  --color-border-green:    rgba(61, 220, 132, 0.25);
  --color-border-purple:   rgba(168, 85, 247, 0.25);

  /* --- Gradients --- */
  --gradient-green-purple: linear-gradient(135deg, var(--color-green-mid), var(--color-purple-mid));
  --gradient-hero:         radial-gradient(ellipse at 50% 0%, rgba(45, 122, 79, 0.15) 0%, transparent 60%),
                           radial-gradient(ellipse at 80% 50%, rgba(107, 63, 160, 0.12) 0%, transparent 50%),
                           #000000;

  /* --- Buttons --- */
  --color-btn-primary-bg:  var(--color-green-mid);
  --color-btn-primary-text:#000000;
  --color-btn-secondary-bg:transparent;
  --color-btn-secondary-border: var(--color-green-glow);
  --color-btn-secondary-text:   var(--color-green-glow);

  /* --- Typography --- */
  --font-sans:   'Inter', system-ui, -apple-system, sans-serif;
  --font-mono:   'JetBrains Mono', 'Fira Code', monospace;

  --text-xs:    0.75rem;
  --text-sm:    0.875rem;
  --text-base:  1rem;
  --text-lg:    1.125rem;
  --text-xl:    1.25rem;
  --text-2xl:   1.5rem;
  --text-3xl:   1.875rem;
  --text-4xl:   2.25rem;
  --text-5xl:   3rem;
  --text-6xl:   3.75rem;

  /* --- Spacing --- */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;

  /* --- Radii --- */
  --radius-sm:  0.375rem;
  --radius-md:  0.75rem;
  --radius-lg:  1rem;
  --radius-xl:  1.5rem;
  --radius-full: 9999px;

  /* --- Shadows & glows --- */
  --shadow-card: 0 4px 24px rgba(0, 0, 0, 0.4);
  --glow-green:  0 0 20px rgba(61, 220, 132, 0.2), 0 0 60px rgba(61, 220, 132, 0.08);
  --glow-purple: 0 0 20px rgba(168, 85, 247, 0.2), 0 0 60px rgba(168, 85, 247, 0.08);

  /* --- Transitions --- */
  --transition-fast: 150ms ease;
  --transition-base: 250ms ease;
  --transition-slow: 400ms ease;

  /* --- Layout --- */
  --nav-height:   64px;
  --max-width:    1200px;
  --section-pad:  var(--space-24) var(--space-8);
}