/* =========================================================
   جمعية القُرية للتراث — Design Tokens
   المصدر: دليل الهوية البصرية (الهوية.pdf) — الصفحات 11، 13، 16
   ========================================================= */

/* الخط الرسمي 29LT Kaff (مرخّص). ضع ملفات woff2 في assets/fonts بعد شراء رخصة الويب
   وفعّل سطور url أدناه. حتى ذلك الحين يُستخدم IBM Plex Sans Arabic كبديل مجاني متقارب. */
@font-face { font-family: "29LT Kaff"; font-weight: 300; font-display: swap; src: local("29LT Kaff Light"), local("29LTKaff-Light") /*, url("../fonts/29LTKaff-Light.woff2") format("woff2") */; }
@font-face { font-family: "29LT Kaff"; font-weight: 500; font-display: swap; src: local("29LT Kaff Medium"), local("29LTKaff-Medium") /*, url("../fonts/29LTKaff-Medium.woff2") format("woff2") */; }
@font-face { font-family: "29LT Kaff"; font-weight: 600; font-display: swap; src: local("29LT Kaff SemiBold"), local("29LTKaff-SemiBold") /*, url("../fonts/29LTKaff-SemiBold.woff2") format("woff2") */; }
@font-face { font-family: "29LT Kaff"; font-weight: 900; font-display: swap; src: local("29LT Kaff Black"), local("29LTKaff-Black") /*, url("../fonts/29LTKaff-Black.woff2") format("woff2") */; }

:root {
  /* ---------- Brand primitives (exact HEX from guide p.11) ---------- */
  --terracotta: #BD452A;      /* أساسي — 22% */
  --dark-umber: #564334;      /* أساسي — 16% */
  --ivory: #F5F0E8;           /* ثانوي — 40% */
  --sand: #D8C3A5;            /* ثانوي — 10% */
  --sage: #7C8063;            /* ثانوي — 7%  */
  --burnt-umber: #5F2D11;     /* ثانوي — 5%  */

  /* Derived steps (for states & accessible text) */
  --terracotta-700: #A33B23;  /* نص/روابط على العاجي (5.6:1) */
  --terracotta-800: #8A3019;
  --terracotta-300: #E2A08F;
  --terracotta-100: #F6E1DA;
  --terracotta-50:  #FBF0EC;
  --umber-900: #2E241C;
  --umber-800: #3E3026;
  --umber-600: #6F5A49;
  --umber-500: #8A7563;
  --umber-300: #C9BCAE;
  --umber-200: #E2D9CE;
  --sand-100: #EFE5D6;
  --ivory-50: #FBF8F3;
  --sage-700: #5E6249;
  --sage-100: #E7E8DE;

  /* ---------- Semantic (light) ---------- */
  --bg: var(--ivory);
  --bg-soft: var(--ivory-50);
  --surface: #FFFFFF;
  --surface-2: var(--sand-100);
  --ink: var(--umber-900);
  --ink-2: var(--dark-umber);
  --ink-3: var(--umber-600);           /* 5.9:1 على العاجي */
  --ink-on-dark: var(--ivory);
  --line: var(--umber-200);
  --line-strong: var(--umber-300);
  --primary: var(--terracotta);
  --primary-ink: var(--terracotta-700);
  --primary-hover: var(--terracotta-800);
  --on-primary: #FFFFFF;
  --focus: var(--terracotta);

  /* Status — reserved, always paired with icon + label */
  --ok: #3F7A4A;      --ok-bg: #E4F0E4;
  --warn: #9A6A0B;    --warn-bg: #FBF0D5;
  --danger: #B3261E;  --danger-bg: #FBE3E1;
  --info: #3D6178;    --info-bg: #E2ECF2;

  /* ---------- Typography (guide p.13: H1 Black / H2 Semibold / H3 Medium / Body Light) ---------- */
  --font: "29LT Kaff", "IBM Plex Sans Arabic", system-ui, "Segoe UI", Tahoma, sans-serif;
  --fw-light: 300; --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-black: 700;
  --fs-xs: .8125rem;   /* 13 */
  --fs-sm: .875rem;    /* 14 */
  --fs-base: 1rem;     /* 16 */
  --fs-md: 1.125rem;   /* 18 */
  --fs-lg: 1.375rem;   /* 22 */
  --fs-xl: clamp(1.5rem, 1.2rem + 1.2vw, 2rem);
  --fs-2xl: clamp(1.875rem, 1.4rem + 2vw, 2.75rem);
  --fs-3xl: clamp(2.25rem, 1.5rem + 3.4vw, 4rem);
  --lh-tight: 1.25; --lh-body: 1.8;

  /* ---------- Space / radius / shadow / motion ---------- */
  --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;
  --r-sm: 6px; --r-md: 10px; --r-lg: 16px; --r-xl: 24px; --r-arch: 999px 999px 0 0;
  --shadow-1: 0 1px 2px rgb(46 36 28 / .06), 0 1px 1px rgb(46 36 28 / .04);
  --shadow-2: 0 8px 24px -8px rgb(46 36 28 / .18);
  --shadow-3: 0 24px 60px -20px rgb(46 36 28 / .35);
  --ease: cubic-bezier(.2, .7, .2, 1);
  --t-fast: 150ms; --t-base: 240ms; --t-slow: 480ms;
  --container: 1240px;
  --header-h: 84px;
}
