/**
 * LAMAR INSTITUTE — Design Tokens v4 (Rebrand May 2026)
 * Vibe: refined, formal, institute-elegant
 * Palette: Navy (#183C64) — primary  ·  Gold (#C0945E) — accent  ·  ivory whites
 */

:root {
  /* ── NAVY (Primary brand) — built from #183C64 ── */
  --navy-50:  #F0F4F9;
  --navy-100: #D4DFEB;
  --navy-200: #A9BFD7;
  --navy-300: #7E9FC3;
  --navy-400: #5380A0;
  --navy-500: #345E85;
  --navy-600: #234C72;
  --navy-700: #183C64;     /* ★ PRIMARY BRAND */
  --navy-800: #112B47;
  --navy-900: #0A1B2E;

  /* ── GOLD (Accent brand) — built from #C0945E ── */
  --gold-50:  #FCF8F2;
  --gold-100: #F6EBD8;
  --gold-200: #EBD3AC;
  --gold-300: #DCB87F;
  --gold-400: #D0A472;
  --gold-500: #C0945E;     /* ★ ACCENT BRAND */
  --gold-600: #A07A48;
  --gold-700: #7E5F38;
  --gold-800: #5F4628;
  --gold-900: #3F2D19;

  /* ── PINK aliases — deprecated, kept for back-compat. Map to GOLD/NAVY. ── */
  --pink-50:  var(--gold-50);
  --pink-100: var(--gold-100);
  --pink-200: var(--gold-200);
  --pink-300: var(--gold-300);
  --pink-400: var(--gold-400);     /* legacy "secondary brand light" → gold light */
  --pink-500: var(--gold-500);     /* legacy "primary brand" → gold (accents) */
  --pink-600: var(--gold-600);
  --pink-700: var(--gold-700);
  --pink-800: var(--gold-800);
  --pink-900: var(--gold-900);

  /* ── IVORY / CREAM (Backgrounds) — refined whites with subtle gold tint ── */
  --ivory-50:  #FFFFFF;
  --ivory-100: #FDFCFA;    /* very subtle warm tint */
  --ivory-200: #FAF6EE;    /* gold cream */
  --ivory-300: #F4EDDD;
  --ivory-400: #EAE0C8;
  --ivory-500: #D9C9A8;

  /* ── NEUTRALS ── */
  --gray-50:  #FAFAFB;
  --gray-100: #F4F5F7;
  --gray-200: #E5E7EB;
  --gray-300: #D1D5DB;
  --gray-400: #9CA3AF;
  --gray-500: #6B7280;
  --gray-600: #4B5563;
  --gray-700: #374151;
  --gray-800: #1F2937;
  --gray-900: #111827;

  /* ── SEMANTIC ── */
  --success-50: #ECFDF5; --success-500: #10B981; --success-700: #047857;
  --warning-50: #FFF7ED; --warning-500: #F59E0B; --warning-700: #B45309;
  --error-50:   #FEF2F2; --error-500:   #EF4444; --error-700:   #B91C1C;
  --info-50:    #EFF6FF; --info-500:    #3B82F6; --info-700:    #1D4ED8;

  /* ── SEMANTIC ALIASES ──
   * Navy is the PRIMARY brand (formal, institute-grade). Gold is the ACCENT for
   * highlights, icons, badges, and active states. */
  --color-primary:        var(--navy-700);
  --color-primary-hover:  var(--navy-800);
  --color-primary-light:  var(--navy-500);
  --color-secondary:      var(--gold-500);
  --color-accent:         var(--gold-500);
  --color-accent-hover:   var(--gold-600);
  --color-accent-light:   var(--gold-400);
  --color-bg:             #FFFFFF;
  --color-bg-elevated:    #FFFFFF;
  --color-surface:        var(--ivory-100);
  --color-surface-2:      var(--ivory-200);
  --color-border:         var(--ivory-400);
  --color-border-strong:  var(--ivory-500);
  --color-text:           var(--navy-800);
  --color-text-body:      var(--navy-700);
  --color-text-muted:     var(--navy-400);
  --color-text-on-dark:   #FFFFFF;
  --color-text-on-pink:   #FFFFFF;      /* deprecated — kept for back-compat */
  --color-text-on-navy:   #FFFFFF;
  --color-text-on-gold:   #FFFFFF;

  /* ── GRADIENTS ── */
  --gradient-navy-soft:   linear-gradient(135deg, #183C64 0%, #234C72 100%);
  --gradient-navy-deep:   linear-gradient(135deg, #183C64 0%, #0F2845 100%);
  --gradient-gold-soft:   linear-gradient(135deg, #C0945E 0%, #D9B57E 100%);
  --gradient-gold-warm:   linear-gradient(135deg, #D9B57E 0%, #C0945E 50%, #A07A48 100%);
  --gradient-navy-gold:   linear-gradient(135deg, #183C64 0%, #345E85 60%, #C0945E 100%);
  --gradient-hero:        linear-gradient(135deg, #F0F4F9 0%, #FAF6EE 50%, #FFFFFF 100%);

  /* ── Legacy gradient aliases (deprecated — point to new palette) ── */
  --gradient-pink-soft:   var(--gradient-gold-soft);
  --gradient-pink-warm:   var(--gradient-gold-warm);
  --gradient-pink-cream:  linear-gradient(180deg, #FCF8F2 0%, #FAF6EE 100%);
  --gradient-navy-pink:   var(--gradient-navy-gold);

  /* ── SPACING (4px base — full continuous scale) ── */
  --space-1:   4px;   --space-2:   8px;   --space-3:  12px;
  --space-4:  16px;   --space-5:  20px;   --space-6:  24px;
  --space-7:  28px;   --space-8:  32px;   --space-9:  36px;
  --space-10: 40px;   --space-11: 44px;   --space-12: 48px;
  --space-13: 52px;   --space-14: 56px;   --space-15: 60px;
  --space-16: 64px;   --space-17: 68px;   --space-18: 72px;
  --space-19: 76px;   --space-20: 80px;   --space-21: 84px;
  --space-22: 88px;   --space-23: 92px;   --space-24: 96px;
  --space-25: 100px;  --space-26: 104px;  --space-28: 112px;
  --space-30: 120px;  --space-32: 128px;

  /* ── RADIUS (Classic chic = soft, rounded) ── */
  --radius-xs:   4px;
  --radius-sm:   8px;
  --radius-md:   14px;
  --radius-lg:   22px;
  --radius-xl:   32px;
  --radius-full: 999px;

  /* ── SHADOWS (pink-tinted, soft) ── */
  --shadow-xs:        0 1px 2px rgba(24, 60, 100, .05);
  --shadow-sm:        0 2px 8px rgba(24, 60, 100, .06);
  --shadow-md:        0 10px 30px rgba(24, 60, 100, .08);
  --shadow-lg:        0 25px 50px rgba(24, 60, 100, .10);
  --shadow-xl:        0 35px 80px rgba(24, 60, 100, .14);
  --shadow-pink-glow: 0 12px 40px rgba(192, 148, 94, .35);
  --shadow-pink-soft: 0 8px 24px rgba(192, 148, 94, .15);
  --shadow-navy-glow: 0 12px 40px rgba(24, 60, 100, .25);

  /* ── TYPOGRAPHY ── */
  /* Display: Tajawal heavy weights — consistent number sizing across Arabic + Latin digits */
  --font-display:     'Tajawal', 'IBM Plex Sans Arabic', system-ui, sans-serif;
  --font-display-alt: 'Cormorant Garamond', 'Tajawal', serif;
  /* Body: same family, lighter weights */
  --font-body:        'Tajawal', 'IBM Plex Sans Arabic', system-ui, sans-serif;
  --font-arabic:      'Tajawal', system-ui, sans-serif;
  /* Latin: elegant accent (italic word, blockquote) */
  --font-latin:       'Cormorant Garamond', 'Playfair Display', Georgia, serif;
  --font-latin-body:  'Inter', 'Lato', system-ui, sans-serif;
  --font-mono:        'JetBrains Mono', Menlo, monospace;

  --text-xs:   12px;
  --text-sm:   14px;
  --text-base: 16px;
  --text-md:   18px;
  --text-lg:   20px;
  --text-xl:   24px;
  --text-2xl:  32px;
  --text-3xl:  40px;
  --text-4xl:  56px;
  --text-5xl:  72px;
  --text-6xl:  96px;

  --leading-tight:    1.15;
  --leading-snug:     1.35;
  --leading-normal:   1.5;
  --leading-relaxed:  1.7;
  --leading-loose:    2;

  /* Arabic-optimized */
  --leading-arabic-display: 1.3;
  --leading-arabic-body:    1.85;

  /* ── MOTION ── */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-inout:  cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast:   150ms;
  --dur-base:   250ms;
  --dur-slow:   400ms;
  --dur-slower: 700ms;

  /* ── LAYOUT ── */
  --container:       1280px;
  --container-tight: 1080px;
  --container-prose: 720px;
  --space-section:   clamp(80px, 10vw, 140px);
}

[lang="en"], [dir="ltr"] {
  --font-display: var(--font-latin);
  --font-body:    var(--font-latin-body);
}