@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap');

html, body
{
	font-family: 'Inter', serif;
	font-size: 13pt;
	scroll-behavior: smooth;
	scroll-padding-top: 10rem;
}

h1, h2, h3, h4, h5, h6
{
	font-family: 'Plus Jakarta Sans', sans-serif;
	margin-top: 2rem;
	text-align: start;
}

header
{
	font-family: 'Inter', sans-serif;
	position: sticky;
	top: 0;
	background-color: var(--pico-background-color);
	border-bottom: 1px solid var(--pico-secondary);
	z-index: 99;
}

header, footer
{
	padding: 18pt 0;
	box-sizing: border-box;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-grow: 0;
	flex-shrink: 0;
}

header h1
{
	flex: 2;
	margin: 0;
	user-select: none;
}

footer div { flex: 3; }
footer div h4 { margin: 0; }
footer nav { font-family: 'Inter', sans-serif; }
main { flex-grow: 1; }
section { text-align: justify; }
code { text-align: start; }

a
{
	font-family: inherit;
	font-size: inherit;
}

details summary { font-family: 'Inter', sans-serif; }

@media (max-width: 768px)
{
	header, footer { flex-direction: column; }

	footer div
	{
		display: flex;
		flex-direction: column;
		align-items: center;
	}
}