:root {
	/* ==========================================================================
	   Alias tokens — semantic bridge (internal). Prefer mapped.css in components.
	   ========================================================================== */

	/* Surfaces */
	--color-bg: var(--brand-color-white);
	--color-bg-surface: var(--brand-color-surface);
	--color-bg-inverse: var(--brand-color-green);
	--color-bg-accent: var(--brand-color-orange);

	/* Text */
	--color-fg: var(--brand-color-ink);
	--color-fg-body: var(--brand-color-body);
	--color-fg-muted: var(--brand-color-muted);
	--color-fg-meta: var(--brand-color-meta);
	--color-fg-on-accent: var(--brand-color-white);
	--color-fg-on-green: var(--brand-color-white);
	--color-fg-heading-accent: var(--brand-color-green);
	--color-fg-link-hover: var(--brand-color-orange);

	/* Accent */
	--color-accent: var(--brand-color-green);
	--color-accent-bright: var(--brand-color-green-bright);
	--color-accent-deep: var(--brand-color-green-deep);
	--color-cta: var(--brand-color-orange);
	--color-cta-hover: var(--brand-color-orange-hover);
	--color-info: var(--brand-color-blue);
	--color-navy: var(--brand-color-navy);

	/* Borders */
	--color-border: var(--brand-color-border);
	--color-border-subtle: var(--brand-color-subtle);
	--color-border-accent: var(--brand-color-green-bright);
	--color-border-cta: var(--brand-color-orange-hover);
	--color-border-info: var(--brand-color-blue);

	/* Buttons */
	--color-button-primary-bg: var(--brand-color-orange);
	--color-button-primary-bg-hover: var(--brand-color-orange-hover);
	--color-button-primary-fg: var(--brand-color-white);
	--color-button-primary-border: var(--brand-color-orange-hover);

	/* Type families */
	--font-display: var(--brand-font-display);
	--font-body: var(--brand-font-body);
	--font-ui: var(--brand-font-ui);
	--font-serif-alt: var(--brand-font-cormorant);

	/* Type roles */
	--font-h1-size: var(--brand-font-size-h1);
	--font-h1-leading: var(--brand-line-height-h1);
	--font-h1-tracking: var(--brand-letter-spacing-display);
	--font-h1-weight: var(--brand-font-weight-regular);

	--font-h5-size: var(--brand-font-size-h5);
	--font-h5-leading: var(--brand-line-height-h5);
	--font-h5-weight: var(--brand-font-weight-semibold);
	--font-h5-color: var(--brand-color-green);

	--font-body-size: var(--brand-font-size-body);
	--font-body-leading: var(--brand-line-height-body);
	--font-body-weight: var(--brand-font-weight-regular);

	--font-button-family: var(--brand-font-ui);
	--font-button-size: var(--brand-font-size-button);
	--font-button-weight: var(--brand-font-weight-regular);

	--font-nav-family: var(--brand-font-ui);
	--font-nav-weight: var(--brand-font-weight-regular);

	/* Space */
	--space-3xs: var(--brand-space-4);
	--space-2xs: var(--brand-space-8);
	--space-xs: var(--brand-space-12);
	--space-sm: var(--brand-space-16);
	--space-md: var(--brand-space-20);
	--space-lg: var(--brand-space-24);
	--space-xl: var(--brand-space-40);
	--space-2xl: var(--brand-space-64);

	/* Chrome */
	--radius: var(--brand-radius-button);
	--radius-cta: var(--brand-radius-cta);
	--border-width: var(--brand-border-width);
	--layout-max: var(--brand-layout-max);
}
