html {
    scroll-behavior: smooth;
}

body {
	margin: 0;
	font-family: var(--val-font-family);
	font-size: var(--val-fs--base);
	font-weight: var(--val-fw--base);
	line-height: var(--val-lh--base);
	color: var(--val-color--text);
	background-color: var(--val-color--bg);
	-webkit-text-size-adjust: 100%;
	-webkit-tap-highlight-color: transparent;
}

/* TYPOGRAPHY */

h1, h2, h3, h4, h5, h6 {
	margin-top: 0;
	margin-bottom: var(--val-gap-0-35);
	font-weight: var(--val-fw--bold);
	line-height: var(--val-lh--header);
}
h1 {
	font-size: var(--val-fs--x3l);
}
h2 {
	font-size: var(--val-fs--x2l);
}
h3 {
	font-size: var(--val-fs--xl);
}
h4 {
	font-size: var(--val-fs--l);
}
h5 {
	font-size: var(--val-fs--m);
}
h6 {
	font-size: var(--val-fs--base);
}
/* LG - Applies <= 992px */
@media screen and (max-width: 62rem) {
	h1 {
		font-size: calc(var(--val-fs--l) + 1.25vw);
	}
	h2 {
		font-size: calc(var(--val-fs--l) + 0.6vw);
	}
	h3 {
		font-size: calc(var(--val-fs--m) + 0.6vw);
	}
	h4 {
		font-size: calc(var(--val-fs--m) + 0.3vw);
	}
}

p {
	margin: var(--val-gap-0-75) 0;
}

a {
	color: var(--val-color--primary-link);
	transition: color .15s ease-in-out;
}
a:hover {
	color: var(--val-color--primary-link-hover);
}
a:active {
	color: var(--val-color--primary-link-active);
}

/* LAYOUT */

#body__wrapper > .flex__item {
	max-width: var(--val-max-width);
	background: var(--val-color--white);
}
#header > .flex__content {
	margin: var(--val-gap);
}
#body__wrapper > #footer {
	max-width: 100%;
	background: linear-gradient(180deg, var(--val-color--gray-5) 0%, var(--val-color--gray-10) 100%);
}
#footer > .flex__content {
	max-width: var(--val-max-width);
	margin: 0 auto;
	color: var(--val-color--gray-65);
	background: var(--val-color--gray-20);
	padding: calc(3 * var(--val-gap)) 0 calc(12 * var(--val-gap));
}
#footer > .flex__content a {
	color: var(--val-color--white);
}