.pc {
    display: block !important;
}

.pc-flex {
    display: flex !important;
}

.pctablet {
    display: block !important;
}

.pctablet-flex {
    display: flex !important;
}

.tablet {
    display: none !important;
}

.tablet-flex {
    display: none !important;
}

.mobile {
    display: none !important;
}

.mobile-flex {
    display: none !important;
}

@media (max-width: 1024px) {
    .pc {
        display: none !important;
    }

    .pc-flex {
        display: none !important;
    }

    .pctablet {
        display: flex !important;
    }

    .pctablet-flex {
        display: none !important;
    }

    .tablet {
        display: block !important;
    }

    .tablet-flex {
        display: flex !important;
    }

    .mobile {
        display: none !important;
    }

    .mobile-flex {
        display: none !important;
    }
}

@media (max-width: 568px) {
    .pc {
        display: none !important;
    }

    .pc-flex {
        display: none !important;
    }

    .pctablet {
        display: none !important;
    }

    .pctablet-flex {
        display: none !important;
    }

    .tablet {
        display: none !important;
    }

    .tablet-flex {
        display: none !important;
    }

    .mobile {
        display: block !important;
    }

    .mobile-flex {
        display: flex !important;
    }
}

/*@font-face {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-style: normal;
}*/

* {
    box-sizing: border-box;
    font-family: "Poppins", sans-serif;
}

*:not(.text-line, .text-line *) {
    color: #000;
}

.old_tt:not(:has(.old_tt)) {
    font-family: "Old Standard TT", serif !important;
    font-style: italic !important;
}

html.menu-open {
    overflow: hidden;
}

body {
    /*overflow-x: hidden;*/
    position: relative;
}
@media (max-width: 568px) {
    html {
        overflow-x: hidden;
    }
    body {
        /*overflow-x: hidden;*/
    }
}

h1, h2, h3, h4 {
    margin: 0;
}

h1 {

}

h2 {

}

h3 {

}

h4 {

}

a {
    text-decoration: none;
    cursor: pointer;
}
a:hover {

}

p {
    margin-bottom: 0;
}

img {
    max-width: 100%;
}

nav {
    list-style: none;
    padding: 0;
}

video {
    mix-blend-mode: normal;
    filter: none;
    -webkit-appearance: none;
    color-scheme: light;
    -webkit-filter: none;
}

/* header */

header {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 59;
    mix-blend-mode: difference;
    isolation: isolate; /* создаём изоляцию */
}

header .header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    padding: 19px 24px;
}
@media (max-width: 568px) {
    header .header {
        padding: 12px 12px;
    }
}

header .logo {
    position: relative;      /* создаём собственный стекинг (поверх меню) */
    z-index: 10;             /* выше, чем меню */
    isolation: isolate;      /* изолируем для корректного отрисовки */
    mix-blend-mode: normal;  /* убираем инверсии */
    background: transparent; /* на всякий случай */
}

/* Меню наследует blend-mode от header */
header .menu {
    display: flex;
    align-items: center;
    gap: 32px;
}

header .menu nav {
    display: flex;
    gap: 22px;
    list-style: none;
    padding: 0;
    transition: .3s ease;
}
@media (max-width: 1024px) {
    header .menu nav {
        display: none;
    }
}
header .menu nav.scroll-menu {
    opacity: 0;
    pointer-events: none;
}

header .menu nav li a {
    font-size: 13px;
    line-height: 135%;
    letter-spacing: 0.01em;
    color: #ffffff;
    position: relative;
    transition: .3s ease;
}
header .menu nav li a:after {
    background-color: currentColor;
    bottom: 0;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    transform: scaleX(0);
    transform-origin: 0 50%;
    transition: transform .6s
    cubic-bezier(.85, 0, .15, 1);
    width: 100%;
    will-change: transform;
}
header .menu nav li a:not(:hover):after {
    transform-origin: 100% 50%;
}
header .menu nav li a:hover:after {
    transform: scaleX(1);
    transform-origin: 0 50%;
}
header .menu nav li a:hover {
    /*border-bottom: 1px solid #fff;*/
    /*padding: 0px 0px 2px;*/
}

