@media (max-width: 960px) {
    :root{
        --wrapper-width: calc(100% - 60px);
        --wrapper-width-narrow: calc(100% - 60px);
    }

    .split-board .info{
        flex: 0 0 45%;
    }

    .split-board .cover{
        flex: 0 0 55%;
    }

    .split-info .left,
    .split-info .right{
        width: 48%;
    }
}

@media (max-width: 750px) {
    :root {
        --rpx-75: calc(1.5vw / 7.5);
        --rpx-67: calc(1.33vw / 7.5);
        --rpx-50: calc(1vw / 7.5);
        --rpx: var(--rpx-67);

        --header-height-min: calc(100 * var(--rpx));
        --header-height-max: calc(100 * var(--rpx));

        --wrapper-width: calc(100% - 40 * var(--rpx));
        --wrapper-width-narrow: calc(100% - 40 * var(--rpx));
    }

    .page-header{
        overflow: hidden;
    }

    section{
        overflow: hidden;
    }

    .site-header-bar{
        padding-left: calc(20 * var(--rpx));
        padding-right: calc(20 * var(--rpx));
    }

    html, body{
        font-size: calc(24 * var(--rpx));
    }

    .btn-large-nav-expand{
        width: calc(80 * var(--rpx));
        height: calc(80 * var(--rpx));
        left: calc(8 * var(--rpx));
        top: calc((var(--header-height) - 80 * var(--rpx)) / 2)
    }

    .btn-large-nav-expand i {
        width: calc(30 * var(--rpx));
        height: calc(3 * var(--rpx));
        margin-bottom: calc(5 * var(--rpx));
    }
    .large-nav-active .btn-large-nav-expand i:nth-of-type(1){
        transform: translateY(250%) rotate(45deg);
    }
    .large-nav-active .btn-large-nav-expand i:nth-of-type(3){
        transform: translateY(-250%) rotate(-45deg);
    }

    .large-nav .left .top{
        padding-left: calc(120 * var(--rpx));
    }

    .top-nav{
        display: none;
    }


    .site-header-bar .site-logo{
        margin-left: auto;
        margin-right: auto;
    }

    .site-header-bar .lang-switch {
        margin-left: auto;
        margin-right: 0;
        position: absolute;
        right: calc(10 * var(--rpx));
        font-size: 0.875rem;
    }

    .lang-switch .current span{
        display: none;
    }

    .lang-switch .current::before{
        margin-right: 0;
    }

    .btn-search-top{
        width: calc(80 * var(--rpx));
        height: calc(80 * var(--rpx));
        margin-left: calc(60 * var(--rpx));
    }

    .top-button {
        width: calc(80 * var(--rpx));
        height: calc(80 * var(--rpx));
    }

    .btn-search-submit i, .btn-search-top i{
        width: calc(32 * var(--rpx));
        height: calc(32 * var(--rpx));
    }

    .large-nav .left{
        width: calc(100% + 1px);
    }

    .large-nav .left .top .site-logo-inner{
        height: calc(45 * var(--rpx));
    }

    .large-nav .left .bottom{

    }

    .site-footer{
        display: block;
    }

    .site-footer>.left,
    .site-footer>.right{
        width: 100%;
    }

    .site-footer .right .bottom{
        aspect-ratio: 5/4;
    }

    .site-footer .right .top{
        height: calc(160 * var(--rpx));
    }

    .site-footer .left .bottom{
        height: auto;
        padding: calc(30 * var(--rpx)) calc(20 * var(--rpx));
        font-size: .8rem;
    }

    .site-footer .left .bottom .col1{
        width: 100%;
    } 

    .site-footer .left .bottom .col2{
        width: 100%;
    }

    .site-footer .bottom-nav .col-title{
        margin-bottom: calc(28 * var(--rpx));
    }

    .site-footer .bottom-nav .col-desc p + p{
        margin-top: 1em;
    }

    .site-footer .left .top{
        padding-left: calc(20 * var(--rpx));
    }

    .site-footer .copyright{
        margin-top: calc(30 * var(--rpx));
    }

    .site-footer .bottom-nav .col-title{
        font-size: 1rem;
    }

    .site-footer .lang-switch{
        right: calc(10 * var(--rpx));
        top: calc(15 * var(--rpx));
    }


    .capabilities .section-content{
        display: block;
        height: auto;
    }

    .cap-left{
        width: 100%;
        height: calc(640 * var(--rpx));
        padding: calc(40 * var(--rpx)) calc(30 * var(--rpx));
    }

    .cap-right{
        width: 100%;
        height: 33vw;
        position: relative;
        z-index: 240;
        overflow: visible;
    }

    .swiper-caps .cover{
        aspect-ratio: 540/720;
    }

    .swiper-caps .info{
        display: none;
    }

    .cap-right .swiper-caps{
        position: absolute;
        right: 0;
        width: 75%;
        top: 0;
        height: auto;
    }

    .swiper-caps .cover{
        transform-origin: right bottom;
    }

    .swiper-caps .swiper-slide-active .cover{
        transform: scale(2.06);
    }

    .cap-left .cap-info{
        position: relative;
        left: 0;
        top: 0;
        width: 100%;
        height: auto;
    }

    section.capabilities .swiper-nav{
        display: none;
    }

    .large-nav>.right{
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
        transform: translateX(100%);
        z-index: 810;
        transition: .4s cubic-bezier(0.15, 1, 0.336, 1);
        background-color: #fff;
    }

    .large-nav .left .bottom{
        height: var(--no-header-100vh);
    }

    .large-nav .left .large-nav-tab{
        padding-left: calc(30 * var(--rpx));
    }

    .large-nav .right.active{
        display: block;
        transform: none;
        opacity: 1;
        visibility: visible;
    }

    .large-nav .top-nav-sub-layout{
        display: block;
        overflow: auto;
    }

    .large-nav .right .bottom{
        display: block;
        overflow: auto;
        height: var(--no-header-100vh);
    }

    .large-nav .top-nav-sub-layout .left-col{
        width: 80%;
    }

    .large-nav .top-nav-sub-layout .right{
        width: 80%;
        margin-left: 0;
        margin-top: calc(30 * var(--rpx));
    }

    .large-nav .right .top{
        display: flex;
        justify-content: flex-end;
        padding-left: calc(30 * var(--rpx));
        padding-right: calc(30 * var(--rpx));
    }

    .large-nav .right .bottom{
        padding: calc(30 * var(--rpx))
    }

    .large-nav .search-box{
        width: calc(100% - 60 * var(--rpx));
    }

    .large-nav .right.active{

    }

    .scroll-hint-outer{
        display: none;
    }

    .page-title{
        font-size: calc(60 * var(--rpx));
    }

    .page-header.fullscreen .page-title{
        font-size: calc(60 * var(--rpx));
    }

    .page-header.fullscreen .page-desc{
        font-size: 1rem;
        width: 100%;
    }

    .page-header{
        min-height: 100vh;
        height: auto;
    }

    .page-header.split-header{
        min-height: unset;
    }

    .page-header.fullscreen{
        padding-top: calc(var(--header-height-max) + 80 * var(--rpx));
    }


    .page-header.split-header{
        flex-direction: column;
        align-items: stretch;
    }

    .page-header.split-header .left{
        width: 100%;
        padding-left: calc(20 * var(--rpx));
        padding-bottom: calc(40 * var(--rpx));
        padding-top: calc(40 * var(--rpx) + var(--header-height-max));
    }
    .page-header.split-header .right{
        width: 100%;
    }

    .page-header.split-header .right .top{
        aspect-ratio: 16/10;
    }
    .page-header .short-desc{
        left: calc(20 * var(--rpx));
        width: calc(100% - 40 * var(--rpx));
        font-size: calc(18rem / 16);
    }

    .page-header .right .bottom{
        padding: calc(30 * var(--rpx)) calc(20 * var(--rpx));
    }

    .anchor-links{
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .page-header.fullscreen.centered .wrapper{
        padding-bottom: calc(80 * var(--rpx));
    }

    .flex-box{
        --column: 1;
        --gap: calc(20 * var(--rpx));
        justify-content: center;
    }

    .bespoke .flex-item{

    }

    .accordion{
        width: 100%;
        height:auto;
        flex-direction: column;
    }

    .acc-item{
        width: 100%;
        height: auto;
    }

    .acc-item.active{
        width: 100%;
        height: auto;
    }

    .acc-item .desc{
        width: 100%;
    }

    .accordion .acc-info{
        padding: calc(40 * var(--rpx)) calc(20 * var(--rpx));
    }

    .cap-list{
        display: block;
        margin-right: 0;
        width: 100%;
    }

    .cap-list .cap{
        width: 100%;
        margin-right: 0;
        margin-bottom:  var(--gap);
    }

    .cap-links a{
        font-size: 1rem;
        height: calc(90 * var(--rpx))
    }

    #glow-ctn canvas{
        max-height: unset;
        transform: scale(2);
    }

    section.discover{
        height: auto;
        padding-top: calc(140 * var(--rpx));
        padding-bottom: calc(140 * var(--rpx));
    }

    .cap-list .cap{
       /* margin-bottom: 0;*/
    }
    .cap-links a:last-of-type{
        border-bottom: 1px solid #e5e5e5;
    }

    .cap-list .cap:last-of-type .cap-links a:last-of-type{
        border-bottom: none;
    }

    section.basic{
        padding-top: calc(40 * var(--rpx));
        padding-bottom: calc(40 * var(--rpx));
        height: auto;
    }

    .basic .desc{
        width: 100%;
    }

    .desc{
        font-size: calc(14rem / 16);
    }

    .section-back .plx-hexagon{
        width: 150%;
        top: 0;
        bottom: 0;
        left: -25%;
    }

    .split-block{
        display: flex;
        flex-direction: column-reverse;
    }

    .split-block>*{
        width: 100%;
    }

    .split-block .left{
        padding: calc(30 * var(--rpx)) calc(20 * var(--rpx))
    }

    .swiper-others .swiper-slide{
        width: 72vw;
    }

    .brick-list{
        display: flex;
        flex-direction: column;
    }

    section.building .brick-list .brick{
        width: 100%;
        height: auto;
    }

    section.split-info .wrapper{
        display: flex;
        flex-direction: column-reverse;
        gap: calc(30 * var(--rpx));
        padding-top: calc(100 * var(--rpx-50));
        padding-bottom: calc(100 * var(--rpx-50));
    }


    section.split-info .wrapper>*{
        width: 100%;
    }

    section.split-info .wrapper .right{
    }


    .site-footer .contact{
        height: auto;
        padding-top: calc(40 * var(--rpx));
        padding-bottom: calc(40 * var(--rpx));
    }

    .page-inner-nav-placeholder{
        display: none;
    }

    .split-board,
    .split-board.reversed{
        flex-direction: column-reverse;
        height: auto;
    }

    .split-board .info{
        width: 100%;
        padding: calc(30 * var(--rpx)) calc(20 * var(--rpx))
    }

    .split-board .cover{
        width: 100%;
        flex: 0 0 auto;
        aspect-ratio: 16/9;
    }

    .split-board .subtitle{
        font-size: calc(24rem / 16);
    }

    .window-ctn{
        --gap: calc(30 * var(--rpx));
        flex-direction: column;
        height: auto;
    }
    .window-back{
        object-fit: cover;
    }
    .window-item{
        width: 100%;
    }

    .clp-item .wrapper{
        display: flex;
        flex-direction: column;
    }
    .clp-left{
        flex: 0 0 auto;
        width: 100%;
    }
    .clp-right{
        width: 100%;
        flex: 0 0 auto;
        border-left: none;
    }
    .clp-right-inner{
        padding-left: 0;
        padding-top: calc(30 * var(--rpx));
        padding-bottom: calc(30 * var(--rpx));
    }
    .clp-desc{
        font-size: 1rem;
    }
    .clp-title{
        font-size: calc(20rem / 16);
    }

    .news-list{
        gap: calc(30 * var(--rpx))
    }

    a.news{
        width: 100%;
        flex: 0 0 auto;
        max-width: unset;
    }

    .tab-header .tab,
    .tab-header .tab.active{
        flex: 0 0 auto;
        width: auto;
    }

    .tab-header::after{
        display: none;
    }

    .tab-header{
        overflow-x: auto;
        overflow-y: hidden;
        padding-bottom: calc(18em / 28);
    }

    .tab-header .tab{
        font-size: calc(24 * var(--rpx));
        padding: calc(16em / 28);
    }

    .fold-title{
        font-size: calc(24rem / 16);
        padding-top: calc(12 * var(--rpx));
        padding-bottom: calc(12 * var(--rpx));
    }

    .fold-content-inner.desc{
        text-align: justify;
    }


    .desc ul{
        padding-left: 1.25em;
    }

    .form-item span{
        width: auto;
        min-height: unset;
    }

    .form-contact {
        --column: 1;
    }

    .form-contact .flex-item{
        width: 100%;
    }
}