/**
 * Кутюр Парфюм — дизайн-токены.
 *
 * Единственный источник правды по цвету, типографике, ритму и глубине.
 * Ни один компонент не должен объявлять «сырые» hex-цвета или px-размеры шрифта.
 */

:root {
	/* ------------------------------------------------------------------
	   Палитра (из дизайн-системы прототипов)
	   ------------------------------------------------------------------ */
	--parchment: #ECEEF0;
	--parchment-deep: #E1E4E8;
	--ink: #2B333C;
	--charcoal: #333B44;
	--amber: #A6672D;
	--clay: #C98B72;
	--wine: #8C3E2F;
	--gold: #D9A441;
	--line: rgba(43, 51, 60, 0.14);
	--line-strong: rgba(43, 51, 60, 0.30);

	/* Производные оттенки — рассчитаны от базовой палитры, не изобретены заново */
	--paper: #F5F6F7;
	--paper-pure: #FFFFFF;
	--ink-70: rgba(43, 51, 60, 0.70);
	--ink-55: rgba(43, 51, 60, 0.55);
	--ink-40: rgba(43, 51, 60, 0.40);
	--ink-12: rgba(43, 51, 60, 0.12);
	--ink-06: rgba(43, 51, 60, 0.06);
	--amber-soft: rgba(166, 103, 45, 0.10);
	--amber-line: rgba(166, 103, 45, 0.32);
	--clay-soft: rgba(201, 139, 114, 0.16);
	--wine-soft: rgba(140, 62, 47, 0.10);
	--gold-soft: rgba(217, 164, 65, 0.18);

	/* Семантические роли */
	--bg: var(--parchment);
	--bg-raised: var(--paper);
	--bg-card: var(--paper-pure);
	--bg-inverse: var(--ink);
	--text: var(--ink);
	--text-muted: var(--ink-55);
	--text-inverse: var(--parchment);
	--accent: var(--amber);
	--accent-strong: var(--wine);
	--border: var(--line);
	--border-strong: var(--line-strong);

	--success: #3E7A52;
	--success-soft: rgba(62, 122, 82, 0.12);
	--danger: var(--wine);
	--danger-soft: var(--wine-soft);
	--warning: var(--gold);
	--warning-soft: var(--gold-soft);

	/* ------------------------------------------------------------------
	   Типографика
	   ------------------------------------------------------------------ */
	--font-display: 'Fraunces', 'Playfair Display', Georgia, 'Times New Roman', serif;
	--font-body: 'Work Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
	--font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, 'SF Mono', Consolas, 'Liberation Mono', monospace;

	/* Шкала: modular scale 1.2, значения текучие через clamp() */
	--fs-3xs: 0.625rem;   /* 10px — мелкие метки */
	--fs-2xs: 0.6875rem;  /* 11px — трекинговые лейблы */
	--fs-xs: 0.75rem;     /* 12px */
	--fs-sm: 0.8125rem;   /* 13px */
	--fs-base: 0.9375rem; /* 15px — базовый интерфейсный */
	--fs-md: 1rem;        /* 16px */
	--fs-lg: 1.125rem;    /* 18px */
	--fs-xl: clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem);
	--fs-2xl: clamp(1.5rem, 1.25rem + 1.1vw, 2rem);
	--fs-3xl: clamp(1.875rem, 1.4rem + 2vw, 2.75rem);
	--fs-4xl: clamp(2.25rem, 1.5rem + 3.2vw, 4rem);
	--fs-5xl: clamp(2.75rem, 1.6rem + 5vw, 5.5rem);

	--lh-tight: 1.08;
	--lh-snug: 1.24;
	--lh-normal: 1.5;
	--lh-relaxed: 1.68;

	--ls-tight: -0.02em;
	--ls-normal: 0;
	--ls-wide: 0.04em;
	--ls-wider: 0.12em;
	--ls-widest: 0.2em;

	/* ------------------------------------------------------------------
	   Ритм и раскладка
	   ------------------------------------------------------------------ */
	--space-1: 0.25rem;
	--space-2: 0.5rem;
	--space-3: 0.75rem;
	--space-4: 1rem;
	--space-5: 1.25rem;
	--space-6: 1.5rem;
	--space-8: 2rem;
	--space-10: 2.5rem;
	--space-12: 3rem;
	--space-16: 4rem;
	--space-20: 5rem;
	--space-24: 6rem;
	--space-32: 8rem;

	/* Вертикальные отступы секций — текучие */
	--section-y: clamp(3.5rem, 2rem + 6vw, 7rem);
	--section-y-sm: clamp(2.5rem, 1.5rem + 4vw, 4.5rem);

	--container: 1440px;
	--container-narrow: 980px;
	--container-text: 720px;
	--gutter: clamp(1rem, 0.5rem + 2.4vw, 3rem);

	--header-h: 4.5rem;
	--header-h-scrolled: 3.75rem;
	--topbar-h: 2.25rem;

	/* ------------------------------------------------------------------
	   Форма и глубина
	   ------------------------------------------------------------------ */
	--radius-xs: 2px;
	--radius-sm: 3px;
	--radius-md: 4px;
	--radius-lg: 6px;
	--radius-pill: 999px;

	--shadow-xs: 0 1px 2px rgba(43, 51, 60, 0.05);
	--shadow-sm: 0 2px 8px rgba(43, 51, 60, 0.06);
	--shadow-md: 0 8px 24px rgba(43, 51, 60, 0.08);
	--shadow-lg: 0 18px 48px rgba(43, 51, 60, 0.12);
	--shadow-xl: 0 28px 72px rgba(43, 51, 60, 0.16);

	/* ------------------------------------------------------------------
	   Движение
	   ------------------------------------------------------------------ */
	--ease-out: cubic-bezier(0.22, 1, 0.36, 1);
	--ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
	--dur-fast: 140ms;
	--dur: 240ms;
	--dur-slow: 420ms;
	--dur-drawer: 340ms;

	/* ------------------------------------------------------------------
	   Слои
	   ------------------------------------------------------------------ */
	--z-base: 1;
	--z-sticky: 100;
	--z-header: 200;
	--z-megamenu: 250;
	--z-overlay: 300;
	--z-drawer: 350;
	--z-modal: 400;
	--z-toast: 500;

	/* Сетка каталога */
	--grid-cols: 4;
	--grid-gap-x: clamp(0.75rem, 0.4rem + 1.2vw, 1.75rem);
	--grid-gap-y: clamp(2rem, 1.2rem + 2.4vw, 3.5rem);
}

@media (max-width: 1200px) {
	:root {
		--grid-cols: 3;
	}
}

@media (max-width: 900px) {
	:root {
		--header-h: 3.75rem;
		--grid-cols: 2;
	}
}

@media (max-width: 560px) {
	:root {
		--grid-gap-y: 1.75rem;
	}
}

/* Пользователь просил меньше движения — уважаем системную настройку. */
@media (prefers-reduced-motion: reduce) {
	:root {
		--dur-fast: 1ms;
		--dur: 1ms;
		--dur-slow: 1ms;
		--dur-drawer: 1ms;
	}
}