/* =========================================
  Design Tokens — PMLAB
  ========================================= */

:root {
  /* ---- Backgrounds ---- */
  --bg-primary:    #0b0b0f;
  --bg-secondary:  #111827;
  --bg-card:       #12131c;
  --bg-card-hover: #1a1b27;

  /* ---- Accent Colours ---- */
  --accent-green:        #4da6ff;
  --accent-green-dim:    rgba(77, 166, 255, 0.14);
  --accent-green-border: rgba(77, 166, 255, 0.42);
  --accent-green-glow:   0 0 22px rgba(77, 166, 255, 0.45), 0 0 60px rgba(77, 166, 255, 0.16);

  --accent-cyan:        #7b61ff;
  --accent-cyan-dim:    rgba(123, 97, 255, 0.12);
  --accent-cyan-border: rgba(123, 97, 255, 0.35);
  --accent-cyan-glow:   0 0 22px rgba(123, 97, 255, 0.45), 0 0 60px rgba(123, 97, 255, 0.14);
  --accent-pink:        #ff4fd8;
  --accent-gold:        #d4af37;

  /* Gradient used for decorative lines/highlights */
  --gradient-accent: linear-gradient(90deg, var(--accent-green), var(--accent-cyan), var(--accent-pink));
  --gradient-hero:   linear-gradient(135deg, #0b0b0f 0%, #111827 40%, #1e1b4b 100%);
  --gradient-card:   linear-gradient(180deg, transparent 50%, rgba(11, 11, 15, 0.92) 100%);
  --gradient-glass:  linear-gradient(135deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.04));

  /* ---- Text ---- */
  --text-primary:   #f5f5f7;
  --text-secondary: #c9ccd1;
  --text-muted:     #8d92a3;

  /* ---- Glass ---- */
  --glass-white:  rgba(255, 255, 255, 0.08);
  --glass-border: rgba(255, 255, 255, 0.12);
  --glass-blur:   20px;

  /* ---- Borders ---- */
  --border-subtle: rgba(255, 255, 255, 0.05);
  --border-card:   rgba(255, 255, 255, 0.08);

  /* ---- Shadows ---- */
  --shadow-card:       0 8px 32px rgba(0, 0, 0, 0.25);
  --shadow-card-hover: 0 20px 80px rgba(0, 0, 0, 0.35);

  /* ---- Typography ---- */
  --font-display: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', sans-serif;
  --font-body:    -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', sans-serif;

  --fs-hero:       clamp(3.8rem, 9vw, 8rem);
  --fs-xl:         clamp(2.6rem, 5vw, 4.8rem);
  --fs-heading:    clamp(1.9rem, 3vw, 2.8rem);
  --fs-subheading: clamp(1.1rem, 1.8vw, 1.4rem);
  --fs-body:       1rem;
  --fs-small:      0.875rem;
  --fs-label:      0.72rem;

  /* ---- Layout ---- */
  --nav-height:       84px;
  --section-pad:      clamp(92px, 11vh, 120px);
  --container-max:    1280px;
  --container-pad:    clamp(1.25rem, 8vw, 8rem);
  --gap-cards:        1.5rem;
  --radius-sm:        4px;
  --radius-md:        8px;
  --radius-lg:        16px;
  --radius-pill:      999px;

  /* ---- Transitions ---- */
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --t-fast:  0.18s ease;
  --t-mid:   0.38s ease;
  --t-slow:  0.70s var(--ease-out-expo);

  /* ---- Intro logo morph ---- */
  --logo-intro-scale-start: 5.0;
  --logo-intro-range: 560;   /* px of scroll over which the intro plays */
  --logo-intro-fade-start: 0.88; /* progress fraction at which logo begins to fade */

  /* ---- Z-indices ---- */
  --z-below:   -1;
  --z-base:     1;
  --z-overlay: 100;
  --z-modal:   200;
  --z-nav:     300;
}
