/**
 * Design tokens — Light Luxury (светлый фон + золото).
 * Каждый hex/rgb задаётся один раз; семантика только через var().
 */
:root {
    /* Базовая палитра */
    --color-ivory: #faf8f5;
    --color-cream: #f5f0e8;
    --color-white: #ffffff;
    --color-gold: #c9a050;
    --color-gold-shine: #e8c97a;
    --color-gold-light: #dbb96a;
    --color-gold-dark: #a8832e;
    --color-gold-pale: #f5ede0;
    --color-gold-pale-warm: #e8dcc8;
    --color-charcoal: #2a2a2a;
    --color-gray-700: #5c5c5c;
    --color-gray-400: #9a9a9a;
    --color-gray-200: #e8e4de;

    /* Прозрачные слои */
    --color-gold-08: rgb(201 160 80 / 0.08);
    --color-gold-15: rgb(201 160 80 / 0.15);
    --color-gold-25: rgb(201 160 80 / 0.25);
    --color-gold-40: rgb(201 160 80 / 0.4);
    --color-black-05: rgb(0 0 0 / 0.05);
    --color-black-08: rgb(0 0 0 / 0.08);

    /* Семантика */
    --color-bg: var(--color-ivory);
    --color-bg-warm: var(--color-cream);
    --color-surface: var(--color-white);
    --color-surface-muted: var(--color-cream);
    --color-text: var(--color-charcoal);
    --color-text-muted: var(--color-gray-700);
    --color-text-light: var(--color-gray-400);
    --color-brand: var(--color-gold);
    --color-brand-light: var(--color-gold-light);
    --color-brand-dark: var(--color-gold-dark);
    --color-accent: var(--color-gold);
    --color-accent-dark: var(--color-gold-dark);
    --color-border: var(--color-gray-200);
    --color-border-accent: var(--color-gold-40);
    --color-navbar-bg: var(--color-white);
    --color-footer-bg: var(--color-cream);
    --color-on-brand: var(--color-white);
    --color-on-dark: var(--color-charcoal);

    /* Типографика */
    --font-family-heading: 'Montserrat', sans-serif;
    --font-family-base: 'Roboto', sans-serif;

    --font-size-base: 1.0625rem;   /* 17px */
    --font-size-sm: 0.9375rem;     /* 15px */
    --font-size-xs: 0.8125rem;     /* 13px */
    --font-size-lg: 1.1875rem;    /* 19px */
    --font-size-xl: 1.375rem;      /* 22px */
    --font-size-2xl: 1.75rem;      /* 28px */
    --font-size-3xl: 2.125rem;     /* 34px */
    --line-height-base: 1.6;
    --line-height-tight: 1.35;

    /* Размеры элементов UI */
    --input-height: 3rem;
    --input-height-sm: 2.625rem;
    --btn-height: 2.875rem;
    --btn-height-sm: 2.5rem;
    --btn-padding-x: 1.375rem;
    --btn-font-size: 0.9375rem;

    /* Ширина layout */
    --header-max-width: 1680px;
    --container-max-width: 1400px;
    --container-max-width-lg: 1400px;
    --container-max-width-md: 960px;
    --container-padding-x: 1.5rem;
    --header-padding-x: 2rem;

    /* Форма и тени */
    --radius-sm: 4px;
    --radius-md: 6px;
    --shadow-sm: 0 1px 4px var(--color-black-05);
    --shadow-md: 0 4px 16px var(--color-black-08);
    --shadow-gold: 0 4px 20px var(--color-gold-15);
    --shadow-glow: 0 0 30px rgb(201 160 80 / 0.3);
    --shadow-glow-strong: 0 0 50px rgb(201 160 80 / 0.4);
    --transition-base: 0.25s ease;

    /* Градиенты (на базе палитры) */
    --gradient-gold: linear-gradient(
        135deg,
        var(--color-gold) 0%,
        var(--color-gold-shine) 40%,
        var(--color-gold-light) 70%,
        var(--color-gold-dark) 100%
    );
    --gradient-gold-soft: linear-gradient(
        135deg,
        var(--color-gold-pale) 0%,
        var(--color-gold-pale-warm) 100%
    );

    /* Пагинация */
    --pagination-bg: var(--color-surface);
    --pagination-border: var(--color-border);
    --pagination-border-hover: var(--color-gold-light);
    --pagination-color: var(--color-text);
    --pagination-color-hover: var(--color-charcoal);
    --pagination-color-muted: var(--color-gray-400);
    --pagination-active-bg: var(--color-brand);
    --pagination-active-color: var(--color-on-brand);
    --pagination-focus-ring: var(--color-gold-25);
    --pagination-radius: var(--radius-md);
}
