.company__item-content, .company__item-selected .dot, .hidden, .hide-content__popup-active .navigation__sectors, .hide-content__popup-active .renderer__domElement, .hide-content__popup-active.show-sectors-ui .navigation__sectors, .show-sectors-ui .hide-content__popup-active.show-sectors-ui .renderer__domElement, .intro, .landing__sector-link, .lightbox-overlay, .loader__complete .loader, .loader__ready .loader__percent, .navigation__companies, .navigation__sectors, .navigation__sectors-item:not(.icon__active):not(:hover) .dot, .popup {
    opacity: 0;
    visibility: hidden;
    transition: visibility 0s linear .6s, opacity .6s cubic-bezier(.5, 1, .89, 1)
}
.loader__in-progress .footer__zone-btn {
    opacity: 0;
}

.company__item-selected .company__item-content, .dot, .intro__active .intro, .intro__active .footer__zone-btn, .loader, .popup.popup__active, .renderer__domElement, .show-companies-ui .navigation__companies, .show-sectors-ui .navigation__sectors, .visible {
    opacity: 1;
    visibility: visible;
    transition: visibility 0s linear, opacity .6s cubic-bezier(.5, 1, .89, 1)
}

* {
    outline: 0 !important;
    /*-webkit-font-smoothing: antialiased;*/
    -moz-osx-font-smoothing: grayscale;
    box-sizing: border-box;
    scrollbar-width: thin;
    scrollbar-color: black
}

::-webkit-scrollbar {
    position: absolute;
    left: 0;
    width: 8px;
    height: 4px;
}
/* Track */
::-webkit-scrollbar-track {
    border-radius: 4px
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: gray
}

body {
    margin: 0;
    overflow: hidden;
    background-color: #0a192c
}

a {
    color: inherit;
    text-decoration: none
}

button, input, select, small, textarea {
    padding: 0;
    color: inherit;
    background-color: transparent;
    border-radius: 0;
    font: inherit;
    text-align: inherit;
    text-transform: inherit;
    letter-spacing: inherit;
    margin: 0;
    border: none
}

a, h1, h2, h3, h4, h5, h6, p, small {
    margin: 0;
    font: inherit
}

@font-face {
    font-family: Raleway;
    src: url("../assets/fonts/Raleway-Regular.woff2") format("woff2"), url("../assets/fonts/Raleway-Regular.woff") format("woff");
    font-style: normal;
    font-weight: 400;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased
}

@font-face {
    font-family: Raleway;
    src: url("../assets/fonts/Raleway-Thin.woff2") format("woff2"), url("../assets/fonts/Raleway-Thin.woff") format("woff");
    font-style: normal;
    font-weight: 300;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased
}

@font-face {
    font-family: AlumniSans;
    src: url("../assets/fonts/AlumniSans-Regular.woff2") format("woff2"), url("../assets/fonts/AlumniSans-Regular.woff") format("woff");
    font-style: normal;
    font-weight: 400;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased
}

body {
    font-family: Raleway, sans-serif;
}

.intro {
    z-index: 10;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none
}

@media only screen and (min-width: 1025px) {
    .intro {
        padding: 0 10vw;
        justify-content: flex-start
    }
}

.intro * {
    pointer-events: none
}

.intro * .intro__ui {
    pointer-events: all
}

.intro .intro__content {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 270px;
    text-align: center
}

@media only screen and (min-width: 768px) {
    .intro .intro__content {
        width: 520px
    }
}

@media only screen and (min-width: 1025px) {
    .intro .intro__content {
        width: 700px;
        text-align: left;
        align-items: flex-start
    }
}

.intro {
    color: #fff;
    --icon-color: #CBCBCB
}

.intro h3 {
    font-weight: 300;
    font-size: 24px;
    line-height: 28px;
    text-transform: uppercase;
    color: #cbcbcb;
    max-width: 600px;
    margin: 0 0 15px 0
}

@media only screen and (max-width: 400px) {
    .intro h3 {
        font-size: 12px
    }
}

.intro h2 {
    font-family: AlumniSans;
    font-style: normal;
    font-weight: 400;
    font-size: 160px;
    line-height: 138px;
    text-transform: uppercase;
    color: #fff;
}

.intro .intro__paragraph {
    width: 100%;
    font-size: 12px;
    /*font-family: Pro;*/
    font-weight: 400;
    letter-spacing: .02em;
    line-height: 1.8em;
    color: #cbcbcb;
    /*margin: 15px 0 0*/
}

@media only screen and (max-width: 400px) {
    .intro .intro__paragraph {
        font-size: 14px
    }
}

@media only screen and (min-width: 768px) {
    .intro .intro__paragraph {
        font-size: 12px
    }
}

@media only screen and (min-width: 1025px) {
    .intro .intro__paragraph {
        font-size: 14px
    }
}

.intro .intro__paragraph * {
    font-size: 12px;
    /*font-family: Pro;*/
    font-weight: 400;
    letter-spacing: .02em;
    line-height: 1.8em
}

@media only screen and (max-width: 400px) {
    .intro .intro__paragraph * {
        font-size: 14px
    }
}

@media only screen and (min-width: 768px) {
    .intro .intro__paragraph * {
        font-size: 12px
    }
}

@media only screen and (min-width: 1025px) {
    .intro .intro__paragraph * {
        font-size: 14px
    }
}

@media only screen and (min-width: 768px) {
    .intro .intro__paragraph {
        width: 360px
    }
}

@media only screen and (min-width: 1025px) {
    .intro .intro__paragraph {
        width: 435px
    }
}

.intro__ui {
    display: flex;
    align-items: center;
    flex-direction: column;
    margin: 15px 0 0
}

@media only screen and (min-width: 1025px) {
    .intro__ui {
        position: unset;
        bottom: unset;
        flex-direction: row
    }
}

.intro__ui p {
    margin-right: 24px;
    font-size: 24px;
    line-height: 100%;
    font-weight: 500;
    text-transform: uppercase;
    opacity: .9;
}


.intro__ui .icon circle {
    --icon-color: #4676f0
}

.intro__not-mobile {
    display: none
}

@media only screen and (min-width: 768px) {
    .intro__not-mobile {
        display: unset
    }
}

@media only screen and (min-width: 768px) {
    .intro__only-mobile {
        display: none
    }
}

.loader {
    z-index: 14;
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    /*background-color: #070709;*/
    width: 100%;
    height: 100%
}

.loader__item {
    pointer-events: none
}

.loader__item * {
    pointer-events: none
}

.loader__center {
    color: #cbcbcb;
    position: absolute;
    top: 50%;
    left: 50%;
    left: 50%;
    transform: translate3d(-50%, -50%, 0);
    text-transform: uppercase;
    transition: opacity .4s cubic-bezier(.5, 1, .89, 1)
}

.loader__center .loader__percent {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate3d(-50%, -50%, 0);
    font-size: 24px;
    line-height: 1em
}

.loader__center .loader__start {
    transition: none;
    font-size: 12px;
    line-height: 1em
}

@media only screen and (min-width: 768px) {
    .loader__center .loader__start {
        font-size: 24px
    }
}

.loader__svg {
    transform-origin: center;
    transition: transform .4s cubic-bezier(.5, 1, .89, 1);
    overflow: visible;
    width: 200px;
    height: 200px
}

@media only screen and (min-width: 768px) {
    .loader__svg {
        width: 260px;
        height: 260px
    }
}

.loader__svg circle {
    fill: none;
    stroke-width: 2;
    stroke: #7F86A1
}

.loader__svg .loader__svg-static {
    opacity: .4
}

.loader__svg .loader__svg-percent {
    opacity: .6
}

.loader__loaded {
    opacity: 0
}

.loader__loaded .loaded__circles {
    transition: transform .4s cubic-bezier(.5, 1, .89, 1);
    transform-origin: center
}

.loader__loaded .loaded__circle {
    transition: stroke .4s cubic-bezier(.5, 1, .89, 1);
    stroke: #565E7B;
    stroke-width: 1
}

