#cc-main {
    background: transparent;
    color: var(--cc-primary-color);
    font-family: var(--cc-font-family);
    font-size: 16px;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.15;
    position: relative;
    text-rendering: optimizeLegibility;
    -webkit-text-size-adjust: 100%;
    position: fixed;
    z-index: var(--cc-z-index)
}

#cc-main :after,
#cc-main :before,
#cc-main a,
#cc-main button,
#cc-main div,
#cc-main h2,
#cc-main input,
#cc-main p,
#cc-main span {
    all: unset;
    box-sizing: border-box
}

#cc-main .pm__badge,
#cc-main button {
    all: initial;
    box-sizing: border-box;
    color: unset;
    visibility: unset
}

#cc-main .pm__badge,
#cc-main a,
#cc-main button,
#cc-main input {
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;
    font-family: inherit;
    font-size: 100%;
    line-height: normal;
    margin: 0;
    outline: revert;
    outline-offset: 2px;
    overflow: hidden
}

#cc-main table,
#cc-main tbody,
#cc-main td,
#cc-main th,
#cc-main thead,
#cc-main tr {
    all: revert;
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit
}

:root {
    --cc-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    --cc-modal-border-radius: .5rem;
    --cc-btn-border-radius: .4rem;
    --cc-modal-transition-duration: .25s;
    --cc-link-color: var(--cc-btn-primary-bg);
    --cc-modal-margin: 1rem;
    --cc-z-index: 2147483647;
    --cc-bg: #fff;
    --cc-primary-color: #2c2f31;
    --cc-secondary-color: #5e6266;
    --cc-btn-primary-bg: #30363c;
    --cc-btn-primary-color: #fff;
    --cc-btn-primary-border-color: var(--cc-btn-primary-bg);
    --cc-btn-primary-hover-bg: #000;
    --cc-btn-primary-hover-color: #fff;
    --cc-btn-primary-hover-border-color: var(--cc-btn-primary-hover-bg);
    --cc-btn-secondary-bg: #eaeff2;
    --cc-btn-secondary-color: var(--cc-primary-color);
    --cc-btn-secondary-border-color: var(--cc-btn-secondary-bg);
    --cc-btn-secondary-hover-bg: #d4dae0;
    --cc-btn-secondary-hover-color: #000;
    --cc-btn-secondary-hover-border-color: #d4dae0;
    --cc-separator-border-color: #f0f4f7;
    --cc-toggle-on-bg: var(--cc-btn-primary-bg);
    --cc-toggle-off-bg: #667481;
    --cc-toggle-on-knob-bg: #fff;
    --cc-toggle-off-knob-bg: var(--cc-toggle-on-knob-bg);
    --cc-toggle-enabled-icon-color: var(--cc-bg);
    --cc-toggle-disabled-icon-color: var(--cc-bg);
    --cc-toggle-readonly-bg: #d5dee2;
    --cc-toggle-readonly-knob-bg: #fff;
    --cc-toggle-readonly-knob-icon-color: var(--cc-toggle-readonly-bg);
    --cc-section-category-border: var(--cc-cookie-category-block-bg);
    --cc-cookie-category-block-bg: #f0f4f7;
    --cc-cookie-category-block-border: #f0f4f7;
    --cc-cookie-category-block-hover-bg: #e9eff4;
    --cc-cookie-category-block-hover-border: #e9eff4;
    --cc-cookie-category-expanded-block-bg: transparent;
    --cc-cookie-category-expanded-block-hover-bg: #dee4e9;
    --cc-overlay-bg: rgba(0, 0, 0, .65);
    --cc-webkit-scrollbar-bg: var(--cc-section-category-border);
    --cc-webkit-scrollbar-hover-bg: var(--cc-btn-primary-hover-bg);
    --cc-footer-bg: var(--cc-btn-secondary-bg);
    --cc-footer-color: var(--cc-secondary-color);
    --cc-footer-border-color: #e4eaed;
    --cc-pm-toggle-border-radius: 4em
}

#cc-main.cc--rtl {
    direction: rtl
}

#cc-main .cm__title,
#cc-main a,
#cc-main b,
#cc-main em,
#cc-main strong {
    font-weight: 600
}

#cc-main button>span {
    pointer-events: none
}

#cc-main .cc__link,
#cc-main a {
    background-image: linear-gradient(currentColor, currentColor);
    background-position: 0 100%;
    background-repeat: no-repeat;
    background-size: 0 1px;
    font-weight: 600;
    position: relative;
    transition: background-size .25s, color .25s ease
}

#cc-main .cc__link:hover,
#cc-main a:hover {
    background-size: 100% 1px;
    color: var(--cc-primary-color)
}

#cc-main .cc__link {
    color: var(--cc-link-color)
}

#cc-main .cm__desc,
#cc-main .pm__body {
    overscroll-behavior: auto contain;
    scrollbar-width: thin
}

@media screen and (min-width:640px) {

    #cc-main ::-webkit-scrollbar,
    #cc-main ::-webkit-scrollbar-thumb,
    #cc-main ::-webkit-scrollbar-track {
        all: revert
    }

    #cc-main ::-webkit-scrollbar-thumb {
        -webkit-background-clip: padding-box;
        background-clip: padding-box;
        background: var(--cc-toggle-readonly-bg);
        border: .25rem solid var(--cc-bg);
        border-radius: 1rem
    }

    #cc-main ::-webkit-scrollbar-thumb:hover {
        background: var(--cc-toggle-off-bg)
    }

    #cc-main ::-webkit-scrollbar {
        background: transparent;
        width: 12px
    }
}

html.disable--interaction.show--consent,
html.disable--interaction.show--consent body {
    height: auto !important;
    overflow: hidden !important
}

@media (prefers-reduced-motion) {
    #cc-main {
        --cc-modal-transition-duration: 0s
    }
}

.cc--darkmode {
    --cc-bg: #161a1c;
    --cc-primary-color: #ebf3f6;
    --cc-secondary-color: #aebbc5;
    --cc-btn-primary-bg: #c2d0e0;
    --cc-btn-primary-color: var(--cc-bg);
    --cc-btn-primary-border-color: var(--cc-btn-primary-bg);
    --cc-btn-primary-hover-bg: #98a7b6;
    --cc-btn-primary-hover-color: #000;
    --cc-btn-primary-hover-border-color: var(--cc-btn-primary-hover-bg);
    --cc-btn-secondary-bg: #242c31;
    --cc-btn-secondary-color: var(--cc-primary-color);
    --cc-btn-secondary-border-color: var(--cc-btn-secondary-bg);
    --cc-btn-secondary-hover-bg: #353d43;
    --cc-btn-secondary-hover-color: #fff;
    --cc-btn-secondary-hover-border-color: var(--cc-btn-secondary-hover-bg);
    --cc-separator-border-color: #222a30;
    --cc-toggle-on-bg: var(--cc-btn-primary-bg);
    --cc-toggle-off-bg: #525f6b;
    --cc-toggle-on-knob-bg: var(--cc-btn-primary-color);
    --cc-toggle-off-knob-bg: var(--cc-btn-primary-color);
    --cc-toggle-enabled-icon-color: var(--cc-btn-primary-color);
    --cc-toggle-disabled-icon-color: var(--cc-btn-primary-color);
    --cc-toggle-readonly-bg: #343e45;
    --cc-toggle-readonly-knob-bg: #5f6b72;
    --cc-toggle-readonly-knob-icon-color: var(--cc-toggle-readonly-bg);
    --cc-section-category-border: #1e2428;
    --cc-cookie-category-block-bg: #1e2428;
    --cc-cookie-category-block-border: var(--cc-section-category-border);
    --cc-cookie-category-block-hover-bg: #242c31;
    --cc-cookie-category-block-hover-border: #232a2f;
    --cc-cookie-category-expanded-block-bg: transparent;
    --cc-cookie-category-expanded-block-hover-bg: var(--cc-toggle-readonly-bg);
    --cc-overlay-bg: rgba(0, 0, 0, .65);
    --cc-webkit-scrollbar-bg: var(--cc-section-category-border);
    --cc-webkit-scrollbar-hover-bg: var(--cc-btn-primary-hover-bg);
    --cc-footer-bg: #0c0e0f;
    --cc-footer-color: var(--cc-secondary-color);
    --cc-footer-border-color: #060809
}

.cc--darkmode #cc-main {
    color-scheme: dark
}

#cc-main .cm {
    background: var(--cc-bg);
    border-radius: var(--cc-modal-border-radius);
    box-shadow: 0 .625em 1.875em #0000024d;
    display: flex;
    flex-direction: column;
    max-width: 24rem;
    opacity: 0;
    overflow: hidden;
    position: fixed;
    transform: translateY(1.6em);
    visibility: hidden;
    z-index: 1
}

#cc-main .cm--top {
    top: var(--cc-modal-margin)
}

#cc-main .cm--middle {
    top: 50%;
    transform: translateY(calc(-50% + 1.6em))
}

#cc-main .cm--bottom {
    bottom: var(--cc-modal-margin)
}

#cc-main .cm--center {
    left: var(--cc-modal-margin);
    margin: 0 auto;
    right: var(--cc-modal-margin);
    width: unset
}

#cc-main .cm--left {
    left: var(--cc-modal-margin);
    margin-right: var(--cc-modal-margin)
}

#cc-main .cm--right {
    margin-left: var(--cc-modal-margin);
    right: var(--cc-modal-margin)
}

#cc-main .cm__body {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative
}

#cc-main .cm__btns,
#cc-main .cm__links {
    padding: 1rem 1.3rem;
    width: unset
}

#cc-main .cm__texts {
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: center;
    padding: 1rem 0 0
}

#cc-main .cm__desc,
#cc-main .cm__title {
    padding: 0 1.3rem
}

#cc-main .cm__title {
    font-size: 1.05em
}

#cc-main .cm__title+.cm__desc {
    margin-top: 1.1em
}

#cc-main .cm__desc {
    color: var(--cc-secondary-color);
    font-size: .9em;
    line-height: 1.5;
    max-height: 40vh;
    overflow-x: visible;
    overflow-y: auto;
    padding-bottom: 1em
}

#cc-main .cm__btns {
    border-top: 1px solid var(--cc-separator-border-color);
    display: flex;
    flex-direction: column;
    justify-content: center
}

#cc-main .cm__btn-group {
    display: grid;
    grid-auto-columns: minmax(0, 1fr)
}

#cc-main .cm__btn+.cm__btn,
#cc-main .cm__btn-group+.cm__btn-group {
    margin-top: .375rem
}

#cc-main .cm--flip .cm__btn+.cm__btn,
#cc-main .cm--flip .cm__btn-group+.cm__btn-group {
    margin-bottom: .375rem;
    margin-top: 0
}

#cc-main .cm--inline .cm__btn+.cm__btn {
    margin-left: .375rem;
    margin-top: 0
}

#cc-main .cm--inline.cm--flip .cm__btn+.cm__btn {
    margin-bottom: 0;
    margin-left: 0;
    margin-right: .375rem
}

#cc-main .cm--inline.cm--flip .cm__btn-group+.cm__btn-group {
    margin-bottom: .375rem;
    margin-right: 0
}

#cc-main .cm--wide .cm__btn+.cm__btn,
#cc-main .cm--wide .cm__btn-group+.cm__btn-group {
    margin-left: .375rem;
    margin-top: 0
}

#cc-main .cm--wide.cm--flip .cm__btn+.cm__btn,
#cc-main .cm--wide.cm--flip .cm__btn-group+.cm__btn-group {
    margin-bottom: 0;
    margin-right: .375rem
}

#cc-main .cm--bar:not(.cm--inline) .cm__btn-group--uneven,
#cc-main .cm--wide .cm__btn-group--uneven {
    display: flex;
    flex: 1;
    justify-content: space-between
}

#cc-main .cm--bar:not(.cm--inline).cm--flip .cm__btn-group--uneven,
#cc-main .cm--wide.cm--flip .cm__btn-group--uneven {
    flex-direction: row-reverse
}

#cc-main .cm__btn {
    background: var(--cc-btn-primary-bg);
    border: 1px solid var(--cc-btn-primary-border-color);
    border-radius: var(--cc-btn-border-radius);
    color: var(--cc-btn-primary-color);
    font-size: .82em;
    font-weight: 600;
    min-height: 42px;
    padding: .5em 1em;
    text-align: center
}

#cc-main .cm__btn:hover {
    background: var(--cc-btn-primary-hover-bg);
    border-color: var(--cc-btn-primary-hover-border-color);
    color: var(--cc-btn-primary-hover-color)
}

#cc-main .cm__btn--secondary {
    background: var(--cc-btn-secondary-bg);
    border-color: var(--cc-btn-secondary-border-color);
    color: var(--cc-btn-secondary-color)
}

#cc-main .cm__btn--secondary:hover {
    background: var(--cc-btn-secondary-hover-bg);
    border-color: var(--cc-btn-secondary-hover-border-color);
    color: var(--cc-btn-secondary-hover-color)
}

#cc-main .cm__btn--close {
    border-radius: 0;
    border-bottom-left-radius: var(--cc-btn-border-radius);
    border-right: none;
    border-top: none;
    display: none;
    font-size: 1em;
    height: 42px;
    min-width: auto !important;
    overflow: hidden;
    padding: 0 !important;
    position: absolute;
    right: 0;
    top: 0;
    width: 42px
}

#cc-main .cm__btn--close svg {
    stroke: var(--cc-btn-primary-color);
    transform: scale(.5);
    transition: stroke .15s ease
}

#cc-main .cm__btn--close:hover svg {
    stroke: var(--cc-btn-primary-hover-color)
}

#cc-main .cm__btn--close.cm__btn--secondary svg {
    stroke: var(--cc-btn-secondary-color)
}

#cc-main .cm__btn--close.cm__btn--secondary:hover svg {
    stroke: var(--cc-btn-secondary-hover-color)
}

#cc-main .cm__btn--close+.cm__texts .cm__title {
    padding-right: 3rem
}

#cc-main .cm--inline .cm__btn-group {
    grid-auto-flow: column
}

#cc-main .cm__footer {
    background: var(--cc-footer-bg);
    border-top: 1px solid var(--cc-footer-border-color);
    color: var(--cc-footer-color);
    padding: .4em 0 .5em
}

#cc-main .cm__links {
    display: flex;
    flex-direction: row;
    padding-bottom: 0;
    padding-top: 0
}

#cc-main .cm__link-group {
    display: flex;
    flex-direction: row;
    font-size: .8em;
    width: 100%
}

#cc-main .cm__link-group>*+* {
    margin-left: 1.3rem
}

#cc-main .cm--flip .cm__btn:last-child {
    grid-row: 1
}

#cc-main .cm--inline.cm--flip .cm__btn:last-child {
    grid-column: 1
}

#cc-main .cm--box .cm__btn--close {
    display: block
}

#cc-main .cm--box.cm--flip .cm__btns {
    flex-direction: column-reverse
}

#cc-main .cm--box.cm--wide {
    max-width: 36em
}

#cc-main .cm--box.cm--wide .cm__btns {
    flex-direction: row;
    justify-content: space-between
}

#cc-main .cm--box.cm--wide .cm__btn-group {
    grid-auto-flow: column
}

#cc-main .cm--box.cm--wide .cm__btn {
    min-width: 120px;
    padding-left: 1.8em;
    padding-right: 1.8em
}

#cc-main .cm--box.cm--wide.cm--flip .cm__btns {
    flex-direction: row-reverse
}

#cc-main .cm--box.cm--wide.cm--flip .cm__btn:last-child {
    grid-column: 1
}

#cc-main .cm--cloud {
    max-width: 54em;
    width: unset
}

#cc-main .cm--cloud .cm__body {
    flex-direction: row
}

#cc-main .cm--cloud .cm__texts {
    flex: 1
}

#cc-main .cm--cloud .cm__desc {
    max-height: 9.4em
}

#cc-main .cm--cloud .cm__btns {
    border-left: 1px solid var(--cc-separator-border-color);
    border-top: none;
    max-width: 23em
}

#cc-main .cm--cloud .cm__btn-group {
    flex-direction: column
}

#cc-main .cm--cloud .cm__btn {
    min-width: 19em
}

#cc-main .cm--cloud.cm--flip .cm__btn-group,
#cc-main .cm--cloud.cm--flip .cm__btns {
    flex-direction: column-reverse
}

#cc-main .cm--cloud.cm--inline .cm__btn-group {
    flex-direction: row
}

#cc-main .cm--cloud.cm--inline .cm__btn {
    min-width: 10em
}

#cc-main .cm--cloud.cm--inline.cm--flip .cm__btn-group {
    flex-direction: row-reverse
}

#cc-main .cm--bar {
    border-radius: 0;
    left: 0;
    margin: 0;
    max-width: unset;
    opacity: 1;
    right: 0;
    transform: translateY(0);
    width: 100vw;
    --cc-modal-transition-duration: .35s
}

#cc-main .cm--bar.cm--top {
    top: 0;
    transform: translateY(-100%)
}

#cc-main .cm--bar.cm--bottom {
    bottom: 0;
    transform: translateY(100%)
}

#cc-main .cm--bar .cm__body,
#cc-main .cm--bar .cm__links {
    margin: 0 auto;
    max-width: 55em;
    width: 100%
}

#cc-main .cm--bar .cm__body {
    padding: .5em 0 .9em
}

#cc-main .cm--bar .cm__btns {
    border-top: none;
    flex-direction: row;
    justify-content: space-between
}

#cc-main .cm--bar .cm__btn-group {
    grid-auto-flow: column
}

#cc-main .cm--bar:not(.cm--inline) .cm__btn+.cm__btn,
#cc-main .cm--bar:not(.cm--inline) .cm__btn-group+.cm__btn-group {
    margin-left: .375rem;
    margin-top: 0
}

#cc-main .cm--bar .cm__btn {
    min-width: 120px;
    padding-left: 2em;
    padding-right: 2em
}

#cc-main .cm--bar.cm--flip:not(.cm--inline) .cm__btn+.cm__btn,
#cc-main .cm--bar.cm--flip:not(.cm--inline) .cm__btn-group+.cm__btn-group {
    margin-bottom: 0;
    margin-left: 0;
    margin-right: .375rem
}

#cc-main .cm--bar.cm--flip .cm__btns {
    flex-direction: row-reverse
}

#cc-main .cm--bar.cm--flip .cm__btn:last-child {
    grid-column: 1
}

#cc-main .cm--bar.cm--inline .cm__body,
#cc-main .cm--bar.cm--inline .cm__links {
    max-width: 74em
}

#cc-main .cm--bar.cm--inline .cm__body {
    flex-direction: row;
    padding: 0
}

#cc-main .cm--bar.cm--inline .cm__btns {
    flex-direction: column;
    justify-content: center;
    max-width: 23em
}

#cc-main .cm--bar.cm--inline.cm--flip .cm__btns {
    flex-direction: column-reverse
}

#cc-main .cc--anim .cm,
#cc-main .cc--anim.cm-wrapper:before {
    transition: opacity var(--cc-modal-transition-duration) ease, visibility var(--cc-modal-transition-duration) ease, transform var(--cc-modal-transition-duration) ease
}

#cc-main .cc--anim .cm__btn,
#cc-main .cc--anim .cm__close {
    transition: background-color .15s ease, border-color .15s ease, color .15s ease
}

.disable--interaction #cc-main .cm-wrapper:before {
    background: var(--cc-overlay-bg);
    content: "";
    inset: 0;
    opacity: 0;
    position: fixed;
    visibility: hidden;
    z-index: 0
}

.show--consent #cc-main .cc--anim .cm {
    opacity: 1;
    transform: translateY(0);
    visibility: visible !important
}

.show--consent #cc-main .cc--anim .cm--middle {
    transform: translateY(-50%)
}

