@charset "UTF-8";

@font-face {
   font-family: "CraftworkGrotesk";
   src: url(/local/templates/oktta_new/assets/fonts/CraftworkGrotesk-Regular.woff);
   font-weight: 400;
   font-style: normal;
}

@font-face {
   font-family: "CraftworkGrotesk";
   src: url(/local/templates/oktta_new/assets/fonts/CraftworkGrotesk-Medium.woff);
   font-weight: 500;
   font-style: normal;
}

@font-face {
   font-family: "CraftworkGrotesk";
   src: url(/local/templates/oktta_new/assets/fonts/CraftworkGrotesk-SemiBold.woff);
   font-weight: 600;
   font-style: normal;
}

@font-face {
   font-family: "CraftworkGrotesk";
   src: url(/local/templates/oktta_new/assets/fonts/CraftworkGrotesk-Bold.woff);
   font-weight: 800;
   font-style: normal;
}

@font-face {
   font-family: "CraftworkGrotesk";
   src: url(/local/templates/oktta_new/assets/fonts/CraftworkGrotesk-Heavy.woff);
   font-weight: 900;
   font-style: normal;
}
@font-face {
   font-family: "TT Norms Pro";
   src: url("/local/templates/oktta_new/assets/fonts/TTNormsPro-Rg.woff")
         format("woff"),
      url("/local/templates/oktta_new/assets/fonts/TTNormsPro-Rg.ttf")
         format("truetype"),
      url("/local/templates/oktta_new/assets/fonts/TTNormsPro-Rg.svg#TTNormsPro-Rg")
         format("svg");
   font-weight: normal;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: "TT Norms Pro";
   src: url("/local/templates/oktta_new/assets/fonts/TTNormsPro-Md.woff")
         format("woff"),
      url("/local/templates/oktta_new/assets/fonts/TTNormsPro-Md.ttf")
         format("truetype"),
      url("/local/templates/oktta_new/assets/fonts/TTNormsPro-Md.svg#TTNormsPro-Md")
         format("svg");
   font-weight: 500;
   font-style: normal;
   font-display: swap;
}
* {
   padding: 0;
   margin: 0;
   border: 0;
}

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

:focus,
:active {
   outline: none;
}

a:focus,
a:active {
   outline: none;
}

nav,
footer,
header,
aside {
   display: block;
}

html,
body {
   height: 100%;
   width: 100%;
   font-size: 100%;
   line-height: 1;
   font-size: 14px;
   -ms-text-size-adjust: 100%;
   -moz-text-size-adjust: 100%;
   -webkit-text-size-adjust: 100%;
}

input,
button,
textarea {
   font-family: inherit;
   border-radius: 0;
}

button {
   background-color: transparent;
}

textarea {
   resize: none;
}

input::-ms-clear {
   display: none;
}

button {
   cursor: pointer;
}

button::-moz-focus-inner {
   padding: 0;
   border: 0;
}

a,
a:visited {
   text-decoration: none;
}

a:hover {
   text-decoration: none;
}

p {
   margin: 0;
}

ul li {
   list-style: none;
}

img {
   vertical-align: top;
}

h1,
h2,
h3,
h4,
h5,
h6 {
   font-size: inherit;
   font-weight: 400;
}

/*--------------------*/

html {
   scroll-behavior: smooth;
   /*overflow-x: hidden;*/
}

body.lock {
   overflow: hidden;
   touch-action: none;
   -ms-touch-action: none;
   -webkit-overflow-scrolling: touch;
}

input[type="number"] {
   -moz-appearance: textfield;
}

/* Chrome, Safari, Edge, Opera */

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
   -webkit-appearance: none;
   margin: 0;
}

svg path {
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
}
body {
   color: #1a1d23;
   font-family: "CraftworkGrotesk", sans-serif;
   overflow-x: hidden;
   scroll-behavior: smooth;
}

/*.container, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl {*/
/*    max-width: 100%;*/
/*    margin: 0;*/
/*    padding: 0;*/
/*    !*overflow-x: hidden;*!*/
/*}*/

.none {
   visibility: hidden;
   display: none;
}

.pc {
   visibility: visible;
   display: block !important;
}

.pc-f {
   visibility: visible;
   display: flex !important;
}

.mobile {
   visibility: hidden;
   display: none !important;
}

.mobile-f {
   visibility: hidden;
   display: none !important;
}

@media (max-width: 568px) {
   .pc {
      visibility: hidden;
      display: none !important;
   }
   .pc-f {
      visibility: hidden;
      display: none !important;
   }

   .mobile {
      visibility: visible;
      display: block !important;
   }

   .mobile-f {
      visibility: visible;
      display: flex !important;
   }
}

a {
   text-decoration: none;
   color: #1a1d23;
   transition: 0.3s ease;
}

a:hover {
   /*color: #27EDA1;*/
   color: #a8fd32;
}

input::-webkit-contacts-auto-fill-button {
   visibility: hidden;
   position: absolute;
   right: 0;
   opacity: 0;
}

/*.header {*/
/*    padding: 94px 60px 30px 60px;*/
/*    position: fixed;*/
/*    width: 100%;*/
/*    z-index: 99;*/
/*    top: 0px;*/
/*    transition: .5s ease;*/
/*}*/

/*.header.disabled {*/
/*    top: 0;*/
/*    padding: 30px 60px;*/
/*}*/

/*.header.header-out {*/
/*    transform: translateY(-100%);*/
/*    top: 0;*/
/*}*/

/*@media (max-width: 568px) {*/
/*    .header {*/
/*        padding-left: 16px;*/
/*        padding-right: 16px;*/
/*    }*/
/*    .header.disabled {*/
/*        top: 0;*/
/*        padding-left: 16px;*/
/*        padding-right: 16px;*/
/*    }*/
/*}*/

/*.header-logo {*/
/*}*/

/*.header-menu {*/
/*    align-items: center;*/
/*}*/

/*.header-menu > div {*/
/*    transition: .3s ease;*/
/*}*/

/*.header-menu > div a {*/
/*    color: #1A1D23;*/
/*}*/

/*.header-menu a {*/
/*    font-size: 16px;*/
/*    margin-left: 40px;*/
/*    transition: .3s ease;*/

/*}*/

/*.header-menu a:hover {*/
/*    !*border-bottom: 1px solid;*!*/
/*}*/

/*.header-menu a:last-child {*/
/*    !*color: #27EDA1;*!*/
/*}*/

.mobile-menu-btn {
   width: 31px;
   height: 12px;
}

.mobile-menu-btn span {
   width: 100%;
   height: 3px;
   background: #1c222d;
   display: block;
}

.mobile-menu-close {
   width: 31px;
   height: 31px;
   position: relative;
}

.mobile-menu-close span {
   width: 100%;
   height: 3px;
   background: #ffffff;
   display: block;
   position: absolute;
   top: 15px;
}

.mobile-menu-close span:first-child {
   transform: rotate(45deg);
}

.mobile-menu-close span:last-child {
   transform: rotate(-45deg);
}

.mobile-menu {
   background: #1a1d23;
   width: 100vw;
   height: 100vh;
   position: fixed;
   z-index: 999;
   padding: 16px;
   /*right: -100vw;*/
   top: -100vh;
   transition: 1s ease;
}

.mobile-menu.active {
   top: 0;
}

.mobile-menu a {
   color: #ffffff;
}

.mobile-menu a:hover {
   color: #a8fd32;
}

.mobile-menu ul {
   list-style: none;
   padding-left: 0;
}

.mobile-menu .menu {
   margin-top: 50px;
}

.mobile-menu .menu li {
   font-size: 22px;
   margin-bottom: 22px;
}

.mobile-menu > div li {
   font-size: 16px;
   margin-bottom: 20px;
}

.footer {
   background: #171717;
   /* padding: 70px 60px 40px; */
   padding-top: 80px;
   padding-bottom: 36px;
   padding-left: 0;
   padding-right: 0;
   color: #ffffff;
}

body:has(.project-detail) .footer {
   display: none;
}

body:has(.about-page) .footer {
   margin-top: 0;
}

@media (max-width: 568px) {
   .footer {
      padding: 50px 16px 30px;
      margin-top: 100px;
   }

   .footer .row > div {
      display: flex;
   }
}

.footer .telegram {
   position: fixed;
   bottom: 20px;
   right: 20px;
   width: 72px;
   min-width: 72px;
   height: 72px;
   min-height: 72px;
   background: #a8fd32;
   border-radius: 50%;
   z-index: 900;
   transform: scale(1);
   transition: 0.3s ease;
}

@media (max-width: 568px) {
   .footer .telegram {
      width: 55px;
      min-width: 55px;
      height: 50px;
      min-height: 55px;
   }
   .footer .telegram svg {
      width: 50%;
   }
}

.footer .telegram:hover {
   transform: scale(1.05);
   box-shadow: 0 5px 20px rgb(168 253 50 / 20%);
}

.footer .telegram a {
   width: 100%;
   height: 100%;
   border-radius: 50%;
   display: flex;
   justify-content: center;
   align-items: center;
}

.footer h4 {
   font-size: 18px;
   margin-bottom: 40px;
}

@media (max-width: 568px) {
   .footer h4 {
      width: 40%;
   }
}

.footer ul {
   list-style: none;
   padding: 0;
}

.footer li {
   font-size: 18px;
   margin-bottom: 20px;
}

.footer a {
   text-decoration: none;
   color: #ffffff;
   position: relative;
}

.footer a:hover {
   color: #a8fd32;
}

.footer a.new:before {
   content: "NEW";
   font-weight: 500;
   font-size: 8px;
   background: #ffffff;
   color: #1a1d23;
   border-radius: 5px;
   width: 28px;
   height: 14px;
   display: flex;
   justify-content: center;
   align-items: center;
   position: absolute;
   right: -35px;
   top: 0px;
}

.footer .circle {
   border: 1px solid #ffffff;
   border-radius: 50%;
   width: 200px;
   height: 200px;
   transition: 0.3s ease;
   /*position: relative;*/
}

.footer .circle:hover {
   border: 100px solid #a8fd32;
   /*transform: scale(1.1);*/
}

.footer .circle a {
   width: 100%;
   height: 100%;
   border-radius: 50%;
   min-width: 200px;
   min-height: 200px;

   /*position: absolute;*/
}

.footer .circle:hover a {
   color: #1a1d23;
   /*color: #ffffff;*/
}

.footer .footer-1 {
   margin-bottom: 35px;
}

.footer .footer-1 h5 {
   font-size: 45px;
   max-width: 400px;
}

.footer .footer-1 div {
   max-width: 350px;
   text-align: right;
}

.footer .footer-1 div a {
   font-size: 45px;
}

.footer .footer-1 div a:first-child {
   margin-bottom: 27px;
}

.footer-link-1 {
   margin-bottom: 35px;
}

.footer-link-1 a {
   font-size: 18px;
   margin-right: 25px;
   margin-bottom: 0;
}

.footer-link-2 p {
   font-size: 14px;
   margin-right: 25px;
   margin-bottom: 0;
}

.footer-link-2 a {
   font-size: 14px;
   margin-right: 25px;
   margin-bottom: 0;
}
.footer > div:nth-child(2) > div:nth-child(4) .col2 {
   /*columns: 2;*/
   /*column-gap: 30px;*/
}

@media (max-width: 568px) {
   .footer .row {
      row-gap: 20px;
   }

   .footer .col2 {
      columns: 2;
      column-gap: 30px;
   }
}

.footer-brief a {
   font-size: 26px;
   color: #27eda1;
}

.footer-brief a svg {
   margin-left: 15px;
}

.footer .copyright {
   margin-top: 45px;
}

.footer .copyright.mobile {
   margin-top: 25px;
}

.footer .copyright p {
   color: #ffffff;
   font-size: 14px;
   margin-bottom: 0;
}

.footer .copyright a {
   /*color: #FFFFFF;*/
   font-size: 14px;
   margin-left: 30px;
}

@media (max-width: 568px) {
   .footer .copyright a {
      margin-left: 0;
      margin-right: 20px;
   }
}

.content {
   padding-right: 50px;
   padding-left: 50px;
   /*margin-top: 164px;*/
   margin-top: 114px;
   /*overflow-y: auto;*/
   -webkit-overflow-scrolling: touch;
   transition: 0.3s;
}

@media (min-width: 568px) and (max-width: 1024px) {
   .content {
      padding-right: 30px;
      padding-left: 30px;

   }
}

@media (max-width: 568px) {
   .content {
      padding-right: 16px;
      padding-left: 16px;
      /*overflow-x: hidden;*/
      margin-top: 60px;
   }
}

.content.disabled {
   margin-top: 100px;
}

.content h1 {
   font-size: 70px;
   line-height: 85px;
   font-weight: normal;
   margin-bottom: 135px;
   /*margin-top: 170px;*/
   text-transform: lowercase;
}

@media (max-width: 568px) {
   .content .content-home h1 {
      font-size: 36px;
      line-height: 42px;
      margin-top: 00px;
      margin-bottom: 65px;
   }

   .content h1 {
      font-size: 40px;
      line-height: 45px;
      margin-top: 100px;
      margin-bottom: 65px;
   }
}

.content h2 {
   font-size: 70px;
   line-height: 85px;
   font-weight: normal;
   margin-bottom: 135px;
}

.content h2.h2-icon img {
   height: 25%;
}

@media (max-width: 568px) {
   .content h2 {
      font-size: 28px;
      line-height: 33px;
      margin-bottom: 65px;
   }
}

.content h3 {
   font-size: 28px;
   line-height: 85px;
   font-weight: normal;
   margin-bottom: 50px;
   text-transform: lowercase;
}

@media (max-width: 568px) {
   .content h3 {
      font-size: 20px;
      margin-bottom: 40px;
      line-height: 1.3;
      margin-top: 90px;
   }
}

.project-list {
   margin-bottom: 140px;
   gap: 75px 30px;
   display: grid;
   grid-template-columns: repeat(2, 1fr);
}

@media (max-width: 568px) {
   .project-list {
      margin-bottom: 70px;
      grid-template-columns: repeat(1, 1fr);
      gap: 30px;
   }
}

.project-filter {
   margin-bottom: 80px;
   margin-top: -75px;
   overflow-x: auto;
}

@media (min-width: 568px) and (max-width: 1024px) {
   .project-filter {
      margin-left: -30px;
      margin-right: -30px;
      padding-left: 30px;
      padding-right: 30px;
   }
}

@media (max-width: 568px) {
   .project-filter {
      margin-top: -35px;
      margin-bottom: 40px;
      margin-left: -16px;
      margin-right: -16px;
      padding-left: 16px;
      padding-right: 16px;
   }
}

.project-filter::-webkit-scrollbar {
   display: none;
}

.project-filter button {
   background: #f4f5f5;
   font-size: 18px;
   color: #1a1d23;
   padding: 14px 25px;
   border-radius: 40px;
   margin-right: 20px;
   box-shadow: none !important;
   outline: none;
   border: none;
   transition: 0.3s ease;
   min-width: fit-content;
}

.project-filter button:last-child {
   margin-right: 0;
}

.project-filter button:hover {
   background: #e7e7e7;
}

@media (max-width: 568px) {
   .project-filter button {
      font-size: 14px;
      padding: 10px 20px;
      min-width: max-content;
   }
}

.project-filter .f-active {
   background: #a8fd32;
   color: #1a1d23;
   text-decoration: none;
}

.project-list .project-item {
   /*max-width: 760px;*/
   /*margin-bottom: 40px;*/
   margin-bottom: 50px;
   position: relative;
   /*border-radius: 10px;*/
   /*width: 49%;*/

   /*cursor: url("/img/hover.svg") 4 12, auto;*/

   max-height: 86vh;
   /*width: calc(50% - 15px);*/
   padding: 0;
   cursor: initial;
}
@media (max-width: 568px) {
   .project-list .project-item {
      width: 100%;
   }
}

.project-list .project-item a {
   /*transform: scale(1);*/
   /*transition: .3s ease;*/
   display: block;
   height: 100%;
}


.project-list .project-item:hover {
   /*transform: scale(.98) !important;*/
}

.project-list .project-item a:hover {
   /*transform: scale(.98) !important;*/
}

@media (max-width: 568px) {
   .project-list .project-item {
      margin-bottom: 0px;
   }
}

.project-list .project-item:last-child {
   /*margin-bottom: 0;*/
}

.project-list .project-item .project-item-img {
   position: relative;
   height: 100%;
   border-radius: 10px;
   /*padding-top: 110%;*/
   /*width: 100%;*/
   /*aspect-ratio: 325/354;*/
}

.project-list .project-item .project-item-img video {
   /*border-radius: 10px;*/
   border-radius: 0;
   height: 100%;
   object-fit: cover;
}
@media (max-width: 568px) {
   .project-list .project-item .project-item-img video {
      aspect-ratio: 179/209;
   }
}

.project-list .project-item:hover .project-item-img:before {
   opacity: 1;
   transition: 0.3s;
   transform: rotate(-30deg) scale(1);
}

.project-list .project-item .project-item-img:before {
   /*content: "смотреть";*/
   font-size: 20px;
   background: #a8fd32;
   color: #1a1d23;
   position: absolute;
   z-index: 99;
   width: 150px;
   height: 150px;
   border-radius: 50%;
   display: flex;
   justify-content: center;
   align-items: center;
   top: calc(50% - 75px);
   left: calc(50% - 75px);
   opacity: 0;
   transform: rotate(0deg) scale(0);
   transition: 0.3s;
}

.project-list .project-item img {
   width: 100%;
   /*transform: scale(1);*/
   transition: 0.3s;
   height: 100%;
   /*border-radius: 10px;*/
   border-radius: 0;
   /*position: absolute;*/
   /*top: 0;*/
   object-fit: cover;
}

.project-list .project-item:hover img {
   /*transform: scale(.97);*/
   transition: 0.3s;
}

.project-list .project-item a {
   text-decoration: none;
   height: 100%;
}
@media (max-width: 568px) {
   .project-list .project-item a {
      height: auto;
   }
}

.project-list .project-item div,
.project-list .project-item h3,
.project-list .project-item p {
   margin-bottom: 0px;
   margin-top: 20px;
   font-size: 28px;
   color: #1a1d23;
   line-height: 1;
   font-weight: 500;
   line-height: 130%;
   text-transform: inherit;
   opacity: 1;
   /*transition: .3s ease;*/
}

.block-other .project-list .project-item h3,
.block-other .project-list .project-item p {
   color: #ffffff;
}

@media (max-width: 568px) {
   .project-list .project-item h3,
   .project-list .project-item p {
      font-size: 24px;
   }
}

.project-list .project-item .list,
.project-list .project-item p {
   color: #a8fd32;
   font-size: 18px;
   color: #969a9f;
   margin-top: 10px;
   opacity: 0;
   transition: 0.3s;
   font-weight: 400;
}
.project-list .project-item:hover .list,
.project-list .project-item:hover p {
   opacity: 1;
}
@media (max-width: 568px) {
   .project-list .project-item p {
      opacity: 0;
      display: none;
   }
}

.project-list .project-item .list {
   display: flex;
   flex-wrap: wrap;
   gap: 8px;
}
@media (max-width: 568px) {
   .project-list .project-item .list {
      opacity: 1;
   }
}


.project-list .project-item .list span {
   border: 1px solid #ebebeb;
   border-radius: 10px;
   padding: 6px 12px;

   /*font-family: "TT Norms Pro", sans-serif;*/
   font-weight: 400;
   font-size: 12px;
   line-height: 130%;
   color: #1c1c1c;
}

.block-other .project-list .project-item .list span {
   color: #ebebeb;
}

.project-list .project-item:hover h3 {
   /*display: none;*/
   /*opacity: 0;*/
   /*visibility: hidden;*/
}

.project-list .project-item:hover p {
   /*display: block;*/
   /*visibility: visible;*/
   /*opacity: 1;*/
}

.project-list .project-item-text {
   /*position: absolute;*/
   /*bottom: 40px;*/
   /*left: 30px;*/
   position: relative;
   margin-top: 20px;
   width: calc(100% - 60px);
}

@media (max-width: 568px) {
   .project-list .project-item-text {
      /*left: 20px;*/
      width: calc(100% - 40px);
      position: initial;
   }
}

/*.project-list .project-item p {
    margin-bottom: 0;
    font-size: 14px;
    color: #1A1D23;
    text-transform: lowercase;
}*/

.home-text {
   border: 1px solid #e6e6ed;
   padding: 40px;
}

.home-text div {
   margin-bottom: 30px;
}

.home-text h4 {
   font-size: 24px;
   font-weight: normal;
   margin-bottom: 0;
}

.home-text p {
   font-size: 14px;
   line-height: 20px;
   margin-bottom: 0;
}

.project-detail {
}

@media (max-width: 568px) {
   .project-detail {
      margin-top: 164px;
   }
}

.project-detail h1 {
   text-transform: inherit;
}

.project-detail .project-head {
   height: 100vh;
   max-height: 585px;
   /*width: 100vw;*/
   margin-left: calc(50% - 50vw);
   margin-right: calc(50% - calc(50vw - 9px));
   padding: 0 125px;
   padding-top: 125px;
   position: relative;
   margin-bottom: 80px;
}

@media (max-width: 568px) {
   .project-detail .project-head {
      margin-right: calc(50% - calc(50vw));
      padding: 0;
      max-height: 240px;
   }
}

.project-detail .project-head video {
   /*margin-left: calc(50% - 50vw);
    width: 100vw;
    height: 100vh;
    margin-top: -125px;
    filter: brightness(0.5);*/
}

.video-box {
   position: relative;
   overflow: hidden;
   height: 100vh;
   max-height: 585px;
   /*width: 100vw;*/
   margin-left: calc(50% - 50vw);
   margin-right: calc(50% - calc(50vw - 4px));
   /*margin-top: -125px;*/
   filter: brightness(0.5);
   margin-top: 40px;
}

@media (max-width: 568px) {
   .video-box {
      margin-right: calc(50% - calc(50vw - -4px));
      max-height: 240px;
      margin-top: 30px;
   }
}

.video-box video {
   position: absolute;
   top: 0px;
   left: 0;
   width: 0;
   height: 0;
   z-index: -1;
   pointer-events: none;
}

.video-box img {
   width: 100%;
}

.project-detail .project-head h2 {
   font-size: 90px;
   font-weight: normal;
   position: absolute;
   top: 40%;
}

.project-detail .project-head .sub-info {
   position: absolute;
   bottom: 115px;
   width: 100%;
   max-width: 1120px;
}

.project-detail .project-head .sub-info div {
   /*width: 30%;*/
   max-width: 300px;
}

.project-detail .project-head .sub-info div strong {
   font-size: 20px;
   font-weight: 500;
}

.project-detail .project-head .sub-info div p {
   font-size: 18px;
   line-height: 24px;
}

.project-detail .project-head .sub-info div span:last-child {
   visibility: hidden;
}

.project-detail .block-fullwidth {
   /*width: 100vw !important;*/
   /*margin-left: calc(50% - 50vw);*/
   /*margin-right: calc(50% - calc(50vw - 9px));*/
   /*padding: 0 60px;*/
}

@media (max-width: 568px) {
   .project-detail .block-fullwidth {
      /*margin-right: calc(50% - 50vw);*/
      /*padding: 0 16px;*/
   }
}

.project-detail .block-100 {
   width: 100%;
}

@media (max-width: 568px) {
   .project-detail .block-100 {
   }
}

.project-detail .block-50, .case-gallery__list .block-50 {
   width: 49% !important;
}

@media (max-width: 568px) {
   .project-detail .block-50, .case-gallery__list .block-50 {
      width: 100% !important;
   }
}

.project-detail .block-30, .case-gallery__list .block-30 {
   width: 32% !important;
}

@media (max-width: 568px) {
   .project-detail .block-30, .case-gallery__list .block-30 {
      width: 100% !important;
   }
}

.project-detail .block-content {
   width: 100%;
}

.project-detail .block-content:last-child {
   /*margin-bottom: 50px;*/
}

.project-detail .block-content img {
   width: 100%;
}

.project-detail .block-content .video {
   line-height: 0;
}

.project-detail .block-content .video video {
   width: 100%;
   pointer-events: none;
}

.project-detail .block-content .video video::-webkit-media-controls {
   display: none !important;
}

.project-detail .block-content .block-img {
   line-height: 0;
   font-size: 0;
}

.project-detail .block-content .block-title {
   font-size: 35px;
   line-height: 45px;
   /*margin-bottom: 40px;*/
   /*margin-top: 50px;*/
   font-weight: 500;
   margin-bottom: 18px;
}

@media (max-width: 568px) {
   .project-detail .block-content .block-title {
      font-size: 24px;
      line-height: 35px;
   }
}

.project-detail .block-content .block-text {
   font-size: 24px;
   line-height: 1.5;
   max-width: 880px;
}

@media (max-width: 568px) {
   .project-detail .block-content .block-text {
      font-size: 16px;
   }
}

.project-detail .block-content .block-html {
   font-size: 24px;
}

@media (max-width: 568px) {
   .project-detail .block-content .block-html {
      font-size: 16px;
   }
}

.project-detail .block-content .block-html iframe {
   width: 100%;
   margin-bottom: -4px;
}

.project-detail .block-rew {
   margin-left: calc(50% - 50vw);
   margin-right: calc(50% - calc(50vw - 9px));
   padding: 80px 60px 110px;
   background: #e6e6ed;
   margin-top: 100px;
}

@media (max-width: 568px) {
   .project-detail .block-rew {
      padding: 16px;
      margin-right: calc(50% - 50vw);
   }
}

.project-detail .block-rew > div:first-child {
   padding-right: 30px;
}

.project-detail .block-rew p:nth-child(1) {
   font-size: 22px;
   margin-bottom: 50px;
}

@media (max-width: 568px) {
   .project-detail .block-rew p:nth-child(1) {
      font-size: 16px;
   }
}

.project-detail .block-rew p:nth-child(2) {
   font-size: 18px;
   color: #41454d;
   margin-bottom: 5px;
}

.project-detail .block-rew p:nth-child(3) {
   font-size: 14px;
   font-weight: 600;
   margin-bottom: 0;
}

.block-other {
   margin-left: calc(50% - 50vw);
   margin-right: calc(50% - calc(50vw - 9px));
   padding: 100px 60px;
   background: #1a1d23;
   color: #ffffff;
}

@media (max-width: 568px) {
   .block-other {
      padding: 50px 16px;
      margin-right: calc(50% - 50vw);
   }
}

.block-other h4 {
   font-size: 40px;
   margin-bottom: 80px;
}
@media (max-width: 568px) {
   .block-other h4 {
      margin-bottom: 40px;
   }
}

.block-other hr {
   border: 1px solid #43474e;
   margin: 150px 0 0 0;
}

@media (max-width: 568px) {
   .block-other hr {
      margin: 30px 0 0 0;
   }
}

.block-other .grid {
   gap: 75px 30px;
   display: grid;
   grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 568px) {
   .block-other .grid {
      gap: 75px 30px;
      display: grid;
      grid-template-columns: repeat(1, 1fr);
   }
}

.block-other .project-list {
   grid-template-columns: repeat(1, 1fr);
   margin: 0;
}

.block-other .project-item {
   width: 100%;
}

.block-other .brief-section__wrapper {
   margin-top: 120px;
}
@media (max-width: 568px) {
   .block-other .brief-section__wrapper {
      margin-top: 80px;
   }
}

.block-other .brief-section__link {
   height: 100px;
}
@media (max-width: 568px) {
   .block-other .brief-section__link {
      height: 60px;
   }
}

.page-title {
   font-size: 80px;
   margin-top: 200px;
   margin-bottom: 150px;
}

.service-list {
   width: 100%;
   margin-bottom: 100px;
}

