:root {
  /* ── Backgrounds ─────────────────────────────────── */
  --bg:           #F5F5F7;
  --bg-white:     #FFFFFF;
  --surface:      rgba(255, 255, 255, 0.78);
  --surface-mid:  rgba(255, 255, 255, 0.92);

  /* ── Text ────────────────────────────────────────── */
  --text:          #1D1D1F;
  --text-secondary:#6E6E73;
  --text-tertiary: #86868B;
  --ink:           #1D1D1F;

  /* ── Lines / Borders ─────────────────────────────── */
  --line:        rgba(0, 0, 0, 0.06);
  --line-medium: rgba(0, 0, 0, 0.10);
  --line-strong: rgba(0, 0, 0, 0.14);

  /* ── Accent — Electric Blue ──────────────────────── */
  --accent:       #0071E3;
  --accent-hover: #0077ED;
  --accent-soft:  rgba(0, 113, 227, 0.10);
  --accent-glow:  rgba(0, 113, 227, 0.28);

  /* ── Iridescent Gradient ─────────────────────────── */
  --grad-iris: linear-gradient(135deg, #0071E3 0%, #5E5CE6 52%, #BF5AF2 100%);

  /* ── Dark Section (Lexify + Footer) ─────────────── */
  --dark-bg:      #000000;
  --dark-surface: rgba(255, 255, 255, 0.06);
  --dark-surface-hover: rgba(255, 255, 255, 0.10);
  --dark-text:    #F5F5F7;
  --dark-muted:   rgba(245, 245, 247, 0.56);
  --dark-line:    rgba(255, 255, 255, 0.10);
  --dark-line-strong: rgba(255, 255, 255, 0.16);

  /* Legacy aliases so existing pages don't break */
  --signal:      #0071E3;
  --signal-soft: rgba(0, 113, 227, 0.10);
  --muted:       #6E6E73;

  /* ── Typography ──────────────────────────────────── */
  --font-display: "Inter", -apple-system, "SF Pro Display", "Helvetica Neue", sans-serif;
  --font-body:    "Inter", -apple-system, "SF Pro Text",    "Helvetica Neue", sans-serif;

  /* ── Layout ──────────────────────────────────────── */
  --container:       1200px;
  --container-narrow: 860px;

  /* ── Radii ────────────────────────────────────────── */
  --radius-hero:   40px;
  --radius-large:  24px;
  --radius-medium: 16px;
  --radius-small:  10px;

  /* ── Shadows ─────────────────────────────────────── */
  --shadow-card:       0 1px 3px rgba(0,0,0,0.04), 0 6px 28px rgba(0,0,0,0.07);
  --shadow-card-hover: 0 4px 8px rgba(0,0,0,0.06), 0 20px 56px rgba(0,0,0,0.12);
  --shadow-soft:       0 2px 20px rgba(0,0,0,0.06);
  --shadow-strong:     0 8px 40px rgba(0,0,0,0.14);
  --shadow-glow:       0 0 60px rgba(0,113,227,0.20), 0 0 20px rgba(0,113,227,0.10);

  /* ── Transitions ─────────────────────────────────── */
  --transition:      220ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --transition-slow: 500ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
}