.show--consent #cc-main .cc--anim .cm--bar {
    transform: translateY(0)
}

.show--consent #cc-main .cc--anim.cm-wrapper:before {
    opacity: 1;
    visibility: visible
}

#cc-main.cc--rtl .cm__btn--close {
    border-bottom-left-radius: unset;
    border-bottom-right-radius: var(--cc-btn-border-radius);
    left: 0;
    right: unset
}

#cc-main.cc--rtl .cm__btn--close+.cm__texts .cm__title {
    padding-left: 3rem !important;
    padding-right: 1.3rem
}

#cc-main.cc--rtl .cm--inline .cm__btn+.cm__btn {
    margin-left: 0;
    margin-right: .375rem
}

#cc-main.cc--rtl .cm--inline.cm--flip .cm__btn+.cm__btn {
    margin-left: .375rem;
    margin-right: 0
}

#cc-main.cc--rtl .cm:not(.cm--inline).cm--bar .cm__btn+.cm__btn,
#cc-main.cc--rtl .cm:not(.cm--inline).cm--bar .cm__btn-group+.cm__btn-group,
#cc-main.cc--rtl .cm:not(.cm--inline).cm--wide .cm__btn+.cm__btn,
#cc-main.cc--rtl .cm:not(.cm--inline).cm--wide .cm__btn-group+.cm__btn-group {
    margin-left: 0;
    margin-right: .375rem
}

#cc-main.cc--rtl .cm:not(.cm--inline).cm--bar.cm--flip .cm__btn+.cm__btn,
#cc-main.cc--rtl .cm:not(.cm--inline).cm--wide.cm--flip .cm__btn+.cm__btn {
    margin-left: .375rem;
    margin-right: 0
}

#cc-main.cc--rtl .cm__link-group>*+* {
    margin-left: 0;
    margin-right: 1.3rem
}

@media screen and (max-width:640px) {
    #cc-main {
        --cc-modal-margin: .5em
    }

    #cc-main .cm {
        max-width: none !important;
        width: auto !important
    }

    #cc-main .cm__body {
        flex-direction: column !important;
        padding: 0 !important
    }

    #cc-main .cm__btns,
    #cc-main .cm__desc,
    #cc-main .cm__links,
    #cc-main .cm__title {
        padding-left: 1.1rem !important;
        padding-right: 1.1rem !important
    }

    #cc-main .cm__btns {
        border-left: none !important;
        border-top: 1px solid var(--cc-separator-border-color) !important;
        flex-direction: column !important;
        max-width: none !important;
        min-width: auto !important
    }

    #cc-main .cm__btn+.cm__btn,
    #cc-main .cm__btn-group+.cm__btn-group {
        margin: .375rem 0 0 !important
    }

    #cc-main .cm--flip .cm__btn+.cm__btn,
    #cc-main .cm--flip .cm__btn-group+.cm__btn-group {
        margin-bottom: .375rem !important;
        margin-top: 0 !important
    }

    #cc-main .cm__btn-group {
        display: flex !important;
        flex-direction: column !important;
        min-width: auto !important
    }

    #cc-main .cm__btn {
        flex: auto !important
    }

    #cc-main .cm__link-group {
        justify-content: center !important
    }

    #cc-main .cm--flip .cm__btn-group,
    #cc-main .cm--flip .cm__btns {
        flex-direction: column-reverse !important
    }
}

#cc-main .pm-wrapper {
    position: relative;
    z-index: 2
}

#cc-main .pm {
    background: var(--cc-bg);
    border-radius: var(--cc-modal-border-radius);
    box-shadow: 0 .625em 1.875em #0000024d;
    display: flex;
    flex-direction: column;
    opacity: 0;
    overflow: hidden;
    position: fixed;
    visibility: hidden;
    width: 100%;
    width: unset;
    z-index: 1
}

#cc-main svg {
    fill: none;
    width: 100%
}

#cc-main .pm__body,
#cc-main .pm__footer,
#cc-main .pm__header {
    padding: 1em 1.4em
}

#cc-main .pm__header {
    align-items: center;
    border-bottom: 1px solid var(--cc-separator-border-color);
    display: flex;
    justify-content: space-between
}

#cc-main .pm__title {
    align-items: center;
    display: flex;
    flex: 1;
    font-weight: 600;
    margin-right: 2em
}

#cc-main .pm__close-btn {
    background: var(--cc-btn-secondary-bg);
    border: 1px solid var(--cc-btn-secondary-border-color);
    border-radius: var(--cc-btn-border-radius);
    height: 40px;
    position: relative;
    transition: all .15s ease;
    width: 40px
}

#cc-main .pm__close-btn span {
    display: flex;
    height: 100%;
    width: 100%
}

#cc-main .pm__close-btn svg {
    stroke: var(--cc-btn-secondary-color);
    transform: scale(.5);
    transition: stroke .15s ease
}

#cc-main .pm__close-btn:hover {
    background: var(--cc-btn-secondary-hover-bg);
    border-color: var(--cc-btn-secondary-hover-border-color)
}

#cc-main .pm__close-btn:hover svg {
    stroke: var(--cc-btn-secondary-hover-color)
}

#cc-main .pm__body {
    flex: 1;
    overflow-y: auto;
    overflow-y: overlay
}

#cc-main .pm__section,
#cc-main .pm__section--toggle {
    border-radius: var(--cc-btn-border-radius);
    display: flex;
    flex-direction: column;
    margin-bottom: .5em
}

#cc-main .pm__section--toggle .pm__section-desc-wrapper {
    border: 1px solid var(--cc-cookie-category-block-border);
    border-radius: var(--cc-btn-border-radius);
    border-top: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    display: none;
    margin-top: 0 !important;
    overflow: hidden
}

#cc-main .pm__section {
    border: 1px solid var(--cc-separator-border-color);
    padding: 1em;
    transition: background-color .25s ease, border-color .25s ease
}

#cc-main .pm__section:first-child {
    border: none;
    margin-bottom: 2em;
    margin-top: 0;
    padding: 0;
    transition: none
}

#cc-main .pm__section:not(:first-child):hover {
    background: var(--cc-cookie-category-block-bg);
    border-color: var(--cc-cookie-category-block-border)
}

#cc-main .pm__section-toggles+.pm__section {
    margin-top: 2em
}

#cc-main .pm__section--toggle {
    background: var(--cc-cookie-category-block-bg);
    border-top: none;
    margin-bottom: .375rem
}

#cc-main .pm__section--toggle .pm__section-title {
    align-items: center;
    background: var(--cc-cookie-category-block-bg);
    border: 1px solid var(--cc-cookie-category-block-border);
    display: flex;
    justify-content: space-between;
    min-height: 58px;
    padding: 1.1em 5.4em 1.1em 1.2em;
    position: relative;
    transition: background-color .25s ease, border-color .25s ease;
    width: 100%
}

#cc-main .pm__section--toggle .pm__section-title:hover {
    background: var(--cc-cookie-category-block-hover-bg);
    border-color: var(--cc-cookie-category-block-hover-border)
}

#cc-main .pm__section--toggle .pm__section-desc {
    margin-top: 0;
    padding: 1em
}

#cc-main .pm__section--toggle.is-expanded {
    --cc-cookie-category-block-bg: var(--cc-cookie-category-expanded-block-bg);
    --cc-cookie-category-block-border: var(--cc-cookie-category-expanded-block-hover-bg)
}

#cc-main .pm__section--toggle.is-expanded .pm__section-title {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0
}

#cc-main .pm__section--toggle.is-expanded .pm__section-arrow svg {
    transform: scale(.5) rotate(180deg)
}

#cc-main .pm__section--toggle.is-expanded .pm__section-desc-wrapper {
    display: flex
}

#cc-main .pm__section--expandable .pm__section-title {
    cursor: pointer;
    padding-left: 3.4em
}

#cc-main .pm__section--expandable .pm__section-arrow {
    background: var(--cc-toggle-readonly-bg);
    border-radius: 100%;
    display: flex;
    height: 20px;
    justify-content: center;
    left: 18px;
    pointer-events: none;
    position: absolute;
    width: 20px
}

#cc-main .pm__section--expandable .pm__section-arrow svg {
    stroke: var(--cc-btn-secondary-color);
    transform: scale(.5)
}

#cc-main .pm__section-title-wrapper {
    align-items: center;
    display: flex;
    position: relative
}

#cc-main .pm__section-title-wrapper+.pm__section-desc-wrapper {
    margin-top: .85em
}

#cc-main .pm__section-title {
    border-radius: var(--cc-btn-border-radius);
    font-size: .95em;
    font-weight: 600
}

#cc-main .pm__badge {
    align-items: center;
    background: var(--cc-btn-secondary-bg);
    border-radius: 5em;
    color: var(--cc-secondary-color);
    display: flex;
    flex: none;
    font-size: .8em;
    font-weight: 600;
    height: 23px;
    justify-content: center;
    margin-left: 1em;
    min-width: 23px;
    overflow: hidden;
    padding: 0 .6em 1px;
    position: relative;
    text-align: center;
    white-space: nowrap;
    width: auto
}

#cc-main .pm__service-counter {
    background: var(--cc-btn-primary-bg);
    color: var(--cc-btn-primary-color);
    padding: 0;
    width: 23px
}

#cc-main .pm__service-counter[data-counterlabel] {
    padding: 0 .6em 1px;
    width: auto
}

#cc-main .section__toggle,
#cc-main .section__toggle-wrapper,
#cc-main .toggle__icon,
#cc-main .toggle__label {
    border-radius: var(--cc-pm-toggle-border-radius);
    height: 23px;
    transform: translateZ(0);
    width: 50px
}

#cc-main .section__toggle-wrapper {
    cursor: pointer;
    position: absolute;
    right: 18px;
    z-index: 1
}

#cc-main .toggle-service {
    height: 19px;
    position: relative;
    right: 0;
    width: 42px
}

#cc-main .toggle-service .section__toggle,
#cc-main .toggle-service .toggle__icon,
#cc-main .toggle-service .toggle__label {
    height: 19px;
    width: 42px
}

#cc-main .toggle-service .toggle__icon {
    position: relative
}

#cc-main .toggle-service .toggle__icon-circle {
    height: 19px;
    width: 19px
}

#cc-main .toggle-service .section__toggle:checked~.toggle__icon .toggle__icon-circle {
    transform: translate(23px)
}

#cc-main .pm__section--toggle:nth-child(2) .section__toggle-wrapper:after {
    display: none !important
}

#cc-main .section__toggle {
    border: 0;
    cursor: pointer;
    display: block;
    left: 0;
    margin: 0;
    position: absolute;
    top: 0
}

#cc-main .section__toggle:disabled {
    cursor: not-allowed
}

#cc-main .toggle__icon {
    background: var(--cc-toggle-off-bg);
    box-shadow: 0 0 0 1px var(--cc-toggle-off-bg);
    display: flex;
    flex-direction: row;
    pointer-events: none;
    position: absolute;
    transition: all .25s ease
}

#cc-main .toggle__icon-circle {
    background: var(--cc-toggle-off-knob-bg);
    border: none;
    border-radius: var(--cc-pm-toggle-border-radius);
    box-shadow: 0 1px 2px #1820035c;
    display: block;
    height: 23px;
    left: 0;
    position: absolute;
    top: 0;
    transition: transform .25s ease, background-color .25s ease;
    width: 23px
}

#cc-main .toggle__icon-off,
#cc-main .toggle__icon-on {
    height: 100%;
    position: absolute;
    transition: opacity .15s ease;
    width: 100%
}

#cc-main .toggle__icon-on {
    opacity: 0;
    transform: rotate(45deg)
}

#cc-main .toggle__icon-on svg {
    stroke: var(--cc-toggle-on-bg);
    transform: scale(.55) rotate(-45deg)
}

#cc-main .toggle__icon-off {
    opacity: 1
}

#cc-main .toggle__icon-off svg {
    stroke: var(--cc-toggle-off-bg);
    transform: scale(.55)
}

#cc-main .section__toggle:checked~.toggle__icon {
    background: var(--cc-toggle-on-bg);
    box-shadow: 0 0 0 1px var(--cc-toggle-on-bg)
}

#cc-main .section__toggle:checked~.toggle__icon .toggle__icon-circle {
    background-color: var(--cc-toggle-on-knob-bg);
    transform: translate(27px)
}

#cc-main .section__toggle:checked~.toggle__icon .toggle__icon-on {
    opacity: 1
}

#cc-main .section__toggle:checked~.toggle__icon .toggle__icon-off {
    opacity: 0
}

#cc-main .section__toggle:checked:disabled~.toggle__icon {
    background: var(--cc-toggle-readonly-bg);
    box-shadow: 0 0 0 1px var(--cc-toggle-readonly-bg)
}

#cc-main .section__toggle:checked:disabled~.toggle__icon .toggle__icon-circle {
    background: var(--cc-toggle-readonly-knob-bg);
    box-shadow: none
}

#cc-main .section__toggle:checked:disabled~.toggle__icon svg {
    stroke: var(--cc-toggle-readonly-knob-icon-color)
}

#cc-main .toggle__label {
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    top: 0;
    z-index: -1
}

#cc-main .pm__section-desc-wrapper {
    color: var(--cc-secondary-color);
    display: flex;
    flex-direction: column;
    font-size: .9em
}

#cc-main .pm__section-desc-wrapper>:not(:last-child) {
    border-bottom: 1px solid var(--cc-cookie-category-block-border)
}

#cc-main .pm__section-services {
    display: flex;
    flex-direction: column
}

#cc-main .pm__service {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding: .4em 1.2em;
    position: relative;
    transition: background-color .15s ease
}

#cc-main .pm__service:hover {
    background-color: var(--cc-cookie-category-block-hover-bg)
}

#cc-main .pm__service-header {
    align-items: center;
    display: flex;
    margin-right: 1em;
    width: 100%
}

#cc-main .pm__service-icon {
    border: 2px solid;
    border-radius: 100%;
    height: 8px;
    margin-left: 6px;
    margin-right: 20px;
    margin-top: 1px;
    min-width: 8px
}

#cc-main .pm__service-title {
    font-size: .95em;
    width: 100%;
    word-break: break-word
}

#cc-main .pm__section-desc {
    line-height: 1.5em
}

#cc-main .pm__section-table {
    border-collapse: collapse;
    font-size: .9em;
    margin: 0;
    overflow: hidden;
    padding: 0;
    text-align: left;
    width: 100%
}

#cc-main .pm__table-caption {
    text-align: left
}

#cc-main .pm__table-caption,
#cc-main .pm__table-head>tr {
    border-bottom: 1px dashed var(--cc-separator-border-color);
    color: var(--cc-primary-color);
    font-weight: 600
}

#cc-main .pm__table-tr {
    transition: background-color .15s ease
}

#cc-main .pm__table-tr:hover {
    background: var(--cc-cookie-category-block-hover-bg)
}

#cc-main .pm__table-caption,
#cc-main .pm__table-td,
#cc-main .pm__table-th {
    padding: .625em .625em .625em 1.2em;
    vertical-align: top
}

#cc-main .pm__footer {
    border-top: 1px solid var(--cc-separator-border-color);
    display: flex;
    justify-content: space-between
}

#cc-main .pm__btn-group {
    display: flex
}

#cc-main .pm__btn+.pm__btn,
#cc-main .pm__btn-group+.pm__btn-group {
    margin-left: .375rem
}

#cc-main .pm--flip .pm__btn+.pm__btn,
#cc-main .pm--flip .pm__btn-group+.pm__btn-group {
    margin-left: 0;
    margin-right: .375rem
}

#cc-main .pm__btn {
    background: var(--cc-btn-primary-bg);
    border: 1px solid var(--cc-btn-primary-border-color);
    border-radius: var(--cc-btn-border-radius);
    color: var(--cc-btn-primary-color);
    flex: auto;
    font-size: .82em;
    font-weight: 600;
    min-height: 42px;
    min-width: 110px;
    padding: .5em 1.5em;
    text-align: center;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease
}

#cc-main .pm__btn:hover {
    background: var(--cc-btn-primary-hover-bg);
    border-color: var(--cc-btn-primary-hover-border-color);
    color: var(--cc-btn-primary-hover-color)
}

#cc-main .pm__btn--secondary {
    background: var(--cc-btn-secondary-bg);
    border-color: var(--cc-btn-secondary-border-color);
    color: var(--cc-btn-secondary-color)
}

#cc-main .pm__btn--secondary:hover {
    background: var(--cc-btn-secondary-hover-bg);
    border-color: var(--cc-btn-secondary-hover-border-color);
    color: var(--cc-btn-secondary-hover-color)
}

#cc-main .pm--box {
    height: calc(100% - 2em);
    left: var(--cc-modal-margin);
    margin: 0 auto;
    max-height: 37.5em;
    max-width: 43em;
    right: var(--cc-modal-margin);
    top: 50%;
    transform: translateY(calc(-50% + 1.6em))
}

#cc-main .pm--box.pm--flip .pm__btn-group,
#cc-main .pm--box.pm--flip .pm__footer {
    flex-direction: row-reverse
}

#cc-main .pm--bar {
    border-radius: 0;
    bottom: 0;
    height: 100%;
    margin: 0;
    max-height: none;
    max-width: 29em;
    opacity: 1;
    top: 0;
    width: 100%;
    --cc-modal-transition-duration: .35s
}

#cc-main .pm--bar .pm__section-table,
#cc-main .pm--bar .pm__table-body,
#cc-main .pm--bar .pm__table-td,
#cc-main .pm--bar .pm__table-th,
#cc-main .pm--bar .pm__table-tr {
    display: block
}

#cc-main .pm--bar .pm__table-head {
    display: none
}

#cc-main .pm--bar .pm__table-caption {
    display: block
}

#cc-main .pm--bar .pm__table-tr:not(:last-child) {
    border-bottom: 1px solid var(--cc-separator-border-color)
}

#cc-main .pm--bar .pm__table-td {
    display: flex;
    justify-content: space-between
}

#cc-main .pm--bar .pm__table-td:before {
    color: var(--cc-primary-color);
    content: attr(data-column);
    flex: 1;
    font-weight: 600;
    min-width: 100px;
    overflow: hidden;
    padding-right: 2em;
    text-overflow: ellipsis
}

#cc-main .pm--bar .pm__table-td>div {
    flex: 3
}

#cc-main .pm--bar:not(.pm--wide) .pm__body,
#cc-main .pm--bar:not(.pm--wide) .pm__footer,
#cc-main .pm--bar:not(.pm--wide) .pm__header {
    padding: 1em 1.3em
}

#cc-main .pm--bar:not(.pm--wide) .pm__btn-group,
#cc-main .pm--bar:not(.pm--wide) .pm__footer {
    flex-direction: column
}

#cc-main .pm--bar:not(.pm--wide) .pm__btn+.pm__btn,
#cc-main .pm--bar:not(.pm--wide) .pm__btn-group+.pm__btn-group {
    margin: .375rem 0 0
}

#cc-main .pm--bar:not(.pm--wide).pm--flip .pm__btn-group,
#cc-main .pm--bar:not(.pm--wide).pm--flip .pm__footer {
    flex-direction: column-reverse
}

#cc-main .pm--bar:not(.pm--wide).pm--flip .pm__btn+.pm__btn,
#cc-main .pm--bar:not(.pm--wide).pm--flip .pm__btn-group+.pm__btn-group {
    margin-bottom: .375rem;
    margin-top: 0
}

#cc-main .pm--bar:not(.pm--wide) .pm__badge {
    display: none
}

#cc-main .pm--bar.pm--left {
    left: 0;
    transform: translate(-100%)
}

#cc-main .pm--bar.pm--right {
    right: 0;
    transform: translate(100%)
}

#cc-main .pm--bar.pm--wide {
    max-width: 35em
}

