/*
 * design-system/tokens/typography.css
 * Editorial Calm — типографика. ТЗ раздел 3.2.
 *
 * 1 шкала, 7 ступеней, 2 шрифтовых семейства (sans + serif) + mono.
 * Шрифты подключаются через <link> в base-template (Google Fonts):
 *   Inter (400, 500, 600, 700) — sans
 *   Source Serif 4 (600) — serif
 *   JetBrains Mono (500) — mono
 */

[data-theme="editorial"] {
  --font-sans:  'Inter', 'Helvetica Neue', system-ui, sans-serif;
  --font-serif: 'Source Serif 4', 'Charter', 'Georgia', serif;
  --font-mono:  'JetBrains Mono', 'SF Mono', Menlo, monospace;

  /* Шкала размеров основных текстов: pair size/lh */
  --t-display-size: 56px; --t-display-lh: 1.05;  /* serif 600 */
  --t-title-size:   36px; --t-title-lh:   1.15;  /* serif 600 */
  --t-section-size: 24px; --t-section-lh: 1.30;  /* sans  600 */
  --t-body-lg-size: 18px; --t-body-lg-lh: 1.55;  /* sans  400 */
  --t-body-size:    16px; --t-body-lh:    1.55;  /* sans  400 */
  --t-caption-size: 13px; --t-caption-lh: 1.40;  /* sans  500 */
  --t-mono-size:    13px; --t-mono-lh:    1.40;  /* mono  500 */

  /* Шкала для KPI и микро-заголовков */
  --t-kpi-xl-size:  44px;
  --t-kpi-size:     28px;
  --t-eyebrow-size: 11px;

  /* Глобальные шрифтовые feature-settings: tnum для всех чисел,
     ss01 — стилистический сет (если есть в шрифте). */
  font-family: var(--font-sans);
  font-feature-settings: "tnum", "ss01";
  font-size: var(--t-body-size);
  line-height: var(--t-body-lh);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ─── Шкала текстовых утилит ───────────────────────────────────────── */

[data-theme="editorial"] .t-display {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: var(--t-display-size);
  line-height: var(--t-display-lh);
  color: var(--ink);
  text-wrap: balance;
}

[data-theme="editorial"] .t-title {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: var(--t-title-size);
  line-height: var(--t-title-lh);
  color: var(--ink);
  text-wrap: balance;
}

[data-theme="editorial"] .t-section {
  font-family: var(--font-sans);
  font-weight: 600;
  font-size: var(--t-section-size);
  line-height: var(--t-section-lh);
  color: var(--ink);
  text-wrap: balance;
}

[data-theme="editorial"] .t-body-lg {
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: var(--t-body-lg-size);
  line-height: var(--t-body-lg-lh);
  color: var(--ink-2);
  text-wrap: pretty;
}

[data-theme="editorial"] .t-body {
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: var(--t-body-size);
  line-height: var(--t-body-lh);
  color: var(--ink-2);
}

[data-theme="editorial"] .t-caption {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: var(--t-caption-size);
  line-height: var(--t-caption-lh);
  color: var(--ink-3);
}

[data-theme="editorial"] .t-mono {
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: var(--t-mono-size);
  line-height: var(--t-mono-lh);
  color: var(--ink-2);
}

/* KPI и eyebrow */
[data-theme="editorial"] .t-kpi-xl {
  font-family: var(--font-sans);
  font-weight: 600;
  font-size: var(--t-kpi-xl-size);
  line-height: 1.0;
  color: var(--ink);
  font-feature-settings: "tnum";
}

[data-theme="editorial"] .t-kpi {
  font-family: var(--font-sans);
  font-weight: 600;
  font-size: var(--t-kpi-size);
  line-height: 1.0;
  color: var(--ink);
  font-feature-settings: "tnum";
}

[data-theme="editorial"] .t-eyebrow {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: var(--t-eyebrow-size);
  line-height: 1.4;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-3);
}
