/*
 * MediaVymir — токени оформлення.
 * Єдине місце, де живуть кольори, шрифти, радіуси й відступи власного шару теми.
 * Напрямок: Ink & Paper (паперове тло, теракотовий акцент, лінії замість тіней).
 * Патерни: hero H5, картки C1 / C4 / C2 / C3, заголовки секцій S3, бейджі B2.
 */

:root {
	/* Гарнітури */
	--mvym-font-display: "Literata", Georgia, "Times New Roman", serif;
	--mvym-font-body: "Inter", "Roboto", -apple-system, "Segoe UI", sans-serif;

	/* Акцент */
	--mvym-accent: #b8400f;
	--mvym-accent-hover: #8f2f0a;
	--mvym-accent-soft: #fbeee6;
	--mvym-accent-light: #e87a3e; /* акцент для темних поверхонь: шапка, оверлеї */

	/* Чорнило */
	--mvym-ink: #141210;
	--mvym-ink-muted: #5a534c;
	--mvym-ink-faint: #8c847b;
	--mvym-ink-invert: #fffdf9;

	/* Поверхні */
	--mvym-bg: #fffdf9;
	--mvym-surface: #ffffff;
	--mvym-surface-alt: #f7f2ea;
	--mvym-surface-deep: #26221e;
	--mvym-line: #e6ddd0;
	--mvym-line-strong: #cfc2ae;

	/* Напівпрозорі шари (для оверлеїв і станів) */
	--mvym-overlay-top: rgba(20, 18, 16, 0);
	--mvym-overlay-mid: rgba(20, 18, 16, 0.5);
	--mvym-overlay-bottom: rgba(20, 18, 16, 0.92);
	--mvym-veil: rgba(20, 18, 16, 0.06);
	--mvym-veil-light: rgba(255, 253, 249, 0.14);

	/* Радіуси */
	--mvym-r-sm: 4px;
	--mvym-r-md: 6px;
	--mvym-r-lg: 10px;
	--mvym-r-pill: 999px;

	/* Тіні — у цьому напрямку майже не використовуються */
	--mvym-shadow-sm: 0 1px 2px rgba(20, 18, 16, 0.05);
	--mvym-shadow-md: 0 6px 20px rgba(20, 18, 16, 0.09);

	/* Сітка */
	--mvym-space: 8px;
	--mvym-container: 1300px;
	--mvym-gutter: 5.5556%;

	/* Типографіка */
	--mvym-fs-hero: clamp(26px, 2.6vw, 38px);
	--mvym-fs-card: 19px;
	--mvym-fs-card-sm: 17px;
	--mvym-fs-meta: 12.5px;
	--mvym-fs-kicker: 11.5px;
	--mvym-track-caps: 0.08em;
}