#cc-main .pm--bar.pm--wide .pm__body,
#cc-main .pm--bar.pm--wide .pm__footer,
#cc-main .pm--bar.pm--wide .pm__header {
    padding: 1em 1.4em
}

#cc-main .pm--bar.pm--wide.pm--flip .pm__btn-group,
#cc-main .pm--bar.pm--wide.pm--flip .pm__footer {
    flex-direction: row-reverse
}

#cc-main .pm-overlay {
    background: var(--cc-overlay-bg);
    content: "";
    inset: 0;
    opacity: 0;
    position: fixed;
    visibility: hidden;
    z-index: 1
}

#cc-main .cc--anim .pm,
#cc-main .cc--anim .pm-overlay {
    transition: opacity var(--cc-modal-transition-duration) ease, visibility var(--cc-modal-transition-duration) ease, transform var(--cc-modal-transition-duration) ease
}

.show--preferences #cc-main .cc--anim .pm {
    opacity: 1;
    visibility: visible !important
}

.show--preferences #cc-main .cc--anim .pm--box {
    transform: translateY(-50%)
}

.show--preferences #cc-main .cc--anim .pm--bar {
    transform: translate(0)
}

.show--preferences #cc-main .cc--anim .pm-overlay {
    opacity: 1;
    visibility: visible
}

#cc-main.cc--rtl .pm__service-header {
    margin-left: 1em;
    margin-right: 0
}

#cc-main.cc--rtl .pm__section-arrow {
    left: unset;
    right: 18px
}

#cc-main.cc--rtl .section__toggle-wrapper {
    left: 18px;
    right: unset;
    transform-origin: left
}

#cc-main.cc--rtl .toggle-service {
    left: 0
}

#cc-main.cc--rtl .pm__service-icon {
    margin-left: 20px;
    margin-right: 5px
}

#cc-main.cc--rtl .pm__section--toggle .pm__section-title {
    padding-left: 5.4em;
    padding-right: 1.2em
}

#cc-main.cc--rtl .pm__section--expandable .pm__section-title {
    padding-right: 3.4em
}

#cc-main.cc--rtl .pm__badge {
    margin-left: unset;
    margin-right: 1em
}

#cc-main.cc--rtl .toggle__icon-circle {
    transform: translate(27px)
}

#cc-main.cc--rtl .toggle-service .toggle__icon-circle {
    transform: translate(23px)
}

#cc-main.cc--rtl .section__toggle:checked~.toggle__icon .toggle__icon-circle {
    transform: translate(0)
}

#cc-main.cc--rtl .pm__table-td,
#cc-main.cc--rtl .pm__table-th {
    padding-left: unset;
    padding-right: 1.2em;
    text-align: right
}

#cc-main.cc--rtl .pm__table-td {
    padding-left: unset;
    padding-right: 1.2em
}

#cc-main.cc--rtl .pm__table-td:before {
    padding-left: 2em;
    padding-right: unset
}

#cc-main.cc--rtl .pm__btn+.pm__btn,
#cc-main.cc--rtl .pm__btn-group+.pm__btn-group {
    margin-left: 0;
    margin-right: .375rem
}

#cc-main.cc--rtl .pm--flip .pm__btn+.pm__btn,
#cc-main.cc--rtl .pm--flip .pm__btn-group+.pm__btn-group {
    margin-left: .375rem;
    margin-right: 0
}

#cc-main.cc--rtl .pm--flip.pm--bar:not(.pm--wide) .pm__btn+.pm__btn,
#cc-main.cc--rtl .pm--flip.pm--bar:not(.pm--wide) .pm__btn-group+.pm__btn-group {
    margin-left: 0
}

@media screen and (max-width:640px) {
    #cc-main .pm {
        border-radius: 0;
        height: auto;
        inset: 0;
        max-height: 100%;
        max-width: none !important;
        transform: translateY(1.6em)
    }

    #cc-main .pm__body,
    #cc-main .pm__footer,
    #cc-main .pm__header {
        padding: .9em !important
    }

    #cc-main .pm__badge {
        display: none
    }

    #cc-main .pm__section-table,
    #cc-main .pm__table-body,
    #cc-main .pm__table-caption,
    #cc-main .pm__table-td,
    #cc-main .pm__table-th,
    #cc-main .pm__table-tr {
        display: block
    }

    #cc-main .pm__table-head {
        display: none
    }

    #cc-main .pm__table-tr:not(:last-child) {
        border-bottom: 1px solid var(--cc-separator-border-color)
    }

    #cc-main .pm__table-td {
        display: flex;
        justify-content: space-between
    }

    #cc-main .pm__table-td:before {
        color: var(--cc-primary-color);
        content: attr(data-column);
        flex: 1;
        font-weight: 600;
        min-width: 100px;
        overflow: hidden;
        padding-right: 2em;
        text-overflow: ellipsis
    }

    #cc-main .pm__table-td>div {
        flex: 3
    }

    #cc-main .pm__btn-group,
    #cc-main .pm__footer {
        flex-direction: column !important
    }

    #cc-main .pm__btn-group {
        display: flex !important
    }

    #cc-main .pm__btn+.pm__btn,
    #cc-main .pm__btn-group+.pm__btn-group {
        margin: .375rem 0 0 !important
    }

    #cc-main .pm--flip .pm__btn+.pm__btn,
    #cc-main .pm--flip .pm__btn-group+.pm__btn-group {
        margin-bottom: .375rem !important;
        margin-top: 0 !important
    }

    #cc-main .pm--flip .pm__btn-group,
    #cc-main .pm--flip .pm__footer {
        flex-direction: column-reverse !important
    }

    .show--preferences #cc-main .cc--anim .pm {
        transform: translateY(0) !important
    }
}

*:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) {
    all: unset;
    display: revert
}

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

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

a,
button {
    cursor: revert
}

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

ol {
    counter-reset: revert
}

table {
    border-collapse: collapse
}

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

textarea {
    white-space: revert
}

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

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

::placeholder {
    color: unset
}

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

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

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

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

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

:root {
    --primary: #089162;
    --secondary: #03422C;
    --tertiary: #AFFF46;
    --background: #A7F0CC;
    --white: #ffffff;
    --container: clamp(0px, 100% - 40px, 1440px)
}

@media (max-width: 809px) {
    :root {
        --container: calc(100% - 1rem)
    }
}

@font-face {
    font-family: Urbanist;
    src: url(fonts/Urbanist-VariableFont_wght.ttf);
    font-style: normal;
    font-weight: 100 1000;
    font-display: swap
}

@font-face {
    font-family: Urbanist;
    src: url(fonts/Urbanist-Italic-VariableFont_wght.ttf);
    font-style: italic;
    font-weight: 100 1000;
    font-display: swap
}

@font-face {
    font-family: MartianMono;
    src: url(fonts/MartianMono-Regular.ttf);
    font-weight: 400
}

.h1 {
    font-family: Urbanist, Arial, Helvetica, sans-serif;
    font-weight: 800;
    font-size: 4rem;
    line-height: 110.5%
}

.h2,
.job-offer h2 {
    font-family: Urbanist, Arial, Helvetica, sans-serif;
    font-weight: 600;
    font-size: 3rem;
    line-height: 125%;

    em {
        font-weight: 400;
        font-size: 3rem;
        line-height: 125%;
        font-style: italic
    }
}

.h3,
.job-offer h3 {
    font-family: Urbanist, Arial, Helvetica, sans-serif;
    font-weight: 600;
    font-size: 2rem;
    line-height: 125%;

    em {
        font-family: Urbanist, Arial, Helvetica, sans-serif;
        font-weight: 400;
        font-size: 2rem;
        line-height: 119.8%;
        font-style: italic
    }
}

.h4,
.job-offer h4 {
    font-family: Urbanist, Arial, Helvetica, sans-serif;
    font-weight: 600;
    font-size: 1.5rem;
    line-height: 125%;

    em {
        font-style: italic
    }
}

.text,
.text p,
.job-offer p,
.job-offer li {
    font-family: Urbanist, Arial, Helvetica, sans-serif;
    font-weight: 500;
    font-size: 1rem;
    line-height: 125%;
    letter-spacing: 2%;

    em {
        font-style: italic;
        font-weight: 400;
        font-size: 1rem;
        line-height: 125%;
        letter-spacing: 2%
    }
}

.text ol,
.job-offer ol {
    list-style: decimal;
    padding-left: 1rem;
    display: flex;
    flex-direction: column;
    gap: .5rem
}

.text-l {
    font-family: Urbanist, Arial, Helvetica, sans-serif;
    font-weight: 500;
    font-size: 1.25rem;
    line-height: 125%;

    em {
        font-style: italic;
        font-family: Urbanist;
        font-weight: 400;
        font-size: 1.25rem;
        line-height: 125%
    }
}

.link,
.job-offer a:not(.button) {
    font-family: Urbanist, Arial, Helvetica, sans-serif;
    font-weight: 600;
    font-size: 1rem;
    text-transform: uppercase;
    line-height: 125%;
    border-bottom: 1px solid currentColor;
    height: fit-content;

    &:hover {
        border-bottom-style: dashed
    }
}

@media (max-width:809px) {
    .h1 {
        font-size: 2.25rem
    }

    .h2,
    .h2 em,
    .job-offer h2 {
        font-size: 1.75rem
    }

    .h3,
    .h3 em,
    .job-offer h3 {
        font-size: 1.5rem
    }

    .h3 em {
        line-height: 119.8%
    }

    .h4 {
        font-size: 1.25rem
    }

    .text-l,
    .text-l em {
        font-size: 1rem
    }

    .text-l em {
        line-height: 125%
    }
}

a:focus-visible,
button:focus-visible {
    outline: 2px dashed black !important;
    outline-offset: 5px
}

.home-hero {
    padding-bottom: 203px;
    width: 100%;
    overflow: hidden
}

.home-hero__inner {
    max-width: var(--container);
    margin: 0 auto
}

.home-hero__title {
    color: var(--secondary);
    grid-column: 1 / 5;
    margin-top: 190px;
    position: relative;
    z-index: 2
}

.home-hero__inner:after {
    content: "";
    background-image: url(assets/home-hero-flower.webp);
    background-size: contain;
    display: block;
    width: 526px;
    height: 714px;
    position: absolute;
    left: 44px;
    top: 44px;
    z-index: -1;
    pointer-events: none
}

.home-hero .link {
    color: var(--secondary)
}

.home-hero__first-nav {
    grid-column: 6 / 9;
    padding-top: 154px;

    ul {
        display: flex;
        flex-direction: column;
        gap: 1rem
    }
}

.home-hero__experimental {
    grid-column: 2 / 4;
    margin-top: 170px;
    display: flex;
    flex-direction: column;
    align-items: flex-start
}

.home-hero__description {
    grid-column: 6 / 9;
    margin-top: 320px;
    position: relative;
    color: var(--secondary);

    &:before {
        content: "";
        position: absolute;
        left: -20px;
        top: 0;
        height: 100%;
        width: 1px;
        background-color: var(--secondary)
    }

    &:after {
        content: "";
        background-image: url(assets/home-hero-data.webp);
        background-size: contain;
        display: block;
        width: 624px;
        height: 521px;
        position: absolute;
        left: -64px;
        top: -244px;
        z-index: -1;
        pointer-events: none;
        background-repeat: no-repeat
    }
}

.home-hero__leaf-container {
    height: 100%;
    width: 100%;
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    left: 0;
    top: 0;

    &:has(:not(.full-screen)) {
        pointer-events: none
    }
}

.home-hero__welcome-background {
    position: fixed;
    left: 50%;
    transform: translate(-50%) translateY(-50%);
    top: 50%;
    width: 100%;
    height: 100dvh;
    background-color: var(--primary)
}

.home-hero__welcome-background.home-hero__welcome-background--hidden {
    display: none
}

.home-hero__leaf.full-screen {
    width: 100%;
    margin-top: 0;
    height: 100dvh;

    img {
        filter: brightness(.8)
    }
}

.home-hero__leaf {
    width: 375px;
    height: 264px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--primary);

    img {
        height: 150%;
        width: 150%;
        flex-shrink: 0;
        transform-origin: center center;
        display: block;
        object-fit: cover;
        animation: leaf 180s linear infinite;
        transition: filter .2s ease;
        filter: brightness(1)
    }
}

@keyframes leaf {
    0% {
        transform: rotate(0) scale(1)
    }

    50% {
        transform: rotate(180deg) scale(2)
    }

    to {
        transform: rotate(360deg) scale(1)
    }
}

@media (max-width:809px) {
    .home-hero__welcome-background {
        display: none
    }

    .home-hero {
        padding-bottom: 94px;
        padding-top: 94px
    }

    .home-hero__inner.grid {
        display: flex;
        flex-direction: column
    }

    .home-hero__description:after,
    .home-hero__inner:after {
        display: none
    }

    .home-hero__title {
        margin-top: 0;
        order: 1
    }

    .home-hero__first-nav {
        order: 2;
        padding-top: 40vh
    }

    .home-hero__experimental {
        order: 3;
        margin-top: 37px;
        text-align: end
    }

    .home-hero__leaf {
        width: 294px;
        height: 208px;
        right: 0;
        top: 243px;
        left: unset;
        transform: none;
        z-index: -1
    }

    .home-hero__description {
        order: 4;
        margin-top: 31px;
        margin-left: 25%
    }
}

.home-ai-solutions {
    background-color: var(--primary);
    display: block;
    overflow: hidden
}

.home-ai-solutions__inner {
    max-width: var(--container);
    margin: 0 auto;
    display: block
}

.home-ai-solutions__tag {
    color: var(--tertiary);
    padding-top: 128px;
    padding-bottom: 64px;
    grid-column: 1 / 9
}

.home-ai-solutions__title {
    grid-column: 2 / 8;
    color: #ffffff1a
}

.home-ai-solutions__list-title {
    grid-column: 2 / 8;
    padding-top: 24px;
    padding-bottom: 128px;
    color: #ffffff1a
}

.home-ai-solutions__list:before {
    content: "";
    width: 475px;
    height: 770px;
    background-image: url(assets/home-ai-solutions-plant.webp);
    background-size: contain;
    position: absolute;
    left: 211px;
    top: -272px;
    z-index: -1
}

.home-ai-solutions__list {
    grid-column: 1 / 9;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 3rem;
    padding-bottom: 128px;
    position: relative;
    z-index: 2;

    li {
        font-family: Urbanist;
        color: var(--white);
        font-size: 6rem;
        font-weight: 800;
        display: flex;
        z-index: -1;

        &:after {
            content: ".";
            color: var(--tertiary)
        }
    }
}

.home-ai-solutions__image {
    width: 100%;
    height: 559px;
    object-fit: cover;
    display: flex;
    z-index: 2;
    position: relative
}

@media (max-width: 1200px) {
    .home-ai-solutions__list li {
        font-size: 3rem
    }
}

@media (max-width:809px) {
    .home-ai-solutions__tag {
        padding-top: 4rem;
        padding-bottom: 2rem
    }

    .home-ai-solutions__list {
        padding-bottom: 3rem;

        li {
            font-size: 2.125rem
        }
    }

    .home-ai-solutions__title,
    .home-ai-solutions__list-title,
    .home-ai-solutions__list,
    .home-ai-solutions__tag {
        grid-column: 1 /5
    }

    .home-ai-solutions__list:before {
        left: -102px
    }

    .home-ai-solutions__image {
        height: 224px
    }
}

.home-platform {
    max-width: var(--container);
    margin: 0 auto;
    padding-top: 8rem;
    display: flex;
    flex-direction: column;
    align-items: flex-end
}

.home-platform__tag {
    margin-bottom: 1rem;
    color: var(--secondary)
}

.home-platform__title {
    margin-bottom: 1.5rem;
    color: var(--primary)
}

.home-platform__container {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    gap: 20px
}

.home-platform__square {
    background-color: var(--secondary);
    position: relative;
    overflow: hidden;
    height: 610px;
    padding: 3rem 2rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    transition: background-color .3s ease
}

.home-platform__square:hover {
    background: #03422ccc
}

.home-platform__image {
    position: absolute;
    right: 0;
    bottom: 0;
    max-width: 100%;
    height: 438px;
    object-fit: contain;
    pointer-events: none
}

.home-platform__square-title {
    flex-grow: 1;
    color: var(--white);
    max-width: 480px;
    padding-right: 2rem
}

.home-platform__square-title:after {
    content: "";
    width: 24px;
    height: 24px;
    position: absolute;
    right: 2rem;
    top: 3rem;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M24 13.5004V10.5004H16.5C14.8431 10.5004 13.5 9.15722 13.5 7.50036L13.5 0H10.5V7.50037C10.5 9.15722 9.15686 10.5004 7.50001 10.5004H0V13.5004H7.50001C9.15687 13.5004 10.5 14.8435 10.5 16.5004V24H13.5V16.5004C13.5 14.8435 14.8432 13.5004 16.5 13.5004H24Z" fill="%23AFFF46"/></svg>');
    background-size: contain
}

.home-platform__square-subtitle {
    color: var(--tertiary);
    max-width: 480px
}

.home-platform__square-text {
    color: var(--background);
    margin: 1rem 0;
    max-width: 480px
}

.home-platform__square a:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0
}

@media (max-width:809px) {
    .home-platform__container {
        grid-template-columns: repeat(1, minmax(0, 1fr))
    }

    .home-platform__square {
        height: auto;
        padding: 1.5rem 1rem
    }

    .home-platform__square-title {
        margin-bottom: 10rem
    }

    .home-platform__square-title:after {
        right: 1rem;
        top: 1.5rem
    }

    .home-platform__title {
        margin-bottom: 2rem
    }

    .home-platform__image {
        height: 330px
    }
}

.home-innovation {
    max-width: var(--container);
    margin: 0 auto;
    padding-bottom: 192px;
    padding-top: 4rem;
    display: flex;
    flex-direction: column;
    align-items: flex-end
}

.home-innovation__title {
    padding-top: 1rem;
    padding-bottom: 2rem;
    color: var(--primary)
}

.home-innovation__text {
    max-width: 817px;
    color: var(--secondary)
}

.home-innovation__subtitle {
    text-align: center;
    width: 100%;
    padding-bottom: 2rem;
    padding-top: 8rem;
    color: var(--primary)
}

.home-innovation__svg {
    display: block;
    width: 100%;
    height: auto
}

.home-innovation__svg-mobile {
    display: none
}

.home-innovation__svg line:nth-of-type(1),
.home-innovation__svg line:nth-of-type(4) {
    animation: strokeDashoffsetToLeft 4s linear infinite
}

.home-innovation__svg line:nth-of-type(2),
.home-innovation__svg line:nth-of-type(3) {
    animation: strokeDashoffsetToRight 2s linear infinite
}

@keyframes strokeDashoffsetToLeft {
    0% {
        stroke-dashoffset: 0px
    }

    to {
        stroke-dashoffset: 32px
    }
}

@keyframes strokeDashoffsetToRight {
    0% {
        stroke-dashoffset: 0px
    }

    to {
        stroke-dashoffset: -32px
    }
}

@media (max-width: 809px) {
    .home-innovation {
        padding-bottom: 4rem;
        padding-top: 4rem
    }

    .home-innovation__svg-mobile {
        display: block;
        margin: 0 auto;
        max-width: 374px;
        width: 100%;
        height: auto
    }

    .home-innovation__svg {
        display: none
    }

    .home-innovation__subtitle {
        padding-top: 2rem
    }
}

.home-assays {
    background-color: var(--secondary)
}

.home-assays__inner {
    background-color: var(--secondary);
    padding: 128px 0;
    overflow: hidden;
    display: block
}

.home-assays__title {
    text-align: center;
    color: var(--white);
    max-width: var(--container);
    margin: 1rem auto 4rem
}

