/* =========================================================================
   TrendAlytica v7 — токены дизайн-системы «Аналитический редакционный»
   Черновик 2026-09-18. Утверждается владельцем по визуальной проверке.
   Обоснование значений: ../../site_redesign_plan_v7.md, раздел 6.
   ========================================================================= */

:root {
  color-scheme: light;

  /* ---- Бумага и чернила -------------------------------------------------
     Бумага взята из прототипа Андрея без изменений: тёплый зеленоватый серый.
     Чернила темнее прототипных #243C34 — решение «взрослее»: выше контраст
     на крупных заголовках, меньше ощущения акварели.                        */
  --paper:        #edf1ed;
  --paper-2:      #f4f7f3;
  --white:        #fafbf5;
  --ink:          #1b2e27;
  --ink-soft:     #3a4f47;
  --muted:        #5f716b;
  --line:         #c6d1c9;
  --line-soft:    #d9e0da;

  /* ---- Пара «структура и сигнал» ----------------------------------------
     Вариант H, выбран владельцем 2026-09-18. Разбор всех тринадцати
     направлений и замеры: palette.html.

     Работа разделена. Серьёзность несёт структурный чернильно-синий: тёмные
     острова, CTA-полоса, глубокие плоскости. Дерзость несёт сигнальная
     киноварь в дозе около двух процентов площади. От одного цвета обе задачи
     не требуются — в этом весь смысл пары.                                  */

  /* Сигнал */
  --accent:          #e0452a;  /* киноварь: крупные заголовки, точки, hover */
  --accent-text:     #c2381f;  /* затемнённая: кнопки с белым текстом,
                                  ссылки, чипы — 4,74:1 на бумаге           */
  --accent-soft:     #f0705a;
  --accent-pale:     #fae3dd;
  --accent-on-dark:  #ff9d80;  /* акцент поверх структурного синего          */
  --accent-solid:    #c2381f;  /* заливка кнопок                             */
  --on-accent:       #fafbf5;  /* надпись по заливке акцента — 5,20:1        */

  /* Структура */
  --structure:       #16243f;  /* чернильно-синий: тёмные острова, CTA       */
  --structure-2:     #1e3055;

  /* Правило дозы: яркая киноварь #e0452a допустима только там, где текст
     крупный (от 24px) или где текста нет вовсе. Везде, где по акценту идёт
     мелкий текст или белая надпись, берётся --accent-text.                  */

  /* ---- Пастель ----------------------------------------------------------
     Только плоскость. Пастель не несёт статусного смысла и не кодирует
     данные: статус показывается числом, формой и подписью.                  */
  --blue:         #b7d8f0;
  --yellow:       #efda8d;
  --clay:         #edb6a0;
  --lime:         #dceba7;
  --on-pastel:    #1b2e27;  /* текст по пастельной плоскости */

  /* ---- Текст на тёмном -------------------------------------------------- */
  --on-dark:      #f1f5ef;
  --on-dark-soft: #b9c9c0;
  --on-dark-line: rgba(241, 245, 239, .18);

  /* ---- Логотип «Вершина A» (брендбук, 25.09.2026) ----------------------- */
  --logo-tile:      #16243f;  /* плашка фавикона и аватара                   */
  --logo-tile-mark: #f1f5ef;  /* буква на плашке                             */
  --logo-tile-dot:  #ff6a4d;  /* точка знака на тёмной плашке                */

  /* ---- Типографика ------------------------------------------------------ */
  --font: 'Golos Text', -apple-system, 'Segoe UI', Arial, sans-serif;
  --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* Переменный трекинг. Один трекинг на все кегли, как в прототипе, на
     русском слипает буквы в длинных заголовках.                            */
  --fs-display-1: clamp(42px, 7.2vw, 96px);   --ls-display-1: -.055em;
  --fs-display-2: clamp(32px, 4.8vw, 64px);   --ls-display-2: -.04em;
  --fs-h2:        clamp(27px, 3.3vw, 40px);   --ls-h2:        -.03em;
  --fs-h3:        clamp(21px, 2.1vw, 28px);   --ls-h3:        -.02em;
  --fs-lead:      clamp(17px, 1.45vw, 20px);  --ls-lead:      -.01em;
  --fs-body:      17px;                       --ls-body:      0;
  --fs-small:     15px;                       --ls-small:     0;
  --fs-label:     12px;                       --ls-label:     .02em;
  --fs-data:      12px;                       --ls-data:      .1em;

  --fs-number:    clamp(46px, 6vw, 88px);     --ls-number:    -.05em;

  /* ---- Сетка и ритм ----------------------------------------------------- */
  --shell:   1200px;
  --gutter:  clamp(20px, 4.5vw, 64px);
  --sec-y:   clamp(64px, 9vw, 136px);
  --gap:     clamp(16px, 2vw, 28px);

  /* ---- Форма ------------------------------------------------------------ */
  --r-sm: 10px;
  --r-md: 18px;
  --r-lg: 28px;
  --r-xl: 36px;

  /* Тени приглушены: материал системы — бумага и краска, а не стекло.
     Глубина создаётся сменой плоскости, а не размытием.                     */
  --shadow: 0 1px 2px rgba(27, 46, 39, .04), 0 18px 40px -28px rgba(27, 46, 39, .3);

  /* ---- Движение ---------------------------------------------------------
     Бюджет: один живой элемент на экран.                                    */
  --ease:  cubic-bezier(.22, .61, .36, 1);
  --dur:   .32s;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur: .001s; }
}

