/**
 * aw-blocks design tokens (defaults).
 *
 * Blocks read styling only from these custom properties. Each client theme
 * overrides the values in its own tokens.css; the surface (the names below)
 * stays fixed so blocks stay consistent across sites. Do not add hard-coded
 * colours, spacing, or type sizes to block CSS. Add a token here instead.
 *
 * Tone treatments map to three sets of surface and text colours:
 *   default  page background, body text
 *   inverted dark background, light text
 *   accent   brand background, contrast text
 */

:root {
	/* Palette */
	--aw-color-bg: #ffffff;
	--aw-color-text: #1a1a1a;
	--aw-color-muted: #5c5c5c;
	--aw-color-border: #e2e2e2;
	--aw-color-accent: #1c5d4c;
	--aw-color-accent-text: #ffffff;
	--aw-color-inverted-bg: #14171a;
	--aw-color-inverted-text: #f4f4f4;
	--aw-color-link: var(--aw-color-accent);

	/* Spacing scale */
	--aw-space-xs: 0.5rem;
	--aw-space-sm: 1rem;
	--aw-space-md: 2rem;
	--aw-space-lg: 4rem;
	--aw-space-xl: 6rem;

	/* Typography */
	--aw-font-body: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--aw-font-heading: var(--aw-font-body);
	--aw-font-size-base: 1rem;
	--aw-font-size-lead: 1.25rem;
	--aw-font-size-h2: clamp(1.75rem, 4vw, 2.5rem);
	--aw-font-size-h3: clamp(1.35rem, 3vw, 1.75rem);
	--aw-font-size-eyebrow: 0.875rem;
	--aw-line-height: 1.6;

	/* Shape */
	--aw-radius: 0.5rem;
	--aw-radius-lg: 1rem;
	--aw-border-width: 1px;
	--aw-shadow-card: 0 1px 3px rgba(0, 0, 0, 0.08), 0 8px 24px rgba(0, 0, 0, 0.06);

	/* Layout */
	--aw-content-width: 72rem;
	--aw-content-width-narrow: 44rem;
	--aw-content-width-wide: 84rem;
	--aw-focus-ring: 3px solid var(--aw-color-accent);
}

/* Tone surfaces: blocks read background and text from these tokens. */
.aw-tone-default {
	--aw-surface-bg: var(--aw-color-bg);
	--aw-surface-text: var(--aw-color-text);
	--aw-surface-muted: var(--aw-color-muted);
}

.aw-tone-inverted {
	--aw-surface-bg: var(--aw-color-inverted-bg);
	--aw-surface-text: var(--aw-color-inverted-text);
	--aw-surface-muted: var(--aw-color-inverted-text);
}

.aw-tone-accent {
	--aw-surface-bg: var(--aw-color-accent);
	--aw-surface-text: var(--aw-color-accent-text);
	--aw-surface-muted: var(--aw-color-accent-text);
}
