:root {
	--enb-color-white: #fff;
	--enb-color-black: #000;
	--enb-color-25: #fcfcfc;
	--enb-color-50: #fafafa;
	--enb-color-100: #f5f5f5;
	--enb-color-200: #e5e5e5;
	--enb-color-300: #d4d4d4;
	--enb-color-400: #a3a3a3; // Control Border

	--enb-color-500: #737373;
	--enb-color-600: #525252; // control sub heading
	--enb-color-700: #404040; // Paragraph-light, svg
	--enb-color-800: #262626; // Paragraph button bg,
	--enb-color-900: #171717; // Heading, button:hover bg
	--enb-color-950: #0a0a0a;

	--enb-color-primary-50: #eff3ff;
	--enb-color-primary-100: #dbe4fe;
	--enb-color-primary-200: #bfd0fe;
	--enb-color-primary-300: #93affd;
	--enb-color-primary-400: #6088fa;
	--enb-color-primary-500: #3b6cf6;
	--enb-color-primary-600: #2559eb;
	--enb-color-primary-700: #1d4ed8;

	// Positive Color
	--enb-color-positive-600: #059669;
	--enb-color-positive-200: #bbf7d0;
	--enb-color-positive-50: #ecfdf5;

	// Negative Color
	--enb-color-negative-600: #dc2626;
	--enb-color-negative-200: #fecaca;
	--enb-color-negative-50: #fef2f2;

	// Warning Color
	--enb-color-warning-600: #ea580c;
	--enb-color-warning-200: #fed7aa;
	--enb-color-warning-50: #fff7ed;

	// Font Size
	// Reduction
	// View Port 480 - 1280
	// 18 * 1.25 = 22.5, 22.5/3.5 = 6%
	// 24 * 1.25 = 30, 30/2.5 = 12%
	// 32 * 1.25 = 40, 40/2.5 = 16%
	// 40 * 1.25 = 50, 50/2.5 = 20%
	// 48 * 1.25 = 60, 60/2.5 = 24%

	--enb-font-size-xs: 0.75rem; // 12px
	--enb-font-size-sm: 0.875rem; // 14px
	--enb-font-size-base: 1rem; // 16px
	--enb-font-size-md: 1.125rem; // 18px

	--enb-font-size-lg: 1.5rem; // 24px
	--enb-font-size-xl: 1.75rem; // 28px
	--enb-font-size-2xl: 2rem; // 32px
	--enb-font-size-3xl: 2.5rem; // 40px
	--enb-font-size-4xl: 3rem; // 48px
	--enb-font-size-5xl: 3.5rem; // 56px

	--enb-font-size-md-fluid: clamp(1.058rem, 1.017rem + 0.13vw, 1.125rem); // 16.92px - 18px
	--enb-font-size-lg-fluid: clamp(1.32rem, 1.212rem + 0.36vw, 1.5rem); // 21.12px - 24px
	--enb-font-size-xl-fluid: clamp(1.505rem, 1.358rem + 0.49vw, 1.75rem); // 24.08px - 28px
	--enb-font-size-2xl-fluid: clamp(1.68rem, 1.564rem + 0.58vw, 2rem); // 26.88px - 32px
	--enb-font-size-3xl-fluid: clamp(2rem, 1.7rem + 1vw, 2.5rem); // 32px - 40px
	--enb-font-size-4xl-fluid: clamp(2.28rem, 1.848rem + 1.44vw, 3rem); // 36.48px - 48px
	--enb-font-size-5xl-fluid: clamp(2.52rem, 1.932rem + 1.96vw, 3.5rem); // 40.32px - 56px


	// Spacing
	// Reduction
	// View Port 480 - 1280
	// 24 * 1.25 = 30, 30/2.25 = 13.33%
	// 32 * 1.25 = 40, 40/2.25 = 17.78%
	// 40 * 1.25 = 50, 50/2.25 = 22.22%
	// 48 * 1.25 = 60, 60/2.25 = 26.67%
	// 56 * 1.25 = 70, 80/2.25 = 31.11%
	// 64 * 1.25 = 80, 80/2.25 = 35.56%
	// 72 * 1.25 = 90, 80/2.25 = 40%
	// 80 * 1.25 = 100, 80/2.25 = 44.44%
	// 96 * 1.25 = 120, 80/2.25 = 53.33%

	// type-scale: -1.125
	--enb-margin-auto: auto;
	--enb-spacing-0: 0;
	--enb-spacing-4: 4px;
	--enb-spacing-8: 8px;
	--enb-spacing-12: 12px;
	--enb-spacing-16: 16px;

	--enb-spacing-24: 24px;
	--enb-spacing-32: 32px;
	--enb-spacing-40: 40px;
	--enb-spacing-48: 48px;
	--enb-spacing-56: 56px;
	--enb-spacing-64: 64px;
	--enb-spacing-72: 72px;
	--enb-spacing-80: 80px;
	--enb-spacing-96: 96px;

	--enb-spacing-24-fluid: clamp(1.3rem, 1.18rem + 0.4vw, 1.5rem); // 20.8px - 24px
	--enb-spacing-32-fluid: clamp(1.644rem, 1.431rem + 0.71vw, 2rem); // 26.31px - 32px
	--enb-spacing-40-fluid: clamp(1.944rem, 1.611rem + 1.11vw, 2.5rem); // 31.11px - 40px
	--enb-spacing-48-fluid: clamp(2.2rem, 1.72rem + 1.6vw, 3rem); // 35.2px - 48px
	--enb-spacing-56-fluid: clamp(2.411rem, 1.758rem + 2.18vw, 3.5rem); // 38.58px - 56px
	--enb-spacing-64-fluid: clamp(2.578rem, 1.724rem + 2.84vw, 4rem); // 41.24px - 64px
	--enb-spacing-72-fluid: clamp(2.7rem, 1.62rem + 3.6vw, 4.5rem); // 43.2px - 72px
	--enb-spacing-80-fluid: clamp(2.778rem, 1.445rem + 4.44vw, 5rem); // 44.45px - 80px
	--enb-spacing-96-fluid: clamp(2.8rem, 0.88rem + 6.4vw, 6rem); // 44.8px - 96px

	--enb-font-family: system-ui;

	// Animations
	--enb-translate: 100%;
}