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

:root {
    --fontFamily: "Circular Std";

    --font-large: 30px;
    --font-medium: 20px;
    --font-small: 14px;

    --green100: #00C16D;
    --green80: #33CD8A;
    --green50: #80E0B6;
    --green30: #B3ECD3;
    --green10: #E5F9F0;

    --blue100: #0F0080;
    --blue80: #3A2E94;
    --blue50: #8780BF;
    --blue30: #B7B3D9;
    --blue10: #E7E5F2;
    --blue5: #F3F2F9;

    --grey100: #4B4B4B;
    --grey80: #6F6F6F;
    --grey50: #A5A5A5;
    --grey30: #C9C9C9;
    --grey10: #EDEDED;
    --grey5: #F6F6F6;

    --yellow100: #FF8B00;
    --yellow50: #FFC580;
    --yellow30: #FFDCB3;
    --yellow10: #FFF3E5;
    --red100: #DD0033;
    --aubergine100: #7A3662;

    --c-2-c-blue-100: #0F0080;
    --c-2-c-blue-100-rgb: 15, 0, 128;
    --c-2-c-blue-80: #3A2E94;
    --c-2-c-blue-50: #8780BF;
    --c-2-c-blue-30: #B7B3D9;
    --c-2-c-blue-10: #E7E5F2;
    --c-2-c-blue-5: #F3F2F9;
    --circular-shift-bright-green: #01DE94;
    --circular-shift-light-blue: #B9E1E2;
    --circular-shift-light-blue-tint-1: #DCF5F4;
    --circular-shift-light-blue-tint-2: #F0FAFA;

    --md: 991px;

    --radius: 15px;

    --transition: 0.12s ease-in-out;
    --easingPrinciple: cubic-bezier(0.25, 0.1, 0.25, 1);

    --contentGap: 75px;

    --padding: 20px;
}

html {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

body {
    font-family: var(--fontFamily);
    margin: 0;
}

body.header-collapsed {
    overflow: hidden;
}

.page {
    padding-top: var(--contentGap);
}

h2 {
    margin: 0;
    font-size: 32px;
    font-weight: 500;
    line-height: 1.25;
    letter-spacing: 0.005em;
}

.subtitle {
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 700;
}

.grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
}
.wrapper {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
}

.vertical-wrapper {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.container {
    padding-inline: var(--padding);
}

.container__section-event--remove-gap {
    margin-bottom: -55px;
}

.section {
    padding-top: 50px;
    padding-bottom: 50px;
}

@media(min-width: 991px) {
    :root {
        --padding: 30px;
    }

    /* .container {
        padding-inline: var(--paddingMedium);
    } */
    .section {
        padding-top: 100px;
        padding-bottom: 100px;
    }
}

.section--top { padding-top: 0; }
.section--end { padding-bottom: 0; }

.u-aspect-box:before {
    content: "";
    width: 1px;
    margin-left: -1px;
    float: left;
    height: 0;
    padding-bottom: calc(100% / (var(--aspect-ratio)));
}
.u-aspect-box:after {
    content: "";
    display: table;
    clear: both;
}

.flex-center-x {
    display: flex;
    justify-content: center;
}

.content-blocks {
    display: flex;
    flex-direction: column;
    gap: var(--contentGap);
}

/* GRID SPACINGS */
.grid--cards {
    gap: 40px 0;
    display: flex;
    flex-direction: column;
}

.grid-blocks {
    gap: 50px 0;
}

.grid--downloads {
    gap: 15px;
}

.grid--resources {
    gap: 15px;
}

.grid--dropdown {
    gap: 10px;
}

.hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    width: 1px;
    height: 1px;
    position: absolute;
    z-index: -999;
    left: 0; top: 0;
}

@media(min-width: 992px) {
    .grid--cards {
        gap: 40px;
        display: grid;
    }
    .grid--downloads {
        gap: 40px;
    }
    .page {
        padding-top: 160px;
    }
    .grid-blocks {
        gap: 100px;
    }
}

img {
    max-width: 100%;
}

