@font-face {
	font-family: "Catfiles";
	src: url("../fonts/Catfiles.woff2") format("woff2");
	font-weight: 400;
	font-display: swap;
}
@font-face {
	font-family: "Argentum Sans";
	src: url("../fonts/ArgentumSans-Regular.woff2") format("woff2");
	font-weight: 400;
	font-display: swap;
}
@font-face {
	font-family: "Argentum Sans";
	src: url("../fonts/ArgentumSans-ExtraBold.woff2") format("woff2");
	font-weight: 800;
	font-display: swap;
}
@font-face {
	font-family: "Argentum Sans";
	src: url("../fonts/ArgentumSans-Black.woff2") format("woff2");
	font-weight: 900;
	font-display: swap;
}

:root {
	--mbb-yellow: #fbe801;
	--mbb-hot-pink: #fa2eb3;
	--mbb-light-pink: #ff99f7;
	--mbb-blue: #4a50ec;
	--mbb-stroke-blue: #3b29ff;
	--mbb-cyan: #00c0ff;
	--mbb-green: #00cf73;

	--mbb-black: #000000;
	--mbb-white: #ffffff;
	--mbb-soft-grey: #f5f7fa;
	--mbb-text-grey: #333333;
	--mbb-scrim: rgba(0, 0, 0, 0.45);
	--mbb-footer-text: #dddddd;
	--mbb-divider: #e3e4ea;
	--mbb-stripe: #f9f9fb;

	--mbb-font-display: "Catfiles", "Argentum Sans", sans-serif;
	--mbb-font-body: "Argentum Sans", sans-serif;

	--mbb-stroke: 3px;
	--mbb-stroke-fine: 2.5px;

	--mbb-shadow-sm: 0 3px 0 var(--mbb-black);
	--mbb-shadow-md: 0 5px 0 var(--mbb-black);
	--mbb-shadow-lg: 0 8px 0 var(--mbb-black);

	--mbb-radius-sm: 10px;
	--mbb-radius-md: 12px;
	--mbb-radius-lg: 15px;
	--mbb-radius-xl: 20px;
	--mbb-radius-full: 999px;

	--mbb-content-max: 1200px;
	--mbb-main-width: 872px;
	--mbb-sidebar-width: 300px;
	--mbb-gutter: 28px;
}
