@layer components {
	/*
	================================================
	Heading
	================================================
	*/
	.heading-base,
	.heading-0,
	.heading-1,
	.heading-2,
	.heading-3,
	.heading-4,
	.heading-5 {
		/* @apply font-heading; */
		letter-spacing: 0.01em;
	}

	/* 72 */
	.heading-0 {
		@apply font-ador text-4xl;
		line-height: 52px;
	}

	/* 40 */
	.heading-1 {
		@apply font-poppins text-4xl;
		line-height: 55px;
	}

	/* 32 */
	.heading-2 {
		@apply type-4xl;
		line-height: 1.125;
	}

	/* 28 */
	.heading-3 {
		@apply type-3xl leading-tight;
	}

	/* 24 */
	.heading-4 {
		@apply type-2xl leading-snug;
	}

	/* 18 */
	.heading-5 {
		@apply type-lg leading-normal;
	}

	.h1 {
		@apply heading-1 text-blue-700 text-left mb-12;
		letter-spacing: 0.01em;
	}

	/* @apply leading-tight; 1.25
	@apply leading-snug; 1.375
	@apply leading-normal; 1.5
	@apply leading-relaxed; 1.625
	@apply leading-loose; 2 */

	/*
	================================================
	Body Copy
	================================================
	*/

	/* 20 */
	.copy {
		@apply font-acumin font-light text-xl;
	}

	/* 22 */
	.copy-lg {
		@apply type-xl font-normal leading-normal;
	}

	.upper {
		@apply font-medium leading-normal tracking-widest uppercase type-sm;
	}

	/*
	================================================
	Fonts
	================================================
	*/

	.font-acumin {
		font-family: "acumin-pro", sans-serif;
	}

	.font-ador {
		font-family: "ador-hairline", sans-serif;
	}

	.font-poppins {
		font-family: "poppins", sans-serif;
	}

	.font-opensans {
		font-family: "open-sans", sans-serif;
	}

	.font-lato {
		font-family: "lato", sans-serif;
		@apply text-;
	}

	/* Media Quries */

	@media screen(sm) {
		.heading-0 {
			font-size: 2.5rem; /* 40px */
			line-height: 72px;
		}

		.heading-1 {
			font-size: 40px;
		}
	}

	@media screen(md) {
		.heading-0 {
			font-size: 3.75rem; /* 60px */
			line-height: 105px;
		}
	}

	@media screen(xl) {
		.heading-0 {
			font-size: 4.5rem; /* 72px */
		}
	}
}