header .menu .btn {
    border-radius: 40px;
    width: 98px;
    height: 52px;
    background: #ffffff;
    border: 1px solid #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #000000;
    position: relative;
    z-index: 1;
    overflow: hidden;
    transition: .3s ease;
    outline: none;
    box-shadow: none;
}
header .menu .btn.btn-desktop {

}
header .menu .btn.btn-mobile {
    display: none;
    border: none;
    outline: none;
    box-shadow: none;
}
@media (max-width: 1024px) {
    header .menu .btn.btn-desktop {
        display: none;
    }
    header .menu .btn.btn-mobile {
        display: flex;
    }
}
header .menu .btn:after {
    content: '';
    background: #000000;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    pointer-events: none;
    transform: translate(0px, 100%);
    transition: .3s ease;
}
@media (min-width: 1025px) {
    header .menu .btn:hover {
        color: #ffffff;
        border: 1px solid #fff;
    }
    header .menu .btn:hover span {
        color: #ffffff;
    }
    header .menu .btn:hover:after {
        transform: translate(0px, 0%);
    }
}
header .menu .btn.active {

}
@media (min-width: 1025px) {
    header .menu .btn .close-menu {
        display: none;
    }
}
@media (max-width: 1024px) {
    header .menu .btn  {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    header .menu .btn span {
        overflow: hidden;
        transition: .3s ease;
    }
    header .menu .btn .close-menu {
        height: 0px;
        transform: translateY(100%);
    }
    header .menu .btn.active .close-menu {
        height: 16px;
        transform: translateY(0%);
    }
    header .menu .btn .menu-menu {
        transform: translateY(0%);
        height: 16px;
    }
    header .menu .btn.active .menu-menu {
        transform: translateY(-100%);
        height: 0px;
    }
}

/* menu-mob */

.menu-mob {
    background: #000;
    position: fixed;
    top: -30vh;
    bottom: 0;
    width: 100%;
    z-index: 55;
    height: 100dvh;
    overflow-y: auto;
    padding: 12px;
    padding-top: 20dvh;
    display: flex;
    flex-direction: column;
    /*justify-content: center;*/
    gap: 64px;
    max-height: 0dvh;
    transition: .9s ease;
}
.menu-mob * {
    opacity: 0;
    filter: blur(5px);
    transition: .9s ease;
}
.menu-mob.active {
    top: 0vh;
    max-height: 100dvh;
}
.menu-mob.active * {
    opacity: 1;
    filter: blur(0);
}
.menu-mob::-webkit-scrollbar {
    display: none;
}
.menu-mob nav {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.menu-mob nav a {
    font-weight: 500;
    font-size: 36px;
    line-height: 105%;
    text-transform: uppercase;
    color: #fff;
}
.menu-mob .info {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.menu-mob .info span {
    font-size: 14px;
    line-height: 148%;
    color: rgba(255, 255, 255, 0.4);
}
.menu-mob .info .link-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.menu-mob .info .link-list a {
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 4px;
}

/* footer */

footer {
    position: relative;
    z-index: 2;
}
footer .footer {
    padding: 40px 24px 24px;
    background: #000;
    display: flex;
    flex-direction: column;
    gap: 82px;
}
@media (max-width: 568px) {
    footer .footer {
        padding: 64px 12px 24px;
        overflow: hidden;
        gap: 64px;
    }
}
.footer .top {
    display: flex;
    justify-content: space-between;
    gap: 32px;
    margin-bottom: calc(114px - 82px);
}
@media (max-width: 1024px) {
    .footer .top {
        flex-direction: column;
        align-items: flex-start;
        gap: 100px;
    }
}
@media (max-width: 568px) {
    .footer .top {
        gap: 64px;
        margin: 0;
    }
}
.footer .top .left {
    max-width: 515px;
    display: flex;
    flex-direction: column;
    gap: 48px;
}
@media (max-width: 1024px) {
    .footer .top .left {
        max-width: 610px;
    }
}
.footer .top .left p {
    font-weight: 500;
    font-size: 40px;
    line-height: 110%;
    color: #fff;
}
@media (max-width: 1024px) {
    .footer .top .left p {
        font-size: 32px;
        line-height: 120%;
    }
}
@media (max-width: 568px) {
    .footer .top .left p {
        font-size: 20px;
    }
}
.footer .top .left a {
    border-radius: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 108px;
    height: 52px;
    background: #212121;
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #fff;
    transition: .3s ease;
}
.footer .top .left a:hover {
    background: #fff;
    color: #000000;
}
.footer .top .right {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: flex-start;
    padding-right: 50px;
}
@media (max-width: 1024px) {
    .footer .top .right {
        align-items: flex-start;
    }
}
.footer .top .right a {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    color: #fff;
    position: relative;
    transition: .3s ease;
}
@media (max-width: 1024px) {
    .footer .top .right a {
        font-size: 20px;
    }
}
@media (max-width: 568px) {
    .footer .top .right a {
        font-size: 13px;
    }
}
.footer .top .right a:hover {
    /*border-bottom: 1px solid #fff;*/
    /*padding: 0px 0px 2px;*/
    /*margin-bottom: -2px;*/
}
.footer .middle {
    display: flex;
    justify-content: space-between;
    gap: 32px;
}
@media (max-width: 1024px) {
    .footer .middle {
        flex-direction: row-reverse;
    }
}
@media (max-width: 568px) {
    .footer .middle {
        flex-direction: column-reverse;
    }
}
.footer .middle .left {
    position: relative;
}
.footer .middle .left img,
.footer .middle .left video {
    max-width: 220px;
}
@media (max-width: 568px) {
    .footer .middle .left video {
        position: absolute;
        right: -8px;
    }
}
.footer .middle .right {
    display: flex;
    gap: 96px;
    padding-right: 80px;
}
@media (max-width: 1024px) {
    .footer .middle .right {
        gap: 136px;
    }
}
.footer .middle .right .col {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.footer .middle .right .col span {
    line-height: 148%;
    color: rgba(255, 255, 255, 0.4);
}
.footer .middle .right .col nav {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.footer .middle .right .col nav li {

}
.footer .middle .right .col nav li a {
    line-height: 148%;
    color: #fff;
    transition: .3s ease;
    position: relative;
}
.footer .middle .right .col nav li a:hover {
    /*border-bottom: 1px solid #fff;*/
    /*padding: 0px 0px 2px;*/
}
.footer .bottom {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 32px;
    padding-top: 24px;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
}
@media (max-width: 1024px) {
    .footer .bottom {
        flex-direction: column-reverse;
        border: none;
        gap: 20px;
    }
}
.footer .bottom .left {

}
@media (max-width: 1024px) {
    .footer .bottom .left {
        /*position: absolute;*/
        border-top: 1px solid rgba(255, 255, 255, 0.2);
        padding: 20px 0px 0px;
        display: flex;
        width: 100%;
        justify-content: space-between;
    }
}
.footer .bottom .left p,
.footer .bottom .left p a {
    font-size: 12px;
    line-height: 135%;
    color: #fff;
}
.footer .bottom .left p:has(a) {
    color: rgba(255, 255, 255, 0.4);
}
.footer .bottom .right {
    display: flex;
    gap: 250px;
    align-items: flex-end;
}
@media (max-width: 1024px) {
    .footer .bottom .right {
        align-items: flex-start;
        width: 100%;
        flex-direction: row-reverse;
        justify-content: flex-end;
        gap: 70px;
    }
}
@media (max-width: 568px) {
    .footer .bottom .right {
        flex-direction: column-reverse;
        gap: 74px;
    }
}
.footer .bottom .right .col {
    display: flex;
    gap: 74px;
    align-items: flex-end;
    flex: none;
}
@media (max-width: 1024px) {
    .footer .bottom .right .col {
        /*flex-direction: column;*/
        /*align-items: flex-start;*/
        /*gap: 40px;*/
    }
}
.footer .bottom .right .col p {
    font-size: 12px;
    line-height: 135%;
    color: #fff;
    white-space: nowrap;
}
.footer .bottom .right .col p:has(a) {
    color: rgba(255, 255, 255, 0.4);
}
.footer .bottom .right .col div {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.footer .bottom .right .col div a {
    font-size: 12px;
    line-height: 135%;
    color: #fff;
    white-space: nowrap;
    padding: 0px 0px 2px;
    position: relative;
    width: fit-content;
    transition: .3s ease;
}
.footer .bottom .right .col div a:hover {
    /*text-decoration: underline;*/
}
.footer .bottom .right .col a {
    color: #fff;
    transition: .3s ease;
}
.footer .bottom .right .col a:hover {
    /*text-decoration: underline;*/
}

/* content */

.content {
    padding-top: 96px;
}
.content:has(.main-banner) {
    padding-top: 0;
}

/* main-banner */

.main-banner {
    background: #e7e7e7;
    padding: 18px 0px 0px 0px;
    padding-top: calc(64px + 90px);
    position: relative;
    height: 220dvh;
}
@media (max-width: 568px) {
    .main-banner {
        height: auto;
    }
}
.main-banner .banner {
    position: sticky;
    top: calc(64px + 96px);
    width: 100%;
    padding: 0 24px;
    display: flex;
    flex-direction: column;
    gap: 40px;
    min-height: calc(100dvh - (64px + 96px) - 18px);
    max-height: calc(100dvh - (64px + 96px) - 18px);
}
@media (max-width: 568px) {
    .main-banner .banner {
        position: initial;
        overflow: hidden;
        min-height: fit-content;
        margin-bottom: 50px;
        padding: 0 12px;
    }
}
.main-banner .banner h1 {
    font-weight: 500;
    font-size: 195px;
    line-height: 100%;
    letter-spacing: -0.02em;
    color: #000;
    width: fit-content;
}
@media (max-width: 1024px) {
    .main-banner .banner h1 {
        font-size: 150px;
    }
}
@media (max-width: 568px) {
    .main-banner .banner h1 {
        font-size: 80px;
    }
}
.main-banner .banner p {
    font-weight: 500;
    font-size: 40px;
    line-height: 130%;
    color: #000;
    width: fit-content;
}
@media (max-width: 1024px) {
    .main-banner .banner p {
        font-size: 32px;
    }
}
@media (max-width: 568px) {
    .main-banner .banner p {
        font-size: 20px;
    }
}
.main-banner .banner .video-br {
    overflow: hidden;
    width: 853px;
    height: 640px;
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: -1;
}
@media (max-width: 1024px) {
    .main-banner .banner .video-br {
        bottom: 40px;
        width: 100%;
    }
}
@media (max-width: 568px) {
    .main-banner .banner .video-br {
        position: initial;
        z-index: 0;
        height: auto;
        overflow: hidden;
        width: calc(100vw);
        margin: 40px 0 0px -14px;
        margin: -30px 0 -60px -14px;
    }
}
.main-banner .banner img,
.main-banner .banner video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% -20%;
    margin-left: 5%;
}
[data-browser="safari"] .main-banner .banner video {
    -webkit-filter: brightness(105%) contrast(100%);
    filter: brightness(105%) contrast(100%);
}
@media (max-width: 568px) {
    .main-banner .banner img,
    .main-banner .banner video {
        width: 100%;
        height: 100%;
        margin-left: 0%;
        object-position: center;
        scale: 1.4;
    }
    [data-browser="safari"] .main-banner .banner video {
        -webkit-filter: brightness(100%) contrast(100%);
        filter: brightness(100%) contrast(100%);
    }
}
.main-banner .video {
    position: sticky;
    left: 24px;
    top: calc(100dvh - 188px - 18px);
    border-radius: 12px;
    width: 288px;
    height: 188px;
    overflow: hidden;
}
@media (max-width: 1024px) {
    .main-banner .video {

    }
}
@media (max-width: 568px) {
    .main-banner .video {
        max-height: 260px;
    }
}
.main-banner .video img,
.main-banner .video video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.main-banner .video {
    position: sticky;
    max-width: 100%;
    left: 24px;
    top: calc(100dvh - 188px - 18px);
    border-radius: 12px;
    width: 288px;
    height: 188px;
    overflow: hidden;
    transform-origin: top left;
    transition: transform 0.1s linear;
    margin-top: -190px;
}
@media (max-width: 1024px) {
    .main-banner .video {
        margin-top: 0;
    }
}
@media (max-width: 568px) {
    .main-banner .video {
        position: initial;
        width: 100% !important;
        border-radius: 0;
        height: 260px !important;
    }
}


/* main-mission */

.main-mission {
    padding: 40px 24px 172px;
    display: flex;
    flex-direction: column;
    gap: 120px;
    background: #000;
    overflow: hidden;
}
@media (max-width: 1024px) {
    .main-mission {
        gap: 100px;
        padding: 40px 24px 148px;
    }
}
@media (max-width: 568px) {
    .main-mission {
        gap: 64px;
        padding: 40px 12px 100px;
    }
}
.main-mission .top {
    position: relative;
    width: fit-content;
}
.main-mission .top h2 {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    color: #fff;
    position: relative;
    z-index: 1;
}
@media (max-width: 1024px) {
    .main-mission .top h2 {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .main-mission .top h2 {
        font-size: 36px;
    }
}
.main-mission .top h2 span {
    font-style: italic;
    font-weight: 400;
    letter-spacing: -0.01em;
    color: #fff;
}
.main-mission .top video {
    width: 50vw;
    position: absolute;
    z-index: 0;
    top: -27vw;
    right: -50%;
}
@media (max-width: 1024px) {
    .main-mission .top video {
        width: 418px;
        height: 536px;
        top: -90%;
        left: 40%;
    }
}
@media (max-width: 568px) {
    .main-mission .top video {
        width: 400px;
        top: -250%;
        left: 0%;
    }
}
.main-mission .middle {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 120px;
    position: relative;
    width: fit-content;
    margin: auto;
}
@media (max-width: 1024px) {
    .main-mission .middle {
        gap: 100px;
    }
}
@media (max-width: 568px) {
    .main-mission .middle {
        gap: 64px;
    }
}
.main-mission .middle p {
    line-height: 148%;
    text-align: center;
    color: rgba(255, 255, 255, 0.7);
    max-width: 404px;
    margin-bottom: 44px;
}
@media (max-width: 1024px) {
    .main-mission .middle p {

    }
}
@media (max-width: 568px) {
    .main-mission .middle p {
        font-size: 14px;
    }
}
.main-mission .middle p:nth-child(3) {
    max-width: 280px;
}
.main-mission .middle h2 {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
    color: #fff;
    position: relative;
    z-index: 1;
}
@media (max-width: 1024px) {
    .main-mission .middle h2 {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .main-mission .middle h2 {
        font-size: 36px;
    }
}
.main-mission .middle h2 span {
    font-style: italic;
    font-weight: 400;
    color: #fff;
}
.main-mission .middle video {
    width: 320px;
    position: absolute;
    z-index: 0;
    right: -20%;
    top: 6%;
}
@media (max-width: 1024px) {
    .main-mission .middle video {
        width: 308px;
        right: -18%;
        top: 0%;
    }
}
@media (max-width: 568px) {
    .main-mission .middle video {
        width: 237px;
        right: -110px;
    }
}

/* main-case-1 */

.main-case-1 {
    position: relative;
    height: calc(300vh + 150vh);
}
.main-case-1 .item {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    position: relative;
    height: 100dvh;
    padding: 24px;
    position: sticky;
    top: 0;
    background-size: cover;
    background-position: center;
    /*background-attachment: fixed;*/
    background-repeat: no-repeat;
    /*transform: translateZ(0);*/
    /*backface-visibility: hidden;*/
    cursor: default;
}
.main-case-1 .item:nth-child(1) {
    /*top: 0;*/
    z-index: 1;
}
.main-case-1 .item:nth-child(2) {
    /*top: 0dvh;*/
    z-index: 2;
    margin-top: 30vh;
}
.main-case-1 .item:nth-child(3) {
    /*top: 200dvh;*/
    z-index: 3;
    margin-top: 60vh;
}
.main-case-1 .item .title {
    font-weight: 500;
    font-size: 40px;
    line-height: 110%;
    text-align: center;
    color: #fff;
    position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
    height: fit-content;
}
@media (max-width: 1024px) {
    .main-case-1 .item .title {
        font-size: 32px;
    }
}
@media (max-width: 568px) {
    .main-case-1 .item .title {
        font-size: 20px;
    }
}
.main-case-1 .item .bottom {
    display: flex;
    gap: 12px;
}
.main-case-1 .item .bottom span {
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 125px;
    height: 40px;
    opacity: 0.8;
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    text-align: center;
    color: #fff;
    transition: .3s ease;
}
.main-case-1 .item .bottom span:hover {
    border: 1px solid rgba(255, 255, 255, 0.3);
    background: #fff;
    color: #000;
}
.main-case-1 .item img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
}

/* main-case-2 */

.main-case-2 {
    padding: 172px 0px;
    background: #000;
    display: flex;
    flex-direction: column;
    align-items: center;
}
@media (max-width: 1024px) {
    .main-case-2 {
        padding: 148px 0px;
    }
}
@media (max-width: 568px) {
    .main-case-2 {
        padding: 100px 0px;
    }
}
.main-case-2 > h3 {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    text-align: center;
    color: #fff;
}
.main-case-2 .case-list {
    height: 456px;
    overflow: hidden;
}
.main-case-2 .link {
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    border-top: 1px solid rgba(255, 255, 255, 0.3);
    padding: 40px 10px 32px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 32px;
    font-style: italic;
    font-size: 44px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
    color: #fff;
    transition: .3s ease;
}
@media (max-width: 1024px) {
    .main-case-2 .link {
        font-size: 40px;
    }
}
@media (max-width: 568px) {
    .main-case-2 .link {
        font-size: 24px;
        margin-top: 100px;
    }
}
.main-case-2 .link:hover {
    border-bottom: 1px solid #fff;
    border-top: 1px solid #fff;
}

/* main-about */

.main-about {
    background: #fff;
    padding: 172px 0;
    padding-bottom: 450px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
}
@media (max-width: 1024px) {
    .main-about {
        padding: 148px 0;
    }
}
@media (max-width: 568px) {
    .main-about {
        padding: 100px 0;
    }
}
.main-about .title {
    display: flex;
    flex-direction: column;
    gap: 64px;
    font-weight: 500;
    font-size: 195px;
    line-height: 100%;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    color: #000;
    text-align: center;
    position: relative;
    z-index: 1;

    /*position: sticky;*/
    /*top: 172px;*/
}
@media (max-width: 1024px) {
    .main-about .title {
        font-size: 150px;
        position: initial;
        order: 1;
        margin-bottom: 32px;
        gap: 48px;
    }
}
@media (max-width: 568px) {
    .main-about .title {
        font-size: 80px;
    }
}
.main-about .title span {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    text-transform: initial;
    letter-spacing: 0;
}
.main-about .img {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 80px;
    /*padding-bottom: 120px;*/
    /*position: sticky;*/
    top: 0px;
}
@media (max-width: 1024px) {
    .main-about .img {
        position: relative;
        order: 3;
        overflow: hidden;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        padding-top: 72px;
        padding-bottom: 72px;
        margin-top: 72px;
        display: flex;
        flex-direction: column;
    }
}
@media (max-width: 568px) {
    .main-about .img {
        padding-top: 52px;
        padding-bottom: 72px;
        margin-top: 32px;
    }
}
.main-about .img img {
    border-radius: 12px;
    object-fit: cover;
}
@media (max-width: 1024px) {
    .main-about .img img {
        width: 100%;
        height: 100%;
        border-radius: 12px;
        object-fit: cover;
    }
}

@media (min-width: 1025px) {
    .main-about .img img:nth-child(1){
        position: absolute;
        width: 308px;
        height: 382px;
        left: -6%;
        top: -18%;
    }
    .main-about .img img:nth-child(2){
        width: 460px;
        height: 520px;
        position: relative;
        z-index: 2;
    }
    .main-about .img img:nth-child(3){
        position: absolute;
        width: 256px;
        height: 324px;
        right: 24px;
        bottom: 10%;
    }
}
.main-about .txt {
    position: absolute;
    left: 24px;
    transform: translateY(130%);
}
@media (max-width: 1024px) {
    .main-about .txt {
        position: initial;
        order: 2;
        transform: none !important;
    }
}
.main-about .txt p {
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);
    max-width: 320px;
}
@media (max-width: 1024px) {
    .main-about .txt p {
        text-align: center;
        max-width: 550px;
    }
}
@media (max-width: 568px) {
    .main-about .txt p {
        text-align: center;
        max-width: 90vw;
    }
}
.main-about .bottom {
    max-width: 370px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
    padding-top: 120px;
    position: sticky;
    top: 50%;
}
@media (max-width: 1024px) {
    .main-about .bottom {
        position: initial;
        order: 4;
        padding-top: 72px;
    }
}
@media (max-width: 568px) {
    .main-about .bottom {
        position: initial;
        order: 4;
        padding-top: 72px;
        transform: none !important;
    }
}
.main-about .bottom p {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    text-align: center;
    color: #000;
}
@media (max-width: 1024px) {
    .main-about .bottom p {
        font-size: 20px;
    }
}
@media (max-width: 568px) {
    .main-about .bottom p {
        font-size: 16px;
    }
}
.main-about .bottom .button {
    border: 1px solid rgba(0, 0, 0, 0.3);
    border-radius: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 116px;
    height: 52px;
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #000;
    position: relative;
    z-index: 1;
    overflow: hidden;
    transition: .3s ease;
}
.main-about .bottom .button:after {
    content: '';
    background: #000;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    pointer-events: none;
    transform: translate(0px, 100%);
    transition: .3s ease;
}
.main-about .bottom .button:hover {
    border: 1px solid rgba(0, 0, 0, 1);
    color: #ffffff;
}
.main-about .bottom .button:hover:after {
    transform: translate(0px, 0%);
}

/* main-step */

.main-step {
    display: flex;
    flex-direction: column;
    gap: 120px;
    padding: 172px 24px;
    background: #e8e8e8;
}
@media (max-width: 1024px) {
    .main-step {
        padding: 148px 24px;
        gap: 64px;
    }
}
@media (max-width: 568px) {
    .main-step {
        padding: 100px 12px;
        gap: 48px;
    }
}
.main-step .title {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
}
@media (max-width: 1024px) {
    .main-step .title {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .main-step .title {
        font-size: 36px;
    }
}
.main-step .title span {
    font-style: italic;
    font-weight: 400;
    letter-spacing: -0.01em;
}
.main-step .step-list {
    display: flex;
    justify-content: space-between;
    gap: 32px;
}
@media (max-width: 1024px) {
    .main-step .step-list {
        flex-direction: column;
    }
}
.main-step .step-list .left {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 32px;
    max-width: 514px;
}
@media (max-width: 1024px) {
    .main-step .step-list .left {
        flex-direction: row;
        width: 100%;
        max-width: 100%;
    }
}
.main-step .step-list .left p {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    max-width: 312px;
}
@media (max-width: 1024px) {
    .main-step .step-list .left p {
        font-size: 20px;
        max-width: 320px;
    }
}
@media (max-width: 568px) {
    .main-step .step-list .left p {
        font-size: 16px;
    }
}
.main-step .step-list .left img,
.main-step .step-list .left video {
    width: 100%;
}
@media (min-width: 1024px) {
    [data-browser="safari"] .main-step .step-list .left video {
        -webkit-filter: brightness(99%) contrast(99%);
        filter: brightness(99%) contrast(99%);
    }
}
@media (max-width: 1024px) {
    .main-step .step-list .left img,
    .main-step .step-list .left video {
        width: 282px;
        height: 259px;
        object-fit: cover;
        margin-top: -60px;
    }
}
@media (max-width: 568px) {
    .main-step .step-list .left img,
    .main-step .step-list .left video {
        margin-top: -30px;
    }
}
.main-step .step-list .right {
    width: 50%;
}
@media (max-width: 1024px) {
    .main-step .step-list .right {
        width: 100%;
    }
}
.main-step .step-list .right .item {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 28px 0;
    border-top: 1px solid rgba(0, 0, 0, 0.2);
}
@media (max-width: 1024px) {
    .main-step .step-list .right .item {
        width: 100%;
        gap: 20px;
        padding: 24px 0;
    }
}
.main-step .step-list .right .item:last-child {
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.main-step .step-list .right .item span {
    font-weight: 500;
    line-height: 148%;
}
.main-step .step-list .right .item h3 {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    max-width: 500px;
}
@media (max-width: 1024px) {
    .main-step .step-list .right .item h3 {
        font-size: 20px;
    }
}
@media (max-width: 568px) {
    .main-step .step-list .right .item h3 {
        font-size: 16px;
    }
}
.main-step .step-list .right .item p {
    /*max-width: 370px;*/
    padding-right: 100px;
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);
}
@media (max-width: 1024px) {
    .main-step .step-list .right .item p {
        padding-right: 30px;
    }
}
@media (max-width: 568px) {
    .main-step .step-list .right .item p {
        padding-right: 0px;
    }
}
.main-step .txt-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 120px;
    margin-top: 52px;
}
@media (max-width: 1024px) {
    .main-step .txt-block {
        gap: 100px;
        margin-top: 0;
    }
    .main-step .txt-block img {
        border-radius: 8px;
        overflow: hidden;
        aspect-ratio: 728/418;
        object-fit: cover;
    }
}
@media (max-width: 568px) {
    .main-step .txt-block {
        gap: 64px;
    }
}
.main-step .txt-block p {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
}
@media (max-width: 1024px) {
    .main-step .txt-block p {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .main-step .txt-block p {
        font-size: 36px;
    }
}
.main-step .txt-block p span {
    font-style: italic;
    font-weight: 400;
    letter-spacing: -0.01em;
}
.main-step .txt-block .link {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 32px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
    border-top: 1px solid rgba(0, 0, 0, 0.2);
    padding: 40px 10px 32px;
    font-style: italic;
    font-size: 44px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
    color: #000;
    transition: .3s ease;
}
@media (max-width: 1024px) {
    .main-step .txt-block .link {
        padding: 32px 10px 24px;
        font-size: 40px;
    }
}
@media (max-width: 568px) {
    .main-step .txt-block .link {
        padding: 24px 10px 16px;
        font-size: 24px;
        gap: 8px;
    }
    .main-step .txt-block .link svg {
        width: 40px;
        height: 40px;
    }
}
.main-step .txt-block .link:hover {
    border-bottom: 1px solid #000;
    border-top: 1px solid #000;
}
/* main-services */

.main-services {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 88px;
    padding: 172px 24px;
    background: #000;
}
@media (max-width: 1024px) {
    .main-services {
        padding: 148px 24px;
        gap: 64px;
    }
}
@media (max-width: 568px) {
    .main-services {
        padding: 100px 16px;
        gap: 48px;
    }
}
.main-services .title {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    letter-spacing: -0.02em;
    text-align: center;
    color: #fff;
}
@media (max-width: 1024px) {
    .main-services .title {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .main-services .title {
        font-size: 36px;
    }
}
.main-services .services-list {
    width: 100%;
    /*padding-top: 88px;*/
}
@media (max-width: 1024px) {
    .main-services .services-list {
        height: auto !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    }
}
.main-services .item-list {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    background: #000000;
    position: sticky;
}
@media (max-width: 1024px) {
    .main-services .item-list {
        position: initial;
    }
}
.main-services .item-list:nth-child(1) {
    top: 100px;
}
.main-services .item-list:nth-child(2) {
    top: calc(120px + 124px);
    top: 100px;
}
.main-services .item-list:nth-child(3) {
    top: calc(120px + 124px + 124px);
    top: 100px;
}
.main-services .item-list:nth-child(4) {
    top: calc(120px + 124px + 124px + 124px);
    top: 100px;
}
.main-services .item-list:nth-child(5) {
    top: calc(120px + 124px + 124px + 124px + 124px);
    top: 100px;
}
.main-services .item-list .top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    padding: 40px 0px;
}
@media (max-width: 1024px) {
    .main-services .item-list .top {
        flex-direction: column;
        align-items: flex-start;
    }
}
.main-services .item-list .top .left {

}
@media (min-width: 1025px) {
    .main-services .item-list .top .left svg {
        display: none;
    }
}
@media (max-width: 1024px) {
    .main-services .item-list .top .left {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        gap: 32px;
    }
}
.main-services .item-list .top .left h3 {
    font-weight: 500;
    font-size: 40px;
    line-height: 110%;
    color: #fff;
}
@media (max-width: 1024px) {
    .main-services .item-list .top .left h3 {
        font-size: 32px;
    }
}
@media (max-width: 568px) {
    .main-services .item-list .top .left h3 {
        font-size: 20px;
    }
}
.main-services .item-list .top .right {
    display: flex;
    align-items: center;
    gap: 16px;
}
@media (max-width: 1024px) {
    .main-services .item-list .top .right {
        flex-wrap: wrap;
    }
}
.main-services .item-list .top .right span {
    border-radius: 8px;
    padding: 12px;
    background: rgba(255, 255, 255, 0.1);
    opacity: 0.8;
    font-size: 13px;
    line-height: 135%;
    letter-spacing: 0.01em;
    text-align: center;
    color: #fff;
}
.main-services .item-list .bottom {
    display: flex;
    justify-content: space-between;
    gap: 32px;
    padding-bottom: 40px;
}
@media (max-width: 1024px) {
    .main-services .item-list .bottom {
        flex-direction: column;
        max-height: 0;
        overflow: hidden;
        padding: 0 12px;
        transition: .7s ease;
    }
    .main-services .item-list.show .bottom {
        max-height: 2000px;
        padding: 12px 12px;
        transition: .7s ease;
    }
}
.main-services .item-list .bottom .left {
    max-width: 326px;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 32px;
}
@media (max-width: 1024px) {
    .main-services .item-list .bottom .left {
        max-width: 100%;
        flex-direction: row;
    }
}
@media (max-width: 568px) {
    .main-services .item-list .bottom .left {
        max-width: 100%;
        flex-direction: column;
    }
}
.main-services .item-list .bottom .left div {
    display: flex;
    flex-direction: column;
    gap: 5px;
}
@media (max-width: 1024px) {
    .main-services .item-list .bottom .left div {
        min-width: 140px;
    }
}
.main-services .item-list .bottom .left div p {
    cursor: pointer;
    transition: .3s ease;
}
.main-services .item-list .bottom .left div p.active {
    font-weight: 500;
    line-height: 148%;
    color: #fff;
}
.main-services .item-list .bottom .left div p:before {
    content: '●';
    padding-right: 0px;
    width: 0px;
    overflow: hidden;
    display: inline-flex;
    transition: .3s ease;
}
.main-services .item-list .bottom .left div p.active:before {
    content: '●';
    width: fit-content;
    padding-right: 10px;
}
.main-services .item-list .bottom .left div p:not(.active) {
    font-weight: 500;
    line-height: 148%;
    color: rgba(255, 255, 255, 0.3);
}
.main-services .item-list .bottom .left div p:not(.active):hover {
    color: #fff;
}
.main-services .item-list .bottom .left > p {
    line-height: 148%;
    color: rgba(255, 255, 255, 0.7);
}
@media (max-width: 1024px) {
    .main-services .item-list .bottom .left > p {
        max-width: 434px;
    }
}
.main-services .item-list .bottom .right {
    max-width: 920px;
    width: 100%;
}
.main-services .item-list .bottom .right .list {
    /*display: grid;*/
    /*grid-template-columns: 1fr 1fr;*/
    /*gap: 16px;*/
}
.main-services .item-list .bottom .right .list:not(.active) {
    display: none;
}
@media (max-width: 1024px) {
    .main-services .item-list .bottom .right .list .swiper-wrapper {
        display: flex;
        flex-direction: column;
        gap: 16px;
    }
}
.main-services .item-list .bottom .right .list .swiper-wrapper:not(:has(.item:nth-child(2))) {
    justify-content: flex-end;
}
.main-services .item-list .bottom .right .navigation {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    padding-top: 16px;
}
.main-services .item-list .bottom .right .navigation .arows {
    display: flex;
    align-items: center;
    gap: 20px;
}
.main-services .item-list .bottom .right .swiper-button-next,
.main-services .item-list .bottom .right .swiper-button-prev {
    width: fit-content;
    height: 24px;
    position: initial;
    margin: 0;
    color: #fff;
}

.main-services .item-list .bottom .right .swiper-button-next:hover,
.main-services .item-list .bottom .right .swiper-button-prev:hover {

}

.main-services .item-list .bottom .right .swiper-button-next::after,
.main-services .item-list .bottom .right .swiper-button-prev::after {
    display: none;
}

/* Swiper pagination */
.main-services .item-list .bottom .right .number {
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 16px;
}

.main-services .item-list .bottom .right .number p {
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #fff;
    white-space: nowrap;
}

.main-services .item-list .bottom .right .swiper-pagination {
    position: initial;
    margin: 0;
    color: rgba(255, 255, 255, 0.4);
    font-size: 16px;
    font-weight: 500;
    display: flex;
    align-items: center;
}

.main-services .item-list .bottom .right .swiper-pagination .swiper-pagination-current,
.main-services .item-list .bottom .right .swiper-pagination .swiper-pagination-total {
    display: inline-block;
    color: rgba(255, 255, 255, 0.4);
}

.main-services .item-list .bottom .right .swiper-pagination .swiper-pagination-current {
    margin-right: 4px;
    color: rgba(255, 255, 255, 1);
}
.main-services .item-list .bottom .right .list .item {
    position: relative;
    padding: 32px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 12px;
    overflow: hidden;
    aspect-ratio: 454/486;
    /*max-width: calc((100% - 16px)/2);*/
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 32px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(122, 1, 3, 0.0) 87.98%);
    transition: .7s ease;
    transition: margin 0s ease 0s;
}
@media (max-width: 1368px) {
    .main-services .item-list .bottom .right .list .item {
        aspect-ratio: auto;
        height: 310px;
    }
}
@media (max-width: 568px) {
    .main-services .item-list .bottom .right .list .item {
        height: 172px;
        padding: 20px;
        flex-direction: row;
        padding-right: 0;
    }
}
.main-services .item-list .bottom .right .list .item * {
    transition: .3s ease;
}
.main-services .item-list .bottom .right .list .item:hover {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(122, 1, 3, 0.2) 87.98%);
}
.main-services .item-list .bottom .right .list .item svg {
    position: absolute;
    top: 32px;
    right: 32px;
    z-index: 1;
    opacity: 0;
}
.main-services .item-list .bottom .right .list .item:hover svg {
    opacity: 1;
}
.main-services .item-list .bottom .right .list .item h4 {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    color: #fff;
    position: relative;
    z-index: 1;
    max-width: 250px;
}
@media (max-width: 1024px) {
    .main-services .item-list .bottom .right .list .item h4 {
        font-size: 20px;
    }
}
@media (max-width: 568px) {
    .main-services .item-list .bottom .right .list .item h4 {
        font-size: 16px;
    }
}
.main-services .item-list .bottom .right .list .item p {
    font-size: 13px;
    line-height: 135%;
    letter-spacing: 0.01em;
    color: rgba(255, 255, 255, 0.7);
    max-width: 260px;
    position: relative;
    z-index: 1;
    opacity: 0;
    transition: .3s ease;
}
@media (max-width: 1024px) {
    .main-services .item-list .bottom .right .list .item p {
        opacity: 1;
    }
}
.main-services .item-list .bottom .right .list .item:hover p {
    opacity: 1;
}
@media (max-width: 1024px) {
    .main-services .item-list .bottom .right .list .item p {
        display: none;
    }
}
.main-services .item-list .bottom .right .list .item .img-3d {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 0;
    height: 340px;
    width: 100%;
    opacity: .9;
    /*border: 1px solid #ffffff;*/
    mix-blend-mode: lighten;
}
@media (max-width: 568px) {
    .main-services .item-list .bottom .right .list .item .img-3d {
        height: 100%;
        width: 186px;
        right: 0;
        left: initial;
        position: initial;
    }
}
.main-services .item-list .bottom .right .list .item img,
.main-services .item-list .bottom .right .list .item video {
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
.main-services .item-list .bottom .right .list .item img,
.main-services .item-list .bottom .right .list .item video {
    transform: rotate(101deg);
    width: 355px;
    height: 420px;
    right: -90px;
    top: 0px;
}
@media (max-width: 568px) {
    .main-services .item-list .bottom .right .list .item img,
    .main-services .item-list .bottom .right .list .item video {
        object-fit: cover;
        transform: none;
        position: initial;
        width: 100%;
        height: 100%;
    }
}
.main-services .link {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    border-top: 1px solid rgba(255, 255, 255, 0.3);
    padding: 40px 10px 32px;
    font-family: "Old Standard TT", sans-serif;
    font-style: italic;
    font-size: 44px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
    color: #ffffff;
    transition: .3s ease;
}
@media (max-width: 1024px) {
    .main-services .link {
        padding: 32px 10px 24px;
        font-size: 40px;
    }
}
@media (max-width: 568px) {
    .main-services .link {
        padding: 24px 10px 16px;
        font-size: 24px;
    }
}
.main-services .link:hover {
    border-bottom: 1px solid #fff;
    border-top: 1px solid #fff;
}

/* main-awards */

.main-awards {
    display: flex;
    justify-content: space-between;
    gap: 32px;
    padding: 172px 24px 0;
    padding-bottom: 172px;
    overflow: hidden;
}
@media (min-width: 1025px) {
    .main-awards {
        background: #000000;
    }
}
@media (max-width: 1024px) {
    .main-awards {
        flex-direction: column;
        padding: 148px 24px 0;
        padding-bottom: 148px;
    }
}
@media (max-width: 568px) {
    .main-awards {
        flex-direction: column;
        padding: 100px 12px 0;
        padding-bottom: 100px;
    }
}
.main-awards .title {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
}
@media (max-width: 1024px) {
    .main-awards .title {
        font-size: 70px;
        text-align: left;
    }
}
@media (max-width: 568px) {
    .main-awards .title {
        font-size: 36px;
    }
}
.list-awards {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 810px;
}
.list-awards .item {
    border-top: 1px solid #000;
    padding: 12px 0px;
    opacity: 0.3;
    display: flex;
    align-items: center;
    /*justify-content: space-between;*/
    position: relative;
    transition: .3s ease;
}
@media (max-width: 1024px) {
    .list-awards .item {
        opacity: 1;
        border-top: 1px solid rgba(0, 0, 0, 0.2);
    }
}
.list-awards .item * {
    transition: .3s ease;
}
.list-awards .item:hover {
    opacity: 1;
}
.list-awards .item .left {

}
.list-awards .item .left p {
    font-weight: 500;
    line-height: 148%;
}
@media (max-width: 568px) {
    .list-awards .item .left p {
        font-size: 13px;
    }
}
.list-awards .item .img {
    position: absolute;
    z-index: 1;
    border-radius: 12px;
    width: 264px;
    height: 168px;
    overflow: hidden;
    opacity: 0;
    /*left: 0;*/
    /*right: 0;*/
    /*margin: auto;*/
}
.list-awards .item:hover .img {
    opacity: 1;
}
.list-awards .item .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.list-awards .item .right {
    margin-left: auto;
}
.list-awards .item .right p {
    font-weight: 500;
    line-height: 148%;
}
@media (max-width: 568px) {
    .list-awards .item .right p {
        font-size: 13px;
    }
}

.list-awards .item {
    position: relative;
}
.list-awards .item .img {
    pointer-events: none;
    opacity: 0;
    transition: opacity .3s ease;
    transform: none;
}
.list-awards .item:hover .img {
    opacity: 1;
}

.main-awards { position: relative; }
.list-awards .item { position: relative; }

.preview-img {
    position: absolute;
    width: 264px;
    height: 168px;
    border-radius: 12px;
    pointer-events: none;
    opacity: 0;
    transition: opacity .2s ease;
    overflow: hidden;
}
.preview-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* main-reviews */

.main-reviews {
    display: flex;
    flex-direction: column;
    gap: 88px;
    margin-bottom: 172px;
}
@media (max-width: 1024px) {
    .main-reviews {
        gap: 64px;
        margin-bottom: 148px;
    }
}
@media (max-width: 568px) {
    .main-reviews {
        gap: 48px;
        margin-bottom: 100px;
    }
}
.main-reviews .title {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
}
@media (max-width: 1024px) {
    .main-reviews .title {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .main-reviews .title {
        font-size: 36px;
    }
}
.main-reviews .title span {
    font-style: italic;
    font-weight: 400;
}
.reviews-container {
    max-width: 100%;
    margin: 0 auto;
}
.reviews-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
    padding: 0px 24px 12px;
    width: calc(100% - (24px*2));
    margin: auto auto 32px;
}
@media (max-width: 1024px) {
    .reviews-header {
        padding: 0px 24px 12px;
        width: calc(100%);
    }
}
@media (max-width: 568px) {
    .reviews-header {
        padding: 0px 12px 12px;
    }
}
.reviews-container .pagination-info {
    font-size: 16px;
    color: #666;
    font-weight: 500;
}
.reviews-container .pagination-info span {
    color: rgba(1, 1, 1, 0.4);
}
.reviews-container .nav-arrows {
    display: flex;
    gap: 12px;
}
.reviews-container .nav-arrow {
    background: none;
    border: none;
    cursor: pointer;
    padding: 8px;
    border-radius: 4px;
    transition: background-color 0.2s;
}
.reviews-container .nav-arrow.swiper-button-disabled{
    opacity: .2;
    pointer-events: none;
}
.reviews-container .nav-arrow:hover {
    opacity: .5;
}
.reviews-container .reviews-swiper {
    overflow: hidden;
    padding: 0 24px;
}
@media (max-width: 1024px) {
    .reviews-container .reviews-swiper {

    }
}
@media (max-width: 568px) {
    .reviews-container .reviews-swiper {
        padding: 0 12px;
    }
}
.reviews-container .swiper-slide {
    width: 100%;
    max-width: 570px;
    opacity: .5;
    transition: opacity 0.3s ease;
}
@media (max-width: 568px) {
    .reviews-container .swiper-slide {
        max-width: 82vw;
    }
}
.reviews-container .swiper-slide.swiper-slide-prev,
.reviews-container .swiper-slide.swiper-slide-active,
.reviews-container .swiper-slide.swiper-slide-next {
    opacity: 1;
}
.reviews-container .swiper-slide.is-faded {
    opacity: 0.5;
}
.reviews-container .review-card {
    height: 100%;
    max-width: 570px;
    padding-right: 40px;
    display: flex;
    flex-direction: column;
    gap: 64px;
}
@media (max-width: 1024px) {
    .reviews-container .review-card {
        gap: 48px;
    }
}
@media (max-width: 568px) {
    .reviews-container .review-card {
        gap: 40px;
        max-width: 85vw;
    }
}
.reviews-container .review-top {
    display: flex;
    align-items: center;
    gap: 24px;
}
.reviews-container .review-avatar {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    overflow: hidden;
    background: #333;
    display: flex;
    align-items: center;
    justify-content: center;
}
@media (max-width: 568px) {
    .reviews-container .review-avatar {
        width: 64px;
        height: 64px;
    }
}
.reviews-container .review-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.reviews-container .review-info{
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.reviews-container .review-title {
    font-size: 16px;
    line-height: 148%;
}
.reviews-container .review-role {
    line-height: 148%;
    color: rgba(0, 0, 0, 0.4);
}
.reviews-container .review-quote {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
}
@media (max-width: 1024px) {
    .reviews-container .review-quote {
        font-size: 20px;
    }
}
@media (max-width: 568px) {
    .reviews-container .review-quote {
        font-size: 16px;
    }
}
@media (max-width: 1024px) {

    .reviews-container .swiper-slide:not(.swiper-slide-active) {
        opacity: 0.15;
    }
}

/* main-client */

.main-client {
    display: flex;
    flex-direction: column;
    gap: 120px;
    margin-bottom: 0px;
}
@media (max-width: 1024px) {
    .main-client {
        gap: 100px;
    }
}
@media (max-width: 568px) {
    .main-client {
        gap: 48px;
    }
}
.main-client .title {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
}
@media (max-width: 1024px) {
    .main-client .title {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .main-client .title {
        font-size: 36px;
    }
}
.main-client .title span {
    font-style: italic;
    font-weight: 400;
}
.main-client .client-list {
    display: flex;
    flex-direction: column;
    gap: 80px;
}
.main-client .client-list > p {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    text-align: center;
    color: #000;
}
@media (max-width: 1024px) {
    .main-client .client-list > p {
        font-size: 20px;
    }
}
@media (max-width: 568px) {
    .main-client .client-list > p {
        font-size: 16px;
    }
}
.running-line {
    position: relative;
    overflow: hidden;
    padding: 40px 0;
    border-top: 1px solid rgba(0, 0, 0, 0.2);
}
.running-track {
    display: inline-block;
    white-space: nowrap;
    will-change: transform;
}
.running-track img {
    width: 200px;
    height: 123px;
    object-fit: contain;
    display: inline-block;
    vertical-align: middle;
    user-select: none;
    pointer-events: none;
}

/* page-cases */

.page-cases {
    margin-top: 64px;
}

.page-cases h1.title {
    font-weight: 500;
    font-size: 195px;
    line-height: 100%;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    margin: auto;
    width: fit-content;
}
@media (max-width: 1024px) {
    .page-cases h1.title {
        font-size: 150px;
    }
}
@media (max-width: 568px) {
    .page-cases h1.title {
        font-size: 80px;
    }
}

/* cases-list */

.cases-list {
    padding: 0 24px;
}
@media (max-width: 568px) {
    .cases-list {
        padding: 0 12px;
    }
}
.cases-list .top {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin: 40px auto;
}
@media (max-width: 1024px) {
    .cases-list .top {
        overflow-x: auto;
    }
    .cases-list .top::-webkit-scrollbar {
        display: none;
    }
}
@media (max-width: 568px) {
    .cases-list .top {
        justify-content: flex-start;
    }
}
.cases-list .top span {
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 40px;
    padding: 16px 20px;
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    cursor: pointer;
    position: relative;
    z-index: 1;
    overflow: hidden;
    transition: .3s ease;
    min-width: fit-content;
}
.cases-list .top span:after {
    content: '';
    background: #000000;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    pointer-events: none;
    transform: translate(0px, 100%);
    transition: .3s ease;
}
.cases-list .top span:hover {
    color: #ffffff;
    border: 1px solid #fff;
}
.cases-list .top span:hover:after {
    transform: translate(0px, 0%);
}
@media (max-width: 1024px) {
    .cases-list .top span {
        white-space: nowrap;
    }
}
@media (max-width: 568px) {
    .cases-list .top span {
        padding: 12px 16px;
    }
}
.cases-list .top span.active {
    border: 1px solid rgba(0, 0, 0, 1);
    background: #000;
    color: #fff;
}

.cases-list .list {
    display: flex;
    flex-wrap: wrap;
    column-gap: 32px;
    row-gap: 120px;
}
@media (max-width: 1024px) {
    .cases-list .list {
        column-gap: 20px;
        row-gap: 72px;
    }
}
@media (max-width: 568px) {
    .cases-list .list {
        gap: 48px;
    }
}
.cases-list .list .item {
    display: flex;
    flex-direction: column;
    gap: 20px;
    cursor: pointer;
}
.cases-list .list .item:nth-child(6n + 1) {
    width: calc((100% - 32px) * 0.5875);
}
@media (max-width: 1024px) {
    .cases-list .list .item:nth-child(6n + 1) {
        width: calc(100%/2 - 10px);
    }
}
@media (max-width: 568px) {
    .cases-list .list .item:nth-child(6n + 1) {
        width: 100%;
    }
}
.cases-list .list .item:nth-child(6n + 2) {
    width: calc((100% - 32px) * 0.4125);
}
@media (max-width: 1024px) {
    .cases-list .list .item:nth-child(6n + 2) {
        width: calc(100%/2 - 10px);
    }
}
@media (max-width: 568px) {
    .cases-list .list .item:nth-child(6n + 2) {
        width: 100%;
    }
}
.cases-list .list .item:nth-child(6n + 3) {
    width: calc((100% - 32px) * 0.7433);
    margin-left: auto;
}
@media (max-width: 1024px) {
    .cases-list .list .item:nth-child(6n + 3) {
        width: calc(100%);
    }
}
.cases-list .list .item:nth-child(6n + 4) {
    width: calc((100% - 32px) * 0.4125);
}
@media (max-width: 1024px) {
    .cases-list .list .item:nth-child(6n + 4) {
        width: calc(100%/2 - 10px);
    }
}
@media (max-width: 568px) {
    .cases-list .list .item:nth-child(6n + 4) {
        width: 100%;
    }
}
.cases-list .list .item:nth-child(6n + 5) {
    width: calc((100% - 32px) * 0.5875);
}
@media (max-width: 1024px) {
    .cases-list .list .item:nth-child(6n + 5) {
        width: calc(100%/2 - 10px);
    }
}
@media (max-width: 568px) {
    .cases-list .list .item:nth-child(6n + 5) {
        width: 100%;
    }
}
.cases-list .list .item:nth-child(6n + 6) {
    width: calc((100% - 32px) * 0.7433);
}
@media (max-width: 1024px) {
    .cases-list .list .item:nth-child(6n + 6) {
        width: calc(100%);
    }
}
.cases-list .list .item .img {
    border-radius: 12px;
    overflow: hidden;
    cursor: default;
}
.cases-list .list .item:nth-child(6n + 1) .img {
    aspect-ratio: 799/576;
}
.cases-list .list .item:nth-child(6n + 2) .img {
    aspect-ratio: 561/576;
}
.cases-list .list .item:nth-child(6n + 3) .img {
    aspect-ratio: 1036/576;
}
.cases-list .list .item:nth-child(6n + 4) .img {
    aspect-ratio: 561/576;
}
.cases-list .list .item:nth-child(6n + 5) .img {
    aspect-ratio: 799/576;
}
.cases-list .list .item:nth-child(6n + 6) .img {
    aspect-ratio: 1036/576;
}
@media (max-width: 1024px) {
    .cases-list .list .item .img {
        aspect-ratio: 354/440 !important;
    }
    .cases-list .list .item:nth-child(6n + 3) .img {
        aspect-ratio: 728/520 !important;
    }
    .cases-list .list .item:nth-child(6n + 6) .img {
        aspect-ratio: 728/520 !important;
    }
}
@media (max-width: 568px) {
    .cases-list .list .item .img {
        aspect-ratio: 366/420 !important;
    }
    .cases-list .list .item:nth-child(6n + 3) .img {
        aspect-ratio: 366/420 !important;
    }
    .cases-list .list .item:nth-child(6n + 6) .img {
        aspect-ratio: 366/420 !important;
    }
}
.cases-list .list .item .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: .7s ease;
}
.cases-list .list .item:hover .img img {
    scale: 1.05;
}
.cases-list .list .item .info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    cursor: pointer;
}
@media (max-width: 1024px) {
    .cases-list .list .item .info {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }
}
@media (max-width: 568px) {
    .cases-list .list .item .info {
        gap: 12px;
    }
}
.cases-list .list .item .info .name {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    cursor: pointer;
}
@media (max-width: 1024px) {
    .cases-list .list .item .info .name {
        font-size: 20px;
    }
}
@media (max-width: 568px) {
    .cases-list .list .item .info .name {
        font-size: 16px;
    }
}
.cases-list .list .item .info .tag {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}
.cases-list .list .item .info .tag span {
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 8px;
    padding: 8px 10px;
    opacity: 0.8;
    font-size: 12px;
    line-height: 135%;
    text-align: center;
}

/* Стили для курсора с текстом */
.cursor-text {
    position: fixed;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 9999;
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 13px;
    letter-spacing: 0.01em;
    color: #fff;
    white-space: nowrap;
    opacity: 0;
    transform: translate(10px, -30px);
    transition: opacity 0.3s ease;
}

.cursor-text.show {
    opacity: 1;
}

/* Скрываем стандартный курсор при наведении на item */
.cases-list .list .item:hover {
    cursor: initial;
}


/* case-more */

.case-more {
    display: flex;
    flex-direction: column;
    gap: 120px;
    margin-top: 172px;
    padding: 0 24px;
    margin-bottom: 172px;
}
@media (max-width: 1024px) {
    .case-more {
        margin-top: 148px;
        margin-bottom: 148px;
        gap: 48px;
        align-items: center;
    }
}
@media (max-width: 568px) {
    .case-more {
        margin-top: 100px;
        margin-bottom: 100px;
        gap: 40px;
        padding: 0 12px;
        align-items: center;
        /*height: 200vh;*/
    }
}
.case-more .title {
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
    color: #000;
}
@media (max-width: 1024px) {
    .case-more .title {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .case-more .title {
        font-size: 36px;
        position: sticky;
    }
}
.case-more .title span {
    font-style: italic;
    font-weight: 400;
}
.case-more .data-img {
    border-radius: 8px;
    width: 168px;
    height: 200px;
    overflow: hidden;
}
@media (max-width: 568px) {
    .case-more .data-img {
        border-radius: 8px;
        width: 144px;
        height: 164px;
        overflow: hidden;
    }
}
.case-more .data-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.list-more {
    display: flex;
    flex-direction: column;
    width: 100%;

    /*max-width: 810px;*/
}
@media (max-width: 1024px) {
    .list-more .list {
        max-height: calc(100dvh - 82px - 50px - 80px - 40px - 200px - 40px - 16px);
        overflow-y: auto;
        background: #fff;
    }
}
@media (max-width: 568px) {
    .list-more .list {
        max-height: calc(100dvh - 82px - 30px - 80px - 40px - 200px - 40px - 16px);
    }
}
.list-more .top {
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    display: flex;
    align-items: center;
    gap: 150px;
    margin-bottom: 28px;
}
@media (max-width: 1024px) {
    .list-more .top {
        gap: 82px;
    }
}
@media (max-width: 568px) {
    .list-more .top {
        gap: 32px;
    }
}
.list-more .top .service-col {
    width: 324px;
}
.list-more .top .year-col {
    min-width: 40px;
}
.list-more .top .client-col {
    min-width: 85px;
}
.list-more .item {
    border-top: 1px solid rgba(0, 0, 0, 0);
    padding: 12px 0px;
    opacity: 0.3;
    display: flex;
    align-items: center;
    gap: 150px;
    /*justify-content: space-between;*/
    position: relative;
    transition: .3s ease;
}
@media (max-width: 1024px) {
    .list-more .item {
        gap: 82px;
    }
}
@media (max-width: 568px) {
    .list-more .item {
        gap: 32px;
    }
}
.list-more .item * {
    transition: .3s ease;
    line-height: 148%;
}
@media (max-width: 568px) {
    .list-more .item * {
        font-size: 13px;
    }
}
.list-more .item .service-col {
    width: 324px;
}
.list-more .item .year-col {
    min-width: 40px;
}
.list-more .item .client-col {
    min-width: 85px;
}
.list-more .item:hover,
.list-more .item.active {
    opacity: 1;
    border-top: 1px solid #000;
}
.case-more .preview-img {
    width: 264px;
    height: 308px;
}

/* page-case */

.page-case {

}
.page-case .title {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 64px;
    padding: 64px 0;
    height: 200vh;
}
@media (max-width: 1024px) {
    .page-case .title {

    }
}
@media (max-width: 568px) {
    .page-case .title {
        gap: 48px;
        padding: 48px 0;
        padding-bottom: calc(100px - 32px);
        height: fit-content;
    }
}
.page-case .title span {
    line-height: 148%;
    text-align: center;
    color: rgba(0, 0, 0, 0.7);

    position: sticky;
    top: 17vh;
}
@media (max-width: 568px) {
    .page-case .title span {
        position: initial;
    }
}
.page-case .title h1 {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;

    position: sticky;
    top: 26vh;
}
@media (max-width: 1024px) {
    .page-case .title h1 {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .page-case .title h1 {
        font-size: 36px;
        position: initial;
    }
}

/* case-top-img */

/*.case-top-img {
    border-radius: 12px;
    width: 100%;
    max-width: 680px;
    height: 432px;
    overflow: hidden;
    margin: auto;
    margin-top: calc(172px - 64px);
    margin-bottom: 60px;
}
.case-top-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}*/

.case-top-img {
    position: sticky;
    left: 24px;
    top: calc(100dvh - 432px - 18px);
    border-radius: 12px;
    width: 680px;
    height: 432px;
    overflow: hidden;
}
.case-top-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.case-top-img {
    position: sticky;
    max-width: 100%;
    left: 24px;
    top: calc(100dvh - 432px - 18px);
    border-radius: 12px;
    width: 680px;
    height: 432px;
    overflow: hidden;
    transform-origin: top left;
    transition: transform 0.1s linear;
    margin-top: 0px;
}

@media (max-width: 568px) {
    .case-top-img {
        width: 100% !important;
        border-radius: 0 !important;
        left: 12px;
        aspect-ratio: 390 / 348;
        height: auto !important;
        position: initial;
        margin-top: calc(120px - 48px);
    }
}

/* case-txt */

.case-txt {
    display: flex;
    flex-direction: column;
    gap: 32px;
    padding: 60px 24px;
    width: 100%;
}
@media (max-width: 1024px) {
    .case-txt {
        padding: 50px 24px;
    }
    .case-txt:has(.top) {
        gap: 0;
    }
}
@media (max-width: 568px) {
    .case-txt {
        padding: 32px 12px;
    }
}
.case-txt .top {
    padding: 12px 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.case-txt .grid {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 32px;
    width: 100%
}
@media (max-width: 568px) {
    .case-txt .grid {
        flex-direction: column;
        gap: 32px;
    }
}
.case-txt h3 {
    font-weight: 400;
    font-size: 16px;
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);
}
.case-txt .left {
    display: flex;
    flex-direction: column;
    gap: 24px;
    max-width: 340px;
}
@media (max-width: 1024px) {
    .case-txt.case-concepts .left {
        max-width: 480px;
    }
}
.case-txt:not(.case-concepts) .left {
    min-width: 210px;
}
@media (max-width: 568px) {
    .case-txt:not(.case-concepts) .left {
        display: none;
    }
    .case-txt.case-overview .left {
        display: flex;
    }
}
.case-txt .right {
    width: 100%;
    max-width: 915px;
}
.case-txt p {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
}
@media (max-width: 1024px) {
    .case-txt:not(.case-concepts) p {
        font-size: 20px;
    }
}
@media (max-width: 568px) {
    .case-txt p {
        font-size: 16px;
    }
}
.case-info .right {
    display: flex;
    flex-direction: column;
}
.case-info .right .item {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 20px 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
@media (max-width: 1024px) {
    .case-info .right .item {
        gap: 16px;
        padding: 16px 0;
    }
}
.case-info .right .item span {
    font-size: 16px;
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);
}
.case-info .right .item p {
    font-weight: 500;
    font-size: 24px;
    line-height: 110%;
}
@media (max-width: 1024px) {
    .case-info .right .item p {
        font-size: 20px;
    }
}
@media (max-width: 568px) {
    .case-info .right .item p {
        font-size: 16px;
    }
}
.case-concepts {
    align-items: center;
    flex-direction: row;
    gap: 32px;
    padding-left: 0;
    padding-right: 0;
}
@media (max-width: 1024px) {
    .case-concepts {
        flex-direction: column;
        align-items: flex-start;
        padding-bottom: 148px;
    }
}
@media (max-width: 568px) {
    .case-concepts {
        padding-top: calc(100px - 32px);
        gap: 48px;
        padding-bottom: 100px;
    }
}
.case-concepts .left {
    width: 100vw;
    max-width: 442px;
    padding-right: 100px;
    padding-bottom: 150px;
    justify-content: center;
    position: absolute;
    left: 24px;
}
@media (max-width: 1024px) {
    .case-concepts .left {
        position: initial;
        padding-left: 24px ;
        padding-bottom: 0;
        opacity: 1 !important;
        scale: 1 !important;
        transform: scale(1) !important;
    }
}
@media (max-width: 568px) {
    .case-concepts .left {
        padding-right: 70px;
        padding-left: 12px;
    }
}

.case-concepts .left {
    transform-origin: left center;
    transition: transform 0.2s ease, opacity 0.2s ease;
}
.case-concepts .concepts-list.grabbing ~ .left {
    /* disable transition during grab for smoother real-time updates */
    transition: none;
}
.concepts-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
    overflow: hidden;
    position: relative;
    user-select: none;

    padding-left: calc(442px + 32px + 24px);
    padding-right: 24px;
}
@media (max-width: 1024px) {
    .concepts-list {
        padding: 0 24px;
        margin-right: 24px;
        overflow-x: auto;
        width: 100%;
    }
    .concepts-list::-webkit-scrollbar {
        display: none;
    }
}
@media (max-width: 568px) {
    .concepts-list {
        padding: 0 12px;
        margin-right: 12px;
    }
}

.concepts-list > div {
    display: flex;
    gap: 16px;
}
.concepts-list > div.row-1 {
    align-items: flex-end;
}
.concepts-list > div.row-2 {
    padding-left: calc(561px - 400px);
}

/* Задаём для каждого .img-N свою ширину и высоту */
.concepts-list .img {
    border-radius: 12px;
    overflow: hidden;
    width: 100vw;
}
@media (max-width: 1024px) {
    .concepts-list .img {
        border-radius: 8px;
    }
}

/* Первый ряд: img-1, img-2, img-3, img-4 */
.concepts-list .img-1 {
    width: 561px;
    min-width: 561px;
    height: 360px;
}
@media (max-width: 1024px) {
    .concepts-list .img-1 {
        width: 541px;
        min-width: 541px;
        height: 346px;
    }
}
@media (max-width: 568px) {
    .concepts-list .img-1 {
        width: 264px;
        min-width: 264px;
        height: 172px;
    }
}
.concepts-list .img-2 {
    width: 400px;
    min-width: 400px;
    height: 260px;
}
@media (max-width: 1024px) {
    .concepts-list .img-2 {
        width: 354px;
        min-width: 354px;
        height: 240px;
    }
}
@media (max-width: 568px) {
    .concepts-list .img-2 {
        width: 264px;
        min-width: 264px;
        height: 172px;
    }
}
.concepts-list .img-3 {
    width: 561px;
    min-width: 561px;
    height: 360px;
}
@media (max-width: 1024px) {
    .concepts-list .img-3 {
        width: 541px;
        min-width: 541px;
        height: 346px;
    }
}
@media (max-width: 568px) {
    .concepts-list .img-3 {
        width: 264px;
        min-width: 264px;
        height: 172px;
    }
}
.concepts-list .img-4 {
    width: 400px;
    min-width: 400px;
    height: 260px;
}
@media (max-width: 1024px) {
    .concepts-list .img-4 {
        width: 354px;
        min-width: 354px;
        height: 240px;
    }
}
@media (max-width: 568px) {
    .concepts-list .img-4 {
        width: 264px;
        min-width: 264px;
        height: 172px;
    }
}

/* Второй ряд: img-5, img-6, img-7, img-8 */
.concepts-list .img-5 {
    width: 400px;
    min-width: 400px;
    height: 260px;
}
@media (max-width: 1024px) {
    .concepts-list .img-5 {
        width: 354px;
        min-width: 354px;
        height: 240px;
    }
}
@media (max-width: 568px) {
    .concepts-list .img-5 {
        width: 264px;
        min-width: 264px;
        height: 172px;
    }
}
.concepts-list .img-6 {
    width: 561px;
    min-width: 561px;
    height: 360px;
}
@media (max-width: 1024px) {
    .concepts-list .img-6 {
        width: 541px;
        min-width: 541px;
        height: 346px;
    }
}
@media (max-width: 568px) {
    .concepts-list .img-6 {
        width: 264px;
        min-width: 264px;
        height: 172px;
    }
}
.concepts-list .img-7 {
    width: 400px;
    min-width: 400px;
    height: 260px;
}
@media (max-width: 1024px) {
    .concepts-list .img-7 {
        width: 354px;
        min-width: 354px;
        height: 240px;
    }
}
@media (max-width: 568px) {
    .concepts-list .img-7 {
        width: 264px;
        min-width: 264px;
        height: 172px;
    }
}
.concepts-list .img-8 {
    width: 561px;
    min-width: 561px;
    height: 360px;
}
@media (max-width: 1024px) {
    .concepts-list .img-8 {
        width: 541px;
        min-width: 541px;
        height: 346px;
    }
}
@media (max-width: 568px) {
    .concepts-list .img-8 {
        width: 264px;
        min-width: 264px;
        height: 172px;
    }
}

/* Обтекание изображений по высоте */
.concepts-list .img img {
    display: block;
    width: 100%;
    height: auto;
}

.concepts-list {
    cursor: url("data:image/svg+xml,%3Csvg width='86' height='52' viewBox='0 0 86 52' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='85' height='51' rx='25.5' stroke='black' stroke-opacity='0.3'/%3E%3Cpath d='M34 26L22 26M22 26L25.9 22M22 26L25.9 30' stroke='black'/%3E%3Cpath d='M52 26L64 26M64 26L60.1 22M64 26L60.1 30' stroke='black'/%3E%3C/svg%3E") 43 26, grab;
}

.concepts-list.grabbing {
    cursor: url("data:image/svg+xml,%3Csvg width='86' height='52' viewBox='0 0 86 52' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='85' height='51' rx='25.5' stroke='black' stroke-opacity='0.3'/%3E%3Cpath d='M34 26L22 26M22 26L25.9 22M22 26L25.9 30' stroke='black'/%3E%3Cpath d='M52 26L64 26M64 26L60.1 22M64 26L60.1 30' stroke='black'/%3E%3C/svg%3E") 43 26, grabbing;
}

.case-video {
    border-radius: 12px;
    max-width: 1154px;
    width: 100%;
    height: 710px;
    overflow: hidden;
    margin: auto;
}
@media (max-width: 1024px) {
    .case-video {
        aspect-ratio: 16/9;
        padding: 0 24px;
        height: auto;
    }
}
@media (max-width: 568px) {
    .case-video {
        padding: 0;
        border-radius: 0px;
        aspect-ratio: 390/260;
    }
}
.case-video img,
.case-video video {
    border-radius: 12px;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
@media (max-width: 568px) {
    .case-video img,
    .case-video video {
        border-radius: 0px;
    }
}

/* case-black */

.case-black {
    display: flex;
    flex-direction: column;
    gap: 172px;
    padding: 172px 0px;
    margin-top: 172px;
    background: #000;
    color: #ffffff;
}
@media (max-width: 1024px) {
    .case-black {
        padding: 148px 0px;
        gap: 148px;
    }
}
@media (max-width: 568px) {
    .case-black {
        padding: 100px 0px;
        gap: 100px;
        margin-top: 100px;
    }
}
.case-black * {
    color: #ffffff;
}
.case-black .grid {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 32px;
    width: 100%
}
@media (max-width: 1024px) {
    .case-black .grid {
        flex-direction: column;
        gap: 64px;
        align-items: flex-start;
    }
}
.case-black .case-txt .top {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.case-black .case-txt .top h3 {
    color: rgba(255, 255, 255, 0.7);
}

/* case-approach */

.case-approach {
    display: flex;
    flex-direction: column;
    gap: 172px;
    padding: 0 24px;
}
@media (max-width: 568px) {
    .case-approach {
        padding: 0 12px;
    }
}

.case-approach .img-txt .img {
    max-width: 40%;
    border-radius: 12px;
    aspect-ratio: 617/813;
    overflow: hidden;
}
@media (max-width: 1024px) {
    .case-approach .img-txt .img {
        border-radius: 8px;
        max-width: 100%;
        aspect-ratio: 728/800;
    }
}
@media (max-width: 568px) {
    .case-approach .img-txt .img {
        aspect-ratio: 366/448;
    }
}
.case-approach .img-txt .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.case-approach .img-txt .txt {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin: auto;
}
.case-approach .img-txt .txt span {
    font-size: 16px;
    line-height: 148%;
    color: rgba(255, 255, 255, 0.7);
    width: 100%;
    max-width: 560px;
}
@media (max-width: 1024px) {
    .case-approach .img-txt .txt span {
        max-width: 100%;
    }
}
.case-approach .img-txt .txt h3 {
    font-weight: 500;
    font-size: 40px;
    line-height: 110%;
    color: #fff;
    width: 100%;
    max-width: 560px;
}
@media (max-width: 1024px) {
    .case-approach .img-txt .txt h3 {
        max-width: 100%;
        font-size: 32px;
    }
}
.case-approach .img-txt .txt p {
    font-size: 16px;
    line-height: 148%;
    color: rgba(255, 255, 255, 0.7);
    margin-top: calc(60px - 24px);
    width: 100%;
    max-width: 560px;
}
@media (max-width: 1024px) {
    .case-approach .img-txt .txt p {
        max-width: 100%;
        margin-top: calc(48px - 24px);
    }
}

/* .case-one-img */

.case-one-img {
    height: 100%;
    overflow: hidden;
    aspect-ratio: 1440/856;
}
.case-one-img .img {


}
.case-one-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* case-two-img */

.case-two-img {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    padding: 0 24px;
}
@media (max-width: 568px) {
    .case-two-img {
        display: flex;
        flex-direction: column;
        gap: 12px;
        padding: 0 12px;
    }
}
.case-two-img .img {
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}
@media (max-width: 1024px) {
    .case-two-img .img {
        justify-content: flex-start;
    }
}
.case-two-img .img:nth-child(1) img {
    /*max-width: 442px;*/
    max-width: 60%;
    border-radius: 12px;
}
@media (max-width: 568px) {
    .case-two-img .img:nth-child(1) img {
        max-width: 100%;
    }
}

/* case-results */
/* case-kpi */

.case-results {
    display: flex;
    flex-direction: column;
    gap: 120px;
}
@media (max-width: 1024px) {
    .case-results {
        gap: 100px;
    }
}
@media (max-width: 568px) {
    .case-results {
        gap: 64px;
        padding: 0 12px;
    }
}

.case-results,
.case-kpi {
    padding: 0 24px;
}
@media (min-width: 1025px) {
    .case-kpi {
        margin-top: calc(-172px + 120px);
        gap: 4px;
    }
}
@media (max-width: 568px) {
    .case-results,
    .case-kpi {
        padding: 0 12px;
    }
}
.case-results .grid,
.case-kpi .grid {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 32px;
    width: 100%;
}
@media (max-width: 1024px) {
    .case-results .grid,
    .case-kpi .grid {

    }
}
@media (max-width: 568px) {
    .case-results .grid,
    .case-kpi .grid {
        flex-direction: column;
    }
}
.case-results .grid .left,
.case-kpi .grid .left {
    display: flex;
    flex-direction: column;
    gap: 24px;
    max-width: 340px;
}
@media (max-width: 1024px) {
    .case-results .grid .left,
    .case-kpi .grid .left {
        min-width: 210px;
    }
}
.case-results .grid .left h3,
.case-kpi .grid .left h3 {
    font-weight: 400;
    font-size: 16px;
    line-height: 148%;
    color: rgba(255, 255, 255, 0.7);
}
.case-results .grid .right,
.case-kpi .grid .right {
    width: 100%;
    max-width: 915px;
}
.case-results .grid .right p,
.case-kpi .grid .right p {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    color: #fff;
}
@media (max-width: 1024px) {
    .case-results .grid .right p,
    .case-kpi .grid .right p {
        font-size: 20px;
    }
}
@media (max-width: 1024px) {
    .case-results .grid .right p,
    .case-kpi .grid .right p {
        font-size: 16px;
    }
}
.case-kpi .right {
    display: flex;
    flex-direction: column;
}
.case-kpi .right .item {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 20px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
@media (max-width: 1024px) {
    .case-kpi .right .item {
        gap: 16px;
        padding: 16px 0;
    }
}
.case-kpi .right .item span {
    font-size: 16px;
    line-height: 148%;
    color: rgba(255, 255, 255, 0.7);
}
.case-kpi .right .item p {
    font-weight: 500;
    font-size: 24px;
    line-height: 110%;
}
@media (max-width: 1024px) {
    .case-kpi .right .item p {
        font-size: 20px;
    }
}
@media (max-width: 568px) {
    .case-kpi .right .item p {
        font-size: 16px;
    }
}

/* case-review */

.case-review {
    padding: 0 24px;
}
@media (min-width: 1440px) {
    .case-review {
        padding: 0 152px;
    }
}
@media (max-width: 568px) {
    .case-review {
        padding: 0 12px;
    }
}
.case-review .review {
    height: 100%;
    max-width: calc(100% - 148px);
    padding-right: 40px;
    display: flex;
    flex-direction: column;
    gap: 64px;
}
@media (max-width: 1024px) {
    .case-review .review {
        max-width: 100%;
        padding-right: 0;
        gap: 100px;
    }
}
@media (max-width: 568px) {
    .case-review .review {
        gap: 40px;
        padding-top: 40px;
    }
}
.case-review .review-top {
    display: flex;
    align-items: center;
    gap: 24px;
}
.case-review .review-avatar {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    overflow: hidden;
    background: #333;
    display: flex;
    align-items: center;
    justify-content: center;
}
.case-review .review-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.case-review .review-info{
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.case-review .review-title {
    font-size: 16px;
    line-height: 148%;
}
.case-review .review-role {
    line-height: 148%;
    color: rgba(255, 255, 255, 0.4);
}
.case-review .review-quote {
    font-weight: 500;
    font-size: 40px;
    line-height: 110%;
    color: #fff;
}
@media (max-width: 1024px) {
    .case-review .review-quote {
        font-size: 32px;
        line-height: 120%;
    }
}
@media (max-width: 568px) {
    .case-review .review-quote {
        font-size: 16px;
        line-height: 148%;
    }
}

/* case-next */

.case-next-2,
.case-next {
    padding: 172px 24px;
    height: 100svh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.case-next-2 .item,
.case-next .item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 120px;
}
.case-next-2 .item .info,
.case-next .item .info {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 64px;
}
@media (max-width: 568px) {
    .case-next-2 .item .info,
    .case-next .item .info {
        gap: 48px
    }
}
.case-next-2 .item .info span,
.case-next .item .info span {
    line-height: 148%;
    text-align: center;
    color: rgba(0, 0, 0, 0.7);
}
@media (max-width: 568px) {
    .case-next-2 .item .info span,
    .case-next .item .info span {
        font-size: 14px;
    }
}
.case-next-2 .item .info h1,
.case-next .item .info h2 {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
}
@media (max-width: 1024px) {
    .case-next-2 .item .info h1,
    .case-next .item .info h2 {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .case-next-2 .item .info h2,
    .case-next .item .info h2 {
        font-size: 36px;
    }
}
.case-next-2 .item .info p,
.case-next .item .info p {
    line-height: 148%;
    text-align: center;
    color: rgba(0, 0, 0, 0.7);
}
@media (max-width: 568px) {
    .case-next-2 .item .info p,
    .case-next .item .info p {
        font-size: 14px;
    }
}
.case-next-2 .item .line,
.case-next .item .line {
    background:  rgba(0, 0, 0, 0.1);
    width: 308px;
    height: 1px;
    position: relative;
}
@media (max-width: 568px) {
    .case-next-2 .item .line,
    .case-next .item .line {
        width: 180px;
    }
}
.case-next-2 .item .line span,
.case-next .item .line span {
    width: 72px;
    height: 1px;
    background: #000;
    position: absolute;
    left: 0;
}
.case-next-2 .item .line span {
    width: 100%;
}

/* case-slider */
.case-slider {
    padding: 0 152px;
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.case-slider.article-img_slider {
    padding: 0 24px;
    display: flex;
    flex-direction: column;
    gap: 32px;
}
@media (max-width: 568px) {
    .case-slider.article-img_slider {
        padding: 0 12px;
    }
}

.case-slider-img {
    display: flex;
    gap: 16px;
    height: 100vh;
    max-height: 520px;
    cursor: grab;
    user-select: none;
    overflow: hidden;
}

.case-slider-img.dragging {
    cursor: grabbing;
}

.case-slider-img .img {
    border-radius: 12px;
    overflow: hidden;
}

.case-slider-img .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
}

.case-slider-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
}

.case-slider-nav span {
    line-height: 148%;
    color: rgba(255, 255, 255, 0.7);
}

.case-slider-nav .next-prev {
    display: flex;
    gap: 20px;
}

.case-slider-nav .next-prev p {
    line-height: 148%;
    color: #fff;
    cursor: pointer;
}

.case-slider-nav .next-prev .dis {
    color: rgba(255, 255, 255, 0.3);
    pointer-events: none;
    cursor: default;
}

.case-slider-img.no-transition .img {
    transition: none !important;
}
.case-slider-img.with-transition .img {
    transition: width 0.3s ease, opacity 0.3s ease;
}

.case-slider-img .img {
    opacity: 0.35;
    width: 88px;
}
.case-slider-img .img.active {
    width: calc(100% - 16px*4 - 88px*4);
    opacity: 1;
}


/* Переходы */
.case-slider-img.no-transition .img {

}
.case-slider-img.with-transition .img {
    /*transition: width 0.6s cubic-bezier(0.25,0.46,0.45,0.94), opacity 0.6s cubic-bezier(0.25,0.46,0.45,0.94);*/
}
.case-slider-img .img {
    transition: width 0.3s ease, opacity 0.3s ease;
    cursor: grab;
}
.case-slider-img .img.active {
    /*width: 60%;*/
    /*opacity: 1;*/
    /*cursor: grabbing;*/
}
.case-slider-img.dragging .img {
    cursor: grabbing;
}
.case-slider-img.no-transition .img {
    transition: none;
}
.case-slider-img .img {
    /*transition: width 0.6s cubic-bezier(0.25,0.46,0.45,0.94), opacity 0.6s cubic-bezier(0.25,0.46,0.45,0.94);*/
}
.case-slider-img .img[style="width: 60%; opacity: 1;"] {
    /*width: 60%;*/
    /*transition: width 0.6s cubic-bezier(0.25,0.46,0.45,0.94), opacity 0.6s cubic-bezier(0.25,0.46,0.45,0.94);*/
}

/* page-services */

body:has(.page-services ) {
    /*background: #e8e8e8;*/
}

.page-services {
    margin-top: 64px;
}

.page-services h1.title {
    font-weight: 500;
    font-size: 195px;
    line-height: 100%;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    margin: auto;
    margin-bottom: 88px;
    width: fit-content;
}
@media (max-width: 1024px) {
    .page-services h1.title {
        font-size: 150px;
    }
}
@media (max-width: 568px) {
    .page-services h1.title {
        font-size: 80px;
        position: sticky;
        top: 17vh;
        margin-bottom: 32px;
    }
}

/* services-slider */

.services-slider {
    max-width: calc(100vw - 108px*2);
    /*max-height: calc(100dvh - 88px*2);*/
    margin: 88px auto;
    margin-top: 0;

    height:240vh;
}
@media (max-width: 568px) {
    .services-slider {
        max-width: calc(100vw - 12px*2);
    }
}

.services-slider-swiper {
    border-radius: 12px;
    height: 100%;
    width: 100%;
    overflow: hidden;

    max-height: calc(100dvh - 88px*2);

    position: sticky;
    top: 12vh;
}
@media (max-width: 1024px) {
    .services-slider-swiper {
        height: auto;
        max-height: initial;
        aspect-ratio: 728/520;
    }
}
@media (max-width: 568px) {
    .services-slider-swiper {
        aspect-ratio: 366/450;
        top: 32vh;
    }
}

.services-slider-swiper .swiper-wrapper {
    border-radius: 12px;
    /*overflow: hidden;*/
}

.services-slider-swiper .swiper-slide {
    width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
}

.services-slider-swiper .swiper-slide img,
.services-slider-swiper .swiper-slide video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
}

.services-slider-swiper .swiper-slide p {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    text-align: center;
    color: #fff;

    position: absolute;
    top: 80px;
    max-width: 580px;
}
@media (max-width: 1024px) {
    .services-slider-swiper .swiper-slide p {
        font-size: 20px;
        top: 70px;
    }
}
@media (max-width: 568px) {
    .services-slider-swiper .swiper-slide p {
        font-size: 16px;
        padding: 0 18px;
        top: 48px;
    }
}

.services-slider-swiper .swiper-pagination {
    /*display: flex;*/
    /*width: fit-content;*/
    gap: 0;
    bottom: 30px;
    pointer-events: none;
}
.services-slider-swiper .swiper-pagination .swiper-pagination-bullet {
    width: 35px;
    height: 1px;
    opacity: .3;
    margin: 0;
    padding: 0;
    background: #fff;
}
.services-slider-swiper .swiper-pagination .swiper-pagination-bullet-active {
    opacity: 1;
}

/* services-list */

.services-list {
    /*padding: 0 24px;*/
}

.services-list .item {
    width: 100%;
    padding: 80px 24px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 150px;
}
@media (max-width: 1024px) {
    .services-list .item {
        flex-direction: column;
        padding: 60px 24px;
        gap: 32px;
    }
}
@media (max-width: 568px) {
    .services-list .item {
        padding: 48px 12px;
    }
    .services-list .item:nth-child(1) {
        padding-top: 0;
    }
}

.services-list .item .left {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 60px;
}
@media (max-width: 1024px) {
    .services-list .item .left {
        gap: 40px;
    }
}
@media (max-width: 568px) {
    .services-list .item .left {
        gap: 32px;
    }
}

.services-list .item .left .top {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.services-list .item .left .top .tag {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}
@media (max-width: 1024px) {
    .services-list .item .left .top .tag {

    }
}

.services-list .item .left .top .tag span {
    border-radius: 8px;
    padding: 12px;
    background: rgba(0, 0, 0, 0.05);
    opacity: 0.8;
    font-size: 13px;
    line-height: 135%;
    letter-spacing: 0.01em;
    text-align: center;
    color: #000;
}
@media (max-width: 568px) {
    .services-list .item .left .top .tag span {
        font-size: 12px;
    }
}

.services-list .item .left .top h2 {
    font-weight: 500;
    font-size: 40px;
    line-height: 110%;
    color: #000;
}
@media (max-width: 1024px) {
    .services-list .item .left .top h2 {
        font-size: 32px;
        line-height: 120%;
    }
}
@media (max-width: 568px) {
    .services-list .item .left .top h2 {
        font-size: 20px
    }
}

.services-list .item .left p {
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);
}
@media (max-width: 1024px) {
    .services-list .item .left p {

    }
}
@media (max-width: 568px) {
    .services-list .item .left p {
        font-size: 14px;
    }
}

.services-list .item .left a {
    border-radius: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 115px;
    height: 52px;
    background: #000;
    border: 1px solid #000;
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #fff;
    position: relative;
    z-index: 1;
    overflow: hidden;
    transition: .3s ease;
}
.services-list .item .left a:after {
    content: '';
    background: #ffffff;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    pointer-events: none;
    transform: translate(0px, 100%);
    transition: .3s ease;
}
.services-list .item[style='background: rgba(232, 232, 232, 0.5);'] .left a:after {
    background: #f3f3f3;
}
.services-list .item[style='background: #e8e8e8;'] .left a:after  {
    background: #e8e8e8;
}
.services-list .item .left a:hover {
    background: rgba(0, 0, 0, 0);
    color: #000;
}
.services-list .item .left a:hover:after {
    transform: translate(0px, 0%);
}
@media (max-width: 1024px) {
    .services-list .item .left a {
        height: 48px;
    }
}

.services-list .item .right {
    width: 100%;
    /*max-width: 680px;*/
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.services-list .item .right .img {
    border-radius: 12px;
    aspect-ratio: 680/308;
    overflow: hidden;
}

.services-list .item .right .img img,
.services-list .item .right .img video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.services-list .item .right {

}

.services-list .item .right {

}

.services-list .accordion-container {
    margin: 0 auto;
    overflow: hidden;
    width: 100%;
}

.services-list .accordion-item {
    border: none;
    border-bottom: 1px solid #e9ecef;
    background: transparent;
}


.services-list .accordion-item:last-child {
    border-bottom: none;
}

.services-list .accordion-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0px;
    cursor: pointer;
    transition: background-color 0.3s ease;
    user-select: none;
}
@media (max-width: 1024px) {
    .services-list .accordion-header {

    }
}

.services-list .accordion-header:hover {

}

.services-list .accordion-item.active .accordion-header {
    /*border-bottom: 1px solid #e9ecef;*/
}

.services-list .accordion-header h3 {
    font-weight: 500;
    font-size: 16px;
    line-height: 148%;
    color: #000;
    transition: .3s ease;
}

.services-list .accordion-container:has(.active) .accordion-item:not(.active) .accordion-header {
    /*color: rgba(0, 0, 0, 0.2);*/
    opacity: .3;
}

.services-list .accordion-container:has(:hover) .accordion-item:not(:hover) .accordion-header {
    /*color: rgba(0, 0, 0, 0.2);*/
    opacity: .3;
}

.services-list .accordion-icon {
    font-size: 20px;
    font-weight: 300;
    color: #6c757d;
    transition: transform 0.3s ease, color 0.3s ease;
    min-width: 20px;
    text-align: center;
}

.services-list .accordion-item.active .accordion-icon {
    color: #495057;
    transform: rotate(0deg);
}

.services-list .accordion-content {
    overflow: hidden;
    opacity: 0;
    height: 0px;
}

.services-list .accordion-item.active .accordion-content {
    opacity: 1;
}
.services-list .accordion-content .content-inner {
    padding-top: 12px;
    padding-bottom: 24px;
}

.services-list .accordion-content p {
    font-size: 16px;
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);
}
@media (max-width: 568px) {
    .services-list .accordion-content p {
        font-size: 14px;
    }
}

.services-list .accordion-item.active .accordion-content {
    /*display: block;*/
}

.services-list .accordion-content .learn-more-btn {
    border: 1px solid rgba(0, 0, 0, 0.3);
    border-radius: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 116px;
    height: 52px;
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #000;
    margin-top: 24px;
    position: relative;
    z-index: 1;
    overflow: hidden;
    transition: .3s ease;
}
.services-list .accordion-content .learn-more-btn:after {
    content: '';
    background: #000000;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    pointer-events: none;
    transform: translate(0px, 100%);
    transition: .3s ease;
}
.services-list .accordion-content .learn-more-btn:hover {
    background: rgba(0, 0, 0, 1);
    color: #ffffff;
}
.services-list .accordion-content .learn-more-btn:hover:after {
    transform: translate(0px, 0%);
}

/* services-look */

.services-look-img {
    position: relative;
    z-index: 1;
    overflow: hidden;
    height: 100dvh;
}
@media (max-width: 1024px) {
    .services-look-img {
        height: auto;
        aspect-ratio: 768/480;
    }
}
@media (max-width: 568px) {
    .services-look-img {
        aspect-ratio: 390/246;
        max-width: calc(100%);
    }
}
.services-look-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.services-look {
    padding: 88px 24px;
    padding-top: 508px;
    padding-bottom: 400px;
    background: #000;
    /*min-height: 120dvh;*/
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
@media (max-width: 1024px) {
    .services-look {
        min-height: 100dvh;
        padding-top: 468px;
        padding-bottom: 352px;
    }
}
@media (max-width: 568px) {
    .services-look {
        padding-top: 344px;
        padding-bottom: 254px;
    }
}
.services-look .img {
    /*position: relative;*/
}
.services-look .img img {
    position: absolute;
}
.services-look .img img:nth-child(1) {
    border-radius: 12px;
    width: 443px;
    height: 264px;
    top: 88px;
    left: 24px;
    opacity: 0;
}
@media (max-width: 1024px) {
    .services-look .img img:nth-child(1) {
        border-radius: 8px;
        width: 355px;
        height: 224px;
    }
}
@media (max-width: 568px) {
    .services-look .img img:nth-child(1) {
        width: 183px;
        height: 112px;
        left: 12px;
    }
}
.services-look .img img:nth-child(2) {
    border-radius: 12px;
    width: 324px;
    height: 208px;
    top: 224px;
    right: 24px;
}
@media (max-width: 1024px) {
    .services-look .img img:nth-child(2) {
        border-radius: 8px;
        width: 280px;
        height: 160px;
        top: 232px;
        right: 12px;
    }
}
@media (max-width: 568px) {
    .services-look .img img:nth-child(2) {
        width: 148px;
        height: 95px;
        top: 185px;
        right: 12px;
    }
}
.services-look .img img:nth-child(3) {
    border-radius: 12px;
    width: 378px;
    height: 236px;
    right: 22%;
    bottom: 88px;
}
@media (max-width: 1024px) {
    .services-look .img img:nth-child(3) {
        border-radius: 8px;
        width: 302px;
        height: 188px;
        right: 24px;
    }
}
@media (max-width: 568px) {
    .services-look .img img:nth-child(3) {
        width: 182px;
        height: 102px;
        right: 12px;
    }
}
.services-look .text {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 120px;
    width: 100%;
    position: relative;
    z-index: 1;
}
@media (max-width: 1024px) {
    .services-look .text {
        gap: 100px;
    }
}
@media (max-width: 568px) {
    .services-look .text {
        gap: 64px;
    }
}
.services-look .text h3 {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
    color: #fff;
}
@media (max-width: 1024px) {
    .services-look .text h3 {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .services-look .text h3{
        font-size: 36px;
    }
}
.services-look .text h3 span {
    color: #fff;
    font-style: italic;
    font-weight: 400;
    letter-spacing: -0.01em;
}
.services-look .text a {
    width: 100%;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding: 40px 10px 32px;
    font-style: italic;
    font-weight: 400;
    font-size: 44px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
    justify-content: center;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 32px;
    transition: .3s ease;
}
@media (max-width: 1024px) {
    .services-look .text a {
        padding: 32px 10px 24px;
        font-size: 40px;
    }
}
@media (max-width: 568px) {
    .services-look .text a {
        padding: 24px 10px 16px;
        font-size: 24px;
    }
    .services-look .text a svg {
        width: 40px;
        height: 40px;
    }
}
.services-look .text a:hover {
    border-bottom: 1px solid rgba(255, 255, 255, 1);
    border-top: 1px solid rgba(255, 255, 255, 1);
}

/* services-how */

.services-how {
    padding: 172px 24px;
    display: flex;
    flex-direction: column;
    gap: 120px;
}
@media (max-width: 1024px) {
    .services-how {
        padding: 148px 24px;
        gap: 64px;
    }
}
@media (max-width: 568px) {
    .services-how {
        padding: 100px 12px;
        gap: 48px;
    }
}
.services-how h2.title {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
}
@media (max-width: 1024px) {
    .services-how h2.title {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .services-how h2.title {
        font-size: 36px;
    }
}
.services-how h2.title span {
    font-style: italic;
    font-weight: 400;
}
.services-how .grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 150px;
    row-gap: 48px;
}
@media (max-width: 1024px) {
    .services-how .grid {
        display: flex;
        flex-direction: column;
        gap: 24px;
    }
}
.services-how .grid .item {
    border-top: 1px solid rgba(0, 0, 0, 0.2);
    padding: 28px 0px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
@media (max-width: 1024px) {
    .services-how .grid .item {
        padding: 24px 0px;
        gap: 20px;
    }
}
@media (max-width: 568px) {
    .services-how .grid .item {
        padding: 16px 0px;
        gap: 12px;
    }
}
.services-how .grid .item span {
    font-weight: 500;
    font-size: 16px;
    line-height: 148%;
}
.services-how .grid .item h3 {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
}
@media (max-width: 1024px) {
    .services-how .grid .item h3 {
        font-size: 20px;
    }
}
@media (max-width: 568px) {
    .services-how .grid .item h3 {
        font-size: 16px;
    }
}
.services-how .grid .item p {
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);
}
.services-how {

}

/* services-do */

.services-do {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 172px 0px;
    background: #e8e8e8;
    position: relative;
}
.services-do {
    display: flex;
    flex-direction: column;
    gap: 120px;
    align-items: center;
}
@media (max-width: 1024px) {
    .services-do {
        padding: 148px 0px;
        gap: 88px;
    }
}
@media (max-width: 568px) {
    .services-do {
        padding: 100px 0px;
        padding-top: 160px;
        gap: 64px;
    }
}
.services-do .img {
    width: 594px;
    height: 560px;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
}
@media (max-width: 1024px) {
    .services-do .img {
        width: 378px;
        height: 356px;
    }
}
@media (max-width: 568px) {
    .services-do .img {
        width: 100%;
        height: 381px;
        top: 0px;
        left: 0;
    }
}
.services-do .img img,
.services-do .img video {
    width: 100%;
    /*rotate: 318deg;*/
    /*transform: translate(150px, -210px);*/
}
@media (min-width: 1024px) {
    [data-browser="safari"] .services-do .img {
        -webkit-filter: brightness(94%) contrast(99%);
        filter: brightness(94%) contrast(99%);
    }
}
@media (max-width: 1024px) {
    .services-do .img img,
    .services-do .img video {
        /*transform: translate(110px, -160px);*/
    }
}
@media (max-width: 568px) {
    .services-do .img img,
    .services-do .img video {
        transform: translate(-60px, -50px);
    }
}
.services-do h2.title {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
    color: #000;
    position: relative;
    z-index: 1;
}
@media (max-width: 1024px) {
    .services-do h2.title {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .services-do h2.title {
        font-size: 36px;
    }
}
.services-do h2.title span {
    font-style: italic;
    font-weight: 400;
}

.services-do .accordion-container {
    margin: 0 auto;
    overflow: hidden;
    width: 100%;
    max-width: 764px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
@media (max-width: 1024px) {
    .services-do .accordion-container {

    }
}
@media (max-width: 568px) {
    .services-do .accordion-container {
        padding: 0 20px;
    }
}

.services-do .accordion-item {
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 12px;
    padding: 24px;
    background: transparent;
    transition: .3s ease;
}
@media (max-width: 1024px) {
    .services-do .accordion-item {

    }
}
@media (max-width: 568px) {
    .services-do .accordion-item {
        border-radius: 8px;
        padding: 15px 12px;
    }
}
.services-do .accordion-item:hover {
    border: 1px solid rgba(0, 0, 0, 0.7);
}


.services-do .accordion-header {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    transition: background-color 0.3s ease;
    user-select: none;
}

.services-do .accordion-header:hover {

}

.services-do .accordion-item.active .accordion-header {
    /*border-bottom: 1px solid #e9ecef;*/
}

.services-do .accordion-header h3 {
    font-weight: 500;
    font-size: 16px;
    line-height: 148%;
    color: #000;
}
@media (max-width: 1024px) {
    .services-do .accordion-header h3 {

    }
}
@media (max-width: 568px) {
    .services-do .accordion-header h3 {
        font-size: 13px;
    }
}

.services-do .accordion-icon {
    font-size: 20px;
    font-weight: 300;
    color: #6c757d;
    transition: transform 0.3s ease, color 0.3s ease;
    min-width: 20px;
    text-align: center;
}

.services-do .accordion-item.active .accordion-icon {
    color: #495057;
    transform: rotate(0deg);
}

.services-do .accordion-item .accordion-content {
    overflow: hidden;
    opacity: 0;
    height: 0px;
}
.services-do .accordion-item.active .accordion-content {
    opacity: 1;
    /*padding: 12px 0px;*/
}

.services-do .accordion-item .accordion-content .content-inner {
    padding: 24px 0px;
    padding-bottom: 0;
    padding-top: 32px;
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.services-do .accordion-content p {
    font-size: 16px;
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);

}

.services-do .accordion-item.active .accordion-content {
    display: block;
}

.services-do .accordion-content .learn-more-btn {
    border: 1px solid rgba(0, 0, 0, 0.3);
    border-radius: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 116px;
    height: 52px;
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #000;
    margin-top: 24px;
    transition: .3s ease;
}
.services-do .accordion-content .learn-more-btn:hover {
    background: #000000;
    color: #ffffff;
}


/* service-top */

.service-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 32px;
    padding: 0 24px;
}
@media (max-width: 1024px) {
    .service-top {
        flex-direction: column;
        gap: 80px;
    }
}
@media (max-width: 568px) {
    .service-top {
        gap: 48px;
        padding: 0 12px;
    }
}
.service-top .left {
    display: flex;
    flex-direction: column;
    gap: 56px;
    padding-top: 88px;
}
@media (max-width: 1024px) {
    .service-top .left {
        padding-top: 0;
        gap: 32px;
    }
}
@media (max-width: 568px) {
    .service-top .left {

    }
}
.service-top .left p {
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);
}
.service-top .left h1 {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    color: #000;
}
@media (max-width: 1024px) {
    .service-top .left h1 {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .service-top .left h1 {
        font-size: 36px;
    }
}
.service-top .left h1 span {
    font-style: italic;
    font-weight: 400;
}
.service-top .img {
    border-radius: 12px;
    overflow: hidden;
    width: 40%;
}
@media (max-width: 1024px) {
    .service-top .img {
        border-radius: 8px;
        width: 100%;
        aspect-ratio: 728/580;
    }
}
@media (max-width: 568px) {
    .service-top .img {
        aspect-ratio: 366/360;
    }
}
.service-top .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

/* service-black */

.service-black {
    margin-top: 24px;
}

/* service-what */

.service-what {
    display: flex;
    flex-direction: column;
    gap: 88px;
}
@media (max-width: 1024px) {
    .service-what {
        gap: 64px;
    }
}
@media (max-width: 568px) {
    .service-what {
        gap: 48px;
    }
}
.service-what .title {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
    padding: 0 24px;
}
@media (max-width: 1024px) {
    .service-what .title {
        font-size: 70px;
        text-align: left;
    }
}
@media (max-width: 568px) {
    .service-what .title {
        font-size: 36px;
        padding: 0 12px;
    }
}
.service-what .title span {
    font-style: italic;
    font-weight: 400;
}
.service-what {

}
.service-what .tabs-section {
    padding: 0 24px;
}
@media (max-width: 1024px) {
    .service-what .tabs-section {

    }
}
@media (max-width: 568px) {
    .service-what .tabs-section {
        padding: 0 12px;
        flex-direction: column;
    }
}
.service-what .tabs-shell {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    align-items: stretch;
}
@media (max-width: 1024px) {
    .service-what .tabs-shell {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }
}
@media (max-width: 568px) {
    .service-what .tabs-shell {
        gap: 12px;
    }
}
.service-what .tabs-left {
    background: #212121;
    border-radius: 12px;
    padding: 32px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.05);
    /*aspect-ratio: 680 / 600;*/
}
@media (max-width: 1024px) {
    .service-what .tabs-left {
        aspect-ratio: auto;
    }
}
@media (max-width: 568px) {
    .service-what .tabs-left {
        padding: 20px;
    }
}
.service-what .button-list {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 98px;
}
@media (max-width: 1024px) {
    .service-what .button-list {
        margin-bottom: 88px;
    }
}
@media (max-width: 568px) {
    .service-what .button-list {
        overflow-x: auto;
        margin-bottom: 24px;
    }
    .service-what .button-list::-webkit-scrollbar {
        display: none;
    }
}
.service-what .tab-btn {
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 40px;
    padding: 0px 20px;
    height: 48px;
    width: fit-content;
    background: rgba(255, 255, 255, 0.05);
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #fff;
    position: relative;
    z-index: 1;
    overflow: hidden;
    transition: .3s ease;
}
@media (max-width: 568px) {
    .service-what .tab-btn {
        white-space: nowrap;
        min-width: fit-content;
    }
}
.service-what tab-btn + .service-what .tab-btn {
    margin-left: 10px;
}
.service-what .tabs-left > .tab-btn {
    margin: 0 10px 14px 0;
    display: inline-flex;
}
.service-what .tab-btn:hover {
    ;
}
.service-what .tab-btn:after {
    content: '';
    background: rgba(255, 255, 255, 0.1);
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    pointer-events: none;
    transform: translate(0px, 100%);
    transition: .3s ease;
}
.service-what .tab-btn:hover {
    /*color: #000000;*/
    /*border: 1px solid #000000;*/
}
.service-what .tab-btn:hover:after {
    transform: translate(0px, 0%);
}
.service-what .tab-btn.is-active {
    background: rgba(255, 255, 255, 0.1);
}
.service-what .tab-btn.is-active:after {
    display: none;
}
.service-what .tab-panel {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: calc(100% - 48px - 96px);
}
.service-what .tab-list {
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
    list-style: none;
}
.service-what .tab-list li {
    line-height: 148%;
    color: rgba(255, 255, 255, 0.7);
    position: relative;
    padding-left: 18px;
}
@media (max-width: 568px) {
    .service-what .tab-list li {
        font-size: 14px;
        padding-left: 16px;
    }
}
.service-what .tab-list li::before {
    content: "–";
    position: absolute;
    left: 0;
    color: #8f8fa3;
}
.service-what .price {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding: 32px 0px 0px;
    margin-top: 32px;
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    color: #fff;
}
@media (max-width: 1024px) {
    .service-what .price {
        margin-top: 64px;
        font-size: 20px;
    }
}
@media (max-width: 568px) {
    .service-what .price {
        margin-top: 32px;
        font-size: 16px;
        padding: 20px 0px 0px;
    }
}
.service-what .tabs-right {
    background: rgba(217, 211, 255, 0.1);
    border-radius: 12px;
    overflow: hidden;

}
@media (max-width: 1024px) {
    .service-what .tabs-right {
        border-radius: 8px;
        width: 728px;
        height: 485px;
        aspect-ratio: auto;
    }
}
@media (max-width: 568px) {
    .service-what .tabs-right {
        width: 100%;
        height: 260px;
    }
}
.service-what .tabs-right img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    aspect-ratio: 680 / 600;
}
/* service-quote */

.service-quote {
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 12px;
    margin: 0 24px;
    width: calc(100% - 48px);
    display: flex;
    justify-content: space-between;
    gap: 70px;
    background: rgba(255, 255, 255, 0.05);
}
@media (max-width: 1024px) {
    .service-quote {
        flex-direction: column;
        gap: 64px;
    }
}
@media (max-width: 568px) {
    .service-quote {
        gap: 48px;
        margin: 0 12px;
        width: calc(100% - 24px);
    }
}
.service-quote .left {
    padding: 56px;
    display: flex;
    flex-direction: column;
    gap: 56px;
    justify-content: space-between;
}
@media (max-width: 1024px) {
    .service-quote .left {
        padding: 52px;
        gap: 64px;
    }
}
@media (max-width: 568px) {
    .service-quote .left {
        padding: 32px;
        padding-bottom: 0;
        gap: 48px;
    }
}
.service-quote .left h2 {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    color: #fff;
}
@media (max-width: 1024px) {
    .service-quote .left h2 {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .service-quote .left h2 {
        font-size: 36px;
    }
}
.service-quote .left h2 span {
    font-style: italic;
    font-weight: 400;
}
.service-quote .left a {
    border-radius: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 121px;
    height: 52px;
    background: #fff;
    border: 1px solid #fff;
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #000;
    position: relative;
    z-index: 1;
    overflow: hidden;
    transition: .3s ease;
}
.service-quote .left a:after {
    content: '';
    background: #000;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    pointer-events: none;
    transform: translate(0px, 100%);
    transition: .3s ease;
}
.service-quote .left a:hover {
    color: #ffffff;
    border: 1px solid #ffffff;
}
.service-quote .left a:hover:after {
    transform: translate(0px, 0%);
}
.service-quote .right {
    display: flex;
    flex-direction: column;
    gap: 16px;
    overflow: hidden;
}
@media (max-width: 1024px) {
    .service-quote .right {
        align-items: flex-end;
    }
}
@media (max-width: 568px) {
    .service-quote .right {

    }
}
.service-quote .right .item {
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 12px 0 0 12px;
    padding: 64px;
    display: flex;
    align-items: center;
    gap: 64px;
    background: rgba(255, 255, 255, 0.05);
}
@media (max-width: 1024px) {
    .service-quote .right .item {
        width: 100%;
        max-width: 480px;
        padding: 48px;
        gap: 48px;
    }
}
@media (max-width: 568px) {
    .service-quote .right .item {
        padding: 32px;
        gap: 32px;
        width: calc(100% - 32px);
    }
}
.service-quote .right .item:last-child {
    border-radius: 120px 0 0 120px;
}
.service-quote .right .item span {
    line-height: 148%;
    color: rgba(255, 255, 255, 0.7);
}
@media (max-width: 1024px) {
    .service-quote .right .item span {
        font-size: 16px;
    }
}
@media (max-width: 568px) {
    .service-quote .right .item span {
        font-size: 14px;
    }
}
.service-quote .right .item p {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    color: #fff;
}
@media (max-width: 1024px) {
    .service-quote .right .item p {
        font-size: 20px;
    }
}
@media (max-width: 568px) {
    .service-quote .right .item p {
        font-size: 13px;
    }
}

/* service-txt */

.service-txt {
    padding: 0 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.service-txt p {
    max-width: 386px;
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    text-align: center;
    color: #fff;
}
@media (max-width: 1024px) {
    .service-txt p {
        font-size: 20px;
    }
}
@media (max-width: 568px) {
    .service-txt p {
        font-size: 16px;
        line-height: 148%;
    }
}


body:has(.page-service ) {
    background: #e8e8e8;
}

/* .page-services .main-step */

.page-service .main-step {
    background: #fff;
}

/* service-more */

.service-more {
    padding: 0 24px;
    display: flex;
    flex-direction: column;
    gap: 88px;
    padding-bottom: 172px;
    background: #ffffff;
}
@media (max-width: 1024px) {
    .service-more {
        padding-bottom: 148px;
        gap: 64px;
    }
}
@media (max-width: 568px) {
    .service-more {
        gap: 48px;
        padding: 0 12px;
        padding-bottom: 100px;
    }
}
.service-more h2 {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
}
@media (max-width: 1024px) {
    .service-more h2 {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .service-more h2 {
        font-size: 36px;
    }
}
.service-more h2 span {
    font-style: italic;
    font-weight: 400;
    letter-spacing: -0.01em;
}

.services-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 150px;
}
@media (max-width: 1024px) {
    .services-container {
        display: flex;
        flex-direction: column;
    }
}
@media (max-width: 568px) {
    .services-container {

    }
}

.services-visual {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    aspect-ratio: 680/600;
    transition: transform 0.3s ease;
}
@media (max-width: 1024px) {
    .services-visual {
        display: none;
    }
}

.services-visual:hover {

}

.visual-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    /*transition: .3s;*/
    /*position: relative;*/
}
.visual-image:nth-child(1) {
    /*z-index: 0;*/
}
.visual-image:nth-child(2) {
    /*z-index: 1;*/
}
.visual-image:nth-child(3) {
    /*z-index: 2;*/
}
.visual-image:nth-child(4) {
    /*z-index: 3;*/
}
.visual-image:not(#default-image) {
    /*height: 0;*/
}

.visual-image:not(.active) {
    /*position: absolute;*/
    /*top: 0;*/
    /*left: 0;*/
}

.visual-image.active {
    /*opacity: 1;*/
    /*height: 100% !important;*/
}

.service-more-list {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 16px;
}
.service-more-list .list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
@media (max-width: 1024px) {
    .service-more-list .list {
        gap: 0;
    }
}

.service-category {
    padding: 28px 0px;
    border-bottom: 1px solid rgba(0, 0, 0, 0);
    transition: .3s ease;
    position: relative;
}
@media (max-width: 1024px) {
    .service-category {
        display: flex;
        justify-content: space-between;
        gap: 32px;
        align-items: flex-start;
        border-top: 1px solid rgba(0, 0, 0, 0.2);
    }
}
@media (max-width: 568px) {
    .service-category {

    }
}
.service-category:after {
    content: '';
    position: absolute;
    width: 0%;
    height: 1px;
    background: rgba(0, 0, 0, 1);
    display: flex;
    bottom: 0;
    transition: .5s;
}
.service-category.active:after {
    width: 100%;
}

.service-category:last-child {

}

.service-category .info {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
@media (max-width: 1024px) {
    .service-category .info {
        gap: 20px;
    }
}
@media (max-width: 568px) {
    .service-category .info {
        gap: 12px;
    }
}

.category-title {
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);
}
@media (max-width: 568px) {
    .category-title {
        font-size: 14px;
    }
}

.service-item {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    color: #000;
}
@media (max-width: 1024px) {
    .service-item {
        font-size: 20px;
    }
}
@media (max-width: 568px) {
    .service-item {
        font-size: 16px;
    }
}

.view-all-btn {
    border-radius: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 150px;
    height: 52px;
    background: #000;
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #fff;
    position: relative;
    z-index: 1;
    overflow: hidden;
    transition: .3s ease;
}
.view-all-btn:after {
    content: '';
    background: #ffffff;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    pointer-events: none;
    transform: translate(0px, 100%);
    transition: .3s ease;
}
.view-all-btn:hover {
    color: #000000;
    border: 1px solid #000000;
}
.view-all-btn:hover:after {
    transform: translate(0px, 0%);
}

.service-category .img {
    display: none;
}
@media (max-width: 1024px) {
    .service-category .img {
        display: flex;
        border-radius: 8px;
        width: 172px;
        height: 150px;
        overflow: hidden;
    }
    .service-category .img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }
}
@media (max-width: 568px) {
    .service-category .img {
        display: none;
    }
}


/* page-about */

.page-about {

}

/* about-title */

.about-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 88px;
    padding: 88px 24px;
}
@media (max-width: 1024px) {
    .about-title {
        gap: 64px;
        padding: 64px 24px;
    }
}
@media (max-width: 568px) {
    .about-title {
        gap: 48px;
        padding: 48px 12px;
    }
}
.about-title h1 {
    font-weight: 500;
    font-size: 195px;
    line-height: 90%;
    letter-spacing: -0.02em;
    text-align: center;
    color: #000;
}
@media (max-width: 1024px) {
    .about-title h1 {
        font-size: 150px;
    }
}
@media (max-width: 568px) {
    .about-title h1 {
        font-size: 80px;
    }
}
.about-title p {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    text-align: center;
    color: #000;
    max-width: 450px;
}
@media (max-width: 1024px) {
    .about-title p {
        font-size: 20px;
    }

}
@media (max-width: 568px) {
    .about-title p {
        font-size: 16px;
    }

}

/* about-img */

.about-img {

}
.about-img .img {
    max-height: 100dvh;
    aspect-ratio: 1440/540;
}
@media (max-width: 1024px) {
    .about-img .img {
        aspect-ratio: 768/300;
    }
}
@media (max-width: 568px) {
    .about-img .img {
        aspect-ratio: 390/200;
    }
}
.about-img .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

/* about-mission */

.about-mission {
    display: flex;
    flex-direction: column;
    gap: 120px;
    padding: 120px 24px 194px;
    background: #000;

    position: relative;
}
@media (max-width: 1024px) {
    .about-mission {
        gap: 100px;
        padding: 100px 20px 110px;
    }
}
@media (max-width: 568px) {
    .about-mission {
        gap: 48px;
        padding: 100px 12px 100px;
    }
}
.about-mission .title {
    display: flex;
    gap: 40px;
}
@media (max-width: 1024px) {
    .about-mission .title {

    }
}
.about-mission .title h2 {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    color: #fff;
}
@media (max-width: 1024px) {
    .about-mission .title h2 {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .about-mission .title h2 {
        font-size: 36px;
    }
}
.about-mission .title h2 span {
    font-style: italic;
    font-weight: 400;
    color: #fff;
}
.about-mission .title .img {
    border-radius: 12px;
    width: 249px;
    height: 263px;
    overflow: hidden;
}
@media (max-width: 1024px) {
    .about-mission .title .img {
        border-radius: 8px;
        width: 132px;
        min-width: 132px;
        height: 139px;
    }
}
@media (max-width: 568px) {
    .about-mission .title .img {
        display: none;
    }
}
.about-mission .title .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.about-mission .text {

}
.about-mission .text .img {
    border-radius: 0 12px 0 0;
    width: 348px;
    height: 434px;
    overflow: hidden;

    position: absolute;
    bottom: 0;
    left: 0;
}
@media (max-width: 1024px) {
    .about-mission .text .img {
        border-radius: 0 8px 0 0;
        width: 254px;
        height: 360px;
    }
}
@media (max-width: 568px) {
    .about-mission .text .img {
        display: none;
    }
}
.about-mission .text .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.about-mission .text .txt {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 44px;
}
@media (max-width: 1024px) {
    .about-mission .text .txt {
        padding-left: calc(254px + 40px + 48px);
        align-items: flex-start;
    }
}
@media (max-width: 568px) {
    .about-mission .text .txt {
        padding-left: 0;
    }
}
.about-mission .text .txt p {
    line-height: 148%;
    text-align: center;
    color: rgba(255, 255, 255, 0.7);
    max-width: 490px;
}
@media (max-width: 1024px) {
    .about-mission .text .txt p {
        text-align: left;
    }
}
@media (max-width: 568px) {
    .about-mission .text .txt p {
        font-size: 14px;
    }
}
.about-mission .text .txt a {
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 113px;
    height: 52px;
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #fff;
    transition: .3s ease;
}
.about-mission .text .txt a:hover {
    border: 1px solid rgba(255, 255, 255, 1);
    color: #000000;
    background: #ffffff;
}

/* about-philosophy */

.about-philosophy {
    padding: 172px 0px;
}
@media (max-width: 1024px) {
    .about-philosophy {
        padding: 148px 0px;
    }
}
@media (max-width: 768px) {
    .about-philosophy {
        overflow: hidden;
    }
}
@media (max-width: 568px) {
    .about-philosophy {
        padding: 100px 0px;
    }
}
.about-philosophy .title {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 56px;
    margin-bottom: 88px;
}
@media (max-width: 1024px) {
    .about-philosophy .title {
        margin-bottom: 64px;
    }
}
@media (max-width: 568px) {
    .about-philosophy .title {
        gap: 32px;
        margin-bottom: 32px;
    }
}
.about-philosophy .title span {

}
.about-philosophy .title h2 {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
    color: #000;
}
@media (max-width: 1024px) {
    .about-philosophy .title h2 {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .about-philosophy .title h2 {
        font-size: 36px;
    }
}
.about-philosophy .title h2 span {
    font-style: italic;
    font-weight: 400;
}
.about-philosophy-list {
    /*display: flex;*/
    /*flex-wrap: wrap;*/
    /*gap: 32px;*/
    /*padding: 0 24px;*/
    pointer-events: none;
}
@media (max-width: 1024px) {
    .about-philosophy-list {
        flex-wrap: nowrap;
        overflow-x: auto;
        gap: 12px;
        padding-bottom: 12px;
    }
}
@media (max-width: 568px) {
    .about-philosophy-list {
        padding: 0 12px;

        padding-bottom: 12px
    }
}
.about-philosophy-item {
    border-radius: 12px;
    width: 280px;
    height: 320px;
    /*overflow: hidden;*/
}
@media (max-width: 1024px) {
    .about-philosophy-item {
        border-radius: 8px;
        width: 280px;
        min-width: 280px;
        height: 320px;
    }
}
@media (max-width: 568px) {
    .about-philosophy-item {
        border-radius: 8px;
        width: 240px;
        min-width: 240px;
        height: 288px !important;
    }
    .about-philosophy-item:last-child {
        margin-right: 40px;
    }
    .about-philosophy-item.placeholder-start {
        display: none;
    }
    .about-philosophy-item.placeholder-end {
        display: none;
    }
}
.about-philosophy-item .front {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    background: #e8e8e8;
    padding-top: 24px;
    height: 100%;
    border-radius: 12px;
    overflow: hidden;
}
.about-philosophy-item:hover .front {
    /*display: none;*/
}
.about-philosophy-item .front span {
    line-height: 148%;
    text-align: center;
    color: rgba(0, 0, 0, 0.2);
    padding: 0 24px;
}
.about-philosophy-item .front p {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    padding: 0 24px;
}
@media (max-width: 1024px) {
    .about-philosophy-item .front p {
        font-size: 20px;
    }
}
@media (max-width: 568px) {
    .about-philosophy-item .front p {
        font-size: 16px;
        padding: 0 20px;
    }
}
.about-philosophy-item .front .img {
    width: 280px;
    height: 146px;
    overflow: hidden;
}
@media (max-width: 568px) {
    .about-philosophy-item .front .img {
        width: 100%;
    }
}
.about-philosophy-item .front .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.about-philosophy-item .back {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;
    background: #000000;
    padding: 24px;
    height: 100%;
    border-radius: 12px;
    overflow: hidden;
}
.about-philosophy-item:nth-child(2) .back,
.about-philosophy-item:nth-child(4) .back,
.about-philosophy-item:nth-child(6) .back {
    background: #212121;
}
.about-philosophy-item .back span {
    font-weight: 500;
    line-height: 130%;
    color: #fff;
}
.about-philosophy-item .back p {
    line-height: 148%;
    color: rgba(255, 255, 255, 0.7);
}
@media (max-width: 568px) {
    .about-philosophy-item .back p {
        font-size: 14px;
    }
}
.about-philosophy-item:hover .back {
    display: flex;
}

/* about-banner */

.about-banner {
    height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.about-banner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.about-banner h3 {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
    color: #fff;

    position: absolute;
}
@media (max-width: 1024px) {
    .about-banner h3 {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .about-banner h3 {
        font-size: 36px;
    }
}
.about-banner h3 span {
    font-style: italic;
    font-weight: 400;
    color: #fff;
}

/* about-team */

.about-team {
    padding: 172px 24px;
    display: flex;
    flex-direction: column;
    gap: 88px;
    background: #000;
}
@media (max-width: 1024px) {
    .about-team {
        padding: 148px 24px;
        gap: 64px;
    }
}
@media (max-width: 568px) {
    .about-team {
        padding: 100px 12px;
        gap: 48px;
    }
}
.about-team h2 {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    color: #fff;
}
@media (max-width: 1024px) {
    .about-team h2 {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .about-team h2 {
        font-size: 36px;
    }
}
.about-team h2 span {
    font-style: italic;
    font-weight: 400;
    color: #fff;
}
.team-list {
    display: grid;
    grid-template-columns: calc(395px*2 + 32px) 1fr;
    gap: 64px;
}
@media (max-width: 1024px) {
    .team-list {
        display: flex;
        flex-direction: column;
    }
}
.team-list .left {
    display: grid;
    grid-template-columns: repeat(2, 395px);
    column-gap: 32px;
    row-gap: 40px;
}
@media (max-width: 1024px) {
    .team-list .left {
        display: flex;
        flex-direction: column;
        gap: 32px;
    }
}
@media (max-width: 568px) {
    .team-list .left {
        gap: 20px;
    }
}
.team-item {
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 12px;
    padding: 20px;
    aspect-ratio: 395/486;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 30px;
    position: relative;

    width: 395px;
    height: 486px;

    transition: .3s ease;

    cursor: pointer;
}
@media (max-width: 1024px) {
    .team-item {
        width: 100%;
        height: 582px;
    }
}
@media (max-width: 568px) {
    .team-item {
        height: 467px;
    }
}
.team-item:hover {
    border: 1px solid rgba(255, 255, 255, 0.4);
    background: rgba(255, 255, 255, 0.05);
}
.team-item .live {
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 67px;
    height: 34px;
    background: rgba(255, 255, 255, 0.1);
    position: absolute;
    top: 20px;
    left: 20px;
    font-size: 13px;
    line-height: 135%;
    letter-spacing: 0.01em;
    text-align: center;
    color: rgba(255, 255, 255, 0.7);
}
.team-item .img {
    width: 224px;
    height: 223px;
    overflow: hidden;
}
@media (max-width: 1024px) {
    .team-item .img {
        width: 320px;
        height: 320px;
    }
}
@media (max-width: 568px) {
    .team-item .img {
        width: 224px;
        height: 223px;
    }
}
.team-item .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.team-item .info {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    padding: 32px 32px 12px;
}
@media (max-width: 568px) {
    .team-item .info {
        padding-top: 20px;
    }
}
.team-item .info p {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    text-align: center;
    color: #fff;
}
@media (max-width: 568px) {
    .team-item .info p {
        font-size: 20px;
    }
}
.team-item .info span {
    font-size: 13px;
    line-height: 135%;
    letter-spacing: 0.01em;
    text-align: center;
    color: rgba(255, 255, 255, 0.7);
}
.team-item-link {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
}
@media (max-width: 1024px) {
    .team-item-link {
        height: 104px;
        flex-direction: row;
        align-items: center;
        gap: 32px;
    }
    .team-item-link svg {
        width: 40px;
        height: 40px;
        min-width: 40px;
    }
}
@media (max-width: 568px) {
    .team-item-link {
        height: 112px;
    }
}
.team-item-link p {
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    color: #fff;
}
@media (max-width: 1024px) {
    .team-item-link p {
        font-size: 20px;
    }
    .team-item-link p br {
        display: none;
    }
}
@media (max-width: 568px) {
    .team-item-link p {
        font-size: 16px;
    }
}
.about-team .right {

}
@media (max-width: 568px) {
    .about-team .right {
        margin-top: -20px;
        transition: .7s ease;
        max-height: 1000px;
    }
    .about-team .right:not(.mobile-right) {
        max-height: 0;
    }
}
.about-team .right .item {
    position: sticky;
    display: flex;
    flex-direction: column;
    gap: 24px;
    top: 24px;
    opacity: 0;
    pointer-events: none;
    max-height: 0;
    transition: .7s ease;
}
@media (max-width: 1024px) {
    .about-team .right .item {
        flex-direction: row;
        position: relative;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 32px;
    }
}
@media (max-width: 568px) {
    .about-team .right .item {
        grid-template-columns: 1fr;
        padding-bottom: 20px;
    }
}
.about-team .right .item > div:not(.img) {
    display: flex;
    flex-direction: column;
    gap: 24px;
    top: 24px;
}
.about-team .right.mobile-right .item,
.about-team .right .item.show {
    opacity: 1;
    pointer-events: all;
    max-height: 1000px;
}

.about-team .right .item .close {
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
}
@media (max-width: 568px) {
    .about-team .right .item .close {
        top: 12px;
        right: 12px;
    }
}
.about-team .right .item .img {
    border-radius: 12px;
    width: 368px;
    height: 560px;
    overflow: hidden;
    margin-bottom: calc(32px - 24px);
    max-height: 0;
    transition: .7s ease;
}
.about-team .right.mobile-right .item .img,
.about-team .right .item.show .img {
    max-height: 560px;
}
@media (max-width: 1024px) {
    .about-team .right.mobile-right .item .img,
    .about-team .right .item.show .img {
        min-width: 366px;
        max-height: 580px;
    }
}
@media (max-width: 568px) {
    .about-team .right.mobile-right .item .img,
    .about-team .right .item.show .img {
        min-width: 100%;
        max-height: 506px;
    }
}
.about-team .right .item .img img,
.about-team .right .item .img video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
}
.about-team .right .item .name {
    font-weight: 500;
    font-size: 40px;
    line-height: 110%;
    color: #fff;
}
@media (max-width: 1024px) {
    .about-team .right .item .name {
        font-size: 32px;
    }
}
@media (max-width: 568px) {
    .about-team .right .item .name {
        font-size: 20px;
    }
}
.about-team .right .item .txt {
    line-height: 148%;
    color: rgba(255, 255, 255, 0.7);
}
@media (max-width: 568px) {
    .about-team .right .item .txt {
        font-size: 14px;
    }
}
.about-team .right .item .info {
    display: flex;
    flex-direction: column;
    margin-top: calc(64px - 24px);
}
@media (max-width: 1024px) {
    .about-team .right .item .info {
        margin-top: calc(48px - 24px);
    }
}
@media (max-width: 1024568) {
    .about-team .right .item .info {
        margin-top: calc(48px - 24px);
    }
}
.about-team .right .item .info span {
    line-height: 148%;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 32px;
}
@media (max-width: 1024px) {
    .about-team .right .item .info span {
        margin-bottom: 20px;
    }
}
@media (max-width: 568px) {
    .about-team .right .item .info span {
        margin-bottom: 12px;
    }
}
.about-team .right .item .info a {
    font-weight: 500;
    line-height: 148%;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    border-bottom: 1px solid rgba(255, 255, 255, 0);
    padding: 12px 0px;
    transition: .3s ease;
}
.about-team .right .item .info a:hover {
    border-bottom: 1px solid #fff;
}



/* about-talk */

.main-step.about-talk {
    position: relative;
    background: #ffffff;

}

.main-step.about-talk { position: relative; overflow: hidden; }
.home-page-about-imgs {
    position: absolute; inset: 0; pointer-events: none; z-index: 5;
}
.home-page-about-img-ctn {
    position: absolute;
    width: 292px; height: 168px; border-radius: 12px; overflow: hidden;
    transform: translate(0,0) scale(0.4);
    opacity: 0;
    transition: transform 1s linear, opacity 0.3s ease-out;
}
.home-page-about-img-ctn img {
    width: 100%; height: 100%; object-fit: cover;
}




/* page-blog */

.page-blog {
    background: #000;
}

/* blog-top */

.blog-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 48px;
    padding: 80px 24px;
}
@media (max-width: 1024px) {
    .blog-top {
        flex-direction: column;
        align-items: flex-start;
        gap: 32px;
    }
}
@media (max-width: 568px) {
    .blog-top {
        padding: 64px 12px;
    }
}
.blog-top h1 {
    font-weight: 500;
    font-size: 195px;
    line-height: 100%;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    color: #fff;
}
@media (max-width: 1024px) {
    .blog-top h1 {
        font-size: 150px;
    }
}
@media (max-width: 568px) {
    .blog-top h1 {
        font-size: 80px;
    }
}
.blog-top p {
    line-height: 148%;
    color: rgba(255, 255, 255, 0.7);
    max-width: 324px;
}
@media (max-width: 1024px) {
    .blog-top p {
        max-width: 540px;
    }
}
@media (max-width: 568px) {
    .blog-top p {
        font-size: 14px;
    }
}

/* blog-slider */

.blog-slider {
    padding: 0px 24px 120px;
    overflow: hidden;
}
@media (max-width: 1024px) {
    .blog-slider {
        padding: 0px 24px 100px;
    }
}
@media (max-width: 568px) {
    .blog-slider {
        padding: 0px 12px 80px;
    }
}

.blog-slider .swiper-container {
    width: 100%;
}

.blog-slider .swiper-wrapper {
    height: auto;
}

.blog-slider .swiper-slide {
    aspect-ratio: 1137/648;
    width: 1137px;
    height: 648px;
    background: transparent;
}
@media (max-width: 1024px) {
    .blog-slider .swiper-slide {
        aspect-ratio: auto;
        height: auto;
    }
}
@media (max-width: 568px) {
    .blog-slider .swiper-slide {

    }
}

.blog-card {
    display: flex;
    height: 100%;
    overflow: hidden;
    transition: transform 0.3s ease;
}
@media (max-width: 1024px) {
    .blog-card {
        flex-direction: column;
        gap: 40px;
    }
}
@media (max-width: 568px) {
    .blog-card {
        gap: 32px;
    }
}

.blog-card:hover {

}

.blog-image {
    border-radius: 12px;
    overflow: hidden;
    aspect-ratio: 680/648;
}
@media (max-width: 1024px) {
    .blog-image {
        aspect-ratio: 728/600;
    }
}
@media (max-width: 568px) {
    .blog-image {
        aspect-ratio: 366/300;
    }
}

.blog-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.3s ease;
}

.blog-card:hover .blog-image img {
    transform: scale(1.05);
}

.blog-content {
    flex: 1;
    padding: 0 40px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 32px;
    color: #fff;
}
@media (max-width: 1024px) {
    .blog-content {
        padding: 0;
    }
}
@media (max-width: 568px) {
    .blog-content {

    }
}

.blog-content .info {
    display: flex;
    flex-direction: column;
    gap: 44px;
}
@media (max-width: 1024px) {
    .blog-content .info {
        gap: 32px;
    }
}

.blog-meta {
    display: flex;
    gap: 16px;
    align-items: center;
}

.blog-category {
    border-radius: 8px;
    padding: 8px 10px;
    background: rgba(255, 255, 255, 0.1);
    opacity: 0.8;
    font-size: 12px;
    line-height: 135%;
    text-align: center;
    color: #fff;
}

.blog-date {
    font-size: 13px;
    line-height: 148%;
    color: rgba(255, 255, 255, 0.7);
}

.blog-title {
    font-weight: 500;
    font-size: 40px;
    line-height: 110%;
    color: #fff;
}
@media (max-width: 1024px) {
    .blog-title {
        font-size: 32px;
    }
}
@media (max-width: 568px) {
    .blog-title {
        font-size: 20px;
    }
}

.blog-excerpt {
    line-height: 148%;
    color: rgba(255, 255, 255, 0.7);
}
@media (max-width: 568px) {
    .blog-excerpt {
        font-size: 14px;
    }
}

.read-more-btn {
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 114px;
    height: 52px;
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #fff;
    position: relative;
    z-index: 1;
    overflow: hidden;
    transition: .3s ease;
}
.read-more-btn:after {
    content: '';
    background: #ffffff;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    pointer-events: none;
    transform: translate(0px, 100%);
    transition: .3s ease;
}
.read-more-btn:hover {
    border: 1px solid rgba(255, 255, 255, 1);
    color: #000;
}
.read-more-btn:hover:after {
    transform: translate(0px, 0%);
}

/* Swiper navigation */

.blog-slider .navigation {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    padding: 0px 0px 12px;
    margin-bottom: 32px;
}
.blog-slider .navigation .arows {
    display: flex;
    align-items: center;
    gap: 12px;
}


.blog-slider .swiper-button-next,
.blog-slider .swiper-button-prev {
    width: 24px;
    height: 24px;
    position: initial;
    margin: 0;
}

.blog-slider .swiper-button-next:hover,
.blog-slider .swiper-button-prev:hover {

}

.blog-slider .swiper-button-next::after,
.blog-slider .swiper-button-prev::after {
    display: none;
}

/* Swiper pagination */
.blog-slider .number {
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 16px;
}

.blog-slider .number p {
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #fff;
    white-space: nowrap;
}

.blog-slider .swiper-pagination {
    position: initial;
    margin: 0;
    color: rgba(255, 255, 255, 0.4);
    font-size: 16px;
    font-weight: 500;
    display: flex;
    align-items: center;
}

.blog-slider .swiper-pagination .swiper-pagination-current,
.blog-slider .swiper-pagination .swiper-pagination-total {
    display: inline-block;
    color: rgba(255, 255, 255, 0.4);
}

.blog-slider .swiper-pagination .swiper-pagination-current {
    margin-right: 4px;
    color: rgba(255, 255, 255, 1);
}

.blog-slider .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    background: rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    margin: 0 6px;
    transition: all 0.3s ease;
}

.blog-slider .swiper-pagination-bullet-active {
    background: #fff;
    transform: scale(1.2);
}



/* blog-grid */

.blog-grid {
    background: #ffffff;
    padding: 120px 0px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 64px;
}
@media (max-width: 1024px) {
    .blog-grid {
        padding: 100px 0px;
        gap: 40px;
    }
}
@media (max-width: 568px) {
    .blog-grid {
        padding: 80px 0px;
        gap: 32px;
    }
}
.blog-grid .blog-filter {

}
.blog-filter {
    width: 100%;
    /*padding: 0 24px;*/
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0px;
    overflow-x: auto;
    max-width: 100vw;
}
.blog-filter::-webkit-scrollbar {
    display: none;
}
@media (max-width: 568px) {
    .blog-filter {
        /*padding: 0 12px;*/
    }
}

.blog-filter .filter-controls {
    display: flex;
    justify-content: center;
    gap: 24px;
}

.blog-filter .filter-btn {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    text-align: center;
    color: #000;
}
@media (max-width: 1024px) {
    .blog-filter .filter-btn {
        font-size: 20px;
    }
}
.blog-filter .filter-btn svg {
    transition: .3s ease;
    rotate: 180deg;
}
.blog-filter .filter-btn.active svg {
    rotate: 0deg;
}

.blog-filter .filter-panels {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    height: 0px;
    overflow: hidden;
    transition: .7s ease;
}
.blog-filter .filter-panels:has(.active) {
    height: 48px;
    margin-top: 40px;
}

/* Базовые стили для панелей */
.blog-filter .panel {
    position: absolute;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    opacity: 0;
    pointer-events: none;
    /*transform: translateX(20px);*/
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
    padding: 0 24px;
}
@media (max-width: 568px) {
    .blog-filter .panel {
        justify-content: flex-start;
        overflow-x: auto;
        max-width: 100vw;
        padding: 0 12px;
    }
}
.blog-filter .panel::-webkit-scrollbar {
    display: none;
}
.blog-filter .filter-panels .panel {
    /*transform: translateX(20px);*/
}

/* Панель «Type» появляется слева */
.blog-filter .filter-panels:has(.panel-services.active) .panel-type.first {
    transform: translateX(-20px);
}
.blog-filter .filter-panels:has(.panel-type.active) .panel-services.second {
    transform: translateX(-20px);
}

/* Активная панель */
.blog-filter .panel.active {
    opacity: 1;
    pointer-events: all;
    transform: translateX(0);
}

.blog-filter .panel button {
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 40px;
    padding: 0px 20px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #000;
    width: fit-content;
    min-width: fit-content;
    white-space: nowrap;
    position: relative;
    z-index: 1;
    overflow: hidden;
    transition: .3s ease;
}
.blog-filter .panel button:after {
    content: '';
    background: #000000;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    pointer-events: none;
    transform: translate(0px, 100%);
    transition: .3s ease;
}
.blog-filter .panel button:hover {
    color: #fff;
}
.blog-filter .panel button:hover:after {
    transform: translate(0px, 0%);
}

.blog-filter .panel button.selected {
    background: #000;
    color: #fff;
}

.blog-grid .grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 32px;
    row-gap: 120px;
    padding: 0 24px;
}
@media (max-width: 1024px) {
    .blog-grid .grid {
        grid-template-columns: repeat(2, 1fr);
        column-gap: 20px;
        row-gap: 64px;
    }
}
@media (max-width: 568px) {
    .blog-grid .grid {
        grid-template-columns: repeat(1, 1fr);
        gap: 48px;
        padding: 0 12px;
    }
}
.blog-item {
    display: flex;
    flex-direction: column;
    gap: 20px;
    height: fit-content;
}
@media (max-width: 1024px) {
    .blog-item {
        gap: 16px;
    }
}
@media (max-width: 568px) {
    .blog-item {
        gap: 12px;
    }
}
.blog-item .img {
    border-radius: 12px;
    overflow: hidden;
    cursor: initial;
}
@media (min-width: 1025px) {
    /* Group 1: items 1, 7, 10 in each 12-item cycle */
    .blog-item:nth-child(12n+1) .img,
    .blog-item:nth-child(12n+7) .img,
    .blog-item:nth-child(12n+10) .img {
        aspect-ratio: 443/364;
    }

    /* Group 2: items 2, 4, 9, 11 in each 12-item cycle */
    .blog-item:nth-child(12n+2) .img,
    .blog-item:nth-child(12n+4) .img,
    .blog-item:nth-child(12n+9) .img,
    .blog-item:nth-child(12n+11) .img {
        aspect-ratio: 442/524;
    }

    /* Group 3: items 3, 5, 6, 8, 12 in each 12-item cycle */
    .blog-item:nth-child(12n+3) .img,
    .blog-item:nth-child(12n+5) .img,
    .blog-item:nth-child(12n+6) .img,
    .blog-item:nth-child(12n+8) .img,
    .blog-item:nth-child(12n+12) .img {
        aspect-ratio: 443/304;
    }
}
@media (max-width: 1024px) {
    .blog-item .img {
        aspect-ratio: 354/369;
    }
}


.blog-item .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: 0.3s ease;
    cursor: default;
}
.blog-item:hover .img img {
    transform: scale(1.05);
}
.blog-item .meta {
    display: flex;
    align-items: center;
    gap: 16px;
}
.blog-item .meta .blog-category {
    border-radius: 8px;
    padding: 8px 10px;
    background: rgba(0, 0, 0, 0.1);
    opacity: 0.8;
    font-size: 12px;
    line-height: 135%;
    text-align: center;
    color: #000;
}
.blog-item .meta .blog-date {
    font-size: 13px;
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);
}
.blog-item .blog-title {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    color: #000;
}
@media (max-width: 1024px) {
    .blog-item .blog-title {
        font-size: 20px;
    }
}
@media (max-width: 568px) {
    .blog-item .blog-title {
        font-size: 16px;
    }
}
.blog-grid .pagination {
    margin-top: calc(120px - 64px);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 44px;
    width: 100%;
}
.blog-grid .pagination .more {
    width: 100%;
    padding: 40px 40px 32px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
    border-top: 1px solid rgba(0, 0, 0, 0.2);
    font-style: italic;
    font-size: 44px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
    color: #000;
    transition: .3s ease;
}
@media (max-width: 1024px) {
    .blog-grid .pagination .more {
        padding: 32px 10px 24px;
        font-size: 40px;
    }
}
@media (max-width: 568px) {
    .blog-grid .pagination .more {
        padding: 24px 10px 16px;
        font-size: 24px;
    }
}
.blog-grid .pagination .more:hover {
    border-bottom: 1px solid rgba(0, 0, 0, 1);
    border-top: 1px solid rgba(0, 0, 0, 1);
}
.blog-grid .pagination .page-number {
    display: flex;
    align-items: center;
    gap: 20px;
}
.blog-grid .pagination .page-number a {
    transition: .3s ease;
}
.blog-grid .pagination .page-number .number {
    display: flex;
    align-items: center;
    gap: 8px;
}
.blog-grid .pagination .page-number .number * {
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 28px;
    font-weight: 500;
    font-size: 16px;
    line-height: 148%;
    letter-spacing: 0.01em;
    color: #000;
}
.blog-grid .pagination .page-number .number *.active,
.blog-grid .pagination .page-number a:hover,
.blog-grid .pagination .page-number .number *:hover {
    background: #e8e8e8;
}

/* page-article */

.page-article {
    background: #000000;
    padding-top: 210px;
}
@media (max-width: 1024px) {
    .page-article {
        padding-top: 150px;
    }
}
@media (max-width: 568px) {
    .page-article {
        padding-top: 130px;
    }
}

/* article-meta */

.article-meta {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 0 24px;
}
@media (max-width: 568px) {
    .article-meta {
        padding: 0 12px;
    }
}
.article-meta .blog-category {
    border-radius: 8px;
    padding: 8px 10px;
    background: rgba(255, 255, 255, 0.1);
    opacity: 0.8;
    font-size: 12px;
    line-height: 135%;
    text-align: center;
    color: #fff;
}
.article-meta .blog-time {
    display: flex;
    align-items: center;
    gap: 4px;
    border-radius: 8px;
    padding: 8px 10px;
    background: rgba(255, 255, 255, 0.1);
    opacity: 0.8;
    font-size: 12px;
    line-height: 135%;
    text-align: center;
    color: #fff;
}
.article-meta .blog-date {
    font-size: 13px;
    line-height: 148%;
    color: rgba(255, 255, 255, 0.7);
}

/* article-title-top */

.article-title-top {
    max-width: 1045px;
    padding: 40px 24px;
}
@media (max-width: 568px) {
    .article-title-top {
        padding: 40px 12px;
    }
}
.article-title-top h1 {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    color: #fff;
}
@media (max-width: 1024px) {
    .article-title-top h1 {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .article-title-top h1 {
        font-size: 36px;
    }
}
.article-title-top h1 span {
    font-style: italic;
    font-weight: 400;
    color: #fff;
}

/* article-img-top */

.article-img-top {
    aspect-ratio: 1440/680;
    overflow: hidden;
}
.article-img-top img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

/* article-content */

.article-content {
    background: #ffffff;
    padding-bottom: 44px;
}
.article-content .article-txt {
    padding: 80px 24px;
    max-width: 1272px;
}
@media (max-width: 1024px) {
    .article-content .article-txt {
        padding: 64px 24px;
    }
}
@media (max-width: 568px) {
    .article-content .article-txt {
        padding: 48px 12px;
    }
}
.article-content .article-txt p {
    font-weight: 500;
    font-size: 40px;
    line-height: 110%;
    color: #000;
}
@media (max-width: 1024px) {
    .article-content .article-txt p {
        font-size: 32px;
        line-height: 120%;
    }
}
@media (max-width: 568px) {
    .article-content .article-txt p {
        font-size: 20px;
    }
}
.article-content .article-txt_img {
    padding: 0 24px;
    padding-top: calc(120px - 80px);
    padding-bottom: calc(172px/2);
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
}
@media (max-width: 1024px) {
    .article-content .article-txt_img {
        display: flex;
        flex-direction: column-reverse;
        padding-top: calc(100px - 64px);
        gap: 100px;
    }
}
@media (max-width: 568px) {
    .article-content .article-txt_img {
        padding: 0 12px;
        padding-top: calc(64px - 48px);
        padding-bottom: calc(172px/2);
        flex-direction: column;
        gap: 64px;
    }
}
.article-content .article-txt_img .txt {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    gap: 24px;
}
@media (max-width: 1024px) {
    .article-content .article-txt_img .txt {
        align-items: flex-start;
    }
}
.article-content .article-txt_img .txt span {
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);
    width: 100%;
    max-width: 560px;
    padding-right: 40px;
}
@media (max-width: 1024px) {
    .article-content .article-txt_img .txt span {
        max-width: 100%;
        padding: 0;
    }
}
@media (max-width: 568px) {
    .article-content .article-txt_img .txt span {
        font-size: 14px;
    }
}
.article-content .article-txt_img .txt p {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    color: #000;
    width: 100%;
    max-width: 560px;
    padding-right: 40px;
}
@media (max-width: 1024px) {
    .article-content .article-txt_img .txt p {
        font-size: 20px;
        max-width: 100%;
        padding: 0;
    }
}
@media (max-width: 568px) {
    .article-content .article-txt_img .txt p {
        font-size: 16px;
    }
}
.article-content .article-txt_img .img {
    border-radius: 12px;
    aspect-ratio: 680/882;
    overflow: hidden;
}
.article-content .article-txt_img .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.article-content .article-img {
    aspect-ratio: 1440/856;
    overflow: hidden;
}
@media (max-width: 1024px) {
    .article-content .article-img {
        aspect-ratio: 768/582;
    }
}
@media (max-width: 568px) {
    .article-content .article-img {
        aspect-ratio: 390/350;
    }
}
.article-content .article-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.article-content .article-img_list {

}
.article-content .article-title {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 120px;
    background: #000;
    padding: 120px 0px;
}
@media (max-width: 1024px) {
    .article-content .article-title {
        padding: 100px 0px;
        gap: 100px;
    }
}
@media (max-width: 568px) {
    .article-content .article-title {
        padding: 40px 0px;
        gap: 64px;
    }
}
.article-content .article-title > span {
    line-height: 148%;
    text-align: center;
    color: rgba(255, 255, 255, 0.4);
    max-width: 314px;
}
@media (max-width: 568px) {
    .article-content .article-title > span {
        font-size: 14px;
    }
}
.article-content .article-title h2 {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
    color: #fff;
    max-width: 1248px;
}
@media (max-width: 1024px) {
    .article-content .article-title h2 {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .article-content .article-title h2 {
        font-size: 36px;
    }
}
.article-content .article-title h2 span {
    font-style: italic;
    font-weight: 400;
    color: #fff;
}
.article-img_slider {
    padding: 120px 24px;
    overflow: hidden;
    background: #000;
}
@media (max-width: 1024px) {
    .article-img_slider {

    }
}
@media (max-width: 568px) {
    .article-img_slider {
        padding: 100px 12px;
    }
}
.article-img_slider .swiper-wrapper {
    height: fit-content;
}
.article-img_slider .swiper-slide {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
@media (max-width: 1024px) {
    .article-img_slider .swiper-slide:not(.swiper-slide-active) {
        opacity: 0.35;
    }
}
.article-img_slider .swiper-slide .img {
    border-radius: 12px;
    aspect-ratio: 443/523;
    overflow: hidden;
}
.article-img_slider .swiper-slide .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.article-img_slider .swiper-slide p {
    font-size: 13px;
    line-height: 135%;
    color: rgba(255, 255, 255, 0.7);
    opacity: 0;
    pointer-events: none;
    transition: .3s ease;
}
.article-img_slider .swiper-slide-active p {
    opacity: 1;
    pointer-events: all;
}
.article-img_slider .navigation {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 16px;
    margin-top: 32px;
}
.article-img_slider .navigation .arows {
    display: flex;
    align-items: center;
    gap: 20px;
}
.article-img_slider .swiper-button-next,
.article-img_slider .swiper-button-prev {
    /*width: 24px;*/
    height: 24px;
    position: initial;
    margin: 0;
    color: #fff;
}

.article-img_slider .swiper-button-next:hover,
.article-img_slider .swiper-button-prev:hover {

}

.article-img_slider .swiper-button-next::after,
.article-img_slider .swiper-button-prev::after {
    display: none;
}

/* Swiper pagination */
.article-img_slider .number {
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 16px;
}

.article-img_slider .number p {
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #fff;
    white-space: nowrap;
}

.article-img_slider .swiper-pagination {
    position: initial;
    margin: 0;
    color: rgba(255, 255, 255, 0.4);
    font-size: 16px;
    font-weight: 500;
    display: flex;
    align-items: center;
}

.article-img_slider .swiper-pagination .swiper-pagination-current,
.article-img_slider .swiper-pagination .swiper-pagination-total {
    display: inline-block;
    color: rgba(255, 255, 255, 0.4);
}

.article-img_slider .swiper-pagination .swiper-pagination-current {
    margin-right: 4px;
    color: rgba(255, 255, 255, 1);
}
.article-content .article-2img_txt {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 80px 24px;
    padding-top: calc(120px - 80px);
}
@media (max-width: 1024px) {
    .article-content .article-2img_txt {
        display: flex;
        flex-direction: column;
        gap: 48px;
        padding-top: calc(100px - 80px);
    }
}
@media (max-width: 568px) {
    .article-content .article-2img_txt {
        gap: 32px;
        padding: 64px 12px;
        padding-top: calc(100px - 80px);
    }
}
.article-content .article-2img_txt .img-2col {
    display: flex;
    gap: 32px;
}
.article-content .article-2img_txt .img-2col .img {
    border-radius: 12px;
    overflow: hidden;
    height: fit-content;
}
.article-content .article-2img_txt .img-2col .img:nth-child(1) {
    aspect-ratio: 408/608;
    width: 60%;
}
.article-content .article-2img_txt .img-2col .img:nth-child(2) {
    aspect-ratio: 240/280;
    width: calc(40% - 32px);
    position: sticky;
    top: 24px;
}
.article-content .article-2img_txt .img-2col .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.article-content .article-2img_txt .txt {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 32px;
    gap: 16px;
}
@media (max-width: 1024px) {
    .article-content .article-2img_txt .txt {
        align-items: flex-start;
        padding: 0;
    }
}
@media (max-width: 568px) {
    .article-content .article-2img_txt .txt {

    }
}
.article-content .article-2img_txt .txt p {
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);
    max-width: 440px;
}
@media (max-width: 1024px) {
    .article-content .article-2img_txt .txt p {
        max-width: 100%;
    }
}
@media (max-width: 568px) {
    .article-content .article-2img_txt .txt p {
        font-size: 14px;
    }
}
.article-content .article-txt2_img {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    padding: 0 24px;
    padding-top: calc(172px - 80px);
}
@media (max-width: 1024px) {
    .article-content .article-txt2_img {
        display: flex;
        flex-direction: column;
        padding-top: calc(100px - 80px);
    }
}
@media (max-width: 568px) {
    .article-content .article-txt2_img {
        padding: 0 12px;
    }
}

.article-content .article-txt2_img .txt {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    gap: 60px;
}
@media (max-width: 1024px) {
    .article-content .article-txt2_img .txt {
        align-items: flex-start;
        gap: 48px;
    }
}
@media (max-width: 568px) {
    .article-content .article-txt2_img .txt {
        gap: 32px;
    }
}
.article-content .article-txt2_img .txt strong {
    font-weight: 500;
    font-size: 40px;
    line-height: 110%;
    color: #000;
    max-width: 520px;
    padding-right: 40px;
}
@media (max-width: 1024px) {
    .article-content .article-txt2_img .txt strong {
        max-width: 100%;
        padding-right: 0px;
        font-size: 32px;
        line-height: 120%;
    }
}
@media (max-width: 568px) {
    .article-content .article-txt2_img .txt strong {
        font-size: 20px;
    }
}
.article-content .article-txt2_img .txt p {
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);
    max-width: 520px;
    padding-right: 40px;
}
@media (max-width: 1024px) {
    .article-content .article-txt2_img .txt p {
        max-width: 100%;
        padding-right: 0px;
    }
}
@media (max-width: 568px) {
    .article-content .article-txt2_img .txt p {
        font-size: 14px;
    }
}
.article-content .article-txt2_img .img {
    border-radius: 12px;
    overflow: hidden;
    aspect-ratio: 680/882;
    height: fit-content;
}
@media (max-width: 1024px) {
    .article-content .article-txt2_img .img {
        aspect-ratio: 728/658;
    }
}
.article-content .article-txt2_img .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.article-content .article-space {
    padding-bottom: calc(120px - 80px);
}

.article-content .article-list {
    display: flex;
    flex-direction: column;
    /*gap: 32px;*/
    padding: 24px;
    position: relative;
}
@media (max-width: 1024px) {
    .article-content .article-list {
        gap: 100px;
        padding-bottom: 148px;
    }
}
@media (max-width: 568px) {
    .article-content .article-list {
        gap: 64px;
        padding: 20px 12px;
        padding-bottom: 100px;

    }
}
.article-content .article-list-item {
    display: flex;
    gap: 84px;
}
@media (max-width: 1024px) {
    .article-content .article-list-item {
        flex-direction: column;
        gap: 32px;
    }
}
.article-content .article-list-item .img {
    aspect-ratio: 628/793;
    width: 628px;
    border-radius: 12px;
    overflow: hidden;
}
@media (max-width: 1024px) {
    .article-content .article-list-item .img {
        aspect-ratio: 728/582;
        border-radius: 8px;
        width: 100%;
    }
}
@media (max-width: 568px) {
    .article-content .article-list-item .img {
        aspect-ratio: 366/350;
    }
}
.article-content .article-list-item .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.article-content .article-list-item .info {
    display: flex;
    flex-direction: column;
    gap: 32px;
    padding-top: 88px;
    padding-bottom: 80px;
    padding-right: 124px;
    width: calc(100% - 628px - 84px);
}
@media (max-width: 1024px) {
    .article-content .article-list-item .info {
        width: 100%;
        gap: 24px;
        padding: 0;
    }
}
.article-content .article-list-item .info .top {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
@media (max-width: 568px) {
    .article-content .article-list-item .info .top {
        gap: 20px;
    }
}
.article-content .article-list-item .info .top span {
    line-height: 148%;
    color: rgba(0, 0, 0, 0.4);
}
@media (max-width: 568px) {
    .article-content .article-list-item .info .top span {
        font-size: 14px;
    }
}
.article-content .article-list-item .info .top h2,
.article-content .article-list-item .info .top h3 {
    font-weight: 500;
    font-size: 40px;
    line-height: 110%;
    color: #000;
}
@media (max-width: 1024px) {
    .article-content .article-list-item .info .top h2,
    .article-content .article-list-item .info .top h3 {
        font-size: 32px;
    }
}
@media (max-width: 568px) {
    .article-content .article-list-item .info .top h2,
    .article-content .article-list-item .info .top h3 {
        font-size: 20px;
        line-height: 120%;
    }
    .article-content .article-list-item .info .top h2 br,
    .article-content .article-list-item .info .top h3 br {
        display: none;
    }
}
.article-content .article-list-item .info .txt {

}
.article-content .article-list-item .info .txt p {
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);
}
@media (max-width: 568px) {
    .article-content .article-list-item .info .txt p {
        font-size: 14px;
    }
}
.article-content .article-list-item .info .txt p a {
    font-weight: 500;
    text-decoration: underline;
    text-decoration-skip-ink: none;
    color: #000;
}
.article-content .article-list-item .info .link {
    display: flex;
    flex-direction: column;
    gap: 32px;
}
@media (max-width: 1024px) {
    .article-content .article-list-item .info .link {
        gap: 20px;
        margin-top: 24px;
    }
}
.article-content .article-list-item .info .link p {
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);
}
@media (max-width: 568px) {
    .article-content .article-list-item .info .link p {
        font-size: 14px;
    }
}
.article-content .article-list-item .info .link .list {
    display: flex;
    flex-direction: column;
}
.article-content .article-list-item .info .link .list a {
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
    padding: 12px 0px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 500;
    line-height: 148%;
    color: #000;
    transition: .3s ease;
}
@media (max-width: 568px) {
    .article-content .article-list-item .info .link .list a {

    }
}
.article-content .article-list-item .info .link .list a:hover {
    border-bottom: 1px solid rgba(0, 0, 0, 1);
}
.article-bottom {
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    padding: 24px 24px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    background: #ffffff;
    padding-bottom: 80px;
}
@media (max-width: 568px) {
    .article-bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
    }
}
.article-bottom .author {
    display: flex;
    align-items: center;
    gap: 12px;
}
.article-bottom .author span {
    line-height: 148%;
    color: rgba(0, 0, 0, 0.4);
}
@media (max-width: 568px) {
    .article-bottom .author span {
        font-size: 14px;
    }
}
.article-bottom .author p {
    line-height: 148%;
    color: #000;
}
@media (max-width: 568px) {
    .article-bottom .author p {
        font-size: 14px;
    }
}
.article-bottom .share {
    display: flex;
    align-items: center;
    gap: 32px;
}
.article-bottom .share span {
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);
}
@media (max-width: 568px) {
    .article-bottom .share span  {
        font-size: 14px;
    }
}
.article-bottom .share .list {
    display: flex;
    align-items: center;
    gap: 12px;
}
.article-bottom .share .list a {
    border-radius: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: rgba(0, 0, 0, 0.05);
}

/* article-more */

.article-more {
    padding: calc(172px - 80px) 24px 172px;
    background: #ffffff;
    overflow: hidden;
}
@media (max-width: 1024px) {
    .article-more {
        padding: calc(148px - 80px) 24px 148px;
    }
}
@media (max-width: 568px) {
    .article-more {
        padding: calc(100px - 80px) 12px 100px;
    }
}
.article-more h2 {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    color: #000;
    margin-bottom: -48px;
}
@media (min-width: 1025px) {
    .article-more h2 br {
        display: none;
    }
}
@media (max-width: 1024px) {
    .article-more h2 {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .article-more h2 {
        font-size: 36px;
        margin-bottom: -38px;
    }
}
.article-more h2 span {
    font-style: italic;
    font-weight: 400;
}
.article-more .swiper-wrapper {
    height: fit-content;
}
.article-more .navigation {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    padding: 0px 0px 12px;
    margin-bottom: 32px;
}
@media (max-width: 1024px) {
    .article-more .navigation {

    }
}
@media (max-width: 568px) {
    .article-more .navigation {

    }
}
.article-more .navigation .arows {
    display: flex;
    align-items: center;
    gap: 12px;
}
.article-more .swiper-button-next,
.article-more .swiper-button-prev {
    width: 24px;
    height: 24px;
    position: initial;
    margin: 0;
}
.article-more .swiper-button-next:hover,
.article-more .swiper-button-prev:hover {

}
.article-more .swiper-button-next::after,
.article-more .swiper-button-prev::after {
    display: none;
}
.article-more .blog-item {

}
.article-more .blog-item img {

}
@media (min-width: 1025px) {
    /* Group 1: items 1, 7, 10 in each 12-item cycle */
    .article-more .blog-item:nth-child(12n+1) .img,
    .article-more .blog-item:nth-child(12n+7) .img,
    .article-more .blog-item:nth-child(12n+10) .img {
        aspect-ratio: 680/610;
    }

    /* Group 2: items 2, 4, 9, 11 in each 12-item cycle */
    .article-more .blog-item:nth-child(12n+2) .img,
    .article-more .blog-item:nth-child(12n+4) .img,
    .article-more .blog-item:nth-child(12n+9) .img,
    .article-more .blog-item:nth-child(12n+11) .img {
        aspect-ratio: 680/441;
    }

    /* Group 3: items 3, 5, 6, 8, 12 in each 12-item cycle */
    .article-more .blog-item:nth-child(12n+3) .img,
    .article-more .blog-item:nth-child(12n+5) .img,
    .article-more .blog-item:nth-child(12n+6) .img,
    .article-more .blog-item:nth-child(12n+8) .img,
    .article-more .blog-item:nth-child(12n+12) .img {
        aspect-ratio: 680/610;
    }
}
@media (max-width: 1024px) {
    .article-more .blog-item img {
        aspect-ratio: 354/369;
    }
}


/* page-contacts */

.page-contacts {
    background: #000000;
}
.contacts-title {
    padding: 88px 24px;
    padding-bottom: 0;
}
@media (max-width: 568px) {
    .contacts-title {
        padding: 88px 12px;
        padding-bottom: 0;
    }
}
.contacts-title h1 {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    color: #fff;
}
@media (max-width: 1024px) {
    .contacts-title h1 {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .contacts-title h1 {
        font-size: 36px;
    }
}
.contacts-title h1 span {
    font-style: italic;
    font-weight: 400;
    color: #fff;
}
.contacts-info {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 64px;
    margin-top: calc(220px - 24px);
    padding: 24px;
}
@media (max-width: 1024px) {
    .contacts-info {
        flex-direction: column;
        align-items: flex-start;
        gap: 40px;
        padding-bottom: 42px;
        margin-top: calc(148px - 24px);
    }
}
@media (max-width: 568px) {
    .contacts-info {
        margin-top: calc(100px - 24px);
        padding: 24px 12px;
    }
}
.contacts-info .left {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.contacts-info .left a {
    font-weight: 500;
    font-size: 24px;
    line-height: 110%;
    color: #fff;
    position: relative;
}
@media (max-width: 1024px) {
    .contacts-info .left a {
        font-size: 20px;
        line-height: 130%;
    }
}
@media (max-width: 568px) {
    .contacts-info .left a {
        font-size: 13px;
        line-height: 120%;
    }
}
.contacts-info .left a:hover {

}
.contacts-info .right {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.contacts-info .right span {
    line-height: 148%;
    color: rgba(255, 255, 255, 0.4);
}
@media (max-width: 568px) {
    .contacts-info .right span {
        font-size: 14px;
    }
}
.contacts-info .right .list {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.contacts-info .right .list a {
    line-height: 148%;
    color: #fff;
    position: relative;
    /*transition: .3s ease margin-bottom 0s;*/
}
@media (max-width: 568px) {
    .contacts-info .right .list a {
        font-size: 14px;
    }
}
.contacts-info .right .list a:hover {
    /*padding: 0px 0px 2px;*/
    /*border-bottom: 1px solid #fff;*/
    /*margin-bottom: -3px;*/
}
.contacts-img {
    height: 100%;
    aspect-ratio: 1440/1068;
    overflow: hidden;
}
@media (max-width: 1024px) {
    .contacts-img {
        aspect-ratio: 768/582;
    }
}
@media (max-width: 568px) {
    .contacts-img {
        aspect-ratio: 390/425;
    }
}
.contacts-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

/* page-404 */

.page-404 {
    background: #000;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    gap: 80px;
    height: 100dvh;
    padding-top: 120px;
}
@media (max-width: 1024px) {
    .page-404 {
        padding-top: 220px;
        padding-bottom: 148px;
    }
}
@media (max-width: 568px) {
    .page-404 {
        padding-top: 150px;
        padding-bottom: 100px;
    }
}
.page-404 .txt {
    max-width: 540px;
}
@media (max-width: 1024px) {
    .page-404 .txt {
        max-width: 442px;
    }
}
@media (max-width: 568px) {
    .page-404 .txt {
        max-width: 248px;
    }
}
.page-404 .txt p {
    font-weight: 500;
    font-size: 40px;
    line-height: 110%;
    text-transform: uppercase;
    text-align: center;
    color: #fff;
}
@media (max-width: 1024px) {
    .page-404 .txt p {
        font-size: 32px;
        line-height: 120%;
    }
}
@media (max-width: 568px) {
    .page-404 .txt p {
        font-size: 20px;
    }
}
.page-404 .img {
    border-radius: 12px;
    width: 368px;
    height: 242px;
}
@media (max-width: 1024px) {
    .page-404 .img {
        border-radius: 8px;
    }
}
@media (max-width: 568px) {
    .page-404 .img {
        width: 270px;
        height: 178px;
    }
}
.page-404 .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.page-404 .img video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.page-404 .link {
    width: 100%;
    display: flex;
    justify-content: center;
}
.page-404 .link a {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 32px;

    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding: 40px 10px 32px;
    font-style: italic;
    font-weight: 400;
    font-size: 44px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
    color: #fff;
    transition: .3s ease;
}
@media (max-width: 1024px) {
    .page-404 .link a {
        padding: 32px 10px 24px;
        font-size: 40px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    }
}
@media (max-width: 568px) {
    .page-404 .link a {
        font-size: 24px;
        padding: 24px 10px 16px;
    }
    .page-404 .link a svg {
        width: 40px;
        height: 40px;
    }
}
.page-404 .link a:hover {
    border-top: 1px solid rgba(255, 255, 255, 1);
}
@media (max-width: 1024px) {
    .page-404 .link a:hover {
        border-bottom: 1px solid rgba(255, 255, 255, 1);
        border-top: 1px solid rgba(255, 255, 255, 1);
    }
}

/* page-text */

.page-text {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 88px;
    padding-left: 24px;
    padding-right: 24px;
    padding-bottom: 172px;
    padding-top: 160px;
}
@media (max-width: 1024px) {
    .page-text {
        gap: 64px;
        padding-bottom: 148px;
    }
}
@media (max-width: 568px) {
    .page-text {
        gap: 44px;
        padding-bottom: 100px;
        padding-top: 130px;
    }
}
.page-text .title {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 64px;
}
@media (max-width: 1024px) {
    .page-text .title {

    }
}
@media (max-width: 568px) {
    .page-text .title {
        gap: 48px;
    }
}
.page-text .title span {
    line-height: 148%;
    text-align: center;
    color: rgba(0, 0, 0, 0.7);
}
@media (max-width: 1024px) {
    .page-text .title span {

    }
}
@media (max-width: 568px) {
    .page-text .title span {
        font-size: 14px;
    }
}
.page-text .title h1 {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
}
@media (max-width: 1024px) {
    .page-text .title h1 {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .page-text .title h1 {
        font-size: 36px;
    }
}
.page-text .text-block {
    display: flex;
    flex-direction: column;
    gap: 64px;
    max-width: 918px;

}
@media (max-width: 1024px) {
    .page-text .text-block {
        gap: 44px;
    }
}
@media (max-width: 568px) {
    .page-text .text-block {
    }
}
.page-text .text-block .txt {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
@media (max-width: 1024px) {
    .page-text .text-block .txt {

    }
}
@media (max-width: 568px) {
    .page-text .text-block .txt {
        gap: 14px;
    }
}
.page-text .text-block .txt h2 {
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    color: #000;
    padding-left: 12px;
    padding-bottom: calc(24px - 16px);
}
@media (max-width: 1024px) {
    .page-text .text-block .txt h2 {
        font-size: 20px;
        padding-left: 10px;
    }
}
@media (max-width: 568px) {
    .page-text .text-block .txt h2 {
        font-size: 16px;
        padding-bottom: calc(20px - 14px);
        padding-left: 8px;
    }
}
.page-text .text-block .txt p {
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);
}
@media (max-width: 1024px) {
    .page-text .text-block .txt p {

    }
}
@media (max-width: 568px) {
    .page-text .text-block .txt p {
        font-size: 14px;
    }
}
.page-text .text-block .txt p a {
    font-weight: 500;
    text-decoration: underline;
    text-decoration-skip-ink: none;
    color: #000;
}
.page-text .text-block .txt ul {
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);
}
@media (max-width: 1024px) {

}
@media (max-width: 568px) {

}
.page-text .text-block .txt ul li {
    line-height: 148%;
    color: rgba(0, 0, 0, 0.7);
}
@media (max-width: 1024px) {

}
@media (max-width: 568px) {

}

/* .main-case-2 */


/* brief */

body:has(.page-brief) {
    background: #000;
}

.page-brief {
    background: #000;
    min-height: 100dvh;
}
.brief {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 24px;
    padding-top: 32px;
    position: relative;
}
@media (max-width: 1024px) {
    .brief {
        display: flex;
        flex-direction: column;
        gap: 64px;
    }
}
@media (max-width: 568px) {
    .brief {
        gap: 48px;
        padding: 12px;
        padding-top: 32px;
    }
}
.brief .left {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    gap: 64px;
}
.brief .left .title {
    display: flex;
    flex-direction: column;
    gap: 44px;
}
@media (max-width: 1024px) {
    .brief .left .title {

    }
}
@media (max-width: 568px) {
    .brief .left .title {
        gap: 32px;
    }
}
.brief .left .title h1 {
    font-weight: 500;
    font-size: 40px;
    line-height: 110%;
    color: #fff;
}
@media (max-width: 1024px) {
    .brief .left .title h1 {
        font-size: 32px;
        line-height: 120%;
    }
    .brief .left .title h1 br {
        display: none;
    }
}
@media (max-width: 568px) {
    .brief .left .title h1 {
        font-size: 20px;
    }
}
.brief .left .title p {
    display: flex;
    align-items: center;
    gap: 24px;
    line-height: 148%;
    color: rgba(255, 255, 255, 0.7);
}
@media (max-width: 1024px) {
    .brief .left .title p {
        font-size: 14px;
    }
}
@media (max-width: 568px) {
    .brief .left .title p {

    }
}
.brief .left .title p a {
    display: flex;
    align-items: center;
    gap: 4px;
    line-height: 135%;
    color: #fff;
}
.brief .left .title p a#book-call-toggle {
    display: flex;
    align-items: center;
    gap: 4px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 40px;
    padding: 0 12px;
    height: 52px;
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #fff;
    position: relative;
    z-index: 1;
    overflow: hidden;
    transition: .3s ease;
}
.brief .left .title p a#book-call-toggle2:after {
    content: '';
    background: #ffffff;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    pointer-events: none;
    transform: translate(0px, 100%);
    transition: .3s ease;
}
.brief .left .title p a#book-call-toggle:hover {
    border: 1px solid rgba(255, 255, 255, 1);
    /*color: #000;*/
}
.brief .left .title p a#book-call-toggle2:hover:after {
    transform: translate(0px, 0%);
}
.brief .left .title p a svg {
    transition: .5s ease;
    width: 28px;
    height: 28px;
    min-height: 28px;
    overflow: hidden;
}
@media (max-width: 568px) {
    .brief .left .title p a svg {
        width: 20px;
        height: 20px;
    }
}
.brief .left .title p a span {
    display: flex;
    flex-direction: column;
    width: 28px;
    height: 28px;
    overflow: hidden;
}
.brief .left .title p a span svg:nth-child(2) {
    transform: translateY(-28px);
}
.brief .left .title p a span svg:nth-child(1) {
    /*height: 0px;*/
    transform: translateY(-28px);
}
.brief .left .title p a span svg:nth-child(1) path {
    /*stroke: #000000;*/
}
.brief .left .title p a:hover span svg:nth-child(2) {
    /*height: 0px;*/
    transform: translateY(0px);
}
.brief .left .title p a:hover span svg:nth-child(1) {
    transform: translateY(0px)
}


.brief .right {
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 12px;
    padding: 40px;
    background: rgba(255, 255, 255, 0.05);
    position: relative;
}
@media (max-width: 568px) {
    .brief .right {
        padding: 20px;
    }
}
.brief .right form {
    display: flex;
    flex-direction: column;
    gap: 36px;
}

.brief .video {
    position: fixed;
    z-index: 99;
    left: 24px;
    bottom: 24px;
    border-radius: 12px;
    width: 394px;
    height: 260px;
    overflow: hidden;
    transition: 1s;
}
@media (max-width: 1024px) {
    .brief .video {
        position: initial;
        width: 100%;
        height: auto;
        aspect-ratio: 728/460;
    }
}
@media (max-width: 568px) {
    .brief .video {
        aspect-ratio: 366/260;
    }
}
.brief .video.show {
    left: 0px;
    bottom: 0px;
    border-radius: 0px;
    width: 100%;
    height: 100%;
}
html:has(.brief .video.show) {
    overflow: hidden;
}
.brief .video img,
.brief .video video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.thanks {
    display: none;
    font-weight: 500;
    font-size: 24px;
    line-height: 130%;
    text-align: center;
    color: #fff;
    position: absolute;
    z-index: 1;
    top: 0;
    width: calc(100% - 40px*2);
    height: 100%;

    align-items: center;
    justify-content: center;
    background: rgb(13 13 13);
}
.thanks.show {
    display: flex;
}

/* cookie */

.cookie {
    position: fixed;
    bottom: 24px;
    left: 12px;
    right: 12px;
    margin: auto;
    border: 1px solid rgba(0, 0, 0, 0.05);
    border-radius: 12px;
    padding: 32px;
    width: 100%;
    max-width: 559px;
    height: 118px;
    backdrop-filter: blur(20px);
    background: #eaeaeb;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    z-index: 99;

    display: none;
}
@media (max-width: 568px) {
    .cookie {
        border: 1px solid rgba(0, 0, 0, 0.05);
        border-radius: 8px;
        padding: 20px;
        width: 241px;
        height: 172px;
        right: auto;
        flex-direction: column;
        gap: 20px;
    }
}
.cookie p {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 13px;
    line-height: 135%;
    letter-spacing: 0.01em;
    color: rgba(0, 0, 0, 0.7);
}
@media (max-width: 568px) {
    .cookie p {
        font-size: 12px;
    }
}
.cookie div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
@media (max-width: 568px) {
    .cookie div {

    }
}
.cookie a.accept {
    border: 1px solid #fff;
    border-radius: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 87px;
    height: 52px;
    background: #fff;
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #000;
}
@media (max-width: 568px) {
    .cookie a.accept {
        width: 87px;
        height: 48px;
    }
}
.cookie a:not(.accept) {
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: rgba(0, 0, 0, 0.4);
    border-bottom: 1px solid rgba(0, 0, 0, 0.4);
    padding: 0px 0px 2px;
}
@media (max-width: 568px) {
    .cookie a:not(.accept) {

    }
}

/**/

body.loading  {
    /*overflow: hidden;*/
}
body:not(.loading)   {
    overflow: visible;
}

body.loading .content  {
    /*opacity: 0;*/
    /*overflow: hidden;*/
}
body:not(.loading) .content  {
    opacity: 1;
    overflow: visible;
    transition: opacity 0.7s;
}

.preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: #000;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    transition:  0.8s ;

    /*display: none;*/
}

.preloader.hide {
    transform: translateY(-100%);
}

.preloader-percent {
    position: absolute;
    bottom: 24px;
    left: 24px;
    font-weight: 500;
    font-size: 195px;
    line-height: 100%;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    color: #fff;
    opacity: 1;
    transition:  0.2s ;
}
@media (max-width: 568px) {
    .preloader-percent {
        font-size: 80px;
    }
}
.preloader.hide .preloader-percent {
    opacity: 0;
}

/**/

.case-slider.article-img_slider .swiper-slide .img {
    aspect-ratio: 666/440;
}

/* cases-2 */

.page-case-2 {
    padding-top: 0;
}

.case-2-list {
    display: flex;
    flex-direction: column;
}
@media (max-width: 568px) {
    .case-2-list {
        padding-bottom: 30px;
    }
}

.case-2 {
    height: 100svh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
}
.case-2 .scale-block {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;

    transition: transform 0s; /* отключаем transition, чтобы scale шел от позиции */
    transform-origin: center center;
    will-change: transform;
}
.case-2 .info {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 56px;
}
@media (max-width: 1024px) {
    .case-2 .info {
        gap: 44px;
    }
}
@media (max-width: 568px) {
    .case-2 .info {
        gap: 32px;
    }
}
.case-2 .info a {
    cursor: default;
}
.case-2 .info h2 {
    font-weight: 500;
    font-size: 92px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
    color: #000;
}
@media (max-width: 1024px) {
    .case-2 .info h2 {
        font-size: 70px;
    }
}
@media (max-width: 568px) {
    .case-2 .info h2 {
        font-size: 36px;
    }
}
.case-2 .info .bottom {
    display: flex;
    gap: 12px;
}
.case-2 .info .bottom a,
.case-2 .info .bottom span {
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 125px;
    height: 40px;
    opacity: 0.8;
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    text-align: center;
    color: #000;
    background: #ffffff;
    transition: .3s ease;
}
@media (max-width: 1024px) {
    .case-2 .info .bottom a,
    .case-2 .info .bottom span {
        font-size: 13px;
    }
}
@media (max-width: 568px) {
    .case-2 .info .bottom a,
    .case-2 .info .bottom span {
        width: 122px;
        height: 38px;
        font-size: 12px
    }
}
.case-2 .info .bottom a:hover {
    border: 1px solid rgba(0, 0, 0, 1);
    background: #000;
    color: #ffffff;
}
.case-2 .imgs {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: -1;
}
.case-2 .imgs .img {
    position: absolute;
    border-radius: 12px;
    overflow: hidden;
}
.case-2 .imgs .img:nth-child(1) {
    width: 356px;
    height: 400px;
    /*left: 20%;*/
    /*top: 26%;*/
    margin-left: -50em;
    margin-top: -10em;
}
@media (max-width: 1024px) {
    .case-2 .imgs .img:nth-child(1) {
        width: 195px;
        height: 220px;
        margin-left: -26em;
        margin-top: -25em;
        /*left: 82px;*/
        /*top: 21%;*/
    }
}
@media (max-width: 568px) {
    .case-2 .imgs .img:nth-child(1) {
        width: 132px;
        height: 164px;
        /*left: 42px;*/
        /*top: 18%;*/
        margin-left: -14em;
        margin-top: -18em;
    }
}
.case-2 .imgs .img:nth-child(2) {
    width: 206px;
    height: 256px;
    /*right: 25%;*/
    /*bottom: 30%;*/
    margin-right: -45em;
    margin-bottom: -14em;
}
@media (max-width: 1024px) {
    .case-2 .imgs .img:nth-child(2) {
        width: 132px;
        height: 164px;
        margin-right: -29em;
        margin-bottom: -21em;
        /*right: 82px;*/
        /*bottom: 25%;*/
    }
}
@media (max-width: 568px) {
    .case-2 .imgs .img:nth-child(2) {
        width: 116px;
        height: 140px;
        /*right: 42px;*/
        /*bottom: 22%;*/
        margin-right: -13em;
        margin-bottom: -20em;
    }
}
.case-2 .imgs .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.case-2 .imgs .img:nth-child(1) img {
    transition: .4s ease;
}
@media (min-width: 1025px) {
    .case-2:has(a:hover) .imgs .img:nth-child(1) img {
        scale: 1.1;
    }
    .case-2 .imgs .img:nth-child(2) img {
        transition: .5s ease;
    }
    .case-2:has(a:hover) .imgs .img:nth-child(2) img {
        scale: 1.3;
    }
}


.cases-view {
    position: fixed;
    left: 0;
    bottom: 0;
    padding: 12px 24px;
    background: #000;
    width: 100%;
    display: flex;
    align-items: center;
    gap: 24px;
}

.cases-view a {
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: rgba(255, 255, 255, 0.4);
}
.cases-view a) {
    position: relative;
}
.cases-view a:after {
    content: '';
    position: absolute;
    left: 24px;
    top: -60px;
    width: 173px;
    height: 50px;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='175' height='51' viewBox='0 0 175 51' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cg opacity='0.8'%3e%3crect x='0.5' y='0.5' width='174' height='43' rx='8.5' fill='white'/%3e%3crect x='0.5' y='0.5' width='174' height='43' rx='8.5' stroke='%23E8E8E8'/%3e%3cpath d='M16.3614 26.108C15.8574 26.108 15.4054 26.024 15.0054 25.856C14.6054 25.68 14.2894 25.44 14.0574 25.136C13.8254 24.824 13.6974 24.468 13.6734 24.068H14.8014C14.8334 24.396 14.9854 24.664 15.2574 24.872C15.5374 25.08 15.9014 25.184 16.3494 25.184C16.7654 25.184 17.0934 25.092 17.3334 24.908C17.5734 24.724 17.6934 24.492 17.6934 24.212C17.6934 23.924 17.5654 23.712 17.3094 23.576C17.0534 23.432 16.6574 23.292 16.1214 23.156C15.6334 23.028 15.2334 22.9 14.9214 22.772C14.6174 22.636 14.3534 22.44 14.1294 22.184C13.9134 21.92 13.8054 21.576 13.8054 21.152C13.8054 20.816 13.9054 20.508 14.1054 20.228C14.3054 19.948 14.5894 19.728 14.9574 19.568C15.3254 19.4 15.7454 19.316 16.2174 19.316C16.9454 19.316 17.5334 19.5 17.9814 19.868C18.4294 20.236 18.6694 20.74 18.7014 21.38H17.6094C17.5854 21.036 17.4454 20.76 17.1894 20.552C16.9414 20.344 16.6054 20.24 16.1814 20.24C15.7894 20.24 15.4774 20.324 15.2454 20.492C15.0134 20.66 14.8974 20.88 14.8974 21.152C14.8974 21.368 14.9654 21.548 15.1014 21.692C15.2454 21.828 15.4214 21.94 15.6294 22.028C15.8454 22.108 16.1414 22.2 16.5174 22.304C16.9894 22.432 17.3734 22.56 17.6694 22.688C17.9654 22.808 18.2174 22.992 18.4254 23.24C18.6414 23.488 18.7534 23.812 18.7614 24.212C18.7614 24.572 18.6614 24.896 18.4614 25.184C18.2614 25.472 17.9774 25.7 17.6094 25.868C17.2494 26.028 16.8334 26.108 16.3614 26.108ZM29.0629 19.424L27.0109 26H25.8829L24.2989 20.78L22.7149 26H21.5869L19.5229 19.424H20.6389L22.1509 24.944L23.7829 19.424H24.8989L26.4949 24.956L27.9829 19.424H29.0629ZM30.7107 18.356C30.5027 18.356 30.3267 18.284 30.1827 18.14C30.0387 17.996 29.9667 17.82 29.9667 17.612C29.9667 17.404 30.0387 17.228 30.1827 17.084C30.3267 16.94 30.5027 16.868 30.7107 16.868C30.9107 16.868 31.0787 16.94 31.2147 17.084C31.3587 17.228 31.4307 17.404 31.4307 17.612C31.4307 17.82 31.3587 17.996 31.2147 18.14C31.0787 18.284 30.9107 18.356 30.7107 18.356ZM31.2387 19.424V26H30.1467V19.424H31.2387ZM34.4318 20.324V24.2C34.4318 24.52 34.4998 24.748 34.6358 24.884C34.7718 25.012 35.0078 25.076 35.3438 25.076H36.1478V26H35.1638C34.5558 26 34.0998 25.86 33.7958 25.58C33.4918 25.3 33.3398 24.84 33.3398 24.2V20.324H32.4878V19.424H33.3398V17.768H34.4318V19.424H36.1478V20.324H34.4318ZM37.0629 22.7C37.0629 22.02 37.1989 21.428 37.4709 20.924C37.7429 20.412 38.1189 20.016 38.5989 19.736C39.0869 19.456 39.6429 19.316 40.2669 19.316C41.0749 19.316 41.7389 19.512 42.2589 19.904C42.7869 20.296 43.1349 20.84 43.3029 21.536H42.1269C42.0149 21.136 41.7949 20.82 41.4669 20.588C41.1469 20.356 40.7469 20.24 40.2669 20.24C39.6429 20.24 39.1389 20.456 38.7549 20.888C38.3709 21.312 38.1789 21.916 38.1789 22.7C38.1789 23.492 38.3709 24.104 38.7549 24.536C39.1389 24.968 39.6429 25.184 40.2669 25.184C40.7469 25.184 41.1469 25.072 41.4669 24.848C41.7869 24.624 42.0069 24.304 42.1269 23.888H43.3029C43.1269 24.56 42.7749 25.1 42.2469 25.508C41.7189 25.908 41.0589 26.108 40.2669 26.108C39.6429 26.108 39.0869 25.968 38.5989 25.688C38.1189 25.408 37.7429 25.012 37.4709 24.5C37.1989 23.988 37.0629 23.388 37.0629 22.7ZM48.0239 19.304C48.5199 19.304 48.9679 19.412 49.3679 19.628C49.7679 19.836 50.0799 20.152 50.3039 20.576C50.5359 21 50.6519 21.516 50.6519 22.124V26H49.5719V22.28C49.5719 21.624 49.4079 21.124 49.0799 20.78C48.7519 20.428 48.3039 20.252 47.7359 20.252C47.1599 20.252 46.6999 20.432 46.3559 20.792C46.0199 21.152 45.8519 21.676 45.8519 22.364V26H44.7599V17.12H45.8519V20.36C46.0679 20.024 46.3639 19.764 46.7399 19.58C47.1239 19.396 47.5519 19.304 48.0239 19.304ZM56.9669 20.324V24.2C56.9669 24.52 57.0349 24.748 57.1709 24.884C57.3069 25.012 57.5429 25.076 57.8789 25.076H58.6829V26H57.6989C57.0909 26 56.6349 25.86 56.3309 25.58C56.0269 25.3 55.8749 24.84 55.8749 24.2V20.324H55.0229V19.424H55.8749V17.768H56.9669V19.424H58.6829V20.324H56.9669ZM63.27 19.304C63.766 19.304 64.214 19.412 64.614 19.628C65.014 19.836 65.326 20.152 65.55 20.576C65.782 21 65.898 21.516 65.898 22.124V26H64.818V22.28C64.818 21.624 64.654 21.124 64.326 20.78C63.998 20.428 63.55 20.252 62.982 20.252C62.406 20.252 61.946 20.432 61.602 20.792C61.266 21.152 61.098 21.676 61.098 22.364V26H60.006V17.12H61.098V20.36C61.314 20.024 61.61 19.764 61.986 19.58C62.37 19.396 62.798 19.304 63.27 19.304ZM73.6818 22.46C73.6818 22.668 73.6698 22.888 73.6458 23.12H68.3898C68.4298 23.768 68.6498 24.276 69.0498 24.644C69.4578 25.004 69.9498 25.184 70.5258 25.184C70.9978 25.184 71.3898 25.076 71.7018 24.86C72.0218 24.636 72.2458 24.34 72.3738 23.972H73.5498C73.3738 24.604 73.0218 25.12 72.4938 25.52C71.9658 25.912 71.3098 26.108 70.5258 26.108C69.9018 26.108 69.3418 25.968 68.8458 25.688C68.3578 25.408 67.9738 25.012 67.6938 24.5C67.4138 23.98 67.2738 23.38 67.2738 22.7C67.2738 22.02 67.4098 21.424 67.6818 20.912C67.9538 20.4 68.3338 20.008 68.8218 19.736C69.3178 19.456 69.8858 19.316 70.5258 19.316C71.1498 19.316 71.7018 19.452 72.1818 19.724C72.6618 19.996 73.0298 20.372 73.2858 20.852C73.5498 21.324 73.6818 21.86 73.6818 22.46ZM72.5538 22.232C72.5538 21.816 72.4618 21.46 72.2778 21.164C72.0938 20.86 71.8418 20.632 71.5218 20.48C71.2098 20.32 70.8618 20.24 70.4778 20.24C69.9258 20.24 69.4538 20.416 69.0618 20.768C68.6778 21.12 68.4578 21.608 68.4018 22.232H72.5538ZM80.7704 24.992L82.8104 19.424H83.9744L81.3944 26H80.1224L77.5424 19.424H78.7184L80.7704 24.992ZM85.613 18.356C85.405 18.356 85.229 18.284 85.085 18.14C84.941 17.996 84.869 17.82 84.869 17.612C84.869 17.404 84.941 17.228 85.085 17.084C85.229 16.94 85.405 16.868 85.613 16.868C85.813 16.868 85.981 16.94 86.117 17.084C86.261 17.228 86.333 17.404 86.333 17.612C86.333 17.82 86.261 17.996 86.117 18.14C85.981 18.284 85.813 18.356 85.613 18.356ZM86.141 19.424V26H85.049V19.424H86.141ZM94.0021 22.46C94.0021 22.668 93.9901 22.888 93.9661 23.12H88.7101C88.7501 23.768 88.9701 24.276 89.3701 24.644C89.7781 25.004 90.2701 25.184 90.8461 25.184C91.3181 25.184 91.7101 25.076 92.0221 24.86C92.3421 24.636 92.5661 24.34 92.6941 23.972H93.8701C93.6941 24.604 93.3421 25.12 92.8141 25.52C92.2861 25.912 91.6301 26.108 90.8461 26.108C90.2221 26.108 89.6621 25.968 89.1661 25.688C88.6781 25.408 88.2941 25.012 88.0141 24.5C87.7341 23.98 87.5941 23.38 87.5941 22.7C87.5941 22.02 87.7301 21.424 88.0021 20.912C88.2741 20.4 88.6541 20.008 89.1421 19.736C89.6381 19.456 90.2061 19.316 90.8461 19.316C91.4701 19.316 92.0221 19.452 92.5021 19.724C92.9821 19.996 93.3501 20.372 93.6061 20.852C93.8701 21.324 94.0021 21.86 94.0021 22.46ZM92.8741 22.232C92.8741 21.816 92.7821 21.46 92.5981 21.164C92.4141 20.86 92.1621 20.632 91.8421 20.48C91.5301 20.32 91.1821 20.24 90.7981 20.24C90.2461 20.24 89.7741 20.416 89.3821 20.768C88.9981 21.12 88.7781 21.608 88.7221 22.232H92.8741ZM104.204 19.424L102.152 26H101.024L99.4395 20.78L97.8555 26H96.7275L94.6635 19.424H95.7795L97.2915 24.944L98.9235 19.424H100.04L101.636 24.956L103.124 19.424H104.204ZM105.851 18.356C105.643 18.356 105.467 18.284 105.323 18.14C105.179 17.996 105.107 17.82 105.107 17.612C105.107 17.404 105.179 17.228 105.323 17.084C105.467 16.94 105.643 16.868 105.851 16.868C106.051 16.868 106.219 16.94 106.355 17.084C106.499 17.228 106.571 17.404 106.571 17.612C106.571 17.82 106.499 17.996 106.355 18.14C106.219 18.284 106.051 18.356 105.851 18.356ZM106.379 19.424V26H105.287V19.424H106.379ZM111.444 19.304C112.244 19.304 112.892 19.548 113.388 20.036C113.884 20.516 114.132 21.212 114.132 22.124V26H113.052V22.28C113.052 21.624 112.888 21.124 112.56 20.78C112.232 20.428 111.784 20.252 111.216 20.252C110.64 20.252 110.18 20.432 109.836 20.792C109.5 21.152 109.332 21.676 109.332 22.364V26H108.24V19.424H109.332V20.36C109.548 20.024 109.84 19.764 110.208 19.58C110.584 19.396 110.996 19.304 111.444 19.304ZM118.628 19.316C119.196 19.316 119.692 19.44 120.116 19.688C120.548 19.936 120.868 20.248 121.076 20.624V19.424H122.18V26.144C122.18 26.744 122.052 27.276 121.796 27.74C121.54 28.212 121.172 28.58 120.692 28.844C120.22 29.108 119.668 29.24 119.036 29.24C118.172 29.24 117.452 29.036 116.876 28.628C116.3 28.22 115.96 27.664 115.856 26.96H116.936C117.056 27.36 117.304 27.68 117.68 27.92C118.056 28.168 118.508 28.292 119.036 28.292C119.636 28.292 120.124 28.104 120.5 27.728C120.884 27.352 121.076 26.824 121.076 26.144V24.764C120.86 25.148 120.54 25.468 120.116 25.724C119.692 25.98 119.196 26.108 118.628 26.108C118.044 26.108 117.512 25.964 117.032 25.676C116.56 25.388 116.188 24.984 115.916 24.464C115.644 23.944 115.508 23.352 115.508 22.688C115.508 22.016 115.644 21.428 115.916 20.924C116.188 20.412 116.56 20.016 117.032 19.736C117.512 19.456 118.044 19.316 118.628 19.316ZM121.076 22.7C121.076 22.204 120.976 21.772 120.776 21.404C120.576 21.036 120.304 20.756 119.96 20.564C119.624 20.364 119.252 20.264 118.844 20.264C118.436 20.264 118.064 20.36 117.728 20.552C117.392 20.744 117.124 21.024 116.924 21.392C116.724 21.76 116.624 22.192 116.624 22.688C116.624 23.192 116.724 23.632 116.924 24.008C117.124 24.376 117.392 24.66 117.728 24.86C118.064 25.052 118.436 25.148 118.844 25.148C119.252 25.148 119.624 25.052 119.96 24.86C120.304 24.66 120.576 24.376 120.776 24.008C120.976 23.632 121.076 23.196 121.076 22.7ZM135.133 19.304C135.645 19.304 136.101 19.412 136.501 19.628C136.901 19.836 137.217 20.152 137.449 20.576C137.681 21 137.797 21.516 137.797 22.124V26H136.717V22.28C136.717 21.624 136.553 21.124 136.225 20.78C135.905 20.428 135.469 20.252 134.917 20.252C134.349 20.252 133.897 20.436 133.561 20.804C133.225 21.164 133.057 21.688 133.057 22.376V26H131.977V22.28C131.977 21.624 131.813 21.124 131.485 20.78C131.165 20.428 130.729 20.252 130.177 20.252C129.609 20.252 129.157 20.436 128.821 20.804C128.485 21.164 128.317 21.688 128.317 22.376V26H127.225V19.424H128.317V20.372C128.533 20.028 128.821 19.764 129.181 19.58C129.549 19.396 129.953 19.304 130.393 19.304C130.945 19.304 131.433 19.428 131.857 19.676C132.281 19.924 132.597 20.288 132.805 20.768C132.989 20.304 133.293 19.944 133.717 19.688C134.141 19.432 134.613 19.304 135.133 19.304ZM142.456 26.108C141.84 26.108 141.28 25.968 140.776 25.688C140.28 25.408 139.888 25.012 139.6 24.5C139.32 23.98 139.18 23.38 139.18 22.7C139.18 22.028 139.324 21.436 139.612 20.924C139.908 20.404 140.308 20.008 140.812 19.736C141.316 19.456 141.88 19.316 142.504 19.316C143.128 19.316 143.692 19.456 144.196 19.736C144.7 20.008 145.096 20.4 145.384 20.912C145.68 21.424 145.828 22.02 145.828 22.7C145.828 23.38 145.676 23.98 145.372 24.5C145.076 25.012 144.672 25.408 144.16 25.688C143.648 25.968 143.08 26.108 142.456 26.108ZM142.456 25.148C142.848 25.148 143.216 25.056 143.56 24.872C143.904 24.688 144.18 24.412 144.388 24.044C144.604 23.676 144.712 23.228 144.712 22.7C144.712 22.172 144.608 21.724 144.4 21.356C144.192 20.988 143.92 20.716 143.584 20.54C143.248 20.356 142.884 20.264 142.492 20.264C142.092 20.264 141.724 20.356 141.388 20.54C141.06 20.716 140.796 20.988 140.596 21.356C140.396 21.724 140.296 22.172 140.296 22.7C140.296 23.236 140.392 23.688 140.584 24.056C140.784 24.424 141.048 24.7 141.376 24.884C141.704 25.06 142.064 25.148 142.456 25.148ZM146.856 22.688C146.856 22.016 146.992 21.428 147.264 20.924C147.536 20.412 147.908 20.016 148.38 19.736C148.86 19.456 149.396 19.316 149.988 19.316C150.5 19.316 150.976 19.436 151.416 19.676C151.856 19.908 152.192 20.216 152.424 20.6V17.12H153.528V26H152.424V24.764C152.208 25.156 151.888 25.48 151.464 25.736C151.04 25.984 150.544 26.108 149.976 26.108C149.392 26.108 148.86 25.964 148.38 25.676C147.908 25.388 147.536 24.984 147.264 24.464C146.992 23.944 146.856 23.352 146.856 22.688ZM152.424 22.7C152.424 22.204 152.324 21.772 152.124 21.404C151.924 21.036 151.652 20.756 151.308 20.564C150.972 20.364 150.6 20.264 150.192 20.264C149.784 20.264 149.412 20.36 149.076 20.552C148.74 20.744 148.472 21.024 148.272 21.392C148.072 21.76 147.972 22.192 147.972 22.688C147.972 23.192 148.072 23.632 148.272 24.008C148.472 24.376 148.74 24.66 149.076 24.86C149.412 25.052 149.784 25.148 150.192 25.148C150.6 25.148 150.972 25.052 151.308 24.86C151.652 24.66 151.924 24.376 152.124 24.008C152.324 23.632 152.424 23.196 152.424 22.7ZM161.373 22.46C161.373 22.668 161.361 22.888 161.337 23.12H156.081C156.121 23.768 156.341 24.276 156.741 24.644C157.149 25.004 157.641 25.184 158.217 25.184C158.689 25.184 159.081 25.076 159.393 24.86C159.713 24.636 159.937 24.34 160.065 23.972H161.241C161.065 24.604 160.713 25.12 160.185 25.52C159.657 25.912 159.001 26.108 158.217 26.108C157.593 26.108 157.033 25.968 156.537 25.688C156.049 25.408 155.665 25.012 155.385 24.5C155.105 23.98 154.965 23.38 154.965 22.7C154.965 22.02 155.101 21.424 155.373 20.912C155.645 20.4 156.025 20.008 156.513 19.736C157.009 19.456 157.577 19.316 158.217 19.316C158.841 19.316 159.393 19.452 159.873 19.724C160.353 19.996 160.721 20.372 160.977 20.852C161.241 21.324 161.373 21.86 161.373 22.46ZM160.245 22.232C160.245 21.816 160.153 21.46 159.969 21.164C159.785 20.86 159.533 20.632 159.213 20.48C158.901 20.32 158.553 20.24 158.169 20.24C157.617 20.24 157.145 20.416 156.753 20.768C156.369 21.12 156.149 21.608 156.093 22.232H160.245Z' fill='black'/%3e%3c/g%3e%3cg clip-path='url(%23clip0_403_2082)'%3e%3cpath d='M24.0674 42.5L18.3838 49.3203L18 49.7812L17.6162 49.3203L11.9326 42.5H24.0674Z' fill='white' stroke='%23E8E8E8' stroke-linejoin='round'/%3e%3c/g%3e%3cdefs%3e%3cclipPath id='clip0_403_2082'%3e%3crect width='88' height='8' fill='white' transform='translate(1 43)'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e ");
    opacity: 0;
    pointer-events: none;
    transition: .3s ease;
}
.cases-view a:hover:after {
    opacity: 1;
}

.cases-view a.active {
    border-bottom: 1px solid #fff;
    padding: 2px 4px;
    color: #fff;
}

/**/

.inline_txt {
    overflow: hidden;
}

/*
@keyframes slideUpIn {
    from {
        transform: translate(0px, 100px);
    }
    to {
        transform: translate(0px, 0px);
    }
}

.up_txt {
    animation: slideUpIn 0.9s ease-out forwards;
}
*/

.link-anim:after {
    background-color: currentColor;
    bottom: 0;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    transform: scaleX(0);
    transform-origin: 0 50%;
    transition: transform .6s
    cubic-bezier(.85, 0, .15, 1);
    width: 100%;
    will-change: transform;
}
.link-anim:not(:hover):after {
    transform-origin: 100% 50%;
}
.link-anim:hover:after {
    transform: scaleX(1);
    transform-origin: 0 50%;
}

/**/

.letstalk,
.consultation {
    mix-blend-mode: difference;
    isolation: isolate;
    position: fixed;
    z-index: 59;
    right: 24px;
    bottom: 24px;
    border-radius: 40px;
    width: 98px;
    height: 52px;
    background: #ffffff;
    border: 1px solid #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 0.01em;
    color: #000000;
    overflow: hidden;
    transition: .3s ease;
}
.consultation {
    width: fit-content;
    padding: 0 22px;
    z-index: 1;
    overflow: hidden;
    transition: .3s ease;
}
@media (min-width: 1025px) {
    .letstalk {
        display: none;
    }
}
@media (max-width: 1024px) {
    .consultation {
        right: 134px;
    }
}
.consultation:after {
    content: '';
    background: #000000;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    pointer-events: none;
    transform: translate(0px, 100%);
    transition: .3s ease;
}
@media (min-width: 1025px) {
    .consultation:hover {
        color: #ffffff;
        border: 1px solid #fff;
    }
    .consultation:hover:after {
        transform: translate(0px, 0%);
    }
}

/**/
.block-link .link {
    width: 100%;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding: 40px 10px 32px;
    font-style: italic;
    font-weight: 400;
    font-size: 44px;
    line-height: 105%;
    text-transform: uppercase;
    text-align: center;
    justify-content: center;
    color: #fff;
    background: #000000;
    display: flex;
    align-items: center;
    gap: 32px;
    transition: .3s ease;
}
@media (max-width: 1024px) {
    .block-link .link {
        padding: 32px 10px 24px;
        font-size: 40px;
    }
}
@media (max-width: 568px) {
    .block-link .link {
        padding: 24px 10px 16px;
        font-size: 24px;
    }
    .block-link .link svg {
        width: 40px;
        height: 40px;
    }
}
.block-link .link:hover {
    border-bottom: 1px solid rgba(255, 255, 255, 1);
    border-top: 1px solid rgba(255, 255, 255, 1);
}

/**/

.text-line em.line {
    /*opacity: 0;*/
}

.text-line em {
    display: block;
    font: inherit;
    color: inherit !important;
    text-transform: inherit;
    letter-spacing: inherit;
    display: inline-block;
    overflow: hidden;
}

/**/

label:has(.check) {

}

label:has(.check) input {
    display: none;
}

label:has(.check) .check {
    min-width: 12px;
    width: 12px;
    max-width: 12px;
    height: 12px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 2px;
    transition: .3s ease;
}

label:has(:checked ~ .check) .check {
    background: #fff;
    border: 1px solid #fff;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='7' height='6' viewBox='0 0 7 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M2.55523 5.3803L6.7973 1.13763C7.05758 0.877315 7.05756 0.455299 6.79727 0.195004C6.53694 -0.0653203 6.11487 -0.0653019 5.85457 0.195045L2.55523 3.49497L1.14056 2.0803C0.880252 1.81999 0.458206 1.81999 0.197896 2.0803C-0.0624144 2.34061 -0.0624145 2.76266 0.197896 3.02297L2.55523 5.3803Z' fill='black' /%3e%3c/svg%3e");
}
/**/

[data-browser="safari"] video {
    -webkit-filter: brightness(105%) contrast(100%);
    filter: brightness(105%) contrast(100%);
}
@media (max-width: 568px) {
    [data-browser="safari"] video {
        -webkit-filter: brightness(100%) contrast(100%);
        filter: brightness(100%) contrast(100%);
    }
}