html {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}

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

/* Initialise basic styles */

body {
    font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    color: var(--body);
    max-width: 1920px;
	margin: auto;
    font-size: var(--fs-0);
    line-height: var(--space-m);
    background-image: linear-gradient(to right top, #eff6ff, #f4f8ff, #f9faff, #fcfcff, #ffffff);
    background-repeat: no-repeat;
    min-height: 100vh;
}

.container, 
.container--sm {
	max-width: 1240px;
    margin-inline: auto;
	padding-inline: var(--space-m);
}

.container--sm {
	max-width: 768px;
}

.site-header,
.site-footer {
    padding-inline: var(--space-s);
}

a, a:visited {
    color: var(--body);
}

a:hover {
    color: inherit;
}

/* Font sizing */

h1, h2, h3, h4, h5, h6 {
    line-height: var(--space-xl);
    margin-block: 0;
}

h1 {
    font-size: var(--fs-5);
    line-height: var(--space-2xl);
}

h2 {
    font-size: var(--fs-4);
}

h3 {
    font-size: var(--fs-3);
}

h4 {
    font-size: var(--fs-2);
}

h5 {
    font-size: var(--fs-1);
}

h6 {
    font-size: var(--fs-0);
}

sub {
    font-size: var(--fs--1);
}

/* Reset image sizing */

img {
    display: block;
    object-fit: cover;
    max-width: 100%;
}