:root {
	--c_black: #000000;
	--c_white: #FFFFFF;

	--c_green-1: #33B190;
	--c_green-2: #117B5F;
	--c_green-3: #1A433C;
	--c_green-4: #002721;
	--c_green-5: #00100D;

	--c_grey-1: #F6F6F8;
	--c_grey-2: #E3E3E4;
	--c_grey-3: #A6A6A6;
	--c_grey-4: #898989;
	--c_grey-5: #666666;
	--c_grey-6: #3B3B3B;
	--c_grey-7: #2B2B2B;
	--c_grey-8: #1D1D1D;
}

* {
	margin: 0px;
	padding: 0px;
	border: none;
	outline: none;
	text-decoration: none;
	box-sizing: border-box;
	word-break: break-word;
}

@font-face {
	font-family: 'Inter';
	src: url('/font/inter.ttf') format('truetype');
	font-style: normal;
}

@font-face {
	font-family: 'Inter';
	src: url('/font/inter-italic.ttf') format('truetype');
	font-style: italic;
}

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

@font-face {
	font-family: 'JetBrains Mono';
	src: url('/font/jetbrainsmono-italic.ttf') format('truetype');
	font-style: italic;
}

html,
body {
	overflow-x: hidden;
}

body {
	font-family: 'Inter';
	font-weight: normal;
	line-height: 1.5;
	min-height: 100vh;
	background-color: var(--c_green-5);
}

img, video {
	display: block;
}

video {
	width: 100%;
}

code, pre {
}

a, button, span {
	transition: all 0.4s ease;
}

a:hover {
}

button {
	appearance: none;
	-webkit-appearance: none;
	background: none;
	font: inherit;
	color: inherit;
	line-height: inherit;
	text-align: inherit;
	cursor: pointer;
}

button::-moz-focus-inner {
	border: 0;
	padding: 0;
}

::selection {
	color: var(--c_white);
	background: var(--c_green-1);
}

::-webkit-scrollbar {
	width: 14px;
}

::-webkit-scrollbar-track {
	background: var(--c_grey-9);
}

::-webkit-scrollbar-thumb {
	background: var(--c_grey-6);
	border-radius: 999px;
}

::-webkit-scrollbar-thumb:hover {
	background: var(--c_green-1);
}

/* ! __________  ! M A T E R I A L */

.material > svg {
    width: 100%;
    height: auto;
}

.material {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	white-space: nowrap;
	line-height: 1;
	overflow: hidden;
}

.material:not([data-icon-hydrated="1"]) {
	color: transparent;
}

.material-10 {
	width: 10px;
	min-width: 10px;
	height: 10px;
}

.material-15 {
	width: 15px;
	min-width: 15px;
	height: 15px;
}

.material-20 {
	width: 20px;
	min-width: 20px;
	height: 20px;
}

.material-25 {
	width: 25px;
	min-width: 25px;
	height: 25px;
}

.material-30 {
	width: 30px;
	min-width: 30px;
	height: 30px;
}

.material-35 {
	width: 35px;
	min-width: 35px;
	height: 35px;
}

.material-40 {
	width: 40px;
	min-width: 40px;
	height: 40px;
}

/* ! __________  ! T E X T */

.highlight {
	border-bottom: dashed 1px var(--c_grey-3);
}

p > a {
	display: flex-inline;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	color: var(--c_green-1);
}

p > a:hover {
	text-decoration: underline;
}

.eyebrow {
	color: var(--c_grey-5);
	font-size: 16px;
	font-weight: 600;
	text-transform: uppercase;
}

code {
	background: var(--c_grey-1);
	padding: 2px 4px;
	border-radius: 2px;
	color: inherit;
	font-size: inherit;
	display: inline-block;
	white-space: nowrap;
	vertical-align: baseline;
	line-height: inherit;
}
