/* ============================================================
   عاج سمنت (AAJ Cement) — Design Tokens
   Light · Cream · Minimal · Professional
   ============================================================ */
:root {
  /* ---- surfaces (warm cream / off-white) ---- */
  --bg:        #f7f4ef;   /* page background */
  --bg-pure:   #ffffff;
  --cream:     #efeae1;   /* raised section */
  --cream-2:   #e8e2d6;   /* card / input */
  --cream-3:   #e0d9cb;   /* hover */
  --sand:      #d9d1c2;

  /* ---- ink / text ---- */
  --ink:       #201d18;   /* near-black warm — headings */
  --ink-soft:  #34302a;
  --text:      #3c372f;   /* body */
  --muted:     #6b6357;   /* secondary (AA on cream) */
  --muted-2:   #8a8174;
  --faint:     #b4ab9c;

  /* ---- accent (restrained) ---- */
  --accent:    #201d18;   /* ink is the primary action color */
  --clay:      #9a6f4e;   /* subtle warm highlight, used sparingly */
  --clay-soft: #b08a68;

  /* ---- lines ---- */
  --line:      rgba(32,29,24,0.10);
  --line-2:    rgba(32,29,24,0.16);
  --line-soft: rgba(32,29,24,0.06);
  --hair:      #e4ddd1;

  /* ---- glass (light) ---- */
  --glass:     rgba(247,244,239,0.72);
  --glass-line:rgba(32,29,24,0.08);

  /* ---- shadows (soft, bright room) ---- */
  --shadow-xs: 0 1px 2px rgba(32,29,24,0.05);
  --shadow-sm: 0 8px 24px -14px rgba(32,29,24,0.22);
  --shadow-md: 0 26px 60px -30px rgba(32,29,24,0.30);
  --shadow-lg: 0 50px 120px -42px rgba(32,29,24,0.38);

  /* ---- radii ---- */
  --r-xs: 6px; --r-sm: 10px; --r-md: 16px; --r-lg: 22px; --r-xl: 30px; --r-pill: 999px;

  /* ---- type ---- */
  --font: "Vazirmatn", "Tahoma", "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
  --fw-light: 300; --fw-reg: 400; --fw-med: 500; --fw-semi: 600; --fw-bold: 700; --fw-black: 800;

  --t-eyebrow: clamp(.72rem, .68rem + .15vw, .8rem);
  --t-body:    clamp(1rem, .96rem + .2vw, 1.1rem);
  --t-lead:    clamp(1.1rem, 1rem + .55vw, 1.4rem);
  --t-h6: clamp(1rem, .95rem + .3vw, 1.18rem);
  --t-h5: clamp(1.2rem, 1.08rem + .5vw, 1.5rem);
  --t-h4: clamp(1.45rem, 1.25rem + 1vw, 2rem);
  --t-h3: clamp(1.8rem, 1.45rem + 1.7vw, 2.8rem);
  --t-h2: clamp(2.1rem, 1.55rem + 2.7vw, 3.7rem);
  --t-h1: clamp(2.5rem, 1.7rem + 4vw, 5.4rem);

  /* ---- layout ---- */
  --container: 1240px;
  --container-wide: 1480px;
  --gutter: clamp(1.2rem, 4vw, 3rem);
  --section-y: clamp(4.5rem, 9vw, 9rem);

  /* ---- motion ---- */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --d-fast: .25s; --d-base: .45s; --d-slow: .8s;

  /* ---- z ---- */
  --z-bg: 0; --z-base: 1; --z-nav: 80; --z-overlay: 90; --z-chat: 95; --z-modal: 100;
}