/* =========================================================
 *  OAU MBA PROGRAMME — DESIGN TOKENS v2
 *  LBS-inspired: editorial, institutional, dark navy + gold
 *  ========================================================= */

:root {
  /* --- Brand Navy (LBS-inspired deep navy) --- */
  --navy-950: #04142a;
  --navy-900: #0b2545;
  --navy-800: #0d2e56;
  --navy-700: #103568;
  --navy-600: #154080;
  --navy-100: #dde8f5;
  --navy-50:  #f0f5fb;

  /* --- Ife Gold --- */
  --gold-700: #8a5c0a;
  --gold-600: #b07a14;
  --gold-500: #c9911e;
  --gold-400: #e3b84a;
  --gold-300: #f0cf82;
  --gold-100: #faf1d8;
  --gold-50:  #fdf9ee;

  /* --- Neutral --- */
  --ink-900: #0f1117;
  --ink-700: #2d333d;
  --ink-500: #52596a;
  --ink-400: #6b7385;
  --ink-300: #9098aa;
  --ink-200: #c0c6d3;
  --ink-100: #dde2ea;
  --ink-50:  #f4f6f9;
  --white:   #ffffff;

  /* --- Semantic --- */
  --success-700: #175c39;
  --success-600: #1e7e4d;
  --success-100: #e0f2ea;
  --warning-600: #a06712;
  --warning-100: #fef3dc;
  --danger-600:  #b3261e;
  --danger-100:  #fce8e6;
  --info-600:    var(--navy-600);
  --info-100:    var(--navy-100);

  /* --- Typography --- */
  --font-display: 'Playfair Display', 'Georgia', serif;
  --font-body:    'Inter', 'Segoe UI', Arial, sans-serif;
  --font-mono:    'IBM Plex Mono', 'Courier New', monospace;

  /* --- Type Scale --- */
  --text-xs:   0.6875rem;   /* 11px */
  --text-sm:   0.8125rem;   /* 13px */
  --text-base: 0.9375rem;   /* 15px */
  --text-md:   1.0625rem;   /* 17px */
  --text-lg:   1.25rem;     /* 20px */
  --text-xl:   1.5rem;      /* 24px */
  --text-2xl:  2rem;        /* 32px */
  --text-3xl:  2.75rem;     /* 44px */
  --text-4xl:  3.75rem;     /* 60px */

  /* --- Spacing (8pt grid) --- */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 2.5rem;
  --sp-8: 3rem;
  --sp-9: 4rem;
  --sp-10: 5rem;
  --sp-11: 6rem;
  --sp-12: 8rem;

  /* --- Legacy aliases (so old templates still work) --- */
  --space-1: var(--sp-1); --space-2: var(--sp-2); --space-3: var(--sp-3);
  --space-4: var(--sp-4); --space-5: var(--sp-5); --space-6: var(--sp-6);
  --space-7: var(--sp-7); --space-8: var(--sp-8); --space-9: var(--sp-9);
  --blue-900: var(--navy-900); --blue-800: var(--navy-800);
  --blue-700: var(--navy-700); --blue-600: var(--navy-600);
  --blue-500: #1a60c2; --blue-100: var(--navy-100); --blue-50: var(--navy-50);

  /* --- Radius --- */
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 10px;
  --radius-xl: 16px;
  --radius-full: 999px;

  /* --- Elevation --- */
  --shadow-1: 0 1px 3px rgba(11,37,69,0.08), 0 1px 2px rgba(11,37,69,0.04);
  --shadow-2: 0 4px 12px rgba(11,37,69,0.10), 0 1px 3px rgba(11,37,69,0.06);
  --shadow-3: 0 12px 32px rgba(11,37,69,0.16), 0 2px 8px rgba(11,37,69,0.06);
  --shadow-gold: 0 2px 12px rgba(201,145,30,0.30);

  /* --- Motion --- */
  --ease: cubic-bezier(0.25, 0, 0, 1);
  --ease-out: cubic-bezier(0, 0, 0.25, 1);
  --dur-fast: 100ms;
  --dur-base: 180ms;
  --dur-slow: 300ms;

  /* --- Layout --- */
  --sidebar-w: 260px;
  --topbar-h:  60px;
  --pubbar-h:  56px;
  --max-w:     1200px;
  --max-w-narrow: 900px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    transition-duration: 0.001ms !important;
  }
}