/* =====================================================================
   BABAKRI — THEME TOKENS
   The single source of every design value (colour, type, space, shape).
   No other file hard-codes a colour or font: they all read these tokens.
   ===================================================================== */

:root {
  /* ---- Coat colours: taken from the Makhi Cheeni coat -------------- */
  --bk-sugar: #f7f2e8;      /* page background — the "cheeni" (sugar) */
  --bk-milk: #fffdf8;       /* raised surfaces: cards, panels */
  --bk-cream: #efe6d6;      /* soft fills: stages, chips, table rows */
  --bk-fleck: #2a211c;      /* the dark "makhi" (fly) fleck */
  --bk-fleck-brown: #4a372b;/* secondary dark-brown fleck */
  --bk-tan: #9c6b45;        /* tan fleck / darker ears */
  --bk-tan-soft: #c99a70;   /* light tan ear base */

  /* ---- Brand colours (wordmark) ------------------------------------ */
  --bk-saffron: #dd7224;    /* the orange "با" of the wordmark */
  --bk-saffron-deep: #b85a17;

  /* ---- Accent colours ---------------------------------------------- */
  --bk-henna: #a4482a;      /* primary action colour */
  --bk-henna-deep: #833720; /* primary action hover */
  --bk-olive: #5e6a45;      /* quiet secondary accent (trust, success) */

  /* ---- Text & lines ------------------------------------------------ */
  --bk-ink: #231c17;        /* headings and body text */
  --bk-ink-soft: #5f544b;   /* secondary text */
  --bk-ink-faint: #8c8177;  /* captions, meta */
  --bk-line: #e4d9c7;       /* hairlines and borders */

  /* ---- Typefaces (system fonts only — nothing loaded from the web) - */
  /* Calibri everywhere for consistency. Carlito is its free, same-size
     twin on non-Windows machines. Calibri has no Urdu letters, so Urdu
     falls back to Segoe UI (Windows) inside the wordmark. */
  --bk-font-brand: Calibri, Carlito, "Segoe UI", system-ui, sans-serif;
  --bk-font-display: var(--bk-font-brand);
  --bk-font-body: var(--bk-font-brand);
  --bk-font-urdu: "Noto Nastaliq Urdu", "Jameel Noori Nastaleeq",
    "Urdu Typesetting", "Segoe UI", Tahoma, sans-serif;

  /* ---- Type scale (fluid: grows gently with screen width) ---------- */
  --bk-step--1: clamp(0.83rem, 0.8rem + 0.15vw, 0.9rem);
  --bk-step-0: clamp(1rem, 0.96rem + 0.2vw, 1.08rem);
  --bk-step-1: clamp(1.18rem, 1.1rem + 0.45vw, 1.4rem);
  --bk-step-2: clamp(1.5rem, 1.3rem + 1vw, 2.1rem);
  --bk-step-3: clamp(2rem, 1.6rem + 2vw, 3.1rem);
  --bk-step-4: clamp(2.5rem, 1.8rem + 3.4vw, 4.5rem);

  /* ---- Spacing scale ----------------------------------------------- */
  --bk-space-1: 0.25rem;
  --bk-space-2: 0.5rem;
  --bk-space-3: 1rem;
  --bk-space-4: 1.5rem;
  --bk-space-5: 2.5rem;
  --bk-space-6: 4rem;
  --bk-section: clamp(4rem, 3rem + 5vw, 7.5rem); /* vertical section padding */

  /* ---- Shape & depth ----------------------------------------------- */
  --bk-radius-sm: 8px;
  --bk-radius: 14px;
  --bk-radius-lg: 24px;
  --bk-radius-pill: 999px;
  --bk-shadow: 0 1px 2px rgba(35, 28, 23, 0.06), 0 10px 30px rgba(35, 28, 23, 0.07);
  --bk-shadow-lift: 0 2px 4px rgba(35, 28, 23, 0.07), 0 18px 44px rgba(35, 28, 23, 0.12);

  /* ---- Layout ------------------------------------------------------ */
  --bk-max: 1180px;                        /* max content width */
  --bk-gutter: clamp(16px, 4vw, 40px);     /* side padding */
  --bk-header-h: 72px;                     /* sticky header height */

  /* ---- Motion ------------------------------------------------------ */
  --bk-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --bk-dur: 480ms;
}

/* ---- Urdu: switch every font to the Urdu stack and open line spacing */
html[lang="ur"] {
  --bk-font-display: var(--bk-font-urdu);
  --bk-font-body: var(--bk-font-urdu);
}