:root {
	/* Brand colors */
	--color-primary: #6366f1;
	--color-primary-light: #818cf8;
	--color-primary-dark: #4f46e5;
	--brand-color-orange: #e8781c;
	--brand-color-purple-container: #594fc1;
	--brand-color-container: #e3e2fa;
	--brand-navy: #231d58;
	--brand-navy-card: #231d58;
	--brand-navy-button: #e3e2fb;
	--brand-color-periwinkle: #7f7dd7;
	--home-footer-text: #231d58;

	/* Homepage / header theme */
	--home-page-bg: #231d58;
	--home-content-bg: #ffffff;
	--home-accent-start: #fc6819;
	--home-accent-end: #fd8225;
	--home-accent: linear-gradient(180deg, #fc6819 0%, #fd8225 100%);
	--home-header-text: #ecf1fd;
	--home-heading-text: #11181c;
	--home-shadow: 0 4px 60px rgba(18, 18, 74, 0.1);
	--home-content-padding-x: 1rem;

	/* Neutrals */
	--color-white: #ffffff;
	--color-black: #000000;
	--color-text: #111827;
	--color-text-muted: #6b7280;
	--color-background: #ffffff;
	--color-border: #e5e7eb;

	/* Header auth buttons */
	--header-auth-button-bg: #4b45a2;
	--header-auth-button-gradient-start: #eff3ff;
	--header-auth-button-gradient-end: #d2dbf2;
	--header-auth-button-text: #494387;
	--header-auth-button-secondary-bg: #7472c6;
	--header-auth-button-secondary-text: #ecf1fd;

	/* Typography */
	--font-family-sans: 'Poppins', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	--font-homepage-section-title: 'Sansita One', 'Poppins', sans-serif;
	--font-alternate-got: 'alternategotno3dregular', 'Poppins', sans-serif;
	--font-size-xs: 0.75rem;
	--font-size-sm: 0.875rem;
	--font-size-base: 1rem;
	--font-size-lg: 1.125rem;
	--font-size-xl: 1.25rem;
	--font-size-2xl: 1.5rem;
	--font-size-3xl: 1.875rem;
	--font-size-4xl: 2.25rem;
	--font-weight-normal: 400;
	--font-weight-medium: 500;
	--font-weight-semibold: 600;
	--font-weight-bold: 700;
	--font-weight-black: 900;
	--line-height-tight: 1.25;
	--line-height-normal: 1.5;
	--line-height-relaxed: 1.75;

	/* Spacing */
	--spacing-1: 0.25rem;
	--spacing-2: 0.5rem;
	--spacing-3: 0.75rem;
	--spacing-4: 1rem;
	--spacing-6: 1.5rem;
	--spacing-8: 2rem;

	/* Layout */
	--header-height: 64px;
	--header-max-width: 1400px;
	--container-max-width-xl: 1280px;
	--footer-max-width: 1280px;
	--radius-full: 9999px;

	/* Breakpoints (for reference in media queries) */
	--breakpoint-xs: 480px;
	--breakpoint-sm: 640px;
	--breakpoint-md: 768px;
	--breakpoint-lg: 1024px;
	--breakpoint-xl: 1280px;

	/* Transitions */
	--transition-base: 200ms ease;
}

@media (min-width: 768px) {
	:root {
		--home-content-padding-x: 2rem;
	}
}