@font-face {
  font-family: "JetBrains Mono";
  src: url("../fonts/jetbrainsmono.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}

:root {
	--accent: #7e00b4;
	--secondary: #9100ee;
	--text: #2f0b48;
	--background: #f1eef3;

	--ff-base: "JetBrains Mono", monospace;

	--fs-0: 0.8rem;
	--fs-1: 1rem;
	--fs-2: 1.6rem;
	--fs-3: 2.5rem;
}

/* CSS reset */
*,
*::before,
*::after {
	box-sizing: border-box;
}

* {
	margin: 0;
}

html {
	color-scheme: light dark;
}

img {
	max-width: 100%;
}

body {
	width: min(70ch - 1rem, 100%);
	padding: 3rem 1.5rem;
	font-family: var(--ff-base);
	font-size: var(--fs-1);
	line-height: 1.5;
	color: var(--text);
	background-color: var(--background);
	overflow-wrap: break-word;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

a {
	color: var(--accent);
	cursor: pointer;
}
a:hover {
	color: var(--secondary);
}

p,
ul {
	margin-bottom: 1.25rem;
	text-wrap: pretty;
}

h1 {
	font-weight: 500;
	line-height: 1;
}

header {
	margin: 0 auto 2.5rem;
}

main,
#authors {
	margin: 0;
}
main p:last-child,
footer p:last-child,
#authors p {
	margin: 0;
}

#authors, #page-404 {
	margin: 2rem 0 2.5rem 0;
	padding-bottom: 2.5rem;
	border-bottom: 1px dashed var(--accent);
}

#content {
	word-wrap: break-word;
	align-self: center;
}

#company {
	font-size: 85%;
	text-align: left;
}

footer {
	display: flex;
    flex-direction: column;
    align-items: right;
	margin: 0 auto;
}