@font-face {
	font-family: "Cantarell";
	font-weight: 100 900;
	font-display: swap;
	font-style: normal;
	src: url("../fonts/Cantarell-VF.woff2") format("woff2"),
		url("../fonts/Cantarell-VF.otf") format("opentype");
}

@font-face {
	font-family: "Righteous";
	font-style: normal;
	font-weight: 400;
	src: url("../fonts/Righteous.woff2") format("woff2"),
		url("../fonts/Righteous.otf") format("opentype");
}

html, body {margin: 0; background: var(--site-bg);}
body {font-size: 20px; font-family: "Cantarell", system-ui, sans-serif; color: var(--text-color); line-height: 150%; text-align: center; display: flex; align-items: safe center; justify-content: center; height: 100svh;}

* {box-sizing: border-box;}

/* Content */

.content {max-width: 400px; padding: 30px 15px; width: 100%; user-select: none;}
.content h3 {color: var(--title-color); font-weight: 900;}

/* Logo */

.logo svg {fill: var(--logo-color); color: var(--logo-color); max-width: 58px; transition: fill .2s;}
.logo a:hover svg {fill: var(--logo-color-hover);}
