:root {
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-xl:   20px;
  --radius-2xl:  32px;
  --radius-full: 9999px;

  --font-sans:  'Inter', system-ui, sans-serif;
  --font-serif: 'Instrument Serif', Georgia, serif;

  --text-hero: clamp(2.4rem, 6.5vw, 5rem);
  --text-h2: clamp(2rem, 5vw, 4rem);
  --text-body: clamp(1rem, 1.2vw, 1.125rem);

  --shadow-sm:  0 1px 3px rgba(0,0,0,.15);
  --shadow-md:  0 4px 16px rgba(0,0,0,.2);
  --shadow-lg:  0 8px 32px rgba(0,0,0,.4);
  --shadow-xl:  0 16px 56px rgba(0,0,0,.5);

  --ease-gsap:  cubic-bezier(0.19, 1, 0.22, 1);
  --ease:       cubic-bezier(0.19, 1, 0.22, 1);
  --t-fast:     150ms;
  --t-base:     300ms;
  --t-slow:     500ms;
}

[data-theme="dark"] {
  color-scheme: dark;

  --bg:          #050505;
  --bg-surface:  #0f0f15;
  --bg-raised:   #0f0f15;
  --bg-overlay:  rgba(15,15,21,0.8);

  --border:      rgba(124, 58, 237, 0.15);
  --border-mid:  rgba(124, 58, 237, 0.25);
  --border-hi:   rgba(124, 58, 237, 0.4);

  --text:        #f8fafc;
  --text-2:      #a0a0b0;
  --text-3:      #606070;

  --blue:        #7c3aed;
  --blue-hi:     #a855f7;
  --blue-lo:     #6d28d9;
  --blue-glow:   rgba(124, 58, 237, 0.3);
  --blue-tint:   rgba(124, 58, 237, 0.1);

  --purple:      #a855f7;
  --purple-tint: rgba(168, 85, 247, 0.12);

  --teal:        #445555;
  --teal-tint:   rgba(68,85,85,.12);

  --green:       #22c55e;
  --red:         #ef4444;

  --grad-text: linear-gradient(135deg, #a855f7 0%, #7c3aed 60%, #6d28d9 100%);
  --grad-border: linear-gradient(135deg, rgba(168,85,247,.6), rgba(124,58,237,.1), rgba(168,85,247,.3));
}

[data-theme="light"] {
  color-scheme: light;

  --bg:          #f8fafc;
  --bg-surface:  #ffffff;
  --bg-raised:   #ffffff;
  --bg-overlay:  #f1f5f9;

  --border:      rgba(0,0,0,.06);
  --border-mid:  rgba(0,0,0,.10);
  --border-hi:   rgba(0,0,0,.18);

  
  --text:        #0f172a;
  --text-2:      #334155;
  --text-3:      #64748b;

  
  --blue:        #7c3aed;
  --blue-hi:     #6d28d9;
  --blue-lo:     #5b21b6;
  --blue-glow:   rgba(124,58,237,.12);
  --blue-tint:   rgba(124,58,237,.07);

  --purple:      #7c3aed;
  --purple-tint: rgba(124,58,237,.08);

  --teal:        #0f766e;
  --teal-tint:   rgba(15,118,110,.1);

  --green:       #16a34a;
  --red:         #dc2626;

  --grad-text: linear-gradient(135deg, #7c3aed 0%, #6d28d9 60%, #5b21b6 100%);
  --grad-border: linear-gradient(135deg, rgba(124,58,237,.35), rgba(109,40,217,.12), rgba(124,58,237,.25));

  
  --shadow-sm:  0 1px 3px rgba(0,0,0,.05);
  --shadow-md:  0 4px 16px rgba(0,0,0,.07);
  --shadow-lg:  0 8px 32px rgba(0,0,0,.09);
  --shadow-xl:  0 16px 56px rgba(0,0,0,.11);
}