/**
 * Visual tokens for Museologia Virtual Lab.
 *
 * Shared colors, dimensions, typography, and spacing.
 */

:root {
	/* Core colors */
	--mvl-color-black: #000000;
	--mvl-color-white: #ffffff;
	--mvl-color-text: #111111;
	--mvl-color-muted: #5c5c5c;
	--mvl-color-border: #d8d8d8;
	--mvl-color-surface: #f2f2f2;

	/* Accent colors */
	--mvl-color-red: #e31b23;
	--mvl-color-yellow: #f4d03f;
	--mvl-color-blue: #b8d8eb;
	--mvl-color-green: #b9d8c2;

	/* Widths */
	--mvl-content-width: 1440px;
	--mvl-text-width: 780px;
	--mvl-page-padding: clamp(20px, 4vw, 64px);

	/* Typography */
	--mvl-font-primary: Arial, Helvetica, sans-serif;
	--mvl-font-weight-regular: 400;
	--mvl-font-weight-medium: 500;
	--mvl-font-weight-bold: 700;

	/* Type scale */
	--mvl-text-small: 0.875rem;
	--mvl-text-base: 1rem;
	--mvl-text-medium: clamp(1.125rem, 1.5vw, 1.375rem);
	--mvl-heading-small: clamp(1.75rem, 3vw, 3rem);
	--mvl-heading-medium: clamp(2.5rem, 5vw, 5rem);
	--mvl-heading-large: clamp(4rem, 10vw, 9rem);

	/* Spacing */
	--mvl-space-xs: 0.5rem;
	--mvl-space-sm: 1rem;
	--mvl-space-md: 2rem;
	--mvl-space-lg: clamp(3rem, 6vw, 6rem);
	--mvl-space-xl: clamp(5rem, 10vw, 10rem);

	/* Elements */
	--mvl-border-width: 1px;
	--mvl-radius: 0;
	--mvl-transition: 180ms ease;
}