.home-assays__tag {
    color: var(--tertiary);
    max-width: var(--container);
    margin: 0 auto;
    display: block
}

.home-assays__slider-container {
    max-width: var(--container);
    margin: 0 auto
}

@media (max-width:809px) {
    .home-assays__inner {
        padding: 3rem 0
    }

    .home-assays__title {
        margin-bottom: 3rem;
        text-align: start
    }
}

.home-driving {
    position: relative;
    background-color: #000
}

.home-driving__text {
    max-width: clamp(0px, 100% - 1rem, 1080px);
    margin: 0 auto;
    padding-top: 517px;
    padding-bottom: 4rem;
    position: relative;
    z-index: 2
}

.home-driving p {
    border-left: 1px solid var(--tertiary);
    padding-left: 20px;
    color: #fff
}

.home-driving__video {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
    opacity: .7
}

@media (max-width:809px) {
    .home-driving__text {
        padding-top: 359px
    }
}

.home-about {
    position: relative;
    padding: 128px 0
}

.home-about:before {
    content: "";
    background-image: url(assets/home-about-background.webp);
    height: 100%;
    width: 100%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left top;
    left: 0;
    top: 0;
    position: absolute;
    display: block;
    pointer-events: none
}

.home-about__inner {
    max-width: var(--container);
    margin: 0 auto
}

.home-about__tag {
    grid-column: 1/9;
    padding-bottom: 1rem;
    color: var(--secondary)
}

.home-about__title {
    grid-column: 1 /5;
    color: var(--primary)
}

.home-about__team {
    grid-column: 5/9;
    width: 100%;
    height: auto;
    aspect-ratio: 690/395;
    object-fit: cover
}

.home-about__text {
    grid-column: 3 / 7;
    padding-top: 4rem;
    padding-bottom: 2rem;
    color: var(--primary)
}

.home-about__link {
    grid-column: 6/ 8;
    display: flex;
    justify-content: flex-end
}

@media (max-width:809px) {
    .home-about {
        padding: 4rem 0
    }

    .home-about__inner>* {
        grid-column: 1 /5
    }

    .home-about__title {
        padding-bottom: 1rem
    }

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

.home-supported {
    background-color: var(--white);
    display: flex;
    flex-direction: column;
    gap: 2rem;
    align-items: center;
    padding: 4rem 0
}

.home-supported__list {
    display: flex;
    column-gap: 80px;
    row-gap: 40px;
    flex-wrap: wrap;
    max-width: clamp(0px, 100% - 2rem, 1046px);
    margin: 0 auto;
    align-items: center;
    justify-content: center
}

.home-supported__tag {
    color: var(--secondary)
}

.home-supported__list img {
    height: 2.5rem;
    width: auto
}

@media (max-width:809px) {
    .home-supported__list {
        column-gap: 24px;
        row-gap: 32px
    }
}

.about-hero__inner {
    max-width: var(--container);
    margin: 0 auto;
    padding-bottom: 4rem;
    padding-top: 148px
}

.about-hero__inner:before {
    content: "";
    width: 100%;
    height: 100%;
    background-image: url(assets/about-hero-plant.webp);
    background-size: contain;
    position: absolute;
    left: 0;
    top: 0;
    background-repeat: no-repeat;
    pointer-events: none;
    z-index: -1
}

.about-hero__title {
    grid-column: 2 / 7;
    color: var(--secondary);
    grid-row: 1/1;
    z-index: 2
}

.about-hero__text {
    grid-column: 3 /6;
    grid-row: 4 /8;
    color: var(--primary);
    position: relative;

    &:before {
        content: "";
        width: 2px;
        height: 100%;
        position: absolute;
        background-color: var(--secondary);
        left: -20px;
        top: 0
    }
}

.about-hero__link-container {
    grid-column: 6/ 8;
    padding-top: 44px;
    grid-row: 9/9;
    color: var(--primary)
}

.about-hero__image {
    grid-column: 6 / 9;
    width: 100%;
    height: auto;
    grid-row: 1 /6
}

@media (max-width:809px) {
    .about-hero__inner {
        padding-top: 100px;
        padding-bottom: 2rem
    }

    .about-hero__title {
        grid-column: 1/5;
        grid-row: unset
    }

    .about-hero__image {
        grid-column: 2 /5;
        grid-row: unset;
        margin-bottom: 1rem;
        margin-top: 1rem
    }

    .about-hero__text {
        grid-column: 1 /5;
        grid-row: unset;

        &:before {
            display: none
        }
    }

    .about-hero__link-container {
        grid-column: 1 /5;
        grid-row: unset;
        padding-top: 4rem;
        display: flex;
        justify-content: center
    }
}

.about-team {
    background-color: var(--secondary)
}

.about-team__inner {
    max-width: var(--container);
    margin: 0 auto;
    padding: 128px 0;
    position: relative
}

.about-team__inner:after {
    content: "";
    background-image: url(assets/about-team-illustration.webp);
    width: 675px;
    height: 506px;
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    right: 20px;
    top: 330px
}

.about-team__tag {
    color: var(--tertiary);
    grid-column: 2 /4
}

.about-team__title {
    grid-column: 3 / 9;
    color: var(--background);
    padding-bottom: 128px;
    padding-top: 1rem
}

.about-team__head {
    grid-column: 1/9;
    align-items: flex-start;
    position: relative;
    z-index: 2
}

.about-team__head-member:nth-of-type(1) {
    grid-column: 1/ 5;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    img {
        grid-column: 1 /4;
        width: 100%;
        height: auto
    }

    .about-team__head-description {
        grid-column: 2/ 5
    }
}

.about-team__head-member:nth-of-type(2) {
    grid-column: 6/ 9;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding-top: 128px;

    img {
        grid-column: 1 /3;
        width: 100%;
        height: auto
    }

    .about-team__head-description {
        grid-column: 1/4
    }
}

.about-team__head-member {
    img {
        width: 100%;
        height: auto
    }

    h4,
    .link {
        color: #fff
    }

    .text-l,
    .text {
        color: var(--background)
    }

    .text {
        padding-bottom: 1rem;
        padding-top: 20px
    }

    h4 {
        padding-top: 20px;
        padding-bottom: .5rem
    }
}

.about-team__head-member:nth-of-type(3) {
    grid-column: 2/ 8;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    grid-template-rows: repeat(4, minmax(0, 275px/5));
    padding-top: 4rem;
    align-items: center;

    img {
        grid-column: 1 / 3;
        padding-right: 30%
    }

    .about-team__head-description {
        grid-column: 3 / 6;
        padding-right: 4rem
    }
}

.about-team__team-title {
    margin-top: 128px;
    padding-bottom: 4rem;
    grid-column: 2/ 9;
    color: var(--background)
}

.about-team__team {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 2rem;
    grid-column: 1/ 9;

    li {
        display: flex;
        flex-direction: column;
        align-items: center;

        img {
            max-width: 250px;
            height: auto;
            width: 100%
        }

        h4 {
            color: #fff;
            padding-top: 1.5rem;
            padding-bottom: .5rem;
            width: 100%
        }

        .text {
            color: var(--background);
            width: 100%
        }
    }
}

.about-team__trusted-title {
    grid-column: 2 /9;
    color: var(--background);
    padding: 4rem 0
}

.about-team__trusted {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
    grid-column: 1/ 9;
    display: grid;

    .h4 {
        color: #fff
    }

    h5 {
        color: var(--background);
        padding-top: .5rem;
        padding-bottom: 20px
    }

    .text {
        color: var(--background)
    }
}

@media (max-width: 809px) {
    .about-team__inner {
        padding-top: 4rem;
        padding-bottom: 4rem
    }

    .about-team__title {
        padding-bottom: 4rem;
        padding-top: 2rem
    }

    .about-team__inner:after {
        display: none
    }

    .about-team__tag {
        grid-column: 1 /5
    }

    .about-team__head {
        gap: 2rem
    }

    .about-team__title {
        grid-column: 1/5
    }

    .about-team__head>.about-team__head-member {
        grid-column: 1/5;
        padding-top: 0;
        grid-template-columns: repeat(4, minmax(0, 1fr));

        .about-team__head-description {
            grid-column: 1 /5
        }
    }

    .about-team .about-team__head-member .about-team__head-description {
        padding-right: 0
    }

    .about-team__head-member:nth-of-type(1) img {
        grid-column: 1 /5
    }

    .about-team__head-member:nth-of-type(2) img,
    .about-team__head-member:nth-of-type(3) img {
        grid-column: 1 /3;
        padding-right: 0
    }

    .about-team__team {
        grid-template-columns: repeat(2, minmax(0, 1fr));

        li {
            img {
                max-width: 150px
            }
        }
    }

    .about-team__trusted-title,
    .about-team__team-title {
        grid-column: 1/5
    }

    .about-team__team-title {
        margin-top: 4rem
    }

    .about-team__trusted-title {
        padding-bottom: 2rem
    }

    .about-team__trusted {
        li {
            grid-column: 1 / 5
        }
    }
}

.about-mission {
    background-color: var(--secondary);
    padding-bottom: 128px
}

.about-mission__inner {
    margin: 0 auto;
    max-width: var(--container);
    width: 100%;
    position: relative
}

.about-mission__inner:after {
    content: "";
    background-image: url(assets/about-mission.webp);
    width: 482px;
    height: 661px;
    position: absolute;
    left: 100px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    top: -50px;
    pointer-events: none
}

.about-mission__tag {
    grid-column: 2 /9;
    color: var(--tertiary)
}

.about-mission__title {
    grid-column: 3 /9;
    color: var(--background);
    margin-bottom: 4rem;
    margin-top: 1rem
}

.about-mission__list {
    grid-column: 1/ 9;
    padding-bottom: 4rem
}

.about-mission__list li .h3 {
    padding-top: 1rem;
    padding-bottom: .5rem;
    color: var(--white)
}

.about-mission__list p {
    color: var(--background)
}

.about-mission__list li:nth-of-type(1) {
    grid-column: 1 / 3
}

.about-mission__list li:nth-of-type(2) {
    grid-column: 4 / 6
}

.about-mission__list li:nth-of-type(3) {
    grid-column: 7 / 9
}

.about-mission__link {
    grid-column: 1 /9;
    display: flex;
    justify-content: center
}

@media (max-width: 809px) {
    .about-mission__inner:after {
        display: none
    }

    .about-mission {
        padding-bottom: 4rem
    }

    .about-mission__inner>* {
        grid-column: 1 /5
    }

    .about-mission__title {
        margin-bottom: 2rem
    }

    .about-mission__list.grid {
        display: flex;
        flex-direction: column;
        gap: 2rem;
        padding-bottom: 2rem
    }
}

.about-lab {
    position: relative
}

.about-lab__inner {
    max-width: var(--container);
    margin: 0 auto;
    width: 100%;
    padding-bottom: 128px
}

.about-lab__tag {
    grid-column: 1/ 9;
    text-align: end;
    color: var(--secondary);
    padding-top: 128px
}

.about-lab__title {
    grid-column: 1/ 9;
    text-align: end;
    color: var(--primary);
    padding-bottom: 4rem;
    padding-top: 1rem
}

.about-lab__text {
    grid-column: 2/ 6;
    color: var(--secondary);
    padding-bottom: 10px
}

.about-lab-svg {
    grid-column: 1/9;
    width: 100%;
    height: auto;

    img {
        width: 100%
    }
}

@media (max-width:809px) {
    .about-lab__inner {
        padding-bottom: 4rem
    }

    .about-lab__tag {
        padding-top: 4rem
    }

    .about-lab__text {
        padding-bottom: 2rem
    }

    .about-lab__inner>* {
        grid-column: 1 /5;
        text-align: start
    }

    .about-lab__title {
        padding-bottom: 2rem;
        padding-top: .5rem
    }

    .about-lab-svg {
        max-width: 280px;
        margin: 0 auto;

        img {
            height: auto
        }
    }
}

.about-location {
    background-color: var(--primary);
    padding: 128px 0;
    position: relative
}

.about-location[data-no-after]:after {
    display: none
}

.about-location:after {
    content: "";
    width: 767px;
    height: 462px;
    position: absolute;
    right: 130px;
    bottom: -312px;
    background-image: url(assets/about-team-illustration.webp);
    background-size: contain;
    z-index: 2;
    background-repeat: no-repeat
}

.about-location__inner {
    max-width: var(--container);
    margin: 0 auto;
    grid-template-rows: auto auto auto 73px
}

.about-location__text {
    grid-column: 1 /5
}

.about-location__image {
    grid-column: 5 /9;
    width: 100%;
    grid-row: 2/4;
    height: 100%;
    object-fit: cover
}

.about-location__address {
    grid-column: 2 / 5;
    grid-row: 3 /5;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    color: var(--white);
    gap: .5rem
}

.about-location__tag {
    color: var(--tertiary);
    grid-column: 1/ 9;
    grid-row: 1/1;
    padding-bottom: 1rem
}

.about-location__title {
    color: var(--white);
    padding-bottom: 1rem
}

.about-location .text-l {
    color: var(--white);
    opacity: .8
}

.about-location .link {
    text-decoration: underline;
    border: none
}

@media (max-width: 809px) {
    .about-location {
        padding-top: 4rem;
        padding-bottom: 4rem;
        overflow-x: clip
    }

    .about-location__inner>* {
        grid-column: 1 /5;
        grid-row: unset
    }

    .about-location__inner.grid {
        grid-template-rows: unset
    }

    .about-location:after {
        bottom: -300px;
        right: -400px
    }

    .about-location__image {
        height: auto;
        width: 100%;
        display: flex
    }

    .about-location__address {
        padding-top: 2rem;
        padding-bottom: 2rem;
        gap: 1rem
    }
}

.solutions-hero {
    max-width: var(--container);
    margin: 0 auto;
    padding: 148px 0 4rem;
    position: relative
}

.solutions-hero__title {
    grid-column: 3 / 7;
    z-index: 2;
    color: var(--secondary)
}

.solutions-hero__text {
    grid-column: 5 / 8;
    position: relative;
    margin-top: 220px;
    color: var(--secondary);
    z-index: 2;

    &:before {
        content: "";
        width: 2px;
        height: 100%;
        background-color: var(--secondary);
        position: absolute;
        left: -20px
    }
}

.solutions-hero__link-container {
    grid-column: 6 /8;
    padding-top: 44px;
    color: var(--secondary)
}

.solutions-hero__image {
    position: absolute;
    left: 0;
    top: 254px;
    width: .375;
    height: auto
}

@media (max-width:809px) {
    .solutions-hero {
        padding-bottom: 2rem;
        padding-top: 100px
    }

    .solutions-hero>* {
        grid-column: 1 /5
    }

    .solutions-hero__image {
        position: static;
        grid-column: 2 / 5;
        width: 100%;
        height: auto
    }

    .solutions-hero__title {
        padding-bottom: 1rem
    }

    .solutions-hero__text {
        padding-top: 1rem;
        margin-top: 0
    }

    .solutions-hero__link-container {
        padding-top: 4rem;
        display: flex;
        justify-content: center
    }
}

.solutions-projects {
    background-color: var(--primary);
    margin-top: 128px;
    position: relative
}

.solutions-projects__inner {
    max-width: var(--container);
    width: 100%;
    margin: 0 auto;
    padding: 128px 0;
    position: relative
}

.solutions-projects:after {
    content: "";
    background-image: url(assets/solutions-projects.webp);
    width: 775px;
    height: 420px;
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right;
    right: 0;
    bottom: 0
}

.solutions-projects__tag {
    color: var(--tertiary);
    grid-column: 2 / 9
}

.solutions-projects__title {
    grid-column: 3 / 9;
    color: var(--white);
    margin-top: 1rem
}

.solutions-projects .h4 {
    position: relative;
    display: flex;
    justify-content: space-between
}

.solutions-projects .h4:after {
    content: "";
    width: 1.5rem;
    height: 1.5rem;
    background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.5 1.31134e-07L21 0L24 1.31134e-07V3V10.5H21L21 7.67501C21 6.78411 19.9229 6.33794 19.2929 6.9679L11.8713 14.3895L9.75 12.2682L17.311 4.70711C17.941 4.07714 17.4948 3 16.6039 3H13.5V1.31134e-07Z" fill="%23AFFF46"/><path d="M3 3H0V6V21V24H3H18H21V21V12H18V18C18 19.6569 16.6569 21 15 21H6C4.34315 21 3 19.6569 3 18V9C3 7.34315 4.34315 6 6 6L12 6V3H3Z" fill="%23AFFF46"/></svg>');
    background-size: contain;
    background-repeat: no-repeat
}

.solutions-projects__subtitle {
    grid-column: 2 / 9;
    margin-top: 128px;
    margin-bottom: 4rem;
    color: #fff
}

.solutions-projects__columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-column: 1 / 9;
    gap: 20px;
    z-index: 2
}

.solutions-projects__column {
    display: flex;
    flex-direction: column;
    gap: 20px
}

.solutions-projects__item {
    background-color: var(--secondary);
    padding: 3rem 2rem;
    color: #fff;
    position: relative;
    display: flex;
    flex-direction: column;
    transition: background .3s ease-in-out;

    div,
    p {
        opacity: .8
    }

    div {
        margin-top: .5rem;
        margin-bottom: 1.5rem
    }

    p {
        flex-grow: 1;
        display: flex;
        align-items: flex-end
    }
}

.solutions-projects__item:hover {
    background-color: #03422ccc
}

.solutions-projects__item-link:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2
}

div.solutions-projects__logos {
    background-color: var(--white);
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
    align-self: flex-start;
    padding: .5rem;
    margin-top: 1.5rem;

    img {
        height: 2rem;
        width: auto;
        flex-shrink: 0
    }
}

@media (max-width: 809px) {
    .solutions-projects__columns {
        grid-template-columns: repeat(1, minmax(0, 1fr))
    }

    .solutions-projects__inner {
        padding-bottom: 2rem;
        padding-top: 4rem
    }

    .solutions-projects__item {
        padding: 1.5rem 1rem
    }

    .solutions-projects__tag,
    .solutions-projects__title,
    .solutions-projects__subtitle {
        grid-column: 1 /5
    }

    .solutions-projects__subtitle {
        margin-top: 2rem;
        margin-bottom: 2rem
    }

    .solutions-projects:after {
        display: none
    }
}

.solutions-publications {
    position: relative;
    background-color: var(--primary)
}

.solutions-publications[data-theme=light] {
    &:after {
        display: none
    }

    &:before {
        background-image: url(assets/approach-publications.webp);
        width: 587px;
        height: 707px;
        left: 0;
        bottom: -175px;
        background-size: contain;
        background-repeat: no-repeat
    }

    .solutions-publications__list {
        background-color: var(--primary)
    }

    .solutions-publications__item:hover {
        background-color: var(--secondary)
    }

    .h3 {
        color: var(--primary)
    }

    .h4 {
        color: var(--white)
    }

    .text {
        color: var(--background);
        opacity: .8
    }

    .text:after {
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M9 0H16V7H14L14 5.11667C14 4.52274 13.2819 4.22529 12.8619 4.64527L7.91421 9.59299L6.5 8.17877L11.5407 3.13807C11.9607 2.7181 11.6632 2 11.0693 2H9V0Z" fill="white"/><path d="M0 2V16H14V8H12V12C12 13.1046 11.1046 14 10 14H4C2.89543 14 2 13.1046 2 12V6C2 4.89543 2.89543 4 4 4L8 4V2H0Z" fill="white"/></svg>')
    }

    background-color:var(--background);
    padding-top:128px;
    padding-bottom:4rem
}

.solutions-publications:before {
    content: "";
    width: 570px;
    height: 390px;
    position: absolute;
    left: 0;
    bottom: 300px;
    background-image: url(assets/solutions-publications.webp)
}