.loader__loaded .loaded__circle:nth-child(1n) {
    opacity: 1
}

.loader__loaded .loaded__circle:nth-child(2n) {
    opacity: .8
}

.loader__loaded .loaded__circle:nth-child(3n) {
    opacity: .6
}

.loader__loaded .loaded__circle:nth-child(4n) {
    opacity: .4
}

.loader__loaded .loaded__circle:nth-child(5n) {
    opacity: .2
}

.loader__loaded .loaded__circle:nth-child(6n) {
    opacity: 0
}

.loader__loaded .loaded__dots {
    stroke: #FFF;
    stroke-dasharray: 0.8, 5;
    opacity: .2;
    fill: none
}

.loader__loaded .loaded__dots-g {
    -webkit-animation: dotsRotation 120s infinite linear;
    animation: dotsRotation 120s infinite linear;
    transform-origin: center
}

@-webkit-keyframes dotsRotation {
    0% {
        transform: rotate(0)
    }
    100% {
        transform: rotate(360deg)
    }
}

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

.loader__info {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    text-align: center;
    bottom: 55px;
    text-transform: uppercase;
    font-size: 10px;
    /*font-family: Next;*/
    font-weight: 500;
    letter-spacing: .3em;
    width: 100%;
    max-width: 75%;
    line-height: 1.7em
}

@media only screen and (max-width: 400px) {
    .loader__info {
        font-size: 12px
    }
}

@media only screen and (min-width: 1025px) {
    .loader__info {
        font-size: 11px
    }
}

@media only screen and (min-width: 2200px) {
    .loader__info {
        font-size: 16px
    }
}

@media only screen and (min-width: 768px) {
    .loader__info {
        max-width: 50%
    }
}

@media only screen and (min-width: 1025px) {
    .loader__info {
        max-width: 340px
    }
}

.loader__info p {
    color: #7f86a1
}

.loader__info .loader__audio-warning {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate3d(-50%, -50%, 0);
    width: 100%
}

.loader__info .loader__audio-disable {
    cursor: pointer
}

.loader__ready .loader__item {
    cursor: pointer;
    pointer-events: all
}

.loader__ready .loader__item.clicked {
    transition: transform .6s cubic-bezier(.905, .1, .735, .445);
    transform: scale3d(0, 0, 1)
}

@media (any-pointer: fine) {
    .loader__ready .loader__item:hover .loaded__circles {
        transform: scale3d(.93, .93, 1);
        transition: transform .8s cubic-bezier(.5, 1, .89, 1)
    }

    .loader__ready .loader__item:hover .loaded__circle {
        stroke: #28C9C7;
        transition: stroke .8s cubic-bezier(.5, 1, .89, 1)
    }
}

.loader__set-up .header__logo, .loader__set-up .loader__info, .loader__set-up .loader__item, .loader__set-up .footer__zone-btn {
    opacity: 0
}

.loader__set-up .header__logo {
    transform: translateY(-75%)
}

.loader__set-up .loader__item {
    transform: scale3d(.75, .75, .75);
    transform-origin: center
}

.loader__in-progress .header__logo, .loader__in-progress .loader__item {
    transition: all .8s cubic-bezier(.905, .1, .735, .445)
}

.loader__in-progress .header__logo {
    transform: translateY(0);
    opacity: 1
}

.loader__in-progress .loader__item {
    transform: scale3d(1, 1, 1);
    transform-origin: center;
    opacity: 1
}

