/* ===== PROF CSS VARIABLES ===== */
/* Основано на PROF Style Guide */

:root {
    /* ===== ОСНОВНЫЕ ЦВЕТА ===== */
    --color-primary: #112a3d;        /* Primary Blue - основной цвет */
    --color-navy: #112a3d;           /* Navy - текст навигации, бургер-меню */
    --color-red: #b02822;            /* Red Accent - кнопки Subscribe, заголовки таблиц */
    --color-orange: #ff8562;         /* Orange Link - ссылки по умолчанию */

    /* ===== ФОНОВЫЕ ЦВЕТА ===== */
    --color-bg: #fbf8f3;             /* Cream Background - основной фон */
    --color-bg-white: #ffffff;       /* White - фон карточек, попапов */
    --color-bg-black: #000000;       /* Black - кнопки основные */

    /* ===== ТАБЛИЦЫ ===== */
    --color-table-header: #b02822;   /* Фон заголовков таблицы */
    --color-table-odd: #112a3d;      /* Нечётные строки */
    --color-table-even: #7d8a96;     /* Чётные строки */
    --color-table-border: #eeeeee;   /* Границы ячеек */

    /* ===== ТЕКСТ ===== */
    --color-text: #000000;           /* Основной текст */
    --color-text-gray: #525252;      /* Второстепенный текст */
    --color-text-light: #888787;     /* Мелкий текст в футере */
    --color-text-lighter: #aaaaaa;   /* Иконки, placeholder */
    --color-text-white: #ffffff;     /* Белый текст */

    /* ===== СТАТУСЫ / НОТИФИКАЦИИ ===== */
    --color-primary-hover: #1a4a6e;  /* Primary hover state */
    --color-success: #28a745;        /* Успех - зелёный */
    --color-warning: #ffc107;        /* Предупреждение - жёлтый */
    --color-error: #dc3545;          /* Ошибка - красный */

    /* ===== ГРАНИЦЫ ===== */
    --color-border: #c9c9c9;         /* Границы полей ввода */
    --color-border-light: #eeeeee;   /* Светлые границы */

    /* ===== ШРИФТЫ ===== */
    --font-heading: 'Montserrat', Arial, sans-serif;
    --font-body: 'Inter', Arial, sans-serif;

    /* ===== НАЧЕРТАНИЯ ШРИФТОВ ===== */
    --font-weight-light: 300;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;

    /* ===== РАЗМЕРЫ ШРИФТОВ ===== */
    --font-size-hero: 64px;          /* Hero-заголовок */
    --font-size-h1: 42px;            /* Заголовки секций */
    --font-size-h2: 36px;            /* Подзаголовки */
    --font-size-h3: 32px;            /* Заголовки карточек */
    --font-size-lg: 24px;            /* Описания XL */
    --font-size-md: 20px;            /* Имена, лейблы */
    --font-size-base: 16px;          /* Базовый размер */
    --font-size-sm: 14px;            /* Мелкий текст */
    --font-size-xs: 12px;            /* Uptitle */

    /* ===== LINE-HEIGHT ===== */
    --line-height-tight: 1.17;
    --line-height-normal: 1.23;
    --line-height-relaxed: 1.35;
    --line-height-loose: 1.5;
    --line-height-body: 1.55;

    /* ===== LETTER-SPACING ===== */
    --letter-spacing-uptitle: 2.5px;

    /* ===== SPACING ===== */
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 32px;
    --space-2xl: 48px;
    --space-3xl: 64px;
    --space-4xl: 96px;
    --space-5xl: 128px;

    /* ===== СЕКЦИИ PADDING ===== */
    --section-pt-sm: 15px;
    --section-pt-md: 30px;
    --section-pt-lg: 45px;
    --section-pt-xl: 60px;
    --section-pt-2xl: 75px;
    --section-pt-3xl: 120px;

    --section-pb-sm: 15px;
    --section-pb-md: 45px;
    --section-pb-lg: 60px;
    --section-pb-xl: 90px;
    --section-pb-2xl: 120px;
    --section-pb-3xl: 135px;

    /* ===== CONTAINER ===== */
    --container-max: 1200px;
    --container-lg: 1000px;
    --container-md: 800px;
    --container-padding: 20px;

    /* ===== КОЛОНКИ (GRID) ===== */
    --col-margin: 20px;
    --col-1: 60px;
    --col-2: 160px;
    --col-3: 260px;
    --col-4: 360px;
    --col-5: 460px;
    --col-6: 560px;
    --col-7: 660px;
    --col-8: 760px;
    --col-9: 860px;
    --col-10: 960px;
    --col-11: 1060px;
    --col-12: 1160px;

    /* ===== HEADER ===== */
    --header-height: 80px;

    /* ===== BORDER RADIUS ===== */
    --radius-none: 0;
    --radius-sm: 5px;
    --radius-md: 10px;
    --radius-lg: 20px;
    --radius-pill: 21px;

    /* ===== КНОПКИ ===== */
    --btn-height: 60px;
    --btn-height-sm: 45px;
    --btn-height-xs: 35px;
    --btn-padding: 60px;
    --btn-padding-sm: 30px;
    --btn-padding-xs: 15px;

    /* ===== SHADOWS ===== */
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --shadow-md: 0 1px 3px 0 rgba(0, 0, 0, 0.05);
    --shadow-lg: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
    --shadow-xl: 0 12px 24px 0 rgba(0, 0, 0, 0.08);

    /* ===== TRANSITIONS ===== */
    --transition-fast: 0.2s ease-in-out;
    --transition-base: 0.25s ease-in-out;
    --transition-slow: 0.3s ease-in-out;

    /* ===== Z-INDEX ===== */
    --z-dropdown: 1000;
    --z-sticky: 1020;
    --z-fixed: 1030;
    --z-header: 990;
    --z-modal-backdrop: 1040;
    --z-modal: 10000;
    --z-popover: 1060;
    --z-tooltip: 1070;

    /* ===== BREAKPOINTS (для справки) ===== */
    /* Desktop: >1200px */
    /* Laptop: ≤1200px (960px container) */
    /* Tablet: ≤960px (640px container) */
    /* Mobile: ≤640px (100% + padding 20px) */
}