.solutions-publications:after {
    content: "";
    width: 815px;
    height: 1154px;
    position: absolute;
    right: 0;
    top: calc(100% - 96px);
    background-image: url(assets/solutions-cta-background.webp);
    z-index: 2;
    background-size: contain;
    background-repeat: no-repeat
}

.solutions-publications__inner {
    max-width: var(--container);
    margin: 0 auto;
    width: 100%
}

.solutions-publications__title {
    grid-column: 2/9;
    color: var(--background)
}

.solutions-publications__list {
    grid-column: 3 / 8;
    background-color: var(--background);
    padding: 2rem 1rem;
    margin-top: 4rem;
    display: flex;
    flex-direction: column;
    gap: 2rem
}

.solutions-publications__item {
    padding: 1rem;
    position: relative;
    transition: background-color .3s ease
}

.solutions-publications__item:hover {
    background: #03422c1a
}

.solutions-publications__item a:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0
}

.solutions-publications__item .h4 {
    color: var(--secondary);
    margin-bottom: .5rem
}

.solutions-publications .text {
    color: var(--primary);
    opacity: .8;
    display: flex;
    justify-content: space-between
}

.solutions-publications .text:after {
    content: "";
    width: 1rem;
    height: 1rem;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M9 0H16V7H14L14 5.11667C14 4.52274 13.2819 4.22529 12.8619 4.64527L7.91421 9.59299L6.5 8.17877L11.5407 3.13807C11.9607 2.7181 11.6632 2 11.0693 2H9V0Z" fill="%23089162"/><path d="M0 2V16H14V8H12V12C12 13.1046 11.1046 14 10 14H4C2.89543 14 2 13.1046 2 12V6C2 4.89543 2.89543 4 4 4L8 4V2H0Z" fill="%23089162"/></svg>');
    flex-shrink: 0
}

@media (max-width: 809px) {
    .solutions-publications[data-theme=light] {
        padding-top: 4rem;
        padding-bottom: 2rem
    }

    .solutions-publications {
        padding-bottom: 4rem
    }

    .solutions-publications:before {
        display: none
    }

    .solutions-publications__list,
    .solutions-publications__title {
        grid-column: 1 /5
    }

    .solutions-publications__list {
        margin-top: 2rem;
        padding: 2rem 1rem
    }

    .solutions-publications__item {
        padding: 0
    }

    .solutions-publications__item:hover {
        background-color: var(--background)
    }
}

.careers-hero {
    padding-top: 212px;
    padding-bottom: 221px
}

.careers-hero:before {
    content: "";
    width: 626px;
    height: 869px;
    position: absolute;
    left: 20px;
    top: 0;
    background-image: url(assets/careers-hero-background.webp);
    background-size: contain;
    background-repeat: no-repeat;
    pointer-events: none
}

.careers-hero__inner {
    max-width: var(--container);
    width: 100%;
    margin: 0 auto
}

.careers-hero__title {
    grid-column: 2 / 7;
    color: var(--secondary)
}

.careers-hero__text {
    grid-column: 3 / 6;
    margin-top: 197px;
    position: relative;
    color: var(--secondary);

    a {
        text-decoration: underline
    }

    &:before {
        content: "";
        width: 2px;
        height: 100%;
        top: 0;
        background-color: var(--secondary);
        left: -20px;
        position: absolute
    }
}

.careers-hero__image {
    position: absolute;
    right: 0;
    top: 192px;
    width: 37.5%;
    height: auto;
    z-index: -1
}

@media (max-width:809px) {
    .careers-hero {
        padding-top: 100px;
        padding-bottom: 4rem
    }

    .careers-hero:before {
        display: none
    }

    .careers-hero__image {
        position: static;
        grid-column: 2 /5;
        width: 100%;
        margin: 1rem 0
    }

    .careers-hero__title {
        grid-column: 1 / 5
    }

    .careers-hero__text {
        grid-column: 1/5;
        margin-top: 0
    }
}

.careers-none {
    max-width: var(--container);
    margin: 0 auto;
    color: var(--primary);
    padding-bottom: 128px
}

.careers-none__title {
    grid-column: 2 / 9
}

.careers-none__subtitle {
    grid-column: 2/9;
    margin: 20px 0
}

.careers-none__text {
    grid-column: 3 / 6;

    a {
        text-decoration: underline;

        &:hover {
            text-decoration-style: dashed
        }
    }
}

@media (max-width:809px) {
    .careers-none {
        padding-bottom: 4rem;

        >* {
            grid-column: 1 /5
        }
    }
}

.careers-offers {
    max-width: var(--container);
    margin: 0 auto;
    padding-bottom: 4rem
}

.careers-offers__offer {
    grid-column: span 4;
    background-color: var(--secondary);
    padding: 3rem 2rem;
    height: 250px;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    gap: 1rem;
    transition: background-color .3s ease;

    &:hover {
        background-color: #03422ccc
    }

    h2 {
        color: var(--white);
        flex-grow: 1;
        width: 100%;
        display: flex;
        gap: 1rem;
        justify-content: space-between
    }

    h2:after {
        content: "";
        width: 1.5rem;
        height: 1.5rem;
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M12.8305 10.5C14.8351 10.5 15.8389 8.07643 14.4215 6.65901L9.8625 2.1L12 -1.04907e-06L24 12L12 24L9.8625 21.9L14.4215 17.341C15.8389 15.9236 14.8351 13.5 12.8305 13.5L9.17939e-07 13.5L1.18021e-06 10.5L12.8305 10.5Z" fill="%23AFFF46"/></svg>');
        background-size: contain;
        background-repeat: no-repeat
    }

    a:before {
        content: "";
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0
    }
}

@media (max-width:809px) {
    .careers-offers {
        padding-bottom: 2rem;
        row-gap: 1rem
    }

    .careers-offers__offer {
        height: auto;
        padding: 1.5rem 1rem;
        gap: 4rem
    }
}

.careers-connect {
    max-width: var(--container);
    margin: 0 auto;
    padding-bottom: 128px
}

.careers-connect__inner {
    grid-column: 2 / 7;
    display: flex;
    flex-direction: column;
    align-items: flex-start
}

.careers-connect__text {
    margin-top: 2rem;
    margin-bottom: 3rem;
    color: var(--secondary)
}

.careers-connect__title {
    color: var(--secondary)
}

.careers-connect__tag {
    margin-bottom: 1rem;
    color: var(--secondary)
}

@media (max-width:809px) {
    .careers-connect {
        padding-bottom: 4rem
    }

    .careers-connect__inner {
        grid-column: 1/5
    }

    .careers-connect__inner a {
        align-self: center
    }
}

.job-offer {
    padding-top: 212px;
    max-width: var(--container);
    margin: 0 auto;
    color: var(--secondary);
    padding-bottom: 8rem
}

.job-offer h1 {
    margin-bottom: 1rem;
    color: var(--secondary);
    margin-top: 1rem
}

.job-offer__back {
    display: inline-flex;
    align-items: center;
    gap: .5rem
}

.job-offer__back:before {
    content: "";
    width: 1rem;
    height: 1rem;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M7.63023 8.66663C6.73932 8.66663 6.29316 9.74377 6.92312 10.3737L8.94935 12.4L7.99935 13.3333L2.66602 7.99996L7.99935 2.66663L8.94935 3.59996L6.92312 5.62619C6.29316 6.25615 6.73932 7.33329 7.63023 7.33329H13.3327V8.66663H7.63023Z" fill="%23089162"/></svg>');
    background-size: contain;
    background-repeat: no-repeat
}

.job-offer>* {
    grid-column: 2 / 7
}

.job-offer__image {
    grid-column: 1/9;
    width: 100%;
    margin-top: 4rem;
    margin-bottom: 8rem
}

.job-offer ul {
    list-style: disc;
    padding-left: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: .5rem
}

.job-offer h2 {
    margin-bottom: 1rem
}

.job-offer h2+p,
.job-offer h2+ul {
    margin-bottom: 4rem
}

.job-offer__cta {
    background-color: var(--secondary);
    color: var(--white);
    padding: 3rem 2rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;

    .text-l {
        margin-top: 1rem;
        margin-bottom: 3rem
    }
}

@media (max-width:809px) {
    .job-offer {
        padding-bottom: 4rem
    }

    .job-offer__back {
        justify-content: flex-end;
        padding-bottom: 3rem
    }

    .job-offer h2+p,
    .job-offer h2+ul {
        margin-bottom: 2rem
    }

    .job-offer {
        padding-top: 100px
    }

    .job-offer>* {
        grid-column: 1/5
    }

    .job-offer__image {
        margin-bottom: 2rem;
        margin-top: 2rem
    }

    .job-offer__cta {
        padding: 1.5rem 1rem
    }
}

.contact-hero {
    padding-top: 148px;
    padding-bottom: 4rem;
    position: relative
}

.contact-hero__inner {
    max-width: var(--container);
    width: 100%;
    margin: 0 auto;
    align-items: start;
    grid-template-rows: auto 1fr
}

.contact-hero__form {
    background-color: var(--secondary)
}

.contact-hero__title {
    grid-column: 2 / 6;
    color: var(--secondary)
}

.contact-hero__text {
    grid-column: 3 / 6;
    margin-top: 44px;
    position: relative;
    color: var(--secondary);
    z-index: 2;

    &:before {
        content: "";
        width: 2px;
        height: 100%;
        position: absolute;
        left: -20px;
        background-color: var(--secondary)
    }
}

.contact-hero__form {
    grid-column: 6 / 9;
    grid-row: 1 / 3;
    padding: 2rem 0;
    display: flex;
    justify-content: center;
    align-items: center;

    contact-form {
        max-width: 307px
    }
}

.contact-hero__image {
    position: absolute;
    left: 0;
    width: 37.5%;
    top: 414px;
    object-fit: cover
}

@media (max-width: 809px) {
    .contact-hero {
        padding-top: 100px;
        padding-bottom: 2rem
    }

    .contact-hero__inner>* {
        grid-column: 1 / 5
    }

    .contact-hero__image {
        display: none
    }

    .contact-hero__inner.grid {
        display: flex;
        flex-direction: column
    }

    .contact-hero__title {
        order: 1
    }

    .contact-hero__text {
        order: 2;
        margin-bottom: 2rem;
        margin-top: 1rem;

        &:before {
            display: none
        }
    }

    .contact-hero__form {
        order: 3;
        width: 100%
    }
}

.hp-hero {
    position: relative
}

.hp-hero:before {
    content: "";
    background-image: url(assets/herb-path-hero-background.webp);
    width: 547px;
    height: 194px;
    position: absolute;
    left: 0;
    bottom: 0;
    background-size: contain;
    background-repeat: no-repeat
}

.hp-hero__inner {
    margin: 0 auto;
    width: 100%;
    max-width: var(--container);
    padding-top: 148px;
    padding-bottom: 4rem
}

.hp-hero__tag {
    grid-column: 2 / 9;
    color: var(--secondary)
}

.hp-hero__title {
    grid-column: 2 / 7;
    color: var(--secondary);
    margin-top: 10px;
    margin-bottom: 4rem
}

.hp-hero__text {
    grid-column: 5 / 8;
    position: relative;
    color: var(--secondary)
}

.hp-hero__text:before {
    content: "";
    width: 2px;
    height: 100%;
    position: absolute;
    left: -20px;
    top: 0;
    background-color: var(--secondary);
    color: var(--primary)
}

@media (max-width: 809px) {
    .hp-hero__inner>* {
        grid-column: 1 / 5
    }

    .hp-hero__inner {
        padding-bottom: 2rem;
        padding-top: 100px
    }

    .hp-hero:before {
        display: none
    }

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

    .hp-hero__tag {
        text-align: end
    }
}

.hp-key__inner {
    max-width: var(--container);
    margin: 0 auto;
    width: 100%;
    position: relative;
    padding: 128px 0;
    display: block
}

.hp-key__inner:before {
    content: "";
    width: 589px;
    height: 363px;
    position: absolute;
    left: 200px;
    bottom: 100px;
    background-image: url(assets/hp-key-background.webp);
    background-repeat: no-repeat;
    background-size: contain
}

.hp-key__number {
    font-family: MartianMono;
    font-size: 104px;
    font-style: normal;
    line-height: normal;
    color: var(--secondary)
}

.hp-key__number--plus:before {
    content: "+"
}

.hp-key__tag {
    grid-column: 1 / 9;
    color: var(--secondary)
}

.hp-key__title {
    grid-column: 1 / 5;
    color: var(--primary);
    margin-top: 1rem
}

.hp-key__number-container {
    grid-column: 5 / 9;
    display: flex;
    flex-direction: column;
    align-items: flex-end;

    .h3 {
        color: var(--primary)
    }
}

.hp-key__number-container:nth-of-type(3) {
    grid-column: 1 / 5;
    grid-row: 4/ 5;
    position: relative;

    &:after {
        content: "";
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none"><path d="M17.1074 14C19.7801 14 21.1186 10.7686 19.2287 8.87868L13.15 2.8L16 -1.39876e-06L32 16L16 32L13.15 29.2L19.2287 23.1213C21.1186 21.2314 19.7801 18 17.1074 18L1.22392e-06 18L1.57361e-06 14L17.1074 14Z" fill="%23089162"/></svg>');
        width: 2rem;
        height: 2rem;
        position: absolute;
        left: 120%;
        top: 50%;
        transform: translateY(-50%);
        background-size: contain;
        background-repeat: no-repeat
    }
}

@media (max-width: 1294px) {
    .hp-key__number-container:nth-of-type(3):after {
        left: 105%
    }
}

