/*
 * «Відомі» — токени напрямку «Портретна галерея».
 *
 * Два блоки:
 *   1) власні змінні --vdmi-* — те, чого в Osnova немає (бронза, розміри слотів);
 *   2) перевизначення --osn-* — цим уся батьківська тема стає галереєю,
 *      бо в її скіні немає жодного захардкодженого кольору.
 *
 * Скін Osnova не знімається: боротися з ним не доводиться.
 *
 * Патерни цього сайту (наступний має взяти інші):
 *   H7 «Іменна дошка» · S7 «Експлікація» · B7 «Гравіювання»
 *   C24 «Іменна картка» · C25 «Досьє» · C26 «Паспарту» · стрічка `vitryna`
 */

:root {
	/* ---- Власне ---- */

	/*
	 * Бронза. Два відтінки з різними обов'язками:
	 *   --vdmi-bronze      текст — роки, лічильники, надзаголовки. 4.71:1 на тлі.
	 *   --vdmi-bronze-line лінії й рамки. Світліша, і це дозволено: декору
	 *                      достатньо 3:1, а текстом вона не буває ніде.
	 * Початковий #9a6a2c давав 4.16:1 і для дрібного тексту не годився.
	 */
	--vdmi-bronze: #8f6224;
	--vdmi-bronze-line: #b08544;
	--vdmi-bronze-soft: #f0e7d8;

	/* Слоти. Ті самі числа продубльовані константами в functions.php —
	   атрибут `sizes` мусить знати ширину слота, а CSS із PHP не читається. */
	--vdmi-portrait: 280px;
	--vdmi-namecard: 282px;
	--vdmi-mat-pad: 20px;

	/* Кроки й лінії, якими користуються наші блоки */
	--vdmi-hair: 1px;
	--vdmi-rule: 2px;
	--vdmi-block-gap: 64px;

	/* ---- Перевизначення Osnova ---- */

	/* Гарнітури. Playfair Display — імена й заголовки, курсивом ще й бейдж
	   рубрики. IBM Plex Sans — текст, мета, підписи. Кирилиця обох перевірена
	   fontTools до вибору напрямку. */
	--osn-font-display: "Playfair Display", "Times New Roman", Georgia, serif;
	--osn-font-body: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

	/* Акцент — глибокий петроль. 6.99:1 на тлі стіни. */
	--osn-accent: #125a63;
	--osn-accent-hover: #0d444b;
	--osn-accent-soft: #e2eeef;
	--osn-accent-contrast: #fffdfa;

	/* Чорнило */
	--osn-ink: #1c1a17;
	--osn-ink-muted: #5c564d;
	--osn-ink-faint: #746d61;
	--osn-ink-invert: #fffdfa;

	/* Поверхні: тепла штукатурка стіни, папір етикетки, глухий тон під смугами */
	--osn-bg: #f5f1ea;
	--osn-surface: #fffdfa;
	--osn-surface-alt: #ece6dc;
	--osn-line: #ddd5c8;
	--osn-line-strong: #c3b8a6;

	/* Кути гострі: музейна табличка не буває заокругленою.
	   Капсула лишається — вона потрібна фокусним кільцям і пагінації. */
	--osn-r-sm: 0;
	--osn-r-md: 2px;
	--osn-r-lg: 4px;
	--osn-r-pill: 999px;

	/*
	 * Тіней немає. Глибину дають паспарту й волосяні лінії, а не розмиття:
	 * на теплому тлі сіра тінь одразу читається як бруд.
	 * Токени лишаються оголошеними — каркас Osnova на них посилається.
	 */
	--osn-shadow-sm: none;
	--osn-shadow-md: none;

	/* Сітка */
	--osn-space: 8px;
	--osn-container: 1200px;
	--osn-gutter: 24px;
	--osn-gap: 56px;
	--osn-sidebar: 316px;
	--osn-prose: 66ch;
	--osn-logo-height: 52px;

	/* Типографіка */
	--osn-fs-body: 17px;
	--osn-fs-small: 15px;
	--osn-fs-meta: 13px;
	--osn-fs-kicker: 12px;
	--osn-lh-body: 1.7;
	--osn-track-caps: .12em;
}

@media (max-width: 768px) {
	:root {
		--osn-gap: 40px;
		--vdmi-block-gap: 44px;
	}
}

@media (max-width: 540px) {
	:root {
		--osn-fs-body: 16px;
		--osn-gutter: 18px;
		--osn-gap: 32px;
		--vdmi-block-gap: 36px;
		--vdmi-mat-pad: 12px;
	}
}
