/*
 * Design tokens. Colours, fonts, spacing and sizes used by every other
 * stylesheet; nothing else defines raw values.
 *
 * Palette read from the mockups (docs/sections/home/*.png), 2026-10-26.
 * Contrast checked (WCAG): text on bg 7.44, white on primary 5.81,
 * white on primary-hover 7.64, primary on bg 5.63.
 */

:root
{
	/* Colours */
	--hf-color-bg: #fefbf7;
	--hf-color-band: #faf1ea;
	/* Quieter, neutral band behind the testimonials (docs/preview/new_home7_2.png). */
	--hf-color-band-soft: #fbf8f3;
	/* Deeper warm band behind the contact section (preview, #f1e9e1). */
	--hf-color-band-strong: #f1e9e1;
	/* Deepest band, „Nie wiesz, który wyjazd wybrać?” on Wydarzenia
	   (docs/preview/wydarzenia_v4.png); text on it 5.82, headings 15.02. */
	--hf-color-band-deep: #ebded4;
	--hf-color-surface: #fffdfa;
	--hf-color-text: #5b5150;
	--hf-color-heading: #110805;
	--hf-color-eyebrow: #5d2d1b;
	--hf-color-icon: #592613;
	--hf-color-primary: #845c4b;
	--hf-color-primary-hover: #6f4b3c;
	--hf-color-outline: #906a5b;
	--hf-color-line: #816254;
	--hf-color-card-border: #f0e8df;
	/* Form field outline: 3.2:1 on white (WCAG 1.4.11 needs 3:1; the
	   preview's #ececed has 1.2:1). */
	--hf-color-field-border: #a08c81;
	--hf-color-error: #a2271c;
	--hf-color-on-dark: #fff;
	--hf-color-focus: var(--hf-color-primary);

	/* Fonts (decision 9, 2026-10-26). Libre Baskerville is self-hosted
	   (site-fonts.css); Georgia is a system font. */
	--hf-font-display: "Libre Baskerville", Baskerville, "Baskerville Old Face", Georgia, serif;
	--hf-font-text: Georgia, "Times New Roman", serif;

	/* Type scale */
	--hf-text-s: 0.9375rem;
	--hf-text-m: 1.125rem;
	--hf-text-l: clamp(1.125rem, 1rem + 0.55vw, 1.5rem);
	/* Large description under a page heading; about 29 px at 1440 px, as in
	   docs/preview/wydarzenia_v4.png (measured 2026-10-27). */
	--hf-text-xl: clamp(1.25rem, 1rem + 0.9vw, 1.875rem);
	--hf-text-display: clamp(2.375rem, 1.6rem + 3.2vw, 4.5rem);
	/* Section headings (H2); about 60 px at 1440 px, as in the mockups. */
	--hf-text-h2: clamp(2.125rem, 1.5rem + 2.4vw, 3.875rem);
	/* Smaller H2 of the sections from docs/preview/new_home7_2.png (with a
	   rule under the heading); about 37 px at 1440 px. */
	--hf-text-h2-s: clamp(1.75rem, 1.25rem + 1.2vw, 2.375rem);
	/* H2 under a subpage heading (docs/preview/wydarzenia_v4.png, e.g.
	   „Najbliższe spotkania”): about 45 px at 1440 px, between the page
	   heading and the event titles (measured 2026-10-27). */
	--hf-text-h2-m: clamp(2rem, 1.4rem + 1.6vw, 2.875rem);
	/* Title of a small card (Home events, „Zapisz te daty”); about 27 px at
	   1440 px. */
	--hf-text-card-title: clamp(1.375rem, 1.2rem + 0.55vw, 1.875rem);
	/* Title of a large card with the photo on top (Inspiracje list): about
	   32 px at 1440 px. In docs/preview/inspiracje.png it is 0.74 of the
	   featured title above the list (--hf-text-h2-m), measured 2026-10-29. */
	--hf-text-card-title-l: clamp(1.5rem, 1.2rem + 0.9vw, 2.125rem);
	/* Page heading (H1) of a subpage, e.g. Wydarzenia: the size of the
	   section headings. At 1440 px the Wydarzenia heading is 1025 px wide,
	   about 1009 px in docs/preview/wydarzenia_v4.png (measured 2026-10-27). */
	--hf-text-page-title: var(--hf-text-h2);
	--hf-text-eyebrow: clamp(0.75rem, 0.7rem + 0.2vw, 0.9375rem);
	--hf-tracking-eyebrow: 0.3em;
	--hf-leading-tight: 1.12;
	--hf-leading-text: 1.6;

	/* Spacing */
	--hf-space-2xs: 0.25rem;
	--hf-space-xs: 0.5rem;
	--hf-space-s: 1rem;
	--hf-space-m: 1.5rem;
	--hf-space-l: 2.5rem;
	--hf-space-xl: 4rem;
	--hf-space-section: clamp(4rem, 3rem + 4vw, 7.5rem);
	/* Top and bottom padding of a content section: two neighbours together
	   leave about 120 px at 1440 px (user, 2026-10-26: less space). */
	--hf-space-section-block: clamp(2rem, 1rem + 3vw, 4rem);

	/* Layout */
	--hf-container-max: 90rem;
	--hf-gutter: clamp(1rem, 5.5vw, 6rem);
	/* Widest column of post text: about 72 characters a line at 22 px
	   (user's decision 2026-10-29; was 58rem, about 92 characters). */
	--hf-text-measure: 45rem;
	--hf-radius-s: 3px;
	--hf-radius-m: 8px;

	/* Buttons */
	--hf-button-height: 3.25rem;
	--hf-button-padding: 0.85em 1.6em;
	--hf-button-text: clamp(1rem, 0.92rem + 0.3vw, 1.25rem);
	/* Labels, selects and links next to a button (e.g. the Wydarzenia
	   filters): the size of the button label, so a row of controls matches. */
	--hf-text-control: var(--hf-button-text);
	--hf-button-border: 1px;

	/* Motion */
	--hf-transition: 150ms ease;
}