/* Кодоматика — дизайн-токены сайта
   Источник: brand/09_WEB_TOKENS/tokens.css (ревизия бренда 2026-08-29).
   Относительно источника изменено ровно три вещи, всё остальное — построчно то же:
     1) пути @font-face переписаны на /assets/fonts/ и добавлен unicode-range;
     2) color-mix() заменён на хекс — см. комментарий у --kd-border;
     3) добавлен color-scheme.
   Ничего другого здесь менять нельзя: файл сверяется с брендбуком построчно.
   Все прикладные стили живут в kodomatika.css. */

/* ── Шрифты ─────────────────────────────────────────────── */
@font-face {
  font-family: "Onest";
  src: url("../fonts/Onest-SemiBold.woff2") format("woff2");
  font-weight: 600; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
                 U+02DC, U+0304, U+0308, U+0329, U+0400-045F, U+0490-0491,
                 U+04B0-04B1, U+2000-206F, U+20BD, U+2116, U+2122;
}
@font-face {
  font-family: "Onest";
  src: url("../fonts/Onest-Medium.woff2") format("woff2");
  font-weight: 500; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
                 U+02DC, U+0304, U+0308, U+0329, U+0400-045F, U+0490-0491,
                 U+04B0-04B1, U+2000-206F, U+20BD, U+2116, U+2122;
}
@font-face {
  font-family: "Golos Text";
  src: url("../fonts/GolosText-Regular.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
                 U+02DC, U+0304, U+0308, U+0329, U+0400-045F, U+0490-0491,
                 U+04B0-04B1, U+2000-206F, U+20BD, U+2116, U+2122;
}
@font-face {
  font-family: "Golos Text";
  src: url("../fonts/GolosText-Medium.woff2") format("woff2");
  font-weight: 500; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
                 U+02DC, U+0304, U+0308, U+0329, U+0400-045F, U+0490-0491,
                 U+04B0-04B1, U+2000-206F, U+20BD, U+2116, U+2122;
}

:root {
  color-scheme: light dark;

  /* ── Цвет ─────────────────────────────────────────────── */
  --kd-basalt:        #1F2226; /* Базальт      RGB 31 34 38    CMYK 18/11/0/85 */
  --kd-carmine:       #B3263E; /* Кармин       RGB 179 38 62   CMYK 0/79/65/30 */
  --kd-warm-bg:       #F5F3EF; /* Тёплый фон   RGB 245 243 239 CMYK 0/1/2/4 */
  --kd-neutral:       #62676B; /* Нейтральный  RGB 98 103 107  CMYK 8/4/0/58 */
  --kd-carmine-dark:  #D4485D; /* Акцент для тёмного фона RGB 212 72 93 */
  --kd-white:         #FFFFFF;

  /* Семантика — светлая тема */
  --kd-bg:            var(--kd-warm-bg);
  --kd-bg-elevated:   var(--kd-white);
  --kd-bg-inverse:    var(--kd-basalt);
  --kd-text:          var(--kd-basalt);   /* 14.41:1 на тёплом фоне — AAA */
  --kd-text-muted:    var(--kd-neutral);  /* 5.16:1 — AA */
  --kd-text-inverse:  var(--kd-warm-bg);
  --kd-accent:        var(--kd-carmine);  /* 5.81:1 на тёплом фоне — AA */

  /* В брендовом файле здесь стоит color-mix(). На сайте он заменён хексом:
     без поддержки color-mix() переменная становится невалидной на этапе
     вычисления, border-color откатывается к inherit, и границы карточек
     принимают цвет текста. #D7D3CB — цвет разделительной линии из брендового
     kodomatika_app_page_1080x1920.svg, он же результат наложения
     rgba(98,103,107,.28) на #F5F3EF. */
  --kd-border:        #D7D3CB;
  --kd-border-strong: #C4BFB5;

  /* ── Типографика ──────────────────────────────────────── */
  --kd-font-display: "Onest", system-ui, -apple-system, "Segoe UI", sans-serif;
  --kd-font-body:    "Golos Text", system-ui, -apple-system, "Segoe UI", sans-serif;

  --kd-weight-display:    600; /* Onest SemiBold — заголовки */
  --kd-weight-display-md: 500; /* Onest Medium — логотип, крупные акценты */
  --kd-weight-body:       400; /* Golos Text Regular */
  --kd-weight-body-md:    500; /* Golos Text Medium */

  /* ── Геометрия ────────────────────────────────────────── */
  --kd-icon-stroke: 1.5px;   /* иконки: прямая геометрия, ровная толщина */
  --kd-radius-sm:   6px;
  --kd-radius-md:   10px;
  --kd-radius-lg:   16px;
}

/* Тёмная тема: на базальте кармин заменяется осветлённым акцентом */
:root[data-theme="dark"] {
  color-scheme: dark;
  --kd-bg:           var(--kd-basalt);
  --kd-bg-elevated:  #2A2E33;
  --kd-bg-inverse:   var(--kd-warm-bg);
  --kd-text:         var(--kd-warm-bg);   /* 14.41:1 — AAA */
  --kd-text-muted:   #9AA0A5;             /* 6.04:1 — AA */
  --kd-text-inverse: var(--kd-basalt);
  --kd-accent:       var(--kd-carmine-dark);
  --kd-border:        #363B40;
  --kd-border-strong: #454A50;
}

:root[data-theme="light"] { color-scheme: light; }

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --kd-bg:           var(--kd-basalt);
    --kd-bg-elevated:  #2A2E33;
    --kd-bg-inverse:   var(--kd-warm-bg);
    --kd-text:         var(--kd-warm-bg);
    --kd-text-muted:   #9AA0A5;
    --kd-text-inverse: var(--kd-basalt);
    --kd-accent:       var(--kd-carmine-dark);
    --kd-border:        #363B40;
    --kd-border-strong: #454A50;
  }
}