:root {
	/* ---------------------------------------
    Fonts
  --------------------------------------- */
	font-size: 16px;

	/* Font Families */
	--font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;

	/* Line height */
	--lh-small: 1.33;
	--lh-default: 1.6;

	/* Font sizes */
	--heading-100: 3rem;
	--heading-200: 2.5rem;
	--heading-300: 1.75rem;
	--heading-400: 1.5rem;
	--heading-500: 1.25rem;
	--heading-600: 1rem;
	--text-default: 1rem;
	--text-small: 0.88rem;
	--text-large: 1.25rem;

	/* ---------------------------------------
    Spacing
  --------------------------------------- */
	--spacing-100: 0.5rem;
	--spacing-200: 1rem;
	--spacing-300: 2rem;
	--spacing-400: 3rem;
	--spacing-500: 4rem;
	--spacing-600: 5rem;
	--spacing-700: 6rem;
	--spacing-800: 7rem;

	/* ---------------------------------------
    Radi
  --------------------------------------- */
	--radi-default: 0.25rem;

	/* ---------------------------------------
    Colors 
  --------------------------------------- */
	--color-white: rgba(255, 255, 255, 1);
	--color-black: rgba(0, 0, 0, 1);

	/* Grays */
	--color-gray-50: rgba(248, 250, 252, 1);
	--color-gray-100: rgba(241, 245, 249, 1);
	--color-gray-200: rgba(226, 232, 240, 1);
	--color-gray-300: rgba(203, 213, 225, 1);
	--color-gray-400: rgba(148, 163, 184, 1);
	--color-gray-500: rgba(100, 116, 139, 1);
	--color-gray-600: rgba(71, 85, 105, 1);
	--color-gray-700: rgba(51, 65, 85, 1);
	--color-gray-800: rgba(30, 41, 59, 1);
	--color-gray-900: rgba(15, 23, 42, 1);

	/* Primary */
	--color-primary-100: rgba(248, 252, 249, 1);
	--color-primary-200: rgba(211, 238, 220, 1);
	--color-primary-300: rgba(167, 220, 186, 1);
	--color-primary-400: rgba(112, 199, 143, 1);
	--color-primary-500: rgba(65, 165, 100, 1);
	--color-primary-600: rgba(59, 150, 91, 1);
	--color-primary-700: rgba(52, 132, 80, 1);
	--color-primary-800: rgba(45, 113, 69, 1);
	--color-primary-900: rgba(36, 91, 55, 1);

	/* Secondary */
	--color-secondary-100: rgba(241, 251, 254, 1);
	--color-secondary-200: rgba(181, 233, 248, 1);
	--color-secondary-300: rgba(102, 210, 240, 1);
	--color-secondary-400: rgba(21, 172, 214, 1);
	--color-secondary-500: rgba(14, 116, 144, 1);
	--color-secondary-600: rgba(13, 105, 130, 1);
	--color-secondary-700: rgba(11, 93, 116, 1);
	--color-secondary-800: rgba(10, 82, 102, 1);
	--color-secondary-900: rgba(7, 60, 74, 1);

	/* Misc */
	--color-info-100: rgba(240, 249, 255, 1);
	--color-info-500: rgba(14, 165, 233, 1);
	--color-info-900: rgba(12, 74, 110, 1);
	--color-warning-100: rgba(255, 251, 235, 1);
	--color-warning-500: rgba(245, 158, 11, 1);
	--color-warning-900: rgba(146, 64, 14, 1);
	--color-danger-100: rgba(254, 242, 242, 1);
	--color-danger-500: rgba(239, 68, 68, 1);
	--color-danger-900: rgba(153, 27, 27, 1);

	/* ---------------------------------------
    Shadows
  --------------------------------------- */
	--shadow-base: 0px 1px 2px rgba(0, 0, 0, 0.06), 0px 1px 3px rgba(0, 0, 0, 0.1);
	--shadow-md: 0px 2px 4px rgba(0, 0, 0, 0.06), 0px 4px 6px rgba(0, 0, 0, 0.1);
	--shadow-lg: 0px 10px 15px rgba(0, 0, 0, 0.1), 0px 4px 6px rgba(0, 0, 0, 0.05);
	--shadow-xl: 0px 20px 25px rgba(0, 0, 0, 0.1), 0px 10px 10px rgba(0, 0, 0, 0.04);
	--shadow-2xl: 0px 25px 50px rgba(0, 0, 0, 0.25);
	--shadow-inner: inset 0px 2px 4px rgba(0, 0, 0, 0.06);
}