/* ================================================================
   MAJALAH EKSIS — Global Design Tokens & Variables
   ================================================================ */

:root {
    /* --- 1. CORE COLORS (Extended Slate & Blue) --- */
    --blue-950: #0f172a;
    --blue-900: #1F56DC;
    --blue-700: #122a55;
    --blue-600: #2563eb;
    --blue-500: #3b82f6;
    --blue-100: #dfe7f2;
    --blue-50: #f8fafc;

    --gold-400: #ffcc00;
    --gold-500: #eab308;

    --slate-950: #020617;
    --slate-900: #0f172a;
    --slate-800: #1e293b;
    --slate-700: #334155;
    --slate-600: #475569;
    --slate-500: #64748b;
    --slate-400: #94a3b8;
    --slate-300: #cbd5e1;
    --slate-100: #f1f5f9;
    --white: #ffffff;

    --clr-dark: #0f172a;
    --clr-primary: #1e3a8a;
    --clr-accent: #fbbf24;
    --clr-cyan: #06b6d4;

    /* --- 2. TYPOGRAPHY --- */
    --f: 'Plus Jakarta Sans', sans-serif;
    --f-heading: 'Plus Jakarta Sans', sans-serif;
    --article-max-w: 820px;
    --article-line-h: 1.85;
    --article-spacing: 2.25rem;

    /* --- 3. BORDERS & RADIUS --- */
    --r-sm: 10px;
    --r-md: 20px;
    --r-lg: 28px;
    --r-xl: 40px;
    --radius-hero-desktop: 48px;
    --radius-hero-mobile: 24px;
    --radius-card: 24px;

    /* --- 4. SHADOWS (Standardized Crystal Look) --- */
    --shadow-sm: none !important;
    --shadow-md: none !important;
    --shadow-card: none !important;
    --shadow-hover: none !important;
    --shadow-soft: none !important;
    --shadow-float: none !important;
    --shadow-glass: none !important;
    --gilded-shadow: none !important;

    /* --- 5. TRANSITIONS & EFFECTS --- */
    --trans-ease: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    --trans-spring: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    --ease-editorial: cubic-bezier(0.4, 0, 0.2, 1);
    --section-spacing: 6rem;
    --glass-blur: 25px;

    /* --- 6. GLASSMORPHISM 2.0 --- */
    --bg-modern-white: #f1f5f9; 
    --gilded-glass-bg: rgba(255, 255, 255, 0.75);
    --gilded-glass-border: rgba(255, 255, 255, 0.9);
    --glass-bg: rgba(255, 255, 255, 0.15);
    --glass-border: rgba(255, 255, 255, 0.4);
    --glass-highlight: linear-gradient(135deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.05) 50%, transparent 100%);
}
