/* ========================================================
   CSS ПЕРЕМЕННЫЕ
   Все цвета, размеры, тени, z-index и другие переменные
======================================================== */

:root {
   /* Основные акценты (приглушённое золото) */
  --primary: #c8a96a;
  --primary-hover: #b89555;
  --secondary: #e7d3a3;

  /* Фоны */
  --bg-color: #f5f3ef;        
  --surface: #ffffff;        
  --surface-soft: #faf8f4;    

  /* Текст */
  --text-color: #2f2f2f;     
  --text-muted: #6b6b6b;    
  --text-light: #9ca3af;

  /* Тёмная тема */
  --dark-bg: #1c1c1c;
  --dark-surface: #2a2a2a;
  --dark-text: #f5f5f5;

  /* Границы */
  --border-color: #e6e1d8;

  /* Тени  */
  --shadow-sm: 0 4px 10px rgba(0, 0, 0, 0.04);
  --shadow-md: 0 10px 20px rgba(0, 0, 0, 0.06);
  --shadow-heavy: 0 20px 40px rgba(0, 0, 0, 0.08);
    
    --transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    --radius: 2px;
    
    --pattern-diagonal: repeating-linear-gradient(45deg, rgba(0,0,0,0.02) 0, rgba(0,0,0,0.02) 2px, transparent 2px, transparent 10px);
    
    --spacing-xs: 8px;
    --spacing-sm: 12px;
    --spacing-md: 16px;
    --spacing-lg: 20px;
    --spacing-xl: 24px;
    --spacing-2xl: 30px;
    --spacing-3xl: 40px;
    --spacing-4xl: 50px;
    --spacing-5xl: 60px;
    --spacing-6xl: 80px;
    --spacing-7xl: 90px;
    
    --container-padding: 20px;
    --container-max-width: 1400px;
    
    --font-size-xs: 12px;
    --font-size-sm: 13px;
    --font-size-base: 14px;
    --font-size-lg: 16px;
    --font-size-xl: 18px;
    --font-size-2xl: 20px;
    --font-size-3xl: 24px;
    --font-size-4xl: 28px;
    --font-size-5xl: 32px;
    --font-size-6xl: 36px;
    --font-size-7xl: 38px;
    --font-size-8xl: 42px;
    --font-size-9xl: 44px;
    
    --z-sticky: 1000;
    --z-dropdown: 1050;
    --z-modal: 9999;
    --z-slide: 1;
    --z-slide-active: 10;
    --z-slide-inner: 11;
    --z-slider-nav: 20;
    
    --sidebar-width: 280px;
    --sidebar-top: 100px;
}