@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 300 800;
    font-display: swap;
    src: url(/fonts/OpenSans-Variable.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


:root {
    --black: #3F4443;
    --black-deep: #000;
    --grey: #8D949B;
    --grey-medium: #C5C9CC;
    --grey-light: #E2E4E6;
    --white: #fff;
    --orange: #DC5828;
    --orange-light: #E87722;
    --orange-hover: #bd4c22;
    --beige: #F4F0EE;
    --beige-hover: #e3dcd8;
    --green: #39A975;
    --green-light: #39A975;
    --green-dark: #39A975;
    --gradient-orange: linear-gradient(90deg, var(--orange) 0%, var(--orange-light) 100%);
    --fontbody: 'Open Sans', sans-serif;
    --fontheader: 'Open Sans', sans-serif;
    --fontsize-header-xl: 7.2rem;
    --fontsize-header-lg: 4.6rem;
    --fontsize-header-md: 3.2rem;
    --fontsize-header-sm: 2.8rem;
    --fontsize-header-xs: 2rem;
    --lineheight-header: 1.1;
    --fontsize-body-xl: 2.4rem;
    --fontsize-body-lg: 2.2rem; /* intro */
    --fontsize-body-md: 1.8rem; /* body */
    --fontsize-body-ms: 1.6rem; /* body medium small */
    --fontsize-body-sm: 1.4rem; /* sub */
    --fontsize-body-xs: 1.2rem; /* extra small */
    --lineheight-body: 1.75;
    --nav-top-height: 0rem;
    --nav-main-height: 11.6rem;
    --nav-height: calc(var(--nav-top-height) + var(--nav-main-height));
    --padding: 2rem;
    --mainwidth: 1440px;
    --desktop-container: calc(160rem - var(--padding-grid) - var(--padding-grid));
    --padding-grid: 4rem;
    --padding-section: 5rem;
    --transition-default: all .3s linear;
}

@media(min-width: 1024px) {
    :root {
        --fontsize-header-xl: 7.2rem;
        --fontsize-header-lg: 4.6rem;
        --fontsize-header-md: 3.2rem;
        --fontsize-header-sm: 2.8rem;
        --padding-section: 10rem;
    }
}

html {
    font-size: 62.5%;
    height: 100%;
}

body {
    font-family: var(--fontbody);
    font-size: var(--fontsize-body-md);
    line-height: 100%;
    font-weight: 400;
    color: var(--black);
    height: 100%;
    -webkit-backface-visibility: visible !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-tap-highlight-color: transparent;
    margin: 0;
}

    body.is--scrolllock {
        overflow: hidden;
    }

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

@media (prefers-reduced-motion: no-preference) {
    :root {
        scroll-behavior: smooth;
    }
}

button, a, input, textarea, select {
    outline: .2rem solid transparent;
    outline-offset: 0rem;
}

*:focus {
    outline: none;
}

*:focus-visible {
    outline: .2rem solid var(--black);
}

main,
footer {
    margin: 0 auto;
    overflow: hidden;
    position: relative;
}

img {
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: 50% 50%;
}

a, button {
    text-decoration: none;
    transition: var(--transition-default);
}

a {
    color: var(--black);
}

.richtext a:not(.button) {
    display: inline-flex;
    color: var(--black);
    background-image: linear-gradient(var(--orange), var(--orange));
    background-position: 0 100%;
    background-repeat: no-repeat;
    background-size: 100% .2rem;
    transition: var(--transition-default);
}

.richtext--invert a:not(.button) {
    color: var(--white);
    background-size: 100% .1rem;
    background-image: linear-gradient(var(--white), var(--white));
}

@media (pointer: fine) {
    .richtext a:not(.button):hover {
        color: var(--orange);
        background-position: 0 calc(100% - .2rem);
    }

    .richtext--invert a:not(.button):hover {
        color: rgba(255, 255, 255, .7);
        background-image: linear-gradient(rgba(255, 255, 255, .7), rgba(255, 255, 255, .7));
    }
}

.container {
    width: 100%;
    max-width: calc(100% - calc(2 * var(--padding-grid)));
    margin: 0 auto;
}

    .container:has(>.col + .col) {
        display: flex;
        gap: var(--padding-grid);
    }

@media(min-width: 1024px) {
    .container:has(.col:nth-child(2)) .col {
        width: 50%;
    }
}

@media(min-width: 1600px) {
    .container:not(.container--fluid) {
        max-width: var(--desktop-container);
    }
}

.container .col {
    margin: 0 auto;
}

@media(min-width: 992px) {
    .container .col--text {
        max-width: 75rem;
        margin-left: 0;
    }
}

section {
    margin: 0;
}

.block--padding {
    padding: var(--padding-section) 0;
}

.block--padding-semi {
    padding: calc(var(--padding-section) / 2) 0;
}

.block--beige {
    background-color: var(--beige);
}

.block--notoppadding {
    padding-top: 0 !important;
}

.block--nobottompadding {
    padding-bottom: 0 !important;
}

@media(max-width: 1023px) {
    .d--onlydesktop {
        display: none !important;
    }
}

@media(min-width: 1024px) {
    .d--onlymobile {
        display: none !important;
    }
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--fontheader);
    line-height: 100%;
    font-weight: 800;
    margin-bottom: 0;
}