@media (max-width: 568px) {
   .service-list {
      margin-bottom: 0;
   }
}

.service-list-item {
   padding-bottom: 50px;
   margin-bottom: 50px;
   border-bottom: 1px solid #e6e6ed;
}

@media (max-width: 568px) {
   .service-list-item {
      margin-bottom: 30px;
      padding-bottom: 30px;
   }
}

.service-list-item:last-child {
   border: none;
}

.service-list-item a {
   text-transform: lowercase;
}

.service-list-item div:first-child {
   padding-right: 20px;
}

.service-list-item div:first-child p:first-child {
   font-size: 40px;
   margin-bottom: 15px;
   color: #1a1d23;
}

@media (max-width: 568px) {
   .service-list-item div:first-child p:first-child {
      font-size: 20px;
   }
}

.content-home .service-list-item div:first-child p:first-child {
   margin-bottom: 0px;
}

@media (max-width: 568px) {
   .service-list-item div:first-child p:first-child {
      font-size: 20px;
   }
}

.service-list-item div:first-child p:nth-child(2) {
   font-size: 18px;
   margin-bottom: 0;
   color: #1a1d23;
}

@media (max-width: 568px) {
   .service-list-item div:first-child p:nth-child(2) {
      font-size: 16px;
   }
}

.service-list-item div:last-child {
}

.service-list-item div:last-child span {
   width: 53px;
   height: 53px;
   background: #f7f7f7;
   border-radius: 50%;
   transition: 0.5s ease;
   transform: rotate(0deg);
}

.service-list-item:hover div:last-child span {
   background: #a8fd32;
   transform: rotate(-45deg);
}

.service-list-item:hover div:last-child span svg {
   transition: 0.5s ease;
}

.service-list-item:hover div:last-child span svg path {
   fill: #1a1d23;
}

.documents .service-list-item div:last-child span {
   /*transform: rotate(90deg);*/
}

.documents .service-list-item:hover div:last-child span {
   /*transform: rotate(90deg);*/
}

@media (max-width: 568px) {
   .service-list-item div:last-child span {
      width: 33px;
      height: 33px;
      padding: 10px;
   }

   .service-list-item div:last-child svg {
   }
}

.product.company {
   margin-top: 100px;
}

@media (max-width: 568px) {
   .product.company {
      margin-top: -30px;
   }
}

.product .grid {
}

.product .item {
   border-radius: 10px;
   border: 1px solid #e6e6e6;
   padding: 50px 40px 40px;
   height: 100%;
   color: #1a1d23;
   display: block;
   position: relative;
}

@media (max-width: 568px) {
   .product .item {
      padding: 35px 20px;
   }
}

.product a.item:before {
   content: "перейти";
   background: #a8fd32;
   border-radius: 50%;
   width: 115px;
   height: 115px;
   display: flex;
   justify-content: center;
   align-items: center;
   position: absolute;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   margin: auto;
   opacity: 0;
   transform: scale(0);
   visibility: hidden;
   transition: 0.5s ease;
}

.product a.item:hover:before {
   opacity: 1;
   transform: scale(1);
   visibility: visible;
}

.product .grid > div:nth-child(1) .item {
   /*background: #E7E9F5;*/
}

@media (max-width: 568px) {
   .product .grid > div:nth-child(1) {
      margin-bottom: 20px;
   }
}

.product .grid > div:nth-child(2) .item {
   /*background: #E7F5F4;*/
}

.product .item > div {
   margin-bottom: 30px;
}

.product .item p {
   margin-bottom: 0;
   font-size: 22px;
   line-height: 35px;
}

@media (max-width: 568px) {
   .product .item p {
      font-size: 16px;
      line-height: 22px;
   }
}

.product .item > div p {
   font-size: 28px;
   color: #1a1d23;
}

@media (max-width: 568px) {
   .product .item > div p {
      font-size: 22px;
   }
}

.product .item > div span {
   height: 35px;
   background: #ffffff;
   border-radius: 30px;
   padding: 16px;
   border: 1px solid #1a1d23;
}

@media (max-width: 568px) {
   .product .item > div span {
      font-size: 12px;
      height: 32px;
      border-color: #1a1d2338;
   }
}

.blog-list {
}

.blog-list-item {
   max-width: 760px;
   margin-bottom: 65px;
}

.blog-list-item a {
}

.blog-list-item img {
   width: 100%;
   margin-bottom: 30px;
   max-height: 400px;
   object-fit: cover;
}

.blog-list-item p {
   font-size: 22px;
}

.jobs-list {
}

.jobs-list-item {
   padding-bottom: 45px;
   margin-bottom: 50px;
   border-bottom: 1px solid #e6e6ed;
}

@media (max-width: 568px) {
   .jobs-list-item {
      padding-bottom: 30px;
      margin-bottom: 30px;
   }
}

.jobs-list-item a {
   color: #1a1d23;
}

.jobs-list-item a:hover {
}

.jobs-list-item p {
   font-size: 52px;
   text-transform: lowercase;
}

@media (max-width: 568px) {
   .jobs-list-item p {
      font-size: 18px;
      line-height: 1;
      margin-bottom: 0;
   }
}

.jobs-list-item span {
   width: 53px;
   height: 53px;
   background: #f7f7f7;
   border-radius: 50%;
   transition: 0.5s ease;
}

@media (max-width: 568px) {
   .jobs-list-item span {
      width: 33px;
      height: 33px;
      padding: 10px;
   }
}

.jobs-list-item:hover span {
   background: #a8fd32;
   transform: rotate(-45deg);
}

.jobs-list-item:hover div:last-child span svg path {
   fill: #1a1d23;
   transition: 0.5s ease;
}

.jobs-list-item svg {
}

.PAGE_HEAD {
   margin-left: calc(50% - 50vw);
   margin-right: calc(50% - calc(50vw - 9px));
   padding: 190px 125px;
   overflow-x: auto;
}

@media (max-width: 568px) {
   .PAGE_HEAD {
      padding: 100px 16px;
   }
}

.PAGE_HEAD::-webkit-scrollbar {
   width: 12px;
}

.PAGE_HEAD h2 {
   /*font-size: 50px;*/
   /*line-height: 60px;*/
   max-width: 80%;
   width: 100%;
   min-width: 70vw;
   margin-right: 200px;
   text-transform: lowercase;
}

@media (max-width: 568px) {
   .PAGE_HEAD h2 {
      max-width: 100%;
      min-width: 97vw;
      margin-right: 50px;
   }
}

.vertical-text {
   writing-mode: vertical-rl;
   transform: rotate(180deg);
   text-align: right;
   font-size: 20px;
   margin: 0;
   padding: 0 0 0 100px;
}

.PAGE_WORK_LIST {
   width: calc(100% - 100px);
   margin-bottom: 120px;
}

@media (max-width: 568px) {
   .PAGE_WORK_LIST {
      width: 100%;
      margin-bottom: 0px;
   }
}

.PAGE_WORK_LIST-item {
   padding-bottom: 37px;
   margin-bottom: 65px;
   border-bottom: 1px solid #e6e6ed;
}

@media (max-width: 568px) {
   .PAGE_WORK_LIST-item {
      margin-bottom: 30px;
      padding-bottom: 30px;
   }
}

.PAGE_WORK_LIST-item div:first-child {
   width: 35px;
   margin-right: 50px;
}

.PAGE_WORK_LIST-item div:first-child p {
   background: #f7f7f7;
   color: #cbcfd3;
   font-size: 12px;
   width: 100%;
   text-align: center;
   margin-bottom: 0;
   border-radius: 50%;
   margin-top: 10px;
}

@media (max-width: 568px) {
   .PAGE_WORK_LIST-item div:first-child {
      margin-top: 0;
      margin-bottom: 20px;
   }
}

.PAGE_WORK_LIST-item div:last-child {
   width: 100%;
   text-transform: lowercase;
}

.PAGE_WORK_LIST-item div:last-child p:first-child {
   font-size: 26px;
   margin-bottom: 30px;
}

@media (max-width: 568px) {
   .PAGE_WORK_LIST-item div:last-child p:first-child {
      font-size: 20px;
      margin-bottom: 16px;
   }
}

.PAGE_WORK_LIST-item div:last-child p:last-child {
   font-size: 20px;
   margin-bottom: 0;
}

@media (max-width: 568px) {
   .PAGE_WORK_LIST-item div:last-child p:last-child {
      font-size: 14px;
   }
}

.PAGE_ABOUT_VIDEO {
   width: 100%;
   max-height: 600px;
   min-height: 300px;
}

.PAGE_ABOUT_VIDEO > div:first-child {
   border-radius: 20px;
}

.PAGE_ABOUT_VIDEO .video-js video {
   width: 100%;
   filter: brightness(0.3) grayscale(0.4);
   object-fit: cover;
   border-radius: 20px;
}

.PAGE_ABOUT_VIDEO .video-js video::-webkit-media-controls {
   display: none !important;
}

.PAGE_ABOUT_VIDEO .modal {
   padding-right: 0;
   background: rgb(0 0 0 / 90%);
}

.PAGE_ABOUT_VIDEO .modal.show .modal-dialog {
   transform: none;
   width: 100%;
   max-width: 90%;
   padding-right: 60px;
   padding-left: 60px;
   height: calc(100% - 40px);
   padding-top: 0;
   margin: 20px auto;
}

@media (min-width: 1800px) {
   .PAGE_ABOUT_VIDEO .modal.show .modal-dialog {
      max-width: 100%;
   }
}

@media (max-width: 568px) {
   .PAGE_ABOUT_VIDEO .modal.show .modal-dialog {
      padding-right: 16px;
      padding-left: 16px;
      max-width: 100%;
   }
}

.PAGE_ABOUT_VIDEO .modal .modal-content {
   border-radius: 20px;
   background: #000;
}

.PAGE_ABOUT_VIDEO .modal-body {
   padding: 0;
}

.PAGE_ABOUT_VIDEO .modal-body .plyr--video {
   border-radius: 20px;
}

.PAGE_ABOUT_VIDEO .modal .close {
   position: absolute;
}

.PAGE_ABOUT_VIDEO .plyr__control--overlaid {
   background: #a8fd32;
}

.PAGE_ABOUT_VIDEO .plyr__control--overlaid:hover {
   background: #a8fd32;
}

.PAGE_ABOUT_VIDEO .plyr--video .plyr__controls div,
.PAGE_ABOUT_VIDEO .plyr--video .plyr__controls button {
   display: none;
}

.PAGE_ABOUT_VIDEO .plyr__controls button:hover {
   background: inherit !important;
}

.PAGE_ABOUT_VIDEO .plyr__controls button:nth-child(1) {
   display: block;
}

.PAGE_ABOUT_VIDEO .plyr--video.plyr--hide-controls .plyr__controls {
   opacity: 0;
   pointer-events: none;
   transform: translate(-50%, -50%);
}

.PAGE_ABOUT_VIDEO .plyr--video .plyr__controls {
   background: #a8fd32;
   bottom: inherit;
   color: #fff;
   left: 50%;
   top: 50%;
   padding: 15px;
   border-radius: 50%;
   position: absolute;
   right: inherit;
   transition: opacity 0.4s ease-in-out, transform 0.4s ease-in-out;
   z-index: 2;
   transform: translate(-50%, -50%);
}

.about-service-list {
   margin-bottom: 150px;
}

.about-service-list .service-list-item {
   padding-bottom: 50px;
   margin-bottom: 0px;
   margin-top: 50px;
}

.about-service-list .service-list-item div:first-child p:last-child {
   font-size: 45px;
   margin-bottom: 0px;
}

.item-head {
   margin-top: 250px;
   margin-bottom: 200px;
}

@media (max-width: 568px) {
   .item-head {
      margin-top: 120px;
      margin-bottom: 70px;
   }

   .item-head .circle {
      height: inherit !important;
      width: inherit !important;
      border: none !important;
      margin-top: 30px;
   }

   .item-head .circle a {
      justify-content: start !important;
      min-height: inherit;
      min-width: inherit;
   }

   .item-head .circle a:hover {
      color: #a8fd32;
   }
}

.item-head h1 {
   /*font-size: 80px;*/
   /*line-height: 80px;*/
   max-width: 700px;
   margin-bottom: 30px;
   font-weight: normal;
   margin-top: 0;
}

.item-head p {
   font-size: 18px;
   max-width: 900px;
   text-transform: lowercase;
}

@media (max-width: 568px) {
   .item-head p {
      font-size: 14px;
   }
}

.item-head a.link-brief {
   position: relative;
   display: flex;
   justify-content: center;
   align-items: center;
   color: #ffffff;
}

.item-head .link-brief svg {
}

.item-head .link-brief span {
   position: absolute;
}

.service-detail {
}

.service-detail .number {
   width: 35px;
   margin-right: 50px;
}

.service-detail .number p {
   background: #f7f7f7;
   color: #cbcfd3;
   font-size: 12px;
   width: 100%;
   text-align: center;
   margin-bottom: 0;
   border-radius: 50%;
   margin-top: 10px;
}

.service-detail .block-content {
   padding-bottom: 35px;
   border-bottom: 1px solid #d8d8e0;
   margin-bottom: 65px;
   width: 100%;
   margin-top: 0;
}

.service-detail > div:nth-child(2) > div:nth-child(7) .block-content {
   border: none;
}

@media (max-width: 568px) {
   .service-detail .block-content {
      border: none;
      padding-bottom: 10px;
   }
}

.service-detail .block-title {
   font-size: 26px;
   margin-bottom: 30px;
   text-transform: lowercase;
}

@media (max-width: 568px) {
   .service-detail .block-title {
      font-size: 20px;
      margin-top: 20px;
   }
}

.service-detail .block-text {
   font-size: 20px;
   line-height: 28px;
   margin-bottom: 0;
   text-transform: lowercase;
}

@media (max-width: 568px) {
   .service-detail .block-text {
      font-size: 14px;
      line-height: 18px;
   }
}

.service-detail .link {
   width: 170px;
   margin-left: 50px;
}

@media (max-width: 568px) {
   .service-detail .link {
      margin-left: 0;
   }
}

.service-detail .link a {
   width: 170px;
   height: 38px;
   color: #8d97b7;
   font-size: 14px;
   border: 1px dashed #8d97b7;
   border-radius: 100px;
   transition: 0.3s ease;
}

.service-detail .link a:hover {
   border: 1px solid #a8fd32;
   color: #a8fd32;
}

@media (max-width: 568px) {
   .service-detail .link a {
   }
}

.service-detail hr {
   background: #e6e6ed;
   opacity: 1;
   margin-bottom: 30px;
   margin-top: 30px;
}

.service-detail .dark {
   margin-left: calc(50% - 50vw);
   margin-right: calc(50% - calc(50vw - 9px));
   padding: 100px 60px 25px;
   background: #1a1d23;
   color: #ffffff;
   margin-top: 120px;
}

.service-detail .block-other {
}

@media (max-width: 568px) {
   .service-detail .dark {
      margin-top: 60px;
      padding: 10px 16px 10px;
   }
   .service-detail .block-other {
      padding: 50px 16px;
   }
}

.service-detail .block-other h4 {
   font-size: 40px;
   margin-bottom: 80px;
}

.service-detail .block-other hr {
   border: 1px solid #43474e;
   margin: 150px 0 0 0;
}

.service-detail .block-other .project-item {
   width: 100%;
}

.jobs-detail {
   text-transform: lowercase;
}

.jobs-detail h2 {
   margin-bottom: 30px;
   text-transform: lowercase;
}

@media (max-width: 568px) {
   .jobs-detail h2 {
      font-size: 40px;
      line-height: 45px;
      margin-bottom: 15px;
   }
}

.jobs-detail-item {
   margin-bottom: 50px;
}

.jobs-detail-item p {
   font-size: 20px;
   margin-bottom: 30px;
}

@media (max-width: 568px) {
   .jobs-detail-item p {
      font-size: 14px;
   }
}

.jobs-detail-item ul {
   width: 100%;
   list-style: none;
   padding-left: 0;
}

.jobs-detail-item li {
   font-size: 22px;
   /*line-height: 1;*/
   margin-bottom: 25px;
   /*font-weight: 500;*/
}

@media (max-width: 568px) {
   .jobs-detail-item li {
      font-size: 16px;
      margin-bottom: 17px;
   }
}

.jobs-detail-item {
}

.blog-detail {
   margin-top: 170px;
   max-width: 770px;
}

.blog-detail .info {
   margin-bottom: 50px;
}

.blog-detail .info p {
   font-size: 14px;
   color: #636a79;
   margin-bottom: 0;
}

.blog-detail .info p:first-child {
   margin-right: 50px;
}

.blog-detail h2 {
   font-size: 40px;
   line-height: 60px;
}

.block-content {
   /*margin-top: 40px;*/
}

@media (max-width: 568px) {
   .block-content {
      margin-top: 0px;
      /*margin-bottom: 20px !important;*/
   }
}

.block-content .block-title p {
   font-size: 20px;
   line-height: 30px;
   margin-bottom: 15px;
   font-weight: 500;
}

.block-content .block-text p {
   font-size: 18px;
   line-height: 25px;
}

.block-content .block-img img {
   width: 100%;
   /*margin-top: 30px;*/
   /*margin-bottom: 30px;*/
}

@media (max-width: 568px) {
   .block-content .block-img img {
      margin-top: 0;
   }
}

.contact-list {
}

.contact-list p {
   font-size: 16px;
   /*margin-bottom: 30px;*/
}

.contact-list a {
   font-size: 30px;
   font-weight: 500;
}

.about-job {
   margin-bottom: 150px;
}

.about-item {
   border: 1px solid #e6e6ed;
   padding: 40px;
}

.about-item div:first-child p:first-child {
   font-size: 30px;
   margin-bottom: 30px;
}

.about-item div:first-child p:last-child {
   font-size: 20px;
   line-height: 30px;
   margin-bottom: 0;
}

.about-item div:last-child {
   margin-left: 100px;
}

.about-work {
   width: 100%;
   margin-bottom: 200px;
}

.about-work .about-item {
   margin-bottom: 30px;
}

.black {
   background: #1a1d23;
   margin-left: calc(50% - 50vw);
   margin-right: calc(50% - calc(50vw - 9px));
   color: #ffffff;
   padding: 120px 60px;
}

@media (max-width: 568px) {
   .black {
      padding: 50px 16px;
      margin-right: calc(50% - 50vw);
   }
}

.black h3 {
   font-size: 70px;
   line-height: 85px;
   line-height: 1.2;
   margin-top: 0;
   margin-bottom: 0;
}

@media (max-width: 568px) {
   .black h3 {
      font-size: 22px;
      line-height: 1;
   }
}

.green {
   background: #a8fd32;
   margin-left: calc(50% - 50vw);
   margin-right: calc(50% - calc(50vw - 9px));
   color: #1a1d23;
   padding: 120px 60px;
}

@media (max-width: 568px) {
   .green {
      padding: 50px 16px;
      margin-right: calc(50% - 50vw);
   }
}

.green h3 {
   font-size: 60px;
   line-height: 85px;
   line-height: 1.2;
   margin-top: 0;
   margin-bottom: 0;
}

@media (max-width: 568px) {
   .green h3 {
      font-size: 22px;
      line-height: 1;
   }
}

.logo-item {
   margin-bottom: 100px;
}

marquee span {
   border: 2px solid rgba(255, 255, 255, 0.25);
   border-radius: 26px;
   padding: 4px 25px;
   font-size: 50px;
   letter-spacing: -0.015em;
   text-transform: lowercase;
   margin: 7px;
   box-sizing: border-box;
}

marquee {
   margin-left: calc(50% - 50vw);
   margin-right: calc(50% - calc(50vw - 9px));
}

@media (max-width: 768px) {
   marquee.last {
      margin-bottom: 80px;
   }
}

@media (max-height: 568px) {
   marquee.last {
      margin-bottom: 80px;
   }
}