.canvas__view {
    position: absolute;
    z-index: 9;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.header {
    z-index: 10;
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    transition: opacity .6s .5s;
    pointer-events: none;
}

@media only screen and (min-width: 768px) {
    .header {
        top: 0;
        width: 100%;
        height: 100%;
    }
}

.header__title {
    pointer-events: all;
    cursor: pointer;
}
.header__logo {
    position: absolute;
}
/*.header__logo:not(:last-child) {*/
/*    margin-right: 48px;*/
/*}*/
/*.header__logo:first-child h3 {*/
/*    margin-bottom: 4px;*/
/*    font-size: 20px;*/
/*    line-height: 23px;*/
/*    text-transform: uppercase;*/
/*    color: #FFFFFF;*/
/*    text-align: center;*/
/*}*/
.header__logo:first-child h2 {
    font-family: AlumniSans;
    font-size: 52px;
    line-height: 100%;
    text-transform: uppercase;
    color: #FFFFFF;
    text-align: center;
}
.header__logo:first-child {
    top: 62px;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity .8s;
}
.header__logo:nth-child(2) {
    top: 62px;
    right: 60px;
}
.header__logo:nth-child(3) {
    top: 40px;
    left: 60px;
}
.header__logo:last-child {
    left: 60px;
    bottom: 40px;
}
body:not(.loader__set-up):not(.loader__in-progress):not(.intro__active) .header__logo:first-child {
    opacity: 1;
}

.footer__wrapper {
    z-index: 10;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    pointer-events: none
}

.footer__wrapper * {
    pointer-events: none
}

.footer__wrapper .footer__zone {
    display: flex;
    padding: 30px;
}

.footer__wrapper .footer__zone-btn:not(:last-child) {
    margin-right: 32px;
}

@media only screen and (max-width: 400px) {
    .footer__wrapper .footer__zone {
        padding: 20px
    }
}

@media only screen and (min-width: 768px) {
    .footer__wrapper .footer__zone {
        padding: 40px 30px
    }
}

@media only screen and (min-width: 1025px) {
    .footer__wrapper .footer__zone {
        padding: 40px 60px
    }
}

.footer__wrapper a, .footer__wrapper p {
    color: #7f86a1;
    text-transform: uppercase;
    margin: 0 15px 0 0;
    font-size: 11px;
    /*font-family: Next;*/
    font-weight: 500;
    letter-spacing: .3em;
    line-height: 1em
}

.footer__wrapper a {
    transition-property: color;
    transition-timing-function: cubic-bezier(0.5, 1, 0.89, 1);
    transition-duration: .4s;
    pointer-events: all
}

@media (any-pointer: fine) {
    .footer__wrapper a:hover {
        color: #fff
    }
}

@media only screen and (max-width: 767px) {
    .footer__not-mobile {
        display: none
    }
}

.footer__audio-toggle {
    cursor: pointer;
    pointer-events: all;
    display: flex;
    position: relative
}

.footer__audio-toggle svg {
    height: 30px
}

@media only screen and (min-width: 1025px) {
    .footer__audio-toggle svg {
        height: 35px
    }
}

@media only screen and (max-width: 767px) {
    .footer__audio-toggle .audio__icon-text-wrapper {
        width: 120px;
        height: auto
    }
}

.footer__audio-toggle .audio__icon-text {
    fill: #FFF
}

@media only screen and (max-width: 400px) {
    .footer__audio-toggle .audio__icon-text {
        opacity: 0;
        visibility: hidden
    }
}

.footer__audio-toggle .audio__icon-border {
    display: none;
    fill: none;
    stroke: #7F86A1;
    stroke-width: 1
}

@media only screen and (min-width: 768px) {
    .footer__audio-toggle .audio__icon-border {
        display: unset
    }
}

.footer__audio-toggle * {
    transition: opacity .4s cubic-bezier(.5, 1, .89, 1), fill .4s cubic-bezier(.5, 1, .89, 1), stroke .4s cubic-bezier(.5, 1, .89, 1)
}

.footer__audio-toggle .audio__icon-circle, .footer__audio-toggle .audio__icon-circle-first {
    stroke: #46AFF0;
    stroke-width: 1;
    opacity: .4;
    fill: none
}

.footer__audio-toggle .audio__icon-center {
    fill: #565E7B;
    opacity: .4
}

.footer__audio-toggle .audio__icon-circle {
    opacity: 0;
    transform-origin: center;
    transform: scale3d(.1, .1, 1)
}

.footer__audio-toggle .audio__icon-fixed {
    opacity: .5
}

.footer__audio-toggle:hover:not(.active-audio) .audio__icon-center, .footer__audio-toggle:hover:not(.active-audio) .audio__icon-fixed {
    opacity: 1
}

.footer__audio-toggle.active-audio .audio__icon-circle-first {
    opacity: 0
}

.footer__audio-toggle.active-audio .audio__icon-center, .footer__audio-toggle.active-audio .audio__icon-fixed {
    opacity: 1
}

.footer__audio-toggle.active-audio .audio__icon-center {
    fill: #46AFF0
}

.footer__audio-toggle.active-audio .audio__icon-circle {
    -webkit-animation: audio-pulse 4s infinite linear;
    animation: audio-pulse 4s infinite linear
}

.footer__audio-toggle.active-audio .audio__icon-circle:nth-child(1n) {
    -webkit-animation-delay: 0s;
    animation-delay: 0s
}

.footer__audio-toggle.active-audio .audio__icon-circle:nth-child(2n) {
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

.footer__audio-toggle.active-audio .audio__icon-circle:nth-child(3n) {
    -webkit-animation-delay: 2s;
    animation-delay: 2s
}

.footer__audio-toggle.active-audio .audio__icon-circle:nth-child(4n) {
    -webkit-animation-delay: 3s;
    animation-delay: 3s
}

.footer__audio-toggle.active-audio .audio__icon-circle:nth-child(5n) {
    -webkit-animation-delay: 4s;
    animation-delay: 4s
}

.footer__audio-toggle.active-audio .audio__icon-circle:nth-child(6n) {
    -webkit-animation-delay: 5s;
    animation-delay: 5s
}

.footer__audio-toggle.active-audio .audio__icon-circle:nth-child(7n) {
    -webkit-animation-delay: 6s;
    animation-delay: 6s
}

.footer__audio-toggle.active-audio .audio__icon-circle:nth-child(8n) {
    -webkit-animation-delay: 7s;
    animation-delay: 7s
}

.footer__audio-toggle.active-audio .audio__icon-circle:nth-child(9n) {
    -webkit-animation-delay: 8s;
    animation-delay: 8s
}

.footer__audio-toggle.active-audio .audio__icon-circle:nth-child(10n) {
    -webkit-animation-delay: 9s;
    animation-delay: 9s
}

.footer__audio-toggle.active-audio .audio__icon-circle:nth-child(11n) {
    -webkit-animation-delay: 10s;
    animation-delay: 10s
}

.audio__circles {
    position: absolute;
    top: 50%;
    right: 5px;
    transform: translate(0, -50%);
    overflow: visible;
    height: 30px;
    width: 30px
}

@media only screen and (min-width: 1025px) {
    .audio__circles {
        height: 35px;
        width: 35px
    }
}

@-webkit-keyframes audio-pulse {
    0% {
        transform: scale3d(.1, .1, 1);
        opacity: 1
    }
    90% {
        transform: scale3d(1, 1, 1);
        opacity: .3
    }
    100% {
        transform: scale3d(1, 1, 1);
        opacity: 0
    }
}

@keyframes audio-pulse {
    0% {
        transform: scale3d(.1, .1, 1);
        opacity: 1
    }
    90% {
        transform: scale3d(1, 1, 1);
        opacity: .3
    }
    100% {
        transform: scale3d(1, 1, 1);
        opacity: 0
    }
}

.landing__sector-link {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    will-change: transform;
    pointer-events: all
}

.landing__sector-link_content {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    padding: 15px
}

.landing__sector-link_content h3 {
    margin-bottom: 5px;
    font-size: 11px;
    /*font-family: Next;*/
    font-weight: 500;
    letter-spacing: .3em;
    line-height: 1em
}

@media only screen and (max-width: 400px) {
    .landing__sector-link_content h3 {
        margin-bottom: 0
    }
}

.landing__sector-link_content h2 {
    margin-bottom: 16px;
    font-size: 20px;
    font-family: AlumniSans;
    line-height: 34px;
    transition: text-shadow .5s;
}

@media only screen and (min-width: 1025px) {
    .landing__sector-link_content h2 {
        font-size: 40px
    }
}

.landing__sector-link_content {
    width: auto;
    height: auto;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: calc(-1 * (35px * .5) - 15px);
    min-width: 200px
}

@media only screen and (max-width: 400px) {
    .landing__sector-link_content {
        min-width: 230px
    }
}

@media only screen and (min-width: 768px) {
    .landing__sector-link_content {
        bottom: calc(-1 * (40px * .5) - 15px);
        min-width: 250px
    }
}

@media only screen and (min-width: 1025px) {
    .landing__sector-link_content {
        bottom: calc(-1 * (50px * .5) - 15px);
        min-width: 280px
    }
}

.sector__main-content {
    margin-top: -2px;
    opacity: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    color: #fff;
}
.show-sectors-ui .sector__main-content {
    pointer-events: all !important;
}
.fly-to-sector .header, .show-sectors-ui .header, .fly-to-sector .footer__zone-btn, .show-sectors-ui .footer__zone-btn {
    opacity: 0;
    transition: opacity .6s 0s;
}

.sector__main-content h3 {
    font-family: AlumniSans;
    font-size: 56px;
    line-height: 100%;
    margin-bottom: 16px;
    text-transform: uppercase;
    text-align: center;
}

.swiper {
    max-width: 87%;
}

.sector__main-slide {
    padding-top: 72px;
}

.sector__main-slide:not(.swiper-slide-active) {
    opacity: 0;
}

.sector__main-slide__container, .swiper-slide__container {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    position: relative;
}

.sector__main-slide h2 {
    margin-top: 64px;
    font-size: 35px;
    line-height: 48px;
    max-width: 36%;
    white-space: pre-line;
}

.sector__main-slide h4 {
    margin: 40px auto 0;
    font-size: 35px;
    line-height: 48px;
    width: fit-content;
    width: -moz-fit-content;
    font-weight: 300;
}

.sector__main-img {
    margin-left: 224px;
    width: 300px;
    height: 610px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: transform .8s .2s;
    transform-origin: 100% 50%;
}
.sector__main-wrap {
    width: 300px;
    height: 610px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}
.sector__main-wrap:first-child {
    width: 270px;
    height: 550px;
    transform: translateX(30px);
}
.sector__main-wrap:nth-child(2) {
    z-index: 1;
}
.sector__main-wrap:last-child {
    width: 270px;
    height: 550px;
    transform: translateX(-30px);
}
.sector__main-mockup {
    width: 100%;
    max-height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    display: block;
}
.sector__main-screen {
    width: 91.5%;
    max-height: 100%;
    display: block;
    border-radius: 20px;
}

.sector__main-slide._desc .sector__main-img {
    /*margin-left: 20px;*/
    /*width: 890px;*/
    width: 1060px;
    margin: 0 auto;
    /*height: 500px;*/
}

.sector__main-slide._desc._neon .sector__main-img {
    width: 925px;
    border-radius: 50px;
    overflow: hidden;
}
.sector__main-slide._desc:not(._three) .sector__main-screen {
    width: 78%;
    margin-bottom: 24px;
}
.sector__main-slide._desc._neon .sector__main-screen {
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin-bottom: 0;
}
.sector__main-slide._three .sector__main-screen {
    width: 90.5%;
}

.sector__main-slide._desc._neon .sector__main-img.block {
    position: relative;
    background: linear-gradient(0deg, #000, #272727);
    overflow: visible;
    border-radius: 0;
}

.sector__main-img.block .sector__main-screen {
    border-radius: 0;
}

.block:before, .block:after {
    content: '';
    position: absolute;
    left: -2px;
    top: -2px;
    background: linear-gradient(45deg, #28C9C7, #7EC1FF, #45168A,#4981F2, #5200FF, #28C9C7,
    #7EC1FF, #45168A,#4981F2, #5200FF);
    background-size: 400%;
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    z-index: -1;
    animation: steam 40s linear infinite;
}

@keyframes steam {
    0% {
        background-position: 0 0;
    }
    50% {
        background-position: 400% 0;
    }
    100% {
        background-position: 0 0;
    }
}

.block:after {
    filter: blur(50px);
}

.sector__main-slide._desc h2 {
    max-width: 30%;
    position: absolute;
    top: 0;
    left: 160px;
    opacity: 0;
    transition: opacity .4s;
}

.sector__main-slide._desc.open h2 {
    max-width: 30%;
    opacity: 1;
    transition: opacity .6s .7s;
}

.sector__main-slide._desc.open .sector__main-img {
    transform: scale3d(.75,.75,.75) translateX(200px);
}

.swiper-button {
    width: 64px;
    height: 64px;
}

.swiper-button circle, .swiper-button rect {
    transition: stroke .4s;
}

.swiper-button:hover circle, .swiper-button:hover rect {
    stroke: #28C9C7;
}

.swiper-button:after {
    display: none;
}

.swiper-pagination {
    top: 0;
    bottom: auto !important;
}

.swiper-pagination-bullet {
    margin: 0 5px !important;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 1px solid #B3B3B3;
    position: relative;
    background: transparent !important;
    opacity: 1;
}

.swiper-pagination-bullet.swiper-pagination-bullet-active {
    border: 1px solid #28C9C7;
}
.swiper-pagination-bullet.swiper-pagination-bullet-active:after {
    background: #28C9C7;
    transform: scale(1.2);
}

.swiper-pagination-bullet:after {
    content: '';
    position: absolute;
    top: 6px;
    left: 6px;
    width: 6px;
    height: 6px;
    background: #B3B3B3;
    border-radius: 50%;
}

.sector__main-content.sector__main-content-reference {
    display: none
}

.sector__main-content .sector__logos-overview-opener {
    margin: 80px 0;
    text-transform: uppercase;
    border: 2px solid #565e7b;
    padding: 20px 30px;
    background-color: rgba(0, 0, 0, .8);
    border-radius: 50px;
    font-size: 16px;
    /*font-family: Next;*/
    font-weight: 500;
    letter-spacing: .3em;
    line-height: 1em;
    white-space: nowrap;
    pointer-events: all;
    cursor: pointer
}

@media only screen and (max-width: 400px) {
    .sector__main-content .sector__logos-overview-opener {
        font-size: 20px
    }
}

@media only screen and (min-width: 768px) {
    .sector__main-content .sector__logos-overview-opener {
        font-size: 14px
    }
}

@media only screen and (min-width: 1025px) {
    .sector__main-content .sector__logos-overview-opener {
        font-size: 11px
    }
}

.sector__main-content[reference-data-sector="game-learning"] h3 {
    font-size: 50px;
    letter-spacing: .02em;
    /*font-family: Neusa;*/
    line-height: 1em;
    margin-bottom: 0
}

@media only screen and (max-width: 400px) {
    .sector__main-content[reference-data-sector="game-learning"] h3 {
        font-size: 40px
    }
}

@media only screen and (min-width: 768px) {
    .sector__main-content[reference-data-sector="game-learning"] h3 {
        font-size: 56px
    }
}

.sector__main-content[reference-data-sector="game-learning"] h2 {
    font-size: 20px;
    /*font-family: Pro;*/
    font-weight: 400;
    letter-spacing: .02em;
    line-height: 1.8em;
    text-transform: unset;
    margin: 35px 0 50px;
    max-width: 100%
}

@media only screen and (max-width: 400px) {
    .sector__main-content[reference-data-sector="game-learning"] h2 {
        font-size: 20px
    }
}

@media only screen and (min-width: 768px) {
    .sector__main-content[reference-data-sector="game-learning"] h2 {
        font-size: 18px
    }
}

@media only screen and (min-width: 768px) {
    .sector__main-content[reference-data-sector="game-learning"] h2 {
        max-width: 630px
    }
}

.sector__main-content[reference-data-sector="game-learning"] .sector__main-content_links {
    display: flex;
    justify-content: center;
    align-items: center;
    text-transform: uppercase;
    width: 100%;
    max-width: 80vw;
    flex-wrap: wrap
}

@media only screen and (min-width: 768px) {
    .sector__main-content[reference-data-sector="game-learning"] .sector__main-content_links {
        flex-wrap: nowrap;
        justify-content: space-around;
        max-width: 470px
    }
}

.sector__main-content[reference-data-sector="game-learning"] .sector__main-content_links a, .sector__main-content[reference-data-sector="game-learning"] .sector__main-content_links button {
    font-size: 20px;
    /*font-family: Next;*/
    font-weight: 500;
    letter-spacing: .3em;
    line-height: 1em;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: 50%;
    padding: 15px 20px 50px 20px;
    pointer-events: all
}

@media only screen and (min-width: 768px) {
    .sector__main-content[reference-data-sector="game-learning"] .sector__main-content_links a, .sector__main-content[reference-data-sector="game-learning"] .sector__main-content_links button {
        font-size: 14px
    }
}

.sector__main-content[reference-data-sector="game-learning"] .sector__main-content_links a *, .sector__main-content[reference-data-sector="game-learning"] .sector__main-content_links button * {
    pointer-events: none
}

.sector__main-content[reference-data-sector="game-learning"] .sector__main-content_links .icon__round {
    margin: -.1em 0 0 10px
}

@media only screen and (max-width: 767px) {
    .sector__main-content[reference-data-sector="game-learning"] .sector__main-content_links button {
        order: 3
    }

    .sector__main-content[reference-data-sector="game-learning"] .sector__main-content_links a:nth-child(2) {
        order: 1
    }

    .sector__main-content[reference-data-sector="game-learning"] .sector__main-content_links a:nth-child(3) {
        order: 2;
        justify-content: flex-start
    }

    .sector__main-content[reference-data-sector="game-learning"] .sector__main-content_links a:nth-child(4) {
        order: 4;
        justify-content: flex-start
    }
}

:root {
    --icon-color: #7F86A1
}

.drag__icon {
    opacity: 0;
    pointer-events: none;
    width: auto;
    height: auto;
    pointer-events: none;
    z-index: 12;
    display: none
}

@media only screen and (min-width: 1025px) and (max-height: 850px) {
    .drag__icon {
        top: 20px
    }
}

@media only screen and (min-width: 1025px) {
    .drag__icon {
        display: inline
    }
}

.drag__icon * {
    pointer-events: none
}

.drag__icon p {
    color: #7f86a1;
    text-transform: uppercase;
    font-size: 11px;
    /*font-family: Next;*/
    font-weight: 500;
    letter-spacing: .3em;
    line-height: 1em
}

.drag__icon div {
    -webkit-animation: alpha infinite 3s;
    animation: alpha infinite 3s
}

@-webkit-keyframes alpha {
    0% {
        opacity: .8
    }
    50% {
        opacity: 1
    }
    100% {
        opacity: .8
    }
}

@keyframes alpha {
    0% {
        opacity: .8
    }
    50% {
        opacity: 1
    }
    100% {
        opacity: .8
    }
}

.icon__round {
    overflow: visible
}

.icon__round circle {
    stroke: var(--icon-color);
    fill: none;
    stroke-width: 1
}

.icon__round circle.icon__background-circle {
    fill: #0A192C
}

.icon__round :not(circle) {
    fill: var(--icon-color)
}

.icon__round * {
    transition-duration: .4s
}

.icon__round.icon__active * {
    transition-duration: .6s
}

@media (any-pointer: fine) {
    .icon__round:hover * {
        transition-duration: .6s
    }
}

.icon__round circle {
    transition-property: all;
    transition-timing-function: cubic-bezier(0.5, 1, 0.89, 1);
    transform-origin: center
}

.icon__round circle.icon__background-circle {
    opacity: .4;
    stroke: none !important
}

.icon__round circle.icon__default-circle {
    transform: scale3d(1, 1, 1);
    opacity: 1
}

.icon__round circle.icon__second-circle {
    transform: scale3d(.9, .9, 1);
    opacity: .5
}

.icon__round circle.icon__third-circle {
    transform: scale3d(.8, .8, 1);
    opacity: .3
}

.icon__round .icon__content {
    transition-property: filter, opacity;
    transition-timing-function: cubic-bezier(0.5, 1, 0.89, 1)
}

.icon__round .icon__content * {
    transition-property: fill;
    transition-timing-function: cubic-bezier(0.5, 1, 0.89, 1)
}

.icon__content-shine-permanent {
    filter: blur(.5px);
    opacity: .5
}

.icon__content-shine-permanent * {
    fill: white !important
}

.icon__hover-trigger {
    cursor: pointer
}

.icon__hover-trigger * {
    pointer-events: none !important
}

.navigation__sectors-item svg {
    transition: all .3s;
}

.icon__active svg {
    transform: scale3d(1.2, 1.2, 1)
}

/*.icon__active .icon__content {*/
/*    filter: blur(1px)*/
/*}*/

/*.icon__active .icon__content * {*/
/*    fill: var(--icon-color)*/
/*}*/

/*.icon__active .icon__content-shine {*/
/*    filter: blur(0px);*/
/*    opacity: .6*/
/*}*/

/*.icon__active .icon__content-shine * {*/
/*    fill: white*/
/*}*/

/*.icon__active circle {*/
/*    stroke: var(--icon-color)*/
/*}*/

/*.icon__active circle.icon__default-circle {*/
/*    transform: scale3d(1.2, 1.2, 1)*/
/*}*/

/*.icon__active circle.icon__second-circle {*/
/*    transform: scale3d(1.1, 1.1, 1)*/
/*}*/

/*.icon__active circle.icon__third-circle {*/
/*    transform: scale3d(1, 1, 1)*/
/*}*/

@media (any-pointer: fine) {
    .icon__hover-trigger:hover h2 {
        text-shadow: 0 0 4px #FFFFFF;
    }
    /*.icon__hover-trigger:hover .icon__content, .icon__round:hover .icon__content {*/
    /*    filter: blur(1px)*/
    /*}*/

    /*.icon__hover-trigger:hover .icon__content *, .icon__round:hover .icon__content * {*/
    /*    fill: var(--icon-color)*/
    /*}*/

    /*.icon__hover-trigger:hover .icon__content-shine, .icon__round:hover .icon__content-shine {*/
    /*    filter: blur(0px);*/
    /*    opacity: .6*/
    /*}*/

    /*.icon__hover-trigger:hover .icon__content-shine *, .icon__round:hover .icon__content-shine * {*/
    /*    fill: white*/
    /*}*/

    /*.icon__hover-trigger:hover circle, .icon__round:hover circle {*/
    /*    stroke: var(--icon-color)*/
    /*}*/

    /*.icon__hover-trigger:hover circle.icon__default-circle, .icon__round:hover circle.icon__default-circle {*/
    /*    transform: scale3d(1.2, 1.2, 1)*/
    /*}*/

    /*.icon__hover-trigger:hover circle.icon__second-circle, .icon__round:hover circle.icon__second-circle {*/
    /*    transform: scale3d(1.1, 1.1, 1)*/
    /*}*/

    /*.icon__hover-trigger:hover circle.icon__third-circle, .icon__round:hover circle.icon__third-circle {*/
    /*    transform: scale3d(1, 1, 1)*/
    /*}*/
}

.icon__size-small .icon__content g {
    -webkit-mask: unset !important;
    mask: unset !important
}

.icon__size-small .icon__content g path:nth(2) {
    display: none
}

.icon__size-normal {
    width: 35px;
    height: 35px
}

@media only screen and (min-width: 768px) {
    .icon__size-normal {
        width: 40px;
        height: 40px
    }
}

@media only screen and (min-width: 1025px) {
    .icon__size-normal {
        width: 50px;
        height: 50px
    }
}

@media only screen and (min-width: 2200px) {
    .icon__size-normal {
        width: 60px;
        height: 60px
    }
}

.icon__size-big {
    width: 40px;
    height: 40px
}

@media only screen and (min-width: 768px) {
    .icon__size-big {
        width: 40px;
        height: 40px
    }
}

@media only screen and (min-width: 1025px) {
    .icon__size-big {
        width: 50px;
        height: 50px
    }
}

@media only screen and (min-width: 2200px) {
    .icon__size-big {
        width: 60px;
        height: 60px
    }
}

.icon__size-small {
    width: 25px;
    height: 25px
}

@media only screen and (min-width: 768px) {
    .icon__size-small {
        width: 25px;
        height: 25px
    }
}

@media only screen and (min-width: 1025px) {
    .icon__size-small {
        width: 25px;
        height: 25px
    }
}

@media only screen and (min-width: 2200px) {
    .icon__size-small {
        width: 35px;
        height: 35px
    }
}

:root {
    --sector-disabled: #7F86A1
}

.navigation__sectors {
    z-index: 13;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    padding: 30px;
    pointer-events: none
}

@media only screen and (max-width: 400px) {
    .navigation__sectors {
        padding: 20px
    }
}

@media only screen and (min-width: 768px) {
    .navigation__sectors {
        padding: 40px 30px
    }
}

@media only screen and (min-width: 1025px) {
    .navigation__sectors {
        padding: 60px 70px
    }
}

.navigation__sectors-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    cursor: pointer;
    margin: 0 20px;
    pointer-events: all;
    position: relative
}

.navigation__sectors-item * {
    pointer-events: none
}

.navigation__sectors-item .icon {
    transform-origin: center;
    transition: transform .8s cubic-bezier(.5, 1, .89, 1);
    will-change: transform
}

.navigation__sectors-item svg {
    width: 35px
}

@media only screen and (min-width: 768px) {
    .navigation__sectors-item svg {
        width: 40px
    }
}

@media only screen and (min-width: 1025px) {
    .navigation__sectors-item svg {
        width: 50px
    }
}

.navigation__sectors-item:not(.icon__active):not(:hover) .dot {
    opacity: 0
}

/*.navigation__sectors-item:not(.icon__active):not(:hover) circle {*/
/*    stroke: var(--sector-disabled)*/
/*}*/

/*.navigation__sectors-item:not(.icon__active):not(:hover) :not(circle) {*/
/*    fill: var(--sector-disabled)*/
/*}*/
.navigation__sectors-back-to-landing.navigation__custom {
    top: 50%;
    transform: translateY(-50%);
}
.navigation__custom {
    opacity: 0;
    transition: opacity .6s 1.5s;
}
body:not(.loader__set-up):not(.loader__in-progress):not(.intro__active):not(.fly-to-sector):not(.show-sectors-ui) .navigation__custom {
    z-index: 12;
    opacity: 1;
    /*transition: opacity .6s 0s;*/
}

.navigation__sectors-back-to-landing {
    position: fixed;
    top: 0;
    left: 0;
    align-items: center;
    cursor: pointer;
    pointer-events: all;
    display: none;
}

@media only screen and (min-width: 1025px) {
    .navigation__sectors-back-to-landing {
        padding: 60px;
        display: flex
    }
}

.navigation__sectors-back-to-landing p, .navigation__sectors-back-to-landing .p {
    margin: 0 0 0 15px;
    text-transform: uppercase;
    color: #7f86a1;
    font-size: 24px;
    /*font-weight: 300;*/
    line-height: 97%;
}

.navigation__sectors-next, .navigation__sectors-prev, .navigation__sectors-view-all {
    flex-direction: column;
    color: #fff;
    text-align: center;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    pointer-events: all
}

.navigation__sectors-next p, .navigation__sectors-prev p, .navigation__sectors-view-all p {
    font-size: 11px;
    /*font-family: Next;*/
    font-weight: 500;
    letter-spacing: .3em;
    line-height: 1em;
    margin: 0 0 10px 0;
    text-transform: uppercase;
    transform: translateX(.1em)
}

@media only screen and (max-width: 767px) {
    .navigation__sectors-next p, .navigation__sectors-prev p, .navigation__sectors-view-all p {
        position: absolute;
        top: 0
    }
}

.navigation__not-device {
    display: none
}

@media only screen and (min-width: 1025px) {
    .navigation__not-device {
        display: flex
    }
}

.navigation__only-device {
    display: flex;
    margin: 0 5px
}

@media only screen and (min-width: 768px) {
    .navigation__only-device {
        margin: 0 10px
    }
}

@media only screen and (min-width: 1025px) {
    .navigation__only-device {
        display: none
    }
}

.navigation__sectors-item {
    transform-style: preserve-3d;
    perspective: 100px
}

.navigation__sectors-item .icon {
    will-change: transform
}

.navigation__sectors-item.icon__active .icon {
    transform: translateZ(0)
}

.navigation__sectors-item.sector__level-2 .icon {
    transform: translateZ(-10px)
}

.navigation__sectors-item.sector__level-3 .icon {
    transform: translateZ(-35px)
}

.navigation__companies {
    z-index: 13;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    padding: 30px;
    pointer-events: none
}

@media only screen and (max-width: 400px) {
    .navigation__companies {
        padding: 20px
    }
}

@media only screen and (min-width: 768px) {
    .navigation__companies {
        padding: 40px 30px;
        align-items: center
    }
}

@media only screen and (min-width: 1025px) {
    .navigation__companies {
        padding: 60px 70px
    }
}

.navigation__companies-item {
    cursor: pointer;
    pointer-events: all
}

.navigation__companies-item * {
    pointer-events: none
}

.navigation__companies-item svg {
    width: 35px
}

@media only screen and (min-width: 768px) {
    .navigation__companies-item svg {
        width: 40px
    }
}

@media only screen and (min-width: 1025px) {
    .navigation__companies-item svg {
        width: 50px
    }
}

.navigation__companies-back-to-sector {
    position: fixed;
    left: 0;
    top: 0;
    width: auto;
    height: auto;
    display: flex;
    padding: 30px;
    overflow: visible;
    display: flex;
    align-items: center;
    justify-content: flex-start
}

@media only screen and (max-width: 400px) {
    .navigation__companies-back-to-sector {
        padding: 20px
    }
}

@media only screen and (min-width: 768px) {
    .navigation__companies-back-to-sector {
        margin: 0 0 10px;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        top: unset;
        flex-direction: column;
        justify-content: center
    }
}

@media only screen and (min-width: 1025px) {
    .navigation__companies-back-to-sector {
        margin: 0 0 30px
    }
}

.navigation__companies-back-to-sector p {
    margin: 0 0 15px 0;
    text-transform: uppercase;
    color: #7f86a1;
    font-size: 11px;
    /*font-family: Next;*/
    font-weight: 500;
    letter-spacing: .3em;
    line-height: 1em;
    display: none
}

@media only screen and (min-width: 768px) {
    .navigation__companies-back-to-sector p {
        display: unset
    }
}

.navigation__companies-buttons {
    display: flex;
    align-items: center
}

@media only screen and (min-width: 768px) {
    .navigation__companies-buttons {
        justify-content: space-between;
        width: 100%
    }
}

@media only screen and (min-width: 1025px) {
    .navigation__companies-buttons {
        width: 800px
    }
}

.navigation__companies-buttons .navigation__companies-item {
    margin: 0 8px
}

@media only screen and (min-width: 768px) {
    .navigation__companies-buttons .navigation__companies-item {
        margin: 0
    }
}

.navigation__companies-buttons .navigation__companies-item.disabled {
    pointer-events: none;
    opacity: .33
}

.company__item-selected .navigation__companies.company__item-content .navigation__companies-back-to-sector, .intro__active .navigation__companies.intro .navigation__companies-back-to-sector, .navigation__companies.dot .navigation__companies-back-to-sector, .navigation__companies.loader .navigation__companies-back-to-sector, .navigation__companies.popup.popup__active .navigation__companies-back-to-sector, .navigation__companies.renderer__domElement .navigation__companies-back-to-sector, .navigation__companies.visible .navigation__companies-back-to-sector, .show-companies-ui .navigation__companies .navigation__companies-back-to-sector, .show-sectors-ui .navigation__companies.navigation__sectors .navigation__companies-back-to-sector {
    cursor: pointer;
    pointer-events: all
}

.popup.popup__active [data-popup-close], .popup.popup__active [data-popup-open] {
    pointer-events: all;
    cursor: pointer
}

.popup__legal {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column
}

.popup__legal h2 {
    text-transform: uppercase;
    font-size: 20px;
    letter-spacing: .02em;
    /*font-family: Neusa;*/
    line-height: 1em;
    margin: 0 0 30px 0
}

@media only screen and (min-width: 1025px) {
    .popup__legal h2 {
        font-size: 26px
    }
}

@media only screen and (min-width: 2200px) {
    .popup__legal h2 {
        font-size: 28px
    }
}

@media only screen and (min-width: 768px) {
    .popup__legal h2 {
        margin: 0 0 50px 0
    }
}

@media only screen and (min-width: 1025px) {
    .popup__legal h2 {
        margin: 0 0 70px 0
    }
}

.popup__legal .popup__content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: flex-start;
    text-align: center
}

@media only screen and (min-width: 1025px) {
    .popup__legal .popup__content {
        flex-direction: row;
        justify-content: space-between;
        flex-wrap: wrap
    }
}

.popup__legal-item {
    padding: 5px 0
}

@media only screen and (min-width: 768px) {
    .popup__legal-item {
        padding: 10px 0
    }
}

@media only screen and (min-width: 1025px) {
    .popup__legal-item {
        width: 33.33%;
        padding: 20px 0
    }
}

.popup__legal-item h3 {
    text-transform: uppercase;
    font-size: 10px;
    /*font-family: Next;*/
    font-weight: 500;
    letter-spacing: .3em;
    line-height: 1em
}

@media only screen and (min-width: 768px) {
    .popup__legal-item h3 {
        font-size: 10px
    }
}

@media only screen and (min-width: 1025px) {
    .popup__legal-item h3 {
        font-size: 12px
    }
}

.popup__legal-item p {
    margin-top: 5px;
    font-size: 12px;
    /*font-family: Pro;*/
    font-weight: 400;
    letter-spacing: .02em;
    line-height: 1.8em
}

@media only screen and (max-width: 400px) {
    .popup__legal-item p {
        font-size: 12px
    }
}

@media only screen and (min-width: 768px) {
    .popup__legal-item p {
        font-size: 12px
    }
}

@media only screen and (min-width: 1025px) {
    .popup__legal-item p {
        font-size: 14px
    }
}

@media only screen and (min-width: 768px) {
    .popup__legal-item p {
        margin-top: 10px
    }
}

@media only screen and (min-width: 1025px) {
    .popup__legal-item p {
        margin-top: 1em
    }
}

.popup__ui {
    position: fixed;
    left: 0;
    top: 0;
    width: auto;
    height: auto;
    display: flex;
    padding: 30px;
    cursor: pointer;
    overflow: visible;
    display: flex;
    align-items: center;
    justify-content: flex-start
}

@media only screen and (max-width: 400px) {
    .popup__ui {
        padding: 20px
    }
}

@media only screen and (min-width: 768px) {
    .popup__ui {
        margin: 0 0 10px;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        top: unset;
        flex-direction: column;
        justify-content: center
    }
}

@media only screen and (min-width: 1025px) {
    .popup__ui {
        margin: 0 0 30px
    }
}

.popup__ui p {
    margin: 0 0 15px 0;
    text-transform: uppercase;
    color: #7f86a1;
    font-size: 11px;
    /*font-family: Next;*/
    font-weight: 500;
    letter-spacing: .3em;
    line-height: 1em;
    display: none
}

@media only screen and (min-width: 768px) {
    .popup__ui p {
        display: unset
    }
}

.company__item {
    width: auto;
    height: auto;
    pointer-events: all;
    cursor: pointer;
    opacity: 0;
    transition: opacity .8s cubic-bezier(.5, 1, .89, 1);
    padding: 40px 0 80px
}

.logos-overview-active .company__item {
    transition: none
}

.company__item.company__item-visible {
    opacity: 1
}

@media (any-pointer: fine) {
    .company__item.company__item-visible:hover {
        opacity: 1 !important
    }
}

.company__item canvas, .company__item img {
    width: auto;
    height: 70px;
    pointer-events: none
}

@media only screen and (max-width: 400px) {
    .company__item canvas, .company__item img {
        height: 90px
    }
}

@media only screen and (min-width: 768px) {
    .company__item canvas, .company__item img {
        height: 50px
    }
}

@media only screen and (min-width: 1025px) {
    .company__item canvas, .company__item img {
        height: 60px
    }
}

.company__item .dot {
    width: 10px;
    height: 10px;
    transform: translateY(-60px)
}

.company__item-content {
    position: absolute;
    bottom: 80px;
    left: 50%;
    width: 120vw;
    height: auto;
    transform: translate3d(-50%, 100%, 0);
    text-align: center;
    opacity: 0;
    visibility: hidden
}

@media only screen and (max-width: 400px) {
    .company__item-content {
        width: 120vw
    }
}

@media only screen and (min-width: 768px) {
    .company__item-content {
        width: 400px
    }
}

@media only screen and (min-width: 1025px) {
    .company__item-content {
        width: 500px
    }
}

.company__item-content p {
    font-size: 20px;
    /*font-family: Pro;*/
    font-weight: 400;
    letter-spacing: .02em;
    line-height: 1.8em;
    color: #cbcbcb;
    margin: 30px 0
}

@media only screen and (max-width: 400px) {
    .company__item-content p {
        font-size: 30px
    }
}

@media only screen and (min-width: 1025px) {
    .company__item-content p {
        font-size: 18px
    }
}

@media only screen and (max-width: 400px) {
    .company__item-content p {
        margin: 20px 0
    }
}

.company__item-content a {
    font-size: 18px;
    /*font-family: Next;*/
    font-weight: 500;
    letter-spacing: .3em;
    line-height: 1em;
    color: #fff;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 20px 20px;
    white-space: nowrap
}

@media only screen and (min-width: 768px) {
    .company__item-content a {
        font-size: 18px
    }
}

@media only screen and (min-width: 1025px) {
    .company__item-content a {
        font-size: 14px
    }
}

.company__item-content a svg {
    margin: 0 0 0 10px
}

.company__item-content .company__item-links {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap
}

.company__item-selected {
    cursor: default
}

.company__item-selected .dot {
    opacity: 0
}

.company__item-selected .company__item-content {
    opacity: 1;
    visibility: visible
}

.company__items-overview {
    position: absolute;
    overflow-y: auto;
    padding: 4rem 20px;
    display: flex;
    opacity: 0;
    visibility: hidden;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    transition: visibility 0s linear .6s, opacity .6s cubic-bezier(.5, 1, .89, 1);
    z-index: 9;
    width: 80vw;
    margin: 0 auto;
    left: 10vw;
    top: 10vh;
    height: 80vh;
    background: rgba(0, 0, 0, .95);
    border: 1px solid rgba(109, 171, 209, .2);
    border-radius: 20px;
    scrollbar-width: thin;
    scrollbar-color: rgba(109, 171, 209, 0.2) transparent
}

@media only screen and (min-width: 1025px) {
    .company__items-overview {
        height: 75vh
    }
}

.company__items-overview.active {
    opacity: 1;
    visibility: visible;
    pointer-events: all;
    transition: visibility 0s linear, opacity .6s cubic-bezier(.5, 1, .89, 1)
}

.company__items-overview button {
    margin: 30px 0;
    display: block;
    pointer-events: all;
    width: 100%;
    text-align: center;
    cursor: pointer;
    transition: opacity .8s cubic-bezier(.5, 1, .89, 1);
    opacity: .7
}

.company__items-overview button:hover {
    opacity: 1
}

@media only screen and (min-width: 768px) {
    .company__items-overview button {
        width: 50%
    }
}

@media only screen and (min-width: 1025px) {
    .company__items-overview button {
        width: 25%
    }
}

.company__items-overview img {
    width: auto;
    height: 50px
}

.company__items-overview:before {
    content: "";
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, #000 0, rgba(0, 0, 0, 0) 50%);
    pointer-events: none
}

.company__items-overview::-webkit-scrollbar {
    width: 8px
}

.company__items-overview::-webkit-scrollbar-track {
    background: 0 0
}

.company__items-overview::-webkit-scrollbar-thumb {
    background-color: rgba(109, 171, 209, .2);
    border-radius: 20px;
    border: 3px solid transparent
}

.logos-overview-active .navigation__companies-item {
    opacity: 0;
    visibility: hidden
}

.logos-overview-active .company__item:not(.company__item-selected) {
    opacity: 0 !important;
    pointer-events: none !important
}

.logos-overview-active .company__item:not(.company__item-selected) .dot {
    opacity: 0
}

.logos-overview-active .company__item:not(.company__item-selected):hover {
    opacity: 0 !important
}

.logo-active .navigation__companies-item {
    opacity: 1;
    visibility: visible
}

.logo-active .company__item {
    opacity: 0
}

[data-animation=text] {
    overflow: hidden
}

[data-animation=text] .animation__text-word {
    overflow: hidden
}

[data-animation=text] .animation__text-char {
    will-change: transform
}

[data-animation=arrow-icon] circle {
    --icon-color: #565E7B
}

[data-animation=arrow-icon] .icon__round .icon__content {
    filter: none
}

* {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

#site-wrapper {
    z-index: 12;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
    transition: opacity .6s;
}

.renderer__domElement {
    z-index: 14;
    position: absolute;
    top: 0;
    left: 0
}

.lightbox-overlay {
    z-index: 12;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .95)
}

.dot {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate3d(-50%, 20px, 0);
    background-color: var(--dot);
    border-radius: 10px;
    width: 6px;
    height: 6px;
    filter: blur(1.2px);
    opacity: 1
}

.footer__zone-btn {
    opacity: 1;
    cursor: pointer;
    pointer-events: auto;
    transition: opacity .5s;
}



/* Модалка Архитектура экосистемы */

.popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 15;
    color: #fff;
    transition: opacity .6s, background .6s;
    background: rgba(0, 0, 0, .5);
    visibility: visible;
    opacity: 0;
    pointer-events: none;
    overflow-y: auto;
}
.popup .navigation__sectors-back-to-landing {
    pointer-events: none !important;
}
.popup._visible {
    opacity: 1;
    pointer-events: auto;
}
.popup._visible .navigation__sectors-back-to-landing {
    pointer-events: auto !important;
}

