/* =========================================================
   DESIGN TOKENS
   Source of truth (from Figma Variables / JSON)
   ========================================================= */

:root {

  /* =======================================================
     COLORS — TEXT
     ======================================================= */

  --color-text-primary: #2c2c2c;
  --color-text-secondary: #91806e;
  --color-text-accent-primary: #494037;
  --color-text-accent-secondary: #6c6c6c;
  --color-text-contrast: #ffffff;

  /* =======================================================
     COLORS — ACCENT
     ======================================================= */

  --color-accent-main: #3e2f26;
  --color-accent-light: #91806e;
  --color-accent-dark: #2c2c2c;
  --color-accent-contrast: #ffffff;

  /* =======================================================
     COLORS — BACKGROUND
     ======================================================= */

  --color-bg-main: #f8f6f2;
  --color-bg-light: #fbfaf8;

  /* =======================================================
     SPACING (rem-based)
     ======================================================= */

  --space-0: 0rem;
  --space-2: 0.143rem;
  --space-4: 0.286rem;
  --space-8: 0.571rem;
  --space-12: 0.857rem;
  --space-16: 1.143rem;
  --space-20: 1.429rem;
  --space-24: 1.714rem;
  --space-32: 2.286rem;

  /* =======================================================
     FONT FAMILIES
     ======================================================= */

  --font-vollkorn: 'Vollkorn', serif;
  --font-vollkorn-sc: 'Vollkorn SC', serif;

  /* =======================================================
     FONT SIZES
     ======================================================= */

  --font-size-12: 12px;
  --font-size-13: 13px;
  --font-size-14: 14px;
  --font-size-15: 15px;
  --font-size-16: 16px;
  --font-size-32: 32px;

  /* =======================================================
     LINE HEIGHTS
     ======================================================= */

  --line-height-100: 1;
  --line-height-120: 1.2;
  --line-height-140: 1.4;
  --line-height-150: 1.5;

  /* =======================================================
     LETTER SPACING
     ======================================================= */

  --letter-spacing-0: 0;
  --letter-spacing-3: 0.03em;
  --letter-spacing--1: -0.01em;

  /* =======================================================
     SHADOWS
     ======================================================= */

  --shadow-50:
    0 1px 3px rgba(10, 13, 18, 0.1),
    0 1px 2px -1px rgba(10, 13, 18, 0.1);

  --shadow-200:
    0 1px 4px rgba(12, 12, 13, 0.1),
    0 1px 4px rgba(12, 12, 13, 0.05);

  --shadow-400:
    0 16px 32px -4px rgba(12, 12, 13, 0.1),
    0 4px 4px -4px rgba(12, 12, 13, 0.05);

  /* =======================================================
     SCROLLBAR COLORS
     ======================================================= */

  --scrollbar-thumb-color: rgba(145, 128, 110, 0.6); /* цвет неактивной кнопки secondary */
  --scrollbar-track-color: transparent;

}
