/* رموز التصميم — «المخطّط». لا تُكتب أي قيمة لونية خارج هذا الملف. */

:root {
  /* الذهبي — مستخرج من اللوجو */
  --gold-100: #E8DBBC;
  --gold-200: #DCC896;
  --gold-300: #D2B36A;   /* أفتح نقطة في التدرّج */
  --gold-500: #A38146;   /* الأساسي — خطوط وأيقونات وعناوين كبيرة فقط */
  --gold-700: #866232;   /* البرونزي — الأزرار والنص العادي */
  --gold-900: #6B4E28;   /* hover وحالات التركيز */
  --gold-text: #856D4A;  /* ذهبي النص العربي في اللوجو */

  /* الرمادي المعدني */
  --steel-300: #C4C5C7;
  --steel-500: #6D6E70;
  --steel-700: #4A4B4D;

  /* المحايد — وضع فاتح فقط */
  --ink:      #141210;
  --ink-mute: #55514B;
  --paper:    #F7F5F1;
  --surface:  #FFFFFF;
  --line:     #E4DFD6;
  --line-soft: #EFEAE1;

  /* الأشرطة الداكنة — عناصر تصميم داخل وضع فاتح، وليست ثيماً داكناً */
  --band:       #12100E;
  --band-soft:  #1D1A16;
  --band-line:  #302A22;
  --on-band:      #F4EFE6;
  --on-band-mute: #A8A099;

  --ok: #2F6B4F;  --warn: #9A6B1E;  --danger: #A33A2C;
  --whatsapp: #25D366;
  --whatsapp-dark: #1DA851;

  --gold-gradient: linear-gradient(135deg, #866232 0%, #A38146 50%, #D2B36A 100%);
  --gold-rule: linear-gradient(90deg, #A38146 0%, #D2B36A 60%, rgba(210,179,106,0) 100%);
  --hero-wash: radial-gradient(120% 90% at 88% 8%, rgba(210,179,106,.28) 0%, rgba(210,179,106,.10) 38%, rgba(247,245,241,0) 72%);
  --band-wash: radial-gradient(90% 120% at 92% 0%, rgba(163,129,70,.30) 0%, rgba(18,16,14,0) 62%);

  /* طبقات التعتيم فوق الصور */
  --scrim: linear-gradient(to top, rgba(15,13,12,.88) 0%, rgba(15,13,12,.52) 38%, rgba(15,13,12,.06) 72%, rgba(15,13,12,0) 100%);
  --scrim-soft: linear-gradient(to top, rgba(15,13,12,.62) 0%, rgba(15,13,12,0) 62%);

  /* المقاس — سلّم 4px */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px;
  --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px; --s-10:128px;

  /* الحواف — دقّة معمارية، ليست فقاعات */
  --r-sm:3px; --r-md:6px; --r-lg:10px; --r-pill:999px;

  --shadow-1: 0 1px 2px rgba(20,18,16,.05);
  --shadow-2: 0 6px 22px rgba(20,18,16,.09);
  --shadow-3: 0 18px 52px rgba(20,18,16,.16);
  --shadow-band: 0 22px 60px rgba(15,13,12,.32);
  --ring: 0 0 0 3px rgba(163,129,70,.35);

  --container: 1240px;
  --ease: cubic-bezier(.22,.61,.36,1);

  /* الخطوط */
  --font-head: "Tajawal", "Segoe UI", system-ui, sans-serif;
  --font-body: "Tajawal", "Segoe UI", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, monospace;

  /* الطبقات */
  --z-header: 100;
  --z-drawer: 200;
  --z-float: 150;
  --z-modal: 300;

  --header-h: 82px;
}