:where(abbr), :where(address), :where(area), :where(article), :where(aside), :where(audio), :where(b), :where(base), :where(bdi), :where(bdo), :where(big), :where(blockquote), :where(body), :where(br), :where(caption), :where(cite), :where(code), :where(col), :where(colgroup), :where(data), :where(datalist), :where(dd), :where(del), :where(details), :where(dfn), :where(dialog), :where(dl), :where(dt), :where(em), :where(embed), :where(fieldset), :where(figcaption), :where(figure), :where(footer), :where(form), :where(h1), :where(h2), :where(h3), :where(h4), :where(h5), :where(h6), :where(head), :where(header), :where(hgroup), :where(hr), :where(i), :where(input), :where(ins), :where(kbd), :where(keygen), :where(label), :where(legend), :where(li), :where(link), :where(main), :where(map), :where(mark), :where(menu), :where(menuitem), :where(meta), :where(meter), :where(nav), :where(object), :where(ol), :where(optgroup), :where(option), :where(output), :where(param), :where(picture), :where(pre), :where(progress), :where(q), :where(rp), :where(rt), :where(ruby), :where(s), :where(samp), :where(slot), :where(script), :where(section), :where(select), :where(small), :where(source), :where(strong), :where(style), :where(sub), :where(summary), :where(sup), :where(table), :where(template), :where(tbody), :where(td), :where(textarea), :where(tfoot), :where(th), :where(thead), :where(time), :where(title), :where(tr), :where(track), :where(u), :where(ul), :where(var), :where(wbr), :where(div), :where(span), :where(button), :where(a), :where(p) {
    all: unset;
    display: revert
}

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

html {
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    text-size-adjust: none
}

a, :where(button) {
    cursor: revert
}

ol, ul, menu, summary {
    list-style: none
}

img {
    display: block;
    height: auto;
    max-width: 100%
}

table {
    border-collapse: collapse
}

input, textarea {
    -webkit-user-select: auto;
    -moz-user-select: auto;
    user-select: auto
}

textarea {
    white-space: revert
}

meter {
    -webkit-appearance: revert;
    -moz-appearance: revert;
    appearance: revert
}

:where(pre) {
    all: revert;
    box-sizing: border-box
}

::-moz-placeholder {
    color: inherit
}

::placeholder {
    color: inherit
}

:where([hidden]) {
    display: none
}

:where([contenteditable]:not([contenteditable=false])) {
    -webkit-line-break: after-white-space;
    word-wrap: break-word;
    -moz-user-modify: read-write;
    -webkit-user-modify: read-write;
    -webkit-user-select: auto;
    -moz-user-select: auto;
    user-select: auto
}

:where([draggable=true]) {
    -webkit-user-drag: element
}

::-webkit-details-marker {
    display: none
}

a:not([class]) {
    text-decoration-color: inherit;
    text-decoration-line: underline;
    text-decoration-thickness: max(.0625em,1px);
    text-underline-offset: .2em
}

    a:not([class]):hover {
        text-decoration-color: currentcolor
    }

.container {
    --gutter-x: 1.5rem;
    --gutter-y: 0;
    width: 100%;
    padding-right: calc(var(--gutter-x)*.5);
    padding-left: calc(var(--gutter-x)*.5);
    margin-right: auto;
    margin-left: auto;
}
.logo-np {
    background-color: hsla(0 0% 100% / 0.27);
    border: 2px solid hsl(201, 63%, 51%);
    border-radius: 15px 50px;
}

@media(min-width: 576px) {
    .container {
        max-width: 540px
    }
}

@media(min-width: 768px) {
    .container {
        max-width: 720px
    }
}

@media(min-width: 992px) {
    .container {
        max-width: 960px
    }
}

@media(min-width: 1200px) {
    .container {
        max-width: 1140px
    }
}

@media(min-width: 1400px) {
    .container {
        max-width: 1320px
    }
}

:root {
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --breakpoint-xxl: 1400px
}

.row {
    --gutter-x: 1.5rem;
    --gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1*var(--gutter-y));
    margin-right: calc(-0.5*var(--gutter-x));
    margin-left: calc(-0.5*var(--gutter-x))
}

    .row > * {
        flex-shrink: 0;
        width: 100%;
        max-width: 100%;
        padding-right: calc(var(--gutter-x)*.5);
        padding-left: calc(var(--gutter-x)*.5);
        margin-top: var(--gutter-y)
    }

.col-4 {
    flex: 0 0 auto;
    width: 33.33333333%
}

.col-8 {
    flex: 0 0 auto;
    width: 66.66666667%
}

.col-12 {
    flex: 0 0 auto;
    width: 100%
}

.offset-1 {
    margin-left: 8.33333333%
}

.offset-2 {
    margin-left: 16.66666667%
}

.offset-3 {
    margin-left: 25%
}

.offset-4 {
    margin-left: 33.33333333%
}

.offset-5 {
    margin-left: 41.66666667%
}

.offset-6 {
    margin-left: 50%
}

.offset-7 {
    margin-left: 58.33333333%
}

.offset-8 {
    margin-left: 66.66666667%
}

.offset-9 {
    margin-left: 75%
}

.offset-10 {
    margin-left: 83.33333333%
}

.offset-11 {
    margin-left: 91.66666667%
}

@media(min-width: 576px) {
    .offset-sm-0 {
        margin-left: 0
    }

    .offset-sm-1 {
        margin-left: 8.33333333%
    }

    .offset-sm-2 {
        margin-left: 16.66666667%
    }

    .offset-sm-3 {
        margin-left: 25%
    }

    .offset-sm-4 {
        margin-left: 33.33333333%
    }

    .offset-sm-5 {
        margin-left: 41.66666667%
    }

    .offset-sm-6 {
        margin-left: 50%
    }

    .offset-sm-7 {
        margin-left: 58.33333333%
    }

    .offset-sm-8 {
        margin-left: 66.66666667%
    }

    .offset-sm-9 {
        margin-left: 75%
    }

    .offset-sm-10 {
        margin-left: 83.33333333%
    }

    .offset-sm-11 {
        margin-left: 91.66666667%
    }
}

