@charset "UTF-8";
@import "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap";

.breadcrumbs {
    margin-bottom: 0;
    position: relative
}

.breadcrumbs__list {
    display: flex;
    flex-direction: row;
    gap: 5px
}

.breadcrumbs__list li {
    font-weight: 450;
    font-size: 14px;
    line-height: 140%
}

.button {
    font-weight: 450;
    line-height: 140%;
    letter-spacing: -.02em;
    font-size: clamp(16px, 14.6666666667px + .1736111111vw, 18px);
    display: flex;
    width: max-content;
    height: 58px;
    white-space: nowrap;
    box-sizing: border-box;
    border-radius: 100px;
    position: relative;
    background: #121214;
    color: #fff;
    gap: .75rem;
    transition: .1s
}

@media (max-width: 992px) {
    .button {
        height: 52px
    }
}

.button--disabled {
    color: #c4c4c6;
    background: #78787a;
    pointer-events: none
}

.button--disabled svg rect {
    fill: #c4c4c6
}

.button--disabled svg path {
    fill: #78787a
}

.button:hover {
    color: #121214;
    background: #fff
}

.button:hover svg rect {
    fill: #121214
}

.button:hover svg path {
    fill: #fff
}

.button:focus-visible {
    outline: 2px solid #3363ff
}

.button:active {
    color: #fff;
    background: #c4c4c6
}

.button:active svg rect {
    fill: #fff
}

.button:active svg path {
    fill: #c4c4c6
}

.button--white {
    color: #121214;
    background: #fff
}

.button--white:hover {
    color: #fff;
    background: #121214
}

.button--white:hover svg rect {
    fill: #fff
}

.button--white:hover svg path {
    fill: #121214
}

.button--white svg rect {
    fill: #121214
}

.button--white svg path {
    fill: #fff
}

.button--white.button--disabled {
    color: #78787a;
    background: #c4c4c6
}

.button--white.button--disabled svg rect {
    fill: #78787a
}

.button--white.button--disabled svg path {
    fill: #c4c4c6
}

