/* Правила оформления: цвета, шрифты, размеры, отступы. Меняется вид сайта — меняется этот файл; styles.css берёт
   цвета, шрифты и основные размеры только отсюда. Свой сайт на этом шаблоне начинается с правки этого файла. */

@font-face { font-family: 'Onest'; font-weight: 400 600; font-display: swap; src: url(fonts/onest-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Onest'; font-weight: 400 600; font-display: swap; src: url(fonts/onest-latin.woff2) format('woff2');
  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+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'JetBrains Mono'; font-weight: 400 500; font-display: swap; src: url(fonts/jetbrains-mono-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'JetBrains Mono'; font-weight: 400 500; font-display: swap; src: url(fonts/jetbrains-mono-latin.woff2) format('woff2');
  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+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  /* цвета */
  --bg: #F5F6F7;            /* фон страницы */
  --surface: #FFFFFF;       /* фон полос через одну, плиток, полей */
  --ink: #1B2128;           /* основной текст, заголовки */
  --ink-2: #4A5562;         /* второй текст */
  --ink-3: #5F6B78;         /* подписи и мелкий текст: не светлее — иначе не читается */
  --line: #E3E6EA;          /* границы полос и плиток */
  --line-2: #C3CBD4;        /* линии схем, границы кнопок */
  --accent: #3E5368;        /* точки схем, наведение */
  --accent-soft: #5B7A99;   /* только украшение: на тексте не использовать */
  --dark-bg: #1B2128;       /* тёмная полоса */
  --dark-ink: #F5F6F7;
  --dark-ink-2: #B5C0CB;
  --dark-line: #4A5562;
  --dark-dot: #2E3742;

  /* шрифты */
  --font: 'Onest', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --w-normal: 400;
  --w-medium: 500;

  /* размеры текста */
  --t-hero: clamp(34px, 4.4vw, 56px);
  --t-title: clamp(26px, 3vw, 40px);     /* заголовок полосы и страницы */
  --t-h2: clamp(22px, 2.2vw, 28px);      /* заголовки внутри текста */
  --t-h3: 19px;
  --t-lead: 19px;
  --t-body: 17px;
  --t-small: 15px;
  --t-label: 13px;                        /* подписи моноширинным */
  --lh-tight: 1.12;
  --lh-title: 1.2;
  --lh-body: 1.6;
  --track-title: -0.025em;
  --track-label: 0.06em;

  /* размеры и отступы */
  --page: 1120px;           /* ширина содержимого */
  --text: 720px;            /* ширина колонки текста */
  --gutter: 32px;           /* поля по бокам */
  --band: 88px;             /* отступ полосы сверху и снизу */
  --gap: 24px;
  --radius: 12px;
  --radius-pill: 999px;
  --dot-grid: 24px;         /* шаг точечной сетки фона */
}

@media (max-width: 720px) {
  :root { --gutter: 20px; --band: 56px; --t-body: 16px; --t-lead: 17px; }
}