/* =========================================================
   ELGOLD STUDIO — Design Tokens
   كل القيم متغيّرات (Navy + Cream) — قابلة للتغيير من مكان واحد
   ========================================================= */
:root {
  /* ===== Brand: Navy + Cream ===== */
  --navy-900: #070C20;
  --navy-800: #0A1330;   /* الخلفية الأساسية */
  --navy-700: #0E1A44;   /* surface */
  --navy-600: #13235C;
  --navy-500: #1B2F74;
  --blue-glow: #2A47C0;  /* توهّج من عيلة الكحلي */
  --accent2:   #6C8BFF;  /* أزرق فاتح مساعد (للتدرّجات والتمييز) */
  --cream:     #F4EEDF;
  --cream-2:   #E8E0CC;

  /* ===== Semantic (من البريف) ===== */
  --background: var(--navy-800);
  --surface:    var(--navy-700);
  --card:       rgba(244, 238, 223, 0.04);
  --glass:      rgba(244, 238, 223, 0.06);
  --border:     rgba(244, 238, 223, 0.12);
  --primary:    var(--cream);
  --secondary:  var(--navy-500);
  --accent:     var(--cream);
  --text:       var(--cream);
  --muted:      rgba(244, 238, 223, 0.62);
  --ink:        var(--navy-900);   /* نص فوق الكريمي */
  --success:    #5BD6A0;
  --warning:    #E6B566;
  --danger:     #E2796B;
  --glow:       rgba(42, 71, 192, 0.45);
  --gradient-start: var(--navy-800);
  --gradient-end:   var(--navy-600);
  --light-bg:   var(--cream);

  /* ===== Fonts ===== */
  --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body:    'Inter', system-ui, -apple-system, sans-serif;
  --font-en:      'Inter', system-ui, -apple-system, sans-serif;   /* لاتيني دايمًا (أيقونات/أرقام/شارات) */
  --font-ar:      'Falasteen', 'Inter', 'Cairo', 'Tajawal', sans-serif;
  --font:         var(--font-body);

  /* ===== Spacing scale (بس دول) ===== */
  --s-4: 4px;   --s-8: 8px;   --s-12: 12px; --s-16: 16px; --s-20: 20px;
  --s-24: 24px; --s-32: 32px; --s-40: 40px; --s-48: 48px; --s-64: 64px;
  --s-80: 80px; --s-96: 96px; --s-120: 120px; --s-160: 160px;

  /* ===== Radius ===== */
  --r-sm: 10px; --r-md: 18px; --r-lg: 28px; --r-hero: 36px; --r-pill: 999px;

  /* ===== Layout ===== */
  --max: 1440px; --content: 1280px; --reading: 720px;
  --pad: clamp(18px, 4.5vw, 32px); --nav-h: 84px;   /* مسافة جانبية مرنة لكل المقاسات */

  /* ===== Motion ===== */
  --t-fast: .25s; --t-normal: .45s; --t-slow: .8s; --t-premium: 1.2s;
  --ease: cubic-bezier(.22, 1, .36, 1);
  --ease-soft: cubic-bezier(.4, 0, .2, 1);
}

/* العربي: العناوين الرئيسية بخط فلسطين، وباقي النصوص بخط Cairo (سهل للقراءة) + مسافات أوسع */
html[lang="ar"] {
  --font: 'Cairo', 'Tajawal', system-ui, sans-serif;          /* النص العادي — واضح ومريح */
  --font-display: 'Cairo', 'Tajawal', sans-serif;
}
/* العناوين الرئيسية بخط فلسطين + مسافة مريحة بين السطور */
html[lang="ar"] .sec-title,
html[lang="ar"] .cta__title { font-family: 'Falasteen', 'Cairo', sans-serif; line-height: 1.5; padding-bottom: .08em; }
/* مسافة أوضح بين العنوان والوصف (عشان امتدادات خط فلسطين لتحت) */
html[lang="ar"] .sec-sub { margin-top: var(--s-24); }
/* مسافة أوسع بين السطور للنصوص العربية عشان تتقرا مريح */
html[lang="ar"] p,
html[lang="ar"] .sec-sub,
html[lang="ar"] .work-card__body p,
html[lang="ar"] .step p,
html[lang="ar"] .about__text p,
html[lang="ar"] li { line-height: 2; }

/* خط فلسطين — لما تحط الملف في assets/fonts/ هيشتغل تلقائياً، لحد كده fallback */
@font-face {
  font-family: 'Falasteen';
  src: url('../assets/fonts/Falasteen.ttf') format('truetype');
  font-weight: 100 900;
  font-display: swap;
  /* عربي فقط — الخط حروفه اللاتينية فاضية، فنقصره على نطاق العربي
     عشان أي نص لاتيني (إيميل/PayPal/أسماء) يرجع لـInter تلقائياً */
  unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200F, U+0640;
}
/* Tajawal مستضاف محلياً (مفتوح المصدر) — لاسم الهيرو العربي، يتحمّل أكيد من سيرفرنا */
@font-face {
  font-family: 'Tajawal';
  src: url('../assets/fonts/Tajawal-Medium.ttf') format('truetype');
  font-weight: 500; font-display: swap;
}
@font-face {
  font-family: 'Tajawal';
  src: url('../assets/fonts/Tajawal-Bold.ttf') format('truetype');
  font-weight: 700; font-display: swap;
}

/* الأقسام الفاتحة (كريمي) */
.theme-light {
  --background: var(--cream);
  --surface: #FBF7EC;
  --text: var(--navy-900);
  --muted: rgba(10, 19, 48, 0.62);
  --border: rgba(10, 19, 48, 0.12);
  --card: rgba(10, 19, 48, 0.03);
  --primary: var(--navy-800);
  --accent: var(--navy-600);   /* عشان أيقونات الكروت وخطوط الـeyebrow تبان على البيج */
}