/*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */
*,::after,::before{box-sizing:border-box}html{-moz-tab-size:4;tab-size:4}html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}body{font-family:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji'}hr{height:0;color:inherit}abbr[title]{text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Consolas,'Liberation Mono',Menlo,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}::-moz-focus-inner{border-style:none;padding:0}:-moz-focusring{outline:1px dotted ButtonText}:-moz-ui-invalid{box-shadow:none}legend{padding:0}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}

body {
    font-family: Poppins,sans-serif;
    font-size: 16px;
    line-height: 1.4;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

pre {
    overflow: auto;
}

.center {
    max-width: 1180px;
    margin: auto;
    width: 100%;
    height: 100%;
}

:root {
    --green-brand-color: 2, 187, 169;
    --background-color: 8, 19, 34;
    --grey-color: 245, 245, 250;
    --blue-color: 34, 69, 105;
    --description-color: 84, 84, 97;
    --light-description-color: 173, 173, 185;
    --space-1: 0.5rem;
    --space-2: 1rem;
    --space-3: 1.5rem;
    --space-4: 2rem;
    --space-5: 2.5rem;
    --space-6: 3rem;
    --space-10: 5rem;
    --space-12: 6rem;
}

h1 {
    font-size: 3em !important;
}

h2 {
    font-size: 2.5em !important;
}

.btn {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    font-size: 1em;

    align-items: center;
    padding: var(--space-1) var(--space-4);
    border-radius: 12px;

    letter-spacing: 0.1em;
    line-height: 110%;

    width: fit-content;

    cursor: pointer;
}

.btn > small {
    font-size: 0.7em;
}

.btn-sm {
    padding: var(--space-1) var(--space-1);
    font-size: 0.8em;
    border-radius: 6px;
}

.btn-lg {
    padding: var(--space-2) var(--space-6);
}

.btn-light {
    background: rgba(var(--green-brand-color), 0.15);

    color: rgb(var(--green-brand-color));
    text-decoration: none;
    font-weight: bold;
}

.btn-light:hover {
    box-shadow: 0 0 var(--space-2) 0 rgba(var(--green-brand-color), 0.18);
}

.btn-green {
    background: rgb(var(--green-brand-color));

    color: white;
    text-decoration: none;
    font-weight: bold;
}

.btn-green:hover {
    background: #00A795;
}

.hidden {
    display: none !important;
    visibility: hidden;
}

main {
    background-color: rgb(var(--background-color));
}

section>.content-wrapper,
section.content-wrapper,
article.content-wrapper,
article>.content-wrapper {
    max-width: 1180px;
    margin: auto;
    padding: var(--space-12);
}

section>.frame {
    background-color: white;
    width: 100%;
    height: 100%;
    border-radius: 10px;
    z-index: 2;
}

main ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

main ul li {
    padding: var(--space-1) var(--space-1);
    margin-left: 1em;
    text-indent: -1em;
}

main ul li:before {
    content: "•";
    color: rgb(var(--green-brand-color));
    padding: 0 var(--space-1) 0 0;
}

.description {
    font-size: 0.9em;
    line-height: 150%;
}

.heading {
    font-size: 1.1em;
}

.icon {
    background-color: rgba(var(--green-brand-color), 0.4);
    border-radius: 15px;
    box-shadow: 5px 5px 20px #a9aaad;
    border: 2px solid #F6FAFB;
    padding: var(--space-1);
}

/* Chat */
#chat-window {
    width: 300px;
    position: fixed;
    z-index: 10;
    bottom: 55px;
    right: 10px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 10);
}

#hubspot-conversations-inline-iframe {
    height: 500px;
    border: 1px solid var(--dark-grey-color);
}

.chat-button {
    position: fixed;
    background-color: white;
    bottom: 20px;
    right: 20px;
    color: white;
    width: 60px;
    height: 60px;
    border-radius: 60px;
    border: 2px solid rgb(var(--grey-color));
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
}

.chat-button:hover {
    cursor: pointer;
    box-shadow: 2px 2px 2px var(--dark-grey-color);
}

/* Navigation */

header {
    background: linear-gradient(#0E1232C8 3.81%, rgba(var(--background-color, 255)) 101.92%);
    border-bottom: 2px solid gray;
    padding: var(--space-4) var(--space-4);
}

header > div {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 0 var(--space-12);
}

header .mobile-menu,
header .close-button-wrapper {
    display: none;
}

nav {
    flex-grow: 1;
}

nav ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
}

nav ul li {
    padding-right: 20px;
    font-weight: bold;
}

nav a {
    color: white;
    text-decoration: none;
}

nav a.selected {
    color: rgb(var(--green-brand-color));
}

/* ----------------------- */

/* Footer */

footer {
    background: linear-gradient(#0E1232C8 3.81%, rgba(var(--background-color, 255)) 101.92%);
    padding: 0 var(--space-4);
}

footer > div:first-child {
    padding: var(--space-12) var(--space-12);
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: space-between;
}

footer .company-info {
    margin-top: 1em;
}

footer .social {
    margin-top: var(--space-2);
}

footer .social>a {
    margin-right: var(--space-1);
    text-decoration: none;
}

footer .copyright {
    color: white;
    margin: 0;
    padding: var(--space-2) var(--space-12);
}

footer .menu {
    display: flex;
    flex-direction: row;
}

footer .menu .column {
    display: flex;
    flex-direction: column;
    padding: 0 var(--space-6);
}

footer .menu .column a {
    color: white;
    margin-bottom: var(--space-2);
    font-size: small;
}

footer .heading {
    color: white;
    font-weight: bold;
}


@media (max-width: 767.98px) {
    .chat-button {
        bottom: 5px;
        right: 5px;
    }

    nav {
        visibility: hidden;
        opacity: 0;
        position: absolute;
        top: 0;
        left: 0;
        background: rgb(var(--background-color));
        width: 100vw;
        height: 100vh;
        z-index: 100;

        transition: opacity 500ms;
    }

    nav ul {
        flex-direction: column;
        justify-content: flex-start;
        height: 100%;
        font-weight: bold;
        font-size: 120%;
        margin-top: var(--space-2);
    }

    nav ul li {
        margin-top: var(--space-2);
    }

    nav .close-button-wrapper {
        display: inline-block;
        color: white;
        text-align: right;
        padding: var(--space-4);
        width: 100%;
    }

    nav .close-button-wrapper .close-button {
        transform: rotate(45deg);
        display: inline-block;
        font-size: 2em;
    }

    header {
        padding: var(--space-2) var(--space-4);
    }

    header .mobile-menu {
        display: inline;
    }

    header > div {
        padding: 0 0;
    }

    header .btn {
        display: none;
    }

    footer {
        padding: 0 var(--space-2) var(--space-4) var(--space-2);
    }

    footer .copyright {
        padding: var(--space-2);
    }

    footer .company-info {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    footer .social a {
        padding: var(--space-2)
    }

    footer .menu {
        flex-direction: column;
    }

    footer .menu .column {
        padding: 0;
    }

    footer > div:first-child {
        flex-direction: column;
        padding: var(--space-2);
    }
}