/* 产品详情板块样式（复用 EG-E3300-L 排版），限定在 .gw-feature 内避免污染方案页 */

/* 锚点导航箭头：覆盖 .n-project-page img{width:100%} 导致变形 */
.n-project-page .nav-show img {
    width: 24px !important;
    max-width: 14px !important;
    height: 24px !important;
    margin-left: 8px;
    float: none;
    object-fit: contain;
    flex-shrink: 0;
}

.gw-feature {
    margin: 0 auto;
    width: 1400px;
    max-width: 100%;
    color: #292929;
}

.gw-feature img {
    width: auto;
    max-width: 100%;
}

.gw-feature .custom-dom-p {
    top: 180px;
    position: absolute;
    width: 1200px;
    left: calc((100% - 1200px) / 2);
    text-align: center;
    font-size: 16px;
    font-weight: 400;
    line-height: 150%;
    color: #385075;
    z-index: 1;
    box-sizing: border-box;
    padding: 0 12px;
}

.gw-feature .gw-page {
    position: relative;
    text-align: center;
    color: #385075;
}

.gw-feature #gw-page-leak {
    padding-bottom: 80px;
    box-sizing: border-box;
}

.gw-feature .gw-page h2 {
    font-size: 36px;
    font-weight: bold;
    line-height: 150%;
    padding-top: 60px;
    margin: 0;
}

.gw-feature .gw-page .h5 {
    font-size: 16px;
    line-height: 150%;
    margin: 18px 0 0;
    font-weight: normal;
}

.gw-feature .gw-page-title {
    position: absolute;
    z-index: 10;
    width: 1200px;
    left: calc((100% - 1200px) / 2);
    pointer-events: none;
}

.gw-feature #gw-page-leak .gw-page-title .n-tab {
    pointer-events: auto;
    position: static;
    transform: none;
    left: auto;
    top: auto;
    width: auto;
    margin-top: 18px;
}

.gw-feature #gw-page-leak > .n-tab {
    display: none;
}

.gw-feature .n-tab {
    display: block;
    margin-top: 18px;
    height: 41px;
    font-size: 0;
    justify-content: center;
}

.gw-feature .n-tab div {
    height: 41.5px;
    font-size: 16px;
    padding: 0 20px;
    display: inline-block;
    line-height: 41.5px;
    border-bottom: 1px solid rgba(56, 80, 117, 0.5);
    cursor: pointer;
    z-index: 20;
    box-sizing: border-box;
}

.gw-feature .n-tab-selected,
.gw-feature .n-tab-active {
    border-bottom: #01a0e8 3px solid !important;
    font-weight: bold;
    height: 42.2px !important;
    color: #385075;
}

.gw-feature .n-tab div::after {
    display: none;
}

.gw-feature .n-tabs_m {
    display: none;
    text-align: left;
}

.gw-feature .gw-page-content {
    position: relative;
    margin: 0px auto 0 auto;
}

.gw-feature .n-content-bg {
    font-size: 0;
    line-height: 0;
}

.gw-feature .n-content-bg img,
.gw-feature .n-content-bg video {
    width: 100%;
    display: block;
}

@media screen and (max-width: 1400px) and (min-width: 1200px) {
    .gw-feature .gw-page h2 {
        padding-top: 48px;
        font-size: 32px;
    }

    .gw-feature .gw-page .h5 {
        margin-top: 12px;
        font-size: 14px;
    }

    .gw-feature .n-tab {
        margin-top: 12px;
    }

    .gw-feature .gw-page-title {
        width: 1100px;
        left: calc((100% - 1100px) / 2);
    }

    .gw-feature #gw-page-leak .gw-page-title .n-tab {
        margin-top: 12px;
    }

    .gw-feature .custom-dom-p {
        top: 158px;
        width: 1100px;
        left: calc((100% - 1100px) / 2);
        font-size: 14px;
    }
}

@media screen and (max-width: 1199px) and (min-width: 769px) {
    .gw-feature {
        width: 100%;
    }

    .gw-feature .gw-page {
        margin-top: 0;
    }

    .gw-feature .gw-page h2 {
        font-size: 18px;
        padding-top: 60px !important;
    }

    .gw-feature .gw-page .h5 {
        font-size: 12px;
        width: 350px;
        max-width: calc(100% - 40px);
        margin: 14px auto 0;
    }

    .gw-feature .gw-page-title {
        width: 350px;
        max-width: calc(100% - 40px);
        left: 50%;
        transform: translateX(-50%);
    }

    .gw-feature #gw-page-leak .gw-page-title .n-tab {
        margin-top: 14px;
        height: unset;
    }

    .gw-feature .n-tab {
        margin-top: 14px;
        height: unset;
    }

    .gw-feature .n-tab div {
        font-size: 11px;
        line-height: 16px;
        height: 24px;
        padding: 0 10px;
    }

    .gw-feature .n-tab-selected,
    .gw-feature .n-tab-active {
        height: 24px !important;
    }

    .gw-feature .custom-dom-p {
        font-size: 12px;
        width: 350px;
        max-width: calc(100% - 40px);
        left: 50%;
        transform: translateX(-50%);
        top: var(--custom-p-top, 145px);
    }
}

