/* Палитра и метрика. Единственный файл, где вообще есть hex.

   ОСНОВА НЕ ТРОНУТА: золото #b8823a снято пипеткой с надписи на логотипе
   (тон 34°), белый — основной, слоновая кость — второй слой, тёплый
   чёрный — редкие полосы-паузы. Это бренд, его не перекрашивают.

   РЕДАКЦИЯ v2 (16.09.2026) добавила к основе три тона — каждый со своей
   единственной ролью, чтобы «разбавить» золото, не споря с ним:

   • --seal, киноварь печати-ханко. Красный в нише — затёртый штамп
     (чёрный+красный у 9 из 10 русских сайтов киокушина), поэтому здесь
     он НЕ фон и НЕ кнопка, а оттиск: печать на первом экране, отметка
     «идёт сейчас», цифра шага. Меньше 2 % площади.
   • --pine, глубокая хвоя. Зелёный пояс и лагерь под Омском на кадрах;
     даёт тёмный слой, который НЕ чёрный: программы и цены стоят на нём,
     и сайт перестаёт делиться только на «белое» и «чёрное».
   • --sand, плотная бумага. Промежуточная ступень между костью
     и золотом — под подложки активных состояний и крупные цифры.

   Контраст посчитан формулой WCAG 16.09.2026 (текст ≥ 4.5:1):
     --fg на --bg 18.7 · --fg-2 на --bg-2 9.1 · --fg-3 на --bg-2 5.4
     --brand-2 на --bg 5.6 · на --bg-2 5.2 · --brand-hi на --dark 9.6
     --brand-hi на --pine 7.0 · --on-dark на --pine 12.3 · --on-pine-2 на --pine 7.8
     --seal на --bg 6.0 · на --bg-2 5.5 · --fg на золотой заливке 5.6
   ЛОВУШКА: --fg-3 на --sand даёт 4.3 — служебный текст на плотной бумаге
   набирать --fg-2, не --fg-3. */

:root {
  /* поверхности */
  --bg: #ffffff;
  --bg-2: #faf6ee;            /* слоновая кость */
  --bg-3: #f2ebdc;            /* плотнее кости */
  --sand: #e8dcc4;            /* плотная бумага: активные подложки */
  --dark: #14110c;            /* тёплый чёрный */
  --dark-2: #1f1b14;
  --pine: #173229;            /* хвоя: второй тёмный слой */
  --pine-2: #1f3f34;

  /* текст */
  --fg: #15120d;
  --fg-2: #4b4237;
  --fg-3: #6f6455;
  --on-dark: #f7f2e8;
  --on-dark-2: #bdb3a1;
  --on-pine-2: #b9c7bd;

  /* линии */
  --line: #e6dccb;
  --line-2: #d3c4a9;
  --line-dark: #332d22;
  --line-pine: #2f5144;

  /* бренд */
  --brand: #b8823a;           /* золото логотипа */
  --brand-2: #8a5f23;         /* золото для текста по светлому */
  --brand-hi: #ddb36b;        /* золото по тёмному */
  --brand-soft: #f6ecd9;
  --on-brand: #15120d;
  --gilt: linear-gradient(100deg, #8a5f23 0%, #c99a52 38%, #e6c27f 52%, #b8823a 70%, #8a5f23 100%);

  /* дополнительные */
  --seal: #b23a26;            /* киноварь печати */
  --seal-soft: #f7e3dc;
  --accent: #2c6a4c;          /* зелёный пояс: «идёт набор» */
  --accent-soft: #e6f0ea;

  /* цвета поясов киокушина — данные, а не украшение */
  --belt-white: #f2efe7;
  --belt-orange: #d4762a;
  --belt-blue: #2a5ba8;
  --belt-yellow: #e0b021;
  --belt-green: #2f7a45;
  --belt-brown: #6b4227;
  --belt-black: #16130f;

  /* набор */
  --font-display: "Alegreya", "Times New Roman", serif;
  --font-text: "WixMadeforText", -apple-system, BlinkMacSystemFont, "Segoe UI",
    system-ui, sans-serif;

  /* ритм */
  --step: 4px;
  --gap: 24px;
  --pad-block: clamp(64px, 8vw, 128px);
  --wrap: 1240px;
  --wrap-narrow: 800px;
  --radius: 4px;
  --radius-lg: 14px;

  --shadow: 0 1px 2px rgba(21, 18, 13, .05), 0 12px 32px -18px rgba(21, 18, 13, .28);
  --shadow-lift: 0 2px 4px rgba(21, 18, 13, .06), 0 28px 60px -26px rgba(21, 18, 13, .4);

  /* движение: одна кривая на вход, одна на смену состояния */
  --ease: cubic-bezier(.22, .61, .36, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-io: cubic-bezier(.83, 0, .17, 1);
}