/* =========================================================
   DESIGN TOKENS
   Единственный источник цветов, шрифтов, отступов и брейкпоинтов.
   При редизайне в первую очередь меняется этот файл.
   ========================================================= */
:root {
  /* Colors */
  --color-primary: #fa9043;
  --color-primary-rgb: 250, 144, 67;
  --color-white: #ffffff;
  --color-black: #000000;
  --color-text: #848484;
  --color-title: #222222;
  --color-border: #e5e5e5;
  --color-surface-alt: #f5f5f5;
  --color-footer-bg: #252525;
  --color-footer-text: #a0a0a0;
  --color-footer-bottom: #1d1d1d;

  /* Typography */
  --font-body: 'Lato', sans-serif;
  --font-heading: 'Playfair Display', serif;
  --fs-base: 15px;
  --lh-base: 1.7;
  --fs-h1: 40px;
  --fs-h2: 30px;
  --fs-h3: 25px;
  --fs-h4: 22px;

  /* Spacing */
  --space-xs: 5px;
  --space-sm: 10px;
  --space-md: 20px;
  --space-lg: 30px;
  --space-xl: 50px;
  --section-padding: 80px;

  /* Layout */
  --container-max: 1140px;
  --container-gutter: 15px;
  --header-height: 80px;

  /* Effects */
  --radius: 0;
  --shadow-header: 0 3px 12px rgba(0, 0, 0, 0.08);
  --transition: 0.3s ease-in-out;

  /* Breakpoints (для справки — CSS custom properties нельзя использовать в @media):
     sm 576px · md 768px · lg 992px · xl 1200px */
}

@media (min-width: 992px) {
  :root {
    --section-padding: 100px;
  }
}