/* tokens.css — CSS Custom Properties: всі змінні дизайну */
:root {
  /* ===== Kolory (Раздел 2) ===== */
  --color-bg-primary: #121212;   /* общий фон, хедер, футер */
  --color-bg-dark:    #0F1617;   /* тёмные карточки, игровые секции */
  --color-accent-bg:  #009CA9;   /* активные кнопки, плашки, бейджи */
  --color-white:      #FFFFFF;   /* основной светлый текст */
  --color-text:       #A4A4A4;   /* обычный текст, меню, описания */
  --color-heading:    #F8C64E;   /* H2, названия секций, акценты */
  --color-btn-text:   #FFFFFF;   /* текст внутри CTA-кнопок */
  --color-card:       #181818;   /* карточки игр, панели, блоки */
  --color-cold-blue:  #394950;   /* навигация, category tabs, разделители */

  --gradient-cta:      linear-gradient(180deg, #09272B 0%, #3E9FAD 50%, #09272B 100%);
  --gradient-cta-alt:  linear-gradient(180deg, #0F1617 0%, #688091 51%, #2B313B 100%);

  /* ===== Шрифты ===== */
  --font-body: "Cabin", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --font-head: "Cinzel", "Cabin", Georgia, serif; /* декоративные заголовки H3 (Norse-стиль) */

  --fs-body: clamp(14px, 1.6vw, 16px);
  --fs-h1:   clamp(34px, 5vw, 46px);
  --fs-h2:   clamp(26px, 3.6vw, 34px);
  --fs-h3:   clamp(20px, 2.4vw, 24px);

  --lh: 1.6;

  --fw-regular: 400;
  --fw-medium:  500;
  --fw-btn:     700;
  --fw-head:    800;

  /* ===== Отступы и сетка ===== */
  --space-section: clamp(40px, 6vw, 60px); /* между секциями */
  --space-cards:   20px;  /* между карточками */
  --space-para:    20px;  /* между абзацами */
  --space-h2-text: 20px;  /* H2 → текст */
  --space-h3-text: 16px;  /* H3 → текст */
  --space-faq:     16px;  /* между вопросами FAQ */
  --pad-card:      24px;  /* внутренний padding карточки */
  --container:     1440px;

  /* ===== Форма карточек/кнопок ===== */
  --radius: 0; /* border-radius: 0 */
  --cut: 16px; /* срезанный нижний правый угол */
  --clip-cut: polygon(100% 0, 100% calc(100% - 16px), calc(100% - 16px) 100%, 0 100%, 0 0);

  /* ===== Тени и переходы ===== */
  --shadow-1: 0 4px 16px rgba(0, 0, 0, 0.45);
  --shadow-2: 0 8px 28px rgba(0, 0, 0, 0.55);
  --transition: 0.25s ease;
  --transition-fast: 0.15s ease;

  --header-h: 72px;
}