/* yi-tokens.css — СГЕНЕРИРОВАН из docs/design-system/tokens.json. Не править руками. */
/* версия 1.0.0, обновлён 2026-08-04 */
:root {
  /* ---- Цвет ---- */
  --yi-color-black: #0c0c0c; /* Основной текст, фирменный чёрный, тёмный хедер */
  --yi-color-ink: #1c1c1e; /* Фон тёмных секций (форма подбора, футер) */
  --yi-color-white: #ffffff; /* Текст на тёмном, фон карточек */
  --yi-color-green: #00b259; /* Primary CTA, направление «Математика», акценты действия */
  --yi-color-green-hover: #009a4d;
  --yi-color-pink: #ee2e62; /* Акцент, заголовки тёмных секций */
  --yi-color-pink-hover: #d41f50;
  --yi-color-orange: #f15a31; /* Баннеры, цифры-факты */
  --yi-color-orange-hover: #d94a24;
  --yi-color-yellow: #fcaf17; /* Выделение, сложность курса, направление «Олимпиады» */
  --yi-color-yellow-hover: #e59d0c;
  --yi-color-cyan: #39c2d7; /* Декор, градиенты, цифры-факты */
  --yi-color-cyan-hover: #2aa9bd;
  --yi-color-purple: #bd5697; /* Направление «Программирование», цены, декор */
  --yi-color-purple-hover: #a64784;
  --yi-color-gray: #8e8e93; /* Второстепенный текст, подписи */
  --yi-color-gray-light: #c7c7cc; /* Неактивные иконки, плейсхолдеры */
  --yi-color-line: #e5e5ea; /* Границы, разделители, неактивные элементы */
  --yi-color-line-hover: #d1d1d6;
  --yi-color-bg: #f5f5f6; /* Светлый фон секции */
  --yi-color-bg-blue: #f5f9fb; /* Голубоватый фон, хлебные крошки */
  /* ---- Градиенты ---- */
  --yi-gradient-ege: linear-gradient(90deg, #bd5697 0%, #39c2d7 100%);
  --yi-gradient-diag: linear-gradient(90deg, #00b259 0%, #39c2d7 100%);
  /* ---- Шрифты ---- */
  --yi-font-heading: Nunito, sans-serif;
  --yi-font-body: 'Nunito Sans', sans-serif;
  /* ---- Отступы ---- */
  --yi-space-1: 8px;
  --yi-space-2: 16px;
  --yi-space-3: 24px;
  --yi-space-4: 32px;
  --yi-space-6: 48px;
  --yi-space-8: 64px;
  /* ---- Радиусы ---- */
  --yi-radius-xs: 4px;
  --yi-radius-sm: 8px;
  --yi-radius-md: 16px;
  --yi-radius-lg: 24px;
  --yi-radius-pill: 999px;
  /* ---- Тени ---- */
  --yi-shadow-card: 0 4px 24px rgba(12, 12, 12, .06);
  --yi-shadow-float: 0 4px 24px rgba(12, 12, 12, .08);
  /* ---- Раскладка ---- */
  --yi-container: 1272px;
  --yi-section-y: 48px;
  --yi-icon: 24px;
  --yi-avatar: 64px;
  --yi-control-h: 48px;
  --yi-button-h: 56px;
  /* ---- Анимация ---- */
  --yi-motion-fast: 150ms;
  --yi-motion-base: 200ms;
  --yi-motion-ease: ease;
}

/* ---- Текстовые стили ---- */
.yi-text-h1 {
  font-family: var(--yi-font-heading);
  font-weight: 800;
  font-size: 48px;
  line-height: 48px;
}
.yi-text-h2 {
  font-family: var(--yi-font-heading);
  font-weight: 800;
  font-size: 36px;
  line-height: 40px;
}
.yi-text-h3 {
  font-family: var(--yi-font-heading);
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
}
.yi-text-h4 {
  font-family: var(--yi-font-heading);
  font-weight: 700;
  font-size: 20px;
  line-height: 28px;
}
.yi-text-lead {
  font-family: var(--yi-font-heading);
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
}
.yi-text-body {
  font-family: var(--yi-font-body);
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
}
.yi-text-body-bold {
  font-family: var(--yi-font-body);
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
}
.yi-text-lg {
  font-family: var(--yi-font-body);
  font-weight: 700;
  font-size: 18px;
  line-height: 28px;
}
.yi-text-sm {
  font-family: var(--yi-font-body);
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
}
.yi-text-sm-bold {
  font-family: var(--yi-font-body);
  font-weight: 700;
  font-size: 14px;
  line-height: 20px;
}
.yi-text-caption {
  font-family: var(--yi-font-body);
  font-weight: 700;
  font-size: 12px;
  line-height: 16px;
}

/* Брейкпоинты (значения темы Bricks, использовать в @media вручную):
   lg: 991px
   md: 767px
   sm: 478px
*/