/* ==========================================================================
   EasyUni Edu — Design Tokens v2
   Vibrant student-focused palette: electric violet + cyan gradients
   ========================================================================== */

:root {
  /* ── Palette ─────────────────────────────────────────────────────────── */
  --color-primary:        #7C3AED;   /* Electric violet */
  --color-primary-dark:   #5B21B6;   /* Deep violet */
  --color-primary-light:  #A78BFA;   /* Soft violet */
  --color-secondary:      #06B6D4;   /* Cyan */
  --color-accent:         #F43F5E;   /* Rose / CTA */
  --color-accent-warm:    #F59E0B;   /* Amber highlight */

  --color-bg:             #FFFFFF;
  --color-bg-alt:         #F8FAFC;
  --color-bg-dark:        #0F172A;   /* Navy — dark sections */
  --color-bg-card:        #FFFFFF;
  --color-bg-glass:       rgba(255,255,255,0.8);

  --color-ink:            #0F172A;
  --color-ink-soft:       #475569;
  --color-ink-muted:      #94A3B8;
  --color-ink-inverse:    #FFFFFF;

  --color-border:         #E2E8F0;
  --color-border-light:   #F1F5F9;

  --color-success:        #10B981;
  --color-danger:         #EF4444;
  --color-warning:        #F59E0B;

  /* ── Gradients ───────────────────────────────────────────────────────── */
  --gradient-primary:     linear-gradient(135deg, #7C3AED 0%, #6366F1 50%, #4F46E5 100%);
  --gradient-hero:        linear-gradient(160deg, #7C3AED 0%, #06B6D4 40%, #3B82F6 80%, #8B5CF6 100%);
  --gradient-accent:      linear-gradient(135deg, #F43F5E 0%, #FB923C 100%);
  --gradient-cyan:        linear-gradient(135deg, #06B6D4 0%, #3B82F6 100%);
  --gradient-dark:        linear-gradient(160deg, #0F172A 0%, #1E1B4B 50%, #0F172A 100%);
  --gradient-card:        linear-gradient(180deg, rgba(124,58,237,0.05) 0%, rgba(255,255,255,0) 100%);
  --gradient-glow:        radial-gradient(circle at 50% 0%, rgba(124,58,237,0.15) 0%, transparent 70%);

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

  --text-xs:              0.75rem;    /* 12px */
  --text-sm:              0.875rem;   /* 14px */
  --text-base:            1rem;       /* 16px */
  --text-lg:              1.125rem;   /* 18px */
  --text-xl:              1.25rem;    /* 20px */
  --text-2xl:             1.5rem;     /* 24px */
  --text-3xl:             2rem;       /* 32px */
  --text-4xl:             2.75rem;    /* 44px */
  --text-5xl:             3.5rem;     /* 56px */
  --text-6xl:             4.5rem;     /* 72px */

  --leading-tight:        1.15;
  --leading-normal:       1.6;
  --leading-relaxed:      1.75;

  --weight-normal:        400;
  --weight-medium:        500;
  --weight-semibold:      600;
  --weight-bold:          700;
  --weight-extrabold:     800;

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

  /* ── Shadows ─────────────────────────────────────────────────────────── */
  --shadow-sm:    0 1px 2px rgba(15,23,42,0.06);
  --shadow-md:    0 4px 12px rgba(15,23,42,0.08);
  --shadow-lg:    0 12px 40px rgba(15,23,42,0.12);
  --shadow-xl:    0 24px 64px rgba(15,23,42,0.16);
  --shadow-glow:  0 0 40px rgba(124,58,237,0.3);
  --shadow-cyan:  0 0 40px rgba(6,182,212,0.25);

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

  /* ── Transitions ─────────────────────────────────────────────────────── */
  --duration-fast:   150ms;
  --duration-normal: 300ms;
  --duration-slow:   500ms;
  --duration-glacial: 800ms;

  --ease-out-expo:   cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out-back:   cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-in-out-cubic: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring:     cubic-bezier(0.22, 1.2, 0.36, 1);

  /* ── Z-index ─────────────────────────────────────────────────────────── */
  --z-base:     1;
  --z-sticky:   100;
  --z-overlay:  200;
  --z-modal:    300;

  /* ── Layout ──────────────────────────────────────────────────────────── */
  --container-max:  1200px;
  --container-narrow: 900px;
  --nav-height:     64px;
}