

body.is-desktop {
    overflow: hidden
}


.is-desktop main {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.c-page-mask {
    background-color: #fff
}

.is-desktop .c-page-mask {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.is-device .c-page-mask {
    overflow-y: scroll;
    overflow-x: hidden
}

.c-pe {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    pointer-events: none
}

.flickity-enabled {
    position: relative
}

.flickity-enabled:focus {
    outline: 0
}

.flickity-viewport {
    position: relative;
    height: 100%
}

.flickity-slider {
    position: absolute;
    width: 100%;
    height: 100%
}

.flickity-enabled.is-draggable {
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.flickity-enabled.is-draggable .flickity-viewport {
    cursor: move;
    cursor: -webkit-grab;
    cursor: grab
}

.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {
    cursor: -webkit-grabbing;
    cursor: grabbing
}

.flickity-button {
    position: absolute;
    background: hsla(0,0%,100%,.75);
    border: none;
    color: #333
}

.flickity-button:hover {
    background: #fff;
    cursor: pointer
}

.flickity-button:focus {
    outline: 0;
    box-shadow: 0 0 0 5px #19f
}

.flickity-button:active {
    opacity: .6
}

.flickity-button:disabled {
    opacity: .3;
    cursor: auto;
    pointer-events: none
}

.flickity-button-icon {
    fill: currentColor
}

.flickity-prev-next-button {
    top: 50%;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    transform: translateY(-50%)
}

.flickity-prev-next-button.previous {
    left: 10px
}

.flickity-prev-next-button.next {
    right: 10px
}

.flickity-rtl .flickity-prev-next-button.previous {
    left: auto;
    right: 10px
}

.flickity-rtl .flickity-prev-next-button.next {
    right: auto;
    left: 10px
}

.flickity-prev-next-button .flickity-button-icon {
    position: absolute;
    left: 20%;
    top: 20%;
    width: 60%;
    height: 60%
}

.flickity-page-dots {
    position: absolute;
    width: 100%;
    bottom: -25px;
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
    line-height: 1
}

.flickity-rtl .flickity-page-dots {
    direction: rtl
}

.flickity-page-dots .dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 0 8px;
    background: #333;
    border-radius: 50%;
    opacity: .25;
    cursor: pointer
}

.flickity-page-dots .dot.is-selected {
    opacity: 1
}

.o-sprite {
    width: 0;
    height: 0;
    position: absolute
}

.o-button {
    font-family: MarkPro
}

.o-link {
    display: inline-block;
    position: relative;
    font-size: 1.05rem
}

.o-link:after,.o-link:before {
    content: "";
    display: block;
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: currentColor;
    transition: transform .75s cubic-bezier(.19,1,.22,1)
}

.o-link:before {
    transition-delay: 0s;
    transform: scaleX(0);
    transform-origin: left
}

.o-link:after {
    transition-delay: .25s;
    transform-origin: right
}

.o-link:hover:before {
    transition-delay: .25s;
    transform: scaleX(1)
}

.o-link:hover:after {
    transition-delay: 0s;
    transform: scaleX(0)
}

.o-container {
    max-width: 82.5rem;
    margin-left: auto;
    margin-right: auto;
    width: 100%
}

@media (min-width: 700px) {
    .o-container {
        display:flex;
        justify-content: flex-end
    }
}

@media (min-width: 1000px) {
    .o-container {
        padding-right:10%;
        padding-left: 10%
    }
}

.o-container--small {
    max-width: 80rem
}

.o-container--xsmall {
    max-width: 75vw
}

.o-container--extended {
    padding-left: 0;
    padding-right: 0
}

.o-container--extended.is-gallery {
    justify-content: center
}

.o-container--wrap {
    flex-wrap: wrap;
    justify-content: normal
}

.o-cell {
    display: flex;
    min-width: 100%
}

.o-cell--left {
    justify-content: flex-start
}

.o-cell--right {
    justify-content: flex-end
}

@media (min-width: 700px) {
    .o-cell-0 {
        width:10%
    }
}

@media (min-width: 700px) {
    .o-cell-0,.o-cell-1 {
        padding-right:9vw;
        padding-right: var(--gutter-l)
    }

    .o-cell-1 {
        width: 37.5%
    }
}

@media (min-width: 700px) {
    .o-cell-2 {
        width:62.5%
    }
}

.c-menu-link.is-active .c-menu-link__active-inner,.o-txt-gradient {
    background: linear-gradient(107.16deg,#ec0d78 20.37%,#ff2b40 44.58%,#f75735 66.71%,#fe880e 86.77%,#fe880e 0);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: -.035em!important
}

.o-gradient {
    position: relative;
    color: #000;
    background: #fff
}

.o-gradient:after {
    content: "";
    position: absolute;
    display: block;
    top: .02em;
    left: .02em;
    right: .02em;
    bottom: .02em;
    background: linear-gradient(107.16deg,#ec0d78 20.37%,#ff2b40 44.58%,#f75735 66.71%,#fe880e 86.77%,#fe880e 0);
    mix-blend-mode: lighten;
    pointer-events: none
}

.o-gradient strong {
    font-weight: 900;
    line-height: 1
}

.o-gradient a {
    display: inline;
    font-size: inherit;
    font-weight: inherit;
    text-decoration: none;
    background-image: linear-gradient(#000,#000);
    background-size: 100% .13em;
    background-position: .02em 100%;
    background-repeat: no-repeat;
    transition: background-size .75s cubic-bezier(.19,1,.22,1)
}

.o-gradient a:hover {
    background-size: 0 .13em;
    background-position: 100% 100%
}

.o-grid {
    width: 100%
}

@media (min-width: 700px) {
    .o-grid {
        display:flex;
        justify-content: flex-end
    }
}

.o-grid .o-col {
    width: 100%
}

@media (max-width: 699px) {
    .o-grid .o-col--margin {
        margin-bottom:1rem
    }
}

@media (min-width: 700px) {
    .o-grid .o-col {
        width:63.7%
    }
}

.o-grid--filter {
    justify-content: flex-start
}

@media (min-width: 700px) {
    .o-grid--filter .o-col {
        width:70%
    }

    .o-grid--filter .o-col:first-child {
        width: 30%
    }
}

@media (min-width: 700px) {
    .o-grid--two .o-col {
        width:40%
    }

    .o-grid--two .o-col:last-child {
        width: 60%
    }
}

@media (min-width: 700px) {
    .o-grid--three .o-col {
        width:19%
    }

    .o-grid--three .o-col:last-child {
        width: 60.8%
    }
}

.o-gutter {
    padding-left: 6vw;
    padding-left: var(--gutter);
    padding-right: 6vw;
    padding-right: var(--gutter)
}

.o-padding {
    padding-top: 6rem;
    padding-top: var(--spacing);
    padding-bottom: 6rem;
    padding-bottom: var(--spacing)
}

.o-padding-s {
    padding-top: 1.5rem;
    padding-top: var(--spacing-xxs);
    padding-bottom: 1.5rem;
    padding-bottom: var(--spacing-xxs)
}

@media (min-width: 700px) {
    .o-padding-s {
        padding-top:1.5rem;
        padding-top: var(--spacing-s);
        padding-bottom: 1.5rem;
        padding-bottom: var(--spacing-s)
    }
}

.o-padding-top {
    padding-top: 3rem;
    padding-top: var(--spacing-xs)
}

@media (min-width: 700px) {
    .o-padding-top {
        padding-top:4.62rem;
        padding-top: calc(var(--spacing)*0.77)
    }
}

.o-padding-top-s {
    padding-top: 1.5rem;
    padding-top: var(--spacing-xxs)
}

@media (min-width: 700px) {
    .o-padding-top-s {
        padding-top:1.5rem;
        padding-top: var(--spacing-s)
    }
}

.o-padding-bottom {
    padding-bottom: 3rem;
    padding-bottom: var(--spacing-xs)
}

@media (min-width: 700px) {
    .o-padding-bottom {
        padding-bottom:6rem;
        padding-bottom: var(--spacing)
    }
}

.o-padding-bottom-s {
    padding-bottom: 1.5rem;
    padding-bottom: var(--spacing-xxs)
}

@media (min-width: 700px) {
    .o-padding-bottom-s {
        padding-bottom:1.5rem;
        padding-bottom: var(--spacing-s)
    }
}

.o-padding-bottom-xs {
    padding-bottom: 3rem;
    padding-bottom: var(--spacing-xs)
}

.o-margin-top {
    margin-top: 6rem;
    margin-top: var(--spacing)
}

.o-margin-top-xs {
    margin-top: 3rem;
    margin-top: var(--spacing-xs)
}

.o-margin-top-xxs {
    margin-top: 1.5rem;
    margin-top: var(--spacing-xxs)
}

.o-margin-bottom {
    margin-bottom: 6rem;
    margin-bottom: var(--spacing)
}

.o-margin-bottom-xs {
    margin-bottom: 1.5rem;
    margin-bottom: var(--spacing-xxs)
}

@media (min-width: 700px) {
    .o-margin-bottom-xs {
        margin-bottom:3rem;
        margin-bottom: var(--spacing-xs)
    }
}

.o-margin-bottom-xxs {
    margin-bottom: 1.5rem;
    margin-bottom: var(--spacing-xxs)
}

.o-big-text {
    font-size: 38.5vw;
    color: #ed0277;
    letter-spacing: -2vw;
    text-align: center;
    width: 100%
}

.o-big-text,.o-large-text {
    font-weight: 800;
    line-height: 1.1
}

.o-large-text {
    padding-bottom: 2%;
    padding-right: 2%;
    font-size: 72px
}

@media screen and (min-width: 500px) {
    .o-large-text {
        font-size:calc(72px + (24000vw - 120000px)/1900)
    }
}

@media screen and (min-width: 2400px) {
    .o-large-text {
        font-size:312px
    }
}

.o-large-text {
    letter-spacing: -.25rem
}

@media screen and (min-width: 500px) {
    .o-large-text {
        letter-spacing:calc(-.25rem + (-50vw - -250px)/1900)
    }
}

@media screen and (min-width: 2400px) {
    .o-large-text {
        letter-spacing:-.75rem
    }
}

.o-large-text {
    margin-left: -2px
}

@media screen and (min-width: 500px) {
    .o-large-text {
        margin-left:calc(-2px + (-2000vw - -10000px)/1900)
    }
}

@media screen and (min-width: 2400px) {
    .o-large-text {
        margin-left:-22px
    }
}

.o-medium-text {
    font-weight: 800;
    line-height: .9;
    letter-spacing: -.5rem!important;
    font-size: 100px
}

@media screen and (min-width: 500px) {
    .o-medium-text {
        font-size:calc(100px + (27500vw - 137500px)/1900)
    }
}

@media screen and (min-width: 2400px) {
    .o-medium-text {
        font-size:375px
    }
}

.o-medium-text {
    letter-spacing: -.25rem
}

@media screen and (min-width: 500px) {
    .o-medium-text {
        letter-spacing:calc(-.25rem + (-50vw - -250px)/1900)
    }
}

@media screen and (min-width: 2400px) {
    .o-medium-text {
        letter-spacing:-.75rem
    }
}

.o-menu-big {
    font-weight: 900;
    line-height: 1.25;
    font-size: 64px
}

@media screen and (min-width: 500px) {
    .o-menu-big {
        font-size:calc(64px + (13600vw - 68000px)/1900)
    }
}

@media screen and (min-width: 2400px) {
    .o-menu-big {
        font-size:200px
    }
}

.o-h1,.o-h2,.o-h3 {
    font-weight: 800
}

.o-h4,.o-h5,.o-h6 {
    font-weight: 500
}

.o-h1 {
    line-height: 1.15;
    font-size: 48px
}

@media screen and (min-width: 500px) {
    .o-h1 {
        font-size:calc(48px + (9200vw - 46000px)/1900)
    }
}

@media screen and (min-width: 2400px) {
    .o-h1 {
        font-size:140px
    }
}

.o-h2 {
    letter-spacing: -.025em;
    line-height: 1.1;
    padding-bottom: .5rem;
    padding-left: .15rem;
    margin-right: -1.4rem;
    margin-left: 0;
    max-width: 85vw;
    font-size: 30px
}





@media (max-width: 499px) {
    .o-h3.o-grid__title {
        font-size:1.6rem
    }
}

.o-h4 {
    font-size: 1.3rem;
    line-height: 1.35
}

.is-phone .o-h4 {
    font-size: 1.2rem
}

.o-title--small {
    font: normal 800 1.445rem/2.38 MarkPro;
    letter-spacing: -.02em
}

@media (max-width: 499px) {
    .o-title--small {
        font-size:1.125rem;
        line-height: 1.28
    }
}

.o-txt a,.o-txt p {
    font-weight: 500
}

.o-txt--light .o-txt a,.o-txt--light .o-txt p {
    font-weight: 400
}

@media (min-width: 1200px) {
    .o-txt--l a,.o-txt--l p {
        font-size:1.15rem
    }
}

@media (min-width: 1200px) {
    .o-txt--m a,.o-txt--m p {
        font-size:1rem
    }
}

@media (min-width: 1200px) {
    .o-txt--s a,.o-txt--s p {
        font-size:.85rem
    }
}

.o-txt>:not(:last-child) {
    margin-bottom: 1rem
}

@media (min-width: 700px) {
    .o-txt>:not(:last-child) {
        margin-bottom:1.5rem
    }
}

@media (min-width: 1000px) {
    .o-txt>:not(:last-child) {
        margin-bottom:2rem
    }
}

.o-txt a,.o-txt p {
    color: #94999e
}

.o-cover {
    position: relative
}


.o-columns {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start
}

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

.o-columns>:first-child {
    width: 39.2%
}

.o-columns>:nth-child(2) {
    width: 60.8%
}

.o-figure {
    position: relative;
    width: 100%;
    height: 0;
    padding-top: var(--aspect-ratio);
    overflow: hidden
}

.o-figure,.o-figure picture {
    display: block
}

.o-figure img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

@media (max-width: 500px) {
    .o-figure {
        padding-top:var(--aspect-ratio-mobile)
    }
}

.o-figure--interface {
    box-shadow: 0 1.667rem 2.5rem rgba(0,0,0,.08);
    border-radius: 3.889rem
}

.c-progressbar {
    width: 0;
    height: .25rem;
    background: linear-gradient(135deg,#fe8805,#f6493e 50%,#ed0277);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    transform-origin: left;
    transform: scaleX(0);
    z-index: 2001
}

.c-site-header {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    font-weight: 500;
    padding-top: 5.7vw;
    padding-top: calc(var(--gutter)*0.95);
    padding-bottom: 5.7vw;
    padding-bottom: calc(var(--gutter)*0.95);
    pointer-events: none;
    z-index: 10
}

.c-site-header.transition {
    z-index: 2001
}

.is-phone .c-site-header {
    position: relative
}

.is-tablet .c-site-header {
    position: relative;
    padding-bottom: 2.5rem
}

.c-site-header__title {
    position: absolute;
    left: 0
}

.c-site-header__title span {
    display: block;
    white-space: nowrap
}

@media (max-width: 499px) {
    .c-site-header__title span {
        font-size:1rem
    }
}

.c-site-header__title span:nth-child(2) {
    margin-top: -.25rem
}

.c-site-header__inner {
    position: relative
}

.c-site-header__menu {
    margin-left: auto;
    position: relative;
    margin-right: 1.25rem;
    pointer-events: none
}

.c-site-header-projects {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    pointer-events: all
}

.is-phone .c-site-header-projects {
    display: none
}

.c-site-header-projects__inner {
    position: relative
}

.c-site-header-projects__dot {
    position: absolute;
    top: 0;
    left: calc(1.5rem - 2px);
    height: 7px;
    width: 7px;
    background-color: #ed0277;
    border-radius: 50%
}

.c-site-header-projects__list {
    padding: .25rem 0 0 3rem
}

.c-site-header-projects__item:not(:first-child) {
    margin-top: -.05rem
}

.c-site-header-projects__link {
    display: block;
    color: #000;
    opacity: .5;
    line-height: 1.3
}

.c-site-projects {
    width: 50%
}

.c-site-header-menu .o-col {
    align-items: flex-start
}

@media (max-width: 499px) {
    .c-site-header-menu {
        position:absolute;
        top: 0;
        display: none
    }
}

.c-site-header-menu>div {
    display: flex;
    justify-content: flex-end
}

.c-site-header-menu__item {
    flex: 0 0 auto;
    display: block;
    margin-left: 2.5rem
}

@media (max-width: 499px) {
    .c-site-header-menu__item {
        margin-left:.5rem;
        font-size: 1rem
    }
}

.c-site-header-menu__item--current {
    margin-left: 0;
    width: 100%;
    flex: 1 1 auto
}

@media (max-width: 699px) {
    .c-site-header-menu__item--current {
        display:none
    }
}

.c-site-header-menu__item--transition {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2001;
    margin-left: 0
}

a.c-site-header-menu__item {
    position: relative
}

a.c-site-header-menu__item:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: currentColor;
    transform-origin: right;
    transform: scaleX(0);
    transition: transform .75s cubic-bezier(.19,1,.22,1)
}

a.c-site-header-menu__item:hover:after {
    transform-origin: left;
    transform: scaleX(1)
}

.c-cases {
    padding-left: 6vw;
    padding-right: 6vw
}

.is-desktop .c-cases {
    padding-left: 3rem;
    padding-right: 3rem
}

.c-cases__grid {
    width: 100%;
    max-width: 82.5rem;
    margin: 0 auto
}

.c-cases button {
    width: 100%;
    max-width: 18.75rem;
    text-align: left;
    border-bottom: .25rem solid #000
}

.c-filter-btn {
    display: flex
}

.c-filter-btn span {
    display: block
}

.c-filter-btn__arrow {
    width: 1.25rem;
    margin-left: auto
}

.c-case-item {
    --padding: calc(var(--gutter)*0.75);
    margin-top: 3rem
}

.is-desktop .c-case-item--half .c-case-item__link {
    display: flex
}

@media (max-width: 700px) {
    .c-case-item--full .c-case-item__link {
        display:flex;
        flex-direction: column-reverse
    }

    .c-case-item--full .c-case-item__link .c-case-item__inner {
        padding-top: 1.25rem;
        padding-bottom: 0
    }
}

.c-case-item__img {
    overflow: hidden;
    transform-origin: top left
}

.c-case-item--half .c-case-item__img {
    width: 100%
}

.is-desktop .c-case-item--half .c-case-item__img {
    width: 65%
}

.c-case-item__inner--first {
    padding-bottom: 1.25rem
}

.c-case-item__inner--small {
    padding: 1rem 0 0;
    flex: 1
}

.is-desktop .c-case-item__inner--small {
    padding: 1.5rem 3rem 3rem
}

.c-case-item__description {
    font-weight: 400;
    color: #94999e;
    line-height: 1.2;
    margin-bottom: .3125rem
}

.c-case-item__description .c-menu-link.is-active .c-menu-link__active-inner,.c-case-item__description .o-txt-gradient,.c-menu-link.is-active .c-case-item__description .c-menu-link__active-inner {
    font-weight: 700
}

@media (max-width: 700px) {
    .c-case-item__description .c-menu-link.is-active .c-menu-link__active-inner,.c-case-item__description .o-txt-gradient,.c-menu-link.is-active .c-case-item__description .c-menu-link__active-inner {
        font-size:inherit!important
    }
}

.c-case-item__description span:last-child {
    font-weight: 500;
    padding-left: .3125rem
}

.c-case-item__title {
    font-weight: 800;
    transition: color .35s ease;
    letter-spacing: -.05rem
}

.c-case-item:hover .c-case-item__title {
    color: #94999e
}

@media (max-width: 700px) {
    .c-case-item__title {
        line-height:1;
        padding-bottom: 25px
    }
}

.c-info__grid {
    display: grid;
    grid-template-columns: repeat(autofill,1fr);
    grid-gap: 1.875rem 13.5vw;
    grid-gap: 1.875rem calc(var(--gutter-l)*1.5)
}

@media (min-width: 1000px) {
    .c-info__grid {
        grid-gap:3rem 13.5vw;
        grid-gap: var(--spacing-xs) calc(var(--gutter-l)*1.5);
        grid-template-columns: repeat(2,1fr)
    }
}

.c-info__item-title {
    margin-bottom: .75rem;
    font-size: 1.15rem
}

.c-info__item p {
    font-weight: 400
}

.c-contacts__item a {
    position: relative
}

.c-contacts__item a:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: currentColor;
    transform-origin: right;
    transform: scaleX(0);
    transition: transform .75s cubic-bezier(.19,1,.22,1)
}

.c-contacts__item a:hover:after {
    transform-origin: left;
    transform: scaleX(1)
}

.c-contacts__item--mail {
    margin-bottom: .5rem
}

.c-swiper {
    margin-top: 1.5rem
}

.c-swiper__dots {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: calc(100% + 3rem);
    left: 50%;
    transform: translateX(-50%)
}

.c-swiper__dot {
    width: .5rem;
    height: .5rem;
    background-color: rgba(0,0,0,.1);
    margin: 0 .3125rem;
    transition: background-color .2s ease-in-out;
    border-radius: 50%
}

.c-swiper__dot.is-active {
    background-color: #ed0277
}

.c-swiper-titles {
    margin-bottom: 1.5rem
}

body:not(.is-phone) .c-swiper-titles {
    display: none
}

.c-swiper-titles__list {
    position: relative
}

.c-swiper-titles img {
    height: 1.5625rem;
    width: auto
}

