/* ============================================================================
   SHARK DEV — фирменные константы. Единственный источник истины для цвета,
   типографики и ритма. Ни один цвет за пределами этого файла не объявляется:
   `python3 scripts/extract-brand.py --verify` падает, если в index.html,
   в остальных CSS или в SVG логотипа найден HEX, которого здесь нет.

   Каждое значение снято из `art/Shark Dev_guideline.pdf` тем же скриптом,
   а не подобрано на глаз. У каждого цвета указана страница гайдлайна либо
   пометка, что он взят из заливки вектора логотипа.
   ============================================================================ */

:root {
  /* --- палитра гайдлайна, стр. 11 (четыре плашки, порядок как в гайдлайне) --- */
  --c-deep:  #0a003a; /* тёмный фиолетово-синий, гайдлайн стр. 11 */
  --c-ink:   #070b23; /* почти чёрный синий, основной фон, гайдлайн стр. 11 */
  --c-ice:   #c0fbff; /* светлый циан, акцент, гайдлайн стр. 11 */
  --c-paper: #e3f3fd; /* светлый голубой, основной текст на тёмном, гайдлайн стр. 11 */

  /* --- цвета логотипа: в палитре гайдлайна их нет, взяты из заливок вектора --- */
  --c-blue:  #0041a8; /* слово «SHARK», из вектора логотипа, стр. 4–5 */
  --c-cyan:  #00bcf4; /* слово «DEV», из вектора логотипа, стр. 4–5 */
  --c-mono:  #1d1d1b; /* монохромная версия логотипа, гайдлайн стр. 7 */

  /* --- градиент знака: mesh-шейдинг из PDF, снят по оси наибольшего изменения.
         Используется в SVG логотипа; здесь объявлен, чтобы тем же градиентом
         могли пользоваться фон и декоративные элементы страницы. --- */
  --logo-fin-0: #0171cb; /* из вектора логотипа, mesh-градиент знака, стр. 4 */
  --logo-fin-1: #005fbd; /* из вектора логотипа, mesh-градиент знака, стр. 4 */
  --logo-fin-2: #0038a2; /* из вектора логотипа, mesh-градиент знака, стр. 4 */
  --logo-fin-3: #002292; /* из вектора логотипа, mesh-градиент знака, стр. 4 */
  --logo-fin-4: #001d8d; /* из вектора логотипа, mesh-градиент знака, стр. 4 */
  --logo-fin-5: #002490; /* из вектора логотипа, mesh-градиент знака, стр. 4 */
  --logo-fin-6: #002f96; /* из вектора логотипа, mesh-градиент знака, стр. 4 */
  --logo-fin-hot: #00a6ea; /* из вектора логотипа, яркое пятно градиента знака, стр. 4 */
  --logo-lens-0: #0198fd; /* из вектора логотипа, блик знака, стр. 4 */
  --logo-lens-1: #03a8fd; /* из вектора логотипа, блик знака, стр. 4 */
  --logo-lens-2: #07c0fe; /* из вектора логотипа, блик знака, стр. 4 */
  --logo-lens-3: #0dbafe; /* из вектора логотипа, блик знака, стр. 4 */

  /* Не цвет бренда: белый нужен как значение канала в SVG-маске блика знака —
     маска в PDF задана яркостью, и белый там означает «полностью непрозрачно».
     Объявлен здесь только для того, чтобы правило «ни одного цвета вне tokens.css»
     оставалось буквально верным и проверяемым. */
  --mask-full: #ffffff;

  /* --- производные: только прозрачности и смеси перечисленных выше цветов --- */
  --c-surface:      color-mix(in srgb, var(--c-deep) 55%, var(--c-ink));
  --c-surface-soft: color-mix(in srgb, var(--c-deep) 30%, var(--c-ink));
  --c-line:         color-mix(in srgb, var(--c-ice) 14%, transparent);
  --c-line-strong:  color-mix(in srgb, var(--c-ice) 28%, transparent);
  --c-text:         var(--c-paper);
  --c-text-dim:     color-mix(in srgb, var(--c-paper) 68%, transparent);
  --c-text-faint:   color-mix(in srgb, var(--c-paper) 58%, transparent);
  --c-accent:       var(--c-cyan);
  --c-accent-soft:  color-mix(in srgb, var(--c-cyan) 16%, transparent);
  --c-shadow:       color-mix(in srgb, var(--c-ink) 72%, transparent);

  --grad-brand: linear-gradient(76deg, var(--logo-fin-0) 0%, var(--logo-fin-2) 36%,
                                var(--logo-fin-4) 64%, var(--logo-fin-6) 100%);
  --grad-accent: linear-gradient(90deg, var(--c-blue) 0%, var(--c-cyan) 100%);

  /* --- типографика: Inter, гайдлайн стр. 12–13.
         Гайдлайн задаёт ExtraBold 45 pt заголовки, SemiBold 30 pt подзаголовки,
         Regular 22 pt текст. Здесь те же три начертания и то же соотношение
         размеров, пересчитанное в текучую шкалу. --- */
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto",
               "Helvetica Neue", "Arial", "Noto Sans", sans-serif;
  --fw-regular: 400;  /* Inter Regular,   гайдлайн стр. 12 */
  --fw-semibold: 600; /* Inter SemiBold,  гайдлайн стр. 12 */
  --fw-extrabold: 800;/* Inter ExtraBold, гайдлайн стр. 12 */

  --fs-hero:  clamp(2.125rem, 1.15rem + 4.2vw, 4.25rem);
  --fs-h2:    clamp(1.625rem, 1.05rem + 2.3vw, 2.75rem);
  --fs-h3:    clamp(1.125rem, 0.95rem + 0.8vw, 1.5rem);
  --fs-lead:  clamp(1.0625rem, 0.95rem + 0.6vw, 1.375rem);
  --fs-body:  clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --fs-small: 0.9375rem;
  --fs-micro: 0.8125rem;

  --lh-tight: 1.08;
  --lh-heading: 1.18;
  --lh-body: 1.6;
  --tracking-tight: -0.02em; /* трекинг в гайдлайне 0; минус только на крупных кеглях */
  --tracking-wide: 0.08em;

  /* --- ритм и сетка --- */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs:  0.75rem;
  --space-s:   1rem;
  --space-m:   1.5rem;
  --space-l:   2.5rem;
  --space-xl:  4rem;
  --space-2xl: 6rem;
  --section-y: clamp(3.5rem, 2rem + 6vw, 7rem);

  --container: 1200px;   /* верхний брейкпоинт совпадает с шириной контейнера */
  --gutter: clamp(1rem, 0.5rem + 2.4vw, 2.5rem);
  --header-h: 4.5rem;

  --radius-s: 8px;
  --radius-m: 14px;
  --radius-l: 24px;

  /* --- защитное поле логотипа: модуль X равен ширине знака (гайдлайн стр. 8) --- */
  --logo-mark-ratio: 1.0468; /* 140.125 / 133.861 — истинные пропорции знака */
  --logo-clear-space: 1em;   /* в контейнере логотипа = 1 × ширина знака */

  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --dur-fast: 140ms;
  --dur: 260ms;
}