marquee span:hover {
   background: linear-gradient(90.9deg, #80178f 1.32%, #591e95 100%);
   border: 2px solid rgba(255, 255, 255, 0);
   box-sizing: border-box;
}

.marquee-0 {
   --space: 0rem;
   display: grid;
   align-content: center;
   /*overflow: hidden;*/
   /*font-family: "Corben", system-ui, sans-serif;*/
   /*margin-left: calc(50% - 50vw);*/
   /*margin-right: calc(50% - 50vw);*/
   /*margin-right: calc(50% - calc(50vw - 9px));*/
}

.marquee {
   --duration: 20s;
   --gap: var(--space);
   display: flex;
   /*overflow: hidden;*/
   user-select: none;
   position: relative;
   max-width: 100vw;
   margin-left: calc(50% - 50vw);
   margin-right: calc(50% - 50vw);
   /*overflow-x: hidden;*/
}

.marquee:hover {
   z-index: 99;
}

.marquee__group {
   flex-shrink: 0;
   display: flex;
   align-items: center;
   justify-content: space-around;
   min-width: 100%;
   animation: scroll var(--duration) linear infinite;
}

.marquee:hover .marquee__group {
   animation-play-state: paused;
}

@media (prefers-reduced-motion: reduce) {
   .marquee__group {
      animation-play-state: paused;
   }
}

.marquee__group h1 {
   padding: 0px 100px;
}

.marquee__group p {
   padding: 4px 25px;
   font-size: 50px;
   margin: 7px;
   box-sizing: border-box;
   /*cursor: default;*/
   font-weight: 500;
   position: relative;
}

@media (max-width: 1200px) {
   .marquee__group p {
      font-size: 35px;
      padding: 4px 15px;
      border-radius: 13px;
   }
}

@media (max-width: 768px) {
   .marquee__group p {
      font-size: 22px;
      padding: 4px 15px;
      border-radius: 13px;
   }
}

@media (max-height: 568px) {
   .marquee__group p {
      font-size: 22px;
      padding: 4px 15px;
      border-radius: 13px;
   }
}

.marquee__group p:hover {
   /*background: linear-gradient(90.9deg, #80178F 1.32%, #591E95 100%);
    border: 2px solid rgba(255, 255, 255, 0);
    box-sizing: border-box;*/
}

.marquee__group span {
   margin: 7px;
}

.marquee--reverse .marquee__group {
   animation-direction: reverse;
   animation-delay: calc(var(--duration) / -2);
}

@keyframes scroll {
   0% {
      transform: translateX(0);
   }
   100% {
      transform: translateX(calc(-100% - var(--gap)));
   }
}

.product {
   margin-bottom: 140px;
}

@media (max-width: 568px) {
   .product {
      margin-bottom: 0px;
   }
   .product.company {
      margin-bottom: 70px;
   }
}

.company.info {
   margin-top: 140px;
}

@media (max-width: 568px) {
   .company.info {
      margin-top: 60px;
   }
}

.company.info > div {
   margin-bottom: 140px;
}

@media (max-width: 568px) {
   .company.info > div {
      margin-bottom: 40px;
   }
}

.company.info > div > div > p {
   font-size: 35px;
   line-height: 45px;
   text-transform: lowercase;
}

@media (max-width: 568px) {
   .company.info > div > div > p {
      font-size: 16px;
      line-height: 25px;
   }
}

.company.info > div > div > ol li {
   font-size: 35px;
   line-height: 45px;
   text-transform: lowercase;
}

@media (max-width: 568px) {
   .company.info > div > div > ol li {
      font-size: 16px;
      line-height: 25px;
   }
}

.company.info > div > div > ol li::marker {
   background: #a8fd32;
}

.company.info .number {
}

.company.info .number span {
   font-size: 40px;
   line-height: 50px;
   margin-bottom: 15px;
   display: block;
   font-weight: 500;
}

.company.info .number p {
   font-size: 16px;
   line-height: 22px;
   max-width: 100px;
}

@media (max-width: 568px) {
   .company.info .number p {
      max-width: 100%;
      padding-bottom: 10px;
      /*border-bottom: 1px solid #F2F2F2;*/
   }
}

.news {
   margin-top: 140px;
}

.news .item {
   border: 1px solid #f2f2f2;
   border-radius: 10px;
   padding: 40px 30px;
   margin-bottom: 20px;
   display: block;
}

.news a.item {
   color: #1a1d23;
   position: relative;
   height: calc(100% - 20px);
}

.news a.item:before {
   content: "открыть";
   background: #a8fd32;
   border-radius: 50%;
   width: 115px;
   height: 115px;
   display: flex;
   justify-content: center;
   align-items: center;
   position: absolute;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   margin: auto;
   opacity: 0;
   transform: scale(0);
   visibility: hidden;
   transition: 0.5s ease;
}

.news a.item:hover:before {
   opacity: 1;
   transform: scale(1);
   visibility: visible;
}

.news .item h4 {
   font-size: 26px;
   line-height: 30px;
   /*line-height: 45px;*/
   margin-bottom: 20px;
   font-weight: 500;
   max-width: 450px;
   text-transform: lowercase;
}

.news .item p {
   font-size: 16px;
   line-height: 25px;
   font-weight: 500;
   text-transform: lowercase;
   letter-spacing: -0.05rem;
}

.contact.info {
}

.contact.info h3 {
   font-size: 22px;
   line-height: 1;
   font-weight: 500;
   margin-bottom: 50px;
}

@media (max-width: 568px) {
   .contact.info h3 {
      margin-bottom: 25px;
      margin-top: 50px;
      font-size: 16px;
   }
}

.contact.info a {
   font-size: 35px;
   font-weight: 500;
}

@media (max-width: 568px) {
   .contact.info a {
      font-size: 26px;
   }
}

.contact.info a svg {
   transition: 0.3s ease;
}

.contact.info a:hover svg {
   transform: rotate(45deg);
}

.contact.info a:hover svg path {
   fill: #a8fd32;
}

.contact.info span {
   height: 40px;
   width: 100%;
   display: block;
}

@media (max-width: 568px) {
   .contact.info span {
      height: 15px;
   }
}

.circle {
   border: 1px solid #1a1d23;
   border-radius: 50%;
   width: 200px;
   height: 200px;
   transition: 0.3s ease;
}

.circle:hover {
   /*transform: scale(1.1);*/
   border: 100px solid #a8fd32;
}

.circle:hover a {
   color: #1a1d23;
}

.circle a {
   width: 100%;
   height: 100%;
   border-radius: 50%;
   text-transform: lowercase;
   min-width: 200px;
   min-height: 200px;
}

.client {
   width: 100%;
}

form {
}
form .sub-error {
   margin-top: 30px;
}

form .sub-error p {
   max-width: 100%;
   margin-bottom: 0;
}

.promo-black-form form .sub-error p {
   margin: auto;
}

form .sub-error font.errortext {
   font-size: 14px;
   color: #dc3545 !important;
}

.promo-black-form form .sub-error font.errortext {
   font-size: 20px;
}

form .sub-error br {
   display: none;
}

form .sub-div {
   margin-top: 30px;
   margin-bottom: 20px;
   display: flex;
   align-items: center;
}

form .sub-div svg {
   margin-left: -10px;
   margin-top: 5px;
   transform: rotate(0);
   transition: 0.3s;
}

input[type="submit"]:hover ~ svg {
   transform: rotate(45deg);
}

form > div {
   max-width: 800px;
   width: 100%;
   display: flex;
   flex-wrap: wrap;
}

form .form-input-2 {
   justify-content: space-between;
   max-width: 750px;
}

.form-job form .form-input-2 {
   max-width: 910px;
}

form .form-input-2 > div {
   min-width: 420px;
}

form .form-list {
   display: flex;
   flex-wrap: wrap;
   gap: 15px;
   max-width: 800px;
}

form .form-list br {
   display: none;
}

form input[type="checkbox"] {
   display: none !important;
}

form input[type="checkbox"] + label span {
   background: #f4f5f5;
   border-radius: 40px;
   padding: 9px 20px;
   display: block;
   cursor: pointer;
   /*text-transform: lowercase;*/
   transition: 0.3s ease;
}

form input[type="checkbox"]:checked + label span {
   background: #a8fd32;
   /*color: #fff;*/
}

form input[type="text"] {
   border-style: solid;
   border-width: 0px 0px 1px 0px;
   border-color: #dadde0;
   color: #1a1d23;
   padding: 10px 0px 0px 0px !important;
   border-radius: 0px;
   margin-top: 30px;
   min-width: 330px;
   outline: none;
}

form input[name=task] {
   padding-right: 50px !important;
}

form input[type="text"]::placeholder {
   color: #636a79;
}

.form-job form input[type="text"] {
   min-width: 420px;
}

form input[type="submit"] {
   font-size: 26px;
   color: #1a1d23;
   padding: 0;
   background: none;
   border: none;
   /*margin-top: 50px;*/
   /*margin-bottom: 20px;*/
   text-transform: lowercase;
   padding-right: 20px;
}

.form-job form input[type="submit"] {
   margin-top: 40px;
   position: relative;
}

.form-job form input[type="submit"]:before {
}

form textarea {
   border-style: solid;
   border-width: 0px 0px 1px 0px;
   border-color: #dadde0;
   color: #636a79;
   padding: 0px 0px 10px 0px;
   border-radius: 0px;
   margin-top: 30px;
   min-width: 330px;
   outline: none;
   width: 100%;
   max-width: 750px;
   margin-bottom: 30px;
   resize: none;
}

form p {
   font-size: 12px;
   color: #636a79;
   max-width: 300px;
   /*text-transform: lowercase;*/
}

.form-job input[type="file"] {
   margin-top: 25px;
}

/*client logo*/

.l-img {
   position: relative;
   cursor: pointer;
}

.l-img img {
   position: absolute;
   z-index: 99;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   margin: auto;
   pointer-events: none;
   opacity: 0;
   visibility: hidden;
   transform: scale(0);
   transition: 0.5s ease;
}

.l-img:hover img {
   opacity: 1;
   transform: scale(1);
   visibility: visible;
}

@media (max-width: 568px) {
   .l-img:hover img {
      transform: scale(0.7);
   }
}

/*promo*/

.promo-head {
   margin-bottom: 90px;
   position: relative;
}

@media (max-width: 568px) {
   .promo-head.dark {
      margin-bottom: 250px;
   }
}

.promo-head h1 {
   font-weight: 500;
   font-size: 100px;
   margin-bottom: 40px;
}

@media (max-width: 568px) {
   .promo-head h1 {
      font-size: 35px;
      margin-bottom: 32px;
   }
}

.promo-head.dark h1 {
   font-size: 120px;
   font-weight: 700;
}

@media (max-width: 568px) {
   .promo-head.dark h1 {
      font-size: 40px;
      line-height: 110%;
      max-width: 210px;
   }
}

.promo-head h3 {
   font-size: 35px;
   line-height: 1;
   max-width: 740px;
   margin: 0 auto 60px;
}

@media (max-width: 568px) {
   .promo-head h3 {
      font-size: 20px;
   }
}

.promo-head.dark h3 {
   font-weight: 400;
   font-size: 24px;
   line-height: 130%;
}

@media (max-width: 568px) {
   .promo-head.dark h3 {
      font-size: 18px;
      line-height: 130%;
   }
}

.promo-head strong {
   color: #a8fd32;
   font-weight: 700;
}

.promo-head span {
   background: #ddd7e8;
   border-radius: 8px;
   transform: rotate(-3.38deg);
   display: inline-block;
   padding: 2px 5px;
   position: relative;
   top: 3px;
}

.promo-head span i {
   font-style: normal;
   transform: rotate(3.38deg);
   display: block;
   position: relative;
   top: -3px;
}

.promo-head a {
   font-weight: 600;
   font-size: 17px;
   background: #e2eddc;
   border-radius: 42px;
   width: 265px;
   height: 60px;
   margin-right: auto;
   margin-left: auto;
   /*transform: scale(1);*/
   /*transition: .3s ease;*/
}

.promo-head a:hover {
   transform: scale(1.1);
   color: #1a1d23;
}

.promo-head.dark a {
   background: #a8fd32;
   transition: 0.3s ease;
}

.promo-head.dark a:hover {
   background: #1a1d23;
   border: 1px solid #a8fd32;
   color: #a8fd32;
}

.promo-head.dark a:hover svg path {
   stroke: #a8fd32;
}

@media (max-width: 568px) {
   .promo-head.dark a {
      width: 100%;
   }
}

.promo-head a svg {
   margin-left: 15px;
}

.promo-head.dark > svg {
   position: absolute;
   right: 25%;
   bottom: -130px;
}

@media (max-width: 568px) {
   .promo-head.dark > svg {
      right: 15%;
      bottom: -200px;
   }
}

.promo-block {
   margin-top: 230px;
   position: relative;
}

@media (max-width: 568px) {
   .promo-block {
      margin-top: 90px;
   }
}

.promo-block h2 {
   font-size: 90px;
   line-height: 110%;
}

@media (max-width: 568px) {
   .promo-block h2 {
      font-size: 35px;
      position: inherit !important;
   }
}

.content .promo-block:nth-child(3) h2 {
   max-width: 425px;
   position: absolute;
}

.content .promo-block:nth-child(4) h2 {
   max-width: 525px;
   position: sticky;
   top: 0;
   height: max-content;
   margin-bottom: 30px;
}

.promo-help {
   position: relative;
   top: 130px;
   padding-bottom: 300px;
}

@media (max-width: 568px) {
   .promo-help {
      padding-bottom: 0;
      position: inherit;
      top: 0;
   }
}

.promo-help .item {
   padding: 35px 30px;
   border-radius: 20px;
   max-width: 525px;
   position: relative;
   z-index: 1;
   transition: 0.3s ease;
}

@media (max-width: 568px) {
   .promo-help .item {
      position: inherit !important;
      transform: none !important;
      margin-bottom: 20px;
      padding: 25px 20px !important;
   }
}

.promo-help .item:hover {
   /*z-index: 99;*/
   /*box-shadow: 10px 10px 10px 0px #1a1d234f;*/
}

.promo-help > div:nth-child(1) .item {
}

.promo-help > div:nth-child(2) .item {
   background: #ddd7e8;
   transform: rotate(-15deg);
   top: -80px;
   left: 5px;
}

.promo-help > div:nth-child(3) .item {
   background: #f5e2cd;
   transform: rotate(-15deg);
   left: 40px;
   top: 0;
   padding-bottom: 10px;
}

.promo-help > div:nth-child(3) .item:hover {
   /*top: -30px;*/
   /*transform: rotate(-5deg);*/
}

.promo-help > div:nth-child(4) .item {
   background: #ddeaf3;
   transform: rotate(15deg);
   right: 10px;
}

.promo-help > div:nth-child(5) .item {
   background: #e2eddc;
   transform: rotate(15deg);
   top: 52px;
   left: 60px;
}

.promo-help > div:nth-child(6) .item {
   background: #f4f7f7;
   transform: rotate(-15deg);
   top: 70px;
}

.promo-help .item h5 {
   font-weight: 500;
   font-size: 28px;
   line-height: 130%;
   margin-bottom: 15px;
}

@media (max-width: 568px) {
   .promo-help .item h5 {
      font-size: 22px;
   }
}

.promo-help .item p {
   font-size: 20px;
   line-height: 130%;
   margin-bottom: 0;
   max-width: 425px;
}

@media (max-width: 568px) {
   .promo-help .item p {
      font-size: 18px;
   }
}

.promo-what {
}

@media (max-width: 568px) {
   .promo-what {
      margin-top: 90px;
   }
}

.promo-what .item {
   background: #f4f7f7;
   border-radius: 20px;
   padding: 35px 30px 40px;
   margin-bottom: 30px;
}

@media (max-width: 568px) {
   .promo-what .item {
      padding: 30px 25px;
   }
}

.promo-what .item h5 {
   font-weight: 500;
   font-size: 28px;
   line-height: 130%;
   margin-bottom: 0px;
}

@media (max-width: 568px) {
   .promo-what .item h5 {
      font-size: 22px;
      max-width: 80%;
   }
}

.promo-what .item p {
   margin-bottom: 0;
   margin-top: 20px;
   font-size: 20px;
   line-height: 130%;
}

@media (max-width: 568px) {
   .promo-what .item p {
      font-size: 18px;
   }
}

.promo-how {
}

.promo-how .item {
   margin-bottom: 90px;
}

@media (max-width: 568px) {
   .promo-how .item {
      margin-bottom: 40px;
   }
}

.promo-how .item span {
   font-weight: 500;
   color: #fff;
   display: inline-flex;
   justify-content: center;
   align-items: center;
   width: 52px;
   height: 35px;
   border-radius: 50%;
   margin-bottom: 15px;
}

@media (max-width: 568px) {
   .promo-how .item span {
      font-size: 14px;
      width: 46px;
      height: 30px;
   }
}

.promo-how > div:nth-child(1) .item span {
   background: #ddd7e8;
}

.promo-how > div:nth-child(2) .item span {
   background: #ddeaf3;
}

.promo-how > div:nth-child(3) .item span {
   background: #e2eddc;
}

.promo-how > div:nth-child(4) .item span {
   background: #f5e2cd;
}

.promo-how > div:nth-child(5) .item span {
   background: #edecdc;
}

.promo-how > div:nth-child(6) .item span {
   background: #f0ddf3;
}

.promo-how .item p {
   font-size: 32px;
   line-height: 130%;
   margin-bottom: 0;
}

@media (max-width: 568px) {
   .promo-how .item p {
      font-size: 18px;
   }
}

.promo-formats {
}

.promo-formats .item {
   padding: 40px;
   border-radius: 20px;
   text-transform: lowercase;
}

@media (max-width: 568px) {
   .promo-formats .item {
      padding: 30px 25px;
   }
}

.promo-formats .item:nth-child(1) {
   background: #f0ddf3;
   margin-bottom: 40px;
}

.promo-formats .item:nth-child(2) {
   background: #e2eddc;
}

.promo-formats .item h5 {
   font-weight: 500;
   font-size: 40px;
   margin-bottom: 20px;
}

@media (max-width: 568px) {
   .promo-formats .item h5 {
      font-size: 30px;
   }
}

.promo-formats .item p {
   font-size: 30px;
   line-height: 130%;
   max-width: 950px;
   margin-bottom: 0px;
}

@media (max-width: 568px) {
   .promo-formats .item p {
      font-size: 20px;
   }
}

.promo-formats .item div {
   margin-top: 50px;
}

.promo-formats .item div span {
   background: #ffffff;
   font-size: 20px;
   border-radius: 100px;
   display: inline-block;
   padding: 14px 22px;
   margin-right: 20px;
}

@media (max-width: 568px) {
   .promo-formats .item div span {
      font-size: 16px;
      margin-right: 0;
      margin-bottom: 20px;
      letter-spacing: -0.02rem;
   }
   .promo-formats .item div span:last-child {
      margin-bottom: 0;
   }
   .promo-formats .item:nth-child(2) div span {
      width: inherit;
   }
}

.promo-why {
}

.promo-why .item {
   border-top: 1px solid #dbdbdb;
   padding-top: 50px;
   padding-bottom: 50px;
}

@media (max-width: 568px) {
   .promo-why .item {
      padding-top: 30px;
      padding-bottom: 30px;
   }
}

.promo-why .item span {
   font-weight: 500;
   color: #ffffff;
   font-size: 16px;
   background: #f6affd;
   width: 52px;
   height: 35px;
   border-radius: 50%;
   display: inline-flex;
   justify-content: center;
   align-items: center;
   margin-right: 35px;
   position: relative;
   top: 5px;
}

@media (max-width: 568px) {
   .promo-why .item span {
      font-size: 12px;
      width: 44px;
      min-width: 44px;
      height: 28px;
   }
}

.promo-why .item p {
   font-size: 38px;
   line-height: 1;
   margin-bottom: 0;
}

@media (max-width: 568px) {
   .promo-why .item p {
      font-size: 20px;
      /*margin-top: 15px;*/
   }
}

.promo-comparison {
}

.promo-comparison .item {
   background: #f4f7f7;
   border-radius: 20px;
   padding: 40px;
}

@media (max-width: 568px) {
   .promo-comparison .item {
      padding: 35px 30px;
   }
   .promo-comparison .item:first-child {
      margin-bottom: 20px;
   }
}

.promo-comparison .item h5 {
   font-weight: 500;
   font-size: 40px;
   margin-bottom: 50px;
}

@media (max-width: 568px) {
   .promo-comparison .item h5 {
      font-size: 30px;
      letter-spacing: -0.05em;
   }
}

.promo-comparison .item ul {
   padding-left: 24px;
   margin-bottom: 0;
}

.promo-comparison > div:nth-child(1) .item ul {
   list-style: url("/img/li-1.svg");
}

.promo-comparison > div:nth-child(2) .item ul {
   list-style: url("/img/li-2.svg");
}

@media (max-width: 568px) {
   .promo-comparison .item ul {
   }
}

.promo-comparison > div:nth-child(1) .item ul li::marker {
   /*list-style: url("/img/li-1.svg");*/
   /*content: url("/img/li-1.svg");*/
}

.promo-comparison > div:nth-child(2) .item ul li::marker {
   /*list-style: url("/img/li-2.svg");*/
   /*content: url("/img/li-2.svg");*/
}

.promo-comparison .item li {
   font-size: 30px;
   line-height: 130%;
   margin-bottom: 25px;
   padding-left: 10px;
}

@media (max-width: 568px) {
   .promo-comparison .item li {
      font-size: 22px;
      padding-left: 15px;
   }
   .promo-comparison .item li:last-child {
      margin-bottom: 0;
   }
}

.promo-comparison .item li::marker {
   margin-right: 10px;
}

.promo-comparison .item li p {
   margin-bottom: 0;
   position: relative;
   top: -5px;
}

@media (max-width: 568px) {
   .promo-comparison .item li p {
      top: -6px;
   }
}

.promo-advantages {
}

.promo-advantages .item {
   background: #f4f7f7;
   border-radius: 20px;
   padding: 40px;
   margin-bottom: 30px;
}

@media (max-width: 568px) {
   .promo-advantages .item {
      padding: 25px 20px;
   }
}

.promo-advantages .item ul {
   padding-left: 24px;
   margin-bottom: 0;
   list-style: url("/img/li-2.svg");
}

.promo-advantages .item ul li::marker {
   /*content: url("/img/li-2.svg");*/
}

.promo-advantages .item li {
   font-size: 30px;
   line-height: 130%;
   margin-bottom: 0px;
   padding-left: 10px;
}

@media (max-width: 568px) {
   .promo-advantages .item li {
      padding-left: 15px;
   }
}

.promo-advantages .item li::marker {
   margin-right: 10px;
}

.promo-advantages .item li p {
   margin-bottom: 0;
   position: relative;
   top: -5px;
}

@media (max-width: 568px) {
   .promo-advantages .item li p {
      font-size: 22px;
      line-height: 130%;
   }
}

.promo-keys .project-list {
   /*flex-wrap: nowrap !important;*/
}

@media (max-width: 568px) {
   .promo-keys .project-list {
      flex-wrap: nowrap !important;
   }
}

.promo-form {
}

.promo-form > p {
   font-weight: 500;
   font-size: 28px;
   text-transform: lowercase;
   color: #1a1d23;
   margin-top: 25px;
   margin-bottom: 0;
}

.promo-form > p a {
   color: #f6affd;
   transition: 0.3s ease;
}

.promo-form > p a:hover {
   color: #d88bdf;
}

.promo-form {
   border: 1px solid #e6e6e6;
   border-radius: 20px;
   padding: 40px;
}

@media (max-width: 568px) {
   .promo-form {
      padding: 30px 25px;
   }
}

.promo-form form > div {
   display: block;
}

.promo-form h5 {
   font-weight: 500;
   font-size: 28px;
   margin-bottom: 50px;
   max-width: 460px;
}

@media (max-width: 568px) {
   .promo-form h5 {
      font-size: 22px;
   }
}

.promo-form form input[type="text"] {
   font-size: 24px;
   width: 100%;
}

@media (max-width: 568px) {
   .promo-form form input[type="text"] {
      font-size: 20px;
      margin-top: 20px;
   }
}

.promo-form form input[type="submit"] {
   color: #1a1d23;
   font-weight: 600;
   font-size: 17px;
   width: 100%;
   height: 62px;

   background: #e2eddc;
   border-radius: 42px;
   display: flex;
   justify-content: center;
   align-items: center;
   transform: scale(1);
   transition: 0.3s ease;
}
.promo-form form input[type="submit"]:hover {
   transform: scale(1.1);
   background: #a8fd32;
}

.promo-form form .form-input:nth-child(5) input[type="text"] {
   margin-top: 0;
}

.promo-form form p {
   text-align: center;
   font-size: 14px;
   line-height: 130%;
   color: #636a79;
   max-width: 432px;
   margin: 25px auto 0;
}

.promo-3col {
   margin-bottom: 190px;
}

@media (max-width: 568px) {
   .promo-3col > div {
      margin-top: 0 !important;
      margin-bottom: 30px;
   }
}

.promo-3col .item {
   border: 4px solid #909090;
   border-radius: 60px;
   padding: 50px;
}

@media (max-width: 568px) {
   .promo-3col .item {
      border: 2px solid #909090;
      border-radius: 40px;
      padding: 30px !important;
   }
}

.promo-3col .item span {
   color: #333333;
   font-weight: 600;
   font-size: 37px;
   background: #a8fd32;
   border-radius: 16px;
   padding: 10px 30px;
   display: inline-block;
   margin-bottom: 40px;
   position: relative;
}

@media (max-width: 568px) {
   .promo-3col .item span {
      position: inherit !important;
      font-size: 26px;
      padding: 7px 21px;
      border-radius: 12px;
      margin-bottom: 30px !important;
   }
}

.promo-3col > div {
}

.promo-3col > div:nth-child(1) .item {
   padding-bottom: 20px;
   padding-right: 30px;
}

.promo-3col > div:nth-child(1) span {
   transform: rotate(-4.69deg);
   left: -90px;
}

@media (max-width: 568px) {
   .promo-3col > div:nth-child(1) span {
      transform: rotate(-4.69deg);
   }
}

.promo-3col > div:nth-child(2) {
   margin-top: 124px;
}

.promo-3col > div:nth-child(2) .item {
   padding-right: 20px;
   padding-top: 40px;
}

.promo-3col > div:nth-child(2) span {
   transform: rotate(14.56deg);
   top: -60px;
   margin-bottom: -20px;
}

@media (max-width: 568px) {
   .promo-3col > div:nth-child(2) span {
      transform: rotate(8.95deg);
   }
}

.promo-3col > div:nth-child(3) {
   margin-top: 150px;
}

.promo-3col > div:nth-child(3) span {
   transform: rotate(-20.48deg);
   top: -25px;
   left: -70px;
   width: 130%;
}

@media (max-width: 568px) {
   .promo-3col > div:nth-child(3) span {
      width: inherit;
      transform: rotate(-11.28deg);
      margin-top: 10px;
      margin-bottom: 50px !important;
   }
}

.promo-3col .item p {
   font-size: 24px;
   line-height: 130%;
   margin-bottom: 0;
}

.h2-dark-1 {
   position: relative;
}

.h2-dark-1 h2 {
   font-weight: 700;
   font-size: 47px;
   line-height: 130%;
   max-width: 850px;
   margin: 0 auto 160px;
}

.h2-dark-1 h2 span {
   background: #a8fd32;
   border-radius: 13px;
   padding: 5px;
   padding-top: 0;
   padding-bottom: 8px;
   color: #1a1d23;
}

@media (max-width: 568px) {
   .h2-dark-1 h2 span {
      padding: 2px;
      border-radius: 9px;
      color: #1a1d23;
      margin-top: 5px;
      display: inline-block;
   }
}

@media (max-width: 568px) {
   .h2-dark-1 h2 {
      font-size: 30px;
      line-height: 110%;
   }
}

.h2-dark-1 svg {
   position: absolute;
}

.h2-dark-1 svg:nth-child(1) {
   left: 40px;
   top: -150px;
}

@media (max-width: 568px) {
   .h2-dark-1 svg:nth-child(1) {
      width: 70px;
      top: -120px;
      left: 20px;
   }
}

.h2-dark-1 svg:nth-child(4) {
   right: 0;
   bottom: 0;
}

@media (max-width: 568px) {
   .h2-dark-1 svg:nth-child(4) {
      width: 30px;
      right: 30px;
      bottom: -100px;
   }
}

.h2-dark-2 {
   margin-bottom: 140px;
   text-align: center;
}

.h2-dark-2 h2 {
   font-weight: 700;
   font-size: 47px;
   line-height: 110%;
   margin: 60px auto 55px;
   max-width: 850px;
}

@media (max-width: 568px) {
   .h2-dark-2 h2 {
      font-size: 30px;
      margin-top: 35px;
      margin-bottom: 30px;
   }
}

.h2-dark-2 svg {
   margin: 0 auto;
   display: flex;
   justify-content: center;
}

@media (max-width: 568px) {
   .h2-dark-2 svg {
      max-width: 70%;
   }
}

.promo-week {
   border-bottom: 1px solid #a8fd32;
   margin-bottom: 70px;
}

@media (max-width: 568px) {
   .promo-week {
      margin-bottom: 150px;
   }
}

.promo-week h3 {
   font-weight: 700;
   font-size: 24px;
}

.promo-week .item {
   border-top: 1px solid #a8fd32;
   padding-top: 40px;
   padding-bottom: 40px;
   margin-left: 0;
   margin-right: 0;
}

@media (max-width: 568px) {
   .promo-week .item {
      padding-top: 25px;
      padding-bottom: 25px;
   }
}

.promo-week .item.row > * {
   padding-right: 0;
   padding-left: 0;
}

.promo-week .item h5 {
   font-weight: 700;
   font-size: 25px;
}

@media (max-width: 568px) {
   .promo-week .item h5 {
      font-size: 20px;
      margin-bottom: 20px;
   }
}

.promo-week .item img {
   position: absolute;
   top: 0;
   bottom: 0;
   margin: auto;
   opacity: 0;
   transition: 0.3s ease;
   margin-left: -30px;
   max-width: 200px;
}

@media (max-width: 568px) {
   .promo-week .item div {
      order: -1;
   }
   .promo-week .item img {
      opacity: 1;
      position: inherit;
      max-width: 100px;
      margin-left: 0;
      margin-bottom: 30px;
   }
}

.promo-week .item:hover img {
   opacity: 1;
}

.promo-week .item p {
   font-size: 18px;
   line-height: 130%;
   opacity: 0.8;
   margin-bottom: 0;
}

@media (max-width: 568px) {
   .promo-week .item p {
      font-size: 14px;
      line-height: 140%;
   }
}

.promo-week2 {
   position: relative;
   margin-bottom: 220px;
}

@media (max-width: 568px) {
   .promo-week2 {
      margin-bottom: 80px;
   }
}

.promo-week2 > svg {
   position: absolute;
   right: 50px;
   top: 25%;
}

@media (max-width: 568px) {
   .promo-week2 > svg {
      right: -30px;
      width: 100px;
      top: 27%;
   }
}

.promo-week2 h3 {
   font-weight: 700;
   font-size: 25px;
}

.promo-week2 .item {
   border: 4px solid #909090;
   border-radius: 60px;
   padding: 52px 55px;
   background: #1d1d1d;
   margin-bottom: 30px;
}

@media (max-width: 568px) {
   .promo-week2 .item {
      border: 2px solid #909090;
      border-radius: 40px;
      padding: 30px;
      margin-bottom: 20px;
   }
}

.promo-week2 .item:nth-child(3) {
   max-width: 885px;
}

.promo-week2 .item:nth-child(4) {
   max-width: 685px;
   transform: rotate(-8.34deg) !important;
   margin-top: -30px;
   margin-bottom: 50px;
}

@media (max-width: 568px) {
   .promo-week2 .item:nth-child(4) {
      transform: none;
      margin-top: 0;
      margin-bottom: 20px;
   }
}

.promo-week2 .item:nth-child(5) {
   max-width: 885px;
}

.promo-week2 .item svg {
   margin-right: 30px;
   min-width: 64px;
   min-height: 64px;
}

@media (max-width: 568px) {
   .promo-week2 .item svg {
      margin-bottom: 20px;
   }
}

.promo-week2 .item h5 {
   font-weight: 700;
   font-size: 25px;
   margin-bottom: 10px;
}

@media (max-width: 568px) {
   .promo-week2 .item h5 {
   }
}

.promo-week2 .item p {
   font-size: 18px;
   line-height: 130%;
   margin-bottom: 0;
}

.promo-week2 .item a {
   background: #ffffff;
   font-weight: 700;
   border-radius: 42px;
   width: 265px;
   height: 62px;
   display: flex;
   justify-content: center;
   align-items: center;
   margin-top: 30px;
   color: #1a1d23;
   transform: scale(1);
   transition: 0.3s ease;
}

@media (max-width: 568px) {
   .promo-week2 .item a {
      width: 100%;
   }
}

.promo-week2 .item a:hover {
   transform: scale(1.05);
}

.promo-week2 .item a svg {
   margin-left: 20px;
   margin-right: 0;
   min-width: inherit;
   min-height: inherit;
   transition: 0.3s ease;
}

@media (max-width: 568px) {
   .promo-week2 .item a svg {
      margin-bottom: 0;
   }
}

.promo-week2 .item a:hover svg {
   margin-left: 30px;
   margin-right: -10px;
}

.promo-advantages-2 {
   margin-bottom: 220px;
}

.promo-advantages-2 .left {
   position: relative;
}

.promo-advantages-2 .left h3 {
   font-weight: 600;
   font-size: 25px;
   line-height: 120%;
   max-width: 240px;
}

.promo-advantages-2 .left svg {
   position: absolute;
   bottom: -100px;
   left: 50px;
}

@media (max-width: 568px) {
   .promo-advantages-2 .left svg {
      display: none;
   }
}

.promo-advantages-2 .right {
}

.promo-advantages-2 .right h4 {
   font-weight: 500;
   font-size: 36px;
   line-height: 110%;
   margin-bottom: 75px;
   opacity: 0.5;
}

@media (max-width: 568px) {
   .promo-advantages-2 .right h4 {
      font-size: 23px;
      line-height: 130%;
   }
}

.promo-advantages-2 .right .list {
   border-bottom: 1px solid #a8fd32;
}

.promo-advantages-2 .right .item {
   border-top: 1px solid #a8fd32;
   padding: 30px 0;
   margin: 0;
}

.promo-advantages-2 .right svg {
   width: auto;
   margin-right: 12px;
}

@media (max-width: 568px) {
   .promo-advantages-2 .right svg {
      margin-bottom: 10px;
   }
}

.promo-advantages-2 .right h5 {
   font-weight: 600;
   font-size: 18px;
   line-height: 170%;
}

@media (max-width: 568px) {
   .promo-advantages-2 .right h5 {
      font-size: 20px;
      line-height: 120%;
   }
}

.promo-advantages-2 .right p {
   font-size: 18px;
   line-height: 130%;
   opacity: 0.8;
   margin-bottom: 0;
   min-width: 51%;
}

@media (max-width: 568px) {
   .promo-advantages-2 .right p {
      font-size: 14px;
      line-height: 140%;
   }
}

.promo-specialists {
   margin-bottom: 140px;
}

.promo-specialists > div {
   /*overflow-x: auto;*/
   /*margin-left: calc(50% - 50vw);*/
   /*margin-right: calc(50% - calc(50vw - 9px));*/
}

@media (max-width: 568px) {
   .promo-specialists > div {
      overflow-x: auto;
      margin-left: -16px;
      padding-left: 16px;
      margin-right: -16px;
      padding-right: 16px;
   }
}

.promo-specialists > div::-webkit-scrollbar {
   display: none;
}

.promo-specialists h3 {
   font-weight: 600;
   font-size: 25px;
}

.promo-specialists .item {
   /*margin-right: 60px;*/
   /*max-width: 400px;*/
   margin-top: 70px;
}

.promo-specialists .item:nth-child(-n + 2) {
   margin-top: 0;
}

@media (max-width: 568px) {
   .promo-specialists .item {
      min-width: 240px;
      margin-right: 10px;
      max-width: 280px;
      margin-top: 0;
   }
}

.promo-specialists .item svg {
   margin-bottom: 20px;
   height: 110px;
}

.promo-specialists .item h5 {
   font-weight: 600;
   font-size: 25px;
   opacity: 0.3;
   margin-bottom: 10px;
}

@media (max-width: 568px) {
   .promo-specialists .item h5 {
      font-size: 20px;
   }
}

.promo-specialists .item p {
   font-size: 18px;
   line-height: 130%;
   margin-bottom: 0;
   max-width: 500px;
}

@media (max-width: 568px) {
   .promo-specialists .item p {
      font-size: 16px;
      line-height: 130%;
   }
}

.promo-line {
   margin-top: 140px;
}

.promo-line h3 {
   font-weight: 600;
   font-size: 25px;
   margin-bottom: 30px;
}

.promo-line .marquee-0 {
   position: relative;
   margin-bottom: 270px;
}

@media (max-width: 568px) {
   .promo-line .marquee-0 {
      margin-bottom: 100px;
   }
}

.promo-line .marquee {
   background: #a8fd32;
   transform: rotate(3.28deg);
   position: relative;
   margin-top: 50px;
}

.promo-line .marquee--reverse {
   transform: rotate(-3.75deg);
   background: #89d620;
   position: absolute;
   top: 0;
   z-index: -1;
}

.promo-line .marquee .marquee__group {
   background: #a8fd32;
}

.promo-line .marquee--reverse .marquee__group {
   background: #89d620;
}

.promo-line .marquee:hover .marquee__group {
   animation-play-state: inherit;
}

@media (max-width: 568px) {
   .promo-line .marquee--reverse {
      position: relative;
      top: -50px;
   }
}

.promo-line .marquee p {
   color: #333333;
   font-weight: 700;
   font-size: 47px;
}

@media (max-width: 568px) {
   .promo-line .marquee p {
      font-size: 24px;
   }
}

.promo-black-form {
   border: 3px solid #909090;
   border-radius: 60px;
   padding: 80px 85px;
   position: relative;
}

@media (max-width: 568px) {
   .promo-black-form {
      padding: 30px 20px;
   }
}

.promo-black-form > svg {
   position: absolute;
   top: -110px;
   right: 0;
}

@media (max-width: 568px) {
   .promo-black-form > svg {
      top: -100px;
      width: 100px;
   }
}

.promo-black-form h2 {
   font-weight: 600;
   font-size: 50px;
   line-height: 120%;
   margin-bottom: 80px;
}

@media (max-width: 568px) {
   .promo-black-form h2 {
      font-size: 30px;
      line-height: 110%;
      margin-bottom: 40px;
   }
}

.promo-black-form h2 span {
   background: #a8fd32;
   border-radius: 14px;
   padding: 5px;
   color: #333333;
}

.promo-black-form form {
}

.promo-black-form form > div {
   max-width: 100%;
}

.promo-black-form form input {
   border-radius: 42px;
   border: none;
   outline: none;
   width: 100%;
   height: 96px;
   display: flex;
   justify-content: center;
   align-items: center;
   margin-top: 30px;
   text-align: center;
   padding: 0 10px;
}

@media (max-width: 568px) {
   .promo-black-form form input {
      height: 55px;
   }
}

.promo-black-form form input[type="text"] {
   background: #333333;
   border-radius: 42px;
   font-weight: 600;
   font-size: 24px;
   color: #a8fd32;
}

.promo-black-form form input[type="text"]::placeholder {
   color: #909090;
}

@media (max-width: 568px) {
   .promo-black-form form input[type="text"] {
      font-size: 17px;
      min-width: 100%;
   }
}

.promo-black-form form input[type="submit"] {
   background: #a8fd32;
   color: #333333;
   transition: 0.3s ease;
   border: 2px solid #a8fd32;
   margin-top: 0;
   font-weight: 500;
}

@media (max-width: 568px) {
   .promo-black-form form input[type="submit"] {
      font-size: 24px;
   }
}

.promo-black-form form input[type="submit"]:hover {
   background: inherit;
   border: 2px solid #a8fd32;
   color: #a8fd32;
}

.promo-footer {
   border-top: 1px solid #dbdbdb;
   margin: 180px 125px 40px;
   padding-top: 40px;
}

@media (max-width: 568px) {
   .promo-footer {
      margin-top: 100px;
      margin-left: 16px;
      margin-right: 16px;
      text-align: center;
   }
   .promo-footer div {
      justify-content: center;
   }
}

.promo-footer a {
   font-weight: 500;
   font-size: 16px;
}

@media (max-width: 568px) {
   .promo-footer > a {
      text-align: center;
      margin: 0 auto;
   }
}

.promo-footer > div a {
   margin-right: 25px;
   position: relative;
}

@media (max-width: 568px) {
   .promo-footer div a {
      margin-right: 10px;
      margin-left: 10px;
      margin-bottom: 20px;
   }
}

.promo-footer > div a.link-pdf:hover {
   color: initial;
}

.promo-footer > div a.link-pdf:before {
   content: "PDF";
   font-weight: 500;
   font-size: 8px;
   background: #f0ddf3;
   border-radius: 100px;
   width: 26px;
   height: 14px;
   display: flex;
   justify-content: center;
   align-items: center;
   position: absolute;
   right: -30px;
   top: 0px;
}

.video-js .vjs-big-play-button:before,
.video-js .vjs-control:before,
.video-js .vjs-modal-dialog,
.vjs-modal-dialog .vjs-modal-dialog-content {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   /*font-family: "Ionicons", "Questrial" !important;*/
   cursor: pointer;
}

.video-js .vjs-big-play-button:before,
.video-js .vjs-control:before {
   text-align: center;
}

.vjs-icon-play:before,
.video-js .vjs-big-play-button:before,
.video-js .vjs-play-control:before {
   /*content: "\f488";*/
   content: "смотреть";
   font-family: "CraftworkGrotesk", sans-serif;
   position: initial;
   font-weight: 600;
}

.vjs-icon-play-circle:before {
   content: "\f488";
}

.vjs-icon-pause:before,
.video-js .vjs-play-control.vjs-playing:before {
   content: "\f478";
}

.vjs-icon-volume-mute:before,
.video-js .vjs-mute-control.vjs-vol-0:before,
.video-js .vjs-volume-menu-button.vjs-vol-0:before {
   content: "\f3b8";
}

.vjs-icon-volume-low:before,
.video-js .vjs-mute-control.vjs-vol-1:before,
.video-js .vjs-volume-menu-button.vjs-vol-1:before {
   content: "\f258";
}

.vjs-icon-volume-mid:before,
.video-js .vjs-mute-control.vjs-vol-2:before,
.video-js .vjs-volume-menu-button.vjs-vol-2:before {
   content: "\f259";
}

.vjs-icon-volume-high:before,
.video-js .vjs-mute-control:before,
.video-js .vjs-volume-menu-button:before {
   content: "\f257";
}

.vjs-icon-fullscreen-enter:before,
.video-js .vjs-fullscreen-control:before {
   content: "\f3d8";
}

.vjs-icon-fullscreen-exit:before,
.video-js.vjs-fullscreen .vjs-fullscreen-control:before {
   content: "\f3d0";
}

.vjs-icon-square:before {
   content: "\f371";
}

.vjs-icon-spinner:before {
   content: "\f29c";
}

.vjs-icon-subtitles:before,
.video-js .vjs-subtitles-button:before {
   content: "\f3fa";
}

.vjs-icon-captions:before,
.video-js .vjs-captions-button:before {
   content: "\f3fa";
}

.vjs-icon-chapters:before,
.video-js .vjs-chapters-button:before {
   content: "\f453";
}

.vjs-icon-share:before {
   content: "\f3ac";
}

.vjs-icon-cog:before {
   content: "\f43d";
}

.vjs-icon-circle:before,
.video-js .vjs-mouse-display:before,
.video-js .vjs-play-progress:before,
.video-js .vjs-volume-level:before {
   content: "";
}

.vjs-icon-circle-outline:before {
   content: "";
}

.vjs-icon-circle-inner-circle:before {
   content: "";
}

.vjs-icon-hd:before {
   content: "\f4cd";
}

.vjs-icon-cancel:before,
.video-js .vjs-control.vjs-close-button:before {
   content: "\f406";
}

.vjs-icon-replay:before {
   content: "\f49c";
}

.vjs-icon-facebook:before {
   content: "\f231";
}

.vjs-icon-gplus:before {
   content: "\f235";
}

.vjs-icon-linkedin:before {
   content: "";
}

.vjs-icon-twitter:before {
   content: "\f243";
}

.vjs-icon-tumblr:before {
   content: "\f241";
}

.vjs-icon-pinterest:before {
   content: "\f2b1";
}

.vjs-icon-audio-description:before {
   content: "";
}

.video-js {
   width: 100%;
   height: 100%;
   top: 0px;
   left: 0px;
   vertical-align: top;
   box-sizing: border-box;
   color: #fff;
   background: #000;
   /*position: absolute;*/
   position: relative;
   padding: 0;
   font-size: 10px;
   line-height: 1;
   font-weight: normal;
   font-style: normal;
   font-family: "Ionicons", "Questrial" !important;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
   overflow: hidden;
}

.video-js:-moz-full-screen {
   /*position: absolute;*/
}

.video-js:-webkit-full-screen {
   width: 100% !important;
   height: 100% !important;
}

.video-js *,
.video-js *:before,
.video-js *:after {
   box-sizing: inherit;
}

.video-js ul {
   font-family: inherit;
   font-size: inherit;
   line-height: inherit;
   list-style-position: outside;
   margin-left: 0;
   margin-right: 0;
   margin-top: 0;
   margin-bottom: 0;
}

.video-js.vjs-fluid,
.video-js.vjs-16-9,
.video-js.vjs-4-3 {
   width: 100%;
   max-width: 100%;
   height: 0;
}

.video-js.vjs-16-9 {
   padding-top: 56.25%;
}

.video-js.vjs-4-3 {
   padding-top: 75%;
}

.video-js.vjs-fill {
   width: 100%;
   height: 100%;
}

.video-js .vjs-tech {
   /*position: absolute;*/
   position: relative;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
}

body.vjs-full-window {
   padding: 0;
   margin: 0;
   height: 100%;
   overflow-y: auto;
}

.vjs-full-window .video-js.vjs-fullscreen {
   position: fixed;
   overflow: hidden;
   z-index: 1000;
   left: 0;
   top: 0;
   bottom: 0;
   right: 0;
}

.video-js.vjs-fullscreen {
   width: 100% !important;
   height: 100% !important;
   padding-top: 0 !important;
}

.video-js.vjs-fullscreen.vjs-user-inactive,
.vjs-user-inactive {
   cursor: none;
}

.vjs-hidden {
   display: none !important;
}

.video-js .vjs-offscreen {
   height: 1px;
   left: -9999px;
   position: absolute;
   top: 0;
   width: 1px;
}

.vjs-lock-showing {
   display: block !important;
   opacity: 1;
   visibility: visible;
}

.vjs-no-js {
   padding: 20px;
   color: #fff;
   background-color: #000;
   font-size: 18px;
   font-family: Arial, Helvetica, sans-serif;
   text-align: center;
   width: 300px;
   height: 150px;
   margin: 0px auto;
}

.vjs-no-js a,
.vjs-no-js a:visited {
   color: #66a8cc;
}

.video-js .vjs-big-play-button,
.PAGE_ABOUT_VIDEO a {
   font-size: 16px;
   font-weight: 500;
   line-height: 100px;
   height: 120px;
   width: 120px;
   /*display: block;*/
   position: absolute;
   /*text-indent: 5px;*/
   top: calc(50% - 60px);
   left: calc(50% - 60px);
   padding: 0;
   text-align: center;
   cursor: pointer;
   background: #a8fd32;
   color: #1a1d23;
   -webkit-border-radius: 100%;
   -moz-border-radius: 100%;
   border-radius: 100%;
   outline: none;
   /*-webkit-backdrop-filter: blur(20px) saturate(1.5) brightness(1.2);*/
   /*backdrop-filter: blur(20px) saturate(1.5) brightness(1.2);*/
}
.video-js .vjs-big-play-button:hover {
   border: 10px solid #a8fd32;
}
/*.video-js .vjs-big-play-button:after {
	content: 'Interstellar';
	font-family: 'Questrial';
	font-size: 35%;
	line-height: 38px;
	height: auto;
	width: auto;
	position: absolute;
	top: 5px;
	left: 100px;
	padding: 0 15px;
	text-align: center;
	background: #111;
	box-shadow: 0 2px 5px 0 rgba(0,0,0,0.1),0 2px 10px 0 rgba(0,0,0,0.1);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}*/

.vjs-controls-disabled .vjs-big-play-button,
.vjs-has-started .vjs-big-play-button,
.vjs-using-native-controls .vjs-big-play-button,
.vjs-error .vjs-big-play-button {
   display: none;
}

.video-js button {
   background: none;
   border: none;
   color: inherit;
   display: inline-block;
   overflow: visible;
   font-size: inherit;
   line-height: inherit;
   text-transform: none;
   text-decoration: none;
   transition: none;
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
}

.video-js .vjs-control.vjs-close-button {
   cursor: pointer;
   height: 3em;
   position: absolute;
   right: 0;
   top: 0.5em;
   z-index: 2;
}

.vjs-menu-button {
   cursor: pointer;
}

.vjs-menu .vjs-menu-content {
   display: block;
   padding: 0;
   margin: 0;
   overflow: auto;
}

.vjs-scrubbing .vjs-menu-button:hover .vjs-menu {
   display: none;
}

.vjs-menu li {
   list-style: none;
   margin: 2px 0px;
   padding: 8px 15px;
   font-size: 14px;
   text-align: center;
   text-transform: lowercase;
   color: rgba(255, 255, 255, 0.6);
   border-radius: 3px;
   transition: all 0.15s ease;
   outline: none;
}

.vjs-menu li:hover {
   color: rgba(255, 255, 255, 0.85);
   text-shadow: 0 0 3px rgba(255, 255, 255, 0.5);
}
.vjs-menu li:active {
   transform: scale(0.9);
}

.vjs-menu li.vjs-selected,
.vjs-menu li.vjs-selected:focus,
.vjs-menu li.vjs-selected:hover {
   color: rgba(255, 255, 255, 1);
   text-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
   /*background: -webkit-linear-gradient(to top, #FF7539 0%, #FFAB00 100%);
    background: linear-gradient(to top, #FF7539 0%, #FFAB00 100%);*/
}

.vjs-menu li.vjs-menu-title {
   text-align: center;
   text-transform: uppercase;
   font-size: 1em;
   line-height: 2em;
   padding: 0;
   margin: 0 0 0.3em 0;
   font-weight: bold;
   cursor: default;
}

.vjs-menu-button-popup .vjs-menu {
   display: none;
   position: absolute;
   bottom: 0;
   width: 50px;
   left: -3em;
   height: 0em;
   margin-bottom: 1.5em;
   border-top-color: rgba(43, 51, 63, 0.7);
}

.vjs-menu-button-popup .vjs-menu .vjs-menu-content {
   display: block;
   padding: 5px;
   /*background: -webkit-linear-gradient(top, rgba(30,30,30,.9), rgba(10,10,10,.9));
    background: linear-gradient(to bottom , rgba(30,30,30,.9), rgba(10,10,10,.9));
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.05), 0 0 10px rgba(0,0,0,.3);*/
   border-radius: 3px;
   color: #fff;
   font-size: 100%;
   margin-bottom: 8px;
   -webkit-transition: all 0.15s;
   transition: all 0.15s;
   position: absolute;
   bottom: 15px;
   float: left;
}

.vjs-menu-button-popup:hover .vjs-menu,
.vjs-menu-button-popup .vjs-menu.vjs-lock-showing {
   display: block;
}

.video-js .vjs-menu-button-inline {
   -webkit-transition: all 0.4s;
   -moz-transition: all 0.4s;
   -o-transition: all 0.4s;
   transition: all 0.4s;
   overflow: hidden;
}

.video-js .vjs-menu-button-inline:before {
   width: 2.222222222em;
}

.video-js .vjs-menu-button-inline:hover,
.video-js .vjs-menu-button-inline:focus,
.video-js .vjs-menu-button-inline.vjs-slider-active,
.video-js.vjs-no-flex .vjs-menu-button-inline {
   width: 10em;
}

.video-js .vjs-menu-button-inline.vjs-slider-active {
   -webkit-transition: none;
   -moz-transition: none;
   -o-transition: none;
   transition: none;
}

.vjs-menu-button-inline .vjs-menu {
   opacity: 0;
   height: 100%;
   width: auto;
   position: absolute;
   left: 4em;
   top: 0;
   padding: 0;
   margin: 0;
   -webkit-transition: all 0.4s;
   -moz-transition: all 0.4s;
   -o-transition: all 0.4s;
   transition: all 0.4s;
}

.vjs-menu-button-inline:hover .vjs-menu,
.vjs-menu-button-inline:focus .vjs-menu,
.vjs-menu-button-inline.vjs-slider-active .vjs-menu {
   display: block;
   opacity: 1;
}

.vjs-no-flex .vjs-menu-button-inline .vjs-menu {
   display: block;
   opacity: 1;
   position: relative;
   width: auto;
}

.vjs-no-flex .vjs-menu-button-inline:hover .vjs-menu,
.vjs-no-flex .vjs-menu-button-inline:focus .vjs-menu,
.vjs-no-flex .vjs-menu-button-inline.vjs-slider-active .vjs-menu {
   width: auto;
}

.vjs-menu-button-inline .vjs-menu-content {
   width: auto;
   height: 100%;
   margin: 0;
   overflow: hidden;
}

.video-js .vjs-control-bar {
   display: none;
   width: 700px;
   position: absolute;
   bottom: 20px;
   left: calc(50% - 350px);
   height: 50px;
   border-radius: 5px;
   background: rgba(0, 0, 0, 0.6);
   -webkit-backdrop-filter: blur(20px) saturate(1.5) brightness(1.2);
   backdrop-filter: blur(20px) saturate(1.5) brightness(1.2);
}

@media screen and (max-width: 740px) {
   .video-js .vjs-control-bar {
      width: calc(100% - 40px);
      bottom: 20px;
      left: 20px;
   }
}

.vjs-has-started .vjs-control-bar {
   /*display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    visibility: visible;
    opacity: 1;
    transform-origin: center bottom;
    transition: all .15s cubic-bezier(.44,.14,.34,.97), width 0s, left 0s;*/
   display: none;
}

.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
   visibility: hidden;
   opacity: 0;
   bottom: 5px;
   transition: 0.15s cubic-bezier(0.44, 0.14, 0.34, 0.97);
}

