/* ==========================================================================
   ТОКЕНЫ — Андерсон: Зелёная цветовая капсула (Свежая/Классическая)
   ========================================================================== */

/* ==========================================================================
   1. ЛОКАЛЬНЫЕ ШРИФТЫ АНДЕРСОН
   ========================================================================== */
@font-face {
    font-family: 'Helvetica';
    src: url('../assets/fonts/Helvetica-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Helvetica';
    src: url('../assets/fonts/Helvetica-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Helvetica';
    src: url('../assets/fonts/Helvetica-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Sacramento';
    src: url('../assets/fonts/Sacramento.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* ==========================================================================
   2. ЗЕЛЁНАЯ ЦВЕТОВАЯ КАПСУЛА (Свежая/Классическая)
   ========================================================================== */
:root {
    /* Основная палитра капсулы */
    --color-bg: #E8F1F5;          /* Ice — фон страницы */
    --color-accent: #8FA89D;      /* Sage — акценты, кнопки */
    --color-accent-light: #192D14;/* Темно-зеленый — контрастный текст */

    /* Вспомогательные оттенки */
    --color-accent-soft: rgba(143, 168, 157, 0.15);
    --color-accent-dark: rgba(25, 45, 20, 0.8);
    --color-gold: #8FA89D;        /* Sage для рамок */

    /* Созвучные оттенки */
    --color-surface: rgba(255, 255, 255, 0.5);    /* Полупрозрачный белый */
    --color-surface-strong: rgba(255, 255, 255, 0.85); /* Более плотный белый */
    --color-surface-card: rgba(255, 255, 255, 0.7); /* Для карточек */
    --color-border: rgba(143, 168, 157, 0.15);     /* Тонкие рамки */
    --color-border-dark: rgba(25, 45, 20, 0.12);   /* Темные рамки */

    /* Базовые цвета */
    --color-white: #FFFFFF;
    --color-white-50: rgba(255, 255, 255, 0.5);
    --color-white-60: rgba(255, 255, 255, 0.6);
    --color-white-70: rgba(255, 255, 255, 0.7);
    --color-white-85: rgba(255, 255, 255, 0.85);
    --color-white-90: rgba(255, 255, 255, 0.9);
    --color-white-95: rgba(255, 255, 255, 0.95);

    /* Акценты с прозрачностью */
    --color-accent-08: rgba(143, 168, 157, 0.08);
    --color-accent-10: rgba(143, 168, 157, 0.1);
    --color-accent-20: rgba(143, 168, 157, 0.2);
    --color-accent-25: rgba(143, 168, 157, 0.25);
    --color-accent-30: rgba(143, 168, 157, 0.3);

    /* Тёмно-зелёный с прозрачностью */
    --color-dark-10: rgba(25, 45, 20, 0.1);
    --color-dark-80: rgba(25, 45, 20, 0.8);

    /* Текст */
    --color-text-primary: #192D14;    /* Основной текст - темно-зеленый */
    --color-text-secondary: #2A4A28;  /* Вторичный текст */
    --color-text-muted: #6B8E7A;      /* Приглушенный текст */
    --color-text: #192D14;            /* Алиас основного текста */

    /* Фоновые оттенки */
    --color-bg-soft: #F0F5F3;         /* Мягкий фоновый */

    /* Карта */
    --map-accent: #73192A;
    --map-bg: rgba(255, 255, 255, 0.5);
    --map-border: rgba(221, 153, 142, 0.3);
    --map-glow: 0 0 30px rgba(221, 153, 142, 0.15);

    /* Размытые фоны (стекломорфизм) */
    --color-glass: rgba(255, 255, 255, 0.6);
    --color-glass-strong: rgba(255, 255, 255, 0.9);

    /* Токены типографики */
    --font-primary: 'Helvetica', Arial, sans-serif;
    --font-headline: 'Helvetica', Arial, sans-serif;
    --font-accent: 'Sacramento', cursive;
}

/* ==========================================================================
   3. УТИЛИТАРНЫЕ ПЕРЕМЕННЫЕ
   ========================================================================== */
:root {
    /* Отступы */
    --spacing-xs: 8px;
    --spacing-sm: 16px;
    --spacing-md: 24px;
    --spacing-lg: 40px;
    --spacing-xl: 60px;
    --spacing-2xl: 80px;

    /* Радиусы скругления */
    --radius-sm: 12px;
    --radius-md: 20px;
    --radius-lg: 28px;
    --radius-xl: 40px;

    /* Тени (минимальные, "воздушные") */
    --shadow-sm: 0 2px 10px rgba(143, 168, 157, 0.08);
    --shadow-md: 0 4px 20px rgba(143, 168, 157, 0.12);
    --shadow-lg: 0 8px 40px rgba(143, 168, 157, 0.15);

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