/* =========================================================================
   Тёмная тема

   Включается только переключателем и запоминается. Системная настройка
   `prefers-color-scheme` намеренно не учитывается — решение владельца
   2026-09-12: иначе у части посетителей первый экран был бы тёмным.

   Роли не меняются, меняется материал. Земля тёмной темы — это углублённый
   структурный синий, то есть тот же брендовый цвет, что держит острова в
   светлой. Острова в тёмной приподнимаются над землёй, а не утапливаются:
   регистр «отдельная плоскость» сохраняется, направление инверсируется.
   ========================================================================= */

[data-theme="dark"] {
  color-scheme: dark;

  /* Земля и поверхности */
  --paper:        #0e1826;
  --paper-2:      #121f31;
  --white:        #17233a;
  --ink:          #e9eff6;
  --ink-soft:     #bcc8d8;
  --muted:        #8b9ab0;
  --line:         #2a3a54;
  --line-soft:    #1e2c42;

  /* Сигнал: киноварь осветляется, иначе на тёмной земле не добирает контраст */
  --accent:          #ff6a4d;
  --accent-text:     #ff8f73;
  --accent-soft:     #ff9d80;
  --accent-pale:     #3a1f17;
  --accent-on-dark:  #ff9d80;
  --accent-solid:    #ff7a5c;
  --on-accent:       #23120d;

  /* Структура: приподнятая панель вместо утопленной */
  --structure:    #1d2d4d;
  --structure-2:  #26395e;

  /* Пастель уходит в глубокие тона: четыре светлых плашки на тёмной земле
     слепили бы и сломали правило «один живой элемент на экран».

     Синяя плашка при этом берётся заметно ярче и насыщеннее структурного
     #1d2d4d. Первая версия дала #1f4666, и структурная карточка со «спросом»
     слилась с соседней синей: в светлой теме их разводила светлота, в тёмной
     разводить нечем, кроме насыщенности. */
  --blue:         #256d99;
  --yellow:       #6e5716;
  --clay:         #7a3f29;
  --lime:         #46602a;
  --on-pastel:    #eef3f8;

  --on-dark:      #eef3f8;
  --on-dark-soft: #b4c3d4;
  --on-dark-line: rgba(238, 243, 248, .16);

  --logo-tile:      #e9eff6;
  --logo-tile-mark: #0e1826;
  --logo-tile-dot:  #e0452a;

  --shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 18px 40px -28px rgba(0, 0, 0, .85);
}