@media(min-width: 768px) {
    .col-md-4 {
        flex: 0 0 auto;
        width: 33.33333333%
    }

    .col-md-5 {
        flex: 0 0 auto;
        width: 41.66666667%
    }

    .col-md-6 {
        flex: 0 0 auto;
        width: 50%
    }

    .col-md-8 {
        flex: 0 0 auto;
        width: 66.66666667%
    }

    .col-md-10 {
        flex: 0 0 auto;
        width: 83.33333333%
    }

    .col-md-12 {
        flex: 0 0 auto;
        width: 100%
    }

    .offset-md-0 {
        margin-left: 0
    }

    .offset-md-1 {
        margin-left: 8.33333333%
    }

    .offset-md-2 {
        margin-left: 16.66666667%
    }

    .offset-md-3 {
        margin-left: 25%
    }

    .offset-md-4 {
        margin-left: 33.33333333%
    }

    .offset-md-5 {
        margin-left: 41.66666667%
    }

    .offset-md-6 {
        margin-left: 50%
    }

    .offset-md-7 {
        margin-left: 58.33333333%
    }

    .offset-md-8 {
        margin-left: 66.66666667%
    }

    .offset-md-9 {
        margin-left: 75%
    }

    .offset-md-10 {
        margin-left: 83.33333333%
    }

    .offset-md-11 {
        margin-left: 91.66666667%
    }
}

@media(min-width: 992px) {
    .col-lg-4 {
        flex: 0 0 auto;
        width: 33.33333333%
    }

    .col-lg-5 {
        flex: 0 0 auto;
        width: 41.66666667%
    }

    .col-lg-6 {
        flex: 0 0 auto;
        width: 50%
    }

    .col-lg-8 {
        flex: 0 0 auto;
        width: 66.66666667%
    }

    .offset-lg-0 {
        margin-left: 0
    }

    .offset-lg-1 {
        margin-left: 8.33333333%
    }

    .offset-lg-2 {
        margin-left: 16.66666667%
    }

    .offset-lg-3 {
        margin-left: 25%
    }

    .offset-lg-4 {
        margin-left: 33.33333333%
    }

    .offset-lg-5 {
        margin-left: 41.66666667%
    }

    .offset-lg-6 {
        margin-left: 50%
    }

    .offset-lg-7 {
        margin-left: 58.33333333%
    }

    .offset-lg-8 {
        margin-left: 66.66666667%
    }

    .offset-lg-9 {
        margin-left: 75%
    }

    .offset-lg-10 {
        margin-left: 83.33333333%
    }

    .offset-lg-11 {
        margin-left: 91.66666667%
    }
}

@media(min-width: 1200px) {
    .col-xl-4 {
        flex: 0 0 auto;
        width: 33.33333333%
    }

    .col-xl-6 {
        flex: 0 0 auto;
        width: 50%
    }

    .col-xl-8 {
        flex: 0 0 auto;
        width: 66.66666667%
    }

    .offset-xl-0 {
        margin-left: 0
    }

    .offset-xl-1 {
        margin-left: 8.33333333%
    }

    .offset-xl-2 {
        margin-left: 16.66666667%
    }

    .offset-xl-3 {
        margin-left: 25%
    }

    .offset-xl-4 {
        margin-left: 33.33333333%
    }

    .offset-xl-5 {
        margin-left: 41.66666667%
    }

    .offset-xl-6 {
        margin-left: 50%
    }

    .offset-xl-7 {
        margin-left: 58.33333333%
    }

    .offset-xl-8 {
        margin-left: 66.66666667%
    }

    .offset-xl-9 {
        margin-left: 75%
    }

    .offset-xl-10 {
        margin-left: 83.33333333%
    }

    .offset-xl-11 {
        margin-left: 91.66666667%
    }
}

@media(min-width: 1400px) {
    .offset-xxl-0 {
        margin-left: 0
    }

    .offset-xxl-1 {
        margin-left: 8.33333333%
    }

    .offset-xxl-2 {
        margin-left: 16.66666667%
    }

    .offset-xxl-3 {
        margin-left: 25%
    }

    .offset-xxl-4 {
        margin-left: 33.33333333%
    }

    .offset-xxl-5 {
        margin-left: 41.66666667%
    }

    .offset-xxl-6 {
        margin-left: 50%
    }

    .offset-xxl-7 {
        margin-left: 58.33333333%
    }

    .offset-xxl-8 {
        margin-left: 66.66666667%
    }

    .offset-xxl-9 {
        margin-left: 75%
    }

    .offset-xxl-10 {
        margin-left: 83.33333333%
    }

    .offset-xxl-11 {
        margin-left: 91.66666667%
    }
}

.collapse:not(.show) {
    display: none
}

.clearfix::after {
    display: block;
    clear: both;
    content: ""
}

.ratio {
    position: relative;
    width: 100%
}

    .ratio::before {
        display: block;
        padding-top: var(--aspect-ratio);
        content: ""
    }

    .ratio > * {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%
    }

.ratio-1x1 {
    --aspect-ratio: 100%
}

.ratio-4x3 {
    --aspect-ratio: 75%
}

.ratio-16x9 {
    --aspect-ratio: 56.25%
}

.text-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.object-fit-cover {
    -o-object-fit: cover;
    object-fit: cover
}

.overflow-auto {
    overflow: auto
}

.overflow-hidden {
    overflow: hidden
}

.overflow-visible {
    overflow: visible
}

.overflow-scroll {
    overflow: scroll
}

.overflow-x-auto {
    overflow-x: auto
}

.overflow-x-hidden {
    overflow-x: hidden
}

.overflow-x-visible {
    overflow-x: visible
}

.overflow-x-scroll {
    overflow-x: scroll
}

.overflow-y-auto {
    overflow-y: auto
}

.overflow-y-hidden {
    overflow-y: hidden
}

.overflow-y-visible {
    overflow-y: visible
}

.overflow-y-scroll {
    overflow-y: scroll
}

.d-flex {
    display: flex
}

.border-1 {
    border-width: 1px
}

.flex-column {
    flex-direction: column
}

.flex-row-reverse {
    flex-direction: row-reverse
}

.flex-wrap {
    flex-wrap: wrap
}

.justify-content-start {
    justify-content: flex-start
}

.justify-content-end {
    justify-content: flex-end
}

.justify-content-center {
    justify-content: center
}

.justify-content-between {
    justify-content: space-between
}

.align-items-center {
    align-items: center
}

.align-content-center {
    align-content: center
}

.order-first {
    order: -1
}

.order-0 {
    order: 0
}

.order-1 {
    order: 1
}

.order-2 {
    order: 2
}

.order-3 {
    order: 3
}

.order-4 {
    order: 4
}

.order-5 {
    order: 5
}

.order-last {
    order: 6
}

.m-4 {
    margin: 1rem
}

.my-4 {
    margin-top: 1rem;
    margin-bottom: 1rem
}

.mt-1 {
    margin-top: .25rem
}

.mt-2 {
    margin-top: .5rem
}

.mt-4 {
    margin-top: 1rem
}

.mt-6 {
    margin-top: 1.5rem
}

.mt-8 {
    margin-top: 2rem
}

.mb-2 {
    margin-bottom: .5rem
}

.mb-4 {
    margin-bottom: 1rem
}