.vjs-controls-disabled .vjs-control-bar,
.vjs-using-native-controls .vjs-control-bar,
.vjs-error .vjs-control-bar {
   display: none !important;
}

.vjs-audio.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
   opacity: 1;
   visibility: visible;
}

@media screen {
   .vjs-user-inactive.vjs-playing .vjs-control-bar:before {
      content: "";
   }
}

.vjs-has-started.vjs-no-flex .vjs-control-bar {
   display: table;
}

.video-js .vjs-control {
   outline: none;
   position: relative;
   text-align: center;
   margin: 0;
   padding: 0;
   height: 100%;
   width: 50px;
   font-size: 120%;
   -webkit-box-flex: none;
   -moz-box-flex: none;
   -webkit-flex: none;
   -ms-flex: none;
   flex: none;
}

.video-js .vjs-control:before {
   font-size: 200%;
   line-height: 50px;
   color: #fff;
}

.video-js .vjs-control-text {
   border: 0;
   clip: rect(0 0 0 0);
   height: 1px;
   margin: -1px;
   overflow: hidden;
   visibility: hidden;
   padding: 0;
   position: absolute;
   width: 1px;
}

.vjs-no-flex .vjs-control {
   display: table-cell;
   vertical-align: middle;
}

.video-js .vjs-custom-control-spacer {
   display: none;
}

.video-js .vjs-progress-control {
   -webkit-box-flex: auto;
   -moz-box-flex: auto;
   -webkit-flex: auto;
   -ms-flex: auto;
   flex: auto;
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -webkit-align-items: center;
   -ms-flex-align: center;
   align-items: center;
}

.vjs-live .vjs-progress-control {
   display: none;
}

.video-js .vjs-progress-holder {
   -webkit-box-flex: auto;
   -moz-box-flex: auto;
   -webkit-flex: auto;
   -ms-flex: auto;
   flex: auto;
   -webkit-transition: all 0.2s;
   -moz-transition: all 0.2s;
   -o-transition: all 0.2s;
   transition: all 0.2s;
   height: 5px;
   border-radius: 5px;
}

.video-js .vjs-progress-control:hover .vjs-mouse-display:after,
.video-js .vjs-progress-control:hover .vjs-play-progress:after {
   display: block;
   font-size: 120%;
}

.video-js .vjs-progress-holder .vjs-play-progress,
.video-js .vjs-progress-holder .vjs-load-progress,
.video-js .vjs-progress-holder .vjs-load-progress div {
   position: absolute;
   display: block;
   height: 5px;
   margin: 0;
   padding: 0;
   width: 0;
   left: 0;
   top: 0;
   border-radius: 5px;
}

.video-js .vjs-mouse-display:before {
   display: none;
}

.video-js .vjs-play-progress {
   background: #fff;
   border-radius: 10px;
   transition: all 0.25s linear;
}

.video-js .vjs-mouse-display:after,
.video-js .vjs-play-progress:after {
   display: none;
   position: absolute;
   top: -28px;
   right: 0;
   font-size: 12px !important;
   color: transparent;
   content: attr(data-current-time);
   padding: 8px;
   pointer-events: none;
   transition: 0.2s ease;
}

.video-js .vjs-play-progress:before,
.video-js .vjs-play-progress:after {
   z-index: 10;
}

.video-js .vjs-load-progress {
   background: rgba(255, 255, 255, 0.3);
   transition: width 0.25s linear;
}

.video-js .vjs-load-progress div {
   background: rgba(0, 0, 0, 0.2);
}

.video-js.vjs-no-flex .vjs-progress-control {
   width: auto;
}

.video-js .vjs-progress-control .vjs-mouse-display {
   position: absolute;
}

.vjs-no-flex .vjs-progress-control .vjs-mouse-display {
   z-index: 0;
}

.video-js .vjs-progress-control:hover .vjs-mouse-display {
   display: block;
}

.video-js.vjs-user-inactive .vjs-progress-control .vjs-mouse-display,
.video-js.vjs-user-inactive .vjs-progress-control .vjs-mouse-display:after {
   visibility: hidden;
   opacity: 0;
   -webkit-transition: visibility 1s, opacity 1s;
   -moz-transition: visibility 1s, opacity 1s;
   -o-transition: visibility 1s, opacity 1s;
   transition: visibility 1s, opacity 1s;
}

.video-js.vjs-user-inactive.vjs-no-flex
   .vjs-progress-control
   .vjs-mouse-display,
.video-js.vjs-user-inactive.vjs-no-flex
   .vjs-progress-control
   .vjs-mouse-display:after {
   display: none;
}

.video-js .vjs-progress-control .vjs-mouse-display:after {
   color: #999;
   background: #222;
   border-radius: 5px 5px 0px 5px;
   visibility: visible;
}

.video-js .vjs-slider {
   outline: 0;
   position: relative;
   cursor: pointer;
   padding: 0;
   margin: 0 0.45em 0 0.45em;
   background: rgba(255, 255, 255, 0.15);
}

.video-js .vjs-mute-control,
.video-js .vjs-volume-menu-button {
   cursor: pointer;
   -webkit-box-flex: none;
   -moz-box-flex: none;
   -webkit-flex: none;
   -ms-flex: none;
   flex: none;
}

.video-js .vjs-volume-control {
   width: 5em;
   -webkit-box-flex: none;
   -moz-box-flex: none;
   -webkit-flex: none;
   -ms-flex: none;
   flex: none;
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -webkit-align-items: center;
   -ms-flex-align: center;
   align-items: center;
}

.video-js .vjs-volume-bar {
   margin: 1.35em 0.45em;
   top: 9px;
   border-radius: 5px;
}

.vjs-volume-bar.vjs-slider-horizontal {
   width: 50px;
   height: 5px;
   border-radius: 5px;
}

.vjs-volume-bar.vjs-slider-vertical {
   width: 5px;
   height: 50px;
   margin: 1.35em auto;
   border-radius: 5px;
}

.video-js .vjs-volume-level {
   position: absolute;
   bottom: 0;
   left: 0;
   background: #fff;
   border-radius: 5px;
   transition: all 0s;
}

/*.video-js .vjs-volume-level:before {
	content: '';
	position: absolute;
	width: 9px;
	height: 9px;
	bottom: -2px;
	right: -6px;
	background: #fff;
	border-radius: 50px;
}*/

.vjs-slider-vertical .vjs-volume-level {
   width: 5px;
}

.vjs-slider-vertical .vjs-volume-level:before {
   top: -0.5em;
   left: -0.3em;
}

.vjs-slider-horizontal .vjs-volume-level {
   height: 5px;
}

.vjs-slider-horizontal .vjs-volume-level:before {
   top: -2px;
   right: -0.5em;
}

.vjs-volume-bar.vjs-slider-vertical .vjs-volume-level {
   height: 100%;
}

.vjs-volume-bar.vjs-slider-horizontal .vjs-volume-level {
   width: 100%;
}

.vjs-menu-button-popup.vjs-volume-menu-button .vjs-menu {
   display: block;
   width: 0;
   height: 0;
   border-top-color: transparent;
}

.vjs-menu-button-popup.vjs-volume-menu-button-vertical .vjs-menu {
   left: 0.5em;
   height: 8em;
}

.vjs-menu-button-popup.vjs-volume-menu-button-horizontal .vjs-menu {
   left: -2em;
}

.vjs-menu-button-popup.vjs-volume-menu-button .vjs-menu-content {
   height: 0;
   width: 0;
   overflow-x: hidden;
   overflow-y: hidden;
}

.vjs-volume-menu-button-vertical:hover .vjs-menu-content,
.vjs-volume-menu-button-vertical .vjs-lock-showing .vjs-menu-content {
   height: 50px;
   width: 85px;
}

.vjs-volume-menu-button-horizontal:hover .vjs-menu-content,
.vjs-volume-menu-button-horizontal .vjs-lock-showing .vjs-menu-content {
   height: 50px;
   width: 60px;
}

.vjs-volume-menu-button.vjs-menu-button-inline .vjs-menu-content {
   background-color: transparent !important;
}

.vjs-poster {
   background-repeat: no-repeat;
   background-position: 50% 50%;
   background-size: cover;
   cursor: pointer;
   height: 100%;
   margin: 0;
   padding: 0;
   position: relative;
   width: 100%;
}
.vjs-poster img {
   display: block;
   margin: 0 auto;
   max-height: 100%;
   padding: 0;
   width: 100%;
}

.vjs-has-started .vjs-poster {
   visibility: hidden;
   opacity: 0;
}

