/**
 * 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: #fff;
	--aw-color-text: #1a1a1a;
	--aw-color-muted: #5c5c5c;
	--aw-color-border: #e2e2e2;
	--aw-color-accent: #1c5d4c;
	--aw-color-accent-text: #fff;
	--aw-color-secondary: #9e4514;
	--aw-color-secondary-text: #fff;
	--aw-color-inverted-bg: #14171a;
	--aw-color-inverted-text: #f4f4f4;
	--aw-color-link: var(--aw-color-accent);

	/* A subtle raised surface, for cards on the page background. */
	--aw-color-surface: #f6f6f4;

	/* Buttons / CTAs: primary and secondary, with their own radius and padding. */
	--aw-button-bg: var(--aw-color-accent);
	--aw-button-text: var(--aw-color-accent-text);
	--aw-button-bg-secondary: var(--aw-color-secondary);
	--aw-button-text-secondary: var(--aw-color-secondary-text);
	--aw-button-radius: var(--aw-radius);
	--aw-button-padding: var(--aw-space-xs) var(--aw-space-md);
	--aw-button-font-weight: 600;
	--aw-button-text-transform: none;
	--aw-button-letter-spacing: 0;

	/* Section rhythm: vertical and horizontal padding of every block. */
	--aw-section-padding-block: clamp(var(--aw-space-md), 6vw, var(--aw-space-lg));
	--aw-section-padding-inline: var(--aw-space-md);

	/* Cards and media. */
	--aw-card-bg: var(--aw-surface-bg);
	--aw-card-border: var(--aw-border-width) solid var(--aw-color-border);
	--aw-card-radius: var(--aw-radius);
	--aw-card-shadow: none;
	--aw-card-padding: var(--aw-space-md);
	--aw-card-gap: var(--aw-space-md);
	--aw-image-radius: var(--aw-radius);

	/* 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;
	--aw-font-weight-heading: 700;
	--aw-font-weight-body: 400;
	--aw-letter-spacing-heading: 0;
	--aw-eyebrow-transform: uppercase;
	--aw-eyebrow-letter-spacing: 0.08em;

	/* 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: 82rem;
	--aw-content-width-narrow: 44rem;
	--aw-content-width-wide: 88rem;
	--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);

	/* On the light tone, cards lift off the page with the surface tint; the
		inverted tone keeps the dark surface (the global --aw-card-bg default). */
	--aw-card-bg: var(--aw-color-surface);
}

.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);
}