@media (max-width: 1050px) {
    .hp-key__inner.grid {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

    .hp-key__number-container:nth-of-type(3) {
        grid-row: unset
    }

    .hp-key .hp-key__number-container,
    .hp-key__title,
    .hp-key__tag {
        grid-column: 1 / 5
    }

    .hp-key__number-container:nth-of-type(3):after {
        margin: 6px 0;
        position: static;
        transform: translate(-100px) rotate(90deg)
    }
}

@media (max-width: 809px) {
    .hp-key__inner {
        padding: 4rem 0
    }

    .hp-key__inner:before {
        display: none
    }

    .hp-key__title {
        margin-bottom: 2rem
    }

    .hp-key__number {
        font-size: 4rem;
        -webkit-text-stroke-width: 2px
    }
}

.hp-what {
    background-color: var(--secondary)
}

.hp-what__inner {
    max-width: var(--container);
    margin: 0 auto;
    width: 100%;
    padding: 128px 0
}

.hp-what__tag-what {
    grid-column: 1/9;
    color: var(--tertiary);
    margin-bottom: 1rem
}

.hp-what__title-what {
    grid-column: 2 / 8;
    color: var(--white)
}

.hp-what__text-what {
    grid-column: 3 / 7;
    color: var(--background);
    opacity: .8;
    margin-top: 2rem;
    margin-bottom: 4rem
}

.hp-what__why-herb {
    grid-column: 1 / 9;
    color: var(--white)
}

.hp-what__herb-grid {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 20px;
    grid-column: 1 /9;
    margin-top: 2rem
}

.hp-what__herb-grid li .h3 {
    color: var(--white);
    margin-bottom: .5rem;
    margin-top: 1rem
}

.hp-what__herb-grid li .text {
    color: var(--background);
    opacity: .8
}

.hp-what__herb-grid li:nth-of-type(1) {
    grid-column: 1 / 3
}

.hp-what__herb-grid li:nth-of-type(2) {
    grid-column: 4 / 6
}

.hp-what__herb-grid li:nth-of-type(3) {
    grid-column: 7 / 9
}

.hp-what__why-herb-image {
    grid-column: 4 / 9;
    width: 100%;
    height: auto;
    object-fit: cover;
    margin-top: 2rem;
    margin-bottom: 96px
}

.hp-what__title-challenge {
    grid-column: 2 / 8;
    color: var(--white);

    span {
        color: var(--tertiary)
    }
}

.hp-what__text-challenge {
    grid-column: 3 / 7;
    color: var(--background);
    opacity: .8;
    margin-bottom: 96px;
    margin-top: 2rem;

    ul {
        list-style: disc;
        padding-left: 1rem;
        margin: .5rem 0
    }
}

.hp-what__tag-choose {
    grid-column: 1/9;
    text-align: end;
    color: var(--tertiary);
    margin-bottom: 1rem
}

.hp-what__title-choose {
    color: var(--white);
    grid-column: 1/ 9;
    margin-bottom: 4rem;
    text-align: end
}

.hp-what__list-choose {
    grid-column: 1 / 9;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    align-content: flex-end;
    column-gap: 198px;
    row-gap: 3rem;
    flex-wrap: wrap
}

.hp-what__list-choose-item {
    width: 24%;

    .h3 {
        color: var(--white);
        margin-top: 1rem;
        margin-bottom: .5rem
    }

    .text {
        color: var(--background);
        opacity: .8
    }
}

.hp-what__full-width-image {
    width: 100%;
    max-height: 559px;
    height: 100%;
    object-fit: cover;
    display: flex
}

@media (max-width: 809px) {
    .hp-what__inner {
        padding-top: 3rem;
        padding-bottom: 3rem
    }

    .hp-what__inner>* {
        grid-column: 1 / 5
    }

    .hp-what__herb-grid,
    .hp-what__list-choose {
        display: flex;
        flex-direction: column;
        gap: 2rem
    }

    .hp-what__list-choose-item {
        width: unset
    }

    .hp-what__title-choose {
        text-align: start;
        margin-bottom: 2rem
    }

    .hp-what__text-challenge {
        margin-bottom: 3rem
    }

    .hp-what__why-herb-image {
        margin: 3rem 0;
        height: 170px
    }

    .hp-what__text-what {
        margin-top: 1rem;
        margin-bottom: 3rem
    }

    .hp-what__full-width-image {
        height: 244px
    }
}

.hp-how {
    position: relative;
    background-color: var(--primary)
}

.hp-how:after {
    content: "";
    width: 346px;
    height: 493px;
    background-image: url(assets/hp-how.webp);
    position: absolute;
    right: 206px;
    top: 3rem;
    background-size: contain;
    background-repeat: no-repeat
}

.hp-how__inner {
    max-width: var(--container);
    margin: 0 auto;
    padding: 128px 0
}

.hp-how__tag {
    grid-column: 1/9;
    color: var(--tertiary);
    margin-bottom: 1rem
}

.hp-how__title {
    margin-bottom: 4rem;
    color: var(--white);
    grid-column: 1/9
}

.hp-how__items {
    grid-column: 1/9
}

.hp-how__item {
    grid-column: 2 / 6;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px
}

.hp-how__item:nth-of-type(2) {
    grid-column: 3 / 7;
    margin-top: 2rem
}

.hp-how__item:before {
    -webkit-text-stroke-width: 3px;
    -webkit-text-stroke-color: var(--secondary, #03422C);
    font-family: Urbanist;
    font-size: 10rem;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    color: transparent
}

.hp-how__item-content {
    grid-column: 2 / 5;
    display: flex;
    flex-direction: column;
    gap: .5rem;

    .h3 {
        color: var(--white)
    }

    .text {
        color: var(--background);
        opacity: .8
    }
}

.hp-how__item:nth-of-type(1):before {
    content: "1."
}

.hp-how__item:nth-of-type(2):before {
    content: "2."
}

@media (max-width:809px) {
    .hp-how__inner {
        padding: 4rem 0
    }

    .hp-how .hp-how__item {
        grid-column: 1 /5;
        display: flex;
        flex-direction: column
    }

    .hp-how__item:before {
        font-size: 4rem;
        -webkit-text-stroke-width: 2px
    }

    .hp-how__title {
        margin-bottom: 2rem
    }

    .hp-how:after {
        display: none
    }
}

.hp-show {
    background-color: var(--primary);
    padding-bottom: 128px
}

.hp-show__inner {
    max-width: var(--container);
    width: 100%;
    margin: 0 auto
}

.hp-show__tag {
    grid-column: 1/ 9;
    color: var(--tertiary)
}

.hp-show__title {
    grid-column: 1/9;
    color: var(--white);
    margin-top: 1rem;
    margin-bottom: 4rem
}

.hp-show__grid {
    grid-column: 1/9;
    grid-template-rows: repeat(1374, 1px)
}

.hp-show__item {
    background-color: var(--background);
    padding: 3rem 2rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;

    .h3 {
        color: var(--primary)
    }

    .text {
        color: var(--secondary);
        opacity: .8
    }

    svg {
        max-width: 100%;
        height: auto;
        align-self: center
    }
}

.hp-show__item:nth-of-type(1) {
    grid-column: 1 / 6;
    grid-row: 1 / 554;
    display: grid;
    gap: 20px;

    svg {
        grid-column: 1 / 5
    }

    .text {
        grid-column: 2 /5
    }
}

.hp-show__item:nth-of-type(2) {
    grid-column: 6 / 9;
    grid-row: 1 / 794
}

.hp-show__item:nth-of-type(3) {
    grid-column: 1 / 5;
    grid-row: 574 / 1394
}

.hp-show__item:nth-of-type(4) {
    grid-column: 5 / 9;
    grid-row: 813 / 1394
}

@media (max-width: 809px) {
    .hp-show {
        padding-bottom: 4rem
    }

    .hp-show__title {
        margin-bottom: 2rem
    }

    .hp-show .hp-show__grid {
        grid-template-rows: unset;
        gap: 20px
    }

    .hp-show .hp-show__item {
        grid-column: 1 / 5;
        grid-row: unset;
        padding: 1.5rem 1rem;
        gap: 2rem
    }

    .hp-show__item:nth-of-type(1) {
        display: flex
    }
}

.hp-elevate {
    position: relative;
    padding: 128px 0
}

.hp-elevate:before {
    content: "";
    background-image: url(assets/hp-elevate.webp);
    background-repeat: no-repeat;
    background-size: contain;
    width: 742px;
    height: 504px;
    position: absolute;
    left: 0;
    top: 330px
}

.hp-elevate__inner {
    max-width: var(--container);
    margin: 0 auto
}

.hp-elevate__tag {
    grid-column: 1 / 9;
    color: var(--secondary)
}

.hp-elevate__title {
    grid-column: 2 /9;
    color: var(--primary);
    margin-bottom: 4rem;
    margin-top: 1rem
}

.hp-elevate__grid {
    grid-column: 1 / 9;
    row-gap: 2rem
}

.hp-elevate__grid .h3 {
    color: var(--secondary);
    opacity: .8
}

.hp-elevate__grid li:nth-of-type(1) {
    grid-column: 2 / 5
}

.hp-elevate__grid li:nth-of-type(2) {
    grid-column: 5 / 9
}

.hp-elevate__grid li:nth-of-type(3) {
    grid-column: 3 / 6
}

.hp-elevate__grid li:nth-of-type(4) {
    grid-column: 6 / 9
}

.hp-elevate__faq-title {
    color: var(--secondary);
    opacity: .8
}

.hp-elevate__grid li .text {
    margin-top: 1rem;
    color: var(--primary);
    opacity: .8
}

@media (max-width:809px) {
    .hp-elevate {
        padding-bottom: 4rem;
        padding-top: 4rem
    }

    .hp-elevate:before {
        display: none
    }

    .hp-elevate__inner>* {
        grid-column: 1 /5
    }

    .hp-elevate__title {
        margin-bottom: 2rem
    }
}

.approach-hero {
    max-width: var(--container);
    margin: 0 auto;
    position: relative;
    padding-top: 148px;
    padding-bottom: 4rem
}

.approach-hero:after {
    content: "";
    background-image: url(assets/home-hero-flower.webp);
    width: 561px;
    height: 554px;
    position: absolute;
    right: 59px;
    top: 0;
    background-size: contain;
    background-repeat: no-repeat;
    pointer-events: none
}

.approach-hero__tag {
    grid-column: 2 / 9;
    color: var(--secondary)
}

.approach-hero__title {
    grid-column: 2 / 7;
    margin-top: 10px;
    color: var(--secondary)
}

.approach-hero__text {
    grid-column: 4 / 7;
    color: var(--secondary);
    position: relative;
    margin-top: 4rem;

    &:before {
        content: "";
        background-color: var(--primary);
        left: -20px;
        top: 0;
        position: absolute;
        width: 2px;
        height: 100%
    }
}

.approach-hero__video {
    width: 100%;
    object-fit: cover;
    height: 559px;
    display: flex
}

@media (max-width:809px) {
    .approach-hero {
        padding-top: 100px;
        padding-bottom: 2rem
    }

    .approach-hero:after {
        display: none
    }

    .approach-hero>* {
        grid-column: 1 /5
    }

    .approach-hero__text {
        margin-top: 1rem
    }

    .approach-hero__video {
        height: 244px
    }

    .approach-hero__tag {
        margin-bottom: 4rem;
        text-align: end
    }
}

.approach-what {
    background-color: var(--secondary);
    padding-top: 128px;
    position: relative
}

.approach-what:after {
    content: "";
    background-image: url(assets/about-team-illustration.webp);
    width: 533px;
    height: 536px;
    left: 20px;
    top: 830px;
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute
}

.approach-what__inner {
    max-width: var(--container);
    margin: 0 auto
}

.approach-what__tag {
    grid-column: 1/9;
    color: var(--tertiary)
}

.approach-what__title {
    grid-column: 2 / 8;
    color: var(--white);
    margin-top: 1rem;
    margin-bottom: 2rem
}

.approach-what__text {
    margin-bottom: 4rem;
    grid-column: 3 / 6;
    color: var(--background);
    opacity: .8
}

.approach-what__image {
    grid-column: 4/ 9;
    width: 100%;
    margin-bottom: 4rem;
    object-fit: cover
}

.approach-what__why-tag {
    margin-bottom: 1rem;
    color: var(--tertiary);
    grid-column: 1/ 9;
    text-align: end
}

.approach-what__why-title {
    color: var(--white);
    margin-bottom: 4rem;
    grid-column: 1/9;
    text-align: end
}

.approach-what__list {
    display: flex;
    grid-column: 1/9;
    flex-wrap: wrap;
    padding-bottom: 128px;
    justify-content: center;
    align-items: flex-start;
    align-content: flex-end;
    column-gap: 10rem;
    row-gap: 3rem
}

.approach-what__item {
    width: 24%
}

.approach-what__item .h3 {
    color: var(--white);
    margin-top: 1rem;
    margin-bottom: .5rem
}

.approach-what__item .text {
    color: var(--background);
    opacity: .8
}

.approach-what__footer {
    width: 100%;
    object-fit: cover;
    height: 559px;
    display: flex
}

@media (max-width: 809px) {
    .approach-what {
        padding-top: 4rem
    }

    .approach-what:after {
        display: none
    }

    .approach-what__inner>* {
        grid-column: 1/5
    }

    .approach-what__text {
        margin-bottom: 3rem
    }

    .approach-what__image {
        height: 170px;
        margin-bottom: 3
    }

    .approach-what__why-tag {
        margin-bottom: 1rem
    }

    .approach-what__why-title {
        text-align: start;
        margin-bottom: 2rem
    }

    .approach-what__list {
        row-gap: 2rem;
        padding-bottom: 3rem
    }

    .approach-what__item {
        width: 100%
    }

    .approach-what__footer {
        height: 244px
    }
}

.approach-app {
    background-color: var(--primary);
    padding-bottom: 4rem
}

.approach-app__inner:nth-of-type(1) {
    max-width: var(--container);
    margin: 0 auto;
    width: 100%;
    padding-top: 128px;
    padding-bottom: 4rem
}

.approach-app__tag {
    grid-column: 1 / 9;
    color: var(--tertiary)
}

.approach-app__title {
    grid-column: 1 / 9;
    color: var(--white);
    margin-top: 1rem;
    margin-bottom: 2rem
}

.approach-app__text {
    grid-column: 3 / 7;
    color: var(--background);
    opacity: .8
}

.approach-app__inner:nth-of-type(2) {
    position: relative;
    max-width: var(--container);
    margin: 0 auto
}

.approach-app__inner:nth-of-type(2):after {
    content: "";
    width: 482px;
    height: 480px;
    position: absolute;
    right: 160px;
    bottom: -164px;
    background-image: url(assets/approach-app-background.webp);
    background-size: contain;
    background-repeat: no-repeat
}

.approach-app applications-slider {
    z-index: 2;
    position: relative
}

.approach-app__second-text {
    grid-column: 2 / 6;
    color: var(--background);
    opacity: .8;
    margin-bottom: 2rem;
    margin-top: 4rem
}

.approach-app__link-container {
    grid-column: 2 / 4;
    display: flex
}

@media (max-width:809px) {
    .approach-app {
        padding-bottom: 2rem
    }

    .approach-app__inner>* {
        grid-column: 1/5
    }

    .approach-app__inner:nth-of-type(1) {
        padding-top: 4rem;
        padding-bottom: 2rem
    }

    .approach-app__second-text {
        margin-top: 2rem
    }
}

.approach-how {
    background-color: var(--primary)
}

.approach-how__inner {
    max-width: var(--container);
    margin: 0 auto;
    padding: 128px 0
}

.approach-how__tag {
    grid-column: 1/9;
    color: var(--tertiary)
}

.approach-how__title {
    grid-column: 1/9;
    color: var(--white);
    margin-top: 1rem;
    margin-bottom: 2rem
}

.approach-how__svg {
    grid-column: 1/9;
    width: 100%;
    height: auto
}

.approach-how__svg-mobile {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
    grid-column: 1/ 9;
    display: flex;
    flex-direction: column;
    gap: 1rem
}

.approach-how__item div:before {
    -webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: var(--secondary, #03422C);
    font-family: Urbanist;
    font-size: 64px;
    font-style: normal;
    font-weight: 700;
    color: transparent;
    line-height: normal
}

.approach-how__item .h3 {
    color: var(--white);
    margin-top: 20px;
    margin-bottom: .5rem
}

.approach-how__item .text {
    color: var(--background);
    opacity: .8
}

.approach-how__item:nth-of-type(1) div:before {
    content: "1."
}

.approach-how__item:nth-of-type(2) div:before {
    content: "2."
}

.approach-how__item:nth-of-type(3) div:before {
    content: "3."
}

.approach-how__item:nth-of-type(4) div:before {
    content: "4."
}

@media (max-width:809px) {
    .approach-how__svg {
        display: none
    }

    .approach-how__inner {
        padding-top: 0rem;
        padding-bottom: 4rem
    }

    .approach-how__svg-mobile {
        position: static;
        width: auto;
        height: auto;
        padding: auto;
        margin: unset;
        overflow: unset;
        clip: unset;
        white-space: unset;
        border-width: unset
    }
}

.ea-hero {
    max-width: var(--container);
    margin: 0 auto;
    padding: 148px 0 4rem;
    position: relative
}

.ea-hero:after {
    content: "";
    position: absolute;
    right: 2rem;
    bottom: -109px;
    background-image: url(assets/ea-hero-background.webp);
    background-size: contain;
    background-repeat: no-repeat;
    width: 592px;
    height: 358px
}

.ea-hero__title {
    grid-column: 3 / 8;
    z-index: 2;
    color: var(--secondary)
}

.ea-hero__text {
    grid-column: 5 / 8;
    position: relative;
    margin-top: 340px;
    color: var(--secondary);
    z-index: 2;

    &:before {
        content: "";
        width: 2px;
        height: 100%;
        background-color: var(--secondary);
        position: absolute;
        left: -20px
    }
}

.ea-hero__image {
    position: absolute;
    left: 0;
    top: 306px;
    width: .375;
    height: auto
}

@media (max-width:809px) {
    .ea-hero {
        padding-bottom: 2rem;
        padding-top: 100px
    }

    .ea-hero>* {
        grid-column: 1 /5
    }

    .ea-hero__image {
        position: static;
        grid-column: 2 / 5;
        width: 100%;
        height: auto
    }

    .ea-hero__title {
        padding-bottom: 1rem
    }

    .ea-hero__text {
        padding-top: 1rem;
        margin-top: 0
    }
}

.ea-intro {
    background-color: var(--secondary);
    padding-top: 128px;
    padding-bottom: 128px
}

.ea-intro__inner {
    max-width: var(--container);
    margin: 0 auto;
    width: 100%
}

.ea-intro__tag {
    color: var(--tertiary);
    grid-column: 2 /9
}

.ea-intro__title {
    color: var(--white);
    margin-top: 1rem;
    grid-column: 3 / 9;
    margin-bottom: 2rem
}

.ea-intro__text {
    grid-column: 3/ 9;
    color: var(--background);
    opacity: .8
}

.ea-intro__tag-assays {
    grid-column: 1/ 9;
    color: var(--tertiary);
    margin-top: 4rem
}

.ea-intro__title-assays {
    margin-top: 1rem;
    margin-bottom: 4rem;
    color: var(--white);
    grid-column: 2/ 9
}

@media (max-width:809px) {
    .ea-intro {
        padding-top: 4rem;
        padding-bottom: 4rem
    }

    .ea-intro__inner>* {
        grid-column: 1 /5
    }
}

.ea-key {
    padding-top: 128px;
    padding-bottom: 128px;
    max-width: var(--container);
    width: 100%;
    margin: 0 auto;
    position: relative
}

.ea-key__tag {
    color: var(--secondary);
    margin-bottom: 1rem;
    grid-column: 1/9
}

.ea-key__title {
    color: var(--secondary);
    margin-bottom: 2rem;
    grid-column: 1/9
}

.ea-key__text:nth-of-type(1) {
    grid-column: 2 / 6;
    color: var(--secondary);
    opacity: .8
}

.ea-key__text:nth-of-type(2) {
    grid-column: 3 / 7;
    color: var(--secondary);
    opacity: .8;
    margin-bottom: 4rem
}

.ea-key__chart {
    display: grid;
    grid-column: 1/9;
    grid-template-columns: 40% 25% 25% 10%;
    margin-bottom: 4rem;
    margin-top: 4rem
}

.ea-key__chart>div {
    display: flex;
    flex-direction: column;
    align-items: center
}

.ea-key__chart .text-l {
    color: var(--secondary);
    opacity: .8
}

.ea-key__chart .text {
    color: var(--tertiary);
    padding-top: 40px;
    padding-right: 14px;
    padding-bottom: 10px;
    text-align: end;
    display: block;
    background-color: #000;
    width: 100%;
    margin-top: .25rem
}

.ea-key__chart div:nth-of-type(1) .text {
    background-color: var(--secondary)
}

.ea-key__chart div:nth-of-type(2) .text {
    background-color: #245a45
}

.ea-key__chart div:nth-of-type(3) .text {
    background-color: #407c63
}

.ea-key__chart div:nth-of-type(4) .text {
    background-color: #5d9f83
}

.ea-key__table-mobile {
    display: none
}

.ea-key__table {
    grid-column: 2 / 8;
    margin-bottom: 128px
}

.ea-key__table thead {
    color: var(--secondary);
    opacity: .8;
    border-bottom: black 2px solid
}

.ea-key__table tr {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 20px
}

.ea-key__table tr>* {
    grid-column: span 2
}

.ea-key__table thead th {
    padding-bottom: .5rem
}

.ea-key__table tbody th,
.ea-key__table tbody td {
    padding-top: 1.5rem
}

.ea-key__table tbody th,
.ea-key__table tbody td {
    color: var(--secondary);
    opacity: .8
}

.ea-key__image {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 553px;
    height: 390px;
    object-fit: cover
}

.ea-key__footer {
    grid-column: 5 / 9;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    color: var(--secondary);

    .h3 {
        margin-bottom: 1.5rem
    }

    .text-l {
        opacity: .8
    }

    .text-l:nth-of-type(2) {
        margin-top: 1rem;
        margin-bottom: 1rem
    }
}

@media (max-width:809px) {
    .ea-key {
        padding-bottom: 4rem;
        padding-top: 4rem
    }

    .ea-key>* {
        grid-column: 1/5
    }

    .ea-key__text:nth-of-type(1),
    .ea-key__text:nth-of-type(2) {
        grid-column: 1/5
    }

    .ea-key__table {
        display: none
    }

    .ea-key__table-mobile {
        display: block;
        width: 100%
    }

    .ea-key__chart {
        display: flex;
        flex-direction: column;
        margin-top: 2rem;
        margin-bottom: 2rem
    }

    .ea-key__chart div {
        display: flex;
        flex-direction: row;
        justify-content: space-between
    }

    .ea-key__chart div .text {
        padding: 0 4px 5px 0
    }

    .ea-key__chart div:nth-of-type(1) .text {
        width: 160px
    }

    .ea-key__chart div:nth-of-type(2) .text {
        width: 100px
    }

    .ea-key__chart div:nth-of-type(3) .text {
        width: 100px
    }

    .ea-key__chart div:nth-of-type(4) .text {
        width: 40px
    }

    .ea-key__image {
        position: static;
        width: 100%;
        height: auto;
        margin-top: 96px;
        margin-bottom: 1rem
    }

    .ea-key__footer .text-l:nth-of-type(2) {
        margin-bottom: 4rem
    }
}

.error {
    position: relative;
    padding-top: 148px
}

.error__inner {
    max-width: var(--container);
    margin: 0 auto
}

.error:after {
    content: "";
    width: 627px;
    height: 509px;
    position: absolute;
    left: -30px;
    bottom: -150px;
    background-image: url(assets/error.webp);
    background-size: contain;
    background-repeat: no-repeat;
    pointer-events: none;
    z-index: -1
}

.error__title {
    grid-column: 2 / 6;
    color: var(--secondary)
}

.error__text {
    margin-top: 4rem;
    margin-bottom: 4rem;
    grid-column: 3 / 6;
    color: var(--primary);
    opacity: .8
}

.error__links {
    grid-column: 3 / 6;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.5rem;
    margin-bottom: 300px
}

.error__image {
    position: absolute;
    right: 0;
    bottom: 82px;
    width: 553px;
    height: 390px;
    object-fit: contain
}

@media (max-width:809px) {
    .error__inner>* {
        grid-column: 1 /5
    }

    .error {
        padding-top: 100px
    }

    .error:after {
        display: none
    }

    .error__image {
        position: static;
        grid-column: 2 / 5;
        width: 100%;
        height: auto;
        margin-top: 1rem;
        margin-bottom: 1rem
    }

    .error__text {
        margin-top: 0;
        margin-bottom: 4rem
    }

    .error__links {
        align-items: unset;
        margin-bottom: 2rem
    }
}

.vision {
    max-width: var(--container);
    padding-top: 50px;
    padding-bottom: 128px;
    margin: 0 auto
}

.vision:after {
    content: "";
    width: 625px;
    height: 868px;
    position: absolute;
    top: 0;
    left: 20px;
    background-image: url(assets/our-vision-background.webp);
    background-size: contain;
    background-repeat: no-repeat;
    pointer-events: none
}

.vision .text-l {
    color: var(--secondary);
    opacity: .8
}

.vision__title {
    grid-column: 2 / 9;
    color: var(--secondary)
}

.vision .text-l:nth-of-type(1) {
    grid-column: 1 / 7;
    margin-top: 128px
}

.vision__team {
    position: absolute;
    right: 0;
    top: 98px;
    width: 375px;
    height: 264px;
    object-fit: cover
}

.vision__presentation {
    grid-column: 3 / 7;
    width: 100%;
    margin-top: 4rem;
    margin-bottom: 2rem
}

.vision .text-l:nth-of-type(2) {
    grid-column: 3 / 7
}

.vision .text-l:nth-of-type(3) {
    grid-column: 2 / 5;
    margin-top: 4rem
}

.vision .text-l:nth-of-type(4) {
    grid-column: 3 / 7;
    margin-top: 4rem
}

.vision__footer {
    grid-column: 2 / 7;
    margin-top: 4rem;
    margin-bottom: 2rem;
    width: 100%
}

.text-l:nth-of-type(5) {
    grid-column: 2/ 7
}

@media (max-width:809px) {
    .vision {
        padding-top: 100px;
        padding-bottom: 4rem
    }

    .vision>* {
        grid-column: 1/5 !important
    }

    .vision:after {
        display: none
    }

    .vision__presentation {
        margin-top: 0rem
    }

    .vision .text-l {
        margin-top: 0 !important;
        margin-bottom: 2rem !important
    }

    .vision__team {
        display: none
    }

    .vision__footer {
        margin-top: 0
    }

    .vision__title {
        margin-bottom: 1rem
    }
}

.eat-hero {
    padding-top: 148px;
    padding-bottom: 4rem;
    position: relative;
    margin: 0 auto;
    max-width: var(--container)
}

.eat-hero:after {
    content: "";
    background-image: var(--backgroundImage);
    width: 564px;
    height: 68%;
    position: absolute;
    left: 20px;
    bottom: 0;
    background-size: contain;
    background-repeat: no-repeat;
    z-index: -1;
    background-position: bottom left
}

.eat-hero__back-container {
    display: flex;
    align-items: center;
    grid-column: 2 / 9;
    gap: 10px;
    color: var(--secondary)
}

.eat-hero__back-container:before {
    content: "";
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M7.63023 8.66663C6.73932 8.66663 6.29316 9.74377 6.92312 10.3737L8.94935 12.4L7.99935 13.3333L2.66602 7.99996L7.99935 2.66663L8.94935 3.59996L6.92312 5.62619C6.29316 6.25615 6.73932 7.33329 7.63023 7.33329H13.3327V8.66663H7.63023Z" fill="%23089162"/></svg>');
    background-size: contain;
    width: 1rem;
    height: 1rem;
    flex-shrink: 0
}

.eat-hero__links {
    grid-column: 3 / 9;
    margin-top: 128px;
    color: var(--secondary);
    display: flex;
    flex-direction: column;
    gap: .5rem
}

.eat-hero__title {
    grid-column: 2/9;
    margin-top: 4rem;
    color: var(--secondary)
}

.eat-hero__image {
    position: absolute;
    right: 0;
    top: 84px;
    width: 552px;
    height: 390px;
    object-fit: cover;
    z-index: -1
}

.eat-hero__subtitle {
    grid-column: 2 / 7;
    color: var(--secondary);
    margin: 1rem 0
}

.eat-hero__text {
    grid-column: 2 / 7;
    color: var(--secondary);
    opacity: .8
}

@media (max-width:809px) {
    .eat-hero {
        padding-top: 100px;
        padding-bottom: 2rem
    }

    .eat-hero:after {
        display: none
    }

    .eat-hero>* {
        grid-column: 1 /5
    }

    .eat-hero__image {
        position: static;
        width: 100%;
        height: auto;
        margin-top: 2rem
    }

    .eat-hero__title {
        margin-top: 2rem
    }

    .eat-hero__links {
        margin-top: 0
    }

    .eat-hero__back-container {
        display: none
    }
}

.eat-numbers__inner {
    padding-top: 128px;
    padding-bottom: 128px;
    max-width: var(--container);
    margin: 0 auto;
    align-items: end
}

.eat-numbers__title {
    grid-column: 1/9;
    margin-bottom: 2rem;
    color: var(--secondary)
}

.eat-numbers__numbers {
    grid-column: 1/ 5;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;

    ul {
        width: 100%
    }

    li:nth-of-type(1) {
        margin-bottom: 1rem
    }

    li {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 20px;
        align-items: end;

        p {
            grid-column: span 2;
            color: var(--secondary);
            display: flex;
            align-items: flex-end;
            gap: 20px
        }

        p:nth-of-type(1) {
            text-align: end;
            display: flex;
            justify-content: flex-end;

            em {
                font-family: MartianMono;
                color: var(--secondary);
                font-size: 60px;
                font-style: normal;
                line-height: normal;
                margin-bottom: -15px
            }
        }
    }

    li[data-small] p:nth-of-type(1) em {
        font-size: 4rem
    }
}

.eat-numbers__note {
    color: var(--secondary);
    opacity: .8
}

.eat-numbers__text {
    grid-column: 5 / 9;
    color: var(--secondary);
    opacity: .8;
    display: flex;
    flex-direction: column;
    gap: 1rem
}

@media (max-width:1080px) {
    .eat-numbers__numbers {
        grid-column: 3/6;
        align-items: flex-end
    }

    .eat-numbers li {
        display: flex !important;
        flex-direction: column
    }

    .eat-numbers__text {
        grid-column: 3/8;
        padding-top: 2rem
    }
}

@media (max-width:809px) {
    .eat-numbers__title {
        grid-column: 1 / 5;
        margin-bottom: 1rem
    }

    .eat-numbers__text {
        grid-column: 1/5;
        padding-top: 20px
    }

    .eat-numbers__numbers {
        grid-column: 1/5
    }

    .eat-numbers ul {
        display: flex;
        flex-direction: column;
        gap: 2rem;
        text-align: end;
        justify-content: space-between;

        li p:nth-of-type(1) em {
            font-size: 2.5rem
        }
    }

    .eat-numbers__numbers li:nth-of-type(1) {
        margin-bottom: 0
    }

    .eat-numbers__numbers li[data-small] p:nth-of-type(1) em {
        font-size: 2.5rem
    }

    .eat-numbers__inner {
        padding-top: 0rem;
        padding-bottom: 2rem
    }
}

.eat-gallery {
    max-width: var(--container);
    margin: 0 auto;
    padding-bottom: 128px
}

.eat-gallery__images-container {
    grid-column: 1 /5;

    img {
        width: 100%
    }
}

.eat-gallery__title {
    grid-column: 1 / 9;
    color: var(--secondary);
    margin-bottom: 2rem
}

.eat-gallery__images-container {
    grid-column: 1 / 5;
    height: 420px;
    position: relative;

    img {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        pointer-events: none;
        object-fit: cover
    }

    figcaption {
        position: absolute;
        background: var(--primary);
        left: 0;
        z-index: 2;
        bottom: 0;
        width: 100%;
        max-width: 457px;
        padding: .5rem;
        color: var(--background);
        opacity: 0;
        pointer-events: none
    }
}

.eat-gallery__images-container figure[data-active] {
    img {
        opacity: 1;
        pointer-events: all
    }

    figcaption {
        opacity: 1;
        pointer-events: all
    }
}

.eat-gallery__button {
    position: absolute;
    right: 0;
    bottom: 0;
    padding: 1rem;
    display: flex;
    gap: 1rem;
    color: var(--background);
    background-color: var(--primary);
    cursor: pointer;
    transition: background-color .3s ease;

    &:hover {
        background-color: var(--secondary)
    }

    span {
        user-select: none
    }
}

.eat-gallery__button:after {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M8.36977 7.33337C9.26068 7.33337 9.70684 6.25623 9.07688 5.62627L7.05065 3.60004L8.00065 2.66671L13.334 8.00004L8.00065 13.3334L7.05065 12.4L9.07688 10.3738C9.70684 9.74385 9.26068 8.66671 8.36977 8.66671L2.66732 8.66671L2.66732 7.33337L8.36977 7.33337Z" fill="%23A7F0CC"/></svg>');
    content: "";
    width: 1rem;
    height: 1rem;
    flex-shrink: 0
}

.eat-gallery__right {
    grid-column: 5 / 9
}

.eat-gallery__pickers {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;

    button {
        height: 98px;
        cursor: pointer;
        outline: 2px solid transparent;
        transition: outline-color .3s ease;

        &:hover {
            outline-color: var(--primary)
        }
    }

    button[data-active] {
        outline-color: var(--primary)
    }

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

.eat-gallery__text {
    margin-top: 80px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    color: var(--secondary);
    opacity: .8
}

@media (max-width: 1204px) {
    .eat-gallery__images-container figcaption {
        max-width: calc(100% - 105px - 2rem)
    }
}

@media (max-width:809px) {
    .eat-gallery__title {
        grid-column: 1/5
    }

    .eat-gallery {
        padding-bottom: 2rem
    }

    .eat-gallery__images-container {
        height: 316px
    }

    .eat-gallery__images-container figcaption {
        max-width: 100%
    }

    .eat-gallery__right {
        grid-column: 1/5;
        padding-top: 20px
    }

    .eat-gallery__text {
        margin-top: 1.5rem
    }

    .eat-gallery__button {
        display: none
    }

    .eat-gallery__pickers button {
        height: 69px
    }
}

.eat-pagination {
    max-width: var(--container);
    margin: 0 auto;
    width: 100%;
    padding-bottom: 128px;
    color: var(--secondary);

    div:nth-of-type(1) {
        grid-column: 1 /3;
        display: flex;
        gap: 1rem;
        align-items: center;

        &:before {
            content: "";
            width: 1rem;
            height: 1rem;
            background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M8.36977 7.33325C9.26068 7.33325 9.70684 6.25611 9.07688 5.62614L7.05065 3.59992L8.00065 2.66658L13.334 7.99992L8.00065 13.3333L7.05065 12.3999L9.07688 10.3737C9.70684 9.74373 9.26068 8.66658 8.36977 8.66658L2.66732 8.66658L2.66732 7.33325L8.36977 7.33325Z" fill="%23089162"/></svg>');
            background-size: contain;
            background-repeat: no-repeat;
            transform: rotate(-180deg)
        }
    }

    div:nth-of-type(2) {
        grid-column: 5 /7;
        display: flex;
        justify-content: flex-end;
        gap: 1rem;
        align-items: center;

        &:after {
            content: "";
            width: 1rem;
            height: 1rem;
            background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M8.36977 7.33325C9.26068 7.33325 9.70684 6.25611 9.07688 5.62614L7.05065 3.59992L8.00065 2.66658L13.334 7.99992L8.00065 13.3333L7.05065 12.3999L9.07688 10.3737C9.70684 9.74373 9.26068 8.66658 8.36977 8.66658L2.66732 8.66658L2.66732 7.33325L8.36977 7.33325Z" fill="%23089162"/></svg>');
            background-size: contain;
            background-repeat: no-repeat
        }
    }
}

@media (max-width: 1100px) {
    .eat-pagination div:nth-of-type(1) {
        grid-column: 1 / 5
    }

    .eat-pagination div:nth-of-type(2) {
        grid-column: 5 / 9
    }
}

@media (max-width:809px) {
    .eat-pagination {
        padding-bottom: 4rem
    }

    .eat-pagination div:nth-of-type(1) {
        grid-column: 1/5;
        margin-bottom: 1.5rem
    }

    .eat-pagination div:nth-of-type(2) {
        grid-column: 1/5
    }
}

.eat-chart {
    max-width: var(--container);
    margin: 0 auto;
    padding-bottom: 128px
}

.eat-chart__left {
    padding-top: 128px;
    grid-column: 1 / 5;
    display: flex;
    flex-direction: column
}

.eat-chart__title {
    color: var(--secondary)
}

.eat-chart__left .text {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-end;
    color: var(--secondary);
    opacity: .8;
    gap: 1rem
}

.eat-chart__right {
    grid-column: 5 /9
}

.eat-chart__right {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem
}

.eat-chart__image {
    width: 100%;
    height: auto
}

.eat-chart__note {
    background-color: var(--primary);
    color: var(--background);
    padding: .5rem;
    margin-left: calc((100% + 20px)/4)
}

@media (max-width:809px) {
    .eat-chart {
        padding-bottom: 2rem
    }

    .eat-chart>* {
        grid-column: 1/5
    }

    .eat-chart__left {
        padding-top: 0
    }

    .eat-chart__title {
        padding-bottom: 1rem
    }

    .eat-chart__right {
        margin-top: 20px
    }

    .eat-chart__note {
        margin-left: 0
    }
}

.eat-text-image {
    margin: 0 auto;
    max-width: var(--container);
    padding-bottom: 128px
}

.eat-text-image[data-large] {
    .eat-text-image__figure {
        grid-column: 1 /6;
        height: 528px
    }

    .eat-text-image__text {
        grid-column: 6 / 9
    }
}

.eat-text-image__title {
    grid-column: 1 / 9;
    margin-bottom: 2rem;
    color: var(--secondary)
}

.eat-text-image__figure {
    grid-column: 1 /5;
    position: relative;
    height: 420px
}

.eat-text-image__image {
    width: 100%;
    display: flex;
    height: 100%;
    object-fit: cover
}

.eat-text-image__caption {
    position: absolute;
    left: 0;
    bottom: 0;
    background-color: var(--primary);
    padding: .5rem;
    color: var(--background);
    max-width: 457px
}

.eat-text-image__text {
    grid-column: 5 / 9;
    display: flex;
    align-items: flex-end;
    color: var(--secondary);
    opacity: .8
}

@media (max-width:809px) {
    .eat-text-image[data-large] {
        .eat-text-image__figure {
            grid-column: 1 /5
        }

        .eat-text-image__text {
            grid-column: 1 / 5
        }
    }

    .eat-text-image {
        padding-bottom: 2rem
    }

    .eat-text-image__title {
        margin-bottom: 1rem
    }

    .eat-text-image__image {
        height: 100%
    }

    .eat-text-image>* {
        grid-column: 1 /5
    }

    .eat-text-image__text {
        padding-top: 1rem
    }
}

.header {
    position: fixed;
    max-width: var(--container);
    width: 100%;
    margin: 0 auto;
    top: 0;
    left: 50%;
    transform: translate(-50%);
    display: flex;
    justify-content: space-between;
    padding: 2rem 0rem;
    z-index: 98;
    mix-blend-mode: multiply
}

[data-barba-namespace=home] .header {
    opacity: 0
}

/* .header__logo {
    display: flex;
    align-items: center;
    gap: 6px;
    position:absolute !important;
} */
/* Move left on scroll */
.header__logo {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    transition: all 0.4s ease
}

.header__logo.scrolled {
    left: -20px;
    transform: translateX(0);
    margin-top:2%
}

@media (max-width:809px) {
    .header__logo svg:nth-of-type(2) {
        display: none
    }
}

.input input,
.input textarea {
    border: 1px solid var(--primary);
    padding: .5rem .75rem;

    &::placeholder {
        color: #fff6
    }
}

.input {
    display: flex;
    flex-direction: column;
    gap: .25rem;
    color: #fff
}

lets-talk {
    max-width: 435px;
    height: 100dvh;
    width: 100%;
    position: fixed;
    right: 0;
    top: 0;
    background-color: var(--secondary);
    z-index: 99;
    padding: 6rem 4rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    transition: transform .3s ease;
    overflow-y: scroll
}

lets-talk[data-display=false]~.lets-talk__close-background {
    pointer-events: none;
    opacity: 0
}

.lets-talk__close-background {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 98;
    width: 100%;
    height: 100%;
    background: #00000080;
    pointer-events: all;
    opacity: 1;
    transition: opacity .2s ease
}

lets-talk[data-display=false] {
    transform: translate(100%)
}

lets-talk>button {
    position: fixed;
    right: 20px;
    top: 2rem
}

@media (max-width:809px) {
    lets-talk {
        padding: 4rem 2rem
    }
}

[data-navigation=open] {
    .navigation {
        transform: translateY(0);
        transition: transform .3s ease-in
    }
}

[data-navigation=close] {
    .navigation {
        pointer-events: none;
        transform: translateY(-100vh);
        overflow: hidden
    }
}

.navigation {
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background-color: var(--secondary);
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform .3s ease-in
}

.navigation .button {
    position: absolute;
    right: 3rem;
    top: 3rem
}

.navigation__inner {
    padding: 128px 0;
    width: 100%
}

.navigation__header {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: clamp(0px, 100% - 2rem, 1130px);
    margin: 0 auto
}

.navigation__nav-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3rem;
    color: #fff;
    padding: 4rem 0;
    text-align: center
}

.navigation__main-nav {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;

    a:hover {
        color: #afff46
    }
}

.navigation__sub-nav {
    display: flex;
    gap: 1rem
}

.navigation a {
    transition: color .3s ease-in-out
}

.navigation__get-in-touch {
    border-left: 2px solid var(--background);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--white);
    position: relative;

    a:hover {
        color: var(--tertiary)
    }
}

.navigation__get-in-touch:after {
    content: "";
    background-image: url(assets/footer-plant.webp);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 449px;
    height: 605px;
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%) translateY(-50%);
    pointer-events: none
}

.navigation__footer {
    max-width: clamp(0px, 100% - 2rem, 1184px);
    margin: 100px auto 0;
    display: flex;
    justify-content: space-between;
    color: var(--white)
}

.navigation__social {
    display: flex;
    gap: 1rem
}

@media (max-width:809px) {
    .navigation__get-in-touch {
        border: none;
        position: static;
        transform: none
    }

    .navigation__get-in-touch a {
        display: none
    }

    .navigation__header {
        display: flex;
        flex-direction: column;
        gap: 1rem
    }

    .navigation__footer {
        display: none
    }
}

.footer {
    background-color: var(--secondary);
    padding: 80px 0 16px;
    position: relative;
    overflow: hidden;
    z-index: 3
}

.footer:after {
    content: "";
    width: 449px;
    height: 606px;
    background-image: url(assets/footer-plant.webp);
    background-size: cover;
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    bottom: -3rem;
    pointer-events: none
}

.footer__inner {
    margin: 0 auto;
    max-width: var(--container)
}

.footer__presentation {
    grid-column: 1 / 5;
    display: flex;
    flex-direction: column;
    align-items: flex-start
}

.footer__text {
    color: var(--background);
    padding-top: 2rem;
    flex-grow: 1
}

.footer__top {
    color: var(--white)
}

.footer__navs {
    grid-column: 6 / 9;

    nav {
        display: flex;
        flex-direction: column;
        gap: 2rem
    }
}

.footer__nav-section {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 20px;

    .text {
        grid-column: 1 / 1;
        color: var(--background)
    }

    ul {
        grid-column: 2 /4;
        color: var(--white);
        display: flex;
        flex-direction: column;
        gap: 1rem
    }
}

.footer__venora {
    padding-top: 80px;
    grid-column: 1 / 9;
    height: auto;
    width: 100%;
    padding-bottom: 1rem;
    position: relative
}

.footer__copy {
    grid-column: 1 / 3;
    color: var(--background)
}

.footer__legal-nav {
    grid-column: 3 / 7;
    color: var(--background);

    ul {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 1rem
    }
}

.footer__signature {
    grid-column: 7/9;
    color: var(--background);
    font-size: .8rem;
    display: flex;
    flex-direction: column;
    align-items: flex-end;

    a {
        text-decoration: underline
    }
}

@media (max-width: 809px) {
    .footer__presentation {
        grid-column: 1/ 5
    }

    .footer__text {
        padding-bottom: 1rem
    }

    .footer__navs {
        grid-column: 1 /5;
        margin-top: 4rem
    }

    .footer__venora {
        grid-column: 1/5
    }

    .footer__legal-nav {
        padding: 20px 0
    }

    .footer__nav-section {
        grid-template-columns: repeat(4, minmax(0, 1fr));

        .text {
            grid-column: 1/1
        }

        ul {
            grid-column: 2 / 5
        }
    }

    .footer__copy,
    .footer__legal-nav,
    .footer__signature {
        grid-column: 1/5;
        display: flex;
        align-items: flex-start;
        justify-content: flex-start
    }

    .footer__legal-nav ul {
        flex-direction: column;
        align-items: flex-start
    }

    .footer__nav-section ul {
        align-items: flex-end;
        text-align: end
    }
}

.button {
    font-family: Urbanist;
    font-weight: 700;
    font-size: 1rem;
    line-height: 125%;
    text-transform: uppercase;
    cursor: pointer;
    color: var(--secondary)
}

.button[data-theme=light] {
    color: #fff;

    span:after {
        background-image: url('data:image/svg+xml,<svg width="7" height="22" viewBox="0 0 7 22" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0 1H6V21H0" stroke="%23AFFF46"/></svg>')
    }

    span:before {
        background-image: url('data:image/svg+xml,<svg width="7" height="22" viewBox="0 0 7 22" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7 1H1V21H7" stroke="%23AFFF46"/></svg>')
    }
}

.button span {
    padding: 0 1.25rem;
    text-align: center;
    position: relative;
    display: block
}

.button span:after {
    content: "";
    background-image: url('data:image/svg+xml,<svg width="7" height="22" viewBox="0 0 7 22" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0 1H6V21H0" stroke="%2303422C"/></svg>');
    height: 100%;
    aspect-ratio: 7/22;
    background-size: contain;
    position: absolute;
    right: 0;
    top: 0;
    transition: right .2s ease
}

.button span:before {
    content: "";
    background-image: url('data:image/svg+xml,<svg width="7" height="22" viewBox="0 0 7 22" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7 1H1V21H7" stroke="%2303422C"/></svg>');
    height: 100%;
    aspect-ratio: 7/22;
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
    transition: left .2s ease
}

.button:hover span {
    &:before {
        left: 10px
    }

    &:after {
        right: 10px
    }
}

.article {
    max-width: clamp(0px, 100% - 1rem, 1000px);
    margin: 212px auto 128px;
    display: flex;
    flex-direction: column;
    gap: 1rem;

    * {
        max-width: 867px;
        font-family: Urbanist;
        color: var(--primary);
        line-height: 1.5
    }

    h1 {
        font-size: 3rem;
        color: var(--secondary);
        font-weight: 600;
        margin-bottom: 2rem
    }

    h2 {
        font-size: 2.3rem;
        font-weight: 600
    }

    h3 {
        font-size: 1.5rem;
        font-weight: 600
    }

    em,
    strong {
        font-weight: 600
    }

    a {
        text-decoration: underline
    }
}

.article button {
    border: 1px solid var(--secondary);
    padding: .5rem;
    border-radius: .5rem;
    align-self: flex-start;
    cursor: pointer;

    &:hover {
        background-color: var(--secondary);
        color: #fff
    }
}

@media (max-width: 809px) {
    .article {
        margin-top: 100px;
        margin-bottom: 60px;

        h1 {
            font-size: 2rem
        }

        h2 {
            font-size: 1.6rem
        }

        h3 {
            font-size: 1.4rem
        }
    }
}

.cta:before {
    content: "";
    background-image: var(--backgroundImage);
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    background-size: contain;
    background-position: right top;
    height: 100%;
    z-index: 2;
    background-repeat: no-repeat;
    z-index: 0
}

.cta {
    position: relative;
    background-color: var(--primary)
}

.cta__inner {
    max-width: var(--container);
    margin: 0 auto;
    padding: 169px 0 173px
}

.cta__title {
    grid-column: 2 / 6;
    grid-row: 1/1;
    z-index: 3;
    padding-top: 44px;
    color: #fff;
    margin-bottom:50px
}

.cta__image-container {
    grid-column: 3 / 6;
    grid-row: 1/4;
    z-index: 2;
    position: relative;

    img {
        width: 100%
    }
}

.cta__image-container:after {
    content: "";
    width: 84px;
    height: 84px;
    background-image: url('data:image/svg+xml,<svg width="84" height="84" viewBox="0 0 84 84" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="84" height="84" rx="42" fill="%2303422C"/><path opacity="0.5" d="M33.5366 50.4644L39.2059 40.7051L45.6851 51.8007H34.7515L33.5366 50.4644Z" fill="white"/><path d="M57.4286 55.3634L42.0405 28.6367L37.0191 37.1407L47.5478 55.3634H57.4286Z" fill="white"/><path d="M26.5714 55.3634L31.8358 46.2925L37.1001 55.3634H26.5714Z" fill="white"/></svg>');
    background-size: contain;
    position: absolute;
    right: -42px;
    top: -42px;
    display:none
}

.cta__text {
    grid-column: 4 / 8;
    grid-row: 2/2;
    color: var(--white);
    z-index: 3;
    margin-bottom:50px
}

.cta__link {
    grid-column: 5 / 7;
    grid-row: 3/3;
    z-index: 3;
    display: flex
}

@media (max-width: 1100px) {
    .cta__image-container {
        grid-column: 2 / 8
    }

    .cta__title {
        grid-column: 1 /5
    }

    .cta__text {
        grid-column: 3 / 9
    }

    .cta__link {
        grid-column: 4 /6
    }
}

@media (max-width: 809px) {
    .cta__image {
        display: none
    }

    .cta:before {
        background-size: cover;
        background-position: center
    }

    .cta__inner {
        padding-top: 128px;
        padding-bottom: 128px
    }

    .cta__inner>* {
        grid-column: 1 / 5;
        grid-row: unset
    }

    .cta__title {
        text-align: center;
        order: 2
    }

    .cta__text {
        margin-top: 2rem;
        margin-bottom: 2em;
        order: 3
    }

    .cta__link {
        order: 4
    }

    .cta__image-container:after {
        position: static;
        display: block;
        order: 1;
        margin: 0 auto
    }
}

.noise {
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    z-index: 110;
    pointer-events: none
}

.noise:before {
    content: "";
    width: 200vw;
    height: 200vh;
    background-image: url(assets/noise.webp);
    background-repeat: repeat;
    position: absolute;
    left: -50vw;
    top: -50vh;
    z-index: 2;
    opacity: .15;
    animation: noiseMoving .2s infinite steps(1)
}

@keyframes noiseMoving {
    0% {
        transform: translate(0)
    }

    10% {
        transform: translate(-10vw, -10vh)
    }

    20% {
        transform: translate(8vw, 12vh)
    }

    30% {
        transform: translate(-12vw, 6vh)
    }

    40% {
        transform: translate(10vw, -8vh)
    }

    50% {
        transform: translate(-6vw, 14vh)
    }

    60% {
        transform: translate(14vw, -12vh)
    }

    70% {
        transform: translate(-8vw, 10vh)
    }

    80% {
        transform: translate(12vw, -6vh)
    }

    90% {
        transform: translate(-10vw, 8vh)
    }

    to {
        transform: translate(0)
    }
}

.image-full-width {
    width: 100%;
    height: var(--height);
    object-fit: cover;
    max-width: 1440px;
    display: flex;
    margin: 0 Auto
}

@media (max-width:809px) {
    .image-full-width {
        height: 244px
    }
}

contact-form[data-sent=true] .contact-form__sent {
    pointer-events: all;
    opacity: 1
}

contact-form {
    position: relative
}

contact-form[data-sent=true] form {
    pointer-events: none
}

contact-form[data-sent=wait] form {
    opacity: .4;
    pointer-events: none;
    cursor: wait
}

contact-form[data-sent=wait] .contact-form__wait {
    opacity: 1
}

.contact-form__wait {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%) translateY(-50%);
    pointer-events: none;
    opacity: 0;
    transition: opacity .3s ease
}