.vjs-audio.vjs-has-started .vjs-poster {
   visibility: visible;
}

.vjs-controls-disabled .vjs-poster {
   visibility: hidden;
   display: none;
}

.vjs-using-native-controls .vjs-poster {
   visibility: hidden;
   display: none;
}

.video-js .vjs-live-control {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: flex-start;
   -webkit-align-items: flex-start;
   -ms-flex-align: flex-start;
   align-items: flex-start;
   -webkit-box-flex: auto;
   -moz-box-flex: auto;
   -webkit-flex: auto;
   -ms-flex: auto;
   flex: auto;
   font-size: 1em;
   line-height: 3em;
}

.vjs-no-flex .vjs-live-control {
   display: table-cell;
   width: auto;
   text-align: left;
}

.video-js .vjs-time-control {
   -webkit-box-flex: none;
   -moz-box-flex: none;
   -webkit-flex: none;
   -ms-flex: none;
   flex: none;
   font-size: 100%;
   line-height: 50px;
   color: rgba(255, 255, 255, 0.8);
}

.vjs-live .vjs-time-control {
   display: none;
}

.video-js .vjs-current-time,
.vjs-no-flex .vjs-current-time {
   display: block;
}

.video-js .vjs-duration,
.vjs-no-flex .vjs-duration {
   display: block;
}
.vjs-duration.vjs-control,
.vjs-current-time.vjs-control {
   width: auto !important;
   padding: 0 10px;
}

.vjs-time-divider {
   line-height: 50px;
   width: 2px;
   transform: translateX(-2px);
}
.vjs-time-divider div span {
   font-size: 150%;
   color: rgba(255, 255, 255, 0.8);
}

.vjs-live .vjs-time-divider {
   display: none;
}

.video-js .vjs-play-control {
   cursor: pointer;
   -webkit-box-flex: none;
   -moz-box-flex: none;
   -webkit-flex: none;
   -ms-flex: none;
   flex: none;
}
.video-js .vjs-play-control:after {
   content: "Play/Pause";
   position: absolute;
   top: -40px;
   left: 0px;
   width: auto;
   height: auto;
   background: #111;
   box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1), 0 2px 10px 0 rgba(0, 0, 0, 0.1);
   border-radius: 5px;
   color: #ddd;
   text-align: center;
   letter-spacing: 1px;
   padding: 10px 15px;
   pointer-events: none;
   opacity: 0;
   transition: 0.2s ease;
   transition-delay: 0s;
}
.video-js .vjs-play-control:hover:after {
   opacity: 1;
   transition-delay: 1.3s;
}

.vjs-text-track-display {
   position: absolute;
   bottom: 3em;
   left: 0;
   right: 0;
   top: 0;
   pointer-events: none;
}

.video-js.vjs-user-inactive.vjs-playing .vjs-text-track-display {
   bottom: 1em;
}

.video-js .vjs-text-track {
   font-size: 1.4em;
   text-align: center;
   margin-bottom: 0.1em;
   background-color: #000;
   background-color: rgba(0, 0, 0, 0.5);
}

.vjs-subtitles {
   color: #fff;
}

.vjs-captions {
   color: #fc6;
}

.vjs-tt-cue {
   display: block;
}

video::-webkit-media-text-track-display {
   -moz-transform: translateY(-3em);
   -ms-transform: translateY(-3em);
   -o-transform: translateY(-3em);
   -webkit-transform: translateY(-3em);
   transform: translateY(-3em);
}

.video-js.vjs-user-inactive.vjs-playing
   video::-webkit-media-text-track-display {
   -moz-transform: translateY(-1.5em);
   -ms-transform: translateY(-1.5em);
   -o-transform: translateY(-1.5em);
   -webkit-transform: translateY(-1.5em);
   transform: translateY(-1.5em);
}

.video-js .vjs-fullscreen-control {
   cursor: pointer;
   -webkit-box-flex: none;
   -moz-box-flex: none;
   -webkit-flex: none;
   -ms-flex: none;
   flex: none;
}
.video-js .vjs-fullscreen-control:after {
   content: "Fullscreen";
   position: absolute;
   top: -40px;
   right: 0px;
   width: auto;
   height: auto;
   background: #111;
   box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1), 0 2px 10px 0 rgba(0, 0, 0, 0.1);
   border-radius: 5px;
   color: #ddd;
   text-align: center;
   letter-spacing: 1px;
   padding: 10px 15px;
   pointer-events: none;
   opacity: 0;
   transition: 0.2s ease;
   transition-delay: 0s;
}
.video-js .vjs-fullscreen-control:hover:after {
   opacity: 1;
   transition-delay: 1.3s;
}

.vjs-playback-rate .vjs-playback-rate-value {
   font-size: 120%;
   line-height: 50px;
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   text-align: center;
}

.vjs-playback-rate .vjs-menu {
   transform: translateX(0%);
}

.vjs-error .vjs-error-display .vjs-modal-dialog-content {
   font-size: 1.4em;
   text-align: center;
}

.vjs-error .vjs-error-display:before {
   color: #fff;
   content: "X";
   font-family: Arial, Helvetica, sans-serif;
   font-size: 4em;
   left: 0;
   line-height: 1;
   margin-top: -0.5em;
   position: absolute;
   text-shadow: 0.05em 0.05em 0.1em #000;
   text-align: center;
   top: 50%;
   vertical-align: middle;
   width: 100%;
}

.vjs-loading-spinner {
   position: absolute;
   top: 5px;
   left: calc(50% - 65px);
   width: 130px;
   height: 40px;
   border-radius: 5px;
   background: #111;
   overflow: hidden;
   visibility: hidden;
   opacity: 0;
   transition: all 0.25s ease;
   display: none;
}
.vjs-loading-spinner:before {
   content: "";
   position: absolute;
   top: 10px;
   left: 10px;
   width: 20px;
   height: 20px;
   border-radius: 100%;
   border: solid transparent 2px;
   border-top-color: #fff;
   -webkit-animation: rotate 1s infinite linear;
   animation: rotate 1s infinite linear;
}
.vjs-loading-spinner:after {
   content: "Loading";
   position: absolute;
   top: 0px;
   right: 5px;
   width: 90px;
   height: 40px;
   line-height: 40px;
   font-size: 150%;
   text-align: center;
}

.vjs-seeking .vjs-loading-spinner,
.vjs-waiting .vjs-loading-spinner {
   visibility: visible;
   opacity: 1;
   top: 20px;
}

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

.vjs-chapters-button .vjs-menu {
   left: -10em;
   width: 0;
}

.vjs-chapters-button .vjs-menu ul {
   width: 24em;
}

.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-custom-control-spacer {
   -webkit-box-flex: auto;
   -moz-box-flex: auto;
   -webkit-flex: auto;
   -ms-flex: auto;
   flex: auto;
}

.video-js.vjs-layout-tiny:not(.vjs-fullscreen).vjs-no-flex
   .vjs-custom-control-spacer {
   width: auto;
}

.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-current-time,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-captions-button,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-time-divider,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-progress-control,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-duration,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-remaining-time,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-playback-rate,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-mute-control,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-volume-control,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-chapters-button,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-captions-button,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-subtitles-button,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-volume-menu-button {
   display: none;
}

.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-current-time,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-captions-button,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-time-divider,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-duration,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-remaining-time,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-playback-rate,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-captions-button,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-mute-control,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-volume-control,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-chapters-button,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-subtitles-button,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-volume-button,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-fullscreen-control {
   display: none;
}

.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-current-time,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-captions-button,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-time-divider,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-duration,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-remaining-time,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-playback-rate,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-mute-control,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-volume-control,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-chapters-button,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-subtitles-button {
   display: none;
}

.vjs-remaining-time {
   display: none;
}
.vjs-caption-settings {
   position: relative;
   top: 1em;
   /*background-color: #2B333F;
    background-color: rgba(43, 51, 63, 0.75);*/
   color: #fff;
   margin: 0 auto;
   padding: 0.5em;
   height: 15em;
   font-size: 12px;
   width: 40em;
}

.vjs-caption-settings .vjs-tracksettings {
   top: 0;
   bottom: 2em;
   left: 0;
   right: 0;
   position: absolute;
   overflow: auto;
}

.vjs-caption-settings .vjs-tracksettings-colors,
.vjs-caption-settings .vjs-tracksettings-font {
   float: left;
}

.vjs-caption-settings .vjs-tracksettings-colors:after,
.vjs-caption-settings .vjs-tracksettings-font:after,
.vjs-caption-settings .vjs-tracksettings-controls:after {
   clear: both;
}

.vjs-caption-settings .vjs-tracksettings-controls {
   position: absolute;
   bottom: 1em;
   right: 1em;
}

.vjs-caption-settings .vjs-tracksetting {
   margin: 5px;
   padding: 3px;
   min-height: 40px;
}

.vjs-caption-settings .vjs-tracksetting label {
   display: block;
   width: 100px;
   margin-bottom: 5px;
}

.vjs-caption-settings .vjs-tracksetting span {
   display: inline;
   margin-left: 5px;
}

.vjs-caption-settings .vjs-tracksetting > div {
   margin-bottom: 5px;
   min-height: 20px;
}

.vjs-caption-settings .vjs-tracksetting > div:last-child {
   margin-bottom: 0;
   padding-bottom: 0;
   min-height: 0;
}

.vjs-caption-settings label > input {
   margin-right: 10px;
}

.vjs-caption-settings input[type="button"] {
   width: 40px;
   height: 40px;
}

.video-js .vjs-modal-dialog {
   /*background: rgba(0, 0, 0, 0.8);
    background: -webkit-linear-gradient(-90deg, rgba(0, 0, 0, 0.8), rgba(255, 255, 255, 0));
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.8), rgba(255, 255, 255, 0));*/
}

.vjs-modal-dialog .vjs-modal-dialog-content {
   font-size: 1.2em;
   line-height: 1.5;
   padding: 20px 24px;
   z-index: 1;
}

.reviews {
}

.rev-item {
   background: #262a33;
}

.rev-item p,
.rev-item h5 {
   opacity: 0;
}

.rev-item[data-key="0"] p,
.rev-item[data-key="0"] h5 {
   opacity: 1;
}

.reviews .item {
   border-radius: 10px;
   padding: 50px 100px 50px 40px;
}

@media (max-width: 568px) {
   .reviews .item {
      padding: 30px 15px 100px;
   }
}

.reviews .item img {
   margin-bottom: 30px;
   /*max-width: 100px;*/
   max-height: 35px;
}

@media (max-width: 568px) {
}

.reviews .item p {
   font-size: 25px;
   line-height: 40px;
   letter-spacing: 0.5px;
   margin-bottom: 0px;
   /*opacity: 0;*/
}

@media (max-width: 568px) {
   .reviews .item p {
      font-size: 14px;
      line-height: 20px;
   }
}

.reviews .item h5 {
   color: #cacfdd;
   margin-top: 50px;
   margin-bottom: 0;
}

@media (max-width: 568px) {
   .reviews .item h5 {
      font-size: 12px;
   }
}

.hub-slider {
   position: relative;
   /*min-height: 425px;*/
}

.hub-slider-slides {
   height: 100%;
}

.hub-slider ul {
   list-style: none;
   display: flex;
   align-items: center;
   height: 100%;
}

.hub-slider ul li {
   /*width: 100%;*/
   width: calc(100% - 60px);
   /*height: 300px;*/

   position: absolute;
   left: 0;
   top: 0;
   /*bottom: 0;*/
   /*height: inherit;*/
}

@media (max-width: 568px) {
   .hub-slider ul li {
      width: calc(100% - 30px);
   }
}

.hub-sliderulli[data-key: 0] {
   position: relative;
}

.hub-slider ul li div {
}

.hub-slider-controls {
   position: absolute;
   right: 80px;
   bottom: 20px;
   /*top: 30px;*/
   z-index: 1000;
}

@media (max-width: 568px) {
   .hub-slider-controls {
      right: 0;
      left: 14px;
      bottom: -10px;
   }
}

.hub-slider-arrow {
   width: 53px;
   height: 53px;
   border: none;
   background: #1a1d23;
   color: #fff;
   border-radius: 50%;
   border: none;
   outline: none !important;
}

.div-404 {
   height: calc(100vh - 90px);
   position: relative;
   width: 100%;
   top: 45px;
   display: flex;
}

.div-404 .circle {
   /*width: 206px;*/
   /*height: 206px;*/
   /*padding: 30px;*/
   /*border: 1px solid #1A1D23;*/
   border-radius: 50%;
   background: #ffffff;
   position: absolute;
   left: 0;
   right: 0;
   top: 0;
   bottom: 0;
   margin: auto;
   z-index: 10;
   display: flex;
   justify-content: center;
   align-items: center;
   text-align: center;
}

.div-404 .circle a {
   display: flex;
   justify-content: center;
   align-items: center;
   text-align: center;
   padding: 30px;
}

.div-404 .marquee {
   pointer-events: none;
}

.div-404 p {
   font-size: 7vw;
   margin-bottom: 0;
}

.div-404 p:nth-child(2n) {
   font-weight: 800;
   /*color: #A8FD32;*/
}

@media (max-width: 568px) {
   .div-404 p {
      font-size: 10vh;
   }
}

input[type="file"]::-webkit-file-upload-button {
   display: none;
}
input[type="file"]::-ms-browse {
}

.i-file {
   align-items: center;
   cursor: pointer;
   max-width: fit-content;
}

.form-input-2 .i-file {
   margin-top: 30px;
}

.i-file svg {
   margin-right: 15px;
}

.i-file label {
   cursor: pointer;
}

#file {
   display: none;
}

.file_label2 {
   display: block;
   margin: 50px auto;
   font-size: 20px;
   font-family: Arial;
   width: 250px;
   height: 40px;
   line-height: 40px;
   background-color: #e67e22;
   color: #fff;
   text-align: center;
   padding: 5px;
   border: 1px solid #ccc;
   border-radius: 5px;
   transition: all 0.3s ease-in-out;
}

.file_label2:hover {
   background-color: #f39c12;
   color: #ffffff;
}

a.circle:hover {
   color: #1a1d23;
}

#oneum-chat {
   /*bottom: 100px !important;*/
}

.top-banner {
   background: #efefef;
   position: absolute;
   top: 0px;
   left: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   align-items: center;
   font-weight: 500;
   color: #000;
   height: 64px;
   opacity: 1;
   visibility: visible;
   transition: 0.3s;
}

@media (max-width: 568px) {
   .top-banner {
      font-size: 14px;
   }
}

.top-banner:hover {
   /*text-decoration: underline;*/
   color: #000;
   background: #a8fd32;
}

.top-banner a {
   color: #000;
   height: 100%;
   width: 100%;
   padding: 20px;
   text-align: center;
}

@media (max-width: 568px) {
   .top-banner a {
      padding: 10px;
   }
}

.top-banner .top-close {
   position: absolute;
   z-index: 10;
   right: 0px;
   width: 100px;
   height: 100%;
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: center;
}

@media (max-width: 568px) {
   .top-banner .top-close {
      width: 50px;
   }
}

.top-banner.disabled {
   /*display: none;*/
   opacity: 0;
   visibility: hidden;
   height: 0;
}

.client-list__block {
   display: flex;
   justify-content: space-between;
   gap: 0px;
   flex-wrap: wrap;
}
.client__image.top {
   position: absolute;
   left: 0;
   top: 0;
   right: 0;
   bottom: 0;
   border-style: none;
   perspective: none;
   transform: translateZ(7vw) rotateX(90deg) rotateY(0deg) rotate(0deg);
   transform-origin: 50% 100%;
   transform-style: preserve-3d;

   /*background: #1C7729;*/
}
@media (max-width: 768px) {
   .client__image.top {
      transform: translateZ(9.5vw) rotateX(90deg) rotateY(0deg) rotate(0deg);
   }
}
@media (max-width: 568px) {
   .client__image.top {
      transform: translateZ(15vw) rotateX(90deg) rotateY(0deg) rotate(0deg);
   }
}
.client__image.center {
   position: absolute;
   left: 0;
   top: 0;
   right: 0;
   bottom: 0;
   border-style: none;
   transform: translateZ(8.05em);
   transform-style: preserve-3d;
}
.client__image.bottom {
   position: absolute;
   left: 0;
   top: 0;
   right: 0;
   bottom: 0;
   transform: translateZ(100px) rotateX(-90deg) rotateY(0deg) rotate(0deg);
   transform-origin: 50% 0;
   transform-style: preserve-3d;

   /*background: #1863a4;*/
}
@media (max-width: 768px) {
   .client__image.bottom {
      transform: translateZ(9.5vw) rotateX(-90deg) rotateY(0deg) rotate(0deg);
   }
}
@media (max-width: 568px) {
   .client__image.bottom {
      transform: translateZ(15vw) rotateX(-90deg) rotateY(0deg) rotate(0deg);
   }
}
.client__image.back {
   position: absolute;
   left: 0;
   top: 0;
   right: 0;
   bottom: 0;
   -webkit-backface-visibility: hidden;
   backface-visibility: hidden;
   transform: translateZ(-90px) rotateX(0deg) rotateY(180deg) rotate(180deg);
   transform-style: preserve-3d;
}
.client-list__item.rotator .client__image {
   display: flex;
   justify-content: center;
   align-items: center;
   -webkit-backface-visibility: hidden;
   backface-visibility: hidden;
   /*width: 85%;*/
}
.client-list__item.rotator {
   display: flex;
   justify-content: center;
   flex: 0 0 25%;
   width: auto;
   aspect-ratio: 16/10;
   height: auto;
   flex-direction: column;
   position: relative;
   transform-style: preserve-3d;
   transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg);

   /*border: 1px solid #fff;*/

}
@media (max-width: 768px) {
   .client-list__item.rotator {
      flex: 0 0 33.3%;
   }
}
.client-list__item.rotator:not(:first-child) {
   /*display: none;*/
}
@media (max-width: 568px) {
   .client-list__item.rotator {
      aspect-ratio: 16/10;
      height: auto;
   }
}
.client-list__item.rotator img {
   width: 100%;
   max-width: 330px;
}
.client-list {
   background: #171717;
   padding-top: 146px;
   margin-top: 0px;
   padding-bottom: 146px;
}
.client-list h1 {
   margin: 0px;
   margin-bottom: 100px;
}
.text-color-white {
   color: #fff;
}
.content h2.client-list__title {
   font-size: 70px;
   line-height: 85px;
   margin-bottom: 100px;
}
@media (max-width: 1440px) {
   .client-list__item.rotator {
      /*width: 100px;*/
   }
}

.links-block {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
}

.element-link {
   display: flex;
   flex-basis: calc(50% - 20px);
   flex-direction: column;
   margin-bottom: 80px;
}

.element-link__image,
.element-link__content {
   flex: 1;
   width: 100%;
}
.element-link__image{
   position: relative;
}
.element-link__image:before {
   /*content: "смотреть";*/
   font-size: 20px;
   background: #a8fd32;
   color: #1a1d23;
   position: absolute;
   z-index: 99;
   width: 150px;
   height: 150px;
   border-radius: 50%;
   display: flex;
   justify-content: center;
   align-items: center;
   top: calc(50% - 75px);
   left: calc(50% - 75px);
   opacity: 0;
   transform: rotate(0deg) scale(0);
   transition: 0.3s;
   pointer-events: none;
}
.element-link:hover .element-link__image:before {
   opacity: 1;
   transition: 0.3s;
   transform: rotate(-30deg) scale(1);
}
.element-link__content {
   margin-top: 20px;
}
.element-link__image img {
   aspect-ratio: 650/445;
   display: block;
   height: auto;
   max-width: 100%;
   width: 100%;
}

.element-link__title {
   align-items: flex-start;
   color: #1c1c1c;
   display: flex;
   flex: none;
   font-size: 32px;
   font-weight: 500;
   gap: 13px;
   justify-content: space-between;
   line-height: 130%;
   text-decoration: none;
}
.element-link__title svg {
   flex-shrink: 0;
   margin-top: 10px;
}
.element-link__description {
   color: #acb4bc;
   font-size: 16px;
   line-height: 19px;
   margin-top: 14px;
}

.index-services {

}

.index-services .top {
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin-bottom: 36px;
}

.index-services .top h2 {
   font-family: "TT Norms Pro", sans-serif;
   font-weight: 400;
   font-size: 28px;
   line-height: 125%;
   color: #1a1d23;
   margin: 0;
}
@media (max-width: 568px) {
   .index-services .top h2 {
      font-size: 18px;
   }
}

.index-services__list {
   display: flex;
   flex-direction: column;
   margin-bottom: 180px;
}
@media (max-width: 568px) {
   .index-services__list {
      margin-bottom: 80px;
   }   
}
.index-services__item {
   display: flex;
   justify-content: space-between;
   border-bottom: 1px solid #e6e6ed;
   padding: 50px 0;
   align-items: stretch;
}
.index-services__item:nth-child(1) {
   border-top: 1px solid #e6e6ed;
}
.index-services__item .item__info {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   gap: 30px;
   max-width: 520px;
}
.index-services__item .item__info .item__info-text {
   display: flex;
   flex-direction: column;
   gap: 30px;
}
.index-services__item .item__info .item__info-text .item-title {
   font-size: 48px;
   font-weight: 400;
   line-height: 35px;
   text-transform: capitalize;
}
.index-services__item .item__info .item__info-text .item-desc {
   font-size: 20px;
   line-height: 24px;
   font-weight: 400;
}
.index-services__item .item__info .item-link {
   display: inline-flex;
   padding: 8px 16px;
   font-size: 16px;
   gap: 4px;
   align-items: center;
   justify-content: center;
   font-weight: 500;
   border: 1px solid rgba(28, 28, 28, 0.5);
   border-radius: 50px;
}
.index-services__item .item__info .item-link:hover {
   border: 1px solid rgba(28, 28, 28, 1);
   background: inherit;
   color: inherit;
}
.index-services__item .item__info .item-link:hover svg path {
   fill: initial;
}
.index-services__item .item__visual .visual-picture {
   position: relative;
}
.index-services__item .item__visual .visual-picture:before {
   /*content: "смотреть";*/
   font-size: 20px;
   background: #a8fd32;
   color: #1a1d23;
   position: absolute;
   z-index: 99;
   width: 150px;
   height: 150px;
   border-radius: 50%;
   display: flex;
   justify-content: center;
   align-items: center;
   top: calc(50% - 75px);
   left: calc(50% - 75px);
   opacity: 0;
   transform: rotate(0deg) scale(0);
   transition: 0.3s;
   pointer-events: none;
}
.index-services__item .item__visual:hover .visual-picture:before {
   opacity: 1;
   transition: 0.3s;
   transform: rotate(-30deg) scale(1);
}

.active-btn-link,
.active-btn-link svg path {
   transition: 0.3s ease;
}
.active-btn-link:hover {
   background: #1c1c1c;
   color: #fff;
}
.active-btn-link:hover svg path {
   fill: white;
}
.index-services__item .item__visual .visual-preview {
   margin: 12px 0 10px 0;
   font-size: 24px;
   font-weight: 500;
}
.index-services__item .item__visual:hover .visual-preview a {
   color: #1a1d23;
}
.index-services__item .item__visual .visual-text {
   font-size: 14px;
   text-transform: capitalize;
}

footer {
   background: #171717;
   padding: 80px 50px 30px 50px;
   box-sizing: border-box;
   font-family: "TT Norms Pro";
   display: flex;
   flex-direction: column;
   gap: 163px;
   border-top: 2px solid #2c2d32;
}
footer .upper-line {
   display: flex;
   justify-content: space-between;
   align-items: flex-start;
   gap: 40px;
}
footer a.footer-btn {
   display: inline-flex;
   padding: 8px 16px;
   background: white;
   border-radius: 57px;
   justify-content: center;
   align-items: center;
   gap: 4px;
   margin-top: -10px;
   font-size: 18px;
   font-weight: 500;
   border: 1px solid white;
   transition: 0.3s ease;
   white-space: nowrap;
}
footer a.footer-btn svg path {
   transition: 0.3s ease;
}
footer a.footer-btn:hover {
   background: transparent;
   color: white;
}
footer a.footer-btn:hover svg path {
   fill: white;
}
.footer-menu {
   display: flex;
   flex-direction: column;
   gap: 20px;
   list-style: none;
   padding: 0;
   margin: 0;
   width: 170px;
}
.footer-menu li {
}
.footer-menu li a {
   font-weight: 500;
   font-size: 16px;
   color: white;
   text-decoration: none;
   white-space: nowrap;
}
.footer-col__middle {
   display: flex;
   justify-content: space-between;
   align-items: flex-start;
   max-width: 675px;
   width: 50%;
}
.footer-menu-contacts {
   padding: 0;
   margin: 0;
   list-style: none;
   display: flex;
   flex-direction: column;
   font-weight: 500;
   font-size: 16px;
   width: 170px;
}
.footer-menu-contacts span {
   color: #767676;
   white-space: nowrap;
}
.footer-menu-contacts a {
   color: white;
   white-space: nowrap;
}
.footer-menu-contacts .menu-link {
   margin-bottom: 20px;
}
.footer-menu-contacts .menu-title {
   margin-bottom: 24px;
}
footer .down-line {
   display: flex;
   align-items: flex-start;
   width: 100%;
   gap: 40px;
}
.footer-menu-down {
   display: flex;
   list-style: none;
   padding: 0;
   margin: 0;
   gap: 19px 40px;
   flex-wrap: wrap;
}
.footer-menu-down li {
   line-height: 14px;
}
.footer-menu-down li a,
.down-line .copyright {
   font-weight: 400;
   font-size: 14px;
   color: #fff;
   line-height: 16px;
   white-space: nowrap;
}
.down-line .copyright {
   width: 100%;
   max-width: 25%;
}
.footer-col-first {
   width: 100%;
   max-width: 25%;
}
.footer-col-last {
   width: 25%;
   display: flex;
   justify-content: flex-end;
}
.footer-down-col__last {
}
.content.margin0 {
   margin-top: 0;
}
.content h1.case-page__title {
   font-family: "TT Norms Pro";
   font-size: 65px;
   text-transform: capitalize;
   margin-bottom: 90px;
}
.case-sections {
   display: flex;
   gap: 24px;
   margin-bottom: 59px;
   overflow: scroll;
   padding-top: 2px;
}
.case-sections::-webkit-scrollbar {
   width: 0;
   height: 0;
   display: none;
}
.case-sections .case-sections__item {
   font-family: "TT Norms Pro";
   font-size: 18px;
   color: #647794;
   cursor: pointer;
   transition: 0.3s ease;
   flex-shrink: 0;
}
.case-sections .case-sections__item:hover {
   color: #1a1d23;
}
.case-sections .case-sections__item.active {
   color: #1a1d23;
}
.case-sections .case-sections__item sup {
   font-size: 12px;
}
@media (max-width: 1210px) {
   .footer-col-first,
   .down-line .copyright {
      max-width: 15%;
   }
}
@media (max-width: 991px) {
   .element-link {
      flex-basis: unset;
   }
   .element-link {
      margin-bottom: 40px;
   }
   .element-link__title svg {
      margin-top: 4px;
   }
   .index-services__item {
      flex-direction: column;
      gap: 40px;
   }
   .index-services__item .item__visual {
   }
   .index-services__item .item__visual .visual-picture img {
      width: 100%;
   }
   .index-services__item .item__info .item__info-text .item-title {
      font-size: 24px;
      line-height: 24px;
   }
   .index-services__item .item__info .item__info-text .item-desc {
      font-size: 14px;
      line-height: 16px;
   }
   .index-services__item .item__info {
      gap: 30px;
   }
   .index-services__item .item__visual .visual-preview {
      font-size: 18px;
   }
   .index-services__item .item__visual .visual-text {
      font-size: 12px;
   }
   .index-services__item {
      padding: 30px 0;
   }
   .index-services__item .item__info .item-link {
      font-size: 14px !important;
      padding: 4px 10px !important;
   }
   .index-services__item .item__info .item__info-text {
      gap: 5px;
   }
}
@media (max-width: 568px) {
   .element-link__content {
      margin-top: 18px;
   }
   .element-link__title {
      font-size: 18px;
   }
   .element-link__description {
      font-size: 14px;
      margin-top: 10px;
   }
   .element-link__title svg {
      height: 18px;
   }
}
@media (max-width: 970px) {
   footer {
      padding: 30px 10px;
      gap: 40px;
   }
   .footer-col-first {
      display: none;
   }
   footer .upper-line {
      flex-direction: column;
   }
   .footer-col__middle {
      display: grid;
      grid-template-columns: 105px 1fr;
      grid-template-rows: 0fr, 1fr;
      grid-column-gap: 20px;
      grid-row-gap: 40px;
      width: 100%;
      max-width: 100%;
   }
   .footer-menu-contacts a,
   .footer-menu-contacts span,
   .footer-menu li a {
      font-size: 14px;
      text-transform: lowercase;
   }
   .footer-menu-contacts .menu-title {
      margin-bottom: 13px;
   }
   .footer-menu-contacts .menu-link {
      margin-bottom: 12px;
   }
   .footer-col-last {
      width: auto;
      justify-content: flex-start;
   }
   footer a.footer-btn {
      font-size: 16px;
      padding: 4px 10px;
      margin-top: 0px;
   }
   footer .down-line {
      flex-direction: column;
   }
   .down-line .copyright {
      order: 2;
   }
   .footer-menu-down {
      order: 1;
      gap: 20px 15px;
   }

   .footer-col__middle .footer-menu {
      grid-area: 1 / 1 / 2 / 3;
   }
   .footer-col__middle .footer-menu-contacts:nth-child(2) {
      grid-area: 2 / 1 / 3 / 2;
   }
   .footer-col__middle .footer-menu-contacts:nth-child(1) {
      grid-area: 2 / 2 / 3 / 3;
   }
   .footer-menu {
      flex-direction: row;
      flex-wrap: wrap;
      width: 100%;
   }
}
@media (max-width: 568px) {
   .content h2.client-list__title {
      font-size: 24px;
      line-height: 110%;
      margin-top: 00px;
      margin-bottom: 42px;
   }
   .content h2.client-list__title svg {
      width: 21px;
      height: 24px;
      margin-top: -4px;
   }
   .client-list {
      padding-top: 28px;
      padding-bottom: 50px;
   }
   .client-list__block {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
   }
   .client-list__item.rotator .client__image {
      /*width: 100%;*/
   }
   .client-list__item.rotator .client__image {
      /*width: 100%;*/
   }
   .case-sections {
      gap: 15px;
      margin: 0 -16px 30px -16px;
      padding: 0 16px;
      height: 100%;
      min-height: 20px;
   }
   .content h1.case-page__title {
      margin-bottom: 40px;
   }
}
@media (max-width: 420px) {
   .footer-menu {
      max-width: 200px;
      gap: 19px 21px;
   }
   .footer-menu li:first-child {
      margin-right: 20px;
   }
   .footer-col__middle {
      max-width: 90%;
   }
   .footer-menu-contacts {
      width: auto;
   }
}

