/* Hallmark · tokens · نقلة
 * theme: custom (bespoke) «الخانات» · paper-band: light · display: geometric-arabic · accent-hue: cool
 * قاعدة اللون: الرمادي = الخانة الحالية · الأزرق = الخانة التالية.
 * اللون يحمل معنى، لا يزيّن. لا تدرّجات بنفسجية.
 */

:root{
  /* ── اللون ─────────────────────────────── */
  --color-paper:     #FFFFFF;   /* اللوح الأبيض */
  --color-paper-2:   #EFF3F9;   /* سطح فاتح بارد */
  --color-paper-3:   #DDE5F0;   /* حدود وفواصل على الفاتح */

  --color-ink:       #0A1A33;   /* نص أساسي — كحلي عميق لا أسود */
  --color-ink-soft:  #46607E;   /* نص ثانوي */
  --color-ink-faint: #566D87;   /* تسميات — 5.4:1 على الأبيض، 4.8:1 على الرمادي */

  --color-blue:      #1B4DFF;   /* اللكنة — الخانة التالية */
  --color-blue-ink:  #123BCC;   /* أزرق أغمق للنص على الفاتح */
  --color-blue-deep: #08206B;   /* الألواح الزرقاء كاملة العرض */
  --color-blue-tint: #E4EAFF;   /* حشوة ناعمة */

  --color-alert:     #C4271B;   /* أخطاء النماذج فقط */

  /* على الألواح الزرقاء */
  --on-deep:         #FFFFFF;
  --on-deep-soft:    #B9C8F5;
  --on-deep-line:    rgba(255,255,255,.20);

  --color-line:      #E4EAF2;
  --color-line-2:    #C9D5E4;
  --color-focus:     #1B4DFF;

  /* ── الخط ──────────────────────────────── */
  --font-display: "Readex Pro", "Segoe UI", "Noto Sans Arabic", Tahoma, sans-serif;
  --font-body:    "IBM Plex Sans Arabic", "Segoe UI", "Noto Sans Arabic", Tahoma, sans-serif;
  --font-mono:    "IBM Plex Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;

  --text-xs:   .8rem;
  --text-sm:   .9rem;
  --text-base: 1.0rem;
  --text-md:   1.12rem;
  --text-lg:   1.34rem;
  --text-xl:   1.7rem;
  --text-2xl:  2.1rem;
  --text-3xl:  2.8rem;
  --text-display-s: clamp(1.95rem, 4.6vw, 3.2rem);
  --text-display:   clamp(2.5rem, 6.6vw, 5.0rem);

  --leading-tight: 1.45;      /* العربية تحتاج أعلى من اللاتينية — تشكيل وصواعد ونوازل */
  --leading-body:  1.8;         /* العربية تحتاج أعلى من اللاتينية */

  /* ── المسافات (4pt) ────────────────────── */
  --space-2xs: 4px;
  --space-xs:  8px;
  --space-sm:  12px;
  --space-md:  20px;
  --space-lg:  32px;
  --space-xl:  48px;
  --space-2xl: 76px;
  --space-3xl: clamp(76px, 11vw, 136px);

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-pill: 100px;
  --rule: 1px;

  --shadow-card: 0 1px 2px rgba(10,26,51,.05), 0 8px 24px -12px rgba(10,26,51,.16);
  --shadow-lift: 0 2px 4px rgba(10,26,51,.06), 0 18px 40px -18px rgba(10,26,51,.26);

  /* ── الحركة ────────────────────────────── */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:     cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  --dur-micro: 90ms;
  --dur-short: 170ms;
  --dur-long:  320ms;

  /* ── التخطيط ───────────────────────────── */
  --maxw: 1220px;
  --gutter: clamp(20px, 4vw, 48px);
}