/* CSS Variables - Основная система дизайна */

:root {
    /* Цветовая палитра */
    --primary-color: #10b77d;
    --primary-hover: #0ea86f;
    --primary-light: #e8f9f1;
    --secondary-color: #202a34;
    --text-color: #8c90a9;
    --white: #fff;
    --light-gray: #f8f9fa;
    --border-color: #eaeaea;
    --shadow-light: rgba(0, 0, 0, 0.05);
    --shadow-primary: rgba(16, 183, 125, 0.15);
    --shadow-primary-hover: rgba(16, 183, 125, 0.25);

    /* Размеры и отступы */
    --container-max-width: 1200px;
    --border-radius: 100px;
    --border-radius-small: 10px;
    --border-radius-medium: 20px;

    /* Z-index система */
    --z-base: 1;
    --z-dropdown: 1000;
    --z-header: 999;
    --z-modal: 10000;
    --z-tooltip: 1100;
    --z-burger: 1100;

    /* Тени */
    --shadow-default: 0 5px 20px var(--shadow-light);
    --shadow-primary-default: 0 0px 15px var(--shadow-primary);
    --shadow-primary-hover: 0 8px 20px var(--shadow-primary-hover);
    --shadow-button: 0 0px 15px var(--shadow-primary);

    /* Переходы */
    --transition-fast: 0.2s ease-in-out;
    --transition-normal: 0.3s ease;
    --transition-slow: 0.5s ease;

    /* Типографика */
    --font-family: 'Montserrat', sans-serif;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extrabold: 800;

    /* Брейкпоинты */
    --breakpoint-xs: 480px;
    --breakpoint-sm: 768px;
    --breakpoint-md: 992px;
    --breakpoint-lg: 1200px;
    --breakpoint-xl: 1400px;
}