/*





 */

.wrapper {
   font-family: "TT Norms Pro", sans-serif;
   min-height: 100%;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
}

.container {
   max-width: 1440px;
   padding: 0 50px;
   margin: 0 auto;
}

header .container {
   max-width: 100%;
}

footer .container {
   max-width: 100%;
}

.collapse:not(.collapse_show) {
   display: block;
   max-height: 0px;
   display: block;
   overflow-y: hidden;
}
.collapse.collapse_show {
   max-height: 100%;
   display: block;
}
.not-scrollbar {
   -ms-overflow-style: none;
   /* IE и Edge */
   scrollbar-width: none;
   /* Firefox */
}

.not-scrollbar:-webkit-scrollbar {
   display: none;
}

.h2 {
   font-size: 48px;
   font-weight: 400;
   line-height: 1;
}

.main {
   -webkit-box-flex: 1;
   -ms-flex: 1;
   flex: 1;
   padding-top: 135px;
}

.hero {
   padding-top: 165px;
}

.animate-title {
   opacity: 0;
   -webkit-transition: 1s;
   -o-transition: 1s;
   transition: 1s;
}

.app-btn {
   position: relative;
   width: -webkit-fit-content;
   width: -moz-fit-content;
   width: fit-content;
   overflow: hidden;
   border-radius: 57px;
}

.app-btn button {
   border-radius: 57px;
   padding-left: 40px;
   padding-right: 40px;
   height: 62px;
   letter-spacing: -0.02em;
   font-size: 32px;
   white-space: nowrap;
   -webkit-transition: 0.5s;
   -o-transition: 0.5s;
   transition: 0.5s;
   overflow: hidden;
}

.app-btn button:nth-child(1) {
   background-color: #1c1c1c;
   color: #fff;
   position: absolute;
   top: 50%;
   translate: 0 -50%;
   left: 0;
   z-index: 2;
}

.app-btn button:nth-child(2) {
   position: absolute;
   top: 0;
   left: 0;
   background-color: #a8fd32;
   color: #1c1c1c;
   z-index: 1;
   text-align: right;
}

.app-btn button:nth-child(3) {
   opacity: 0;
   pointer-events: none;
}

.app-btn.hover button:nth-child(1) {
   color: transparent !important;
   height: 14px;
   width: 14px !important;
   padding: 0;
   left: 35px;
}

.app-btn.hover button:nth-child(2) {
   padding-right: 35px;
   padding-left: unset;
}

.project-btn {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   border-radius: 57px;
   padding-left: 40px;
   padding-right: 40px;
   height: 62px;
   letter-spacing: -0.02em;
   font-size: 32px;
   white-space: nowrap;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
   -webkit-transition-timing-function: ease-in-out;
   -o-transition-timing-function: ease-in-out;
   transition-timing-function: ease-in-out;
   overflow: hidden;
   width: -webkit-fit-content;
   width: -moz-fit-content;
   width: fit-content;
   background-color: #1c1c1c;
   color: #fff;
   position: relative;
}

.project-btn span {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
   -webkit-transition-timing-function: ease-in-out;
   -o-transition-timing-function: ease-in-out;
   transition-timing-function: ease-in-out;
}

.project-btn span:nth-child(2) {
   position: absolute;
   top: 100%;
   left: 50%;
   translate: -50% 0%;
   color: #1c1c1c;
}

.project-btn:active {
   background-color: #a8fd32;
   margin-left: -3px;
   padding-left: 43px;
   padding-right: 43px;
}

.project-btn:active span:nth-child(1) {
   translate: 0 -150%;
}

.project-btn:active span:nth-child(2) {
   top: 50%;
   translate: -50% -50%;
}

.header {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   background-color: #fff;
   -webkit-transition: 0.5s;
   -o-transition: 0.5s;
   transition: 0.5s;
   z-index: 200;
}

.header.hidden {
   translate: 0 -100%;
}

.header.transparent {
   background-color: transparent;
}

.header.transparent .header__logo svg path {
   fill: #fff;
}
.about-page .header.transparent .header__logo svg path {
   fill: #1a1d23;
}

.header.transparent .header__logo svg .dot {
   fill: #a8fd32;
}

.header.transparent .header__link {
   color: #fff;
}
.about-page .header.transparent .header__link {
   color: inherit;
}

.header.transparent .project-btn {
   color: #fff;
   border: 1px solid #fff;
}
.about-page .header.transparent .project-btn {
   color: inherit;
   border: 1px solid #1a1d23;
}

.header.transparent .header__btn svg path {
   fill: #fff;
}

.header.transparent .header__main .header__list > li > .header__sublink {
   color: #fff;
}
.about-page .header.transparent .header__main .header__list > li > .header__sublink {
   color: inherit;
}

.header.transparent .header__sublink:hover {
   /*color: #a8fd32;*/
}

.header.transparent .header__sublink:active {
   /*color: #a8fd32;*/
}

.header.transparent .header__burger::before,
.header.transparent .header__burger::after {
   background-color: #fff;
}

.header__oneum {
   width: 100%;
   height: 50px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   background-color: #efefef;
   font-size: 16px;
   font-weight: 500;
   white-space: nowrap;
   text-align: center;
   color: #1a1d23;
}

.header.active .header__oneum {
   display: none;
}

html:has(.header.active) {
   overflow: hidden;
}

.header__oneum span {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
   padding-bottom: 3px;
   border-bottom: 1px solid transparent;
}

.header__wrapper {
   height: 85px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: justify;
   -ms-flex-pack: justify;
   justify-content: space-between;
}

.header__logo {
   -webkit-box-flex: 0;
   -ms-flex: 0 0 127px;
   flex: 0 0 127px;
}

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

.header__main {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   gap: 50px;
}

.header__list {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   gap: 40px;
   margin: 0;
   padding: 0;
}

.header__list:hover > :not(:hover) {
   opacity: .4;
}

.header__list .mobile {
   display: none;
}

.header__link {
   font-size: 16px;
   font-weight: 500;
   color: #1a1d23;
   -webkit-transition: 0.5s;
   -o-transition: 0.5s;
   transition: 0.5s;
   position: relative;
   height: 37px;
   outline: none !important;
}

.header__link.hover {
   color: #acb4bc;
}

.header__sublist {
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
   padding: 20px 0 6px 0;
   position: absolute;
   top: 100%;
   opacity: 0;
   pointer-events: none;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   -webkit-box-align: start;
   -ms-flex-align: start;
   align-items: flex-start;
   text-align: left;
   gap: 12px;

   background: #fff;
   padding: 16px;
   border-radius: 8px;
   left: -16px;

   transition: .3s ease;
}

.header__sublink {
   font-size: 18px;
   font-weight: 500;
   color: #1a1d23;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
   text-wrap: nowrap;
}
@media (max-width: 992px) {
   .header__sublink {

   }
}

.header .project-btn {
   padding: 0 16px;
   height: 41px;
   background-color: #fff;
   background-color: transparent;
   color: #1C1C1C;
   font-size: 18px;
   font-weight: 500;
   border: 1px solid #1C1C1C;
   display: flex;
   align-items: center;
   gap: 8px;
   width: 156px;
}
@media (max-width: 992px) {
   .header .project-btn {
      border: 1px solid #fff;
      color: #fff;
   }
}

.header .project-btn span:nth-child(2) {
   color: #fff;
}

.header .project-btn:active {
   padding: 0 19px;
}

.header__btn {
   border: 1px solid #1c1c1c;
   border-radius: 57px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   gap: 4px;
   -webkit-transition: 0.5s;
   -o-transition: 0.5s;
   transition: 0.5s;
   font-size: 16px;
   font-weight: 500;
   color: #1c1c1c;
   padding: 0 16px;
   height: 37px;
}

.header__btn svg {
   width: 18px;
}

.header__burger,
.header__email,
.header__medias {
   display: none;
}

.about-page .main {
   padding-top: 0;
}

.footer {
   background-color: #171717;
   border-top: 2px solid #2c2d32;
   padding-top: 80px;
   padding-bottom: 36px;
}

.footer .project-btn {
   height: 39px;
   font-size: 18px;
   padding: 0 16px;
   background-color: white;
   color: #1c1c1c;
}

.footer .project-btn span:nth-child(2) {
   color: #fff;
}

.footer .project-btn:active {
   padding: 0 19px;
   background-color: #a8fd32;
}

.footer__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 160px;
}

@media (max-width: 768px) {
   .footer__wrapper{
      gap: 56px;
   }
}

.footer__upper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   gap: 177px;
}

.footer__logo {
   display: flex ;
   flex-direction: column;
   gap: 40px;
   width: 14%;
   min-width: 204px;
   max-width: 244px;
}

.footer__logo span {
   font-family: "TT Norms Pro", sans-serif;
   font-weight: 400;
   font-size: 9px;
   line-height: 100%;
   text-transform: lowercase;
   color: #fff;

   max-width: 244px;
}

.footer__logo svg path {
   fill: #fff;
}

.footer__logo .dot {
   fill: #a8fd32;
}

.footer__main {
   display: -ms-grid;
   display: grid;
   -ms-grid-columns: (1fr) [4];
   grid-template-columns: repeat(4, 1fr);
   gap: 100px;
}
@media (max-width: 568px) {
   .footer__main {
      -ms-grid-columns: (1fr) [2];
      grid-template-columns: repeat(2, 1fr);
      -webkit-column-gap: 20px;
      -moz-column-gap: 20px;
      column-gap: 20px;
      row-gap: 40px !important;
   }
}

.footer__list {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 20px;
}
.footer__list.pc {
   display: flex !important;
}
.footer ul,
.footer li {
   margin-bottom: 0 !important;
}
@media (max-width: 992px) {
   .footer__list.pc {
      display: none !important;
   }
}
.footer__list .mobile {
   display: none;
}

.footer__link {
   color: #ffffff;
   font-size: 16px;
   font-weight: 500;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
   white-space: nowrap;
}

.footer__link:active {
   color: #a8fd32;
}

.footer__item {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 26px;
}

.footer__subtitle {
   font-size: 16px;
   font-weight: 500;
   color: #767676;
}

.footer__btn {
   width: -webkit-fit-content;
   width: -moz-fit-content;
   width: fit-content;
   background-color: white;
   border-radius: 57px;
   color: #1c1c1c;
   font-size: 18px;
   font-weight: 500;
   letter-spacing: -0.02em;
   padding-left: 16px;
   padding-right: 16px;
   height: 39px;
}

.footer .mobile {
   display: none;
}

.footer__down {
   gap: 177px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   align-items: flex-end;
}

.footer__copy {
   color: #fff;
   width: 14%;
   min-width: 204px;
   max-width: 244px;
}

.footer__down > span {
   display: none;

   font-family: "TT Norms Pro", sans-serif;
   font-weight: 400;
   font-size: 9px;
   line-height: 100%;
   text-transform: lowercase;
   color: #fff;
   max-width: 244px;
}

@media (max-width: 568px) {
   .footer__down > span {
      display: block;
   }

}

.footer__downlist {
   margin-bottom: 0;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   gap: 40px;
}
.footer__downlist li {
   margin-bottom: 0;
}
.footer__downlist a {
   font-size: 14px;
   color: #fff;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   gap: 4px;
}

.footer__downlist a svg {
   width: 14px;
   height: 14px;
}

.footer__downlist a svg path {
   fill: white;
}

.footer__downlist a:active {
   color: #a8fd32;
}

.footer__downlist a:active svg path {
   fill: #a8fd32;
}

.showreel-section {
   margin-top: 138px;
   height: 200vh;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
}
@media (max-width: 568px) {
   .showreel-section {
      margin-top: 70px !important;
   }
}

.showreel-section__video {
   position: sticky;
   top: 0;
   left: 0;
   width: 100%;
   height: 100vh;
   /* max-width: 978px; */
   max-width: calc(978 / 1440 * 100%);
   max-height: 543px;
}
@media (max-width: 768px) {
   .showreel-section__video {
      height: auto !important;
   }
}
@media (max-width: 568px) {
   .showreel-section__video {
      min-width: 92%;
   }
}

.showreel-section__video video {
   width: 100%;
   height: 100%;
   -o-object-fit: cover;
   object-fit: cover;
}
@media (max-width: 768px) {
   .showreel-section__video video {
      aspect-ratio: 16/10;
   }
}

.components-page {
   height: 5000px;
}

.home-hero__title {
   font-size: 70px;
   line-height: 120%;
   color: #1c1c1c;
}

.home-hero__title span {
   color: #7a7f87;
}

.home-hero__rating {
   height: 70px;
   margin-top: 50px;
}

.rating-item {
   max-height: 70px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   gap: 20px;
}

.rating-item__info {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 4px;
}

.rating-item__title {
   font-size: 22px;
   line-height: 1.0909090909;
   text-align: left;
   color: #1c1c1c;
}

.rating-item__link {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   gap: 4px;
   font-size: 14px;
   font-weight: 400;
   color: #767676;
}

.direction-hero {
   padding-bottom: 240px;
}

.direction-hero__title {
   font-size: 65px;
   line-height: 1.2307692308;
   color: #1c1c1c;
}

.direction-hero__title span {
   color: #7a7f87;
}

.services-section {
   padding-bottom: 180px;
}

.services-section__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-pack: justify;
   -ms-flex-pack: justify;
   justify-content: space-between;
   gap: 64px;
}

.services-section__list {
   -webkit-box-flex: 0;
   -ms-flex: 0 1 805px;
   flex: 0 1 805px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   padding: 0;
}

.services-item {
   padding-top: 40px;
   opacity: 0;
   border-bottom: 1px solid #e6e6ed;
   position: relative;
   top: 100px;
}

.services-item:nth-child(1) {
   padding-top: 0;
}

.services-item.hover .services-item__title,
.services-item.hover .services-item__content {
   color: #acb4bc;
}

.services-item.hover .services-item__header svg rect {
   fill: #acb4bc;
}

.services-item__header {
   padding-bottom: 40px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: justify;
   -ms-flex-pack: justify;
   justify-content: space-between;
   cursor: pointer;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
}

.services-item__header.active {
   padding-bottom: 30px;
}

.services-item__header.active svg {
   rotate: 45deg;
}

.services-item__header svg {
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
}

.services-item__header svg rect {
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
}

.services-item__title {
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
   font-size: 48px;
   line-height: 0.7291666667;
   color: #1a1d23;
}

.services-item__content {
   transition: 0.7s;
   padding-bottom: 40px;
   font-size: 18px;
   line-height: 1.2222222222;
   color: #000;
}

.services-item__content ul {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 12px;
   padding-left: 5px;
}

.services-item__content ul li {
   list-style-type: disc;
   list-style-position: inside;
}

.services-item__content p {
   text-wrap: auto;
}

.services-item__content a {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   height: 39px;
   border-radius: 57px;
   font-size: 18px;
   font-weight: 500;
   letter-spacing: -0.02em;
   color: #1c1c1c;
   width: -webkit-fit-content;
   width: -moz-fit-content;
   width: fit-content;
   margin-top: 30px;
   border: 1px solid #1c1c1c;
   padding-left: 16px;
   padding-right: 16px;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
}

.direction-preference {
   background-color: #171717;
   padding: 237px 0;
}

.direction-preference__title {
   font-size: 70px;
   font-weight: 400;
   line-height: 1.2142857143;
   color: #fff;
}

.direction-preference__title span {
   color: #7a7f87;
}

.direction-preference__title::before {
   content: "";
   display: inline-block;
   width: 46px;
   height: 50px;
   background: url(/local/templates/oktta_new/img/icons/direction-preference.svg)
      center/cover no-repeat;
   margin-right: 10px;
}

.direction-steps {
   padding-top: 190px;
   padding-bottom: 180px;
}

.direction-steps__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 50px;
}

.direction-steps__list {
   padding: 0;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 40px;
}

.direction-steps__item {
   padding-bottom: 40px;
   border-bottom: 1px solid #e6e6ed;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   gap: 90px;
}

.direction-steps__subtitle {
   font-size: 34px;
   line-height: 1.1;
   color: #1a1d23;
   -webkit-box-flex: 0;
   -ms-flex: 0 0 341px;
   flex: 0 0 341px;
}

.direction-steps__sublist {
   padding: 0;
   font-size: 20px;
   line-height: 1.4;
   letter-spacing: -0.03em;
   color: #1c1c1c;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
}

.direction-steps__sublist li {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   gap: 5px;
}

.direction-steps__sublist li::before {
   content: "·";
   line-height: 0;
   translate: 0 12px;
   font-size: 50px;
   display: inline-block;
}

.cases-section {
   margin-bottom: 180px;
}

.cases-section__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 50px;
}

.cases-section__list {
   display: -ms-grid;
   display: grid;
   -ms-grid-columns: (1fr) [2];
   grid-template-columns: repeat(2, 1fr);
   -webkit-column-gap: 40px;
   -moz-column-gap: 40px;
   column-gap: 40px;
   row-gap: 82px;
   padding: 0;
}

cases-section__list li {
   position: relative;
}

.case-card {
   height: 768px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 20px;
   cursor: pointer;
}

.case-card__image {
   position: relative;
   z-index: 0;
   -webkit-box-flex: 1;
   -ms-flex: 1;
   flex: 1;
}

.case-card__image:active .case-card__link {
   opacity: 1;
}

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

.case-card__link {
   position: absolute;
   top: 50%;
   left: 50%;
   translate: -50% -50%;
   rotate: -30deg;
   width: 130px;
   height: 130px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   background-color: #a8fd32;
   font-size: 18px;
   color: #1c1c1c;
   border-radius: 50%;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
   opacity: 0;
}

.case-card__title {
   font-size: 28px;
   font-weight: 500;
   line-height: 1.6071428571;
   text-align: left;
   color: #1a1d23;
}

.articles-section {
   margin-bottom: 200px;
}

.articles-section__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 50px;
}

.articles-section__list {
   display: -ms-grid;
   display: grid;
   -ms-grid-columns: (1fr) [2];
   grid-template-columns: repeat(2, 1fr);
   gap: 40px;
   padding: 0;
}

.articles-card {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 24px;
}

.articles-card__image {
   -webkit-box-flex: 1;
   -ms-flex: 1;
   flex: 1;
   overflow: hidden;
}

.articles-card__image img {
   width: 100%;
   height: 100%;
   -o-object-fit: cover;
   object-fit: cover;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
}

.articles-card__text {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 14px;
}

.articles-card__title {
   font-size: 32px;
   font-weight: 500;
   line-height: 1;
   letter-spacing: -0.04em;
   color: #1c1c1c;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
}

.articles-card__subtitle {
   font-size: 16px;
   line-height: 1.3125;
   letter-spacing: -0.03em;
   color: #acb4bc;
}

.brief-section {
   padding: 160px 0;
   background-color: #171717;
}

.brief-section__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   gap: 80px;
}

.brief-section__title {
   font-size: 70px;
   line-height: 1.2142857143;
   text-align: center;
   color: #fff;
}

.brief-section__link {
   background-color: #a8fd32;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   gap: 10px;
   height: 118px;
   border-radius: 57px;
   padding-left: 50px;
   padding-right: 50px;
   font-size: 60px;
   line-height: 1.3;
   color: #1c1c1c;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
}
.brief-section__link:hover {
   color: #1c1c1c;
}
.brief-section__link img {
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
}

.brief-section__link:active img {
   translate: 5px -5px;
}

.direction-tech {
   margin-bottom: 180px;
}

.direction-tech__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   gap: 73px;
}

.direction-tech__title {
   -webkit-box-flex: 0;
   -ms-flex: 0 0 375px;
   flex: 0 0 375px;
}

.direction-tech__list {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 40px;
}

.direction-tech__item {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 30px;
   padding-bottom: 30px;
   border-bottom: 1px solid #e6e6ed;
}

.direction-tech__item ul {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
   gap: 12px;
   padding: 0;
}

.direction-tech__item li {
   height: 42px;
   padding-left: 15px;
   padding-right: 15px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   color: #1c1c1c;
   font-size: 20px;
   letter-spacing: -0.02em;
   white-space: nowrap;
   border: 1px solid #1c1c1c;
   border-radius: 57px;
}

.direction-tech__subtitle {
   font-size: 48px;
   font-weight: 400;
   line-height: 1.1875;
   color: #1a1d23;
}

.digital-formats {
   margin-bottom: 180px;
}

.digital-formats__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 50px;
}

.digital-formats__list {
   padding: 0;
   display: -ms-grid;
   display: grid;
   -ms-grid-columns: (1fr) [3];
   grid-template-columns: repeat(3, 1fr);
   gap: 40px;
}

.digital-formats__item {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 30px;
}

.digital-formats__image {
   height: 300px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   background-color: #e7e7e7;
}
.digital-formats__image img {
   width: 100%;
   height: 100%;
}
.digital-formats__text {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 15px;
}

.digital-formats__subtitle {
   font-size: 44px;
   line-height: 0.7954545455;
   color: #1a1d23;
}

.digital-formats__description {
   font-size: 16px;
   line-height: 1.375;
   letter-spacing: -0.03em;
   color: #1c1c1c;
}

.no-webp .about-hero {
   background: url(/local/templates/oktta_new/img/about/hero.png) center/cover
         no-repeat,
      #171717;
}

.about-hero {
   padding-top: 250px;
}

.about-hero__wrapper {
   height: calc(100vh - 250px);
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
}

.about-hero__title {
   font-size: 65px;
   line-height: 1.1;
   color: #fff;
   max-width: 1175px;
}

.about-method {
   padding-top: 160px;
   padding-bottom: 240px;
}

.about-method__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   font-size: 48px;
   line-height: 1.2;
   color: #1c1c1c;
   gap: 153px;
}

.about-method__title {
   -webkit-box-flex: 0;
   -ms-flex: 0 0 277px;
   flex: 0 0 277px;
}
.about-method__description {
   white-space: normal;
}
.about-circles {
   padding-bottom: 240px;
}

.about-circles__list {
   display: -ms-grid;
   display: grid;
   -ms-grid-columns: (1fr) [4];
   grid-template-columns: repeat(4, 1fr);
   gap: 30px;
   height: 278px;
   margin: 0 70px;
   position: relative;
}

.about-circles__item {
   background-color: #fff;
   aspect-ratio: 1;
   border-radius: 50%;
   border-radius: 50%;
   border: 2px solid #1c1c1c;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   position: absolute;
   left: 50%;
   -webkit-transform: translate(-50%, 0);
   -ms-transform: translate(-50%, 0);
   transform: translate(-50%, 0);
   max-width: 278px;
   width: calc(25% - 22.5px);
}

.about-circles__title {
   font-size: 23px;
   font-weight: 400;
   line-height: 1.1739130435;
   text-align: center;
   color: #1c1c1c;
   opacity: 0;
}

.about-showreel {
   margin-bottom: 160px;
}

.about-showreel__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 20px;
}

.about-showreel__video {
   width: 100%;
   position: relative;
}

.about-showreel__video video {
   width: 100%;
   height: 100%;
   -o-object-fit: cover;
   object-fit: cover;
}

.about-showreel__video button {
   width: 130px;
   height: 130px;
   border-radius: 50%;
   background-color: #a8fd32;
   font-size: 18px;
   color: #1c1c1c;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   position: absolute;
   top: 50%;
   left: 50%;
   translate: -50% -50%;
   rotate: -30deg;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
}

.about-showreel__title {
   font-size: 18px;
   color: #1c1c1c;
}

.about-rating {
   margin-bottom: 240px;
}

.about-rating__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   gap: 153px;
}

.about-rating__title {
   -webkit-box-flex: 0;
   -ms-flex: 0 0 277px;
   flex: 0 0 277px;
}

.about-rating__list {
   display: -ms-grid;
   display: grid;
   -ms-grid-columns: (1fr) [3];
   grid-template-columns: repeat(3, 1fr);
   row-gap: 50px;
   -webkit-column-gap: 60px;
   -moz-column-gap: 60px;
   column-gap: 60px;
}
@media (max-width: 568px) {
   .about-rating__list {

   }
}

.about-rating__item {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   gap: 20px;
}

.about-rating__info {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 6px;
}

.about-rating__subtitle {
   font-size: 26px;
   line-height: 1.1;
   color: #1c1c1c;
}

.about-rating__description {
   font-size: 16px;
   line-height: 1.1;
   color: #767676;
}

.about-actions {
   margin-bottom: 240px;
}

.about-actions__list {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   padding: 0;
}

.about-actions__list li {
   height: 80vh;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
}
@media (max-width: 568px) {
   .about-actions__list li {
      height: 40vh;
   }
}

