:root {
	/* Theme Colors */
	--theme-primary: hsl(0, 0%, 100%);
	--theme-primary-hover: hsl(0, 0%, 90%);
	--theme-on-primary: hsl(0, 0%, 0%);;
	--theme-bg: #1E0C42;
	--theme-bg-circle: #4238DA;
	--theme-on-bg: hsl(0, 0%, 100%);
	--theme-surface-1: hsl(0, 0%, 20%);
	--theme-on-surface-1: hsl(0, 0%, 100%);
	--theme-surface-2: #203422;
	--theme-on-surface-2: #ffffff;
	--form-field-input-color: var(--theme-on-bg);

	/* Theme Shapes */
	--theme-shape-radius: 0;
	--theme-button-border-radius: 3rem;

	/* Theme Transition */
	--theme-transition: 0.2s ease-in-out;

	/* Theme Layout */
	--section-margin: 3rem;
	--theme-grid-gap: 1rem;
	--container-max-width: 1440px;
	--container-max-width-narrow: 960px;
	--container-padding: 0 1rem;

	--theme-blog-post-header-width: 1200px;

	/* Theme Fonts */
	--theme-font-family-serif: 'Space Grotesk';
	--theme-font-family-sans: 'Libre Franklin';
	--white: rgba(255, 255, 255, 1);
	--black: rgba(0, 0, 0, 1);
	--grey-900: rgba(23, 23, 26, 1);
	--grey-800: rgba(43, 40, 49, 1);
	--grey-700: rgba(69, 66, 78, 1);
	--grey-600: rgba(89, 85, 102, 1);
	--grey-500: rgba(122, 119, 135, 1);
	--grey-400: rgba(168, 168, 184, 1);
	--grey-300: rgba(195, 198, 214, 1);
	--grey-200: rgba(225, 227, 238, 1);
	--grey-100: rgba(242, 244, 251, 1);
	--blue-900: rgba(4, 25, 44, 1);
	--blue-800: rgba(20, 50, 79, 1);
	--blue-500: rgba(11, 152, 187, 1);
	--system--o-k-100: rgba(227, 241, 224, 1);
	--purple-900: rgba(0, 28, 181, 1);
	--purple-800: rgba(0, 39, 196, 1);
	--purple-700: rgba(17, 44, 203, 1);
	--purple-600: rgba(51, 52, 211, 1);
	--purple-500: rgba(66, 56, 218, 1);
	--purple-400: rgba(104, 85, 224, 1);
	--purple-300: rgba(134, 115, 229, 1);
	--purple-200: rgba(197, 185, 250, 1);
	--purple-100: rgba(224, 218, 255, 1);
	--system--o-k: rgba(89, 182, 66, 1);
	--system--o-k--tint-400: rgba(135, 226, 112, 1);
	--system--red: rgba(231, 60, 60, 1);
	--system--red--tint: rgba(249, 225, 225, 1);
	--system--yellow: rgba(231, 213, 60, 1);
	--system--o-k--tint-200: rgba(198, 238, 186, 1);
}