/* ============================================================
   PARIVISION — дизайн-токены (VSN 2026)
   Единственный источник значений. Менять только вместе
   с .claude/skills/parivision-brand/SKILL.md
   Ревизия 04.08.2026-v2: сверено со съёмом Figma PV-HERO 1.0
   (FIGMA_PV_HERO.md §4): +black-2, +mint-2, радиальный градиент,
   lh 0.9 / ls −0.025em у заголовков, Klamp Bold(600) для обвязки.
   ============================================================ */

/* ---------- Шрифты ---------- */
@font-face {
  font-family: "PP Pangram Sans Compressed";
  src: url("../fonts/pv-heading.woff2") format("woff2");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "PP Pangram Sans Narrow";
  src: url("../fonts/pv-nav.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "PP Pangram Sans";
  src: url("../fonts/pv-text.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Klamp 205 Mono";
  src: url("../fonts/pv-mono.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Klamp 205 Mono";
  src: url("../fonts/pv-mono-md.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Klamp 205 Mono";
  src: url("../fonts/pv-mono-bd.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
/* Кириллица для моно-обвязки. В лицензионных Klamp 205 Mono кириллических глифов НЕТ
   (проверено по cmap всех 8 OTF), поэтому по бренд-буку RU-обвязка набирается
   PP Pangram Sans Medium. Отдаём её ОТДЕЛЬНЫМ именем семейства и подставляем в цепочку
   --ff-mono: латиница и цифры берутся из Klamp, всё, чего у него нет (кириллица, №, →),
   доезжает сюда — и системная Consolas/Courier в видимый текст не попадает.
   Именем "Klamp 205 Mono" это делать НЕЛЬЗЯ: одноимённое лицо с unicode-range
   перебивает статические веса Klamp, и латиница тоже уходит в фолбэк (проверено в Chrome).
   font-weight-диапазон — чтобы 600 не синтезировался в фальшивый жир,
   size-adjust — выравнивание капс-высоты (Klamp 667/1000 против Pangram 710/1000). */
@font-face {
  font-family: "PV Meta Cyr";
  src: url("../fonts/pv-text.woff2") format("woff2");
  font-weight: 400 600;
  font-style: normal;
  font-display: swap;
  size-adjust: 94%;
}
@font-face {
  font-family: "VSN Stars";
  src: url("../fonts/pv-numbers.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0030-0039;
}

:root {
  /* ---------- Цвета (только эти) ---------- */
  --c-mint: #2FFFE8;
  --c-mint-2: #2ED0BE;               /* вторичная мята (PV-HERO MINT 2): приглушённые заливки, downstate */
  --c-black: #0B0B0B;
  --c-black-2: #151515;              /* слой поверх чёрного (PV-HERO BLACK 2): панели, диагонали */
  --c-white: #FFFFFF;
  /* радиальный градиент мяты (PV-HERO, подтверждён заказчиком 04.08.2026) —
     подложки карточек игроков и инверсные поверхности */
  --grad-player: radial-gradient(140% 120% at 22% 8%, #A5FFF5 0%, var(--c-mint) 46%, #7DF0E3 100%);

  /* производные (прозрачности, НЕ новые цвета) */
  --c-line: rgba(255, 255, 255, .08);      /* границы на чёрном */
  --c-line-strong: rgba(255, 255, 255, .16);
  --c-text-dim: rgba(255, 255, 255, .64);  /* вторичный текст на чёрном */
  --c-mint-dim: rgba(47, 255, 232, .64);
  --c-black-line: rgba(11, 11, 11, .12);   /* границы на мяте */

  /* ---------- Типографика ---------- */
  --ff-heading: "PP Pangram Sans Compressed", "Arial Narrow", sans-serif;
  --ff-nav: "PP Pangram Sans Narrow", "Arial Narrow", sans-serif;
  --ff-text: "PP Pangram Sans", Arial, sans-serif;
  /* Klamp — латиница и цифры; кириллица и добор символов уходят в Pangram Sans,
     системные моно (Consolas/Courier) в цепочке запрещены — это анти-паттерн бренда */
  --ff-mono: "Klamp 205 Mono", "PV Meta Cyr", Arial, sans-serif;
  --ff-numbers: "VSN Stars", var(--ff-heading);            /* только цифры, редкие гига-акценты */

  /* шкала (fluid): mobile -> desktop */
  --fz-hero: clamp(3.4rem, 1.2rem + 11vw, 10.5rem);        /* H1 hero */
  --fz-h2: clamp(2.2rem, 1.1rem + 5.5vw, 4.5rem);          /* заголовок секции */
  --fz-h3: clamp(1.3rem, 1rem + 1.6vw, 2rem);
  --fz-body: 1rem;                                          /* 16px */
  --fz-meta: .8125rem;                                      /* 13px — klamp-метки */
  --fz-nav: .9375rem;                                       /* 15px */
  --lh-heading: .9;              /* PV-HERO: 0.88–0.95 */
  --lh-mono: 1.26;               /* PV-HERO: обвязка Klamp */
  --lh-body: 1.5;
  --ls-display: -.025em;         /* PV-HERO: заголовки −2…−3% */
  --ls-mono: -.05em;             /* PV-HERO: Klamp Bold −5% */
  --ls-caps: .04em;              /* только Pangram Narrow (нав/кнопки) */

  /* ---------- Отступы (шаг 4) ---------- */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-6: 24px; --sp-8: 32px; --sp-12: 48px; --sp-16: 64px;
  --sp-24: 96px; --sp-32: 128px; --sp-40: 160px;
  --section-y: clamp(64px, 4vw + 40px, 160px);   /* вертикальный ритм секций */
  --container: 1440px;
  --gutter: clamp(16px, 3vw, 48px);

  /* ---------- Прочее ---------- */
  --radius: 4px;                 /* максимум 12px, по умолчанию 4 */
  --radius-card: 8px;
  --t-fast: 180ms;               /* hover/фокус */
  --t-reveal: 500ms;             /* скролл-reveal */
  --ease-out: cubic-bezier(.22, .61, .36, 1);   /* power2.out */

  --z-header: 100;
  --z-overlay: 200;

  --header-h: 72px;
  --header-h-mobile: 60px;

  /* Стрелка CTA — маской, а не символом «→»: этого глифа нет ни в Klamp, ни в Pangram,
     и браузер подставлял Arial (системный шрифт в видимом тексте = анти-паттерн бренда).
     Красится через currentColor. */
  --arrow-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.1 4.2 11.7 5.6l5.4 5.4H3.2v2h13.9l-5.4 5.4 1.4 1.4 7.8-7.8z'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* Русская версия: моно-обвязка набирается Pangram Sans (см. @font-face выше), а трекинг
   −5% рассчитан на моноширинный Klamp — на пропорциональном капсе он слипается.
   Ослабляем только на RU-сайте. */
html[lang="ru"] { --ls-mono: -.015em; }

/* ---------- База ---------- */
* { box-sizing: border-box; }
svg { fill: currentColor; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--c-black);
  color: var(--c-white);
  font: 500 var(--fz-body) / var(--lh-body) var(--ff-text);
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3 {
  font-family: var(--ff-heading);
  font-weight: 800;
  line-height: var(--lh-heading);
  letter-spacing: var(--ls-display);
  text-transform: uppercase;
  margin: 0;
}
.mono {
  font-family: var(--ff-mono);
  font-weight: 600;
  font-size: var(--fz-meta);
  line-height: var(--lh-mono);
  letter-spacing: var(--ls-mono);
  text-transform: uppercase;
}
.num { font-family: var(--ff-numbers); font-weight: 400; }
.accent { color: var(--c-mint); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}