.about-actions__list span {
   opacity: 0;
   font-size: 160px;
   font-weight: 300;
   text-align: center;
   color: #1c1c1c;
}

.review-section {
   background-color: #e7e7e7;
}

.review-section__wrapper .swiper-slide {
   padding: 0 calc((100vw - 1440px) / 2 + 70px);
}

.review-section__btns {
   z-index: 1;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   gap: 20px;
   position: absolute;
   bottom: 96px;
   right: calc((100vw - 1440px) / 2 + 70px);
}

.review-section__nav {
   position: relative;
   top: unset;
   right: unset;
   left: unset;
   bottom: unset;
   margin: unset;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   background-color: #2c2e33;
   border-radius: 50%;
   overflow: hidden;
   width: 53px;
   height: 53px;
   -webkit-box-flex: 0;
   -ms-flex: 0 0 53px;
   flex: 0 0 53px;
   outline: none !important;
   border: none !important;
   box-shadow: none !important;
}

.review-section__nav::after {
   display: none;
}

.review-item {
   background-color: #e7e7e7;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 40px;
   overflow: hidden;
}

.review-item__content {
   white-space: normal;
   translate: 0 -5px;
   font-size: 32px;
   font-weight: 500;
   line-height: 1.4;
   color: #1c1c1c;
   position: relative;
}

.review-item__content::before {
   content: "";
   display: inline-block;
   width: 110px;
   aspect-ratio: 1;
   background: url(/local/templates/oktta_new/img/about/review-icon.svg)
      center/auto no-repeat;
}

.review-item__footer {
   padding-bottom: 72px;
}

.review-item__author {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   gap: 24px;
}

.review-item__avatar {
   width: 100px;
   aspect-ratio: 1;
   -webkit-box-flex: 0;
   -ms-flex: 0 0 100px;
   flex: 0 0 100px;
   border-radius: 50%;
   overflow: hidden;
}

.review-item__avatar img {
   width: 100%;
   height: 100%;
   -o-object-fit: cover;
   object-fit: cover;
}

.review-item__info {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   font-size: 18px;
   font-weight: 500;
   line-height: 1.3;
}

.review-item__name {
   color: #1c1c1c;
}

.review-item__rang {
   color: #818181;
}

.brief-page {
   padding-bottom: 260px;
}

.brief-page__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 168px;
   max-width: 1144px;
}

.brief-page__title {
   font-size: 100px;
   line-height: 1.1;
   color: #1c1c1c;
}

.brief-page__header {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 20px;
}

.brief-page__time {
   font-size: 20px;
   line-height: 1.1;
   color: #7a7f87;
}

.brief-page__list {
   margin: 0;
   padding: 0;
   display: -ms-grid;
   display: grid;
   -ms-grid-columns: (1fr) [2];
   grid-template-columns: repeat(2, 1fr);
   -webkit-column-gap: 80px;
   -moz-column-gap: 80px;
   column-gap: 80px;
   row-gap: 50px;
}

.brief-page__list .full-width {
   -ms-grid-column-span: 2;
   grid-column: span 2;
}

.brief-item {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 20px;
   padding-bottom: 20px;
   border-bottom: 1px solid #e6e6ed;
}

.brief-item__subtitle {
   font-size: 28px;
   line-height: 1.25;
   color: #1c1c1c;
}

.brief-item__list {
   padding-left: 0;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
   gap: 12px 10px;
}
.brief-item__list br {
   display: none;
}
.brief-item__list span {
   padding: 0 !important;
}
.brief-item.border-none {
   border: 0;
}

.input-item {
   position: relative;
}

.input-item input {
   display: block;
   height: 58px;
   width: 100%;
   font-size: 28px;
   line-height: 1.25;
   color: #1c1c1c;
   border-bottom: 1px solid #e6e6ed;
   padding: 0 !important;
   margin: 0 !important;
}

.input-item label {
   pointer-events: none;
   position: absolute;
   top: 50%;
   translate: 0 -50%;
   left: 0;
   font-size: 28px;
   line-height: 1.25;
   color: #1c1c1c;
   -webkit-transition: 0.5s;
   -o-transition: 0.5s;
   transition: 0.5s;
}

.input-item.filled label {
   color: #acb4bc;
   font-size: 12px;
   top: 0%;
   translate: 0 0%;
}

.input-item.filled .file-input label {
   top: 0px;
   translate: 0 -50px;
}


.file-input {
   position: relative;
   display: flex;
   justify-content: flex-end;
   margin-top: 12px;
   padding-right: 4px;
}

.file-input input {
   display: none;
}

.file-input label {
   width: fit-content;
   position: absolute;
   top: -50px;
   right: 11px;
   pointer-events: all;
   cursor: pointer;
   left: unset;
   translate: 0;
}
@media (max-width: 568px) {
   .file-input label {
      top: -33px;
      right: 5px;
   }
}

.file-input div {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   width: -webkit-fit-content;
   width: -moz-fit-content;
   width: fit-content;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   gap: 12px;
   position: absolute;
   top: calc(100% + 12px);
   right: 4px;
   opacity: 0;
   pointer-events: none;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
}

.file-input .bx-input-file-desc {
   font-weight: 400;
   font-size: 16px;
   line-height: 87%;
   text-align: right;
   color: #acb4bc;
}

.file-input div.has-file {
   opacity: 1;
   pointer-events: all;
   position: initial;
}

.file-input div img {
   cursor: pointer;
}

.file-input div button {
   width: -webkit-fit-content;
   width: -moz-fit-content;
   width: fit-content;
   height: 10px;
}

.radio-item input {
   display: none;
}

.radio-item label {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   height: 37px;
   border-radius: 57px;
   border: 1px solid #1c1c1c;
   padding: 0 15px;
   font-size: 16px;
   font-weight: 500;
   letter-spacing: -0.02em;
   color: #1c1c1c;
   white-space: nowrap;
   -webkit-transition: 0.5s;
   -o-transition: 0.5s;
   transition: 0.5s;
   cursor: pointer;
}
.radio-item span {
   background-color: unset !important;
   transition: unset !important;
}
.radio-item label:active {
   color: #fff;
   background-color: #1c1c1c;
}

.radio-item input:checked + label {
   color: #fff;
   background-color: #1c1c1c;
}

.brief-submit {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 20px;
}

.brief-submit__remind {
   font-size: 14px;
   line-height: 1.1928571429;
   color: #1c1c1c;
}

.brief-submit__remind a {
   color: #1c1c1c;
   border-bottom: 1px solid #1c1c1c;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
}

@-webkit-keyframes buttonAnimation {
   0% {
      translate: 0 0;
   }

   50% {
      translate: 50px -50px;
   }

   51% {
      translate: 80px 80px;
   }

   70% {
      translate: -50px 50px;
   }

   100% {
      translate: 0px 0px;
   }
}

@keyframes buttonAnimation {
   0% {
      translate: 0 0;
   }

   50% {
      translate: 50px -50px;
   }

   51% {
      translate: 80px 80px;
   }

   70% {
      translate: -50px 50px;
   }

   100% {
      translate: 0px 0px;
   }
}

.contacts-page {
   padding-bottom: 160px;
}

.contacts-page__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 140px;
}

.contacts-page__title {
   font-size: 65px;
   color: #1c1c1c;
}

.contacts-page__list {
   display: flex;
   justify-content: space-between;
   padding: 0;
   flex-wrap: wrap;
}

.contacts-page__item {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 36px;
}

.contacts-page__subtitle {
   font-size: 22px;
   font-weight: 500;
   color: #767676;
}

.contacts-page__sublist {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 20px;
   padding: 0;
}

.contacts-page__link {
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
   font-size: 35px;
   font-weight: 500;
   color: #1c1c1c;
   white-space: nowrap;
}
.contacts-page__link_address:hover {
   cursor: default !important;
   color: #1c1c1c !important;
}
.case-hero {
   margin-bottom: 120px;
}
@media (max-width: 568px) {
   .case-hero {
      margin-bottom: 50px !important;
   }
}

.case-hero__wrapper {
   display: flex;
   flex-direction: column;
   gap: 60px;
   /*margin-bottom: 40px;*/
}

.case-hero__title {
   -ms-grid-column-span: 2;
   grid-column: span 2;
   font-size: 80px;
   line-height: 1.1;
   color: #1c1c1c;
}

.case-hero__row {
   margin-top: 60px;
   margin-bottom: 40px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: justify;
   -ms-flex-pack: justify;
   justify-content: space-between;
}

.case-hero__info {
   display: flex;
   justify-content: space-between;
   align-items: flex-start;
   gap: 60px;
}
@media (max-width: 568px) {
   .case-hero__info {
      flex-direction: column;
   }
}

.case-hero__tags {
   display: flex;
   align-items: flex-start;
   gap: 30px;
   max-width: 900px;
   margin: 0;
   padding: 0;
}

.case-hero__tags div {
   display: flex;
   align-items: center;
   gap: 10px;
   font-size: 16px;
   color: #647794;
   position: relative;
}

.case-hero__tags div:nth-child(1) {
   font-weight: 500;
}

.case-hero__tags div:nth-child(2) {
   min-width: 200px;
}


.case-hero__tags li:last-child::after {
   display: none;
}

.case-hero__link {
   -webkit-box-pack: end;
   -ms-flex-pack: end;
   justify-content: end;
   align-items: center;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   gap: 4px;
   font-size: 16px;
   color: #1c1c1c;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
   width: fit-content;
}

.case-hero__link svg {
   width: 12px;
   -webkit-box-flex: 0;
   -ms-flex: 0 0 12px;
   flex: 0 0 12px;
   height: auto;
}

.case-hero__image {
   width: 100%;
}

.case-hero__image img {
   width: 100%;
   height: 100%;
   -o-object-fit: cover;
   object-fit: cover;
}

.case-description {
   margin-bottom: 100px;
}

.case-description__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 50px;
}

.case-description__item {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   gap: 100px;
   color: #1c1c1c;
   padding-bottom: 50px;
   border-bottom: 1px solid #e6e6ed;
}

.case-description__item:last-child {
   padding-bottom: 0;
   border: 0;
}

.case-description__subtitle {
   font-size: 40px;
   line-height: 0.875;
   -webkit-box-flex: 0;
   -ms-flex: 0 0 329px;
   flex: 0 0 329px;
}
@media (max-width: 568px) {
   .case-description__subtitle {
      font-size: 18px !important;
      line-height: 194%;
      color: #767676;
      margin: 0 !important;
   }
}

.case-description__text {
   font-size: 48px;
   line-height: 1.2;
   margin: 0;
}

.case-gallery {
   margin-bottom: 160px;
}
@media (max-width: 568px) {
   .case-gallery {
      margin-top: 40px !important;
   }
}

.case-gallery__list, .project-content {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   padding: 0;
   /*-webkit-box-orient: vertical;*/
   /*-webkit-box-direction: normal;*/
   /*-ms-flex-direction: column;*/
   /*flex-direction: column;*/
   gap: 24px;
}

.case-gallery__list img,
.project-content img {
   width: 100%;
   height: 100%;
   -o-object-fit: cover;
   object-fit: cover;
}

.error-page {
   padding-bottom: 216px;
}

.error-page__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 60px;
}

.error-page__title {
   font-size: 100px;
   line-height: 1.1;
   color: #1c1c1c;
}

.error-page__link {
   background-color: #1c1c1c;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   gap: 10px;
   padding-left: 40px;
   padding-right: 40px;
   height: 62px;
   border-radius: 57px;
   font-size: 32px;
   font-weight: 500;
   line-height: 1.3;
   letter-spacing: -0.02em;
   color: #fff;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   width: -webkit-fit-content;
   width: -moz-fit-content;
   width: fit-content;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
}

.error-page__link svg {
   height: auto;
   width: 28px;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
}

.error-page__link svg path {
   fill: #fff;
}

.error-page__link:active svg {
   rotate: 45deg;
}

.documents-page {
   padding-bottom: 200px;
}

.documents-page__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 60px;
}

.documents-page__title {
   font-size: 65px;
   color: #1c1c1c;
}

.documents-page__list {
   display: -ms-grid;
   display: grid;
   -ms-grid-columns: (1fr) [2];
   grid-template-columns: repeat(2, 1fr);
   -webkit-column-gap: 30px;
   -moz-column-gap: 30px;
   column-gap: 30px;
   row-gap: 40px;
   padding: 0;
   margin: 0;
}

.no-webp .documents-page__list li:nth-child(1) a {
   background: url(/local/templates/oktta_new/img/documents/vector.png)
         center/cover no-repeat,
      #e7f2f9;
}

.no-webp .documents-page__list li:nth-child(2) a {
   background: url(/local/templates/oktta_new/img/documents/vector.png)
         center/cover no-repeat,
      #e9f2e4;
}

.no-webp .documents-page__list li:nth-child(3) a {
   background: url(/local/templates/oktta_new/img/documents/vector.png)
         center/cover no-repeat,
      #f8ebde;
}

.no-webp .documents-page__list li:nth-child(4) a {
   background: url(/local/templates/oktta_new/img/documents/vector.png)
         center/cover no-repeat,
      #e8e4f2;
}

.document-card {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   height: 300px;
   padding: 30px;
   border-radius: 10px;
}

.document-card__header {
   -webkit-box-flex: 1;
   -ms-flex: 1;
   flex: 1;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-pack: justify;
   -ms-flex-pack: justify;
   justify-content: space-between;
}

.document-card__format {
   height: 29px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   padding: 0 10px;
   font-size: 14px;
   white-space: nowrap;
   color: #000000;
   background-color: #f4f7f7;
   border-radius: 100px;
}

.document-card__btn {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   width: 53px;
   height: 53px;
   -webkit-box-flex: 0;
   -ms-flex: 0 0 53px;
   flex: 0 0 53px;
   border-radius: 50%;
   background-color: #ffffff;
}

.document-card__btn svg {
   height: auto;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
   width: 30px;
}

.document-card__btn svg path {
   fill: #cbcfd3;
}

.document-card__title {
   font-size: 38px;
   line-height: 1.1973684211;
   color: #000000;
}

.blog-hero {
   margin-bottom: 64px;
}

.blog-hero__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-pack: justify;
   -ms-flex-pack: justify;
   justify-content: space-between;
   -webkit-box-align: end;
   -ms-flex-align: end;
   align-items: flex-end;
   gap: 32px;
}

.blog-hero__title {
   font-size: 140px;
   font-weight: 500;
   letter-spacing: -0.07em;
   color: #1c1c1c;
}

.blog-hero__filters {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
   gap: 8px;
   max-width: 679px;
   -webkit-box-pack: end;
   -ms-flex-pack: end;
   justify-content: end;
}

.blog-hero__filters li {
   height: -webkit-fit-content;
   height: -moz-fit-content;
   height: fit-content;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   gap: 8px;
}

.blog-hero__filters li:last-child::after {
   display: none;
}

.blog-hero__filters li::after {
   content: "/";
   font-size: 32px;
   font-style: italic;
   color: #1c1c1c;
}

.blog-hero__filters input {
   display: none;
}

.blog-hero__filters label {
   cursor: pointer;
   height: -webkit-fit-content;
   height: -moz-fit-content;
   height: fit-content;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   gap: 4px;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
   transition: 0.3s;
   color: #1c1c1c;
}

.blog-hero__filters label span {
   font-size: 28px;
   font-weight: 500;
   letter-spacing: -0.04em;
}

.blog-hero__filters label .index {
   font-size: 13px;
   font-style: italic;
   font-weight: 500;
}

.blog-hero__filters input:checked + label {
   color: #a8fd32;
}

.blog-content__grid {
   display: -ms-grid;
   display: grid;
   -ms-grid-columns: (1fr) [2];
   grid-template-columns: repeat(2, 1fr);
   row-gap: 56px;
   -webkit-column-gap: 10px;
   -moz-column-gap: 10px;
   column-gap: 10px;
   position: relative;
}

.blog-content__grid li:nth-child(2) {
   max-width: 447px;
}

.blog-content__grid li:nth-child(2n) .article-card {
   padding-right: 0;
   border: none;
}

.blog-content__grid .project-btn {
   height: 46px;
   font-size: 16px;
   position: absolute;
   top: 50%;
   right: 0;
   translate: 0 calc(-100% - 56px);
}

.blog-content__grid .project-btn:active span:nth-child(1) {
   translate: 0 -30px;
}

.blog-content__main {
   margin-bottom: 56px;
}

.blog-content__main ul {
   display: -ms-grid;
   display: grid;
   -ms-grid-columns: (1fr) [3];
   grid-template-columns: repeat(3, 1fr);
   -webkit-column-gap: 10px;
   -moz-column-gap: 10px;
   column-gap: 10px;
   row-gap: 56px;
   justify-items: end;
}

.blog-content__main ul li:nth-child(3n) .article-card {
   padding-right: 0;
   border: 0;
}

.blog-content__main ul li.column-2 {
   -ms-grid-column-span: 2;
   grid-column: span 2;
   max-width: 690px;
}

.blog-content__main ul li.column-2 .article-card {
   padding-left: 10px;
   padding-right: 0;
   border: 0;
   border-left: 1px solid #e8e8e8;
}

.blog-content__footer {
   width: calc(100% - 690px);
   margin-top: 56px;
}

.blog-content__footer a {
   background-color: #fff;
   color: #1c1c1c;
   height: 39px;
   width: 100%;
   font-size: 18px;
   border: 1px solid #e8e8e8;
}

.blog-content__footer a:active {
   border-color: transparent;
}

.article-page {
   overflow: hidden;
}

.article-page .review-section {
   background-color: unset;
}

.article-page .review-item {
   padding-left: 72px;
   padding-right: 72px;
   padding-bottom: 72px;
   background-color: #171717;
   border-radius: 32px;
}

.article-page .review-item__content {
   font-size: 24px;
   color: white;
}

.article-hero {
   padding-top: 100px;
   margin-bottom: 90px;
}

.article-hero__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 32px;
   border-bottom: 1px solid #e8e8e8;
   padding-bottom: 32px;
}

.article-hero__title {
   font-size: 72px;
   font-weight: 500;
   line-height: 0.9027777778;
   letter-spacing: -0.04em;
   color: #1c1c1c;
}

.article-hero__image {
   border-radius: 32px;
   overflow: hidden;
   max-height: 440px;
}

.article-hero__image img {
   width: 100%;
   height: 100%;
   -o-object-fit: cover;
   object-fit: cover;
}

.article-content {
   margin-bottom: 90px;
}

.article-content__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   gap: 50px;
}

.article-content__aside {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   -webkit-box-pack: justify;
   -ms-flex-pack: justify;
   justify-content: space-between;
   -webkit-box-flex: 0;
   -ms-flex: 0 0 250px;
   flex: 0 0 250px;
}

.article-content__post {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 20px;
}

.article-content__post li {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   font-size: 16px;
   font-weight: 500;
   line-height: 1.35;
   letter-spacing: -0.03em;
}

.article-content__post li .black {
   color: #1c1c1c;
}

.article-content__post li .gray {
   color: #818181;
}

.article-content__media {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 8px;
}

.article-content__media span {
   font-size: 16px;
   font-weight: 500;
   letter-spacing: -0.03em;
   color: #818181;
}

.article-content__media ul {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   gap: 8px;
}

.article-content__media ul li {
   width: 40px;
   height: 40px;
   -webkit-box-flex: 0;
   -ms-flex: 0 0 40px;
   flex: 0 0 40px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   background-color: #fff;
   background-color: #1c1c1c;
   border-radius: 50%;
}

.article-content__main .article-content__media {
   display: none;
}

.article-content__list {
   max-width: 768px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 40px;
}

.article-content__title {
   font-size: 48px;
   font-weight: 500;
   line-height: 1;
   letter-spacing: -0.04em;
   color: #1c1c1c;
   margin-bottom: 48px;
}

.article-content__block {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 16px;
}

.article-content__block ul {
   padding-left: 15px;
}

.article-content__block ul li {
   list-style-type: disc;
}

.article-content__image {
   margin-bottom: 16px;
   border-radius: 32px;
   overflow: hidden;
}

.article-content__image img {
   width: 100%;
   height: 100%;
   -o-object-fit: cover;
   object-fit: cover;
}

.article-content__subtitle {
   font-size: 32px;
   font-weight: 500;
   line-height: 1;
   letter-spacing: -0.04em;
   color: #1c1c1c;
}

.article-content__text {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 8px;
}

.article-text {
   font-size: 14px;
   font-weight: 500;
   line-height: 1.5;
   letter-spacing: -0.03em;
   color: #818181;
}

.article-gallery {
   margin-bottom: 40px;
   position: relative;
}

.article-gallery img {
   border-radius: 32px;
   overflow: hidden;
   width: 100%;
   height: 100%;
   -o-object-fit: cover;
   object-fit: cover;
}

.article-gallery .swiper {
   margin-left: calc(-1 * (300px + (100vw - 1340px) / 2));
   margin-right: calc(-1 * (100vw - 770px) / 2);
   padding-left: calc(300px + (100vw - 1340px) / 2);
   padding-right: calc((100vw - 1340px) / 2);
}

.article-gallery .swiper-slide {
   max-width: 797px;
   border-radius: 32px;
   overflow: hidden;
}

.article-gallery__nav {
   position: absolute;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   gap: 12px;
   width: -webkit-fit-content;
   width: -moz-fit-content;
   width: fit-content;
   bottom: 100%;
   right: calc(-1 * (100vw - 800px) / 2);
   translate: -30px -50px;
}

.article-gallery__btn {
   cursor: pointer;
   border-radius: 50%;
   width: 40px;
   aspect-ratio: 1;
   -webkit-box-flex: 0;
   -ms-flex: 0 0 40px;
   flex: 0 0 40px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   border: 1px solid #e8e8e8;
}

.articles-slider {
   margin-bottom: 110px;
}

.articles-slider__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 56px;
}

.articles-slider__header {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-pack: justify;
   -ms-flex-pack: justify;
   justify-content: space-between;
   -webkit-box-align: end;
   -ms-flex-align: end;
   align-items: flex-end;
   padding-left: calc((100vw - 1340px) / 2);
   padding-right: calc((100vw - 1340px) / 2);
}

.articles-slider__title {
   font-size: 96px;
   font-weight: 500;
   letter-spacing: -0.04em;
   color: #1c1c1c;
}

.articles-slider__nav {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   gap: 12px;
}

.articles-slider .swiper-slide {
   max-width: 447px;
}

.articles-slider .swiper {
   width: 100%;
   padding-left: calc((100vw - 1340px) / 2);
   padding-right: calc((100vw - 1340px) / 2);
}

.article-card {
   padding-right: 10px;
   border-right: 1px solid #e8e8e8;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 24px;
}

.article-card__image {
   border-radius: 21px;
   overflow: hidden;
}

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

.article-card__main {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
   gap: 12px;
}

.article-card__header {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: start;
   -ms-flex-align: start;
   align-items: flex-start;
   gap: 8px;
}

.article-card__index {
   font-size: 13px;
   font-style: italic;
   font-weight: 500;
   white-space: nowrap;
   color: #1c1c1c;
}

.article-card__title {
   font-size: 32px;
   font-weight: 500;
   line-height: 1;
   color: #1c1c1c;
}

.article-card__description {
   font-size: 16px;
   font-weight: 500;
   line-height: 1.35;
   color: #818181;
}

@media (max-width: 1440px) {
   .footer__upper {
      gap: 12.2916666667vw;
   }

   .footer__main {
      gap: 6.9444444444vw;
   }

   .footer__down {
      gap: 10vw;
   }

   .footer__downlist {
      gap: 2.7777777778vw;
   }

   .about-circles__title {
      font-size: calc(20px + 3 * (100vw - 992px) / 448);
   }

   .about-rating__wrapper {
      gap: calc(70px + 83 * (100vw - 992px) / 448);
   }

   .about-rating__title {
      -webkit-box-flex: 0;
      -ms-flex: 0 0 19.2361111111vw;
      flex: 0 0 19.2361111111vw;
   }

   .review-section__wrapper .swiper-slide {
      padding: 0 70px;
   }

   .review-section__btns {
      right: 70px;
   }

   .contacts-page__list {
      gap: calc(50px + 230 * (100vw - 992px) / 928);
   }

   .article-gallery .swiper {
      margin-left: -350px;
      padding-left: 350px;
      padding-right: 50px;
   }

   .article-gallery__nav {
      right: calc(-1 * (100vw - 900px) / 2);
   }

   .articles-slider__wrapper {
      gap: 40px;
   }

   .articles-slider__header {
      padding: 0 50px;
   }

   .articles-slider .swiper {
      padding-left: 50px;
      padding-right: 50px;
   }
}

@media (max-width: 1300px) {
   .article-gallery__nav {
      right: calc(-1 * (100vw - 1000px) / 2);
   }
}

@media (max-width: 1200px) {
   .blog-content__main {
      margin-top: 56px;
   }

   .blog-content__grid li:nth-child(2) {
      max-width: unset;
   }

   .blog-content__grid li:has(.project-btn) {
      -ms-grid-column-span: 2;
      grid-column: span 2;
   }

   .blog-content__grid .project-btn {
      position: relative;
      top: unset;
      right: unset;
      translate: unset;
      width: 100%;
   }

   .blog-content__grid .project-btn:active {
      margin-right: -3px;
      margin-left: -3px;
   }

   .article-gallery .swiper {
      margin-right: -50px;
   }

   .article-gallery__nav {
      display: none;
   }
}

