/**
 * CSS Variables - Глобальные переменные темы АртроКлиника
 *
 * Централизованное хранение цветов, шрифтов и других констант дизайна.
 * Все секционные CSS файлы должны использовать эти переменные.
 */

:root {
	/* ============================================
	   Цвета
	   ============================================ */

	/* Основные цвета */
	--color-primary: #243674;
	--color-primary-rgb: 36, 54, 116;
	--color-accent: #EA976A;
	--color-accent-hover: #d88659;
	--color-accent-rgb: 234, 151, 106;

	/* Серые оттенки */
	--color-gray: #BEC3D6;
	--color-gray-light: #C6CBDB;
	--color-gray-breadcrumb: #A2A5AA;
	--color-text-muted: #666666;

	/* Фоновые цвета */
	--color-bg-light: #EEEFF3;
	--color-bg-lighter: #F5F6F8;
	--color-bg-card: #F0EFF0;
	--color-bg-gradient-start: #EAEBEF;

	/* Базовые цвета */
	--color-white: #FFFFFF;
	--color-black: #000000;
	--color-text-dark: #1A1A1A;

	/* Статусные цвета */
	--color-error: #ff6b6b;
	--color-success: #4CAF50;

	/* ============================================
	   Шрифты
	   ============================================ */

	--font-primary: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	--font-heading: 'Museo Cyrl', 'Georgia', serif;

	/* Размеры шрифтов */
	--font-size-xs: 12px;
	--font-size-13: 13px;
	--font-size-sm: 14px;
	--font-size-15: 15px;
	--font-size-base: 16px;
	--font-size-md: 18px;
	--font-size-lg: 20px;
	--font-size-22: 22px;
	--font-size-24: 24px;
	--font-size-xl: 26px;
	--font-size-2xl: 28px;
	--font-size-30: 30px;
	--font-size-32: 32px;
	--font-size-3xl: 34px;
	--font-size-36: 36px;
	--font-size-4xl: 42px;
	--font-size-48: 48px;
	--font-size-hero: 59px;

	/* Высота строки */
	--line-height-tight: 1.1;
	--line-height-base: 1.2;
	--line-height-relaxed: 1.37;
	--line-height-loose: 1.5;

	/* ============================================
	   Радиусы скругления
	   ============================================ */

	--radius-sm: 8px;
	--radius-md: 12px;
	--radius-lg: 20px;
	--radius-xl: 24px;
	--radius-2xl: 30px;
	--radius-pill: 200px;

	/* ============================================
	   Отступы (padding)
	   ============================================ */

	--spacing-4: 4px;
	--spacing-6: 6px;
	--spacing-xs: 8px;
	--spacing-10: 10px;
	--spacing-sm: 12px;
	--spacing-13: 13px;
	--spacing-14: 14px;
	--spacing-md: 16px;
	--spacing-lg: 20px;
	--spacing-xl: 24px;
	--spacing-2xl: 30px;
	--spacing-32: 32px;
	--spacing-35: 35px;
	--spacing-3xl: 40px;
	--spacing-4xl: 52px;

	/* ============================================
	   Тени
	   ============================================ */

	--shadow-sm: 0 2px 8px rgba(36, 54, 116, 0.08);
	--shadow-md: 0 4px 12px rgba(36, 54, 116, 0.15);
	--shadow-lg: 0 4px 12px rgba(0, 0, 0, 0.1);

	/* ============================================
	   Переходы
	   ============================================ */

	--transition-fast: 0.2s ease;
	--transition-base: 0.3s ease;
	--transition-slow: 0.4s ease;

	/* ============================================
	   Контейнеры
	   ============================================ */

	--container-max-width: 1366px;
	--container-content-width: 1262px;

	/* ============================================
	   Z-Index слои
	   ============================================ */

	--z-dropdown: 100;
	--z-sticky: 500;
	--z-header: 1000;
	--z-modal: 2000;
}