/* Дизайн-токены. Единственное место, где заданы цвета/отступы/типографика. */
:root {
  --font-main: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  /* Цвета */
  --color-text:        #0f172a;
  --color-text-muted:  #475569;
  --color-text-faint:  #94a3b8;
  --color-bg:          #ffffff;
  --color-bg-soft:     #f8fafc;
  --color-border:      #e2e8f0;

  --color-accent:      #10b981;  /* зелёный — кнопки, ссылки, акценты */
  --color-accent-ink:  #047857;  /* hover / нажатие */
  --color-accent-soft: #d1fae5;  /* фон бейджей/тегов */

  --color-dark:        #0d1b2a;  /* тёмно-синий — футер, CTA-полосы */
  --color-dark-soft:   #15273c;
  --color-on-dark:     #e9eef5;

  /* Раскладка */
  --container-main:    1160px;
  --container-article: 760px;

  --radius-sm: 8px;
  --radius:    12px;
  --radius-lg: 16px;

  --space-section: 80px;

  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
  --shadow:    0 4px 16px rgba(15, 23, 42, 0.08);
}

@media (max-width: 768px) {
  :root { --space-section: 48px; }
}