/* ============================================================
   DESIGN TOKENS — выгружены из Figma Styles (SECTION 642:751).
   Имена переменных = имена в Figma Styles, приведённые к kebab-case.
   ============================================================ */

:root {
  /* ---------- COLORS ---------- */
  --color-black:       #090A0C; /* Figma: color/black */
  --color-dark-gray:   #3D3D3D; /* Figma: color/dack_gray (опечатка автора макета) */
  --color-white:       #F7F7F7; /* Figma: Text/white */
  --color-red:         #BC0002; /* Figma: Button/red/color/red — главный CTA */
  --color-green:       #20D439; /* Figma: color_green — Button/red/ChekList_all */

  /* алиасы по смыслу */
  --color-bg:          var(--color-black);
  --color-bg-light:    var(--color-white);
  --color-bg-gray:     var(--color-dark-gray);
  --color-text:        var(--color-white);
  --color-text-dark:   var(--color-black);
  --color-accent:      var(--color-red);

  /* ---------- TYPOGRAPHY ---------- */
  --font-display:      "Roboto Condensed", system-ui, sans-serif; /* заголовки h1/h2 */
  --font-body:         "Inter", system-ui, sans-serif;            /* всё остальное */

  /* Шкалы из Figma — desktop 1920 (base). Mobile в mobile.css переопределяет. */
  /* Inter */
  --font-h0:           80px;  /* Figma Text_H0_80 — Black */
  --font-h1-red:       60px;  /* Figma Lagre_60_Bold/Red — Bold */
  --font-h-54:         54px;  /* Figma Text_54 — Medium */
  --font-h2:           48px;  /* Figma Lagre_48_Bold/Black — Bold */
  --font-h2-roboto:    48px;  /* Figma Roboto_48 — Roboto Condensed Bold */
  --font-h-42-semi:    42px;  /* Figma Lagre_42_SemiBold/White */
  --font-h-42-bold:    42px;  /* Figma Lagre_42_Bold/White */
  --font-h-40:         40px;  /* Figma Text_40_Bold_Caps */
  --font-h-36-semi:    36px;  /* Figma Lagre-36-SemiBold */
  --font-h-36-reg:     36px;  /* Figma Text_36_Reg */
  --font-h-34:         34px;  /* Figma Text_34_H5 — Bold */
  --font-h-32-semi:    32px;  /* Figma Text_32/Black — Semi Bold */
  --font-h-32-reg:     32px;  /* Figma Lagre_32_Regular/Black */
  --font-h-28-roboto:  28px;  /* Figma Roboto_28 */
  --font-body-24:      24px;  /* Figma Text_24_H6 / Text_24/Black — Regular */
  --font-body-24-black:24px;  /* Figma lsgre-24-Black */
  --font-h-22-roboto:  22px;  /* Figma Roboto_22 */
  --font-body-20:      20px;  /* Figma Middle-20/Medium */
  --font-body-20-black:20px;  /* Figma Middle-20/White/Black */
  --font-body-16-bold: 16px;  /* Figma Lagre_16_bold */
  --font-body-16:      16px;  /* Figma 16_list — Regular */
  --font-btn-16:       16px;  /* Figma Button/Standart/large_16_Black */

  /* line-height по умолчанию */
  --lh-tight:          1.1;   /* заголовки */
  --lh-normal:         1.3;   /* подзаголовки */
  --lh-body:           1.5;   /* текст */

  /* ---------- LAYOUT ---------- */
  --layout-desktop:    1920px;
  --layout-desktop-md: 1440px;
  --layout-mobile:     440px;
  --layout-mobile-sm:  375px;

  /* ---------- RADII ---------- */
  --radius-sm:         8px;
  --radius-md:         16px;
  --radius-lg:         24px;
  --radius-pill:       999px;

  /* ---------- TRANSITIONS ---------- */
  --t-fast:            150ms ease;
  --t-normal:          250ms ease;
  --t-slow:            400ms ease;

  /* ---------- Z-INDEX ---------- */
  --z-sticky:          100;
  --z-modal-backdrop:  500;
  --z-modal:           510;
}
