/* ============================================================
   RUBY — design tokens
   Значения взяты из Figma (CSS export + SVG export), не придуманы.
   Источники: "CSS код из фигмы файлы/*.txt", "SVG файлы/*.svg"
   ============================================================ */

:root {
  /* --- Холст макета --------------------------------------- */
  --canvas-w: 1920px;

  /* --- Цвета ---------------------------------------------- */
  --c-ink: #0e1015;         /* основной текст */
  --c-black: #000000;
  --c-white: #ffffff;
  --c-green: #5ce2a3;       /* заливка основных кнопок */
  --c-purple: #d18cff;      /* меню, иконки верхней панели */
  --c-pink: #f3adff;        /* словесный знак RUBY */
  --c-grey: #8c949e;        /* даты, подписи */
  --c-red: #ff5757;         /* активные плашки и стрелки схем (ТЗ) */
  --c-placeholder: #d9d9d9; /* плашки «ФОТО» */
  --c-green-hover: #49b080; /* зелёные кнопки, Property 1=Variant2 */
  --c-muted: #bababa;       /* контурные кнопки и «Переход на статью», Variant2 */

  /* Только внутри SVG-ассетов, в CSS не нужны: #870D4E и #E033A1 (логотип), #2E3540 и #1A1D26
     (нож, иконки схем), #72B9FF и #0B85FF (соцсети). */

  /* --- Шрифты ---------------------------------------------
     У Syncopate нет кириллицы: в Figma кириллица падает
     на Roboto, латиница остаётся в Syncopate. Порядок стека
     воспроизводит это поведение глиф-в-глиф. */
  --f-display: 'Unbounded', sans-serif;
  --f-accent: 'Syncopate', 'Roboto', sans-serif;
  --f-text: 'Roboto', sans-serif;

  /* --- Типографика (family / size / line-height) ----------- */
  --t-h1-size: 64px;
  --t-h1-lh: 79px;
  --t-h2-size: 48px;
  --t-h2-lh: 50px;
  --t-h3-size: 36px;
  --t-h3-lh: 37px;
  --t-body-size: 32px;
  --t-body-lh: 38px;
  --t-lead-size: 36px;
  --t-lead-lh: 42px;
  --t-btn-size: 24px;
  --t-btn-lh: 30px;
  --t-btn-lg-size: 32px;
  --t-btn-lg-lh: 40px;
  --t-meta-size: 20px;
  --t-meta-lh: 23px;

  /* --- Верхняя панель ------------------------------------- */
  --header-h: 97px;
  --header-bar-h: 89px;
  --nav-underline-w: 18px;
  --nav-underline-h: 4px;

  /* --- Переходы между вариантами компонентов ----------------
     Длительность и кривая — значения Smart Animate в Figma по
     умолчанию (ease out, 300 ms): прототипных настроек в экспортах нет. */
  --hover-dur: 300ms;
  --hover-ease: cubic-bezier(0.22, 0.61, 0.36, 1); /* мягкий ease-out */
  --fade-dur: 120ms;   /* линия проявляется быстрее, чем растёт */
  --press-dur: 120ms;  /* «отдача» при нажатии (ТЗ) */
  --flow-dur: 450ms;   /* плашка/стрелка схемы: неактивная → активная */
  --step-dur: 650ms;   /* пункт слева всплывает */
}