.mb-6 {
    margin-bottom: 1.5rem
}

.mb-8 {
    margin-bottom: 2rem
}

.p-4 {
    padding: 1rem
}

.p-6 {
    padding: 1.5rem
}

.py-8 {
    padding-top: 2rem;
    padding-bottom: 2rem
}

.gap-4 {
    gap: 1rem
}

.gap-8 {
    gap: 2rem
}

.row-gap-4 {
    row-gap: 1rem
}

.text-xs {
    font-size: var(--text-xs)
}

.text-sm {
    font-size: var(--text-sm)
}

.text-base {
    font-size: var(--text-base)
}

.text-lg {
    font-size: var(--text-lg)
}

.text-xl {
    font-size: var(--text-xl)
}

.text-2xl {
    font-size: var(--text-2xl)
}

.text-3xl {
    font-size: var(--text-3xl)
}

.text-4xl {
    font-size: var(--text-4xl)
}

.text-5xl {
    font-size: var(--text-5xl)
}

.text-center {
    text-align: center
}

.text-decoration-none {
    -webkit-text-decoration: none;
    text-decoration: none
}

.bg-gradient {
    background-image: var(--gradient)
}

.invisible {
    visibility: hidden
}

@media(min-width: 576px) {
    .order-sm-first {
        order: -1
    }

    .order-sm-0 {
        order: 0
    }

    .order-sm-1 {
        order: 1
    }

    .order-sm-2 {
        order: 2
    }

    .order-sm-3 {
        order: 3
    }

    .order-sm-4 {
        order: 4
    }

    .order-sm-5 {
        order: 5
    }

    .order-sm-last {
        order: 6
    }
}

@media(min-width: 768px) {
    .flex-md-row {
        flex-direction: row
    }

    .justify-content-md-end {
        justify-content: flex-end
    }

    .order-md-first {
        order: -1
    }

    .order-md-0 {
        order: 0
    }

    .order-md-1 {
        order: 1
    }

    .order-md-2 {
        order: 2
    }

    .order-md-3 {
        order: 3
    }

    .order-md-4 {
        order: 4
    }

    .order-md-5 {
        order: 5
    }

    .order-md-last {
        order: 6
    }

    .mt-md-0 {
        margin-top: 0
    }

    .mb-md-0 {
        margin-bottom: 0
    }

    .ms-md-4 {
        margin-left: 1rem
    }

    .pe-md-8 {
        padding-right: 2rem
    }

    .ps-md-8 {
        padding-left: 2rem
    }
}

@media(min-width: 992px) {
    .justify-content-lg-between {
        justify-content: space-between
    }

    .order-lg-first {
        order: -1
    }

    .order-lg-0 {
        order: 0
    }

    .order-lg-1 {
        order: 1
    }

    .order-lg-2 {
        order: 2
    }

    .order-lg-3 {
        order: 3
    }

    .order-lg-4 {
        order: 4
    }

    .order-lg-5 {
        order: 5
    }

    .order-lg-last {
        order: 6
    }

    .mt-lg-0 {
        margin-top: 0
    }

    .mb-lg-0 {
        margin-bottom: 0
    }
}

@media(min-width: 1200px) {
    .order-xl-first {
        order: -1
    }

    .order-xl-0 {
        order: 0
    }

    .order-xl-1 {
        order: 1
    }

    .order-xl-2 {
        order: 2
    }

    .order-xl-3 {
        order: 3
    }

    .order-xl-4 {
        order: 4
    }

    .order-xl-5 {
        order: 5
    }

    .order-xl-last {
        order: 6
    }
}

@media(min-width: 1400px) {
    .order-xxl-first {
        order: -1
    }

    .order-xxl-0 {
        order: 0
    }

    .order-xxl-1 {
        order: 1
    }

    .order-xxl-2 {
        order: 2
    }

    .order-xxl-3 {
        order: 3
    }

    .order-xxl-4 {
        order: 4
    }

    .order-xxl-5 {
        order: 5
    }

    .order-xxl-last {
        order: 6
    }
}

.container {
    --gutter-x: 1.5rem;
    --gutter-y: 0;
    width: 100%;
    padding-right: calc(var(--gutter-x)*.5);
    padding-left: calc(var(--gutter-x)*.5);
    margin-right: auto;
    margin-left: auto
}

@media(min-width: 576px) {
    .container {
        max-width: 540px
    }
}

@media(min-width: 768px) {
    .container {
        max-width: 720px
    }
}

@media(min-width: 992px) {
    .container {
        max-width: 960px
    }
}

@media(min-width: 1200px) {
    .container {
        max-width: 1140px
    }
}

@media(min-width: 1400px) {
    .container {
        max-width: 1320px
    }
}

:root {
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --breakpoint-xxl: 1400px
}

.row {
    --gutter-x: 1.5rem;
    --gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1*var(--gutter-y));
    margin-right: calc(-0.5*var(--gutter-x));
    margin-left: calc(-0.5*var(--gutter-x))
}

    .row > * {
        flex-shrink: 0;
        width: 100%;
        max-width: 100%;
        padding-right: calc(var(--gutter-x)*.5);
        padding-left: calc(var(--gutter-x)*.5);
        margin-top: var(--gutter-y)
    }

.col-4 {
    flex: 0 0 auto;
    width: 33.33333333%
}

.col-8 {
    flex: 0 0 auto;
    width: 66.66666667%
}

.col-12 {
    flex: 0 0 auto;
    width: 100%
}

.offset-1 {
    margin-left: 8.33333333%
}

.offset-2 {
    margin-left: 16.66666667%
}

.offset-3 {
    margin-left: 25%
}

.offset-4 {
    margin-left: 33.33333333%
}

.offset-5 {
    margin-left: 41.66666667%
}

.offset-6 {
    margin-left: 50%
}

.offset-7 {
    margin-left: 58.33333333%
}

.offset-8 {
    margin-left: 66.66666667%
}

.offset-9 {
    margin-left: 75%
}

.offset-10 {
    margin-left: 83.33333333%
}

.offset-11 {
    margin-left: 91.66666667%
}

@media(min-width: 576px) {
    .offset-sm-0 {
        margin-left: 0
    }

    .offset-sm-1 {
        margin-left: 8.33333333%
    }

    .offset-sm-2 {
        margin-left: 16.66666667%
    }

    .offset-sm-3 {
        margin-left: 25%
    }

    .offset-sm-4 {
        margin-left: 33.33333333%
    }

    .offset-sm-5 {
        margin-left: 41.66666667%
    }

    .offset-sm-6 {
        margin-left: 50%
    }

    .offset-sm-7 {
        margin-left: 58.33333333%
    }

    .offset-sm-8 {
        margin-left: 66.66666667%
    }

    .offset-sm-9 {
        margin-left: 75%
    }

    .offset-sm-10 {
        margin-left: 83.33333333%
    }

    .offset-sm-11 {
        margin-left: 91.66666667%
    }
}