.button--primary {
    overflow: visible;
    position: relative;
    z-index: 0;
    background: linear-gradient(90deg, #121214 50%, #fff 50%);
    background-size: 200% 100%;
    background-position: 0% center;
    transition: background-position .5s
}

.button--primary:hover {
    background: linear-gradient(90deg, #121214 50%, #fff 50%);
    background-size: 201% 100%;
    background-position: 100% center
}

.button--primary:hover span {
    background-position: 100% center;
    transition: .225s .1s
}

.button--primary svg {
    width: 32px;
    height: 32px;
    color: #121214
}

.button--primary span {
    display: inline-block;
    background: linear-gradient(90deg, #fff 0% 50%, #121214 50% 100%);
    background-size: 200% 100%;
    background-position: 0 center;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    transition: background-position .2s linear
}

.button--secondary {
    overflow: visible;
    position: relative;
    z-index: 0;
    color: #121214;
    background: transparent;
    background-size: 200% 100%;
    background-position: 0% center;
    border: 1px solid #121214;
    transition: background-position .5s
}

.button--secondary.button--white {
    color: #fff;
    border: 1px solid #ffffff;
    background: linear-gradient(90deg, transparent 50%, #121214 50%);
    background-size: 200% 100%;
    background-position: 0% center
}

.button--secondary.button--white:hover {
    background: linear-gradient(90deg, transparent 50%, #121214 50%);
    background-size: 200% 100%;
    background-position: 100% center;
    color: #fff
}

.button--secondary.button--white:hover span {
    background-position: 100% center;
    transition: .225s .1s
}

.button--secondary.button--white:active {
    background: #c4c4c6;
    background-position: 0;
    color: #fff
}

.button--secondary.button--white.button--disabled {
    color: #c4c4c6;
    background: none;
    border: 1px solid #c4c4c6
}

.button--secondary.button--white span {
    display: inline-block;
    background: linear-gradient(90deg, #fff 0% 50%, #fff 50% 100%);
    background-size: 200% 100%;
    background-position: 0 center;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    transition: background-position .2s linear
}

.button--secondary:hover {
    background: linear-gradient(90deg, transparent 50%, #121214 50%);
    background-size: 200% 100%;
    background-position: 100% center;
    color: #fff
}

.button--secondary:hover span {
    background-position: 100% center;
    transition: .225s .1s
}

.button--secondary.button--disabled {
    color: #78787a;
    background: none;
    border: 1px solid #78787a
}

.button--secondary span {
    display: inline-block;
    background: linear-gradient(90deg, #121214 0% 50%, #fff 50% 100%);
    background-size: 200% 100%;
    background-position: 0 center;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    transition: background-position .2s linear
}

.button--secondary .button__wrapper {
    padding: 13px 20px
}

.button--tertiary {
    color: #121214;
    background: none;
    height: 48px;
    gap: .5rem;
    border-radius: 0;
    position: relative
}

.button--tertiary:before {
    content: "";
    width: 100%;
    height: 1px;
    background: #121214;
    position: absolute;
    bottom: 9px;
    left: 0;
    transform: scaleX(0);
    transform-origin: left;
    will-change: transform;
    transition: .5s
}

.button--tertiary:hover {
    background: transparent
}

.button--tertiary:hover:before {
    transform: none;
    transition: .5s
}

.button--tertiary:hover svg path {
    fill: #121214;
    animation-name: button-arrow-move-right
}

.button--tertiary:not(:hover) svg path {
    animation-name: button-arrow-move-left
}

.button--tertiary:active {
    text-decoration: none
}

.button--tertiary svg {
    width: 28px;
    height: 28px
}

.button--tertiary svg path {
    animation-duration: .5s;
    animation-fill-mode: both
}

.button--tertiary.button--disabled {
    color: #78787a
}

.button--tertiary.button--disabled svg path {
    fill: #78787a
}

.button--tertiary.button--white {
    color: #fff
}

.button--tertiary.button--white:hover {
    background: none
}

.button--tertiary.button--white:hover svg path {
    fill: #fff
}

.button--tertiary .button__wrapper {
    padding: 9px 0
}

.button--hero {
    min-width: 286px;
    border: 1px solid #ffffff;
    box-shadow: 0 4px 4px #00000040;
    position: relative;
    z-index: 0
}

.button--hero:before, .button--hero:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 100px
}

.button--hero:before {
    background: linear-gradient(90deg, #ff8400 -2.55%, #ff573c 17.44%, #ff2b4e 39.86%, #d046ff 61.79%, #1d8bff 99.91%);
    z-index: -2;
    transition: .5s
}

.button--hero:after {
    background: #121214;
    z-index: -1
}

.button--hero:hover {
    background: #121214;
    color: #fff
}

.button--hero:hover:before {
    filter: blur(14px)
}

.button--hero:hover .button__wrapper:before {
    transform: translate(-50%, -60px)
}

.button--hero:active {
    border: 1px solid transparent
}

.button--hero .button__wrapper {
    position: relative
}

.button--hero .button__wrapper:before {
    content: "";
    width: 80%;
    height: 40px;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -36px);
    background: linear-gradient(90deg, #ff8400 -2.55%, #ff573c 17.44%, #ff2b4e 39.86%, #d046ff 61.79%, #1d8bff 99.91%);
    border-radius: 0 0 50% 50%;
    filter: blur(14px);
    transition: .5s
}

.button svg {
    display: flex;
    width: 32px;
    height: 32px;
    color: #121214
}

.button__wrapper {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    overflow: hidden;
    gap: 12px;
    padding: 13px 12px 13px 20px;
    box-sizing: border-box
}

@keyframes button-arrow-move-right {
    0% {
        transform: none
    }
    50% {
        transform: translate(100%)
    }
    50.1% {
        transform: translate(-100%)
    }
    to {
        transform: none
    }
}

@keyframes button-arrow-move-left {
    0% {
        transform: none
    }
    50% {
        transform: translate(-100%)
    }
    50.1% {
        transform: translate(100%)
    }
    to {
        transform: none
    }
}

.input-checkbox__wrapper {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 1rem;
    cursor: pointer
}

.input-checkbox__wrapper:hover .input-checkbox__icon {
    border: 2px solid #78787a
}

.input-checkbox__input, .input-checkbox__text {
    display: inline-block
}

.input-checkbox__icon {
    flex: none;
    position: relative;
    width: 24px;
    height: 24px;
    border-radius: 4px;
    border: 2px solid #c4c4c6;
    background: #ffffff1a;
    box-sizing: border-box
}

.input-checkbox__icon:focus-visible:after {
    content: "";
    position: absolute;
    width: 26px;
    height: 26px;
    border: 2px solid #3363ff;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.input-checkbox__icon svg {
    display: none;
    position: absolute;
    width: 12px;
    height: 10px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff
}

.input-checkbox__input {
    flex: none;
    display: none
}

.input-checkbox__input:checked + .input-checkbox__icon {
    background-color: #121214;
    border-color: #121214
}

.input-checkbox__input:checked + .input-checkbox__icon svg {
    display: block
}

.input-checkbox__input:checked:disabled + .input-checkbox__icon svg {
    color: #aab3bf
}

.input-checkbox__input:disabled + .input-checkbox__icon {
    background-color: #e5e5e5;
    border-color: #e5e5e5
}

.input-checkbox__text {
    font-weight: 450;
    font-size: 14px;
    line-height: 140%;
    color: #121214
}

.input-checkbox__text a:not(:hover) {
    text-decoration: underline
}

.input-common {
    display: inline-block;
    position: relative;
    width: 100%
}

.input-common.is-error .input-common__control {
    border-bottom: 1px solid #ea1d21
}

.input-common.is-error .input-common__placeholder {
    color: #ea1d21 !important
}

.input-common.is-error .input-common__error {
    display: block
}

.input-common__control {
    font-weight: 450;
    line-height: 140%;
    letter-spacing: -.02em;
    font-size: clamp(16px, 14.6666666667px + .1736111111vw, 18px);
    width: 100%;
    height: 70px;
    padding: 1.5rem 0;
    background: none;
    border-bottom: 1px solid #a3a3a3;
    box-sizing: border-box;
    transition: .1s
}

.input-common__control:not(:placeholder-shown), .input-common__control:hover {
    border-bottom: 1px solid #121214
}

.input-common__control:focus-visible {
    border-bottom: 1px solid #121214
}

.input-common__control::placeholder {
    opacity: 0
}

.input-common__control:not(:placeholder-shown) {
    padding-top: 21px
}

.input-common__control:not(:placeholder-shown) ~ .input-common__placeholder, .input-common__control:not(:placeholder-shown) ~ .input-common__placeholder-textarea {
    top: 5px;
    font-size: 12px;
    transform: none;
    color: #121214
}

.input-common__control:not(:placeholder-shown) ~ .input-common__placeholder-textarea {
    opacity: 0
}

.input-common__placeholder, .input-common__placeholder-textarea {
    font-weight: 450;
    line-height: 140%;
    letter-spacing: -.02em;
    font-size: clamp(16px, 14.6666666667px + .1736111111vw, 18px);
    color: #78787a;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    pointer-events: none
}

.input-common__placeholder-textarea, .input-common__placeholder-textarea-textarea {
    top: 1.5rem;
    transform: none
}

.input-common__error {
    display: block;
    position: absolute;
    left: 0;
    bottom: -16px;
    font-weight: 450;
    line-height: 100%;
    font-size: 12px;
    color: #ea1d21
}

.input-file.success .input-file__icon, .input-file.error .input-file__icon {
    display: none !important
}

.input-file__actions {
    display: flex;
    flex-direction: row;
    gap: 6px
}

.input-file__button {
    font-weight: 450;
    line-height: 140%;
    letter-spacing: -.02em;
    font-size: clamp(16px, 14.6666666667px + .1736111111vw, 18px);
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 0;
    box-sizing: border-box;
    border-radius: 30px;
    width: max-content;
    cursor: pointer
}

.input-file__button svg {
    min-width: 24px;
    width: 24px;
    height: 24px;
    color: #121214
}

.input-file__button svg.input-file__loading-icon {
    animation: rotate 5s linear infinite
}

.input-file__button svg.input-file__success-icon {
    color: #3fac42
}

.input-file__button svg.input-file__error-icon {
    color: #ea1d21
}

.input-file__button svg.input-file__remove-icon {
    color: #78787a
}

@keyframes rotate {
    0% {
        transform: rotate(0)
    }
    to {
        transform: rotate(360deg)
    }
}

.input-file__button .input-file__size {
    color: #78787a
}

.input-file__status {
    position: relative;
    margin-top: -10px;
    z-index: -1
}

.input-file__error {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(14px, 12.6666666667px + .1736111111vw, 16px)
}

@media (max-width: 992px) {
    .input-file__error {
        letter-spacing: -.03em
    }
}

.input-file__error {
    color: #ea1d21;
    margin-left: 30px
}

.slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent
}

.slick-list {
    position: relative;
    overflow: hidden;
    display: block;
    margin: 0;
    padding: 0
}

.slick-list:focus {
    outline: none
}

.slick-list.dragging {
    cursor: pointer;
    cursor: hand
}

.slick-slider .slick-track, .slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translateZ(0)
}

.slick-track {
    position: relative;
    left: 0;
    top: 0;
    display: block;
    margin-left: auto;
    margin-right: auto
}

.slick-track:before, .slick-track:after {
    content: "";
    display: table
}

.slick-track:after {
    clear: both
}

.slick-loading .slick-track {
    visibility: hidden
}

.slick-slide {
    float: left;
    height: 100%;
    min-height: 1px
}

[dir=rtl] .slick-slide {
    float: right
}

.slick-slide img {
    display: block
}

.slick-slide.slick-loading img, .slick-slide {
    display: none
}

.slick-slide.dragging img {
    pointer-events: none
}

.slick-initialized .slick-slide {
    display: block
}

.slick-loading .slick-slide {
    visibility: hidden
}

.slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent
}

.slick-arrow.slick-hidden {
    display: none
}

.cases {
    overflow: hidden
}

.cases__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .cases__container {
        padding: 0 16px
    }
}

.cases__container {
    display: flex;
    flex-direction: column;
    gap: 4rem
}

@media (max-width: 992px) {
    .cases__container {
        gap: 2.5rem
    }
}

@media (max-width: 540px) {
    .cases__container {
        gap: 2rem
    }
}

.cases__description {
    display: flex;
    flex-direction: column;
    gap: 2.5rem
}

@media (min-width: 993px) {
    .cases__description {
        text-align: center;
        align-items: center
    }
}

@media (max-width: 992px) {
    .cases__description {
        gap: 1rem
    }
}

.cases__title {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(32px, 21.3333333333px + 1.3888888889vw, 48px)
}

@media (max-width: 768px) {
    .cases__title {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

.cases__text {
    max-width: 1253px;
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(32px, 21.3333333333px + 1.3888888889vw, 48px)
}

@media (max-width: 768px) {
    .cases__text {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

.cases__text .sa-line__inner {
    background: linear-gradient(90deg, #0091f8, #7b72fa 50%, #c85cf7 75%, #f44443, #f45011);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

@media (max-width: 992px) {
    .cases__text br {
        display: none
    }
}

.cases__list {
    display: flex;
    flex-direction: column;
    gap: 8rem
}

@media (max-width: 992px) {
    .cases__list {
        gap: 7rem
    }
}

@media (max-width: 540px) {
    .cases__list {
        gap: 5rem
    }
}

.cases__item:not(.is-animated) .cases__link-wrapper {
    opacity: 0;
    transform: translateY(25%)
}

.cases__item.is-animated .cases__link-wrapper {
    transition: transform 1s, opacity 1s
}

.cases__link-wrapper {
    display: flex;
    flex-direction: column;
    gap: 2rem
}

@media (max-width: 992px) {
    .cases__link-wrapper {
        gap: 2rem
    }
}

.cases__link-wrapper:hover .cases-card-image:after {
    transform: translate(-50%, calc(-100px + 15%));
    filter: blur(30px);
    transition: 1s
}

.cases__link-wrapper:hover .cases-card__text {
    background-position: 0 center;
    transition: background-position 2s
}

.cases-card-image {
    width: 100%;
    padding-bottom: 100px;
    margin-bottom: -100px;
    position: relative
}

.cases-card-image:after {
    content: "";
    width: 90%;
    height: 10%;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, -100px);
    background: linear-gradient(90deg, #ff8400 -2.55%, #ff573c 17.44%, #ff2b4e 39.86%, #d046ff 61.79%, #1d8bff 99.91%);
    border-radius: 0 0 50% 50%;
    z-index: -1;
    transition: .5s
}

.cases-card-image__inner {
    width: 100%;
    height: 100%;
    aspect-ratio: 1680/800;
    overflow: hidden
}

@media (min-width: 993px) {
    .cases-card-image__inner {
        display: flex
    }
}

@media (max-width: 992px) {
    .cases-card-image__inner {
        aspect-ratio: 720/540
    }
}

@media (max-width: 540px) {
    .cases-card-image__inner {
        aspect-ratio: 360/450
    }
}

.cases-card-image__inner img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.cases-card-image__fragment {
    overflow: hidden
}

@media (max-width: 992px) {
    .cases-card-image__fragment {
        width: 100% !important
    }
}

.cases-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 64px;
    position: relative;
    z-index: 2
}

@media (max-width: 992px) {
    .cases-card__footer {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem
    }
}

.cases-card__text {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .cases-card__text {
        letter-spacing: -.03em
    }
}

.cases-card__text {
    display: inline-block;
    background: linear-gradient(90deg, #121214 30%, #254b68 45%, #c2e3e3 55%, #121214 70%);
    background-size: 300% 100%;
    background-position: 100% center;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent
}

.cases-card__text strong {
    font-weight: 600
}

.cases-card__profit {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .cases-card__profit {
        letter-spacing: -.03em
    }
}

.cases-card__profit {
    white-space: nowrap;
    padding: 16px 24px;
    border-radius: 100px;
    background: #a6c5ff5e;
    color: #3363ff
}

@media (max-width: 768px) {
    .cases-card__profit {
        padding: 12px 18px
    }
}

.cases__button {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .cases__button {
        letter-spacing: -.03em
    }
}

.cases__button {
    margin: 0 auto
}

.cases-card-image__fragment {
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
    height: 100%
}

@media (min-width: 993px) {
    .cases-card-image__fragment img {
        position: absolute;
        inset: 0;
        height: 100%;
        width: calc(var(--fragments, 1) * 100%);
        object-fit: cover;
        will-change: transform;
        transform: translate(calc(var(--base-x, 0%) + var(--hover-x, 0px)))
    }
}

.footer {
    height: min-content;
    overflow: hidden;
    position: relative;
    z-index: 6
}

.footer:not(.is-animated) .footer__inner {
    transform: translateY(25%);
    transition: 0s
}

.footer:not(.is-animated) .footer__container {
    opacity: 0;
    transition: 0s
}

.footer__inner {
    background: #121214;
    padding: 96px 0 24px;
    transition: 1s
}

@media (max-width: 992px) {
    .footer__inner {
        padding: 1.5rem 0
    }
}

.footer__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto;
    opacity: 1;
    transition: .5s .5s opacity
}

.footer__wrapper-top {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 3.5rem
}

@media (max-width: 992px) {
    .footer__wrapper-top {
        gap: 2rem
    }
}

.footer__logo {
    display: flex
}

.footer__logo img {
    width: 323px;
    height: 95px;
    object-fit: contain
}

@media (max-width: 992px) {
    .footer__logo img {
        width: 184px;
        height: 54px
    }
}

.footer__nav-contacts-wrapper {
    width: 100%;
    display: flex;
    padding-bottom: 48px;
    gap: 2.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, .1)
}

@media (max-width: 1300px) {
    .footer__nav-contacts-wrapper {
        flex-direction: column-reverse
    }
}

@media (max-width: 992px) {
    .footer__nav-contacts-wrapper {
        padding-bottom: 2rem
    }
}

.footer__contacts-wrapper {
    padding-top: 14px
}

.footer__contacts {
    display: flex;
    flex-direction: column;
    gap: 2rem
}

@media (min-width: 541px) {
    .footer__contacts {
        max-width: 350px
    }
}

@media (max-width: 992px) {
    .footer__contacts {
        gap: 1.5rem
    }
}

.footer-contacts__group {
    display: flex;
    flex-direction: column;
    gap: .5rem
}

.footer-contacts__group .footer-contacts-info__item {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(20px, 16px + .5208333333vw, 26px);
    font-weight: 600;
    color: #fff
}

.footer-contacts-info__item {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(14px, 12.6666666667px + .1736111111vw, 16px)
}

@media (max-width: 992px) {
    .footer-contacts-info__item {
        letter-spacing: -.03em
    }
}

.footer-contacts-info__item {
    color: #fff
}

.footer__wrapper-bottom {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 32px;
    padding-top: 2rem;
    color: #78787a
}

@media (max-width: 1300px)and (min-width: 769px) {
    .footer__wrapper-bottom {
        align-items: flex-end
    }
}

@media (max-width: 768px) {
    .footer__wrapper-bottom {
        flex-direction: column;
        gap: .75rem
    }
}

.footer__wrapper-bottom a {
    color: #78787a
}

.footer__info {
    font-weight: 450;
    line-height: 100%;
    font-size: 12px;
    display: flex;
    gap: 32px
}

@media (max-width: 1300px) {
    .footer__info {
        flex-direction: column-reverse;
        gap: .75rem
    }
}

.footer__nav {
    width: 100%;
    padding-top: 14px
}

.footer-nav__list {
    display: grid;
    grid-template-columns:repeat(4, 1fr);
    gap: 4rem .75rem
}

@media (max-width: 992px) {
    .footer-nav__list {
        grid-template-columns:repeat(3, 1fr);
        gap: 2rem 1rem
    }
}

@media (max-width: 600px) {
    .footer-nav__list {
        grid-template-columns:repeat(2, 1fr)
    }
}

.footer-nav__item {
    color: #fff;
    display: flex;
    flex-direction: column;
    gap: 26px
}

@media (max-width: 992px) {
    .footer-nav__item {
        gap: 1.5rem
    }
}

.footer-nav__title {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .footer-nav__title {
        letter-spacing: -.03em
    }
}

.footer-nav__submenu {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .5rem;
    align-self: stretch
}

@media (max-width: 992px) {
    .footer-nav__submenu {
        gap: 1.25rem
    }
}

.footer-nav__subitem {
    display: flex;
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(14px, 12.6666666667px + .1736111111vw, 16px)
}

@media (max-width: 992px) {
    .footer-nav__subitem {
        letter-spacing: -.03em
    }
}

.footer-nav__subitem {
    opacity: .5;
    position: relative;
    transition: .5s
}

.footer-nav__subitem:before {
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 0;
    background: #fff;
    transform-origin: left;
    transition: .5s
}

.footer-nav__subitem:not(:hover):before {
    transform: scaleX(0)
}

.footer-nav__subitem:hover {
    opacity: 1
}

.footer__socials {
    margin-top: 2.5rem
}

@media (max-width: 992px) {
    .footer__socials {
        margin-top: 2rem
    }
}

.footer-socials {
    display: flex;
    color: #fff
}

@media (min-width: 993px) {
    .footer-socials {
        justify-content: space-between
    }
}

@media (max-width: 992px) {
    .footer-socials {
        gap: 24px
    }
}

.footer-socials__item {
    display: flex;
    transition: .5s
}

.footer-socials__item:hover {
    transform: scale(1.2);
    transition: .1s
}

.footer-socials__item svg {
    display: flex;
    width: 40px;
    height: 40px
}

@media (max-width: 540px) {
    .footer-socials__item svg {
        width: 24px;
        height: 24px
    }
}

.footer__developer {
    font-weight: 450;
    line-height: 100%;
    font-size: 12px;
    display: flex;
    align-items: center;
    gap: 6px
}

.footer__developer a {
    display: flex
}

.footer__developer svg {
    width: 20px;
    height: 20px
}

@media (max-width: 540px) {
    .footer-contacts-info__button {
        width: 100%
    }
}

.form__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .form__container {
        padding: 0 16px
    }
}

.form__container {
    display: flex;
    flex-direction: column
}

.form__title {
    font-weight: 450;
    line-height: 120%;
    letter-spacing: -.03em;
    font-size: clamp(32px, 16px + 2.0833333333vw, 56px)
}

@media (max-width: 768px) {
    .form__title {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

.form__title strong {
    font-weight: 600
}

.form__title {
    font-weight: 600;
    margin-bottom: 4rem
}

@media (max-width: 768px) {
    .form__title {
        margin-bottom: 2rem
    }
}

@media (max-width: 540px) {
    .form__title {
        margin-bottom: 1.5rem
    }
}

.form__body:not(.is-animated) {
    opacity: 0
}

.form__body.is-animated {
    transition: opacity 1s
}

.form__body {
    max-width: 770px;
    display: flex;
    flex-direction: column;
    gap: 2rem
}

.form__fields-top {
    display: flex;
    flex-direction: row;
    gap: 3rem
}

@media (max-width: 768px) {
    .form__fields-top {
        flex-direction: column;
        gap: 1.5rem
    }
}

.form__fields-down .input-common {
    margin-bottom: 1rem
}

.form__fields-down .input-common .input-common__control {
    min-height: 150px;
    resize: none
}

.form__fields-down .form__upload {
    margin-bottom: 1.5rem
}

@media (max-width: 768px) {
    .form__fields-down .form__upload {
        margin-bottom: 1rem
    }
}

.form-success {
    position: relative
}

.form-success:not(.is-active) {
    opacity: 0;
    pointer-events: none
}

.form-success:not(.is-active) .form-success__frame:before {
    filter: blur(80px)
}

.form-success.is-active {
    transition: .1s
}

.form-success.is-active .form-success__frame:before {
    filter: blur(30px);
    transition: .5s
}

.form-success__frame {
    border-radius: 24px;
    background: #121214;
    color: #fff;
    padding: 32px 40px 32px 68px;
    box-sizing: border-box;
    max-width: 100%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: .75rem;
    overflow: hidden
}

@media (max-width: 992px) {
    .form-success__frame {
        padding: 24px 40px 24px 52px
    }
}

@media (max-width: 540px) {
    .form-success__frame {
        top: 16px
    }
}

.form-success__frame:before {
    content: "";
    width: 100%;
    height: 80px;
    position: absolute;
    bottom: -70px;
    left: 0;
    background: linear-gradient(90deg, #ff8400, #ff573c 19.06%, #ff2b4e 40.44%, #d046ff 61.35%, #1d8bff 97.7%);
    border-radius: 50% 50% 0 0
}

.form-success__close {
    position: absolute;
    top: 8px;
    right: 12px
}

.form-success__close svg {
    width: 24px;
    height: 24px;
    opacity: .3
}

.form-success__icon {
    width: 36px;
    height: 36px;
    position: absolute;
    top: 32px;
    left: 16px
}

@media (max-width: 1300px) {
    .form-success__icon {
        top: 28px
    }
}

@media (max-width: 992px) {
    .form-success__icon {
        width: 24px;
        height: 24px;
        top: 26px
    }
}

.form-success__title {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(20px, 16px + .5208333333vw, 26px)
}

.form-success__text {
    font-weight: 450;
    line-height: 140%;
    letter-spacing: -.02em;
    font-size: clamp(16px, 14.6666666667px + .1736111111vw, 18px)
}

.header {
    position: relative;
    z-index: 100
}

.header:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: #f5f5f7
}

.header.is-fixed:not(.is-hidden) .hv-header__content {
    background: #ffffff1a;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px)
}

.header:not(.is-active):before {
    opacity: 0;
    transition: .5s
}

.header.is-active:before {
    transition: .5s
}

.header:hover .header-nav__item button.is-selected {
    border-color: currentColor
}

.header__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .header__container {
        padding: 0 16px
    }
}

.header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    height: 86px
}

@media (max-width: 992px) {
    .header__inner {
        height: 62px
    }
}

.header__links {
    display: flex;
    flex-direction: row;
    gap: 16px
}

@media (max-width: 1500px) {
    .header__links {
        gap: 8px
    }
}

@media (max-width: 1420px) {
    .header__links--desktop {
        display: none !important
    }
}

@media (min-width: 1421px) {
    .header__links--mobile {
        display: none !important
    }
}

@media (max-width: 540px) {
    .header__links--mobile {
        flex-direction: column
    }
}

@media (max-width: 768px) {
    .header__button {
        flex: 0 1 50%
    }
}

@media (max-width: 540px) {
    .header__button {
        width: 100%
    }
}

.header__logo {
    display: flex;
    width: 134px;
    height: 39.412px;
    object-fit: contain
}

@media (min-width: 993px) {
    .header__logo {
        margin-top: -12px
    }
}

@media (max-width: 992px) {
    .header__logo {
        width: 46px;
        height: 46px
    }
}

@media (max-width: 992px) {
    .header__logo img:nth-child(1) {
        display: none !important
    }
}

@media (min-width: 993px) {
    .header__logo img:nth-child(2) {
        display: none !important
    }
}

@media (max-width: 1200px) {
    .header__nav {
        display: none !important
    }
}

.header-nav__list {
    display: flex;
    gap: 40px
}

@media (max-width: 1800px) {
    .header-nav__list {
        gap: 32px
    }
}

@media (max-width: 1600px) {
    .header-nav__list {
        gap: 24px
    }
}

@media (max-width: 1500px) {
    .header-nav__list {
        gap: 16px
    }
}

.header-nav__item {
    font-weight: 450;
    line-height: 140%;
    letter-spacing: -.02em;
    font-size: clamp(16px, 14.6666666667px + .1736111111vw, 18px)
}

@media (max-width: 1600px)and (min-width: 1201px) {
    .header-nav__item {
        font-size: 16px
    }
}

.header-nav__item button {
    position: relative
}

.header-nav__item button:before {
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 0;
    background: #121214;
    transform-origin: left;
    transition: .5s
}

.header-nav__item button:not(:hover):before {
    transform: scaleX(0)
}

.header-nav__submenu {
    display: none
}

@media (min-width: 1201px) {
    .header__hamburger {
        display: none !important
    }
}

.header__hamburger {
    display: flex
}

.header__hamburger svg {
    width: 32px;
    height: 32px
}

@media (max-width: 1200px) {
    .header__dropdown {
        display: none !important
    }
}

.header__dropdown {
    position: fixed;
    z-index: 1000;
    transform-origin: top
}

.header-dropdown {
    background: #f5f5f7;
    box-shadow: 0 18px 20.6px #0000000a;
    padding: 88px 0 40px
}

.header-dropdown.is-active {
    transition: opacity .5s, transform .5s
}

.header-dropdown.is-active .header-dropdown__panel {
    transition: opacity .2s .3s
}

.header-dropdown:not(.is-active) {
    pointer-events: none;
    transform: scaleY(.75) !important;
    opacity: 0
}

.header-dropdown:not(.is-active) .header-dropdown__panel {
    opacity: 0
}

.header-dropdown__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .header-dropdown__container {
        padding: 0 16px
    }
}

.header-dropdown__container:not(.is-visible) {
    width: 0;
    height: 0;
    overflow: hidden;
    opacity: 0
}

.header-dropdown__container.is-visible {
    transition: opacity 0s
}

.header-dropdown__panel {
    width: 100%;
    display: flex;
    justify-content: space-between
}

.header-dropdown-nav__list {
    display: flex;
    flex-direction: column;
    gap: 1.25rem
}

.header-dropdown-nav__item {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .header-dropdown-nav__item {
        letter-spacing: -.03em
    }
}

.header-dropdown-nav__item {
    width: max-content
}

.header-dropdown-nav__item:hover svg {
    opacity: 1;
    transform: none
}

.header-dropdown-nav__item a {
    display: flex;
    align-items: center;
    gap: 12px;
    position: relative
}

.header-dropdown-nav__item a:before {
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 0;
    background: #121214;
    transform-origin: left;
    transition: .5s
}

.header-dropdown-nav__item a:not(:hover):before {
    transform: scaleX(0)
}

.header-dropdown-nav__item a:hover {
    border-color: currentColor
}

.header-dropdown-nav__item a:hover svg {
    opacity: 1;
    transition: .1s
}

.header-dropdown-nav__item svg {
    min-width: 28px;
    width: 28px;
    height: 28px;
    margin-left: -40px;
    opacity: 0;
    transform: translate(-50%);
    transition: .5s;
    pointer-events: none
}

.header-dropdown-nav__links {
    display: flex;
    gap: 40px
}

.header-dropdown-nav__links a {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .header-dropdown-nav__links a {
        letter-spacing: -.03em
    }
}

.header-dropdown-teaser {
    width: 569px;
    display: flex;
    flex-direction: column;
    gap: 1.25rem
}

.header-dropdown-teaser__img {
    width: 100%;
    height: 270px;
    object-fit: cover
}

.header-dropdown-teaser__caption {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 16.6666666667px + .1736111111vw, 20px)
}

.header-dropdown-teaser__caption b, .header-dropdown-teaser__caption strong {
    font-weight: 700
}

.header-menu {
    position: fixed;
    z-index: 1000;
    background: #f5f5f7;
    box-shadow: 0 18px 20.6px #0000000a;
    transform-origin: top;
    height: calc(100dvh - 86px)
}

@media (max-width: 992px) {
    .header-menu {
        height: calc(100dvh - 62px)
    }
}

.header-menu.is-active {
    transition: opacity .5s, transform .5s
}

.header-menu.is-active .header-menu__panel {
    transition: opacity .2s .3s
}

.header-menu:not(.is-active) {
    pointer-events: none;
    transform: scaleY(.75) !important;
    opacity: 0;
    transition: opacity .1s, transform .5s
}

.header-menu:not(.is-active) .header-menu__panel {
    opacity: 0
}

.header-menu__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .header-menu__container {
        padding: 0 16px
    }
}

.header-menu__container {
    scrollbar-width: none;
    -ms-overflow-style: none
}

.header-menu__container::-webkit-scrollbar {
    width: 0;
    height: 0
}

.header-menu__container {
    height: 100%;
    overflow-y: auto
}

.header-menu__panel {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 1.25rem;
    padding-bottom: 1.5rem
}

.header-menu-nav {
    display: flex;
    flex-direction: column;
    gap: 8px
}

.header-menu-nav__item.is-unfolded .header-menu-nav__button svg use:nth-child(1) {
    opacity: 0
}

.header-menu-nav__item.is-unfolded .header-menu-nav__button svg use:nth-child(2) {
    opacity: 1
}

.header-menu-nav__button {
    display: flex;
    justify-content: space-between;
    width: 100%;
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(26px, 22px + .5208333333vw, 32px);
    padding: 1rem 0;
    border-bottom: 1px dashed
}

.header-menu-nav__button svg {
    display: flex;
    width: 35px;
    height: 24px
}

.header-menu-nav__button svg use {
    transition: .1s
}

.header-menu-nav__button svg use:nth-child(2) {
    opacity: 0
}

.header-menu-nav-sub-nav {
    padding: 1.25rem 0 .75rem
}

.header-menu-nav-sub-nav__item {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 16.6666666667px + .1736111111vw, 20px)
}

.header-menu-nav-sub-nav__item a {
    display: flex;
    padding: 8px 0
}

@media (min-width: 1421px) {
    .header__folder {
        display: none !important
    }
}

@media (max-width: 1200px) {
    .header__folder {
        display: none !important
    }
}

.header-folder {
    position: relative
}

.header-folder:hover .header-folder__button--hidden {
    display: block
}

.header-folder__button {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 8px 13px 16px;
    border-radius: 100px;
    box-sizing: border-box;
    background: #121214;
    color: #fff;
    white-space: nowrap;
    font-size: 16px;
    line-height: 140%;
    position: relative;
    z-index: 2
}

.header-folder__button:hover span {
    border-color: currentColor
}

.header-folder__button--hidden {
    width: 100%;
    position: absolute;
    bottom: 30px;
    left: 0;
    transform: translateY(100%);
    z-index: 1;
    border-radius: 0 0 27px 27px;
    padding-top: 30px;
    display: none
}

.header-folder__button svg {
    width: 28px;
    height: 28px
}

.header-folder__button span {
    border-bottom: 1px solid transparent
}

.hiring__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .hiring__container {
        padding: 0 16px
    }
}

.hiring__container {
    display: grid;
    grid-template-columns:1fr 2fr;
    gap: 11rem
}

@media (max-width: 1300px) {
    .hiring__container {
        grid-template-columns:1fr;
        gap: 2.5rem
    }
}

@media (max-width: 768px) {
    .hiring__container {
        display: flex;
        flex-direction: column
    }
}

.hiring__info {
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none
}

@media (max-width: 768px) {
    .hiring__info {
        width: 100vw;
        left: 50%;
        transform: translate(-50%);
        position: relative
    }
}

.hiring__logo {
    width: 126px;
    height: 126px;
    aspect-ratio: 1/1
}

.hiring__logo svg {
    width: 100%;
    height: 100%;
    object-fit: contain
}

.hiring__title {
    font-weight: 450;
    line-height: 120%;
    letter-spacing: -.03em;
    font-size: clamp(32px, 16px + 2.0833333333vw, 56px)
}

@media (max-width: 768px) {
    .hiring__title {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

.hiring__title strong, .hiring__title {
    font-weight: 600
}

.hiring__button {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(26px, 22px + .5208333333vw, 32px);
    padding: 20px 26px;
    background: #121214;
    color: #fff;
    border-radius: 100px;
    height: auto
}

.hiring__button:hover {
    background: #fff
}

.hiring__button:before {
    content: none
}

.hiring__button svg {
    color: #fff
}

.hiring__button .button__wrapper {
    padding: 0
}

.hiring__intro {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4rem
}

@media (max-width: 1300px) {
    .hiring__intro {
        gap: 1.75rem
    }
}

.hiring__list {
    display: grid;
    grid-template-columns:repeat(2, 1fr);
    gap: 4rem 3.5rem
}

@media (max-width: 1300px) {
    .hiring__list {
        gap: 1.5rem 1.25rem
    }
}

@media (max-width: 768px) {
    .hiring__list {
        width: 100%;
        max-width: 1728px;
        padding: 0 24px;
        box-sizing: border-box;
        margin: 0 auto;
        width: max-content;
        grid-template-columns:repeat(4, 1fr)
    }
}

@media (max-width: 768px)and (max-width: 540px) {
    .hiring__list {
        padding: 0 16px
    }
}

.hiring__item {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(20px, 16px + .5208333333vw, 26px);
    border-top: 1px solid #121214;
    padding-top: 2.5rem
}

@media (max-width: 1300px) {
    .hiring__item {
        padding-top: 1.5rem
    }
}

@media (max-width: 768px) {
    .hiring__item {
        width: max-content;
        max-width: 350px
    }
}

.intro-generic {
    min-height: 690px;
    margin-top: -86px;
    display: flex;
    flex-direction: column;
    justify-content: end;
    margin-bottom: 0;
    position: relative
}

@media (max-width: 992px) {
    .intro-generic {
        min-height: 410px;
        margin-top: -62px
    }
}

.intro-generic:before {
    content: "";
    width: 100%;
    height: 100vh;
    position: absolute;
    top: 0;
    left: 0;
    transform-origin: top
}

.intro-generic--bg-default, .intro-generic--bg-default:before {
    background: linear-gradient(0deg, #ffb489 30%, #fff)
}

.intro-generic--bg-blue, .intro-generic--bg-blue:before {
    background: linear-gradient(0deg, #afd1e1, #fff)
}

.intro-generic--bg-coral, .intro-generic--bg-coral:before {
    background: linear-gradient(180deg, #d4dafa, #ffcbc5, #ff4c56)
}

.intro-generic.is-animated:before {
    height: 100%;
    transition: 1s .15s
}

.intro-next-case {
    margin-top: 0
}

.intro-generic__next-case {
    position: absolute;
    top: 34px
}

.intro-generic__next-case .button {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(26px, 22px + .5208333333vw, 32px)
}

@media (max-width: 992px) {
    .intro-generic__next-case {
        top: 24px
    }
}

.intro-generic__container {
    min-height: 485px;
    display: grid;
    grid-template-columns:1fr 186px;
    gap: 1.5rem;
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .intro-generic__container {
        padding: 0 16px
    }
}

@media (max-width: 992px) {
    .intro-generic__container {
        min-height: 345px;
        grid-template-columns:1fr
    }
}

@media (max-width: 540px) {
    .intro-generic__container {
        min-height: 320px
    }
}

.intro-generic__general {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    justify-content: space-between;
    margin-bottom: 1.5rem
}

@media (max-width: 992px) {
    .intro-generic__general {
        margin-top: 1.5rem
    }
}

@media (max-width: 540px) {
    .intro-generic__general {
        justify-content: end
    }
}

.intro-generic__top {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: baseline;
    gap: 1.25rem;
    align-content: end;
    margin-bottom: 1.25rem;
    z-index: 1
}

@media (max-width: 540px) {
    .intro-generic__top {
        display: none
    }
}

.intro-generic__top:not(.is-animated) {
    opacity: 0;
    transform: translateY(25%)
}

.intro-generic__top.is-animated {
    transition: transform 1s .25s, opacity 1s .25s
}

.intro-generic__name {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .intro-generic__name {
        letter-spacing: -.03em
    }
}

.intro-generic__label {
    display: flex;
    align-items: end;
    font-weight: 450;
    font-size: 14px;
    line-height: 140%
}

.intro-generic__title {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(32px, 21.3333333333px + 1.3888888889vw, 48px)
}

@media (max-width: 768px) {
    .intro-generic__title {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

.intro-generic__title {
    margin-bottom: 2.5rem;
    max-width: 964px
}

@media (max-width: 992px) {
    .intro-generic__title {
        margin-bottom: 1.5rem
    }
}

.intro-generic__button-wrapper:not(.is-animated) {
    opacity: 0;
    transform: translateY(25%)
}

.intro-generic__button-wrapper.is-animated {
    transition: transform .5s 1s, opacity .5s 1s
}

@media (max-width: 768px) {
    .intro-generic__button-wrapper {
        display: none
    }
}

.intro-generic__breadcrumbs:not(.is-animated) {
    opacity: 0
}

.intro-generic__breadcrumbs.is-animated {
    transition: opacity .5s 1.2s
}

.intro-generic__made {
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative
}

@media (max-width: 992px) {
    .intro-generic__made {
        display: none
    }
}

.intro-generic-made:not(.is-animated) {
    opacity: 0
}

.intro-generic-made.is-animated {
    transition: opacity .5s 1.2s
}

.intro-generic-made__title {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .intro-generic-made__title {
        letter-spacing: -.03em
    }
}

.intro-generic-made__title {
    font-weight: 600;
    margin-bottom: 21px
}

.intro-generic-made__list {
    display: flex;
    flex-direction: column;
    gap: 6px
}

.intro-generic-made__item {
    position: relative;
    font-weight: 450;
    line-height: 140%;
    letter-spacing: -.02em;
    font-size: clamp(16px, 14.6666666667px + .1736111111vw, 18px)
}

.intro-generic-made__item:hover .intro-generic-made__item-icon {
    opacity: 1;
    transform: translate(-34px, -50%)
}

.intro-generic-made__item-icon {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 50%;
    opacity: 0;
    transform: translate(-44px, -50%);
    transition: .5s;
    pointer-events: none
}

.intro-main__wrapper {
    overflow: hidden;
    padding-bottom: 100px;
    margin-bottom: -100px;
    position: relative
}

.intro-main__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .intro-main__container {
        padding: 0 16px
    }
}

.intro-main__description {
    padding: 5rem 0 7rem;
    display: flex;
    flex-direction: column;
    gap: 3.5rem
}

@media (max-width: 1300px) {
    .intro-main__description {
        padding: 3.5rem 0
    }
}

@media (max-width: 992px) {
    .intro-main__description {
        gap: 2rem
    }
}

@media (max-width: 540px) {
    .intro-main__description {
        padding: 3rem 0
    }
}

.intro-main__title {
    font-weight: 450;
    line-height: 120%;
    letter-spacing: -.03em;
    font-size: clamp(32px, 16px + 2.0833333333vw, 56px)
}

@media (max-width: 768px) {
    .intro-main__title {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

.intro-main__title strong {
    font-weight: 600
}

.intro-main__title {
    max-width: 1251px
}

@media (max-width: 540px) {
    .intro-main__title {
        order: 0
    }
}

.intro-main__footer {
    display: flex;
    justify-content: space-between
}

@media (max-width: 992px) {
    .intro-main__footer {
        flex-direction: column;
        gap: 2rem
    }
}

.intro-main__footer:not(.is-animated) {
    opacity: 0
}

.intro-main__footer.is-animated {
    transition: .5s
}

@media (max-width: 992px) {
    .intro-main__button {
        order: 2;
        position: fixed;
        bottom: 14px;
        left: 50%;
        transform: translate(-50%);
        z-index: 5
    }
}

@media (max-width: 540px) {
    .intro-main__benefits {
        order: 1
    }
}

.intro-main-benefits {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .intro-main-benefits {
        letter-spacing: -.03em
    }
}

.intro-main-benefits {
    display: flex;
    gap: 40px
}

@media (max-width: 1600px) {
    .intro-main-benefits {
        gap: 16px
    }
}

@media (min-width: 1301px) {
    .intro-main-benefits {
        justify-content: flex-end
    }
}

@media (max-width: 1400px) {
    .intro-main-benefits {
        width: max-content;
        display: grid;
        grid-template-columns:repeat(2, 30vw);
        column-gap: 16px;
        row-gap: 24px
    }
}

@media (max-width: 992px) {
    .intro-main-benefits {
        width: 100%;
        grid-template-columns:repeat(2, 36vw)
    }
}

@media (max-width: 768px) {
    .intro-main-benefits {
        grid-template-columns:repeat(2, 46vw)
    }
}

@media (max-width: 540px) {
    .intro-main-benefits {
        grid-template-columns:repeat(1, 1fr);
        gap: 16px
    }
}

.intro-main-benefits__item:not(.is-animated) {
    opacity: 0;
    transform: translate(-10%)
}

.intro-main-benefits__item.is-animated {
    transition: transform 1s, opacity 1s
}

.intro-main-benefits__item {
    position: relative;
    padding-left: 56px
}

@media (max-width: 992px) {
    .intro-main-benefits__item {
        padding-left: 36px
    }
}

.intro-main-benefits__item svg {
    width: 32px;
    height: 32px;
    position: absolute;
    top: 0;
    left: 0
}

@media (max-width: 992px) {
    .intro-main-benefits__item svg {
        width: 24px;
        height: 24px
    }
}

@media (max-width: 540px) {
    .intro-main-benefits__item br {
        display: none
    }
}

.intro-main__gradient {
    position: relative;
    width: 110%;
    transform: translate(-5%)
}

.intro-main__gradient:before {
    content: "";
    width: 100%;
    height: 16vw;
    background: linear-gradient(270deg, #0091f8, #7b72fa 29.81%, #c85cf7 50.06%, #f44443 79.77%);
    background-position: center center;
    border-radius: 50% 50% 0 0;
    animation: gradientShow 2s 1.25s forwards;
    opacity: 0;
    transform: translateY(-30px) scaleX(.15);
    position: absolute;
    bottom: -14vw;
    left: 0;
    transform-origin: center 2vw
}

@keyframes gradientShow {
    0% {
        background-size: 400%;
        transform: translateY(-30px) scaleX(.15);
        filter: blur(10px)
    }
    50% {
        opacity: 1
    }
    to {
        background-size: 100%;
        filter: blur(30px);
        transform: none;
        opacity: 1
    }
}

.intro-main__screen {
    position: relative;
    width: 100%;
    aspect-ratio: 1920/900;
    background: #121214;
    display: flex;
    align-items: center;
    justify-content: center;
    object-fit: cover
}

@media (max-width: 768px) {
    .intro-main__screen {
        aspect-ratio: 393/312
    }
}

.modal-callback {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2000;
    width: 100%;
    height: 100%;
    background: #fff
}

.modal-callback:not(.is-active) {
    opacity: 0;
    pointer-events: none;
    transition: .1s
}

.modal-callback:not(.is-active) .modal-callback__panel {
    opacity: 0;
    transition: .1s
}

.modal-callback.is-active {
    transition: .1s
}

.modal-callback.is-active .modal-callback__panel {
    opacity: 1;
    transition: .5s .1s
}

.modal-callback__container {
    scrollbar-width: none;
    -ms-overflow-style: none
}

.modal-callback__container::-webkit-scrollbar {
    width: 0;
    height: 0
}

.modal-callback__container {
    height: 100%;
    overflow-y: auto
}

.modal-callback__panel {
    height: max-content;
    display: flex;
    flex-direction: column;
    padding-bottom: 5vh;
    box-sizing: border-box;
    position: relative
}

.modal-callback__panel .form {
    width: 100%;
    margin: auto 0;
    padding: 10vh 0;
    box-sizing: border-box
}

.modal-callback__panel .form .form__title {
    padding-right: 64px;
    box-sizing: border-box
}

.modal-callback__close {
    position: absolute;
    top: calc(10vh + 8px);
    right: 5vw
}

@media (max-width: 1300px) {
    .modal-callback__close {
        top: 10vh;
        right: 24px
    }
}

@media (max-width: 992px) {
    .modal-callback__close {
        top: calc(10vh - 4px)
    }
}

@media (max-width: 540px) {
    .modal-callback__close {
        top: calc(10vh + 2px)
    }
}

.modal-callback__close svg {
    width: 48px;
    height: 48px
}

@media (max-width: 540px) {
    .modal-callback__close svg {
        width: 32px;
        height: 32px
    }
}

.modal-callback__success {
    padding: 10vh 0
}

.modal-callback-success__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .modal-callback-success__container {
        padding: 0 16px
    }
}

.modal-callback-success__wrapper {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
    padding-left: 68px;
    box-sizing: border-box;
    position: relative
}

@media (max-width: 992px) {
    .modal-callback-success__wrapper {
        gap: 1.5rem
    }
}

@media (max-width: 540px) {
    .modal-callback-success__wrapper {
        padding-left: 52px
    }
}

.modal-callback-success__icon {
    width: 48px;
    min-width: 48px;
    height: 48px;
    position: absolute;
    top: .5vw;
    left: 0
}

@media (max-width: 1600px) {
    .modal-callback-success__icon {
        top: .2vw
    }
}

@media (max-width: 992px) {
    .modal-callback-success__icon {
        top: -.5vw
    }
}

@media (max-width: 768px) {
    .modal-callback-success__icon {
        top: -1vw
    }
}

@media (max-width: 540px) {
    .modal-callback-success__icon {
        width: 40px;
        min-width: 40px;
        height: 40px
    }
}

.modal-callback-success__title {
    font-weight: 450;
    line-height: 120%;
    letter-spacing: -.03em;
    font-size: clamp(32px, 16px + 2.0833333333vw, 56px)
}

@media (max-width: 768px) {
    .modal-callback-success__title {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

.modal-callback-success__title strong {
    font-weight: 600
}

.modal-callback-success__title {
    font-weight: 600;
    display: flex;
    gap: 1.25rem
}

@media (max-width: 540px) {
    .modal-callback-success__title {
        gap: .75rem
    }
}

.modal-callback-success__text {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(20px, 16px + .5208333333vw, 26px)
}

.partners {
    position: relative
}

.partners__content {
    padding: 5rem 0
}

.partners__content.partners__content--light {
    background: none;
    color: #121214;
    padding: 0
}

.partners__content.partners__content--light .partners-logos__img {
    filter: brightness(0)
}

.partners__content.partners__content--dark {
    background: #121214;
    color: #fff
}

.partners__content {
    overflow: hidden
}

@media (max-width: 992px) {
    .partners__content {
        padding: 3rem 0
    }
}

@media (max-width: 540px) {
    .partners__content {
        padding: 2.5rem 0
    }
}

.partners__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .partners__container {
        padding: 0 16px
    }
}

.partners__container {
    display: flex;
    flex-direction: column;
    gap: 4rem
}

@media (max-width: 992px) {
    .partners__container {
        gap: 40px
    }
}

.partners__subsection {
    display: flex;
    flex-direction: column;
    gap: 4rem
}

@media (max-width: 1300px) {
    .partners__subsection {
        gap: 2rem
    }
}

.partners__wrapper {
    display: flex;
    gap: 7.5vw
}

@media (max-width: 1600px) {
    .partners__wrapper {
        gap: 5vw
    }
}

@media (max-width: 1300px) {
    .partners__wrapper {
        flex-direction: column;
        gap: 40px
    }
}

.partners__header {
    display: flex;
    justify-content: space-between;
    gap: 40px
}

@media (min-width: 993px) {
    .partners__scroll-icon {
        display: none !important
    }
}

.partners__scroll-icon {
    display: flex;
    min-width: 40px;
    width: 40px;
    height: 40px
}

.partners__title {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(20px, 16px + .5208333333vw, 26px);
    flex: 0 0 283px;
    padding-top: 1.25rem;
    box-sizing: border-box;
    font-weight: 600
}

.partners__title-full {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(32px, 21.3333333333px + 1.3888888889vw, 48px)
}

@media (max-width: 768px) {
    .partners__title-full {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

@media (max-width: 1300px) {
    .partners__title {
        flex: 1
    }
}

@media (max-width: 992px) {
    .partners__title {
        padding-top: 0;
        max-width: 350px
    }
}

.partners__subtitle, .partners__steps {
    flex: 1
}

.partners__subtitle {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(32px, 21.3333333333px + 1.3888888889vw, 48px)
}

@media (max-width: 768px) {
    .partners__subtitle {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

.partners__subtitle .sa-line__inner {
    background: linear-gradient(90deg, #e1f5ef, #98c8c7, #ff365b, #98c8c7, #e1f5ef);
    background-size: 300% 100%;
    background-position: 300% 50%;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: sa-text-gradient-loop 10s ease-in-out infinite
}

@media (max-width: 540px) {
    .partners__subtitle br {
        display: none
    }
}

@keyframes sa-text-gradient-loop {
    0% {
        background-position: 300% 50%
    }
    85% {
        background-position: 0 50%
    }
    to {
        background-position: 0 50%
    }
}

@media (max-width: 992px) {
    .partners__scroll-wrapper {
        overflow-x: auto;
        width: 100vw;
        left: 50%;
        transform: translate(-50%);
        position: relative
    }

    .partners__scroll-wrapper > * {
        width: max-content;
        padding: 0 24px
    }

    .partners__scroll-wrapper {
        scrollbar-width: none;
        -ms-overflow-style: none
    }
}

@media (max-width: 992px)and (max-width: 540px) {
    .partners__scroll-wrapper > * {
        padding: 0 16px
    }
}

@media (max-width: 992px) {
    .partners__scroll-wrapper::-webkit-scrollbar {
        width: 0;
        height: 0
    }
}

.partners-steps {
    display: flex;
    justify-content: space-between;
    gap: 5vw
}

@media (max-width: 992px) {
    .partners-steps {
        gap: 1.25rem
    }
}

.partners-steps__item:not(.is-animated) {
    opacity: 0;
    transform: translateY(25%)
}

.partners-steps__item.is-animated {
    transition: transform 1s, opacity 1s
}

.partners-steps__item {
    flex: 0 1 354px;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding-top: 2.5rem;
    border-top: 1px solid;
    overflow: hidden;
    position: relative;
    cursor: default
}

@media (max-width: 992px) {
    .partners-steps__item {
        flex: 1;
        width: 320px
    }
}

.partners-steps__item:before {
    content: "";
    width: 90%;
    height: 60px;
    border-radius: 50%;
    background: linear-gradient(90deg, #ff3e4d, #ff4e9f 55.29%, #ffcbc7 97.7%);
    position: absolute;
    top: 0;
    left: 50%;
    filter: blur(16px);
    transform: translate(-50%, -120%);
    opacity: 0;
    transition: .5s
}

.partners-steps__item:hover {
    border-color: #a8486f;
    transition: .1s
}

.partners-steps__item:hover:before {
    opacity: .9;
    transition: .5s;
    transform: translate(-50%, -90%)
}

.partners-steps__item:hover .partners-steps__title span:nth-child(1) {
    opacity: 0;
    transition: .5s
}

.partners-steps__item:hover .partners-steps__title span:nth-child(2) {
    opacity: 1;
    transition: .5s
}

.partners-steps__title {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(26px, 22px + .5208333333vw, 32px);
    position: relative
}

.partners-steps__title span {
    transition: .1s
}

.partners-steps__title span:nth-child(2) {
    background: linear-gradient(270deg, #ff4050, #ff6eac 54.81%, #d4daf2);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0
}

.partners-steps__text {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 16.6666666667px + .1736111111vw, 20px);
    display: flex;
    flex-direction: column;
    gap: 1em
}

.partners-logos {
    display: grid;
    grid-template-columns:repeat(7, 1fr);
    row-gap: 1rem;
    column-gap: .5rem
}

@media (max-width: 1300px) {
    .partners-logos {
        grid-template-columns:repeat(6, 1fr)
    }
}

@media (max-width: 992px) {
    .partners-logos {
        grid-template-columns:repeat(5, 1fr)
    }
}

@media (max-width: 768px) {
    .partners-logos {
        grid-template-columns:repeat(4, 1fr)
    }
}

@media (max-width: 540px) {
    .partners-logos {
        grid-template-columns:repeat(3, 1fr)
    }
}

.partners-logos__item:not(.is-animated) {
    opacity: 0;
    transform: translate(-10%)
}

.partners-logos__item.is-animated {
    transition: transform 1s, opacity 1s
}

.partners-logos__item {
    aspect-ratio: 226/94
}

.partners-logos__img {
    width: 100%;
    height: 100%;
    object-fit: contain
}

.partners__gradient {
    width: 100%;
    height: 100px;
    position: absolute;
    top: calc(100% - 70px);
    left: 0;
    z-index: -1;
    filter: blur(20px);
    background: linear-gradient(90deg, #ff8400, #ff573c 19.06%, #ff2b4e 40.44%, #d046ff 61.35%, #1d8bff 97.7%);
    border-radius: 50%
}

@media (max-width: 768px) {
    .partners__gradient {
        top: calc(100% - 80px)
    }
}

.partners__gradient:not(.is-animated) {
    transform: translateY(-100%)
}

.partners__gradient.is-animated {
    transition: 1s .25s
}

.services {
    margin-bottom: 0;
    padding-bottom: 8rem
}

@media (max-width: 992px) {
    .services {
        margin-bottom: 0;
        padding-bottom: 3.5rem
    }
}

@media (max-width: 540px) {
    .services {
        margin-bottom: 0;
        padding-bottom: 3rem
    }
}

.services {
    overflow: hidden
}

.services__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .services__container {
        padding: 0 16px
    }
}

.services__container {
    display: flex;
    flex-direction: column;
    gap: 4rem
}

@media (max-width: 992px) {
    .services__container {
        gap: 2.5rem
    }
}

@media (max-width: 540px) {
    .services__container {
        gap: 2rem
    }
}

.services__wrapper {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
    text-align: center
}

@media (max-width: 992px) {
    .services__wrapper {
        gap: 1rem
    }
}

.services__title {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(32px, 21.3333333333px + 1.3888888889vw, 48px)
}

@media (max-width: 768px) {
    .services__title {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

.services__description {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem
}

.services__subtitle {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(32px, 21.3333333333px + 1.3888888889vw, 48px)
}

@media (max-width: 768px) {
    .services__subtitle {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

.services__subtitle .sa-line__inner {
    background: linear-gradient(90deg, #0091f8, #7b72fa 50%, #c85cf7 75%, #f44443, #f45011);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent
}

.services__text {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(20px, 16px + .5208333333vw, 26px);
    max-width: 885px
}

@media (max-width: 1200px) {
    .services__scroll-wrapper {
        overflow-x: auto;
        width: 100vw;
        left: 50%;
        transform: translate(-50%);
        position: relative
    }

    .services__scroll-wrapper > * {
        width: max-content;
        padding: 0 24px
    }

    .services__scroll-wrapper {
        scrollbar-width: none;
        -ms-overflow-style: none
    }
}

@media (max-width: 1200px)and (max-width: 540px) {
    .services__scroll-wrapper > * {
        padding: 0 16px
    }
}

@media (max-width: 1200px) {
    .services__scroll-wrapper::-webkit-scrollbar {
        width: 0;
        height: 0
    }
}

.services__list {
    max-width: 1680px;
    display: flex;
    gap: 1rem;
    margin: 0 auto
}

@media (max-width: 1300px) {
    .services__list {
        gap: .75rem
    }
}

.services__item:not(.is-animated) {
    opacity: 0;
    transform: translateY(25%)
}

.services__item.is-animated {
    transition: transform 1s, opacity 1s
}

.services-card {
    flex: 1;
    border-radius: 50px;
    padding: 56px 32px;
    box-sizing: border-box;
    aspect-ratio: 408/705
}

@media (min-width: 993px) {
    .services-card {
        min-width: 340px;
        max-height: 50vw
    }
}

@media (max-width: 1600px)and (min-width: 1201px) {
    .services-card {
        padding: 1.5rem;
        min-width: 0;
        max-height: none
    }
}

@media (max-width: 1300px) {
    .services-card {
        padding: 8px 32px
    }
}

@media (max-width: 992px) {
    .services-card {
        aspect-ratio: 330/530;
        width: 330px;
        max-width: none
    }
}

@media (max-width: 540px) {
    .services-card {
        aspect-ratio: 330/460
    }
}

.services-card:nth-child(1) {
    background: linear-gradient(180deg, #d4dafa, #ffcbc5, #ff4c56)
}

.services-card:nth-child(1) .services-card__title {
    color: #25073e
}

.services-card:nth-child(2) {
    background: linear-gradient(180deg, #c6ffcf, #ffbc46 82.09%, #ff7d04 121.34%)
}

.services-card:nth-child(2) .services-card__title {
    color: #064128
}

.services-card:nth-child(3) {
    background: linear-gradient(180deg, #d5daf9 -9.94%, #90d6e2 50.51%, #8c0dfc 124.23%)
}

.services-card:nth-child(3) .services-card__title {
    color: #1e35a3
}

.services-card:nth-child(4) {
    background: linear-gradient(0deg, #dad7da, #f1c7c9 80.37%)
}

.services-card:nth-child(4) .services-card__title {
    color: #590d0e
}

.services-card__title {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(37px, 29.6666666667px + .9548611111vw, 48px);
    display: flex;
    align-items: flex-end;
    height: 2.4em;
    margin-bottom: 24px;
    margin-top: 8vw
}

@media (max-width: 1600px)and (min-width: 1201px) {
    .services-card__title {
        font-size: 37px
    }
}

@media (max-width: 1300px) {
    .services-card__title {
        margin-top: 5vw
    }
}

@media (max-width: 992px) {
    .services-card__title {
        margin-bottom: 80px
    }
}

@media (max-width: 768px) {
    .services-card__title {
        margin-bottom: 96px
    }
}

@media (max-width: 540px) {
    .services-card__title {
        margin-bottom: 50px
    }
}

.services-card__list {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .services-card__list {
        letter-spacing: -.03em
    }
}

.services-card__list {
    color: #fff;
    display: flex;
    flex-direction: column;
    gap: .75rem
}

.services-card__item {
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: default
}

@media (max-width: 1600px)and (min-width: 1201px) {
    .services-card__item {
        margin-left: -8px
    }
}

@media (max-width: 1300px) {
    .services-card__item {
        margin-left: -24px
    }
}

.services-card__item:hover svg {
    opacity: 1
}

.services-card__item svg {
    width: 26px;
    height: 26px;
    margin-left: -5px;
    opacity: 0;
    transition: .1s
}

.tasks {
    overflow: hidden
}

.tasks__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .tasks__container {
        padding: 0 16px
    }
}

.tasks__container {
    display: flex;
    flex-direction: column;
    gap: 4rem
}

@media (max-width: 992px) {
    .tasks__container {
        gap: 2.5rem
    }
}

@media (max-width: 540px) {
    .tasks__container {
        gap: 2rem
    }
}

.tasks__header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 2rem
}

@media (max-width: 540px) {
    .tasks__header {
        flex-direction: column
    }
}

.tasks__title {
    max-width: 940px;
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(32px, 21.3333333333px + 1.3888888889vw, 48px)
}

@media (max-width: 768px) {
    .tasks__title {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

@media (min-width: 1301px) {
    .tasks__scroll-icon {
        display: none !important
    }
}

.tasks__scroll-icon {
    display: flex;
    min-width: 40px;
    width: 40px;
    height: 40px
}

.tasks__text {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(26px, 22px + .5208333333vw, 32px);
    padding-top: 4rem;
    display: flex;
    gap: 1.75rem
}

.tasks__text:not(.is-animated) {
    opacity: 0;
    transform: translate(-5%)
}

.tasks__text.is-animated {
    transition: transform 1s .25s, opacity 1s .25s
}

.tasks__text {
    position: relative
}

@media (max-width: 992px) {
    .tasks__text {
        padding-top: 2.5rem
    }
}

@media (max-width: 768px) {
    .tasks__text {
        gap: 14px
    }
}

@media (max-width: 540px) {
    .tasks__text {
        padding-top: 2rem
    }
}

.tasks__text:before {
    content: "";
    width: 100%;
    height: 1px;
    background: #c4c4c6;
    position: absolute;
    top: 0;
    left: 0;
    will-change: transform;
    transform-origin: left
}

.tasks__text:not(.is-animated):before {
    transform: scaleX(0)
}

.tasks__text.is-animated:before {
    transition: 1s .5s
}

.tasks__text svg {
    display: flex;
    width: 40px;
    min-width: 40px;
    height: 40px
}

@media (max-width: 768px) {
    .tasks__text svg {
        width: 24px;
        min-width: 24px;
        height: 24px
    }
}

.tasks__text span {
    max-width: 850px
}

@media (max-width: 1300px) {
    .tasks__scroll-wrapper {
        overflow-x: auto;
        width: 100vw;
        left: 50%;
        transform: translate(-50%);
        position: relative
    }

    .tasks__scroll-wrapper > * {
        width: max-content;
        padding: 0 24px
    }

    .tasks__scroll-wrapper {
        scrollbar-width: none;
        -ms-overflow-style: none
    }
}

@media (max-width: 1300px)and (max-width: 540px) {
    .tasks__scroll-wrapper > * {
        padding: 0 16px
    }
}

@media (max-width: 1300px) {
    .tasks__scroll-wrapper::-webkit-scrollbar {
        width: 0;
        height: 0
    }
}

.tasks__list {
    display: grid;
    grid-template-columns:repeat(5, 1fr);
    gap: 1.25rem
}

.tasks__item:not(.is-animated) {
    opacity: 0;
    transform: translateY(25%)
}

.tasks__item.is-animated {
    transition: transform 1s, opacity 1s
}

@media (max-width: 1300px) {
    .tasks__item {
        width: 320px
    }
}

@media (max-width: 992px) {
    .tasks__item {
        width: 294px
    }
}

.tasks-card {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding-top: 2.5rem;
    position: relative
}

@media (max-width: 992px) {
    .tasks-card {
        padding-top: 1.5rem
    }
}

.tasks-card:before {
    content: "";
    width: 100%;
    height: 1px;
    background: #c4c4c6;
    position: absolute;
    top: 0;
    left: 0;
    will-change: transform;
    transform-origin: left
}

.tasks-card:not(.is-animated):before {
    transform: scaleX(0)
}

.tasks-card.is-animated:before {
    transition: .1s 1s linear
}

.tasks-card__title {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(20px, 16px + .5208333333vw, 26px);
    font-weight: 600;
    color: #3363ff
}

.tasks-card__text {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .tasks-card__text {
        letter-spacing: -.03em
    }
}

.team {
    display: flex;
    flex-direction: column;
    gap: 4rem;
    overflow: hidden
}

@media (max-width: 992px) {
    .team {
        gap: 2rem
    }
}

.team__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .team__container {
        padding: 0 16px
    }
}

.team__title {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(32px, 21.3333333333px + 1.3888888889vw, 48px)
}

@media (max-width: 768px) {
    .team__title {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

.team__title {
    text-align: center
}

.team__content {
    position: relative;
    height: 100%;
    padding: 100px 0;
    box-sizing: border-box;
    background: var(--bg-desktop) center 100%/cover fixed;
    aspect-ratio: 1920/974
}

@media (max-width: 992px) {
    .team__content {
        padding: 4rem 0;
        aspect-ratio: 768/487;
        background: var(--bg-tablet) center 100%/cover
    }
}

@media (max-width: 540px) {
    .team__content {
        padding: 1.5rem 0
    }
}

.team__content:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    box-sizing: border-box;
    z-index: 1
}

.team__content:not(.is-animated):before {
    border: 18vw solid #f5f5f7
}

.team__content.is-animated:before {
    border: 0 solid #f5f5f7;
    transition: 1s
}

.team__text {
    font-weight: 500;
    line-height: 105%;
    letter-spacing: -.03em;
    font-size: clamp(32px, 2.6666666667px + 3.8194444444vw, 76px)
}

@media (max-width: 768px) {
    .team__text {
        font-size: clamp(24px, 15.616px + 2.1333333333vw, 32px)
    }
}

.team__text {
    text-align: right;
    color: #fff
}

.vision__container {
    display: flex;
    flex-direction: column;
    gap: 4rem
}

@media (max-width: 992px) {
    .vision__container {
        gap: 2.5rem
    }
}

@media (max-width: 540px) {
    .vision__container {
        gap: 2rem
    }
}

.vision__title {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .vision__title {
        padding: 0 16px
    }
}

.vision__title {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(32px, 21.3333333333px + 1.3888888889vw, 48px)
}

@media (max-width: 768px) {
    .vision__title {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

@media (min-width: 541px) {
    .vision__title {
        text-align: center
    }
}

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

@media (max-width: 767px) {
    .vision__wrapper {
        flex-direction: column
    }
}

.vision__content:not(.is-animated) {
    opacity: 0
}

.vision__content.is-animated {
    transition: opacity 1s
}

.vision-content {
    background: linear-gradient(180deg, #0091f8, #7b72fa 29.81%, #c85cf7 50.06%, #f44443 79.77%) fixed;
    box-sizing: border-box
}

.vision-content--left {
    display: flex;
    flex-direction: column;
    gap: 4rem;
    flex: 0 1 860px;
    border-radius: 0 40px 40px 0;
    padding: 58px 48px 36px 62px;
    position: relative
}

.vision-content--left:before {
    content: "";
    position: absolute;
    opacity: .5
}

@media (min-width: 768px) {
    .vision-content--left:before {
        height: 100%;
        width: 0;
        border-left: 2px dashed #ffffff;
        top: 0;
        right: -1px
    }
}

@media (max-width: 767px) {
    .vision-content--left:before {
        height: 0;
        width: 100%;
        border-bottom: 2px dashed #ffffff;
        right: 0;
        bottom: -1px
    }
}

@media (max-width: 992px) {
    .vision-content--left {
        padding: 24px 16px 24px 24px;
        gap: 2rem
    }
}

@media (max-width: 767px) {
    .vision-content--left {
        border-radius: 0 0 32px 32px;
        padding: 32px 24px;
        flex: 1;
        gap: 12px;
        background: linear-gradient(180deg, #0091f8, #7b72fa 70%, #c85cf7)
    }
}

@media (max-width: 540px) {
    .vision-content--left {
        padding: 24px 16px
    }
}

.vision-content--right {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 1.25rem;
    flex: 0 1 640px;
    border-radius: 40px 0 0 40px;
    padding: 32px;
    box-sizing: border-box
}

@media (max-width: 992px) {
    .vision-content--right {
        padding: 24px 24px 24px 16px;
        gap: 0
    }
}

@media (max-width: 767px) {
    .vision-content--right {
        flex: 1;
        padding: 32px 24px;
        background: linear-gradient(180deg, #c85cf7 10%, #f44443 80%);
        border-radius: 32px 32px 0 0
    }
}

@media (max-width: 540px) {
    .vision-content--right {
        gap: .75rem;
        padding: 24px 16px
    }
}

.vision-content__description {
    color: #fff
}

.vision-content__title {
    font-weight: 500;
    line-height: 105%;
    letter-spacing: -.03em;
    font-size: clamp(32px, 2.6666666667px + 3.8194444444vw, 76px)
}

@media (max-width: 768px) {
    .vision-content__title {
        font-size: clamp(24px, 15.616px + 2.1333333333vw, 32px)
    }
}

.vision-content__title {
    margin-bottom: 1.25rem
}

@media (max-width: 767px) {
    .vision-content__title {
        margin-bottom: 1rem
    }
}

.vision-content__subtitle {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(26px, 22px + .5208333333vw, 32px);
    margin-bottom: 2rem
}

@media (max-width: 767px) {
    .vision-content__subtitle {
        margin-bottom: 1.5rem
    }
}

.vision-content__text {
    max-width: 560px;
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .vision-content__text {
        letter-spacing: -.03em
    }
}

.vision-content__footer {
    display: flex;
    justify-content: space-between
}

@media (max-width: 1300px) {
    .vision-content__footer {
        flex-direction: column;
        gap: 2rem
    }
}

.vision-content-addresses {
    display: flex;
    gap: 32px;
    color: #fff
}

@media (max-width: 992px) {
    .vision-content-addresses {
        gap: 24px
    }
}

.vision-content-addresses__item {
    font-weight: 450;
    font-size: 14px;
    line-height: 140%;
    flex: 0 0 160px;
    padding-top: .75rem;
    border-top: 1px solid
}

.vision-content-grid {
    display: grid;
    grid-template-columns:repeat(2, 1fr);
    gap: .75rem
}

@media (min-width: 993px) {
    .vision-content-grid {
        grid-template-rows:repeat(2, 166px)
    }
}

.vision-content-grid-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: #fff;
    border-radius: 32px;
    padding: 1.25rem;
    box-sizing: border-box
}

@media (max-width: 992px) {
    .vision-content-grid-card {
        min-width: 160px;
        padding: 1rem .75rem
    }
}

.vision-content-grid-card__header {
    display: flex;
    align-items: center;
    gap: 10px
}

@media (max-width: 992px) {
    .vision-content-grid-card__header {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px
    }
}

.vision-content-grid-card__icon {
    display: flex;
    min-width: 46px;
    width: 46px;
    height: 46px;
    object-fit: contain
}

@media (max-width: 1300px) {
    .vision-content-grid-card__icon {
        min-width: 40px;
        width: 40px;
        height: 40px
    }
}

@media (max-width: 992px) {
    .vision-content-grid-card__icon {
        min-width: 32px;
        width: 32px;
        height: 32px
    }
}

.vision-content-grid-card__title {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .vision-content-grid-card__title {
        letter-spacing: -.03em
    }
}

.vision-content-grid-card__title {
    font-weight: 600;
    white-space: nowrap
}

.vision-content-grid-card__text {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(14px, 12.6666666667px + .1736111111vw, 16px)
}

@media (max-width: 992px) {
    .vision-content-grid-card__text {
        letter-spacing: -.03em
    }
}

.vision-content__logo {
    display: flex;
    width: 170px;
    height: 50px;
    margin-left: auto
}

@media (max-width: 992px) {
    .vision-content__logo {
        width: 119px;
        height: 35px
    }
}

@media (max-width: 540px) {
    .vision-content__logo {
        width: 100px;
        height: 29px
    }
}

.teaser {
    margin-bottom: 0
}

.teaser__screen {
    position: relative;
    aspect-ratio: 16/9;
    width: 100%;
    background: #121214;
    display: flex;
    align-items: center;
    justify-content: center;
    object-fit: cover
}

.mission {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    position: relative;
    min-height: 660px;
    background: #121214;
    overflow: hidden;
    margin-bottom: 0
}

.mission:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: linear-gradient(180deg, #12121400 50%, #121214) fixed;
    z-index: 1
}

@media (max-width: 1300px) {
    .mission {
        min-height: auto;
        padding: 5rem 0
    }
}

@media (max-width: 768px) {
    .mission {
        padding: 3rem 0
    }
}

.mission__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .mission__container {
        padding: 0 16px
    }
}

.mission__container {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0
}

.mission__text {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(32px, 10.6666666667px + 2.7777777778vw, 64px)
}

@media (max-width: 768px) {
    .mission__text {
        font-size: clamp(24px, 15.616px + 2.1333333333vw, 32px)
    }
}

.mission__text {
    text-align: center;
    width: 100%;
    max-width: 72vw
}

@media (max-width: 1300px) {
    .mission__text {
        max-width: 620px
    }
}

@media (max-width: 540px) {
    .mission__text {
        max-width: 320px
    }
}

.mission__reveal {
    margin: 0 auto;
    text-shadow: 0 0 0 rgba(255, 255, 255, .25);
    position: relative
}

.mission__line {
    display: block;
    position: relative;
    white-space: nowrap;
    overflow: hidden;
    width: fit-content;
    max-width: 100%;
    padding: 0;
    color: inherit;
    margin: 0 auto
}

.mission__line:before {
    content: attr(data-text);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .1s ease-out;
    pointer-events: none;
    background: transparent
}

.mission__line--gradient {
    display: block;
    position: relative;
    white-space: nowrap;
    color: transparent;
    background: linear-gradient(to right, #fff, #fff) no-repeat;
    background-clip: text;
    -webkit-background-clip: text;
    background-size: 0% 100%;
    background-position: 0 0;
    transition: background-size .1s ease-out;
    width: fit-content;
    max-width: 100%
}

.mission__gradient {
    width: 100%;
    height: 100px;
    position: absolute;
    bottom: -70px;
    left: 0;
    z-index: 1;
    filter: blur(20px);
    background: linear-gradient(90deg, #ff8400, #ff573c 19.06%, #ff2b4e 40.44%, #d046ff 61.35%, #1d8bff 97.7%);
    border-radius: 50%;
    transform: translateY(0)
}

@media (max-width: 768px) {
    .mission__gradient {
        bottom: -90px
    }
}

.mission__gradient.is-animated {
    transition: 1s .25s
}

.leaders {
    background: #121214;
    padding: 5rem 0
}

@media (max-width: 768px) {
    .leaders {
        padding: 48px 0
    }
}

.leaders__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .leaders__container {
        padding: 0 16px
    }
}

.leaders__container {
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none
}

.leaders__list {
    display: grid;
    grid-template-columns:repeat(4, 1fr);
    gap: 2.5rem
}

@media (max-width: 1300px) {
    .leaders__list {
        gap: 0
    }
}

.leaders__item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2.5rem
}

@media (max-width: 1300px) {
    .leaders__item {
        width: max-content;
        max-width: 300px;
        padding-right: 1.5rem
    }
}

.leaders__photo {
    background: #fff;
    aspect-ratio: 1/1;
    width: 100%;
    overflow: hidden
}

.leaders__photo .leaders__img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.leaders__description {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch
}

.leaders__name {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(20px, 16px + .5208333333vw, 26px);
    color: #fff;
    margin-bottom: .75rem
}

.leaders__role {
    font-weight: 450;
    font-size: 14px;
    line-height: 140%;
    color: #fff;
    margin-bottom: 1.75rem
}

.leaders__text {
    font-weight: 450;
    line-height: 140%;
    letter-spacing: -.02em;
    font-size: clamp(16px, 14.6666666667px + .1736111111vw, 18px);
    color: #78787a;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    align-self: stretch;
    overflow: hidden;
    text-overflow: ellipsis
}

.approach__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .approach__container {
        padding: 0 16px
    }
}

.approach__container {
    display: flex;
    flex-direction: column;
    gap: 5rem
}

@media (max-width: 768px) {
    .approach__container {
        gap: 2rem
    }
}

.approach-problems {
    display: flex;
    flex-direction: column;
    gap: 5rem
}

@media (max-width: 768px) {
    .approach-problems {
        gap: 2rem
    }
}

.approach-problems__title-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem
}

.approach-problems__title {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(32px, 21.3333333333px + 1.3888888889vw, 48px)
}

@media (max-width: 768px) {
    .approach-problems__title {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

.approach-problems__title {
    text-align: center;
    max-width: 858px;
    background: linear-gradient(90deg, #0091f8, #7b72fa 50%, #c85cf7 75%, #f44443, #f45011);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.approach-problems__subtitle {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(20px, 16px + .5208333333vw, 26px);
    text-align: center;
    max-width: 707px
}

.approach-problems__scroll-wrapper {
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none
}

@media (max-width: 768px) {
    .approach-problems__scroll-wrapper {
        width: 100vw;
        left: 50%;
        transform: translate(-50%);
        position: relative
    }
}

.approach-problems__list {
    display: grid;
    grid-template-columns:repeat(4, 1fr);
    gap: 1rem
}

@media (max-width: 1300px) {
    .approach-problems__list {
        grid-template-columns:repeat(2, 1fr)
    }
}

@media (max-width: 768px) {
    .approach-problems__list {
        width: 100%;
        max-width: 1728px;
        padding: 0 24px;
        box-sizing: border-box;
        margin: 0 auto;
        width: max-content;
        grid-template-columns:repeat(4, 1fr)
    }
}

@media (max-width: 768px)and (max-width: 540px) {
    .approach-problems__list {
        padding: 0 16px
    }
}

.approach-problems__item {
    background: #fff;
    display: flex;
    padding: 1.5rem;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.5rem;
    border-radius: 32px
}

@media (max-width: 768px) {
    .approach-problems__item {
        width: max-content;
        max-width: 350px
    }
}

.approach-problems__item-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
    align-self: stretch
}

.approach-problems__item-title {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(20px, 16px + .5208333333vw, 26px);
    font-weight: 600;
    line-height: 130%;
    color: #3363ff
}

.approach-problems__item-text {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .approach-problems__item-text {
        letter-spacing: -.03em
    }
}

.approach-problems__item-reaction {
    display: flex;
    padding: 4px 6px 4px 11px;
    align-items: center;
    gap: 12px;
    border-radius: 110px;
    background: #3363ff
}

.approach-problems__item-reaction img {
    height: 34px
}

.approach-problems__item-reaction svg {
    width: 32px;
    height: 32px
}

.approach-principles {
    display: grid;
    grid-template-columns:minmax(auto, 420px) 3fr;
    gap: 11rem
}

@media (max-width: 1300px) {
    .approach-principles {
        grid-template-columns:1fr;
        gap: 2.5rem
    }
}

@media (max-width: 768px) {
    .approach-principles {
        display: flex;
        flex-direction: column;
        gap: 2rem
    }
}

.approach-principles__intro {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.5rem
}

@media (max-width: 1300px) {
    .approach-principles__intro {
        max-width: 420px
    }
}

.approach-principles__title {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(20px, 16px + .5208333333vw, 26px);
    font-weight: 600;
    line-height: 130%
}

.approach-principles__text {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .approach-principles__text {
        letter-spacing: -.03em
    }
}

@media (max-width: 768px) {
    .approach-principles__text {
        display: none
    }
}

.approach-principles__scroll-wrapper {
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none
}

@media (max-width: 768px) {
    .approach-principles__scroll-wrapper {
        width: 100vw;
        left: 50%;
        transform: translate(-50%);
        position: relative
    }
}

.approach-principles__list {
    display: grid;
    grid-template-columns:repeat(2, 1fr);
    align-items: flex-start;
    align-content: flex-start;
    gap: 4rem
}

@media (max-width: 1300px) {
    .approach-principles__list {
        gap: 1.25rem
    }
}

@media (max-width: 768px) {
    .approach-principles__list {
        width: 100%;
        max-width: 1728px;
        padding: 0 24px;
        box-sizing: border-box;
        margin: 0 auto;
        width: max-content;
        grid-template-columns:repeat(4, 1fr)
    }
}

@media (max-width: 768px)and (max-width: 540px) {
    .approach-principles__list {
        padding: 0 16px
    }
}

.approach-principles__item {
    position: relative;
    padding-top: 2.5rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.5rem;
    align-self: stretch
}

@media (max-width: 1300px) {
    .approach-principles__item {
        padding-top: 1rem;
        gap: 1rem
    }
}

@media (max-width: 768px) {
    .approach-principles__item {
        width: max-content;
        max-width: 245px
    }
}

.approach-principles__item:before {
    content: "";
    width: 100%;
    height: 1px;
    background: #121214;
    position: absolute;
    top: 0;
    left: 0;
    will-change: transform;
    transform-origin: left
}

.approach-principles__item-label {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .approach-principles__item-label {
        letter-spacing: -.03em
    }
}

.approach-principles__item-text {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(26px, 22px + .5208333333vw, 32px)
}

.invitation {
    display: flex;
    aspect-ratio: 1920/570;
    height: 100%;
    justify-content: center;
    align-items: center;
    align-self: stretch;
    background: linear-gradient(0deg, #00000047 0% 100%), url(../src/assets/images/about/invitation.jpg) 100%/cover fixed
}

@media (max-width: 1300px) {
    .invitation {
        aspect-ratio: 768/332;
        background: linear-gradient(0deg, #00000047 0% 100%), url(../src/assets/images/about/invitation.jpg) 50%/cover no-repeat
    }
}

@media (max-width: 768px) {
    .invitation {
        aspect-ratio: 393/258
    }
}

.invitation__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .invitation__container {
        padding: 0 16px
    }
}

.invitation__text {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(32px, 21.3333333333px + 1.3888888889vw, 48px)
}

@media (max-width: 768px) {
    .invitation__text {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

.invitation__text {
    text-align: center;
    color: #fff
}

.partners__content--light .partners-logos__item {
    position: relative;
    aspect-ratio: auto
}

.partners__content--light .partners-logos__item:before {
    content: "";
    display: block;
    padding-bottom: 38%
}

.partners__content--light .partners-logos__item:nth-child(7n+1) .partners-logos__img {
    left: 0;
    transform: translateY(-50%)
}

.partners__content--light .partners-logos__item:nth-child(7n) .partners-logos__img {
    left: auto;
    right: 0;
    transform: translateY(-50%)
}

@media (max-width: 1300px) {
    .partners__content--light .partners-logos__item:nth-child(7n+1) .partners-logos__img {
        left: 50%;
        transform: translate(-50%, -50%)
    }

    .partners__content--light .partners-logos__item:nth-child(7n) .partners-logos__img {
        left: 50%;
        right: auto;
        transform: translate(-50%, -50%)
    }

    .partners__content--light .partners-logos__item:nth-child(6n+1) .partners-logos__img {
        left: 0;
        transform: translateY(-50%)
    }

    .partners__content--light .partners-logos__item:nth-child(6n) .partners-logos__img {
        left: auto;
        right: 0;
        transform: translateY(-50%)
    }
}

@media (max-width: 992px) {
    .partners__content--light .partners-logos__item:nth-child(6n+1) .partners-logos__img {
        left: 50%;
        transform: translate(-50%, -50%)
    }

    .partners__content--light .partners-logos__item:nth-child(6n) .partners-logos__img {
        left: 50%;
        right: auto;
        transform: translate(-50%, -50%)
    }

    .partners__content--light .partners-logos__item:nth-child(5n+1) .partners-logos__img {
        left: 0;
        transform: translateY(-50%)
    }

    .partners__content--light .partners-logos__item:nth-child(5n) .partners-logos__img {
        left: auto;
        right: 0;
        transform: translateY(-50%)
    }
}

@media (max-width: 768px) {
    .partners__content--light .partners-logos__item:nth-child(5n+1) .partners-logos__img {
        left: 50%;
        transform: translate(-50%, -50%)
    }

    .partners__content--light .partners-logos__item:nth-child(5n) .partners-logos__img {
        left: 50%;
        right: auto;
        transform: translate(-50%, -50%)
    }

    .partners__content--light .partners-logos__item:nth-child(4n+1) .partners-logos__img {
        left: 0;
        transform: translateY(-50%)
    }

    .partners__content--light .partners-logos__item:nth-child(4n) .partners-logos__img {
        left: auto;
        right: 0;
        transform: translateY(-50%)
    }
}

@media (max-width: 540px) {
    .partners__content--light .partners-logos__item:nth-child(4n+1) .partners-logos__img {
        left: 50%;
        transform: translate(-50%, -50%)
    }

    .partners__content--light .partners-logos__item:nth-child(4n) .partners-logos__img {
        left: 50%;
        right: auto;
        transform: translate(-50%, -50%)
    }

    .partners__content--light .partners-logos__item:nth-child(3n+1) .partners-logos__img {
        left: 0;
        transform: translateY(-50%)
    }

    .partners__content--light .partners-logos__item:nth-child(3n) .partners-logos__img {
        left: auto;
        right: 0;
        transform: translateY(-50%)
    }
}

.partners__content--light .partners-logos__item .partners-logos__img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    max-width: 130px;
    max-height: 94px;
    object-fit: contain;
    transform: translate(-50%, -50%)
}

@media (max-width: 992px) {
    .partners__content--light .partners-logos__item .partners-logos__img {
        max-width: 110px;
        max-height: 70px
    }
}

@media (max-width: 768px) {
    .partners__content--light .partners-logos__item .partners-logos__img {
        max-width: 90px;
        max-height: 60px
    }
}

.showcase {
    background: #121214;
    padding: 85px 0 190px
}

@media (max-width: 1300px) {
    .showcase {
        padding: 3rem 0
    }
}

.showcase__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .showcase__container {
        padding: 0 16px
    }
}

.showcase__title {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(32px, 21.3333333333px + 1.3888888889vw, 48px)
}

@media (max-width: 768px) {
    .showcase__title {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

.showcase__title {
    color: #fff;
    max-width: 1118px;
    margin-bottom: 84px
}

@media (max-width: 1300px) {
    .showcase__title {
        margin-bottom: 2.5rem
    }
}

@media (max-width: 768px) {
    .showcase__title br {
        display: none
    }
}

.showcase__title-underline {
    position: relative;
    display: inline-block;
    cursor: default;
    font-weight: 500
}

.showcase__title-underline:after {
    content: "";
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 3px;
    background: #fff;
    transition: width .8s cubic-bezier(.25, .46, .45, .94)
}

.showcase__title-underline.animated:after {
    width: 100%
}

.showcase__content {
    display: grid;
    grid-template-columns:minmax(0, 1fr) 2fr;
    gap: 66px
}

@media (max-width: 1300px) {
    .showcase__content {
        grid-template-columns:1fr;
        gap: 2.5rem
    }
}

@media (max-width: 768px) {
    .showcase__content {
        gap: 2rem
    }
}

.showcase__image {
    aspect-ratio: 564/800
}

@media (max-width: 1300px) {
    .showcase__image {
        aspect-ratio: 768/467
    }
}

@media (max-width: 768px) {
    .showcase__image {
        margin: 0 -16px
    }
}

.showcase__img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.showcase__list {
    display: flex;
    flex-direction: column;
    gap: 8px
}

.showcase__item.is-unfolded .showcase__item-header {
    font-weight: 700
}

.showcase__item.is-unfolded .showcase__item-header svg {
    transform: translate(0) rotate(180deg)
}

.showcase__item.is-unfolded .showcase__item-header svg use:nth-child(1) {
    opacity: 1
}

.showcase__item.is-unfolded .showcase__item-header svg use:nth-child(2) {
    opacity: 0
}

.showcase__item.is-unfolded .showcase__item-header svg use:nth-child(3) {
    opacity: 1
}

.showcase__item.is-unfolded .showcase__item-header svg use:nth-child(4) {
    opacity: 1
}

@media (max-width: 768px) {
    .showcase__item.is-unfolded .showcase__item-header svg use:nth-child(1) {
        transform: translate(-10px) rotate(0)
    }

    .showcase__item.is-unfolded .showcase__item-header svg use:nth-child(4) {
        transform: translate(10px) rotate(0)
    }
}

.showcase__item.is-unfolded .showcase__item-links {
    border-bottom: 1px solid rgba(255, 255, 255, 0)
}

.showcase__item.is-unfolded .showcase-links__list {
    opacity: 1
}

.showcase__item.is-unfolded .showcase-links__gradient {
    transform: translateY(0)
}

.showcase__item-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(32px, 21.3333333333px + 1.3888888889vw, 48px)
}

@media (max-width: 768px) {
    .showcase__item-header {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

.showcase__item-header {
    color: #fff;
    padding: 1rem 0;
    transition: .5s
}

.showcase__item-header svg {
    display: flex;
    width: 60px;
    height: 24px;
    transform: translate(0) rotate(0);
    transition: .5s
}

.showcase__item-header svg:hover {
    transform: translate(0) rotate(0) scale(1.2)
}

.showcase__item-header svg:hover use {
    transition: .5s
}

.showcase__item-header svg:hover use:nth-child(1) {
    transform: translate(-10px) rotate(0)
}

.showcase__item-header svg:hover use:nth-child(4) {
    transform: translate(10px) rotate(0)
}

.showcase__item-header svg:hover use:nth-child(2) {
    opacity: 1
}

@media (max-width: 768px) {
    .showcase__item-header svg:hover {
        transform: translate(0) rotate(0) scale(1)
    }

    .showcase__item-header svg:hover use:nth-child(1) {
        transform: translate(0) rotate(0)
    }

    .showcase__item-header svg:hover use:nth-child(4) {
        transform: translate(0) rotate(0)
    }
}

.showcase__item-header svg use {
    transition: .5s
}

.showcase__item-header svg use:nth-child(2) {
    opacity: 1
}

.showcase__item-links {
    padding: 0;
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid rgba(255, 255, 255, .5);
    transition: .5s
}

.showcase-links__list {
    width: 50%;
    opacity: 0;
    padding: 0 0 2rem;
    margin-left: auto;
    margin-right: 0;
    transition: .5s
}

@media (max-width: 768px) {
    .showcase-links__list {
        width: 100%;
        margin-left: 0
    }
}

.showcase-links__item {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 16.6666666667px + .1736111111vw, 20px);
    color: #fff
}

.showcase-links__item a {
    display: flex;
    padding: 8px 0
}

.showcase-links__item {
    position: relative
}

.showcase-links__item:hover .showcase-links__item-icon {
    opacity: 1;
    transform: translate(-34px, -50%)
}

@media (max-width: 768px) {
    .showcase-links__item:hover .showcase-links__item-icon {
        opacity: 0
    }
}

@media (max-width: 768px) {
    .showcase-links__item:hover {
        text-decoration-line: underline;
        text-decoration-style: solid;
        text-decoration-skip-ink: auto;
        text-decoration-thickness: auto;
        text-underline-offset: 25%;
        text-underline-position: from-font
    }
}

.showcase-links__item-icon {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 50%;
    opacity: 0;
    transform: translate(-44px, -50%);
    transition: .5s;
    pointer-events: none
}

.showcase-links__gradient {
    width: 100%;
    height: 100px;
    position: absolute;
    bottom: -100px;
    left: 0;
    z-index: 0;
    filter: blur(20px);
    background: linear-gradient(90deg, #ff8400, #ff573c 19.06%, #ff2b4e 40.44%, #d046ff 61.35%, #1d8bff 97.7%);
    border-radius: 50%;
    transform: translateY(100px);
    transition: .5s
}

.case-detail__media {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 4rem
}

@media (max-width: 992px) {
    .case-detail__media {
        gap: 2rem
    }
}

.case-detail__video, .case-detail__img {
    aspect-ratio: 1920/800;
    object-fit: cover;
    width: 100%;
    height: 100%
}

@media (max-width: 992px) {
    .case-detail__video {
        aspect-ratio: 768/480
    }
}

@media (max-width: 768px) {
    .case-detail__video {
        aspect-ratio: 393/450
    }
}

.case-detail__button-wrapper {
    position: absolute;
    bottom: 30px;
    margin: 0 auto;
    left: 50%;
    transform: translate(-50%);
    display: none
}

@media (max-width: 768px) {
    .case-detail__button-wrapper {
        display: block
    }
}

.case-detail__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .case-detail__container {
        padding: 0 16px
    }
}

.case-detail__content {
    margin: 8rem 0
}

@media (max-width: 992px) {
    .case-detail__content {
        margin: 3rem 0
    }
}

.case-detail__column {
    display: flex;
    flex-direction: column;
    gap: 5rem
}

@media (max-width: 992px) {
    .case-detail__column {
        gap: 2rem
    }
}

.case-detail__row {
    display: grid;
    grid-template-columns:repeat(3, 1fr);
    gap: 1.5rem
}

@media (max-width: 992px) {
    .case-detail__row {
        grid-template-columns:1fr
    }
}

.case-detail__title {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(26px, 22px + .5208333333vw, 32px);
    grid-column: auto 1
}

@media (max-width: 992px) {
    .case-detail__title {
        grid-column: auto
    }
}

.case-detail__text {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .case-detail__text {
        letter-spacing: -.03em
    }
}

.case-detail__text {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
    grid-column: span 2
}

@media (max-width: 992px) {
    .case-detail__text {
        grid-column: auto
    }
}

.case-detail__text ul {
    display: flex;
    flex-direction: column;
    gap: 1.25rem
}

.case-detail__text ul li {
    position: relative;
    display: flex;
    flex-direction: row;
    gap: 16px
}

.case-detail__text ul li:before {
    flex: none;
    content: "";
    position: relative;
    display: block;
    width: 28px;
    height: 28px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 9'%3E%3Cpath d='M16.9127 0.175752C17.1333 -0.0586432 17.491 -0.0585245 17.7117 0.175752L21.3082 3.99658C21.5289 4.23104 21.5289 4.61107 21.3082 4.84552L17.7117 8.66635C17.491 8.90063 17.1333 8.90075 16.9127 8.66635C16.692 8.43196 16.6921 8.05188 16.9127 7.81741L19.5444 5.02141H0V3.8207H19.5444L16.9127 1.02469C16.6921 0.790226 16.692 0.410146 16.9127 0.175752Z' fill='currentColor'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center
}

.case-detail__image-wrapper {
    display: grid;
    grid-template-columns:repeat(3, 1fr);
    gap: 1.25rem
}

@media (max-width: 992px) {
    .case-detail__image-wrapper {
        grid-template-columns:repeat(2, 1fr)
    }
}

@media (max-width: 768px) {
    .case-detail__image-wrapper {
        grid-template-columns:repeat(1, 1fr)
    }
}

.case-detail__description {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .case-detail__description {
        letter-spacing: -.03em
    }
}

.case-detail__description {
    grid-column: span 1
}

.case-detail__img--right {
    grid-column: span 2;
    aspect-ratio: 1112/920;
    object-fit: cover;
    width: 100%;
    height: 100%
}

@media (max-width: 992px) {
    .case-detail__img--right {
        grid-column: span 1
    }
}

.case-detail__caption-container {
    display: grid;
    grid-template-columns:repeat(3, 1fr);
    gap: 1.25rem;
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .case-detail__caption-container {
        padding: 0 16px
    }
}

.case-detail__caption {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .case-detail__caption {
        letter-spacing: -.03em
    }
}

.case-detail__caption {
    grid-column: 2/span 2
}

@media (max-width: 992px) {
    .case-detail__caption {
        grid-column: span 3
    }
}

.case-detail__slider {
    margin: 5rem 0;
    overflow: hidden
}

@media (max-width: 992px) {
    .case-detail__slider {
        margin: 3rem 0
    }
}

.case-detail__slider-container {
    display: grid;
    grid-template-columns:repeat(3, 1fr);
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .case-detail__slider-container {
        padding: 0 16px
    }
}

@media (max-width: 992px) {
    .case-detail__slider-container {
        grid-template-columns:repeat(2, 1fr)
    }
}

@media (max-width: 992px) {
    .case-detail__slider-container {
        grid-template-columns:repeat(1, 1fr)
    }
}

.case-detail__slider-container .case-detail__title {
    margin-bottom: 5rem
}

@media (max-width: 992px) {
    .case-detail__slider-container .case-detail__title {
        margin-bottom: 2.5rem
    }
}

.case-detail__slider-container .case-detail__description {
    grid-column: 2/span 2
}

@media (max-width: 992px) {
    .case-detail__slider-container .case-detail__description {
        grid-column: span 3
    }
}

.case-slider {
    grid-column: span 3;
    margin-bottom: 4rem
}

@media (max-width: 992px) {
    .case-slider {
        margin-bottom: 1.5rem
    }
}

.case-slider__list {
    margin: 0 -10px
}

@media (max-width: 1300px) {
    .case-slider__list {
        margin: 0
    }
}

@media (max-width: 1300px) {
    .case-slider__list .slick-list {
        overflow: visible
    }
}

.case-slider__list .slick-list .slick-slide {
    margin: 0 10px
}

.case-slider__item img {
    aspect-ratio: 1/1;
    width: 100%;
    height: 100%;
    object-fit: cover
}

@media (max-width: 1300px) {
    .case-slider__item {
        width: 430px;
        height: 430px
    }
}

@media (max-width: 540px) {
    .case-slider__item {
        width: 330px;
        height: 330px
    }
}

.next-case-media {
    margin-bottom: 0
}

.cases-teaser {
    margin-bottom: 0;
    display: none
}

@media (max-width: 992px) {
    .cases-teaser {
        display: block
    }
}

.cases-teaser__wrapper {
    position: relative
}

.cases-teaser__video {
    position: relative;
    aspect-ratio: 768/480;
    width: 100%;
    background: #121214;
    display: flex;
    align-items: center;
    justify-content: center;
    object-fit: cover
}

@media (max-width: 768px) {
    .cases-teaser__video {
        aspect-ratio: 393/450
    }
}

.cases-teaser__button-wrapper {
    position: absolute;
    bottom: 30px;
    margin: 0 auto;
    left: 50%;
    transform: translate(-50%);
    display: none
}

@media (max-width: 768px) {
    .cases-teaser__button-wrapper {
        display: block
    }
}

.cases-list {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .cases-list {
        padding: 0 16px
    }
}

.cases-list {
    margin-top: 5rem
}

@media (max-width: 992px) {
    .cases-list {
        margin-top: 3.5rem
    }
}

@media (max-width: 768px) {
    .cases-list {
        margin-top: 3rem
    }
}

.cases-list__filter {
    margin: 0 -24px 2.5rem
}

@media (max-width: 540px) {
    .cases-list__filter {
        margin: 0 -16px 2.5rem
    }
}

.cases-list__filter-list {
    display: flex;
    flex-direction: row;
    gap: .75rem;
    overflow-x: auto;
    padding: 0 24px;
    scrollbar-width: none;
    -ms-overflow-style: none
}

.cases-list__filter-list::-webkit-scrollbar {
    display: none
}

@media (max-width: 992px) {
    .cases-list__filter-list {
        gap: 0
    }
}

@media (max-width: 540px) {
    .cases-list__filter-list {
        padding: 0 16px
    }
}

.cases-list__filter-button {
    display: flex;
    padding: .75rem 1.25rem;
    justify-content: space-between;
    align-items: center;
    border-radius: 100px;
    white-space: nowrap;
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .cases-list__filter-button {
        letter-spacing: -.03em
    }
}

.cases-list__filter-button.is-active {
    cursor: auto
}

.cases-list__filter-button.is-active, .cases-list__filter-button:hover {
    background: #121214;
    color: #fff
}

.cases-list__container {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
    margin-bottom: 8rem
}

@media (max-width: 992px) {
    .cases-list__container {
        margin-bottom: 3.5rem
    }
}

@media (max-width: 768px) {
    .cases-list__container {
        gap: 2rem;
        margin-bottom: 3rem
    }
}

.cases-list__list {
    display: grid;
    grid-template-columns:repeat(12, 1fr);
    gap: 4rem 1.25rem
}

@media (max-width: 992px) {
    .cases-list__list {
        gap: 3.5rem
    }
}

@media (max-width: 768px) {
    .cases-list__list {
        gap: 2.5rem
    }
}

.cases-list__item {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    grid-column: 4 span
}

.cases-list__item:nth-child(9n+1), .cases-list__item:nth-child(9n+6) {
    grid-column: span 8
}

.cases-list__item:nth-child(9n+2), .cases-list__item:nth-child(9n+5), .cases-list__item:nth-child(9n+7), .cases-list__item:nth-child(9n+8), .cases-list__item:nth-child(9n+9) {
    grid-column: span 4
}

.cases-list__item:nth-child(9n+3), .cases-list__item:nth-child(9n+4) {
    grid-column: span 6
}

.cases-list__item.cases-list__item--small {
    grid-column: span 3
}

.cases-list__item.cases-list__item--medium {
    grid-column: span 4
}

.cases-list__item.cases-list__item--large {
    grid-column: span 6
}

.cases-list__item.cases-list__item--extra {
    grid-column: span 8
}

.cases-list__item.cases-list__item--full {
    grid-column: span 12
}

@media (max-width: 992px) {
    .cases-list__item {
        grid-column: span 12
    }

    .cases-list__item:nth-child(9n+1), .cases-list__item:nth-child(9n+2), .cases-list__item:nth-child(9n+3), .cases-list__item:nth-child(9n+4), .cases-list__item:nth-child(9n+5), .cases-list__item:nth-child(9n+6), .cases-list__item:nth-child(9n+7), .cases-list__item:nth-child(9n+8), .cases-list__item:nth-child(9n+9), .cases-list__item.cases-list__item--small, .cases-list__item.cases-list__item--medium, .cases-list__item.cases-list__item--large, .cases-list__item.cases-list__item--extra, .cases-list__item.cases-list__item--full {
        grid-column: span 12
    }
}

.cases-list__link-wrapper {
    display: flex;
    flex-direction: column;
    gap: 1rem
}

.cases-list__link-wrapper:hover .cases-card-image:after {
    transform: translate(-50%, calc(-100px + 15%));
    filter: blur(30px);
    transition: 1s
}

.cases-list__link-wrapper:hover .cases-card__text {
    background-position: 0 center;
    transition: background-position 2s
}

.cases-list__picture {
    aspect-ratio: 549/278;
    overflow: hidden
}

@media (max-width: 768px) {
    .cases-list__picture {
        aspect-ratio: 361/450
    }
}

.cases-list__picture img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 1s
}

.cases-list__info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .5rem
}

@media (max-width: 992px) {
    .cases-list__info {
        gap: 1rem
    }
}

.cases-list__label {
    font-weight: 450;
    font-size: 14px;
    line-height: 140%;
    color: #78787a
}

@media (max-width: 992px) {
    .cases-list__label {
        display: none
    }
}

.cases-list__content {
    font-weight: 450;
    line-height: 140%;
    font-size: clamp(18px, 15.3333333333px + .3472222222vw, 22px)
}

@media (max-width: 992px) {
    .cases-list__content {
        letter-spacing: -.03em
    }
}

.cases-list__content {
    background: linear-gradient(90deg, #121214 30%, #254b68 45%, #c2e3e3 55%, #121214 70%);
    background-size: 300% 100%;
    background-position: 100% center;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent
}

.cases-list__content .cases-list__title {
    font-weight: 600
}

.cases-list__results {
    display: none;
    font-weight: 400;
    line-height: 140%;
    font-size: clamp(16px, 13.3333333333px + .3472222222vw, 20px);
    color: #3363ff;
    padding: 12px 18px;
    border-radius: 93px;
    background: var(--blue-transparent, rgba(166, 197, 255, .37))
}

@media (max-width: 992px) {
    .cases-list__results {
        display: block
    }
}

.cases-list__more-button {
    display: none;
    margin: 0 auto
}

@media (max-width: 992px) {
    .cases-list__more-button {
        display: block
    }
}

.generic-content {
    padding: 5rem 0
}

@media (max-width: 992px) {
    .generic-content {
        padding: 4rem 0
    }
}

@media (max-width: 540px) {
    .generic-content {
        padding: 3rem 0
    }
}

.generic-content__container {
    width: 100%;
    max-width: 1728px;
    padding: 0 24px;
    box-sizing: border-box;
    margin: 0 auto
}

@media (max-width: 540px) {
    .generic-content__container {
        padding: 0 16px
    }
}

.generic-content__body {
    font-weight: 450;
    line-height: 140%;
    letter-spacing: -.02em;
    font-size: clamp(16px, 14.6666666667px + .1736111111vw, 18px);
    display: flex;
    flex-direction: column;
    gap: 1em
}

.generic-content__body table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0
}

.generic-content__body th, .generic-content__body td {
    padding: 12px 16px;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid #e5e5e5
}

.generic-content__body th:first-child, .generic-content__body td:first-child {
    padding-left: 0
}

.generic-content__body th:last-child, .generic-content__body td:last-child {
    padding-right: 0
}

.generic-content__body th {
    font-weight: 600;
    white-space: nowrap
}

.generic-content__body thead th {
    border-bottom: 2px solid #c4c4c6
}

.generic-content__body tbody tr:last-child td {
    border-bottom: 0
}

.generic-content__body b, .generic-content__body strong {
    font-weight: 700
}

.generic-content__body i {
    font-style: italic
}

.generic-content__body a:not(:hover) {
    text-decoration: underline
}

.generic-content__body ul {
    display: flex;
    flex-direction: column;
    gap: .5em
}

.generic-content__body ul li {
    position: relative;
    padding-left: 1em;
    box-sizing: border-box
}

.generic-content__body ul li:before {
    content: "•";
    color: #c4c4c6;
    position: absolute;
    left: 0
}

.generic-content__body ol {
    display: flex;
    flex-direction: column;
    gap: .5em;
    counter-reset: ol-counter
}

.generic-content__body ol li {
    counter-increment: ol-counter;
    position: relative;
    padding-left: 1.3em;
    box-sizing: border-box
}

.generic-content__body ol li:before {
    content: counter(ol-counter) ".";
    position: absolute;
    left: 0
}

.generic-content__body h1 {
    font-weight: 450;
    line-height: 120%;
    letter-spacing: -.03em;
    font-size: clamp(32px, 16px + 2.0833333333vw, 56px)
}

@media (max-width: 768px) {
    .generic-content__body h1 {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

.generic-content__body h1 strong {
    font-weight: 600
}

.generic-content__body h2 {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(37px, 29.6666666667px + .9548611111vw, 48px)
}

.generic-content__body h3 {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(32px, 21.3333333333px + 1.3888888889vw, 48px)
}

@media (max-width: 768px) {
    .generic-content__body h3 {
        font-size: clamp(26px, 19.712px + 1.6vw, 32px)
    }
}

.generic-content__body h4 {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(26px, 22px + .5208333333vw, 32px)
}

.generic-content__body h5 {
    font-weight: 500;
    line-height: 120%;
    font-size: clamp(20px, 16px + .5208333333vw, 26px)
}

@keyframes skeleton-shimmer {
    0% {
        background-position: -100% 0
    }
    to {
        background-position: 100% 0
    }
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block
}

body {
    line-height: 1
}

ol, ul {
    list-style: none
}

blockquote, q {
    quotes: none
}

blockquote:before, blockquote:after, q:before, q:after {
    content: ""
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

a {
    text-decoration: none;
    color: inherit;
    outline: none
}

button {
    font: inherit;
    color: inherit;
    border: none;
    background: none;
    margin: 0;
    padding: 0;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    outline: none
}

hr {
    border: none;
    margin: 0
}

textarea, input {
    font: inherit;
    outline: none;
    border: none;
    border-radius: 0;
    padding: 0
}

b, strong {
    font-weight: 500
}

:root {
    --hv-header-top-offset: 200px;
    --hv-header-h-expanded: 100px;
    --hv-header-h-compact: 56px;
    --hv-header-tr-move: .22s;
    --hv-header-tr-height: .18s;
    --hv-header-ease: ease;
    --hv-header-fx-enter-dur: .22s;
    --hv-header-fx-leave-dur: .22s;
    --hv-header-fx-easing: ease
}

.hv-header {
    width: 100%;
    box-sizing: border-box;
    transition: height var(--hv-header-tr-height) var(--hv-header-ease), background-color .2s, border-color .2s
}

.hv-header.hv-header--no-anim {
    transition: none !important
}

.hv-header.is-fixed {
    position: fixed;
    top: var(--hv-header-top-offset, 0px);
    left: 0;
    z-index: 1000;
    transition: transform var(--hv-header-tr-move) var(--hv-header-ease), height var(--hv-header-tr-height) var(--hv-header-ease), background-color .2s, border-color .2s;
    will-change: transform;
    transform: translateY(0)
}

.hv-header.is-fixed.is-hidden {
    transform: translateY(-100%)
}

.hv-header.is-fixed:not(.is-hidden) {
    transform: translateY(0)
}

.hv-header__content {
    height: 100%;
    transform: translateY(0);
    box-sizing: border-box
}

.hv-header.hv-header--fx-slide.is-fixed .hv-header__content {
    will-change: transform;
    transition: transform var(--hv-header-fx-enter-dur) var(--hv-header-fx-easing)
}

.hv-header.hv-header--fx-slide.is-fixed.fx-enter .hv-header__content, .hv-header.hv-header--fx-slide.is-fixed.fx-leave .hv-header__content {
    transform: translateY(-100%)
}

.hv-header.hv-header--fx-slide.is-fixed.fx-leave .hv-header__content {
    transition-duration: var(--hv-header-fx-leave-dur)
}

.hv-header.hv-header--fx-fade.is-fixed .hv-header__content {
    will-change: opacity;
    transition: opacity var(--hv-header-fx-enter-dur) var(--hv-header-fx-easing);
    opacity: 1
}

.hv-header.hv-header--fx-fade.is-fixed.fx-enter .hv-header__content {
    opacity: 0
}

.hv-header.hv-header--fx-fade.is-fixed.fx-leave .hv-header__content {
    opacity: 0;
    transition-duration: var(--hv-header-fx-leave-dur)
}

.hv-header__content.rail--no-anim {
    transition: none !important
}

.hv-header-spacer {
    height: 0
}

html {
    scroll-behavior: smooth;
    scrollbar-gutter: stable;
    font-family: Inter, sans-serif;
    color: #121214;
    background: #f5f5f7
}

body {
    overscroll-behavior: none
}

body:not(.is-loaded) .generic-content {
    opacity: 0
}

body:not(.is-loaded) .header {
    transform: translateY(-100%)
}

body.is-loaded {
    opacity: 1 !important;
    transition: opacity .5s
}

body.is-loaded .header:not(.is-fixed) {
    transition: transform 1s .8s
}

body.is-loaded .generic-content {
    transition: 1s
}

section {
    margin-bottom: 8rem
}

@media (max-width: 992px) {
    section {
        margin-bottom: 3.5rem
    }
}

@media (max-width: 540px) {
    section {
        margin-bottom: 3rem
    }
}

.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999;
    background: #f0f
}

.modal-overlay:not(.is-active) {
    opacity: 0;
    pointer-events: none
}

.sa-line {
    display: flex;
    overflow: hidden
}

.sa-line.is-animated .sa-line__inner {
    transform: translateY(0)
}

.sa-line__inner {
    display: inline-block;
    transform: translateY(110%);
    transition: transform .5s
}