.contact-form__form .input:has(input[name=firstname]) {
    display: none
}

.contact-form__title {
    color: #fff;
    text-align: center;
    margin-bottom: 1.5rem
}

.contact-form__form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    transition: opacity .3s ease;

    button {
        margin-top: .5rem
    }
}

.contact-form__sent {
    position: relative;
    color: #fff;
    opacity: 0;
    pointer-events: none;
    transition: opacity .3s ease-in;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%) translateY(-50%);
    max-width: 100%;
    width: 100%
}

.contact-form__sent:after {
    content: "";
    background-image: url(assets/lets-talk-flower.webp);
    background-size: contain;
    width: 213px;
    height: 267px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%) translateY(-50%);
    pointer-events: none
}

.gallery {
    position: relative
}

.gallery[data-padding=true] {
    padding-bottom: 128px
}

.gallery__inner {
    max-width: var(--container);
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: repeat(835, 1px);
    column-gap: 20px;

    img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        padding-top: 20px
    }

    li:nth-of-type(1),
    li:nth-of-type(3) {
        grid-row: 1 / 413
    }

    li:nth-of-type(2) {
        grid-row: 1 / 266
    }

    li:nth-of-type(4) {
        grid-row: 413 / 777
    }

    li:nth-of-type(5) {
        grid-row: 266 / 719
    }

    li:nth-of-type(6) {
        grid-row: 413 / 836
    }
}