@media(min-width: 768px) {
    .col-md-4 {
        flex: 0 0 auto;
        width: 33.33333333%
    }

    .col-md-5 {
        flex: 0 0 auto;
        width: 41.66666667%
    }

    .col-md-6 {
        flex: 0 0 auto;
        width: 50%
    }

    .col-md-8 {
        flex: 0 0 auto;
        width: 66.66666667%
    }

    .col-md-10 {
        flex: 0 0 auto;
        width: 83.33333333%
    }

    .col-md-12 {
        flex: 0 0 auto;
        width: 100%
    }

    .offset-md-0 {
        margin-left: 0
    }

    .offset-md-1 {
        margin-left: 8.33333333%
    }

    .offset-md-2 {
        margin-left: 16.66666667%
    }

    .offset-md-3 {
        margin-left: 25%
    }

    .offset-md-4 {
        margin-left: 33.33333333%
    }

    .offset-md-5 {
        margin-left: 41.66666667%
    }

    .offset-md-6 {
        margin-left: 50%
    }

    .offset-md-7 {
        margin-left: 58.33333333%
    }

    .offset-md-8 {
        margin-left: 66.66666667%
    }

    .offset-md-9 {
        margin-left: 75%
    }

    .offset-md-10 {
        margin-left: 83.33333333%
    }

    .offset-md-11 {
        margin-left: 91.66666667%
    }
}

@media(min-width: 992px) {
    .col-lg-4 {
        flex: 0 0 auto;
        width: 33.33333333%
    }

    .col-lg-5 {
        flex: 0 0 auto;
        width: 41.66666667%
    }

    .col-lg-6 {
        flex: 0 0 auto;
        width: 50%
    }

    .col-lg-8 {
        flex: 0 0 auto;
        width: 66.66666667%
    }

    .offset-lg-0 {
        margin-left: 0
    }

    .offset-lg-1 {
        margin-left: 8.33333333%
    }

    .offset-lg-2 {
        margin-left: 16.66666667%
    }

    .offset-lg-3 {
        margin-left: 25%
    }

    .offset-lg-4 {
        margin-left: 33.33333333%
    }

    .offset-lg-5 {
        margin-left: 41.66666667%
    }

    .offset-lg-6 {
        margin-left: 50%
    }

    .offset-lg-7 {
        margin-left: 58.33333333%
    }

    .offset-lg-8 {
        margin-left: 66.66666667%
    }

    .offset-lg-9 {
        margin-left: 75%
    }

    .offset-lg-10 {
        margin-left: 83.33333333%
    }

    .offset-lg-11 {
        margin-left: 91.66666667%
    }
}

@media(min-width: 1200px) {
    .col-xl-4 {
        flex: 0 0 auto;
        width: 33.33333333%
    }

    .col-xl-6 {
        flex: 0 0 auto;
        width: 50%
    }

    .col-xl-8 {
        flex: 0 0 auto;
        width: 66.66666667%
    }

    .offset-xl-0 {
        margin-left: 0
    }

    .offset-xl-1 {
        margin-left: 8.33333333%
    }

    .offset-xl-2 {
        margin-left: 16.66666667%
    }

    .offset-xl-3 {
        margin-left: 25%
    }

    .offset-xl-4 {
        margin-left: 33.33333333%
    }

    .offset-xl-5 {
        margin-left: 41.66666667%
    }

    .offset-xl-6 {
        margin-left: 50%
    }

    .offset-xl-7 {
        margin-left: 58.33333333%
    }

    .offset-xl-8 {
        margin-left: 66.66666667%
    }

    .offset-xl-9 {
        margin-left: 75%
    }

    .offset-xl-10 {
        margin-left: 83.33333333%
    }

    .offset-xl-11 {
        margin-left: 91.66666667%
    }
}

@media(min-width: 1400px) {
    .offset-xxl-0 {
        margin-left: 0
    }

    .offset-xxl-1 {
        margin-left: 8.33333333%
    }

    .offset-xxl-2 {
        margin-left: 16.66666667%
    }

    .offset-xxl-3 {
        margin-left: 25%
    }

    .offset-xxl-4 {
        margin-left: 33.33333333%
    }

    .offset-xxl-5 {
        margin-left: 41.66666667%
    }

    .offset-xxl-6 {
        margin-left: 50%
    }

    .offset-xxl-7 {
        margin-left: 58.33333333%
    }

    .offset-xxl-8 {
        margin-left: 66.66666667%
    }

    .offset-xxl-9 {
        margin-left: 75%
    }

    .offset-xxl-10 {
        margin-left: 83.33333333%
    }

    .offset-xxl-11 {
        margin-left: 91.66666667%
    }
}

.collapse:not(.show) {
    display: none
}

.clearfix::after {
    display: block;
    clear: both;
    content: ""
}

.ratio {
    position: relative;
    width: 100%
}

    .ratio::before {
        display: block;
        padding-top: var(--aspect-ratio);
        content: ""
    }

    .ratio > * {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%
    }

.ratio-1x1 {
    --aspect-ratio: 100%
}

.ratio-4x3 {
    --aspect-ratio: 75%
}

.ratio-16x9 {
    --aspect-ratio: 56.25%
}

.text-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.object-fit-cover {
    -o-object-fit: cover;
    object-fit: cover
}

.overflow-auto {
    overflow: auto
}

.overflow-hidden {
    overflow: hidden
}

.overflow-visible {
    overflow: visible
}

.overflow-scroll {
    overflow: scroll
}

.overflow-x-auto {
    overflow-x: auto
}

.overflow-x-hidden {
    overflow-x: hidden
}

.overflow-x-visible {
    overflow-x: visible
}

.overflow-x-scroll {
    overflow-x: scroll
}

.overflow-y-auto {
    overflow-y: auto
}

.overflow-y-hidden {
    overflow-y: hidden
}

.overflow-y-visible {
    overflow-y: visible
}

.overflow-y-scroll {
    overflow-y: scroll
}

.d-flex {
    display: flex
}

.border-1 {
    border-width: 1px
}

.flex-column {
    flex-direction: column
}

.flex-row-reverse {
    flex-direction: row-reverse
}

.flex-wrap {
    flex-wrap: wrap
}

.justify-content-start {
    justify-content: flex-start
}

.justify-content-end {
    justify-content: flex-end
}

.justify-content-center {
    justify-content: center
}

.justify-content-between {
    justify-content: space-between
}

.align-items-center {
    align-items: center
}

.align-content-center {
    align-content: center
}

.order-first {
    order: -1
}