.animate-1, .animate-2, .animate-3, .animate-4, .animate-5 {
    opacity: 0;
    transition: none;
    transition-timing-function: ease;
}
.animate-2, .animate-4 {
    overflow: hidden;
    max-height: 0;
}

.ecosystem._visible .animate-1 {
    opacity: 1;
    transition: opacity 1s .5s;
}
.ecosystem._visible .animate-2 {
    max-height: 100px;
    opacity: 1;
    transition: max-height 1.2s 1.3s, opacity .7s 1.3s;
}
.ecosystem._visible .animate-3 {
    opacity: 1;
    transition: opacity 1s 2.3s;
}
.ecosystem._visible .animate-4 {
    max-height: 600px;
    opacity: 1;
    transition: max-height 1.2s 3.1s, opacity .7s 3.1s;
}
.ecosystem._visible .animate-5 {
    opacity: 1;
    transition: opacity 1s 4.1s;
}

.popup__content {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.popup__title {
    font-family: AlumniSans;
    margin-top: 0;
    font-weight: 400;
    font-size: 98px;
    line-height: 118px;
    text-align: center;
    text-transform: uppercase;
}

.popup__subtitle {
    font-weight: 400;
    font-size: 28px;
    line-height: 33px;
    text-transform: uppercase;
    text-align: center;
}

.popup__wrapper {
    padding: 0 100px;
    display: flex;
    width: 100%;
    flex-wrap: wrap;
}

.popup__wrap {
    padding: 20px 16px;
    background: rgba(31, 30, 30, 0.3);
    border: 2px solid #28C9C7;
    border-radius: 20px;
    position: relative;
}

.popup__block {
    width: calc((100% - 20px * 3) / 4);
    margin-right: 20px;
}

.popup__block:nth-child(4) {
    margin-right: 0;
}

.popup__block h4 {
    margin-bottom: 20px;
}

.popup__block .popup__elem {
    display: flex;
    align-items: center;
    font-weight: 400;
    font-size: 20px;
}

.popup__block .popup__elem:not(:nth-child(5)) {
    margin-bottom: 10px;
}

.popup__line-wrap {
    position: absolute;
    top: 100%;
    left: 50%;
    transform-origin: 50% 0;
    padding: 10px;
    margin: -10px;
}

.popup__line-wrap._bottom:nth-child(3) {
    margin-top: 0;
    left: 13.8%;
    transform: rotate(-81.8deg);
}
.popup__line-wrap._bottom:nth-child(4) {
    margin-top: -2px;
    left: 31.6%;
    transform: rotate(-74.5deg);
}
.popup__line-wrap._bottom:nth-child(5) {
    margin-top: -6px;
    left: 43%;
    transform: rotate(-53deg);
}
.popup__line-wrap._bottom:nth-child(6) {
    left: 50%;
}
.popup__line-wrap._bottom:nth-child(7) {
    margin-top: -6px;
    left: 57%;
    transform: rotate(53deg);
}
.popup__line-wrap._bottom:nth-child(8) {
    margin-top: -2px;
    left: 68.4%;
    transform: rotate(74.5deg);
}
.popup__line-wrap._bottom:nth-child(9) {
    margin-top: 0;
    left: 86.2%;
    transform: rotate(81.8deg);
}

.popup__line {
    position: relative;
    height: 55px;
    width: 2px;
    box-shadow: 0 0 8px #48FFE9;
    background: #28C9C7;
}

.popup__line-wrap._bottom:nth-child(3) .popup__line,
.popup__line-wrap._bottom:nth-child(9) .popup__line {
    height: 27vw;
}
.popup__line-wrap._bottom:nth-child(4) .popup__line,
.popup__line-wrap._bottom:nth-child(8) .popup__line {
    height: 14vw;
}
.popup__line-wrap._bottom:nth-child(5) .popup__line,
.popup__line-wrap._bottom:nth-child(7) .popup__line {
    height: 6vw;
}
.popup__line-wrap._bottom:nth-child(6) .popup__line {
    height: 72px;
}

.popup__line-wrap._bottom .popup__line:after {
    display: none;
}

.popup__line::before,
.popup__line::after {
    content: '';
    position: absolute;
}

.popup__line::after {
    left: -4px;
    bottom: -3px;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 10px solid #28C9C7;
}

.popup__line::before {
    left: -3px;
    top: -3px;
    width: 8px;
    height: 8px;
    background: #28C9C7;
    border-radius: 50%;
    box-shadow: 0 0 8px #48FFE9;
}

.popup__img {
    width: 32px;
    height: 32px;
    margin-right: 12px;
    flex-shrink: 0;
}

.popup__block-bottom {
    width: 100%;
    max-width: 84.1866%;
    margin: 38px auto 0;
    padding: 32px 32px 15px 32px;
    position: relative;
    display: flex;
    flex-wrap: wrap;
}

.popup__block-bottom h4 {
    text-align: center;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    height: 253px;
}

.popup__block-bottom-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 40px;
    flex-wrap: wrap;
    padding-right: 78px;
}

