/* ==========================================================
   tokens.css — colour, type, space and shape. Everything else
   reads from here.

   Palette (named for the region):
     neel   = block-print indigo   (brand, primary actions, dark bands)
     haldi  = turmeric             (highlight on dark, small markers)
     geru   = red ochre            (Gau Seva)
     nila   = cobalt               (Shiksha)
     pudina = deep teal            (Jansewa)
   Colour is used for meaning, not decoration: each initiative owns one
   hue, and that hue shows up on its cards, chips and figures.
   ========================================================== */
:root{
  /* surfaces */
  --bg:#F6F4EE;
  --bg-2:#EEEBE2;
  --bg-3:#E2DED2;
  --surface:#FFFFFF;
  --night:#13204A;
  --night-2:#1C2D63;
  --footer:#0E1735;

  /* ink */
  --ink:#151A2D;
  --ink-2:#424860;
  --ink-3:#636A80;
  --line:rgba(21,26,45,.13);
  --line-2:rgba(21,26,45,.28);
  --on-night:#F4F1E8;
  --on-night-2:#C3C9DC;
  --on-night-line:rgba(244,241,232,.2);

  /* brand */
  --primary:#1B2B66;           /* buttons, active states, links on light */
  --primary-ink:#FFFFFF;
  --primary-hover:#142052;
  --haldi:#F0B232;             /* on dark: markers, highlights, primary action */
  --haldi-deep:#8A5A00;        /* haldi as text on light */
  --haldi-soft:#FBEFCB;
  --focus:#2653B8;
  --on-tone:#FFFFFF;           /* text on a solid initiative colour */

  /* kept as aliases so older rules keep working */
  --accent:var(--primary);
  --accent-ink:var(--primary-ink);
  --accent-soft:#E4E8F5;
  --accent-text:var(--primary);

  /* the three initiatives */
  --gau:#B4431B;      --gau-soft:#F8E5DB;
  --shiksha:#2653B8;  --shiksha-soft:#E1E8F8;
  --jansewa:#0E766A;  --jansewa-soft:#D9EFEA;

  /* status */
  --good:#23724B; --good-soft:#DDF0E5;
  --warn:#8A5A00; --crit:#B3261E;
  --wa:#1B7F45;

  /* motion */
  --ease:cubic-bezier(.22,.8,.24,1);
  --ease-in:cubic-bezier(.5,0,.8,.2);

  /* type: Google Sans for reading and interface, Eczar for display.
     "BMS Deva" is the visitor's own Kohinoor Devanagari where the OS has it
     (Apple devices); it only ever supplies Devanagari glyphs (see base.css). */
  --f-body:'BMS Deva','Google Sans','Noto Sans Devanagari',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-display:'Eczar','Noto Serif Devanagari',Georgia,serif;
  --f-num:'Google Sans','BMS Deva',system-ui,sans-serif;

  /* space: one 4-based scale */
  --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;
  --gutter:clamp(20px,4vw,48px);
  --maxw:1240px;
  --sec:clamp(64px,7.5vw,112px);
  --header-h:72px;

  /* shape: boxy. Controls 2px, panels 4px, photographs square. */
  --r-s:2px; --r-m:2px; --r-l:4px;

  /* elevation: borders first, shadow only when something floats */
  --sh-1:0 1px 2px rgba(19,32,74,.06),0 4px 12px -4px rgba(19,32,74,.10);
  --sh-2:0 2px 4px rgba(19,32,74,.08),0 18px 40px -16px rgba(19,32,74,.28);
  color-scheme:light;
}

html[lang="en"]{--f-display:'Eczar','Noto Serif Devanagari',Georgia,serif}

:root[data-theme="dark"]{
  --bg:#0D1224;
  --bg-2:#131A31;
  --bg-3:#1B2441;
  --surface:#161E38;
  --night:#0A0F20;
  --night-2:#121A33;
  --footer:#080C19;

  --ink:#EEF0F8;
  --ink-2:#C2C8DB;
  --ink-3:#98A0B8;
  --line:rgba(238,240,248,.13);
  --line-2:rgba(238,240,248,.28);

  --primary:#F0B232;
  --primary-ink:#101839;
  --primary-hover:#FFC44D;
  --haldi-deep:#F0B232;
  --haldi-soft:#2C2610;
  --focus:#8FAEEA;
  --on-tone:#0D1224;
  --accent-soft:#1D2646;

  --gau:#EE8A5E;     --gau-soft:#35201A;
  --shiksha:#8FAEEA; --shiksha-soft:#1B2749;
  --jansewa:#5FC3B5; --jansewa-soft:#12302C;
  --good:#5CC48D; --good-soft:#14301F;
  --warn:#F2B441; --crit:#F2786B;
  --wa:#47B877;

  --sh-1:0 1px 2px rgba(0,0,0,.4),0 4px 12px -4px rgba(0,0,0,.5);
  --sh-2:0 2px 4px rgba(0,0,0,.4),0 18px 40px -16px rgba(0,0,0,.7);
  color-scheme:dark;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0D1224;--bg-2:#131A31;--bg-3:#1B2441;--surface:#161E38;--night:#0A0F20;--night-2:#121A33;--footer:#080C19;
    --ink:#EEF0F8;--ink-2:#C2C8DB;--ink-3:#98A0B8;--line:rgba(238,240,248,.13);--line-2:rgba(238,240,248,.28);
    --primary:#F0B232;--primary-ink:#101839;--primary-hover:#FFC44D;--haldi-deep:#F0B232;--haldi-soft:#2C2610;--focus:#8FAEEA;--on-tone:#0D1224;--accent-soft:#1D2646;
    --gau:#EE8A5E;--gau-soft:#35201A;--shiksha:#8FAEEA;--shiksha-soft:#1B2749;--jansewa:#5FC3B5;--jansewa-soft:#12302C;
    --good:#5CC48D;--good-soft:#14301F;--warn:#F2B441;--crit:#F2786B;--wa:#47B877;
    --sh-1:0 1px 2px rgba(0,0,0,.4),0 4px 12px -4px rgba(0,0,0,.5);--sh-2:0 2px 4px rgba(0,0,0,.4),0 18px 40px -16px rgba(0,0,0,.7);
    color-scheme:dark;
  }
}
@media (max-width:760px){:root{--header-h:64px}}