.order-0 {
    order: 0
}

.order-1 {
    order: 1
}

.order-2 {
    order: 2
}

.order-3 {
    order: 3
}

.order-4 {
    order: 4
}

.order-5 {
    order: 5
}

.order-last {
    order: 6
}

.m-4 {
    margin: 1rem
}

.my-4 {
    margin-top: 1rem;
    margin-bottom: 1rem
}

.mt-1 {
    margin-top: .25rem
}

.mt-2 {
    margin-top: .5rem
}

.mt-4 {
    margin-top: 1rem
}

.mt-6 {
    margin-top: 1.5rem
}

.mt-8 {
    margin-top: 2rem
}

.mb-2 {
    margin-bottom: .5rem
}

.mb-4 {
    margin-bottom: 1rem
}

.mb-6 {
    margin-bottom: 1.5rem
}

.mb-8 {
    margin-bottom: 2rem
}

.p-4 {
    padding: 1rem
}

.p-6 {
    padding: 1.5rem
}

.py-8 {
    padding-top: 2rem;
    padding-bottom: 2rem
}

.gap-4 {
    gap: 1rem
}

.gap-8 {
    gap: 2rem
}

.row-gap-4 {
    row-gap: 1rem
}

.text-xs {
    font-size: var(--text-xs)
}

.text-sm {
    font-size: var(--text-sm)
}

.text-base {
    font-size: var(--text-base)
}

.text-lg {
    font-size: var(--text-lg)
}

.text-xl {
    font-size: var(--text-xl)
}

.text-2xl {
    font-size: var(--text-2xl)
}

.text-3xl {
    font-size: var(--text-3xl)
}

.text-4xl {
    font-size: var(--text-4xl)
}

.text-5xl {
    font-size: var(--text-5xl)
}

.text-center {
    text-align: center
}

.text-decoration-none {
    -webkit-text-decoration: none;
    text-decoration: none
}

.bg-gradient {
    background-image: var(--gradient)
}

.invisible {
    visibility: hidden
}

@media(min-width: 576px) {
    .order-sm-first {
        order: -1
    }

    .order-sm-0 {
        order: 0
    }

    .order-sm-1 {
        order: 1
    }

    .order-sm-2 {
        order: 2
    }

    .order-sm-3 {
        order: 3
    }

    .order-sm-4 {
        order: 4
    }

    .order-sm-5 {
        order: 5
    }

    .order-sm-last {
        order: 6
    }
}

@media(min-width: 768px) {
    .flex-md-row {
        flex-direction: row
    }

    .justify-content-md-end {
        justify-content: flex-end
    }

    .order-md-first {
        order: -1
    }

    .order-md-0 {
        order: 0
    }

    .order-md-1 {
        order: 1
    }

    .order-md-2 {
        order: 2
    }

    .order-md-3 {
        order: 3
    }

    .order-md-4 {
        order: 4
    }

    .order-md-5 {
        order: 5
    }

    .order-md-last {
        order: 6
    }

    .mt-md-0 {
        margin-top: 0
    }

    .mb-md-0 {
        margin-bottom: 0
    }

    .ms-md-4 {
        margin-left: 1rem
    }

    .pe-md-8 {
        padding-right: 2rem
    }

    .ps-md-8 {
        padding-left: 2rem
    }
}

@media(min-width: 992px) {
    .justify-content-lg-between {
        justify-content: space-between
    }

    .order-lg-first {
        order: -1
    }

    .order-lg-0 {
        order: 0
    }

    .order-lg-1 {
        order: 1
    }

    .order-lg-2 {
        order: 2
    }

    .order-lg-3 {
        order: 3
    }

    .order-lg-4 {
        order: 4
    }

    .order-lg-5 {
        order: 5
    }

    .order-lg-last {
        order: 6
    }

    .mt-lg-0 {
        margin-top: 0
    }

    .mb-lg-0 {
        margin-bottom: 0
    }
}

@media(min-width: 1200px) {
    .order-xl-first {
        order: -1
    }

    .order-xl-0 {
        order: 0
    }

    .order-xl-1 {
        order: 1
    }

    .order-xl-2 {
        order: 2
    }

    .order-xl-3 {
        order: 3
    }

    .order-xl-4 {
        order: 4
    }

    .order-xl-5 {
        order: 5
    }

    .order-xl-last {
        order: 6
    }
}

@media(min-width: 1400px) {
    .order-xxl-first {
        order: -1
    }

    .order-xxl-0 {
        order: 0
    }

    .order-xxl-1 {
        order: 1
    }

    .order-xxl-2 {
        order: 2
    }

    .order-xxl-3 {
        order: 3
    }

    .order-xxl-4 {
        order: 4
    }

    .order-xxl-5 {
        order: 5
    }

    .order-xxl-last {
        order: 6
    }
}

:root {
    --font-base: Inter, arial, helvetica, sans-serif;
    --scale: 1.2;
    --font-size-base: 1rem;
    --text-base: var(--font-size-base);
    --text-sm: calc(var(--text-base) / var(--scale));
    --text-xs: calc(var(--text-sm) / var(--scale));
    --text-lg: calc(var(--text-base) * var(--scale));
    --text-xl: calc(var(--text-lg) * var(--scale));
    --text-2xl: calc(var(--text-xl) * var(--scale));
    --text-3xl: calc(var(--text-2xl) * var(--scale));
    --text-4xl: calc(var(--text-3xl) * var(--scale));
    --text-5xl: calc(var(--text-4xl) * var(--scale));
    --text-6xl: calc(var(--text-5xl) * var(--scale));
    --headline-1: var(--text-4xl);
    --headline-2: var(--text-3xl);
    --headline-3: var(--text-2xl);
    --headline-4: var(--text-xl);
    --headline-5: var(--text-lg);
    --headline-6: var(--text-base);
    --display-1: var(--text-3xl);
    --preamble: var(--text-lg)
}

:root {
    --font-weight-normal: var(--font-weight-normal);
    --font-weight-medium: var(--font-weight-medium);
    --font-weight-bold: var(--font-weight-bold);
    --font-weight-bolder: var(--font-weight-bolder);
    --fw-normal: 400;
    --fw-medium: 500;
    --fw-bold: 700;
    --fw-bolder: 900
}

    :root .font-bold {
        font-weight: 700
    }

:root {
    --color-white: hsl(0, 0%, 100%);
    --color-black: hsl(0, 0%, 0%);
    --color-yellow: hsl(201, 63%, 51%);
    --color-gray-100: hsl(0, 0%, 96%);
    --color-gray-200: hsl(0, 0%, 58%);
    --color-gray-300: hsl(0, 0%, 50%);
    --color-gray-400: hsl(0, 0%, 33%);
    --bg-white: hsl(0, 0%, 100%);
    --bg-black: hsl(0, 0%, 0%)
}

