/* BARUN & VIDAS - design tokens
   Fountain-ink system: cool bond paper, graphite text, deep navy panels,
   ultramarine ink accents, steel blue on dark. Ibarra Real Nova + Golos Text. */
:root {
  /* Surfaces */
  --color-paper: #f1f0e9;        /* cool bond paper, page background */
  --color-card: #faf9f3;         /* raised cards on paper */
  --color-navy: #101f33;         /* dark section background */
  --color-navy-2: #0b1626;       /* footer, deepest */
  --color-navy-card: #16283f;    /* cards on navy */

  /* Ink */
  --color-ink: #1a2129;          /* graphite text on paper */
  --color-muted: #5b6470;        /* secondary text on paper */
  --color-cream: #ece9df;        /* text on navy */
  --color-muted-d: #93a2b4;      /* secondary text on navy */

  /* Accents */
  --color-blue: #2646a8;         /* fountain ink: links, numerals, buttons */
  --color-blue-strong: #1c3585;  /* hover / active */
  --color-steel: #9fb4cd;        /* accent on dark sections */

  /* Lines */
  --color-line: #d8d5c8;         /* hairlines on paper */
  --color-line-d: rgba(159, 180, 205, .22); /* hairlines on navy */

  /* Type */
  --font-display: "Ibarra Real Nova", Georgia, "Times New Roman", serif;
  --font-body: "Golos Text", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --fs-200: .8125rem;
  --fs-300: .9075rem;
  --fs-400: 1rem;
  --fs-500: 1.145rem;
  --fs-600: clamp(1.3rem, 1.15rem + .5vw, 1.6rem);
  --fs-700: clamp(1.7rem, 1.4rem + 1vw, 2.3rem);
  --fs-800: clamp(2rem, 1.55rem + 1.7vw, 3.05rem);
  --fs-hero: clamp(2.55rem, 1.75rem + 3.1vw, 4.5rem);

  /* Space */
  --s1: .25rem; --s2: .5rem; --s3: .75rem; --s4: 1rem; --s5: 1.5rem;
  --s6: 2rem; --s7: 2.75rem; --s8: 3.5rem; --s9: 4.5rem; --s10: 6rem;

  /* Shape */
  --radius-xs: 2px;              /* buttons, inputs: sharp, legal */
  --radius-sm: 4px;              /* cards */
  --arch: 999px 999px 0 0;       /* the recurring portal motif */

  --shadow-soft: 0 10px 30px rgba(16, 31, 51, .1);

  --container: 71rem;
  --header-h: 4.25rem;
}

/* Wide screens (added 2026-07-13): let content breathe on 27"+ displays.
   Container grows and the percentage root scales type + spacing together
   while respecting user font-size preferences. Nothing below 1600px changes. */
@media (min-width: 1600px) {
  :root { --container: 1400px; }
  html { font-size: 106.25%; }
}
@media (min-width: 2000px) {
  :root { --container: 1560px; }
  html { font-size: 112.5%; }
}