.columns {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/*
m: mpbile
t: tablet
*/
.span-1-m { grid-column: span 1; }
.span-2-m { grid-column: span 2; }
.span-3-m { grid-column: span 3; }
.span-4-m { grid-column: span 4; }
.span-5-m { grid-column: span 5; }
.span-6-m { grid-column: span 6; }
.span-7-m { grid-column: span 7; }
.span-8-m { grid-column: span 8; }
.span-9-m { grid-column: span 9; }
.span-10-m { grid-column: span 10; }
.span-11-m { grid-column: span 11; }
.span-12-m { grid-column: span 12; }


@media(min-width: 640px) {
    .span-1-t { grid-column: span 1; }
    .span-2-t { grid-column: span 2; }
    .span-3-t { grid-column: span 3; }
    .span-4-t { grid-column: span 4; }
    .span-5-t { grid-column: span 5; }
    .span-6-t { grid-column: span 6; }
    .span-7-t { grid-column: span 7; }
    .span-8-t { grid-column: span 8; }
    .span-9-t { grid-column: span 9; }
    .span-10-t { grid-column: span 10; }
    .span-11-t { grid-column: span 11; }
    .span-12-t { grid-column: span 12; }
}

@media(min-width: 992px) {
    .span-1 { grid-column: span 1; }
    .span-2 { grid-column: span 2; }
    .span-3 { grid-column: span 3; }
    .span-4 { grid-column: span 4; }
    .span-5 { grid-column: span 5; }
    .span-6 { grid-column: span 6; }
    .span-7 { grid-column: span 7; }
    .span-8 { grid-column: span 8; }
    .span-9 { grid-column: span 9; }
    .span-10 { grid-column: span 10; }
    .span-11 { grid-column: span 11; }
    .span-12 { grid-column: span 12; }

    .span-start-1 { grid-column-start: 1; }
    .span-start-2 { grid-column-start: 2; }
    .span-start-3 { grid-column-start: 3; }
    .span-start-4 { grid-column-start: 4; }
    .span-start-5 { grid-column-start: 5; }
    .span-start-6 { grid-column-start: 6; }
    .span-start-7 { grid-column-start: 7; }
    .span-start-8 { grid-column-start: 8; }
    .span-start-9 { grid-column-start: 9; }
    .span-start-10 { grid-column-start: 10; }
    .span-start-11 { grid-column-start: 11; }

    .span-end-1 { grid-column-end: 1; }
    .span-end-2 { grid-column-end: 2; }
    .span-end-3 { grid-column-end: 3; }
    .span-end-4 { grid-column-end: 4; }
    .span-end-5 { grid-column-end: 5; }
    .span-end-6 { grid-column-end: 6; }
    .span-end-7 { grid-column-end: 7; }
    .span-end-8 { grid-column-end: 8; }
    .span-end-9 { grid-column-end: 9; }
    .span-end-10 { grid-column-end: 10; }
    .span-end-11 { grid-column-end: 11; }
    .span-end-12 { grid-column-end: 12; }

}

.block {}
.block__custom-text {
    background-color: var(--blue5);
    border-radius: 13.76px;
    padding: 40px;
    margin-bottom: 40px;
    font-size: 16px !important;
}
.block__custom-text--white {
    background-color: white;
}
.block--centered { margin-inline: auto; }
.block--7 { max-width: 732px; }
.block--8 { max-width: 894px; }
.block--10 { max-width: 1126px; }

.pt-xs-20 { padding-top: 20px; }

.mt-xs-10 { margin-top: 10px; }
.mt-xs-20 { margin-top: 20px; }
.mt-xs-30 { margin-top: 30px; }
.mt-xs-40 { margin-top: 40px; }
.mt-xs-80 { margin-top: 80px; }

.mb-xs-5 { margin-bottom: 5px; }
.mb-xs-20 { margin-bottom: 20px; }
.mb-xs-30 { margin-bottom: 30px; }
.mb-xs-40 { margin-bottom: 40px; }

.mb-xs-90 { margin-bottom: 90px; }

.mr-xs-8 { margin-right: 8px; }

.column-title {
    margin: 0 0 .7em;
}

.hr-grey-blue {
    height: 1px;
    border: none;
    background-color: var(--blue30);
}

.relative {
    position: relative;
}