:root {
	--fontfamily-mono: var(--text-fontfamily-mono), monospace;
	--fontfamily-base: var(--text-fontfamily-base), sans-serif;
	--fontfamily-accent: var(--text-fontfamily-accent), serif;
}

@layer text {
	/* text Base Classes */
	.text-10 {
		font-weight: var(--text-weight-regular);
		font-size: 0.625rem;
		line-height: var(--text-lineheight-default);
		font-family: var(--fontfamily-base);
	}

	.text-11 {
		font-weight: var(--text-weight-regular);
		font-size: 0.6875rem;
		line-height: var(--text-lineheight-default);
		font-family: var(--fontfamily-base);
	}

	.text-12 {
		font-weight: var(--text-weight-regular);
		font-size: 0.75rem;
		line-height: var(--text-lineheight-default);
		font-family: var(--fontfamily-base);
	}

	.text-13 {
		font-weight: var(--text-weight-regular);
		font-size: 0.8125rem;
		line-height: var(--text-lineheight-default);
		font-family: var(--fontfamily-base);
	}

	.text-14 {
		font-weight: var(--text-weight-regular);
		font-size: 0.875rem;
		line-height: var(--text-lineheight-default);
		font-family: var(--fontfamily-base);
	}

	.text-15 {
		font-weight: var(--text-weight-regular);
		font-size: 0.938rem;
		line-height: var(--text-lineheight-default);
		font-family: var(--fontfamily-base);
	}

	.text-16 {
		font-weight: var(--text-weight-regular);
		font-size: 1rem;
		line-height: var(--text-lineheight-default);
		font-family: var(--fontfamily-base);
	}

	.text-accent-head {
		font-weight: 400;
		font-size: 3.875rem;
		line-height: var(--text-lineheight-default);
		font-family: var(--fontfamily-base);
	}

	/* MODIFIERS */
	.text-body {
		line-height: var(--text-lineheight-body);
	}

	.text-semibold {
		font-weight: var(--text-weight-semibold);
	}

	.text-bold {
		font-weight: var(--text-weight-bold);
	}

	.text-monospace {
		font-family: var(--fontfamily-mono);
	}

	.text-balance {
		text-wrap: balance;
	}

	.text-pre {
		white-space: pre-wrap;
		word-break: break-word;
	}

	.text-italic {
		font-style: italic;
	}
}