/* ==========================================================
   DBIM 3.0 TYPOGRAPHY
   Reference: Digital Brand Identity Manual, Chapter 4
   Main typeface: Noto Sans
   ========================================================== */

/* ---------- 1. TOKENS ---------- */
:root {
  /* Font family (Noto Sans for all scripts) */
  --font-main: "Noto Sans", "Noto Sans Tamil", "Noto Sans Devanagari", Arial, sans-serif;

  /* Weights */
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  /* Type scale: desktop (DBIM Table 3) */
  --fs-h1: 36px;
  --fs-h2: 24px;
  --fs-h3: 20px;
  --fs-p1: 16px;
  --fs-p2: 14px;
  --fs-small: 12px;

  /* Line height: must be 1.2 to 1.5 times the font size */
  --lh-heading: 1.3;
  --lh-body: 1.5;

  /* Text colours (DBIM functional palette) */
  --text-on-light: #150202;   /* Deep Earthy Brown */
  --text-on-dark: #FFFFFF;    /* Inclusive White */
  --bg-page: #FFFFFF;
  --link-color: #0D6EFD;
  --brand-primary:#162F6A;
  --brand-secondary:#3155A4;
  --brand-light:#DCE6F7;

  --color-black:#000000;

  --color-white:#FFFFFF;
}

/* Mobile scale (DBIM Table 4) */
@media (max-width: 767px) {
  :root {
    --fs-h1: 24px;
    --fs-h2: 20px;
    --fs-h3: 16px;
    --fs-p1: 14px;
    --fs-p2: 12px;
    --fs-small: 10px;
  }
}

/* ---------- 2. BASE ---------- */
html {
  font-family: var(--font-main);
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  font-family: var(--font-main);
  font-size: var(--fs-p1);
  font-weight: var(--fw-regular);
  line-height: var(--lh-body);
  color: var(--text-on-light);
  background-color: var(--bg-page);
  text-align: left;               /* body text must be left-aligned */
}

/* ---------- 3. HEADINGS ---------- */
h1, h2, h3 {
  font-family: var(--font-main);
  font-weight: var(--fw-semibold);
  line-height: var(--lh-heading);
  margin: 0 0 0.5em;
}
h1 { font-size: var(--fs-h1); }
h2 { font-size: var(--fs-h2); }
h3 { font-size: var(--fs-h3); }

/* ---------- 4. TEXT ---------- */
p {
  font-size: var(--fs-p1);
  line-height: var(--lh-body);
  margin: 0 0 1em;
}


html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td{
    font-family: var(--font-main);
}

small { font-size: var(--fs-small); }
strong, b { font-weight: var(--fw-bold); }

a { color: var(--link-color); }
a:hover,
a:focus { text-decoration: underline; }   /* visible hover feedback */

/* ---------- 5. FORM CONTROLS ---------- */
button, input, select, textarea, optgroup {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

/* ---------- 6. TABLES (DBIM 4.1.1) ---------- */
th { text-align: center; font-weight: var(--fw-semibold); }
td { text-align: left; }
td.num { text-align: right; }     /* add class="num" to number cells */

/* ---------- 7. UTILITY CLASSES ---------- */
.text-p1     { font-size: var(--fs-p1); }
.text-p2     { font-size: var(--fs-p2); }
.text-small  { font-size: var(--fs-small); }

.fw-regular  { font-weight: var(--fw-regular); }
.fw-medium   { font-weight: var(--fw-medium); }
.fw-semibold { font-weight: var(--fw-semibold); }
.fw-bold     { font-weight: var(--fw-bold); }

.on-dark     { color: var(--text-on-dark); }  /* white text on dark backgrounds */
.caps-short  { text-transform: uppercase; }   /* short labels only, never paragraphs */