/* =============================================================================
   T2S Group — variables.css
   Дизайн-токены. Шрифты обновлены: Outfit + Plus Jakarta Sans
   ============================================================================= */
:root {


  --color-ink:          #16192B; /* Почти черный, но с глубоким синим отливом для читаемости */
  --color-navy:         #23273A; /* Тот самый фирменный темно-синий из круга логотипа */
  --color-mist:         #F0F2F5; /* Очень светлый холодный серый для фона секций (вместо желтоватого) */
  --color-white:        #FFFFFF; /* Белый оставляем чистым */
  --color-accent:       #F16F24; /* Фирменный оранжевый из цифры "2" */
  --color-accent-hover: #FF8845; /* Чуть более светлый и сочный оранжевый для наведения мыши */
  --color-mid:          #8C8D91; /* Серый цвет букв "T" и "S" (идеально для субтитров) */
  --color-border:       #D4D6DB; /* Прохладный светло-серый для рамок карточек */


  /* ── Шрифты ────────────────────────────────────────────────────────────── */
  /* Заголовки, логотип, цифры статистики */
  --font-display: "Outfit", sans-serif;

  /* Основной текст, навигация, кнопки, подписи */
  --font-body: "Plus Jakarta Sans", sans-serif;

  /* ── Размеры шрифтов ───────────────────────────────────────────────────── */
  --text-h1:    52px;
  --text-h2:    36px;
  --text-h3:    22px;
  --text-body:  15px;
  --text-small: 13px;
  --text-label: 11px;
  --text-nav:   13px;
  --text-btn:   14px;

  /* ── Межстрочные интервалы ─────────────────────────────────────────────── */
  --lh-display: 1.05;
  --lh-heading: 1.1;
  --lh-body:    1.7;

  /* ── Скругления ────────────────────────────────────────────────────────── */
  --radius-sm:   6px;
  --radius-card: 12px;
  --radius-lg:   16px;
  --radius-pill: 100px;

  /* ── Переходы ──────────────────────────────────────────────────────────── */
  --transition:      .2s ease;
  --transition-slow: .6s ease-out;

  /* ── Сетка ─────────────────────────────────────────────────────────────── */
  --container:   1280px;
  --gap-section: 64px;
  --gap-card:    16px;
  --nav-height:  64px;
}

/* ── Мобильные переопределения ─────────────────────────────────────────────── */
@media (max-width: 768px) {
  :root {
    --text-h1:    36px;
    --gap-section: 40px;
  }
}

@media (max-width: 375px) {
  :root {
    --text-h1: 28px;
  }
}