:root {
    --stack-none: 0;
    --stack-sm: 1.5em;
    --stack-md: 3em;
    --stack-lg: 4em;
    --stack-xl: 5em;
    --stack-xxl: 6.5em;
    --stack-xxxl: 8em;
    --section-stack: var(--stack-xl)
}

@media(min-width: 1400px) {
    :root {
        --section-stack: var(--stack-xxl)
    }
}

[data-stack-size] {
    --stack: var(--stack-md);
    --stack-start: var(--stack-md);
    --stack-end: var(--stack-md)
}

[data-stack-size=none] {
    --stack-start: var(--stack-none);
    --stack-end: var(--stack-none)
}

[data-stack-size=xl] {
    --stack-start: var(--stack-xl);
    --stack-end: var(--stack-sm)
}

@media(min-width: 768px) {
    :root {
        --display-1: var(--text-4xl)
    }
}

@media(min-width: 1200px) {
    :root {
        --display-1: var(--text-6xl);
        --headline-1: var(--text-5xl);
        --headline-2: var(--text-4xl);
        --headline-3: var(--text-3xl);
        --headline-4: var(--text-2xl);
        --headline-5: var(--text-xl);
        --headline-6: var(--text-lg)
    }
}

img:not([src]):not([srcset]) {
    visibility: hidden
}

.lazy {
    display: block
}

.no-js .lazy {
    display: none
}

.font-bold {
    font-weight: var(--font-bold)
}

h1, h2, h3, h4, .headline-1, .headline-2 {
    font-weight: var(--font-bolder);
    line-height: calc(3px + 2ex + 3px)
}

h1, .headline-1 {
    margin-bottom: .85em;
    font-size: var(--text-3xl)
}

h2, .headline-2 {
    margin-bottom: .5em;
    font-size: var(--text-2xl)
}

h3 {
    margin-bottom: .5em;
    font-size: var(--text-xl)
}

h4 {
    font-size: var(--text-lg)
}

.display-1 {
    font-size: var(--display-1);
    font-weight: var(--fw-bold)
}

@media(min-width: 992px) {
    h1, .headline-1 {
        margin-bottom: .85em;
        font-size: var(--text-4xl)
    }

    h2, .headline-2 {
        margin-bottom: .5em;
        font-size: var(--text-3xl)
    }

    h3 {
        margin-bottom: .5em;
        font-size: var(--text-2xl)
    }

    h4 {
        font-size: var(--text-xl)
    }
}

.preamble {
    margin-bottom: 3em;
    font-size: var(--preamble)
}

