* {
    backface-visibility: hidden;
    box-sizing: border-box;
}

::before, ::after { box-sizing: border-box; }

:root {
    --colors--blue: #25227e;
    --colors--dark-grey: #0b0c0c;
    --colors-light-grey: #f0f0f0;
    --widths--container: 1528px;
    --widths--content: 1200px;

    --wp--preset--spacing--10: 1em;
    --wp--preset--spacing--20: 2em;
    --wp--preset--spacing--30: 3em;
    --wp--preset--spacing--40: 4em;
    --wp--preset--spacing--50: 5em;

    --wp--preset--font-size--large: 1.125rem;

}

html {
    scroll-padding-top: 4rem;
    scroll-behavior: smooth;
}

body {
    --wp--preset--spacing--default: 3.125rem;
}

.site-container {
    max-width: var(--widths--container);
    margin: 0 auto;
    padding: 0 1rem;
}

@media all and (min-width: 1280px) {
    :root {
        --wp--preset--font-size--large: 1.625rem;
    }
}