/* design-tokens.css — Framework Design System */
:root {
  /* Цвета */
  --color-bg:           #f5f1ea;
  --color-surface:      #ede8df;
  --color-surface-2:    #e8e2d8;
  --color-border:       rgba(0,0,0,0.08);
  --color-text:         #1a1814;
  --color-text-2:       #7a7060;
  --color-text-3:       #b0a898;
  --color-accent:       #b46428;
  --color-accent-hover: #c47438;
  --color-error:        #c0392b;
  --color-success:      #5a8a5a;

  /* Типографика */
  --font-main:      'Raleway', sans-serif;
  --text-xs:        13px;
  --text-sm:        13px;
  --text-base:      15px;
  --text-md:        18px;
  --text-lg:        24px;
  --text-xl:        clamp(32px, 4vw, 48px);
  --text-2xl:       clamp(44px, 6vw, 72px);
  --text-hero:      clamp(56px, 8vw, 96px);

  /* Отступы */
  --space-1: 4px;   --space-2: 8px;   --space-3: 12px;
  --space-4: 16px;  --space-5: 20px;  --space-6: 24px;
  --space-8: 32px;  --space-10: 40px; --space-12: 48px;
  --space-16: 64px; --space-20: 80px; --space-24: 96px;

  /* Радиусы */
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   16px;
  --radius-xl:   24px;
  --radius-pill: 100px;

  /* Тени */
  --shadow-sm: 0 1px 4px rgba(26,24,20,0.06);
  --shadow-md: 0 4px 16px rgba(26,24,20,0.08);
  --shadow-lg: 0 8px 32px rgba(26,24,20,0.10);

  /* Анимации */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
  --duration-fast:   150ms;
  --duration-normal: 300ms;
  --duration-slow:   600ms;

  /* Сетка */
  --grid-max:     1200px;
  --page-padding: clamp(20px, 5vw, 80px);
  --section-py:   clamp(64px, 8vw, 120px);
}