@media (max-width: 992px) {
   .container {
      padding: 0 10px;
   }

   .h2 {
      font-size: 20px;
      font-weight: 500;
   }

   .main {
      /*padding-top: 56px;*/
   }

   .hero {
      padding-top: 24px;
   }

   .header.transparent .header__btn {
      color: #1c1c1c;
   }

   .header.transparent .header__btn svg path {
      fill: #1c1c1c;
   }

   .header__oneum {
      /*display: none;*/
      font-size: 14px !important;
   }

   .header.active .header__logo svg path {
      fill: #fff;
   }

   .header.active .header__logo .dot {
      fill: #a8fd32;
   }

   .header__wrapper {
      height: 56px;
   }

   .header__logo {
      -webkit-box-flex: 0;
      -ms-flex: 0 0 80px;
      flex: 0 0 80px;
      z-index: 1;
   }

   .header__menu {
      padding-top: 83px;
      padding-bottom: 32px;
      padding-left: 10px;
      padding-right: 10px;
      overflow-y: auto;
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      translate: 0 -100%;
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s;
      -ms-overflow-style: none;
      /* IE и Edge */
      scrollbar-width: none;
      /* Firefox */
   }

   .header__menu:-webkit-scrollbar {
      display: none;
   }

   .header__menu.active {
      translate: 0 0%;
      background-color: #171717;
   }

   .header__burger,
   .header__email,
   .header__medias {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
   }

   .header__burger {
      width: 18px;
      -webkit-box-flex: 0;
      -ms-flex: 0 0 18px;
      flex: 0 0 18px;
      height: 8px;
      position: relative;
      outline: none !important;
   }

   .header__burger::before,
   .header__burger::after {
      content: "";
      height: 2px;
      width: 100%;
      background-color: #1c1c1c;
      position: absolute;
      display: block;
      -webkit-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s;
   }

   .header__burger::before {
      top: 0;
   }

   .header__burger::after {
      bottom: 0;
   }

   .header__burger.active::before {
      rotate: 45deg;
      background-color: #fff;
      translate: -2% 3px;
   }

   .header__burger.active::after {
      rotate: -45deg;
      background-color: #fff;
      translate: -1% -3px;
   }

   .header__main {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      gap: 66px;
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start;
   }

   .header__list {
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      gap: 25px;
   }

   .header__list .mobile {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
   }

   .header__list .pc {
      display: none;
   }

   .header__sublink,
   .header__link {
      font-size: 28px;
      font-weight: 400;
      color: #fff;
      display: flex;
      gap: 6px;
      align-items: center;
   }

   .header__sublink svg,
   .header__link svg {
      translate: 0 3px;
      width: 25px;
      height: 100%;
   }

   .header__sublink svg path,
   .header__link svg path {
      fill: #fff;
   }

   .header__sublink:active,
   .header__link:active {
      color: #a8fd32;
   }

   .header__sublink:active svg path,
   .header__link:active svg path {
      fill: #a8fd32;
   }

   .header__btn {
      font-size: 18px;
      font-weight: 500;
      height: 35px;
      background-color: #fff;
      color: #1c1c1c;
   }

   .header__btn svg {
      width: 18px;
      height: 18px;
      -webkit-box-flex: 0;
      -ms-flex: 0 0 18px;
      flex: 0 0 18px;
   }

   .header__btn svg path {
      fill: #1c1c1c;
   }

   .header__medias {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      -webkit-column-gap: 15px;
      -moz-column-gap: 15px;
      column-gap: 15px;
      row-gap: 20px;
      padding: 0;
   }

   .header__btns {
      gap: 25px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
   }

   .header__media {
      font-size: 12px;
      color: #fff;
   }

   .header__media:active {
      color: #a8fd32;
   }

   .footer {
      padding-top: 30px;
      padding-bottom: 20px;
   }

   .footer__wrapper {
      gap: 56px;
   }

   .footer__logo {
      display: none;
   }

   .footer__main {

   }

   .footer__link {
      font-size: 14px;
   }

   .footer__list.pc {
      display: none;
   }

   .footer__list.mobile {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      -webkit-column-gap: 45px;
      -moz-column-gap: 45px;
      column-gap: 45px;
      row-gap: 19px;
      -ms-grid-column-span: 2;
      grid-column: span 2;
   }

   .footer__list .mobile {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex !important;
      visibility: unset !important;
   }

   .footer .mobile {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex !important;
      visibility: unset !important;
   }

   .footer .pc {
      display: none;
   }

   .footer__btn {
      height: 29px;
      padding-left: 10px;
      padding-right: 10px;
      font-size: 16px;
   }

   .footer__btn.pc {
      display: none;
   }

   .footer__btn.mobile {
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      gap: 4px;
   }

   .footer__btn.mobile svg {
      width: 18px;
      height: 18px;
   }

   .footer__btn.mobile svg path {
      fill: #1c1c1c;
   }

   .footer__subtitle {
      font-size: 14px;
   }

   .footer__item {
      gap: 13px;
   }

   .footer__down {
      -webkit-box-orient: vertical;
      -webkit-box-direction: reverse;
      -ms-flex-direction: column-reverse;
      flex-direction: column-reverse;
      gap: 40px;
   }

   .footer__downlist {
      gap: 15px;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
   }

   .footer__downlist a {
      font-size: 12px;
   }

   .footer__downlist a svg {
      display: none;
   }

   .showreel-section {
      /*display: none;*/
      height: auto !important;
   }

   .home-hero__title {
      font-size: 21px;
   }

   .home-hero__rating {
      margin-top: 30px;
   }

   .rating-item {
      max-height: unset;
      gap: 12px;
   }

   .rating-item__icon img {
      width: 20px;
   }

   .rating-item__title {
      font-size: 14px;
   }

   .rating-item__link {
      font-size: 12px;
   }

   .direction-hero {
      padding-bottom: 80px;
   }

   .direction-hero__title {
      font-size: 28px;
   }

   .services-section {
      padding-bottom: 80px;
   }

   .services-section__wrapper {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      gap: 20px;
   }

   .services-section__list {
      -webkit-box-flex: unset;
      -ms-flex: unset;
      flex: unset;
   }

   .services-item {
      padding-top: 20px;
   }

   .services-item:nth-child(1) {
      padding-top: 0;
   }

   .services-item__title {
      font-size: 22px;
   }

   .services-item__header {
      padding-bottom: 20px;
   }

   .services-item__header svg {
      width: 18px;
      height: 18px;
      -webkit-box-flex: 0;
      -ms-flex: 0 0 18px;
      flex: 0 0 18px;
   }

   .services-item__header.active {
      padding-bottom: 10px;
   }

   .services-item__content {
      padding-bottom: 20px;
      font-size: 14px;
   }

   .direction-preference {
      padding: 60px 0;
   }

   .direction-preference__title {
      text-transform: lowercase;
      font-size: 26px;
      line-height: 28.6px;
   }

   .direction-preference__title span {
      color: #fff;
   }

   .direction-preference__title::before {
      width: 22px;
      height: 23px;
      translate: 0 5px;
      margin-right: 5px;
   }

   .direction-steps {
      padding-top: 112px;
      padding-bottom: 80px;
   }

   .direction-steps__wrapper {
      gap: 30px;
   }

   .direction-steps__item {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      gap: 20px;
      padding-bottom: 20px;
   }

   .direction-steps__subtitle {
      -webkit-box-flex: unset;
      -ms-flex: unset;
      flex: unset;
      font-size: 22px;
   }

   .direction-steps__list {
      gap: 20px;
   }

   .direction-steps__sublist {
      font-size: 14px;
   }

   .direction-steps__sublist li::before {
      translate: 0 6px;
      font-size: 30px;
   }

   .cases-section {
      margin-bottom: 80px;
   }

   .cases-section__wrapper {
      gap: 30px;
   }

   .cases-section__list {
      -ms-grid-columns: 1fr;
      grid-template-columns: 1fr;
      row-gap: 40px;
   }

   .case-card {
      gap: 15px;
      height: 133.0909090909vw;
   }

   .case-card__title {
      font-size: 20px;
   }

   .articles-section {
      margin-bottom: 90px;
   }

   .articles-section__wrapper {
      gap: 30px;
   }

   .articles-section__list {
      -ms-grid-columns: 1fr;
      grid-template-columns: 1fr;
      gap: 30px;
   }

   .articles-card {
      gap: 18px;
   }

   .articles-card__text {
      gap: 10px;
   }

   .articles-card__title {
      font-size: 18px;
   }

   .articles-card__subtitle {
      font-size: 14px;
   }

   .brief-section {
      padding: 50px 0;
   }

   .brief-section__wrapper {
      gap: 30px;
   }

   .brief-section__title {
      font-size: 30px;
   }

   .brief-section__link {
      height: 46px;
      padding: 0 30px;
      font-size: 20px;
   }

   .brief-section__link img {
      width: 20px;
   }

   .direction-tech {
      margin-bottom: 80px;
   }

   .direction-tech__wrapper {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      gap: 30px;
   }

   .direction-tech__title {
      -webkit-box-flex: unset;
      -ms-flex: unset;
      flex: unset;
   }

   .direction-tech__subtitle {
      font-size: 24px;
   }

   .direction-tech__item {
      gap: 16px;
      padding-bottom: 16px;
   }

   .direction-tech__item li {
      font-size: 16px;
      height: 34px;
   }

   .digital-formats {
      margin-bottom: 80px;
   }

   .digital-formats__wrapper {
      gap: 30px;
   }

   .digital-formats__list {
      -ms-grid-columns: 1fr;
      grid-template-columns: 1fr;
   }

   .digital-formats__subtitle {
      font-size: 24px;
   }

   .digital-formats__description {
      font-size: 14px;
   }

   .digital-formats__item {
      gap: 24px;
   }

   .digital-formats__image {
      height: 200px;
   }

   .digital-formats__text {
      gap: 8px;
   }

   .about-hero {
      padding-top: 120px;
      padding-bottom: 160px;
   }

   .about-hero__wrapper {
      height: unset;
   }

   .about-hero__title {
      font-size: 34px;
   }

   .about-method {
      padding-top: 70px;
      padding-bottom: 50px;
   }

   .about-method__wrapper {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      gap: 20px;
      font-size: 20px;
   }

   .about-method__title {
      font-weight: 500;
      -webkit-box-flex: unset;
      -ms-flex: unset;
      flex: unset;
   }
   .about-method__description {
      white-space: normal;
   }


   .about-circles {
      padding-bottom: 47px;
   }

   .about-circles__list {
      margin: 0;
      height: calc(300px + 700 * (100vw - 320px) / 672);
   }

   .about-circles__item {
      max-width: 480px;
      width: calc(50% - 10px);
   }

   .about-showreel {
      margin-bottom: 50px;
   }

   .about-showreel__wrapper {
      gap: 5px;
   }

   .about-showreel__title {
      font-size: 12px;
   }

   .about-showreel__video button {
      font-size: 11px;
      width: 70px;
      height: 70px;
   }

   .about-rating {
      margin-bottom: 80px;
   }

   .about-rating__title {
      display: none;
   }

   .about-rating__list {
      margin-left: -10px;
      margin-right: -10px;
      padding-right: 10px;
      padding-left: 10px;
      width: 100vw;
      overflow-x: auto;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-column-gap: 30px;
      -moz-column-gap: 30px;
      column-gap: 30px;
   }

   .about-rating__item {
      -webkit-box-flex: 0;
      -ms-flex: 0 0 180px;
      flex: 0 0 180px;
      gap: 12px;
   }

   .about-rating__icon {
      -webkit-box-flex: 0;
      -ms-flex: 0 0 20px;
      flex: 0 0 20px;
      width: 20px;
      height: -webkit-fit-content;
      height: -moz-fit-content;
      height: fit-content;
   }

   .about-rating__icon img {
      width: 100%;
      height: 100%;
      -o-object-fit: cover;
      object-fit: cover;
   }

   .about-rating__subtitle {
      font-size: 16px;
   }

   .about-rating__description {
      font-size: 12px;
   }

   .about-actions__list span {
      font-size: 50px;
   }

   .about-actions {
      margin-bottom: 120px;
   }

   .review-section__wrapper .swiper-slide {
      padding: 0 10px;
   }

   .review-section__btns {
      right: unset;
      left: 10px;
      bottom: 40px;
      gap: 12px;
   }

   .review-section__nav {
      width: 30px;
      height: 30px;
      -webkit-box-flex: 0;
      -ms-flex: 0 0 30px;
      flex: 0 0 30px;
   }

   .review-section__nav svg {
      width: 12px;
      -webkit-box-flex: 0;
      -ms-flex: 0 0 12px;
      flex: 0 0 12px;
   }

   .review-item {
      gap: 20px;
   }

   .review-item__content {
      font-size: 16px;
   }

   .review-item__content::before {
      height: 50px;
      width: 56px;
      background-size: cover;
   }

   .review-item__footer {
      padding-bottom: 100px;
   }

   .review-item__author {
      gap: 10px;
   }

   .review-item__avatar {
      -webkit-box-flex: 0;
      -ms-flex: 0 0 46px;
      flex: 0 0 46px;
      width: 46px;
   }

   .review-item__info {
      font-size: 14px;
   }

   .brief-page {
      padding-bottom: 95px;
   }

   .brief-page__header {
      gap: 12px;
   }

   .brief-page__time {
      font-size: 14px;
   }

   .brief-page__wrapper {
      gap: 80px;
   }

   .brief-page__title {
      font-size: 36px;
   }

   .brief-page__list {
      -ms-grid-columns: 1fr;
      grid-template-columns: 1fr;
      row-gap: 25px;
   }

   .brief-page__list .full-width {
      -ms-grid-column-span: 1;
      grid-column: span 1;
   }

   .brief-item__subtitle {
      font-size: 20px;
   }

   .brief-item__list {
      gap: 10px;
   }

   .brief-item.border-none {
      border-bottom: 1px solid #e6e6ed;
   }

   .input-item input,
   .input-item label {
      font-size: 20px;
   }

   .input-item input {
      top: -33px;
      right: 5px;
   }

   .input-item input {
      height: 38px;
   }

   .input-item.filled label {
      font-size: 10px;
   }

   .file-input img {
      width: 16px;
      height: 16px;
   }

   .file-input button img {
      width: 10px;
      height: 10px;
   }

   .file-input div.has-file {
      gap: 6px;
   }

   .radio-item label {
      height: 34px;
      font-size: 14px;
   }

   .brief-submit {
      gap: 15px;
   }

   .brief-submit button {
      font-size: 20px;
   }

   .brief-submit svg {
      width: 20px;
      height: auto;
   }

   .brief-submit__remind {
      font-size: 12px;
   }

   .contacts-page {
      padding-bottom: 0px;
   }

   .contacts-page__title {
      font-size: 36px;
   }

   .contacts-page__wrapper {
      gap: 70px;
   }

   .contacts-page__list {
      -ms-grid-columns: 1fr;
      grid-template-columns: 1fr;
      gap: 40px;
   }

   .contacts-page__item {
      gap: 20px;
   }

   .contacts-page__subtitle {
      font-size: 18px;
   }

   .contacts-page__sublist {
      gap: 15px;
   }

   .contacts-page__link {
      font-size: 24px;
   }

   .case-hero {
      margin-bottom: 20px;
   }

   .case-hero__wrapper {
      -ms-grid-columns: 1fr;
      grid-template-columns: 1fr;
      gap: 0;
   }

   .case-hero__title {
      margin-top: 30px;
      margin-bottom: 30px;
      -webkit-box-ordinal-group: 3;
      -ms-grid-column-span: 1;
      grid-column: span 1;
      font-size: 36px;
   }

   .case-hero__tags {
      -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
      order: 1;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      flex-direction: column;
   }

   .case-hero__tags li {
      font-size: 14px;
      font-weight: 500;
   }

   .case-hero__tags li::after {
      font-size: 14px;
   }

   .case-hero__link {
      -webkit-box-ordinal-group: 4;
      -ms-flex-order: 3;
      order: 3;
      -webkit-box-pack: start;
      -ms-flex-pack: start;
      justify-content: start;
      font-size: 14px;
   }

   .case-description {
      margin-bottom: 40px;
   }

   .case-description__wrapper {
      gap: 30px;
   }

   .case-description__item {
      padding-bottom: 30px;
      gap: 20px;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
   }

   .case-description__subtitle {
      -webkit-box-flex: unset;
      -ms-flex: unset;
      flex: unset;
      font-size: 22px;
   }

   .case-description__subtitle br {
      display: none;
   }

   .case-description__text {
      font-size: 24px;
   }

   .case-gallery {
      margin-bottom: 80px;
   }

   .error-page {
      padding-bottom: 150px;
   }

   .error-page__wrapper {
      gap: 50px;
   }

   .error-page__title {
      font-size: 30px;
   }

   .error-page__link {
      padding: 0 20px;
      font-size: 20px;
      height: 42px;
   }

   .error-page__link svg {
      width: 20px;
   }

   .documents-page {
      padding-bottom: 80px;
   }

   .documents-page__wrapper {
      gap: 50px;
   }

   .documents-page__title {
      font-size: 36px;
   }

   .documents-page__list {
      -ms-grid-columns: 1fr;
      grid-template-columns: 1fr;
      row-gap: 10px;
   }

   .document-card {
      height: 172px;
      padding: 20px;
   }

   .document-card__title {
      font-size: 22px;
   }

   .document-card__btn {
      width: 35px;
      height: 35px;
      -webkit-box-flex: 0;
      -ms-flex: 0 0 35px;
      flex: 0 0 35px;
   }

   .document-card__btn svg {
      width: 20px;
   }

   .blog-hero {
      margin-bottom: 50px;
   }

   .blog-hero__wrapper {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
   }

   .blog-hero__title {
      font-size: 100px;
   }

   .blog-hero__filters {
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      max-width: 647px;
      row-gap: 20px;
   }

   .blog-hero__filters li {
      gap: 4px;
   }

   .blog-hero__filters li::after {
      translate: 0 -5px;
   }

   .blog-hero__filters label span {
      font-size: 24px;
   }

   .blog-hero__filters label .index {
      font-size: 10px;
   }

   .blog-content__footer {
      width: 100%;
   }

   .blog-content__main ul {
      -ms-grid-columns: 1fr;
      grid-template-columns: 1fr;
   }

   .blog-content__main ul li.column-2 {
      -ms-grid-column-span: 1;
      grid-column: span 1;
      max-width: unset;
   }

   .blog-content__main ul li.column-2 .article-card {
      padding: 0;
      border: 0;
   }

   .article-page .review-item {
      padding-left: 24px;
      padding-right: 24px;
      padding-bottom: 24px;
   }

   .article-page .review-item__content {
      font-size: 14px;
   }

   .article-hero {
      padding-top: 65px;
      margin-bottom: 16px;
   }

   .article-hero__wrapper {
      padding-bottom: 16px;
      gap: 24px;
   }

   .article-hero__title {
      font-size: 40px;
   }

   .article-hero__image {
      max-height: 292px;
   }

   .article-content__media {
      margin-top: 32px;
   }

   .article-content__main .article-content__media {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
   }

   .article-content__title {
      font-size: 32px;
      margin-bottom: 32px;
   }

   .article-content__wrapper {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      gap: 48px;
   }

   .article-content__aside {
      -webkit-box-flex: unset;
      -ms-flex: unset;
      flex: unset;
   }

   .article-content__aside .article-content__media {
      display: none;
   }

   .article-content__post {
      -webkit-box-flex: unset;
      -ms-flex: unset;
      flex: unset;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      gap: 64px;
   }

   .article-content__subtitle {
      font-size: 24px;
   }

   .article-gallery .swiper {
      margin-left: -10px;
      margin-right: -10px;
      padding-left: 10px;
      padding-right: 10px;
   }

   .articles-slider__nav {
      display: none;
   }

   .articles-slider__title {
      font-size: 64px;
   }

   .articles-slider__header {
      padding: 0 10px;
   }

   .articles-slider .swiper {
      padding-left: 10px;
      padding-right: 10px;
   }

   .articles-slider .swiper-slide {
      max-width: 366px;
   }

   .article-card {
      padding-right: 8px;
   }

   .article-card__title {
      font-size: 24px;
   }

   .article-card__index {
      font-size: 13px;
   }

   .article-card__description {
      font-size: 16px;
   }

   .article-card__header {
      gap: 4px;
   }
}
.footer .project-btn.desktop span:nth-child(1) {
   color: #1c1c1c !important;
}
.footer .project-btn.desktop:hover span:nth-child(1) {
   color: #1c1c1c !important;
}
@media (max-width: 992px) {
   .footer .project-btn.desktop {
      display: none;
   }
}
@media (max-width: 650px) {
   .blog-content__grid {
      -ms-grid-columns: 1fr;
      grid-template-columns: 1fr;
   }

   .blog-content__grid .article-card {
      border-right: 0;
      padding: 0;
   }

   .blog-content__grid li:has(.project-btn) {
      -ms-grid-column-span: 1;
      grid-column: span 1;
   }
}

@media (max-width: 568px) {
   .footer__down {
      align-items: flex-start;
   }
   .footer a.arda {
      position: absolute;
      right: 16px;
   }
   .blog-hero {
      margin-bottom: 32px;
   }

   .blog-hero__title {
      font-size: 80px;
   }

   .blog-hero__wrapper {
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start;
   }

   .blog-hero__filters {
      -webkit-box-pack: start;
      -ms-flex-pack: start;
      justify-content: flex-start;
      row-gap: 0;
      gap: 12px;
   }

   .blog-hero__filters li {
      gap: 8px;
   }

   .blog-hero__filters li::after {
      font-size: 24px;
   }

   .blog-hero__filters label span {
      font-size: 18px;
   }

   .blog-hero__filters label .index {
      font-size: 10px;
   }

   .articles-slider__wrapper {
      gap: 32px;
   }

   .articles-slider__title {
      font-size: 40px;
   }
}

@media (hover: hover) {
   .project-btn:hover {
      background-color: #a8fd32;
      margin-left: -3px;
      padding-left: 43px;
      padding-right: 43px;
   }

   .project-btn:hover span:nth-child(1) {
      translate: 0 -200%;
   }

   .project-btn:hover span:nth-child(2) {
      top: 50%;
      translate: -50% -50%;
   }

   .header.transparent .header__btn:hover {
      background-color: #fff;
      color: #171717;
   }

   .header.transparent .header__btn:hover svg path {
      fill: #171717;
   }

   .header__oneum:hover span {
      border-color: #1a1d23;
      color: #1a1d23 !important;
   }

   .header__link:hover .header__sublist {
      opacity: 1;
      pointer-events: all;
   }

   .header__sublink:hover {
      color: #1a1d23;
   }

   .header__link:has(:hover) span {
      /*opacity: .4;*/
   }

   .header__link .header__sublist li:hover ~ * {
      /*color: #a8fd32;*/
      /*opacity: .4;*/
   }

   .header__link .header__sublist:hover > :not(:hover) {
      opacity: .4;
   }

   .header .project-btn:hover {
      padding: 0 16px;
      background: #1C1C1C;
      color: #FFFFFF;
      margin: 0;
      margin-left: -3px;
      margin-right: -3px;
      width: 162px;
   }

   .header .project-btn:hover path {
      fill: #FFFFFF;
   }

   .header__btn:hover {
      background-color: #1c1c1c;
      color: #fff;
   }

   .header__btn:hover svg path {
      fill: #fff;
   }

   .footer .project-btn:hover {
      padding: 0 19px;
      background-color: #a8fd32 !important;
   }

   .footer__link:hover {
      color: #a8fd32;
   }

   .footer__downlist a:hover {
      color: #a8fd32;
   }

   .footer__downlist a:hover svg path {
      fill: #a8fd32;
   }

   .services-item__content a:hover {
      background-color: #1c1c1c;
      color: #fff;
   }

   .case-card__image:hover .case-card__link {
      opacity: 1;
   }

   .articles-card:hover .articles-card__image img {
      scale: 1.1;
   }

   .articles-card:hover .articles-card__title {
      color: #a8fd32;
   }

   .brief-section__link:hover img {
      translate: 5px -5px;
   }

   .radio-item label:hover {
      color: #fff;
      background-color: #1c1c1c;
   }

   .brief-submit__remind a:hover {
      color: #acb4bc;
      border-color: #acb4bc;
   }

   .contacts-page__link:hover {
      color: #a8fd32;
   }

   .case-hero__link:hover {
      color: #a8fd32;
   }

   .case-hero__link:hover svg path {
      fill: #a8fd32;
   }

   .error-page__link:hover svg {
      rotate: 45deg;
   }

   .document-card:hover .document-card__btn svg {
      rotate: 45deg;
   }

   .document-card:hover .document-card__btn svg path {
      fill: #1c1c1c;
   }

   .blog-content__grid .project-btn:hover {
      margin-left: 0;
      margin-right: -3px;
   }

   .blog-content__grid .project-btn:hover span:nth-child(1) {
      translate: 0 -30px;
   }

   .blog-content__footer a:hover {
      border-color: transparent;
   }
}

.webp .about-hero {
   background: url(/local/templates/oktta_new/img/about/fon.jpg) center/cover
         no-repeat
}

.webp .documents-page__list li:nth-child(1) a {
   background: url(/local/templates/oktta_new/img/documents/vector.webp)
         center/cover no-repeat,
      #e7f2f9;
}

.webp .documents-page__list li:nth-child(2) a {
   background: url(/local/templates/oktta_new/img/documents/vector.webp)
         center/cover no-repeat,
      #e9f2e4;
}

.webp .documents-page__list li:nth-child(3) a {
   background: url(/local/templates/oktta_new/img/documents/vector.webp)
         center/cover no-repeat,
      #f8ebde;
}

.webp .documents-page__list li:nth-child(4) a {
   background: url(/local/templates/oktta_new/img/documents/vector.webp)
         center/cover no-repeat,
      #e8e4f2;
}

/**/

.lenis-scrolling iframe {
   pointer-events: none;
}

/**/

.cursor-view {
   position: fixed;
   top: 0;
   left: 0;
   z-index: 999;
   pointer-events: none;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 57px;
   padding: 8px 16px;
   width: 96px;
   height: 34px;
   margin-top: 24px;
   margin-left: 8px;
   background: #fff;
   font-size: 14px;
   letter-spacing: 0.05em;
   color: #1c1c1c;
   transform: translate(0, 0);
   transition-duration: 0.2s;
   transition-timing-function: ease-out;
   opacity: 0;
   box-shadow: 0 0px 6px 0px rgba(0, 0, 0, 0.08);
}

.news-list:has(.project-item:hover) .cursor-view {opacity: 1 !important;}

.cursor-view2 {
   position: fixed;
   top: 0;
   left: 0;
   z-index: 999;
   pointer-events: none;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 57px;
   padding: 8px 16px;
   width: 96px;
   height: 34px;
   margin-top: 24px;
   margin-left: 8px;
   background: #fff;
   font-size: 14px;
   letter-spacing: 0.05em;
   color: #1c1c1c;
   transform: translate(0, 0);
   transition-duration: 0.2s;
   transition-timing-function: ease-out;
   opacity: 0;
   box-shadow: 0 0px 6px 0px rgba(0, 0, 0, 0.08);
}

.cursor-view3 {
   position: fixed;
   top: 0;
   left: 0;
   z-index: 999;
   pointer-events: none;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 57px;
   padding: 8px 16px;
   width: 96px;
   height: 34px;
   margin-top: 24px;
   margin-left: 8px;
   background: #fff;
   font-size: 14px;
   letter-spacing: 0.05em;
   color: #1c1c1c;
   transform: translate(0, 0);
   transition-duration: 0.2s;
   transition-timing-function: ease-out;
   opacity: 0;
   box-shadow: 0 0px 6px 0px rgba(0, 0, 0, 0.08);
}

.cursor-view-cs {
   position: fixed;
   top: 0;
   left: 0;
   z-index: 999;
   pointer-events: none;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 57px;
   padding: 8px 16px;
   width: 96px;
   height: 34px;
   margin-top: 24px;
   margin-left: 8px;
   background: #fff;
   font-size: 14px;
   letter-spacing: 0.05em;
   color: #1c1c1c;
   transform: translate(0, 0);
   transition-duration: 0.2s;
   transition-timing-function: ease-out;
   opacity: 0;
   box-shadow: 0 0px 6px 0px rgba(0, 0, 0, 0.08);
}

@media (max-width: 768px) {
   .cursor-view, .cursor-view2, .cursor-view3 {
      display: none;
   }
}

/**/

.check-block {
   display: flex;
   flex-direction: column;
   gap: 10px;
}

.check-block .checkbox {
   display: flex;
   align-items: flex-start;
   gap: 10px;

}

.check-block .checkbox .check {
   border-radius: 6px;
   width: 16px;
   height: 16px;
   border: 1px solid #d9d9d9;
   background-color: #d9d9d9;
   cursor: pointer;
}

.check-block .checkbox:has(.error) .check {
   border-color: #FD5099;
}

.check-block .checkbox:has(:checked) .check {
   background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M4.99985 7.58545L9.59605 2.98926L10.3032 3.69636L4.99985 8.99965L1.81787 5.8177L2.52498 5.1106L4.99985 7.58545Z' fill='black' /%3e%3c/svg%3e");
   background-position: center;
   background-repeat: no-repeat;
}

.check-block .checkbox p {
   font-size: 14px;
   color: #1c1c1c;
   max-width: 100%;
   margin: 0;
}

.check-block .checkbox a {
   font-size: 14px;
   color: #1c1c1c;
   text-decoration: underline;
}

/**/

.home-hero__subtitle {
   display: flex;
   align-items: center;
   gap: 10px;
   font-size: 26px;
   line-height: 120%;
   color: #7a7f87;
   display: none;
}
@media (max-width: 568px) {
   .home-hero__subtitle {
      font-size: 12px;
      line-height: 110%;
      max-width: 230px;
   }
   .home-hero__subtitle svg {
      display: none;
   }
}