@font-face {
	font-family: "Manrope";
	font-style: normal;
	font-weight: 200 800;
	font-display: swap;
	src: url("../fonts/Manrope/Manrope-VariableFont_wght.ttf") format("truetype");
}

@font-face {
	font-family: "Be Vietnam Pro";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/BeVietnamPro/BeVietnamPro-Regular.ttf") format("truetype");
}

@font-face {
	font-family: "Be Vietnam Pro";
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url("../fonts/BeVietnamPro/BeVietnamPro-Medium.ttf") format("truetype");
}

@font-face {
	font-family: "Be Vietnam Pro";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/BeVietnamPro/BeVietnamPro-SemiBold.ttf") format("truetype");
}

@font-face {
	font-family: "Be Vietnam Pro";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/BeVietnamPro/BeVietnamPro-Bold.ttf") format("truetype");
}

@font-face {
	font-family: "Be Vietnam Pro";
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url("../fonts/BeVietnamPro/BeVietnamPro-ExtraBold.ttf") format("truetype");
}

@font-face {
	font-family: "Be Vietnam Pro";
	font-style: normal;
	font-weight: 900;
	font-display: swap;
	src: url("../fonts/BeVietnamPro/BeVietnamPro-Black.ttf") format("truetype");
}

@font-face {
	font-family: "Be Vietnam Pro";
	font-style: italic;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/BeVietnamPro/BeVietnamPro-Italic.ttf") format("truetype");
}

@font-face {
	font-family: "Be Vietnam Pro";
	font-style: italic;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/BeVietnamPro/BeVietnamPro-BoldItalic.ttf") format("truetype");
}

@font-face {
	font-family: "Space Grotesk";
	font-style: normal;
	font-weight: 300 700;
	font-display: swap;
	src: url("../fonts/SpaceGrotesk/SpaceGrotesk-VariableFont_wght.ttf") format("truetype");
}

:root {
	--ema-font-heading: "Manrope", sans-serif;
	--ema-font-body: "Be Vietnam Pro", sans-serif;
	--ema-font-data: "Space Grotesk", sans-serif;
	font-family: var(--ema-font-body);
}

body.ema-brand-shell {
	font-family: var(--ema-font-body);
}

.ema-brand-shell :where(h1, h2, h3, h4, h5, h6) {
	font-family: var(--ema-font-heading);
}

.ema-brand-shell :where([data-ema-market-price], [data-ema-market-change]) {
	font-family: var(--ema-font-data);
	font-variant-numeric: tabular-nums;
}