:root {
	/* ==========================================================================
	   Mapped tokens — public API for style.css + feature CSS
	   Consume these. Do not use --brand-* in components.
	   ========================================================================== */

	/* Document */
	--body-font-family: var(--font-body);
	--body-font-weight: var(--font-body-weight);
	--body-font-size: var(--font-body-size);
	--body-line-height: var(--font-body-leading);
	--body-color: var(--color-fg-body);

	/* Headings */
	--heading-font-family: var(--font-display);
	--heading-font-weight: var(--font-h1-weight);
	--heading-letter-spacing: var(--font-h1-tracking);
	--heading-color: var(--color-fg);
	--heading-accent-color: var(--color-fg-heading-accent);

	--heading-h1-font-size: var(--font-h1-size);
	--heading-h1-line-height: var(--font-h1-leading);
	--heading-h5-font-size: var(--font-h5-size);
	--heading-h5-line-height: var(--font-h5-leading);
	--heading-h5-font-weight: var(--font-h5-weight);
	--heading-h5-font-family: var(--font-ui);
	--heading-h5-color: var(--font-h5-color);

	/* Buttons (Avia) */
	--button-font-family: var(--font-button-family);
	--button-font-weight: var(--font-button-weight);
	--button-font-size: var(--font-button-size);
	--button-background: var(--color-button-primary-bg);
	--button-background-hover: var(--color-button-primary-bg-hover);
	--button-color: var(--color-button-primary-fg);
	--button-border-color: var(--color-button-primary-border);
	--button-border-radius: var(--radius);

	/* Nav */
	--nav-font-family: var(--font-nav-family);
	--nav-font-weight: var(--font-nav-weight);
	--nav-color: var(--color-fg);
	--nav-border-color: var(--color-border-accent);
	--nav-active-bg: var(--color-accent);

	/* Surfaces / text / accent */
	--surface-bg: var(--color-bg);
	--surface-bg-muted: var(--color-bg-surface);
	--text: var(--color-fg);
	--text-body: var(--color-fg-body);
	--text-muted: var(--color-fg-muted);
	--text-on-accent: var(--color-fg-on-accent);
	--accent: var(--color-accent);
	--accent-bright: var(--color-accent-bright);
	--accent-deep: var(--color-accent-deep);
	--cta: var(--color-cta);
	--cta-hover: var(--color-cta-hover);
	--info: var(--color-info);
	--navy: var(--color-navy);
	--purple: var(--brand-color-purple);
	--orange: var(--color-cta);
	--green: var(--color-accent);
	--blue: var(--color-info);
	--stroke: var(--color-border);
	--stroke-width: var(--border-width);
	--stroke-left-width: 2px;

	/* Socket / footer accents from live CSS */
	--socket-border-color: var(--color-cta);
	--footer-link-hover-bg: var(--color-bg-surface);
	--testimonial-border-color: var(--color-info);
	--form-success-color: var(--color-navy);

	/* Weights for feature CSS */
	--weight-light: var(--brand-font-weight-light);
	--weight-regular: var(--brand-font-weight-regular);
	--weight-medium: var(--brand-font-weight-medium);
	--weight-semibold: var(--brand-font-weight-semibold);
	--weight-bold: var(--brand-font-weight-bold);
}
