/*
 * Kurznamen der Design-Tokens (Berghotel Presslauer 2026).
 *
 * Die Werte selbst erzeugt WordPress aus theme.json (Website-Editor → Stile):
 *   Palette → --wp--preset--color--{slug}, Schriften → --wp--preset--font-family--{slug},
 *   Größen → --wp--preset--font-size--{slug}, Abstände → --wp--preset--spacing--{slug},
 *   Schatten → --wp--preset--shadow--{slug}, settings.custom → --wp--custom--{gruppe}--{name}.
 * Ändert das Hotel eine Farbe unter „Stile“, ändern sich alle Stellen, die diese Kurznamen nutzen.
 */

/* Kurznamen für das Abschnitts-CSS (bleiben im Block-Theme gleich) */
:root {
	--tanne-950: var(--wp--preset--color--tanne-950);
	--tanne-900: var(--wp--preset--color--tanne-900);
	--tanne-800: var(--wp--preset--color--tanne-800);
	--tanne-700: var(--wp--preset--color--tanne-700);
	--tanne-600: var(--wp--preset--color--tanne-600);
	--tanne-500: var(--wp--preset--color--tanne-500);
	--tanne-400: var(--wp--preset--color--tanne-400);
	--tanne-300: var(--wp--preset--color--tanne-300);
	--tanne-200: var(--wp--preset--color--tanne-200);
	--tanne-100: var(--wp--preset--color--tanne-100);
	--tanne-50: var(--wp--preset--color--tanne-50);
	--sonne-700: var(--wp--preset--color--sonne-700);
	--sonne-600: var(--wp--preset--color--sonne-600);
	--sonne-500: var(--wp--preset--color--sonne-500);
	--sonne-400: var(--wp--preset--color--sonne-400);
	--sonne-300: var(--wp--preset--color--sonne-300);
	--sonne-200: var(--wp--preset--color--sonne-200);
	--sonne-100: var(--wp--preset--color--sonne-100);
	--fels-950: var(--wp--preset--color--fels-950);
	--fels-900: var(--wp--preset--color--fels-900);
	--fels-800: var(--wp--preset--color--fels-800);
	--fels-700: var(--wp--preset--color--fels-700);
	--fels-600: var(--wp--preset--color--fels-600);
	--fels-500: var(--wp--preset--color--fels-500);
	--fels-400: var(--wp--preset--color--fels-400);
	--fels-300: var(--wp--preset--color--fels-300);
	--fels-200: var(--wp--preset--color--fels-200);
	--fels-100: var(--wp--preset--color--fels-100);
	--schnee: var(--wp--preset--color--schnee);
	--leinen: var(--wp--preset--color--leinen);
	--heu: var(--wp--preset--color--heu);
	--weiss: var(--wp--preset--color--weiss);
	--rost-600: var(--wp--preset--color--rost-600);

	--text-strong: var(--fels-950);
	--text-body: var(--fels-800);
	--text-muted: var(--fels-600);
	--text-subtle: var(--fels-500);
	--text-brand: var(--tanne-700);
	--text-accent: var(--sonne-700);
	--border-subtle: var(--fels-200);
	--border-default: var(--fels-300);

	--font-display: var(--wp--preset--font-family--newsreader);
	--font-sans: var(--wp--preset--font-family--hanken-grotesk);
	--fs-display-xl: var(--wp--preset--font-size--display-xl);
	--fs-display-l: var(--wp--preset--font-size--display-l);
	--fs-h1: var(--wp--preset--font-size--h-1);
	--fs-h2: var(--wp--preset--font-size--h-2);
	--fs-h3: var(--wp--preset--font-size--h-3);
	--fs-h4: var(--wp--preset--font-size--h-4);
	--fs-lead: var(--wp--preset--font-size--lead);
	--fs-body: var(--wp--preset--font-size--body);
	--fs-small: var(--wp--preset--font-size--small);
	--fs-caption: var(--wp--preset--font-size--caption);
	--fs-eyebrow: var(--wp--preset--font-size--eyebrow);
	--lh-tight: var(--wp--custom--line-height--tight);
	--lh-heading: var(--wp--custom--line-height--heading);
	--lh-snug: var(--wp--custom--line-height--snug);
	--lh-body: var(--wp--custom--line-height--body);
	--ls-display: var(--wp--custom--letter-spacing--display);
	--ls-heading: var(--wp--custom--letter-spacing--heading);
	--ls-eyebrow: var(--wp--custom--letter-spacing--eyebrow);
	--ls-button: var(--wp--custom--letter-spacing--button);

	--section-y: var(--wp--preset--spacing--section-y);
	--gutter: var(--wp--preset--spacing--gutter);
	--container: var(--wp--custom--layout--container);
	--container-narrow: var(--wp--custom--layout--container-narrow);
	--container-wide: var(--wp--custom--layout--container-wide);
	--header-h: var(--wp--custom--layout--header-h);

	--radius-image: var(--wp--custom--radius--xs);
	--radius-control: var(--wp--custom--radius--sm);
	--radius-card: var(--wp--custom--radius--sm);
	--radius-md: var(--wp--custom--radius--md);
	--radius-pill: var(--wp--custom--radius--pill);
	--shadow-xs: var(--wp--preset--shadow--xs);
	--shadow-sm: var(--wp--preset--shadow--sm);
	--shadow-md: var(--wp--preset--shadow--md);
	--shadow-lg: var(--wp--preset--shadow--lg);
	--shadow-focus: var(--wp--preset--shadow--focus);

	--ease-out: var(--wp--custom--motion--ease-out);
	--ease-in-out: var(--wp--custom--motion--ease-in-out);
	--dur-fast: var(--wp--custom--motion--dur-fast);
	--dur-base: var(--wp--custom--motion--dur-base);
	--dur-slow: var(--wp--custom--motion--dur-slow);
	--dur-image: var(--wp--custom--motion--dur-image);
	--scrim-bottom: var(--wp--custom--scrim--bottom);
	--scrim-top: var(--wp--custom--scrim--top);
	/* Seitenkopf/Hero und Abschlussband (21.10.2026): Grundton oben/unten, Textfeld hinter der Textspalte,
	   Absicherung der kleinen Texte gegen helle Spitzen, Verlauf über dem Beitragsbild im Abschlussband */
	--scrim-kopf-oben: var(--wp--custom--scrim--kopf-oben);
	--scrim-kopf-unten: var(--wp--custom--scrim--kopf-unten);
	--scrim-kopf-text: var(--wp--custom--scrim--kopf-text);
	--text-schatten: var(--wp--custom--scrim--text-schatten);
	--scrim-abschluss: var(--wp--custom--scrim--abschluss);
	--blur-header: var(--wp--custom--blur--header);
}