@font-face {
		font-family: "PlusJakartaSans";
		font-style: normal;
		font-weight: 400;
		font-display: swap;
		src: url('../fonts/PlusJakartaSans-Regular.woff2') format("woff2");
	}

	@font-face {
		font-family: "Stardom";
		font-style: normal;
		font-weight: 400;
		font-display: swap;
		src: url('../fonts/Stardom-Regular.woff2') format('woff2');
	}

	html {
		box-sizing: border-box;
		scrollbar-width: thin;
		-webkit-tap-highlight-color: transparent;

		--padding: 20px;
		--color-background: #121212;
		--color-primary: #fff;
		--color-highlight: #ffe41b;

		background: var(--color-highlight);
		padding: var(--padding);
	}

	*, *:before, *:after {
		box-sizing: inherit;
	}

	body {
		font: normal 24px/1.4 PlusJakartaSans, system-ui, sans-serif;
		margin: 0;
		display: flex;
		color: var(--color-primary);
		background-color: var(--color-background);
		min-height: calc(100vh - var(--padding) * 2);
	}

	::selection {
		background: var(--color-highlight);
		color: var(--color-background);
	}

	a {
		color: var(--color-highlight);
		text-decoration-thickness: from-font;
		transition: 0.3s all;
	}

	a:hover,
	a:focus {
		color: #FFF;
	}

	a:focus {
		text-decoration: none;
	}

	main {
		margin: auto;
		padding: 20px;
	}

	main h1 {
		font-family: Stardom, system-ui, sans-serif;
		font-size: 120px;
		font-weight: 400;
		margin: 0;
		line-height: 1;
		color: var(--color-highlight);
	}

	main p {
		margin: 0;
		margin-top: 30px;
	}

	.link + .link {
		margin-top: 10px;
	}

	.link svg {
		vertical-align: bottom;
		margin-right: 5px;
	}

	.button {
		margin-top: 60px;
		font-size: 15px;
		padding: 10px 15px;
		display: inline-block;
		text-decoration: none;
		color: var(--color-primary);
		background-color: rgba(255, 255, 255, .05);
		transition: 0.3s all;
	}

	.button:hover,
	.button:focus {
		background-color: hsl(140, 80%, 15%);
		text-decoration: underline;
	}

	.button span {
		text-decoration: underline;
	}

	.button svg {
		fill: currentColor;
		vertical-align: bottom;
		margin-right: 7px;
	}

	.button a:not(:hover) {
		color: inherit;
	}

	@media (max-width: 600px) {
		html {
			--padding: 10px;
		}

		main h1 {
			font-size: 60px;
		}
	}