.popup__block-bottom .popup__block-row {
    display: flex;
    justify-content: space-between;
}

.popup__block-bottom-wrap .popup__elem {
    width: calc((100% - 20px * 4) / 5);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: 400;
    font-size: 20px;
    line-height: 24px;
    padding: 12px 26px;
    margin-right: 20px;
    margin-bottom: 20px;
    height: 120px;
    box-shadow: 0 0 8px #48FFE9;
}

.popup__block-bottom-wrap .popup__elem:nth-child(5),
.popup__block-bottom-wrap .popup__elem:nth-child(9) {
    margin-right: 0;
}

.popup__block-bottom .subtitle {
    width: 100%;
    margin-top: -14px;
}

.popup__bottom {
    margin: 78px auto 0;
    padding: 20px 26px;
    box-shadow: 0 0 8px #48FFE9;
}

.popup__bottom:before {
    content: '';
    position: absolute;
    top: -32px;
    left: calc(50% - 24px);
    width: 48px;
    height: 48px;
    background: #28C9C7;
    box-shadow: 0 0 20px #48FFE9;
    border-radius: 50%;
}

.modal-overlay .intro, .modal-overlay .header, .modal-overlay #site-wrapper, .modal-overlay .footer__zone-btn {
    opacity: 0;
    transition: opacity .6s 0s
}

