* {
	box-sizing: border-box;
}

html {
	/* scroll-behavior: smooth; */
}

body {
	margin: 0;
	color: var(--text);
	background: var(--background);
}

a {
	color: inherit;
	text-decoration: none;
}

button {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	letter-spacing: inherit;
	color: inherit;
	background: none;
	border: none;
	padding: 0;
}

@font-face {
	font-family: 'Neue Haas';
	src: url('/typefaces/Neue Haas Grotesk Text Pro 65 Medium.otf');
	font-weight: 500;
}

[grid] {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: var(--XS);
	padding-inline: var(--XS);
}

[max-width] {
	max-width: var(--maxWidth);
	margin-inline: auto;
}

:root {
	--fullWidth: span 12;
	--twoThirds: span 8;
	--halfWidth: span 6;
	--third: span 4;
	--container: 4 / span 6;
	--containerMedium: 3 / span 8;
	--containerLarge: 2 / span 10;
}

@media screen and (max-width: 1200px) {
	:root {
		--container: var(--containerMedium);
	}
}

@media screen and (max-width: 1096px) {
	:root {
		--container: var(--fullWidth);
	}
}

ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}
i {
	font-style: normal;
}

.noselect {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

@media (max-width: 767px) {
	[grid] {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}
	:root {
		--fullWidth: span 6;
		--twoThirds: span 5;
		--halfWidth: span 3;
		--third: span 2;
		--container: var(--fullWidth);
		--containerMedium: var(--fullWidth);
		--containerLarge: var(--fullWidth);
	}
}