.text-balance {
    text-wrap: balance
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: normal;
    font-weight: 400;
    src: url(/dist/fonts/inter-v13-latin-regular.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: normal;
    font-weight: 500;
    src: url(/dist/fonts/inter-v13-latin-500.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: normal;
    font-weight: 700;
    src: url(/dist/fonts/inter-v13-latin-700.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: normal;
    font-weight: 900;
    src: url(/dist/fonts/inter-v13-latin-900.woff2) format("woff2")
}

:root .text-white {
    color: var(--color-white)
}

:root .text-gray-light {
    color: var(--color-gray-200)
}

:root .text-gray-dark {
    color: var(--color-gray-400)
}

:root .text-yellow {
    color: var(--color-yellow)
}

:root .bg-white {
    --bg-opacity: 1;
    background-color: var(--color-white)
}

:root .bg-black {
    --bg-opacity: 1;
    background-color: var(--color-black)
}

:root .bg-yellow {
    --bg-opacity: 1;
    background-color: var(--color-yellow)
}

:root .bg-gray-100 {
    --bg-opacity: 1;
    background-color: var(--color-gray-100)
}

:root .color-white {
    background-color: hsl(0, 0%, 100%)
}

:root .color-black {
    background-color: hsl(0, 0%, 0%)
}

:root .color-gray-100 {
    background-color: hsl(0, 0%, 96%)
}

:root .color-gray-200 {
    background-color: hsl(0, 0%, 58%)
}

:root .color-gray-300 {
    background-color: hsl(0, 0%, 50%)
}

:root .color-yellow {
    background-color: hsl(201, 63%, 51%)
}

*, ::after, ::before {
    border-width: 0;
    border-style: solid;
    border-color: var(--border-color, var(--primary-border-color))
}

body {
    --_body-background: var(--body-background, var(--color-white));
    margin: 0;
    background-color: var(--_body-background);
    color: hsl(var(--body-text, var(--body-primary-text)));
    font-family: var(--font-base);
    font-weight: var(--fw-normal);
    line-height: 1.5
}

.servicespage, .projectspage {
    --body-background: var(--color-gray-100)
}

.button {
    display: inline-flex;
    min-width: 170px;
    justify-content: center;
    padding: .75rem 1rem;
    border: 2px solid var(--color-white);
    background-color: var(--color-white);
    color: var(--color-black);
    cursor: pointer;
    font-weight: 700
}

.button--outlined {
    border-color: var(--color-yellow);
    background-color: var(--color-transparent);
    color: var(--color-white)
}

.link {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    font-weight: var(--fw-bold)
}

    .link::after {
        width: 22px;
        height: 18px;
        margin-left: .5rem;
        content: url("data:image/svg+xml,%3Csvg%20width%3D%2222%22%20height%3D%2216%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M21.707%208.707a1%201%200%200%200%200-1.414L15.343.929a1%201%200%201%200-1.414%201.414L19.586%208l-5.657%205.657a1%201%200%200%200%201.414%201.414l6.364-6.364ZM0%209h21V7H0v2Z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
        transform: translateX(0);
        transition: transform .1s ease-in
    }

    .link:hover::after {
        transform: translateX(5px)
    }

.list ul {
    margin: 1rem 0
}

    .list ul li {
        margin: 1rem 0;
        font-size: var(--text-lg)
    }

.list .checkmark li {
    display: flex
}

    .list .checkmark li::before {
        width: 22px;
        height: 18px;
        margin-right: 1rem;
        content: url("data:image/svg+xml,%3Csvg%20width%3D%2221%22%20height%3D%2216%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20stroke%3D%22%23339BD1%22%20stroke-width%3D%223%22%20d%3D%22m1.061%207.939%206%206M19.021%201.099l-14%2013%22%2F%3E%3C%2Fsvg%3E")
    }

[data-stack-size] .container {
    position: relative;
    padding-top: var(--stack-start);
    padding-bottom: var(--stack-end)
}

.prose h1, .prose h2, .prose h3, .prose h4 {
    margin-bottom: .75em
}

    .prose h1 + *, .prose h2 + *, .prose h3 + *, .prose h4 + * {
        margin-bottom: 1em
    }

.prose ul li {
    margin: .75rem 0;
    font-size: var(--text-base)
}

.prose ul, .prose ol {
    margin-top: 1.75em;
    margin-bottom: 1.75em;
    list-style-position: inside;
    list-style-type: disc
}

    .prose ul li, .prose ol li {
        margin-bottom: .75em
    }

    .prose ul + *, .prose ol + * {
        margin-top: 1em
    }

.prose__header {
    font-size: var(--text-2xl);
    font-weight: var(--fw-bold)
}

@media(min-width: 768px) {
    .prose__header {
        font-size: var(--text-3xl)
    }
}

@media(min-width: 992px) {
    .prose__header {
        font-size: var(--text-4xl)
    }
}

.prose .header-highlight {
    position: relative;
    white-space: nowrap
}

    .prose .header-highlight::before {
        position: absolute;
        z-index: -1;
        top: 18px;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 14px;
        background: var(--color-yellow);
        content: ""
    }

@media(min-width: 768px) {
    .prose .header-highlight::before {
        top: 25px
    }
}

@media(min-width: 992px) {
    .prose .header-highlight::before {
        top: 30px
    }
}

.prose p {
    margin-bottom: 1.25em
}

    .prose p:last-of-type {
        margin-bottom: 0
    }

.backofficelink {
    position: fixed;
    z-index: 99999999;
    top: 0;
    right: 0;
    padding: .5em;
    border-radius: 0 0 0 8px;
    background: hsl(var(--color-black))
}

    .backofficelink a {
        color: hsl(var(--color-white));
        -webkit-text-decoration: none;
        text-decoration: none
    }

.header {
    position: absolute;
    z-index: 9999;
    right: 0;
    left: 0;
    padding: .75rem
}

@media(min-width: 768px) {
    .header {
        padding: 2rem 0
    }
}

.header__logo-wrapper {
    max-width: 13.5rem
}

.header__logo {
    width: 100%;
    height: 100%
}

.header__link-list {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2.5rem;
    margin-top: 6rem;
    color: var(--color-white);
    gap: 2rem
}

@media(min-width: 768px) {
    .header__link-list {
        flex-direction: row;
        justify-content: flex-end;
        padding: 0;
        margin-top: 0
    }
}

.header__link {
    position: relative;
    display: inline-block;
    color: var(--color-black);
    cursor: pointer;
    font-size: var(--text-lg);
    font-weight: var(--fw-bold);
    letter-spacing: 1px
}

@media(min-width: 768px) {
    .header__link {
        color: var(--color-white);
        font-size: var(--text-base)
    }
}

.header__link::before {
    position: absolute;
    z-index: -1;
    bottom: -4px;
    left: 50%;
    width: 0;
    height: 2px;
    background: var(--color-yellow);
    content: "";
    transition: all .25s ease
}

.header__link:hover::before, .header__link[aria-current=page]::before {
    left: 0;
    width: 100%
}

.footer {
    padding: 3.25rem 0;
    margin-top: 3rem;
    background-color: var(--color-black);
    color: var(--color-white);
    font-weight: var(--fw-bold)
}

@media(min-width: 768px) {
    .footer {
        padding: 6.25rem 0;
        margin-top: 4rem
    }
}

.footer h2 {
    text-wrap: balance
}

.footer__button-group {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-top: 1.5rem;
    gap: 1rem
}

@media(min-width: 768px) {
    .footer__button-group {
        flex-direction: row;
        justify-content: flex-end;
        margin-top: 0;
        gap: 2rem
    }
}

.footer__divider {
    padding: 0 12px;
    border-bottom: 1px solid var(--color-gray-300);
    margin: 3rem 0
}

@media(min-width: 768px) {
    .footer__divider {
        margin: 3rem 0
    }
}

.footer__bottom {
    display: flex;
    flex-direction: column-reverse
}

@media(min-width: 768px) {
    .footer__bottom {
        flex-direction: row
    }
}

.footer__link-list {
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    justify-content: space-between;
    margin: 1.5rem 0 0
}

@media(min-width: 768px) {
    .footer__link-list {
        flex-direction: row;
        margin: 0
    }
}

.footer__link {
    margin: .5rem 0;
    color: var(--color-gray-300);
    font-size: var(--text-base);
    font-weight: var(--fw-normal)
}

@media(min-width: 768px) {
    .footer__link {
        margin: 0
    }
}

.footer__link a {
    -webkit-text-decoration: none;
    text-decoration: none
}

    .footer__link a:hover {
        -webkit-text-decoration: underline;
        text-decoration: underline
    }

.footer__socials {
    display: block;
    width: 25px;
    height: 25px
}

    .footer__socials svg {
        fill: var(--color-gray-300)
    }

        .footer__socials svg:hover {
            fill: var(--color-yellow)
        }

.certificate-image {
    max-width: 60px
}

.hero {
    display: grid;
    height: 100%;
    grid-template-rows: 800px
}

@media(min-width: 576px) {
    .hero {
        grid-template-rows: 730px
    }
}

.hero--small {
    grid-template-rows: 445px
}

.hero__media {
    grid-column: 1;
    grid-row: 1
}

    .hero__media .hero__media-item {
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: center;
        object-position: center
    }

.hero__content {
    z-index: 1;
    display: grid;
    padding: 8rem 1rem 3rem;
    color: var(--color-white);
    grid-column: 1;
    grid-row: 1;
    align-content: center;
    justify-content: center;
    place-content: center;
    text-align: center
}

@media(min-width: 768px) {
    .hero__content {
        padding: 8rem 1rem 5rem
    }
}

.hero__content h1 {
    margin-bottom: 1rem;
    text-wrap: balance
}

.hero__content p {
    max-width: 80%;
    text-wrap: balance
}

.hero--standard {
    grid-template-rows: 600px
}

@media(min-width: 576px) {
    .hero--standard {
        grid-template-rows: 730px
    }
}

.hero--standard .hero__content {
    padding: 5rem 1rem 8rem
}

.hero__button-group {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-top: 2.75rem;
    gap: 1rem
}

@media(min-width: 768px) {
    .hero__button-group {
        flex-direction: row;
        gap: 2rem
    }
}

.hero .hero__toggle-play {
    position: absolute;
    z-index: 9;
    top: 7em;
    right: 1em;
    display: flex;
    align-items: flex-end;
    padding: .5ex 1.25ex;
    background-color: rgba(0,0,0,.75);
    color: var(--color-yellow);
    cursor: pointer;
    font-size: .75em;
    font-size: 1.35ex;
    text-transform: uppercase
}

@media(min-width: 768px) {
    .hero .hero__toggle-play {
        z-index: 99999;
        top: 1em
    }
}

.hero .hero__toggle-play .hero__toggle-play__state {
    position: relative;
    display: inline-block;
    width: 1.75em;
    height: 1.75em;
    margin-right: 1ex
}

    .hero .hero__toggle-play .hero__toggle-play__state::before {
        position: absolute;
        width: 100%;
        height: 100%;
        border: 0;
        background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2724%27 height=%2724%27 fill=%27none%27 stroke=%27white%27 stroke-width=%271%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 class=%27icon-play-circle%27%3E%3Ccircle cx=%2712%27 cy=%2712%27 r=%2710%27/%3E%3Cpath d=%27M10 8l6 4-6 4V8z%27/%3E%3C/svg%3E");
        background-position: center;
        background-size: 100%;
        content: "";
        top: 0;
        right: 0;
        bottom: 0;
        left: 0
    }

.hero .hero__toggle-play[aria-pressed=true] .hero__toggle-play__state::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23fff%27 stroke-width=%271%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 class=%27icon-circle-pause%27%3E%3Ccircle cx=%2712%27 cy=%2712%27 r=%2710%27%3E%3C/circle%3E%3Cline x1=%2710%27 y1=%2715%27 x2=%2710%27 y2=%279%27%3E%3C/line%3E%3Cline x1=%2714%27 y1=%2715%27 x2=%2714%27 y2=%279%27%3E%3C/line%3E%3C/svg%3E%0A")
}

.hero-brightness-0 {
    -webkit-backdrop-filter: brightness(0);
    backdrop-filter: brightness(0)
}

.hero-brightness-5 {
    -webkit-backdrop-filter: brightness(0.05);
    backdrop-filter: brightness(0.05)
}

.hero-brightness-10 {
    -webkit-backdrop-filter: brightness(0.1);
    backdrop-filter: brightness(0.1)
}

.hero-brightness-15 {
    -webkit-backdrop-filter: brightness(0.15);
    backdrop-filter: brightness(0.15)
}

.hero-brightness-20 {
    -webkit-backdrop-filter: brightness(0.2);
    backdrop-filter: brightness(0.2)
}

.hero-brightness-25 {
    -webkit-backdrop-filter: brightness(0.25);
    backdrop-filter: brightness(0.25)
}

.hero-brightness-30 {
    -webkit-backdrop-filter: brightness(0.3);
    backdrop-filter: brightness(0.3)
}

.hero-brightness-35 {
    -webkit-backdrop-filter: brightness(0.35);
    backdrop-filter: brightness(0.35)
}

.hero-brightness-40 {
    -webkit-backdrop-filter: brightness(0.4);
    backdrop-filter: brightness(0.4)
}

.hero-brightness-45 {
    -webkit-backdrop-filter: brightness(0.45);
    backdrop-filter: brightness(0.45)
}

.hero-brightness-50 {
    -webkit-backdrop-filter: brightness(0.5);
    backdrop-filter: brightness(0.5)
}

.hero-brightness-55 {
    -webkit-backdrop-filter: brightness(0.55);
    backdrop-filter: brightness(0.55)
}

.hero-brightness-60 {
    -webkit-backdrop-filter: brightness(0.6);
    backdrop-filter: brightness(0.6)
}

.hero-brightness-65 {
    -webkit-backdrop-filter: brightness(0.65);
    backdrop-filter: brightness(0.65)
}

.hero-brightness-70 {
    -webkit-backdrop-filter: brightness(0.7);
    backdrop-filter: brightness(0.7)
}

.hero-brightness-75 {
    -webkit-backdrop-filter: brightness(0.75);
    backdrop-filter: brightness(0.75)
}

.hero-brightness-80 {
    -webkit-backdrop-filter: brightness(0.8);
    backdrop-filter: brightness(0.8)
}

.hero-brightness-85 {
    -webkit-backdrop-filter: brightness(0.85);
    backdrop-filter: brightness(0.85)
}

.hero-brightness-90 {
    -webkit-backdrop-filter: brightness(0.9);
    backdrop-filter: brightness(0.9)
}

.hero-brightness-95 {
    -webkit-backdrop-filter: brightness(0.95);
    backdrop-filter: brightness(0.95)
}

.hero-brightness-100 {
    -webkit-backdrop-filter: brightness(1);
    backdrop-filter: brightness(1)
}

.card__overlap-container {
    position: relative;
    z-index: 999;
    margin-top: -11rem
}

@media(min-width: 992px) {
    .card__overlap-container {
        margin-top: -9rem
    }
}

.service-card {
    padding: 3rem 1.5rem;
    margin-bottom: 2rem;
    background: var(--color-black);
    color: var(--color-white)
}

@media(min-width: 768px) {
    .service-card {
        padding: 4rem;
        margin-bottom: 4rem
    }
}

.projects-card {
    margin-bottom: 2rem;
    background-color: var(--color-white)
}

@media(min-width: 768px) {
    .projects-card {
        margin-bottom: 4rem
    }
}

.projects-card__content {
    padding: 2rem
}

@media(min-width: 576px) {
    .projects-card__content {
        padding: 3rem
    }
}

@media(min-width: 576px) {
    .projects-card__content {
        padding: 4rem
    }
}

.projects-card__header {
    margin-bottom: 0
}

.projects-card__image {
    height: 100%
}

    .projects-card__image img {
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover
    }

.hamburger {
    position: relative;
    z-index: 9999;
    cursor: pointer
}

@media(min-width: 768px) {
    .hamburger {
        display: none
    }
}

.hamburger__bar {
    width: 25px;
    height: 3px;
    margin: 5px 0;
    background-color: var(--color-white);
    transition: all .3s ease-in-out
}

.hamburger[aria-expanded=true] .hamburger__bar {
    background-color: var(--color-black)
}

    .hamburger[aria-expanded=true] .hamburger__bar:nth-child(1) {
        transform: translateY(8px) rotate(45deg)
    }

    .hamburger[aria-expanded=true] .hamburger__bar:nth-child(2) {
        opacity: 0
    }

    .hamburger[aria-expanded=true] .hamburger__bar:nth-child(3) {
        transform: translateY(-8px) rotate(-45deg)
    }

@media(max-width: 767.98px) {
    .menu__container {
        position: fixed;
        z-index: 1000;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background-color: var(--color-white);
        opacity: 0;
        transform: translateY(-100%);
        transition: opacity .2s ease-in-out, transform .3s ease-in-out
    }
}

.menu__container[aria-hidden=true] {
    opacity: 0;
    transform: translateY(-100%);
    transition: transform .3s ease-in-out;
    visibility: hidden
}

.menu__container[aria-hidden=false] {
    display: block;
    opacity: 1;
    transform: translateY(0);
    visibility: visible
}