/* ============================================================
   IDF Bangladesh — Design Tokens (LOCKED)
   The palette is fixed by the brand. Do not fork it.
   Signature: deep forest + saffron-red + a restrained gold rule on cream.
   ============================================================ */

:root {
  /* --- Brand palette --- */
  --forest:    #003a16;  /* nav, footer, dark sections, headings on cream */
  --forest-d:  #072c1e;  /* deepest shade — footer base, forest hover */
  --saffron:   #fd1100;  /* primary CTA — donate only */
  --amber-lt:  #ff4800;  /* CTA hover / gradient partner */
  --cream:     #ffffff;  /* base page background */
  --cream-d:   #f3f3f3;  /* cards, alternating sections */
  --slate:     #d5d7dd;  /* muted text — large/secondary UI only (borderline on cream) */
  --muted:     #4B5563;  /* accessible muted text for small copy on light surfaces (WCAG AA ≥4.5:1) */
  --ink:       #000000;  /* primary body text */
  --white:     #FFFFFF;
  --gold-rule: #ffb300;  /* dividers, small premium accents — sparing */

  /* --- Derived usage tokens --- */
  --forest-14: rgba(28, 66, 52, .14);
  --forest-08: rgba(28, 66, 52, .08);
  --forest-04: rgba(28, 66, 52, .04);
  --gold-20:   rgba(197, 162, 83, .20);
  --gold-40:   rgba(197, 162, 83, .40);
  --ink-70:    rgba(17, 24, 21, .70);
  --cream-70:  rgba(247, 243, 237, .72);
  --cta-grad:  linear-gradient(135deg, var(--saffron) 0%, var(--amber-lt) 100%);

  /* --- Typography --- */
  --font-display: 'Poppins', Georgia, serif;
  --font-body:    'Inter', system-ui, -apple-system, Segoe UI, sans-serif;


  /* Fluid type scale — clamp(min, preferred, max) */
  --fs-300: .8125rem;                              /* 13px — eyebrows, meta */
  --fs-400: 1rem;                                  /* 16px — body */
  --fs-500: 1.125rem;                              /* 18px — lead paragraph */
  --fs-600: clamp(1.25rem, 1.10rem + .55vw, 1.5rem);
  --fs-700: clamp(1.55rem, 1.25rem + 1.4vw, 2.25rem);
  --fs-800: clamp(2.05rem, 1.45rem + 2.7vw, 3.4rem);
  --fs-900: clamp(2.5rem,  1.55rem + 4.3vw, 4.75rem);

  --lh-tight: 1.06;
  --lh-snug:  1.26;
  --lh-body:  1.62;
  --tracking-eyebrow: .14em;

  /* --- Spacing scale --- */
  --sp-1: .25rem;  --sp-2: .5rem;  --sp-3: .75rem; --sp-4: 1rem;
  --sp-5: 1.5rem;  --sp-6: 2rem;   --sp-7: 3rem;   --sp-8: 4rem;
  --sp-9: 6rem;    --sp-10: 8rem;

  /* --- Layout --- */
  --container:      1200px;
  --container-wide: 1360px;
  --container-text: 760px;   /* readable prose measure */
  --gutter: clamp(1.25rem, 5vw, 3rem);

  /* --- Radii --- */
  --r-sm: 6px; --r-md: 12px; --r-lg: 20px; --r-xl: 28px; --r-pill: 999px;

  /* --- Elevation --- */
  --shadow-sm: 0 1px 2px rgba(17,24,21,.05), 0 2px 8px rgba(17,24,21,.05);
  --shadow-md: 0 10px 30px rgba(17,24,21,.10);
  --shadow-lg: 0 28px 64px rgba(17,24,21,.18);

  /* --- Motion --- */
  --ease-silk: cubic-bezier(.22, .61, .36, 1);
  --t-fast: .18s;
  --t-med:  .32s;
  --t-slow: .6s;

  /* --- Chrome --- */
  --header-h: 78px;
  --header-h-scrolled: 66px;
}