h1, .h1 {
    font-size: var(--fontsize-header-xl);
    font-weight: 800;
}

h2, .h2 {
    font-size: var(--fontsize-header-lg);
}

h3, .h3 {
    font-size: var(--fontsize-header-md);
}

h4, .h4 {
    font-size: var(--fontsize-header-sm);
    font-weight: 600;
}

h5, .h5 {
    font-size: var(--fontsize-header-sm);
    font-weight: 600;
}

h6, .h6 {
    font-size: var(--fontsize-header-sm);
    font-weight: 600;
}

.intro {
    font-size: var(--fontsize-body-lg);
    font-weight: 600;
}

.richtext p,
.richtext ol,
.richtext ul {
    line-height: var(--lineheight-body);
}

.richtext p {
    text-wrap: balance;
}

    .richtext h2:has(+*),
    .richtext h3:has(+*),
    .richtext h4:has(+*),
    .richtext h5:has(+*),
    .richtext h6:has(+*),
    .richtext p:has(+*),
    .richtext ol:has(+*),
    .richtext ul:has(+*) {
        margin-bottom: 2rem;
    }

.richtext * + h2,
.richtext * + h3,
.richtext * + h4,
.richtext * + h5,
.richtext * + h6 {
    margin-top: 4rem;
}

.richtext ul {
    list-style: none;
    padding: 0;
}

    .richtext ul li {
        position: relative;
        padding-left: 2rem;
    }

        .richtext ul li:before {
            content: "";
            width: 1rem;
            height: 1rem;
            position: absolute;
            top: 1rem;
            left: 0;
            background-image: url("data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='14' height='14' rx='7' fill='%23E65D41'/%3E%3C/svg%3E%0A");
        }

.richtext ol {
    padding: 0 0 0 2.4rem;
}

    .richtext ol li {
        padding-left: .3rem;
    }

        .richtext ol li::marker {
            font-family: var(--fontheader);
            color: var(--orange);
            font-weight: 500;
        }

.richtext hr {
    border-top: .1rem solid var(--black);
    margin: 2rem 0;
}

.richtext table {
    padding: 0;
    border-spacing: 0;
}

    .richtext table td {
        padding: 1.6rem 0;
        border-bottom: .1rem solid rgba(42, 42, 42, .2);
        vertical-align: top;
    }

.richtext td:first-of-type {
    padding-right: 4.8rem;
    font-weight: 500;
}

.richtext tr:last-of-type td {
    border-bottom: none;
}

.backdrop {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, .2);
    opacity: 0;
    transition: var(--transition-default);
    z-index: 10;
}

body.is--scrolllock .backdrop {
    top: 0;
    opacity: 1;
}

.breadcrumb {
    padding: 2rem 0;
}

    .breadcrumb:has(+.block--beige) {
        background-color: var(--beige);
    }

    .breadcrumb ol,
    .breadcrumb li {
        list-style: none;
        padding: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 1rem;
        font-size: var(--fontsize-body-sm);
    }

    .breadcrumb a {
        display: inline-flex;
        color: var(--grey);
        position: relative;
    }

    .breadcrumb svg {
        width: 1rem;
        height: 1rem;
        opacity: .5;
    }

        .breadcrumb svg path {
            fill: var(--grey);
        }

@media(pointer: fine) {
    .breadcrumb a:after {
        content: "";
        width: 100%;
        height: .1rem;
        position: absolute;
        left: 0;
        bottom: 0;
        background-color: var(--grey);
        transform: translateY(.4rem);
        opacity: 0;
        transition: var(--transition-default);
    }

    .breadcrumb a:hover {
        color: var(--black);
    }

        .breadcrumb a:hover:after {
            background-color: var(--black);
            transform: translateY(0);
            opacity: 1;
        }
}

@media (min-width: 1024px) {
    .is-sticky {
        position: sticky;
        top: calc(var(--nav-height) + 2rem);
    }
}

.richtext table th,
.richtext table td {
    text-align: left;
    padding: 0;
    border: none;
    line-height: var(--lineheight-body);
}

.richtext table tr:has(+tr) th,
.richtext table tr:has(+tr) td {
    padding-bottom: .5rem;
}

.richtext table th:has(+td),
.richtext table td:has(+td) {
    padding-right: 1rem;
}

.blockheader {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .blockheader h2 {
        margin-bottom: 0;
    }