.modal-overlay .navigation__sectors-back-to-landing {
    opacity: 0 !important;
    transition: opacity 0.1s 0s
}

.popup .navigation__popup {
    top: 0;
    transform: translateY(0);
    opacity: 1 !important;
}

.show-sectors-ui .no-opacity {
    opacity: 1 !important;
}


/* Модалка О проекте */

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

.about__head {
    padding: 25px 0;
    position: fixed;
    top: 0;
    left: 0;
    width: calc(100% - 8px);
    z-index: 1;
}

.about__head._scroll {
    background: rgba(24, 24, 24, 0.01);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

.about__head._scroll .popup__title {
    transform: scale(.62);
}

.about__head .popup__title {
    margin-bottom: 0;
    transition: transform .3s;
}

.about__wrap {
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
    padding: 245px 60px 80px;
}

.about__row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    position: relative;
}

.about__row:not(:last-child) {
    margin-bottom: 320px;
}

.about__left {
    width: 19.1113%;
    position: sticky;
    top: 245px;
    transition: opacity .3s;
}

.about__left._bottom {
    opacity: .2;
}

.about__left svg {
    min-width: 100px;
    height: 100px;
    display: block;
    margin-right: 16px;
}

.about__status {
    font-size: 64px;
    line-height: 77px;
    text-transform: uppercase;
    text-align: center;
    width: 100%;
    top: 24px;
    font-family: AlumniSans;
    display: flex;
    align-items: center;
}

