/*
 * Kangaroo — Design Tokens
 * Source of truth: Design/warm_horizon/DESIGN.md ("Warm Horizon" system)
 * Prefix: --kg-
 * Brand colors (primary / primary-container / secondary / tertiary) can be
 * overridden at runtime via the Customizer (see inc/customizer.php ->
 * kangaroo_customizer_inline_css()).
 */

:root {
	/* Color — surfaces */
	--kg-surface: #fff8f5;
	--kg-surface-dim: #e3d8d2;
	--kg-surface-bright: #fff8f5;
	--kg-surface-container-lowest: #ffffff;
	--kg-surface-container-low: #fdf1eb;
	--kg-surface-container: #f7ece5;
	--kg-surface-container-high: #f1e6e0;
	--kg-surface-container-highest: #ece0da;
	--kg-surface-variant: #ece0da;
	--kg-surface-warm: #fbf9f8;

	/* Color — on-surface */
	--kg-on-surface: #201b17;
	--kg-on-surface-variant: #51443b;
	--kg-inverse-surface: #352f2b;
	--kg-inverse-on-surface: #faeee8;
	--kg-outline: #84746a;
	--kg-outline-variant: #d6c3b7;

	/* Color — primary (Warm Sand) */
	--kg-surface-tint: #845329;
	--kg-primary: #845329;
	--kg-on-primary: #ffffff;
	--kg-primary-container: #d49868;
	--kg-on-primary-container: #593008;
	--kg-inverse-primary: #fab986;
	--kg-primary-fixed: #ffdcc3;
	--kg-primary-fixed-dim: #fab986;
	--kg-on-primary-fixed: #2f1500;
	--kg-on-primary-fixed-variant: #683c14;

	/* Color — secondary (Deep Navy) */
	--kg-secondary: #475f86;
	--kg-on-secondary: #ffffff;
	--kg-secondary-container: #b8d0fd;
	--kg-on-secondary-container: #41587f;
	--kg-secondary-fixed: #d6e3ff;
	--kg-secondary-fixed-dim: #afc7f4;
	--kg-on-secondary-fixed: #001b3d;
	--kg-on-secondary-fixed-variant: #2f476d;

	/* Color — tertiary (Trust marks) */
	--kg-tertiary: #286678;
	--kg-on-tertiary: #ffffff;
	--kg-tertiary-container: #73adc1;
	--kg-on-tertiary-container: #00404f;
	--kg-tertiary-fixed: #b4ebff;
	--kg-tertiary-fixed-dim: #95cfe4;
	--kg-on-tertiary-fixed: #001f28;
	--kg-on-tertiary-fixed-variant: #004e5f;

	/* Color — error */
	--kg-error: #ba1a1a;
	--kg-on-error: #ffffff;
	--kg-error-container: #ffdad6;
	--kg-on-error-container: #93000a;

	/* Color — background */
	--kg-background: #fff8f5;
	--kg-on-background: #201b17;

	/* Color — named accents */
	--kg-trust-teal: #00696d;
	--kg-whatsapp-green: #25d366;

	/* Typography — families */
	--kg-font-display: 'Montserrat', -apple-system, BlinkMacSystemFont, sans-serif;
	--kg-font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

	/* Typography — display-lg */
	--kg-display-lg-size: 48px;
	--kg-display-lg-weight: 700;
	--kg-display-lg-line: 1.2;
	--kg-display-lg-tracking: -0.02em;

	/* Typography — display-lg-mobile */
	--kg-display-lg-mobile-size: 32px;
	--kg-display-lg-mobile-weight: 700;
	--kg-display-lg-mobile-line: 1.2;

	/* Typography — headline-md */
	--kg-headline-md-size: 24px;
	--kg-headline-md-weight: 600;
	--kg-headline-md-line: 1.3;

	/* Typography — headline-sm */
	--kg-headline-sm-size: 20px;
	--kg-headline-sm-weight: 600;
	--kg-headline-sm-line: 1.4;

	/* Typography — body-lg */
	--kg-body-lg-size: 18px;
	--kg-body-lg-weight: 400;
	--kg-body-lg-line: 1.6;

	/* Typography — body-md */
	--kg-body-md-size: 16px;
	--kg-body-md-weight: 400;
	--kg-body-md-line: 1.5;

	/* Typography — label-bold */
	--kg-label-bold-size: 14px;
	--kg-label-bold-weight: 600;
	--kg-label-bold-line: 1;
	--kg-label-bold-tracking: 0.05em;

	/* Typography — label-sm */
	--kg-label-sm-size: 12px;
	--kg-label-sm-weight: 500;
	--kg-label-sm-line: 1;

	/* Radius */
	--kg-radius-sm: 0.25rem;
	--kg-radius: 0.5rem;
	--kg-radius-md: 0.75rem;
	--kg-radius-lg: 1rem;
	--kg-radius-xl: 1.5rem;
	--kg-radius-full: 9999px;

	/* Spacing */
	--kg-space-base: 8px;
	--kg-space-gutter: 24px;
	--kg-space-margin-mobile: 16px;
	--kg-space-margin-desktop: 40px;
	--kg-max-width: 1280px;
	--kg-section-gap: 80px;

	/* Elevation */
	--kg-shadow-card-resting: 0 4px 20px rgba(0, 0, 0, 0.04);
	--kg-shadow-card-hover: 0 4px 20px rgba(0, 0, 0, 0.08);
	--kg-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06);
	--kg-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
	--kg-shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.1);
}