/* 移动端：防泄漏对齐 EG-E3300-L 产品叠字 Tab；其它板块保持方案样式 */
@media screen and (max-width: 768px) {
    .gw-feature {
        width: 100%;
        padding: 0;
        box-sizing: border-box;
    }

    .gw-feature #gw-page-leak {
        padding-bottom: 0;
        margin-top: 0;
        text-align: center;
        color: #385075;
    }

    /* 隐藏方案页折叠 Tab，改用产品页横向 Tab（在标题内） */
    .gw-feature #gw-page-leak .n-tabs_m {
        display: none !important;
    }

    .gw-feature #gw-page-leak .gw-page-title .n-tab {
        display: block !important;
        position: static;
        transform: none;
        left: auto;
        width: 100%;
        margin-top: 0.875rem;
        height: unset;
        pointer-events: auto;
    }

    .gw-feature #gw-page-leak .gw-page-title {
        position: absolute;
        z-index: 10;
        width: 21.875rem;
        max-width: calc(100% - 40px);
        left: 50%;
        transform: translateX(-50%);
        pointer-events: none;
        margin-bottom: 0;
    }

    .gw-feature #gw-page-leak .gw-page-title h2 {
        font-size: 1.125rem;
        padding-top: 3.75rem !important;
        text-align: center;
        line-height: 150%;
        color: #385075;
        font-weight: bold;
    }

    .gw-feature #gw-page-leak .n-tab div {
        font-size: 0.7rem;
        line-height: 1rem;
        height: 1.485rem;
        padding: 0 0.625rem;
        display: inline-block;
        border-bottom: 1px solid rgba(56, 80, 117, 0.5);
        color: #385075;
        box-sizing: border-box;
        cursor: pointer;
    }

    .gw-feature #gw-page-leak .n-tab div::after {
        display: none;
    }

    .gw-feature #gw-page-leak .n-tab-active,
    .gw-feature #gw-page-leak .n-tab-selected {
        border-bottom: #01a0e8 3px solid !important;
        font-weight: bold;
        height: 1.5rem !important;
        color: #385075;
    }

    .gw-feature #gw-page-leak .custom-dom-p {
        position: absolute;
        z-index: 1;
        font-size: 0.75rem;
        width: 21.875rem;
        max-width: calc(100% - 40px);
        left: 50%;
        transform: translateX(-50%);
        top: var(--custom-p-top, 9.0625rem);
        text-align: center;
        padding: 0;
        margin: 0;
        color: #385075;
        line-height: 150%;
        box-sizing: border-box;
    }

    .gw-feature #gw-page-leak .gw-page-content {
        margin-top: 0;
    }
}

/* 方案架构板块（防翻墙 / 设计软件）— 对齐 Figma padding 80px */
.gw-feature .gw-section {
    padding: 80px 0;
    margin: 0;
    text-align: center;
    color: #2A2B2E;
    box-sizing: border-box;
}

.gw-feature .gw-section-title {
    margin: 0;
    font-size: 36px;
    font-weight: 700;
    line-height: 150%;
    color: #2A2B2E;
}

.gw-feature .gw-section-desc {
    margin: 16px auto 0;
    max-width: 1200px;
    font-size: 20px;
    font-weight: 400;
    line-height: 150%;
    color: #6A6B6D;
}

.gw-feature .gw-section .n-page-content {
    margin-top: 60px;
}

.gw-feature .gw-arch-img {
    width: 100%;
    max-width: 1400px;
    display: block;
    margin: 0 auto;
    border-radius: 8px;
}

.gw-feature .gw-auto-video {
    position: relative;
    max-width: 1400px;
    margin: 0 auto;
    font-size: 0;
}

.gw-feature .gw-auto-video video {
    width: 100%;
    display: block;
    border-radius: 8px;
    object-fit: contain;
}

.gw-feature .gw-auto-video .gw-soft-m-img,
.gw-feature .gw-auto-video .zoomBtn {
    display: none;
}

/* 防翻墙：封面 + 点击播放 */
.gw-feature .n-click-video {
    position: relative;
    margin: 0 auto;
    font-size: 0;
    cursor: pointer;
    overflow: hidden;
}

.gw-feature .n-click-video::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.4);
    pointer-events: none;
    z-index: 1;
}

.gw-feature .n-click-video .n-click-cover {
    width: 100%;
    display: block;
}

.gw-feature .n-click-video .n-click-play {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 68px;
    height: 68px;
    pointer-events: none;
    display: block;
    z-index: 2;
}

.gw-feature .n-click-video .n-click-play img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
}

.gw-feature .n-click-video video {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    pointer-events: none;
    z-index: 0;
}

