/* ============================================
   MEMORA · Variables & Design Tokens
   Единая точка управления цветом, типографикой, spacing
   ============================================ */

:root {
  /* === ЦВЕТА === */
  
  /* Основные поверхности */
  --bg: #f8f6f3;              /* Основной фон страницы */
  --bg-alt: #efebe6;          /* Фон альтернативных секций */
  --surface: #ffffff;         /* Карточки, формы */
  
  /* Бренд и акценты */
  --accent: #b8867a;          /* Пыльная роза — основной акцент */
  --accent-dark: #9a6f64;     /* Темнее для hover состояний */
  --accent-light: #d4a89e;    /* Светлее для фонов бейджей */
  --sage: #7d8a6e;            /* Шалфейный зелёный — вторичный акцент */
  
  /* Текст */
  --text: #2d2a26;            /* Основной текст (тёплый чёрный) */
  --text-light: #6b6560;      /* Вторичный текст (серо-коричневый) */
  --text-muted: #9a9590;      /* Приглушённый текст (подписи, placeholder) */
  --text-inverse: #ffffff;    /* Текст на тёмном фоне */
  
  /* Границы и тени */
  --border: #e5e0d8;          /* Линии разделители */
  --border-strong: #cdc7bf;   /* Более заметные границы */
  --shadow-sm: 0 2px 8px rgba(45, 42, 38, 0.04);
  --shadow-md: 0 10px 40px rgba(45, 42, 38, 0.08);
  --shadow-lg: 0 20px 50px rgba(45, 42, 38, 0.12);
  --shadow-accent: 0 20px 50px rgba(184, 134, 122, 0.15);
  
  /* === ТИПОГРАФИКА === */
  
  /* Семейства шрифтов */
  --font-heading: 'DM Serif Display', Georgia, serif;
  --font-body: 'Manrope', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: 'IBM Plex Mono', monospace; /* Для технических деталей */
  
  /* Размеры шрифтов (fluid scale) */
  --fs-xs: clamp(0.75rem, 0.7rem + 0.2vw, 0.82rem);
  --fs-sm: clamp(0.85rem, 0.8rem + 0.2vw, 0.92rem);
  --fs-base: clamp(0.95rem, 0.9rem + 0.2vw, 1rem);
  --fs-md: clamp(1.05rem, 1rem + 0.2vw, 1.1rem);
  --fs-lg: clamp(1.2rem, 1.1rem + 0.3vw, 1.3rem);
  --fs-xl: clamp(1.5rem, 1.3rem + 0.5vw, 1.8rem);
  --fs-2xl: clamp(1.8rem, 1.5rem + 1vw, 2.4rem);
  --fs-3xl: clamp(2.2rem, 1.8rem + 1.5vw, 3.2rem);
  --fs-hero: clamp(2.4rem, 2rem + 2vw, 3.8rem);
  
  /* Межстрочные интервалы */
  --lh-tight: 1.1;
  --lh-snug: 1.3;
  --lh-normal: 1.6;
  --lh-relaxed: 1.8;
  
  /* Вес шрифта */
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  
  /* === SPACING SYSTEM === */
  
  /* Базовая единица: 8px */
  --space-1: 0.25rem;   /* 4px */
  --space-2: 0.5rem;    /* 8px */
  --space-3: 0.75rem;   /* 12px */
  --space-4: 1rem;      /* 16px */
  --space-5: 1.25rem;   /* 20px */
  --space-6: 1.5rem;    /* 24px */
  --space-8: 2rem;      /* 32px */
  --space-10: 2.5rem;   /* 40px */
  --space-12: 3rem;     /* 48px */
  --space-16: 4rem;     /* 64px */
  --space-20: 5rem;     /* 80px */
  --space-24: 6rem;     /* 96px */
  
  /* Секционные отступы */
  --section-pad-y: var(--space-20);
  --section-pad-y-mobile: var(--space-12);
  --container-max-width: 1200px;
  --container-padding-x: var(--space-8);
  --container-padding-x-mobile: var(--space-4);
  
  /* === RADII & SHAPES === */
  
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-full: 9999px;
  
  /* === TRANSITIONS === */
  
  --transition-fast: 0.15s ease;
  --transition-base: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-bounce: 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
  
  /* === Z-INDEX SCALE === */
  
  --z-dropdown: 10;
  --z-sticky: 100;
  --z-modal-backdrop: 900;
  --z-modal: 1000;
  --z-toast: 1100;
}