/* Design tokens — ported 1:1 from the block theme's theme.json.
   Single source of truth: change a value here, it updates everywhere. */

@font-face {
	font-family: 'Montserrat';
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
	src: url( '../fonts/montserrat-latin.woff2' ) format( 'woff2' );
}

:root {
	/* Color */
	--color-surface-0: #fafaf9;
	--color-surface-1: #f2f1ee;
	--color-surface-2: #ffffff;
	--color-text-primary: #37474f;
	--color-text-secondary: #5f5f5f;
	--color-accent: #1f6b4f;
	--color-accent-dark: #155741;
	--color-accent-teal: #63b290;
	--color-accent-light: #7fbf80;
	--color-accent-lime: #abc86d;
	--color-accent-bg: #eef7f3;
	--color-whatsapp: #7fbf80;

	/* Typography */
	--font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
	--font-size-small: 0.875rem;
	--font-size-medium: 1rem;
	--font-size-large: 1.25rem;
	--font-size-x-large: clamp( 1.5rem, 1.35rem + 0.75vw, 1.75rem );
	--font-size-xx-large: clamp( 2rem, 1.7rem + 1.5vw, 2.5rem );
	--line-height-body: 1.6;
	--line-height-heading: 1.25;

	/* Spacing scale */
	--space-tight: 0.5rem;
	--space-related: 0.75rem;
	--space-card: 1rem;
	--space-stack: 1.5rem;
	--space-bar: 1.5rem;
	--space-section: 3rem;
	--space-gutter: 1.5rem;

	/* Layout */
	--content-size: 720px;
	--wide-size: 1200px;

	/* Shape */
	--radius: 16px;
	--radius-pill: 9999px;
	--shadow-soft: 0 1px 2px rgba( 0, 0, 0, 0.05 ), 0 0 24px rgba( 0, 0, 0, 0.08 );
}

@media ( max-width: 599px ) {
	:root {
		--space-gutter: 1.25rem;
	}
}

@media ( min-width: 1200px ) {
	:root {
		--space-gutter: 2rem;
	}
}