.gw-feature .n-click-video.is-playing {
    cursor: default;
}

.gw-feature .n-click-video.is-playing .n-click-cover,
.gw-feature .n-click-video.is-playing .n-click-play,
.gw-feature .n-click-video.is-playing::after {
    display: none;
}

.gw-feature .n-click-video.is-playing video {
    position: static;
    height: auto;
    object-fit: contain;
    opacity: 1;
    pointer-events: auto;
    display: block;
    vertical-align: top;
}

@media screen and (max-width: 1280px) {
    .gw-feature .gw-section-title {
        font-size: 28px;
    }

    .gw-feature .gw-section-desc {
        font-size: 16px;
        padding: 0 20px;
        max-width: 1080px;
    }
}

@media screen and (max-width: 768px) {
    .gw-feature .gw-section {
        padding: 48px 20px;
    }

    .gw-feature .gw-section-title {
        font-size: 20px;
    }

    .gw-feature .gw-section-desc {
        font-size: 14px;
        text-align: left;
        margin-top: 12px;
        padding: 0;
    }

    .gw-feature .gw-section .n-page-content {
        margin-top: 24px;
    }

    .gw-feature .n-click-video .n-click-play {
        width: 48px;
        height: 48px;
    }

    /* 设计软件合规：移动端图片 + 放大，隐藏视频 */
    .gw-feature .gw-auto-video video {
        display: none !important;
    }

    .gw-feature .gw-auto-video .gw-soft-m-img {
        display: block;
        width: 100%;
        border-radius: 8px;
    }

    .gw-feature .gw-auto-video .zoomBtn {
        display: block;
        position: absolute;
        right: 16px;
        bottom: 16px;
        width: 36px;
        height: 36px;
        cursor: pointer;
        z-index: 2;
    }

    .gw-feature .gw-auto-video .zoomBtn img,
    .n-project-page .gw-auto-video .zoomBtn img {
        width: 100% !important;
        max-width: none !important;
        height: auto !important;
        float: none;
        display: block;
    }
}

/* 产品推荐对比表 */
#product-recommend .gw-product-table-wrap {
    max-width: 1400px;
    margin: 0 auto;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

#product-recommend .gw-product-table {
    width: 100%;
    min-width: 860px;
    border-collapse: collapse;
    table-layout: fixed;
    font-family: "Microsoft YaHei", sans-serif;
}

#product-recommend .gw-product-table th,
#product-recommend .gw-product-table td {
    padding: 16px 20px;
    border-bottom: 1px solid #E3E5E6;
    text-align: left;
    vertical-align: middle;
    font-size: 14px;
    line-height: 150%;
    color: #6A6B6D;
    box-sizing: border-box;
}

#product-recommend .gw-product-table th:nth-child(1),
#product-recommend .gw-product-table td:nth-child(1) {
    width: 22%;
}

#product-recommend .gw-product-table th:nth-child(2),
#product-recommend .gw-product-table td:nth-child(2) {
    width: 32%;
}

#product-recommend .gw-product-table thead th {
    padding: 14px 20px;
    font-weight: 700;
    color: #2A2B2E;
}

#product-recommend .gw-product-table tbody td:first-child a {
    color: #0175E8;
    font-weight: 700;
    text-decoration: underline;
}

#product-recommend .gw-product-table tbody td:first-child a:hover {
    color: #005bb5;
}

#product-recommend .gw-cell-yes,
#product-recommend .gw-cell-no {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

#product-recommend .gw-cell-yes em,
#product-recommend .gw-cell-no em {
    font-style: normal;
    font-size: 14px;
    color: #6A6B6D;
    font-weight: 400;
}

#product-recommend .gw-icon-check,
#product-recommend .gw-icon-cross {
    display: inline-block;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

#product-recommend .gw-icon-check {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3.2 8.2L6.4 11.4L12.8 4.6' stroke='%232A2B2E' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

#product-recommend .gw-icon-cross {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 4L12 12M12 4L4 12' stroke='%23C0C2C4' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
}

#product-recommend .gw-product-cta {
    text-align: center;
    margin-top: 40px;
}

#product-recommend .gw-product-cta a {
    display: inline-block;
    min-width: 200px;
    padding: 12px 32px;
    background: #e60039;
    color: #fff;
    font-size: 16px;
    line-height: 150%;
    text-decoration: none;
    border-radius: 4px;
    box-sizing: border-box;
}

#product-recommend .gw-product-cta a:hover {
    background: #c40030;
}

@media screen and (max-width: 768px) {
    #product-recommend .gw-product-table th,
    #product-recommend .gw-product-table td {
        padding: 12px 12px;
        font-size: 12px;
    }

    #product-recommend .gw-product-cta {
        margin-top: 24px;
    }

    #product-recommend .gw-product-cta a {
        min-width: 160px;
        padding: 10px 20px;
        font-size: 14px;
    }
}