/* ==========================================================================
   KASNOV_DEV — дизайн-токены.
   Единственный источник цветов, шрифтов и повторяющихся размеров.
   Все значения сняты с «Wireframe - 4.pdf» (страница 1440 × 1224).
   Памятка по использованию — BRAND.md, живой образец — brand.html.
   ========================================================================== */

@font-face {
  font-family: "Furore";
  src: url("../fonts/Furore.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Roboto Mono";
  src: url("../fonts/RobotoMono.woff2") format("woff2");
  font-weight: 400 500;
  font-style: normal;
  font-display: swap;
}

:root {
  /* --- Палитра: основа ---------------------------------------------------- */
  --c-paper: #ECEDE7;          /* фон страницы, текст на синих плашках */
  --c-ink: #0E2735;            /* основной текст, логотип, заголовок */
  --c-navy: #0D3863;           /* плашки, основная кнопка, активный номер */
  --c-navy-line: #113D6C;      /* тонкие тёмные линии: уголки, подчёркивание, заливка рамок 3% */
  --c-steel: #7C92A5;          /* контуры рамок и вторичной кнопки, соединительные линии */

  /* --- Партнёр: карточка KURU DESIGNER у «Сайтов» (только она) --------------
     По мотивам сайта партнёра: тёплый кремовый фон, приглушённый красный. */
  --c-kuru-cream: #EDE7D7;
  --c-kuru-red: #9E2528;
  --c-kuru-red-deep: #7E1A1D;  /* наведение и нажатие кнопки */
  /* Шрифт названия: файла шрифта сайта партнёра в проекте нет — временно доступный
     жирный гротеск; для точного оформления нужен файл (woff2) её заголовочного шрифта. */
  --f-kuru: "Arial Black", "Helvetica Neue", Arial, system-ui, sans-serif;

  /* --- Палитра: часовой интерфейс ----------------------------------------- */
  --c-dial-num: #808C94;       /* номера на циферблате */
  --c-dial-tick: #8A9396;      /* деления, точечный пунктир */
  --c-dial-tech: #8E9493;      /* двоичные подписи, координаты */
  --c-dial-band: #E3E8E9;      /* широкое светлое кольцо */
  --c-node-fill: #F8F7F4;      /* заливка узловых точек */
  --c-azure: #005E9C;          /* глубокий синий акцент: дуга активной услуги */
  --c-cyan: #5AC8FA;           /* светлый акцент: дуга, стрелка-указатель, штрих под координатами */

  /* --- Палитра: блок «Что я делаю» (Frame 4) ------------------------------ */
  --c-navy-deep: #0A3560;      /* крупное название активной услуги */
  --c-steel-blue: #427DA6;     /* акцентное слово на тёмном диске («ДЕЛАЮ?») */
  --c-disk-text: #DDDDD3;      /* светлый текст и уголки на тёмном диске */
  --c-case: #E5E8E3;           /* непрозрачная поверхность карточки кейса (фон + 3% navy-line) */

  /* --- Прозрачности ------------------------------------------------------- */
  --o-frame-fill: 0.03;        /* заливка технических рамок цветом --c-navy-line */
  --o-secondary-text: 0.52;    /* вторичный текст (индексы, @-никнеймы) */

  /* --- Стекло: карточка и вторичная кнопка поверх механизма -------------- */
  --blur-glass: 3px;           /* размытие фона за элементом */
  /* заливка ≈19% непрозрачности: на 30% прозрачнее прежней (≈27%) */
  --c-glass: color-mix(in srgb, var(--c-navy-line) 2%,
                       color-mix(in srgb, var(--c-paper) 17.5%, transparent));

  /* стекло блока «Обо мне» поверх кейсов: светлее и плотнее, чтобы текст читался и над синим кейсом */
  --c-about-glass: color-mix(in srgb, var(--c-paper) 68%, transparent);
  --blur-about: 5px;
  --r-glass: 14px;             /* скругление стеклянной панели «Обо мне» */

  /* --- Композиция --------------------------------------------------------- */
  --svc-scroll-step: 0.45;     /* прокрутка на одну услугу во втором блоке, доля высоты окна */
  --dial-small: 0.5;           /* часы во втором блоке относительно первого экрана: всё кольцо, цифры и зона справа помещаются под заголовком */

  /* --- Шрифты ------------------------------------------------------------- */
  --f-display: "Furore", "Arial Black", sans-serif;     /* только верхний регистр */
  --f-mono: "Roboto Mono", ui-monospace, "Consolas", monospace;

  /* Шкала (px на макете 1440). Furore: высота прописной = 0.70em. */
  --fs-hero: 76px;             /* главный заголовок */
  --fs-dial-active: 98px;      /* крупный активный номер */
  --fs-dial-hour: 52px;        /* цифры шкалы 01–12 (снаружи кольца) */
  --fs-case-num: 140px;        /* номер кейса */
  --fs-case-tab: 42px;         /* переключатели «Задача / Решение» */
  --fs-about-letter: 300px;    /* буква «Я» на карточке блока «Обо мне» */
  --fs-contact: 72px;          /* заголовок блока связи («автоматизировать» помещается в строку) */
  --fs-button: 32px;           /* надписи основных кнопок */
  --fs-nav: 22px;              /* логотип, кнопка «Связаться» */
  --fs-service: 22px;          /* название услуги (Roboto Mono) */
  --fs-body: 20px;             /* описание, индексы, никнеймы (Roboto Mono) */
  --fs-svc-name: 46px;         /* название услуги в блоке «Что я делаю» (Furore) */
  --fs-micro: 12px;            /* счётчик, координаты (Roboto Mono) */
  --fs-binary: 11px;           /* двоичные подписи (Roboto Mono) */
  --lh-body: 1.05;             /* плотный «технический» интерлиньяж, как в макете */

  /* --- Геометрия ---------------------------------------------------------- */
  --line: 1px;                 /* все тонкие линии */
  --line-accent: 2.5px;        /* усиленные уголки технической рамки */
  --slant: 13px;               /* наклон кнопок: верхняя грань сдвинута вправо на 13px (≈11–14°) */
  --slant-plate: 0.197em;      /* наклон плашек заголовка: 15px при кегле 76px */
  --ease: cubic-bezier(.45, 0, .2, 1);
  --t-fast: 220ms;
  --t-slow: 520ms;
  --t-list: 620ms;             /* ход ленты услуг */
}
