*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
 --surface: #1a1d26;
 --surface2: #22263a;
 --border: rgba(255,255,255,0.08);
 --border2: rgba(255,255,255,0.15);
 --text: #e2e4ef;
 --accent-hover: #4a59e0;
 --success: #2dce82;
 --danger: #f54b5e;
 --danger-dark: #C4404D;
 --warning: #f5a623;
 --color-green: #80BA27;
 --color-blue-dark: #072935;
 --color-blue-light: #093342;
 --accent: var(--color-green);
 --color-grey: #7b7f96;
 --radius: .5rem;
 --font-title: 'Bricolage Grotesque', sans-serif;
 --font-base: 'Roboto', sans-serif;
 --line-h-base: 1.3;
 --line-h-title: 1.2;
 font-size: 16px;
 font-family: var(--font-base);
}


body {
 font-family: var(--font-base);
 line-height: var(--line-h-base);
}

h1, h2, h3, h4, h5, h6 {
 font-family: var(--font-title);
 line-height: var(--line-h-title);
 margin-bottom: 1rem;
}

h1, .h1 {
 font-family: var(--font-title);
 font-size: clamp(2.75rem, 2.143vw + 2.107rem, 4.25rem);
 line-height: var(--line-h-title);
}

h2, .h2 {
 font-family: var(--font-title);
 font-size: clamp(2.5rem, 1.429vw + 2.071rem, 3.5rem);
 line-height: var(--line-h-title);
}

h3, .h3 {
 font-family: var(--font-title);
 font-size: clamp(2.25rem, .714vw + 2.036rem, 2.75rem);
 line-height: var(--line-h-title);
}

h4, .h4 {
 font-family: var(--font-title);
 font-size: clamp(2rem, .357vw + 1.893rem, 2.25rem);
 line-height: var(--line-h-title);
}

h5, .h5 {
 font-family: var(--font-title);
 font-size: clamp(1.5rem, .714vw + 1.286rem, 2rem);
 line-height: var(--line-h-title);
}

h6, .h6 {
 font-family: var(--font-title);
 font-size: clamp(1.375rem, .179vw + 1.321rem, 1.5rem);
 line-height: var(--line-h-title);
}

.big-title {
 font-size: 1.25rem;
 line-height: var(--line-h-title);
}

.base, p, ul, ol, li {
 font-size: 1rem;
 margin-bottom: .8rem;

 &:last-child {
	margin-bottom: 0;
 }
}

.small {
 font-size: .9rem;
}

.xsmall {
 font-size: .8rem;
}

.font-title {
 font-family: var(--font-title);
}

.font-base {
 font-family: var(--font-base);
}

.accent {
 color: var(--color-green);
}

.inner {
 width: 100%;
 max-width: 90vw;
 margin-inline: auto;
}