/* =====================================================
   DESIGN TOKENS — единый источник правды для стилей
   Подключается первым через @import в style.css
   ===================================================== */

/* ========== FONTS (import) ========== */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800;900&family=Manrope:wght@400;500;600;700;800&display=swap');

:root {

    /* ----------------------------------------
       ЦВЕТА — основная палитра
    ---------------------------------------- */
    --color-bg:               #f8f9fa;
    --color-surface:          #ffffff;
    --color-white:            #ffffff;

    --color-text-primary:     #1e3a5f;
    --color-text-secondary:   #64748b;

    --color-accent:           #0891b2;
    --color-accent-mid:       #0a9fb8;   /* промежуточный, используется в градиентах */
    --color-accent-dark:      #0e7490;
    --color-accent-darker:    #0a5f7a;   /* hover-градиенты */
    --color-accent-light:     #06b6d4;
    --color-accent-hover-bg:  #f0f9ff;   /* светлый фон белых кнопок при hover */

    --color-secondary:        #164a5a;

    --color-border:           #e2e8f0;

    /* Семантические / статусные */
    --color-danger:           #E53E3E;
    --color-danger-dark:      #C53030;
    --color-success:          #2e9a6b;   /* rgba(46, 154, 107) */

    /* Специальные */
    --color-star:             #FFB800;   /* рейтинг / звёзды */
    --color-yandex:           #FC3F1D;   /* иконка Яндекса */

    /* ----------------------------------------
       ЦВЕТА — rgba-обёртки для теней и оверлеев
       (CSS не умеет делать rgba из hex-переменной
        без color-mix, поэтому выносим отдельно)
    ---------------------------------------- */
    --color-shadow-dark:      rgba(11, 26, 51, 1);   /* = --color-text-primary */
    --color-shadow-accent:    rgba(8, 145, 178, 1);  /* = --color-accent */
    --color-shadow-black:     rgba(0, 0, 0, 1);
    --color-overlay-dark:     rgba(0, 0, 0, 0.5);
    --color-overlay-darker:   rgba(0, 0, 0, 0.95);

    /* ----------------------------------------
       ТИПОГРАФИКА
    ---------------------------------------- */
    --font-main:      'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-headings:  'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    --font-size-xs:   11px;
    --font-size-sm:   13px;
    --font-size-base: 16px;
    --font-size-md:   18px;
    --font-size-lg:   20px;
    --font-size-xl:   24px;
    --font-size-2xl:  28px;
    --font-size-3xl:  32px;
    --font-size-4xl:  40px;
    --font-size-5xl:  48px;

    /* ----------------------------------------
       СКРУГЛЕНИЯ
    ---------------------------------------- */
    --radius-sm:   4px;
    --radius-md:   8px;
    --radius-lg:   12px;
    --radius-xl:   16px;
    --radius-2xl:  24px;
    --radius-pill: 30px;
    --radius-full: 50%;

    /* ----------------------------------------
       ТЕНИ
    ---------------------------------------- */
    --shadow-xs:      0 2px 10px rgba(11, 26, 51, 0.08);
    --shadow-sm:      0 4px 20px rgba(11, 26, 51, 0.06);
    --shadow-md:      0 10px 40px rgba(11, 26, 51, 0.15);
    --shadow-lg:      0 15px 50px rgba(11, 26, 51, 0.15);
    --shadow-card:    0 4px 20px rgba(11, 26, 51, 0.06);

    --shadow-accent-sm:  0 4px 15px rgba(8, 145, 178, 0.3);
    --shadow-accent-md:  0 15px 50px rgba(8, 145, 178, 0.3);
    --shadow-accent-lg:  0 15px 45px rgba(8, 145, 178, 0.2);

    --shadow-black-sm:   0 4px 12px rgba(0, 0, 0, 0.2);
    --shadow-black-md:   0 8px 25px rgba(0, 0, 0, 0.3);

    /* ----------------------------------------
       ПЕРЕХОДЫ / АНИМАЦИИ
    ---------------------------------------- */
    --transition:       all 0.3s ease;
    --transition-slow:  all 0.4s ease;

    /* ----------------------------------------
       ОТСТУПЫ / СЕТКА
    ---------------------------------------- */
    --section-padding: 40px;
    --container-max:   1280px;
    --container-px:    20px;

    /* ----------------------------------------
       Z-INDEX СЛОИ
    ---------------------------------------- */
    --z-base:    1;
    --z-above:   2;
    --z-header:  100;
    --z-topbar:  101;
    --z-menu:    1000;
    --z-menu-dd: 1001;
    --z-overlay: 999;
    --z-modal:   10000;
    --z-toast:   10001;
}