.about__year {
    width: 100%;
    position: relative;
    text-align: start;
    font-family: 'Raleway';
    text-transform: lowercase;
}

.about__right {
    width: 69.667%;
}

.about__top {
    margin-bottom: 40px;
}

.about__wrap p {
    font-weight: 300;
    font-size: 35px;
    line-height: 48px;
}

.about__product:not(:last-child) {
    margin-bottom: 80px;
}

.about__subtitle {
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    cursor: pointer;
    width: fit-content;
    width: -moz-fit-content;
}

.about__subtitle:hover h2 {
    filter: drop-shadow(0px 0px 16px #FFFFFF);
}

.about__subtitle:hover svg {
    filter: drop-shadow(0px 0px 20px #48FFE9)
}

.about__subtitle svg {
    margin-right: 16px;
    flex-shrink: 0;
    display: block;
    transition: filter .3s;
}

.about__subtitle h2 {
    font-size: 48px;
    line-height: 100%;
    text-transform: uppercase;
    font-family: AlumniSans;
    transition: filter .3s;
}

.about__line {
    margin: 104px 0;
    position: relative;
    height: 1px;
    width: 100%;
    background: #28C9C7;
}

.about__line::before, .about__line::after {
    content: '';
    position: absolute;
    top: -3px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #28C9C7;
}

.about__line::before {
    left: 0;
}

.about__line::after {
    right: 0;
}

.about__second p {
    margin-bottom: 16px;
}

.about__second p:first-child {
    margin-bottom: 40px;
}

.about__video.sector__main-slide._desc {
    padding: 0;
    opacity: 1;
    width: fit-content;
    width: -moz-fit-content;
}

.about__video.sector__main-slide._desc .swiper-slide__container {
    justify-content: flex-start;
}

.about__video.sector__main-slide._desc .sector__main-img {
    margin: 0;
}

.about__video.sector__main-slide._desc h4 {
    margin-top: 16px;
}

.about__video.sector__main-slide._desc iframe {
    margin-bottom: 38px;
    z-index: 1;
}