.gallery[data-theme=light]:before {
    background-color: var(--primary)
}

.gallery:before {
    content: "";
    width: 100%;
    height: 364px;
    background-color: var(--secondary);
    left: 0;
    top: 0;
    position: absolute;
    z-index: -1
}

@media (max-width:809px) {
    .gallery:before {
        height: 130px
    }

    .gallery__inner {
        column-gap: .5rem;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: repeat(319, 1px);

        li:nth-of-type(5),
        li:nth-of-type(6) {
            display: none
        }

        li img {
            padding-top: .5rem
        }

        li:nth-of-type(1) {
            grid-row: 1/148
        }

        li:nth-of-type(2) {
            grid-row: 148/278
        }

        li:nth-of-type(3) {
            grid-row: 1/94
        }

        li:nth-of-type(4) {
            grid-row: 94/320
        }
    }

    .gallery[data-padding=true] {
        padding-bottom: 4rem
    }
}

applications-slider {
    overflow: hidden;
    display: block;
    width: 100%
}

applications-slider[data-theme=dark] {
    .applications-slider__slide {
        background-color: var(--secondary)
    }

    .applications-slider__slide:hover {
        background-color: #03422ccc
    }
}

.applications-slider {
    max-width: var(--container);
    margin: 0 auto;
    width: 100%;
    width: fit-content
}

.applications-slider__inner {
    width: fit-content;
    display: flex;
    gap: 20px
}

.applications-slider__slide {
    flex-shrink: 0;
    width: 513px;
    height: 609px;
    background: var(--primary);
    padding: 3rem 2rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    transition: background .2s ease;
    position: relative
}

.applications-slider__slide:hover {
    background-color: #089162cc
}

.applications-slider__slide:after {
    content: "";
    background-image: var(--backgroundImage);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom right;
    height: 100%;
    position: absolute;
    right: 0;
    bottom: 0;
    width: var(--backgroundWidth);
    mix-blend-mode: color-burn
}

.applications-slider__slide a:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 10
}

.applications-slider__slide-title {
    color: #fff;
    display: flex;
    justify-content: space-between;
    flex-grow: 1;
    width: 100%
}

.applications-slider__slide-title:after {
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M24 13.5004V10.5004H16.5C14.8431 10.5004 13.5 9.15722 13.5 7.50036L13.5 0H10.5V7.50037C10.5 9.15722 9.15686 10.5004 7.50001 10.5004H0V13.5004H7.50001C9.15687 13.5004 10.5 14.8435 10.5 16.5004V24H13.5V16.5004C13.5 14.8435 14.8432 13.5004 16.5 13.5004H24Z' fill='%23AFFF46'/%3E%3C/svg%3E");
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    margin-top: 8px
}

.applications-slider__slide-text {
    color: var(--background);
    margin-bottom: 1rem
}

@media (max-width:809px) {
    .applications-slider__inner {
        padding: 0;
        flex-direction: column;
        height: auto;
        margin: 0 auto
    }

    .applications-slider__slide {
        padding: 1.5rem 1rem;
        align-items: unset;
        width: 100%;
        height: auto;
        max-width: 513px
    }

    .applications-slider__slide-text {
        padding-top: 1.5rem;
        padding-bottom: 1rem
    }

    .applications-slider__slide:after {
        height: 80%
    }
}

.faq {
    max-width: var(--container);
    margin: 0 auto;
    padding-bottom: 128px
}

.faq__tag {
    grid-column: 1/ 9;
    text-align: end;
    color: var(--secondary)
}

.faq__title {
    grid-column: 1/9;
    text-align: end;
    color: var(--primary);
    margin-top: 1rem;
    margin-bottom: 4rem
}

.faq__questions {
    grid-column: 1/ 9;
    gap: 20px;
    z-index: 2;
    align-items: start;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr))
}

.faq__question {
    background-color: var(--secondary);
    padding: 3rem 2rem;
    transition: background-color .3s ease;
    cursor: pointer;
    width: 100%;
    position: relative
}

.faq__col {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%
}

.faq__question:hover {
    background-color: #03422ccc
}

.faq__question .h3 {
    color: var(--white);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2rem
}

.faq__questions .faq__question details[open] .h3:after {
    transform: rotate(0)
}

.faq__question summary:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 4
}

.faq__question:hover details .h3:after {
    transform: rotate(-25deg)
}

.faq__question .h3:after {
    content: "";
    width: 20px;
    flex-shrink: 0;
    height: 20px;
    display: block;
    transition: transform .2s ease-out;
    transform: rotate(-45deg);
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none"><path d="M20.0003 2.57569L17.879 0.454367L12.5757 5.75767C11.4041 6.92924 9.50465 6.92924 8.33308 5.75766L3.02952 0.454102L0.908203 2.57542L6.21176 7.87898C7.38334 9.05055 7.38333 10.9501 6.21176 12.1216L0.908455 17.4249L3.02977 19.5462L8.33308 14.2429C9.50466 13.0714 11.4042 13.0714 12.5757 14.2429L17.8788 19.546L20.0001 17.4247L14.697 12.1216C13.5255 10.95 13.5255 9.05056 14.697 7.87898L20.0003 2.57569Z" fill="%23AFFF46"/></svg>');
    background-size: contain;
    background-repeat: no-repeat
}

.faq__question .text {
    color: var(--background);
    opacity: .8;
    margin-top: 1.5rem
}

@media (max-width:809px) {
    .faq {
        padding-bottom: 4rem
    }

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

    .hp-elevate__grid.grid {
        margin-bottom: 2rem;
        display: flex;
        flex-direction: column
    }

    .faq__question {
        padding: 1.5rem 1rem
    }

    .faq__title {
        margin-bottom: 2rem;
        text-align: start
    }
}

.welcome {
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100dvh;
    background-color: var(--primary);
    z-index: 101;
    pointer-events: none
}

.welcome__title {
    position: absolute;
    z-index: 102;
    left: 50%;
    top: 50%;
    transform: translate(-50%) translateY(-50%);
    padding-left: 70px
}

.welcome__title {
    padding-left: 70px
}

.welcome__logo {
    transform-origin: center bottom;
    position: absolute;
    left: 50%;
    transform: translate(-45%) scale(2);
    /* clip-path: polygon(50% 0%, 100% 100%, 0 100%) */
}

.welcome__brand>* {
    visibility: hidden;
    transform: translate(100%)
}

@media (max-width:809px) {
    .welcome__title {
        padding-left: 43px
    }

    .welcome__logo {
        height: 37px;
        width: auto
    }

    .welcome__brand {
        width: 250px;
        height: auto
    }
}

.catorcemille {
    background-color: var(--secondary);
    position: relative;
    padding: 128px 0;
    z-index: 2;

    &:after {
        content: "";
        width: 787px;
        height: 653px;
        background-image: url('data:image/svg+xml,<svg width="787" height="653" viewBox="0 0 787 653" fill="none" xmlns="http://www.w3.org/2000/svg"><g opacity="0.08"><path d="M512.76 468.05C552.304 468.05 584.36 435.994 584.36 396.45C584.36 356.906 552.304 324.85 512.76 324.85C473.216 324.85 441.16 356.906 441.16 396.45C441.16 435.994 473.216 468.05 512.76 468.05Z" fill="white"/><path d="M511.04 290.96V290.99H511.28C511.44 290.99 511.6 290.98 511.76 290.98C511.92 290.98 512.08 290.99 512.24 290.99H512.48V290.96C592.14 290.31 656.52 225.55 656.52 145.74V0H656.28C580.97 0 519.06 57.31 511.76 130.7C504.46 57.31 442.54 0 367.23 0H366.99V145.74C366.99 225.55 431.37 290.31 511.03 290.96H511.04Z" fill="white"/><path d="M0 487.1C64.73 551.83 169.67 551.83 234.4 487.1C169.67 422.37 64.73 422.37 0 487.1Z" fill="white"/><path d="M786.89 485.7C851.62 550.43 956.56 550.43 1021.29 485.7C956.56 420.97 851.62 420.97 786.89 485.7Z" fill="white"/><path d="M188.87 652.76H329.56C407.26 652.76 470.25 589.77 470.25 512.07H329.56C251.86 512.07 188.87 575.06 188.87 652.76Z" fill="white"/><path d="M691.74 512.07H551.05C551.05 589.77 614.04 652.76 691.74 652.76H832.43C832.43 575.06 769.44 512.07 691.74 512.07Z" fill="white"/><path d="M124.51 74.18C136.63 164.91 220 228.65 310.74 216.53C298.62 125.79 215.25 62.06 124.51 74.18Z" fill="white"/><path d="M710.57 216.53C801.3 228.65 884.68 164.91 896.79 74.18C806.06 62.06 722.68 125.8 710.57 216.53Z" fill="white"/><path d="M39.01 300.2L170.66 400.89C243.37 456.5 347.4 442.64 403.01 369.93L271.35 269.24C198.64 213.63 94.61 227.49 39 300.2H39.01Z" fill="white"/><path d="M982.29 300.2C926.68 227.49 822.65 213.63 749.94 269.24L618.28 369.93C673.89 442.64 777.92 456.5 850.63 400.89L982.29 300.2Z" fill="white"/></g></svg>');
        background-size: contain;
        background-position: right;
        position: absolute;
        right: 0;
        z-index: -1;
        top: 3rem
    }
}

.catorcemille__inner {
    max-width: var(--container);
    margin: 0 auto;
    position: relative
}

.catorcemille__bottom {
    grid-column: 1 / 9;

    >img {
        width: 100%;
        grid-column: 1 / 6;
        object-fit: cover;
        height: auto
    }
}

.catorcemille__inner .h2 {
    grid-column: 2 / 6;
    color: #fff;
    margin-bottom: 4rem
}

.catorcemille__text {
    grid-column: span 3;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-end;
    gap: 2rem;
    position: relative;

    p {
        color: var(--background)
    }

    img {
        position: absolute;
        left: 50%;
        transform: translate(-50%);
        top: -120px;
        width: 33%
    }
}

@media (max-width:1100px) {
    .catorcemille__text img {
        top: -150px
    }
}

@media (max-width:809px) {
    .catorcemille {
        padding-bottom: 4rem;
        padding-top: 4rem;

        &:after {
            opacity: .4
        }
    }

    .catorcemille__inner .h2 {
        grid-column: 1 / 5;
        margin-bottom: 2rem
    }

    .catorcemille__bottom>img {
        grid-column: 1 / 5;
        margin-bottom: 2rem
    }

    .catorcemille__text {
        grid-column: 1 / 5;
        align-items: flex-start
    }

    .catorcemille__text>img {
        position: static;
        width: 150px;
        transform: none
    }
}

body {
    background-color: var(--background)
}

body::-webkit-scrollbar {
    width: 10px;
    background-color: #fffaf5
}

body::-webkit-scrollbar-thumb {
    background-color: var(--secondary)
}

body[data-navigation=open] {
    overflow: hidden
}

body:has(lets-talk[data-display=true]),
body:has(.welcome) {
    overflow: hidden
}

.grid {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    column-gap: 20px
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0
}

@media (max-width: 809px) {
    .grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        column-gap: 8px
    }
}