/* ==================================================
   شجرة عائلة المحيربي — رموز التصميم (Luxury Edition)
   ================================================== */

:root {
    /* ═══════════════════════════════════════════════
       الخلفيات — طبقات عمق محسوبة
    ═══════════════════════════════════════════════ */
    --bg:          #060e11;
    --bg-2:        #0a1820;
    --bg-3:        #0f2230;
    --bg-4:        #132840;
    --bg-glass:    rgba(6, 14, 17, 0.72);

    /* ═══════════════════════════════════════════════
       الحبر — نصوص بتباين عالٍ
    ═══════════════════════════════════════════════ */
    --ink:         #f5ede0;
    --ink-dim:     #c8bfb0;
    --ink-faint:   #8a8278;
    --ink-muted:   #4a4540;

    /* ═══════════════════════════════════════════════
       الذهبي — درجات شامبانيا فاخرة
    ═══════════════════════════════════════════════ */
    --gold:         #c8a85a;
    --gold-bright:  #f0d080;
    --gold-pale:    #f8e8b0;
    --gold-deep:    #8a6c30;
    --gold-copper:  #b07840;
    --gold-glow:    rgba(200, 168, 90, 0.40);
    --gold-glow-sm: rgba(200, 168, 90, 0.18);
    --gold-rim:     rgba(240, 208, 128, 0.22);

    /* ═══════════════════════════════════════════════
       الأسطح الزجاجية — Glassmorphism
    ═══════════════════════════════════════════════ */
    --glass:           rgba(12, 24, 34, 0.78);
    --glass-mid:       rgba(10, 20, 30, 0.88);
    --glass-deep:      rgba(6, 12, 18, 0.94);
    --glass-strong:    rgba(6, 12, 18, 0.94);  /* alias للتوافق */
    --glass-border:    rgba(200, 168, 90, 0.18);
    --glass-border-hi: rgba(240, 208, 128, 0.35);
    --glass-blur:      18px;
    --glass-blur-sm:   10px;

    /* ═══════════════════════════════════════════════
       الظلال
    ═══════════════════════════════════════════════ */
    --shadow-gold:    0 0 28px rgba(200, 168, 90, 0.22), 0 0 6px rgba(200, 168, 90, 0.12);
    --shadow-gold-lg: 0 0 48px rgba(200, 168, 90, 0.30), 0 0 16px rgba(200, 168, 90, 0.16);
    --shadow-soft:    0 12px 40px rgba(0, 0, 0, 0.55);
    --shadow-deep:    0 24px 72px rgba(0, 0, 0, 0.70);
    --shadow-inner:   inset 0 1px 0 rgba(255, 255, 255, 0.04);

    /* ═══════════════════════════════════════════════
       الخطوط
    ═══════════════════════════════════════════════ */
    --font-display: 'Amiri', 'Times New Roman', serif;
    --font-body:    'IBM Plex Sans Arabic', 'Segoe UI', Tahoma, sans-serif;

    /* ═══════════════════════════════════════════════
       المقاسات
    ═══════════════════════════════════════════════ */
    --radius:    12px;
    --radius-md: 18px;
    --radius-lg: 26px;
    --radius-xl: 36px;
    --container: 1280px;

    /* ═══════════════════════════════════════════════
       الحركة
    ═══════════════════════════════════════════════ */
    --ease:       cubic-bezier(0.22, 1, 0.36, 1);
    --ease-in:    cubic-bezier(0.4, 0, 1, 1);
    --ease-out:   cubic-bezier(0, 0, 0.2, 1);
    --speed:      300ms;
    --speed-fast: 180ms;
    --speed-slow: 500ms;
}