/* tokens.css — дизайн-токены «Содружество». Деловой синий, строгий официальный стиль.
   Базовые цвета также прокидываются из site.theme (JSON) через app.js → перекрывают эти дефолты. */
:root {
  /* бренд */
  --navy: #0d2440;        /* тёмно-синий: хедер/футер/H2 */
  --navy-2: #122e52;
  --blue: #1b4f8a;        /* деловой синий: ссылки/CTA/акценты */
  --blue-deep: #0a1c33;   /* самый тёмный акцент */
  --bronze: #b08a4a;      /* тонкий «наследие»-акцент, хайрлайны */

  --ink: #1c2536;         /* основной текст */
  --muted: #5b6675;       /* приглушённый */
  --line: #e2e8f0;        /* линии/границы */
  --paper: #ffffff;       /* фон */
  --paper-2: #f4f6f9;     /* фон секций (сине-серый) */
  --paper-3: #eef2f7;

  /* производные */
  --navy-soft: color-mix(in srgb, var(--navy) 5%, var(--paper));
  --blue-soft: color-mix(in srgb, var(--blue) 8%, var(--paper));
  --blue-12: color-mix(in srgb, var(--blue) 12%, transparent);
  --bronze-line: color-mix(in srgb, var(--bronze) 60%, transparent);
  --on-navy: #eef3fa;
  --on-navy-muted: color-mix(in srgb, #ffffff 64%, var(--navy));

  /* шрифты — единый современный шрифт на весь проект (Manrope) */
  --font-display: 'Manrope', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
  --font-sans: 'Manrope', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;

  /* типографика (fluid) */
  --t-hero: clamp(2.4rem, 5.2vw, 4.4rem);
  --t-h1: clamp(1.9rem, 3.6vw, 3rem);
  --t-h2: clamp(1.5rem, 2.4vw, 2.25rem);
  --t-h3: clamp(1.15rem, 1.5vw, 1.4rem);
  --t-lead: clamp(1.05rem, 1.3vw, 1.25rem);
  --t-body: 1.02rem;
  --t-sm: 0.875rem;
  --t-xs: 0.78rem;
  --lh-tight: 1.1;
  --lh-snug: 1.34;
  --lh-body: 1.68;

  /* пространство (8px-grid) */
  --s-1: 0.25rem; --s-2: 0.5rem; --s-3: 0.75rem; --s-4: 1rem;
  --s-5: 1.5rem; --s-6: 2rem; --s-7: 3rem; --s-8: 4rem; --s-9: 6rem; --s-10: 8rem;
  --container: 1180px;
  --container-narrow: 800px;

  /* радиусы/тени */
  --r-sm: 6px; --r-md: 12px; --r-lg: 18px; --r-xl: 26px; --r-pill: 999px;
  --shadow-sm: 0 1px 2px rgba(13,36,64,.06), 0 1px 3px rgba(13,36,64,.05);
  --shadow-md: 0 8px 26px -10px rgba(13,36,64,.18);
  --shadow-lg: 0 26px 60px -22px rgba(13,36,64,.28);
  --hairline: 1px solid var(--line);

  /* motion */
  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --dur: .4s; --dur-fast: .2s;
  --header-h: 110px;
  color-scheme: light;
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration:.01ms !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}