.vision-container {
    background-image: url("../images/vision/vision-abstract-bg.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.kunlunmeta-vision-page .kunlunmeta-hero-banner {
    background-image: url("../images/vision/vision-banner-bg.png");
}

/* ====================================================== */
.klm-agi-lifecycle-section {
    width: 1200px;
    margin: 0 auto;
    padding-top: 58px;
}

.klm-agi-lifecycle-title-group {
    position: relative;
}

.klm-agi-lifecycle-title-group .klm-join-agi-header-img {
    top: -20px;
    left: 320px;
}

.klm-agi-lifecycle-title-tag {
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 24px;
    color: #A6C6DB;
    line-height: 33px;
}

.klm-agi-lifecycle-title-main {
    font-family: PingFangSC, PingFang SC;
    font-weight: 600;
    font-size: 24px;
    color: #FFFFFF;
    line-height: 33px;
    margin-top: 16px;
    position: relative;
    z-index: 10;
    letter-spacing: 1px;
}

.klm-agi-lifecycle-content-group {
    margin-top: 38px;
    display: flex;
    gap: 58px;
}

.klm-agi-lifecycle-visual-area {
    flex-shrink: 0;
    width: 772px;
}

.klm-agi-lifecycle-bottom-desc {
    margin-bottom: 20px;
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 18px;
    color: #FFFFFF;
    line-height: 20px;
    letter-spacing: 2px;
}

.klm-agi-lifecycle-trait-group {
    display: flex;
    flex-direction: column;
    gap: 90px;
}

.klm-agi-lifecycle-trait-item-curiosity,
.klm-agi-lifecycle-trait-item-commitment,
.klm-agi-lifecycle-trait-item-drive {
    display: flex;
    gap: 12px;
}

.klm-agi-lifecycle-trait-icon {
    height: 40px;
}

.klm-agi-lifecycle-trait-title {
    font-family: PingFangSC, PingFang SC;
    font-weight: 600;
    font-size: 20px;
    color: #FFFFFF;
    line-height: 28px;
}

.klm-agi-lifecycle-trait-desc {
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 14px;
    color: #C9DCF9;
    line-height: 20px;
    margin-top: 12px;
    letter-spacing: 1px;
}

/* ====================================================== */
.klm-strategy-plan-section {
    width: 1200px;
    margin: 0 auto;
    margin-top: 100px;
}

.klm-strategy-plan-section:hover .klm-strategy-plan-platform-visual-img {
    transform: scale(1.05);
}

.klm-strategy-plan-title-group {
    position: relative;
    padding-left: 32px;
}

.klm-strategy-plan-title-tag {
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 24px;
    color: #A6C6DB;
    line-height: 33px;
}

.klm-strategy-plan-title-main {
    font-family: PingFangSC, PingFang SC;
    font-weight: 600;
    font-size: 24px;
    color: #FFFFFF;
    line-height: 33px;
    margin-top: 16px;
    margin-bottom: 8px;
    position: relative;
    z-index: 10;
    letter-spacing: 1px;
}

.klm-strategy-plan-title-desc {
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 14px;
    color: #FFFFFF;
    line-height: 20px;
}

.klm-strategy-plan-title-group .klm-join-agi-header-img {
    top: -20px;
    left: 320px;
}

.klm-strategy-plan-content-group {
    margin-top: 58px;
    position: relative;
}

.klm-strategy-plan-vision-area {
    padding-left: 16px;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 56px;
}

.klm-strategy-plan-vision-area::after {
    content: "";
    width: 2px;
    height: 62px;
    background: linear-gradient(57deg, #11A0F8 0%, #0767EE 100%);
    border-radius: 2px;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.klm-strategy-plan-vision-title {
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 20px;
    color: #FFFFFF;
    /* 备用颜色，渐变失效时显示 */
    line-height: 28px;
    /* 核心：文字渐变背景设置 */
    background: linear-gradient(45deg, #016FFF 0%, #00BEFC 100%);
    /* 简化角度值，45deg 效果一致 */
    -webkit-background-clip: text;
    /* webkit 内核浏览器兼容 */
    background-clip: text;
    /* 标准属性，裁剪背景到文字区域 */
    -webkit-text-fill-color: transparent;
    /* 隐藏文字本身颜色，显示渐变背景 */
    text-fill-color: transparent;
    /* 标准属性 */
}

.klm-strategy-plan-vision-desc {
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 14px;
    color: #FFFFFF;
    line-height: 20px;
    margin-top: 8px;
    letter-spacing: 1px;
}

.klm-strategy-plan-core-list,
.klm-strategy-plan-platform-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    position: relative;
}

.vision-cross-border-wrap {
    position: absolute;
    top: 12px;
    left: 50%;
    transform: translateX(-50%);
}

.vision-cross-border-inner-container {
    position: relative;
}

.vision-cross-border-vertical {
    width: 1px;
    height: 184px;
    border: 1px solid;
    border-image: linear-gradient(180deg, rgba(11, 13, 61, 1), rgba(82, 88, 126, 1), rgba(11, 13, 61, 1)) 1 1;
}

.vision-cross-border-horizontal {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 204px;
    height: 2px;
    border: 1px solid;
    border-image: linear-gradient(117deg, rgba(11, 13, 61, 1), rgba(226, 237, 253, 0.34), rgba(216, 230, 252, 0.34), rgba(11, 13, 61, 0)) 1 1;
}

.klm-strategy-plan-core-item-tech,
.klm-strategy-plan-core-item-integration,
.klm-strategy-plan-platform-item-open,
.klm-strategy-plan-platform-item-supply {
    display: flex;
    gap: 8px;
    padding: 20px 90px 20px 20px;
}

.klm-simulated-border-container {
    position: absolute;
    /* top: 0; */
    left: 0px;
    width: 100%;
    height: 2px;
    background: linear-gradient(117deg,
            rgba(11, 13, 61, 1) 0%,
            rgba(226, 237, 253, 0.34) 33.33%,
            rgba(216, 230, 252, 0.34) 66.66%,
            rgba(11, 13, 61, 0) 100%);
    /* border: 1px solid;
    border-image: linear-gradient(117deg, rgba(11, 13, 61, 1), rgba(226, 237, 253, 0.34), rgba(216, 230, 252, 0.34), rgba(11, 13, 61, 0)) 1 1; */
}

.klm-simulated-border-wrapper {
    width: 100%;
    height: 2px;
}

.klm-simulated-border-layer-1 {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: -6px;
}

.klm-simulated-border-layer-2 {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.klm-simulated-border-layer-1,
.klm-simulated-border-layer-2 {
    width: 4px;
    height: 4px;
}

.klm-strategy-plan-platform-item-open,
.klm-strategy-plan-core-item-integration {
    padding-left: 90px;
}

.klm-strategy-plan-core-item-icon,
.klm-strategy-plan-platform-item-icon {
    width: 24px;
}

.klm-strategy-plan-platform-item-title,
.klm-strategy-plan-core-item-title {
    font-family: PingFangSC, PingFang SC;
    font-weight: 600;
    font-size: 14px;
    color: #FFFFFF;
    line-height: 20px;
    letter-spacing: 1px;
}

.klm-strategy-plan-platform-item-desc,
.klm-strategy-plan-core-item-desc {
    margin-top: 4px;
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 14px;
    color: #B4B5C4;
    line-height: 20px;
    letter-spacing: 1px;
}

.klm-strategy-plan-platform-visual-wrapper {
    position: absolute;
    top: -275px;
    right: -70px;
    z-index: 30px;
}

.klm-strategy-plan-platform-visual-img {
    width: 674px;
    transition: all 0.3s ease;
}

/* === */
.klm-progress-path-section {
    width: 1200px;
    margin: 0 auto;
    margin-top: 198px;
}

.klm-progress-path-title-group {
    position: relative;
    padding-left: 32px;
}

.klm-progress-path-title-group .klm-join-agi-header-img {
    top: -20px;
    left: 320px;
}

.klm-progress-path-title-tag {
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 24px;
    color: #A6C6DB;
    line-height: 33px;
}

.klm-progress-path-title-main {
    font-family: PingFangSC, PingFang SC;
    font-weight: 600;
    font-size: 24px;
    color: #FFFFFF;
    line-height: 33px;
    margin-top: 16px;
    position: relative;
    z-index: 10;
}

.klm-progress-path-desc-group {
    padding-bottom: 130px;
}

.klm-progress-path-desc-text {
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 16px;
    color: #FFFFFF;
    line-height: 22px;
    margin-top: 34px;
}

/* === */
.vision-hero-banner-content {
    width: 1200px;
    margin: 0 auto;
    padding-top: 448px;
}

.vision-hero-banner-title {
    font-size: 50px;
    color: #FFFFFF;
    line-height: 70px;
    text-align: center;
}

.vision-hero-banner-desc {
    font-weight: 400;
    font-size: 24px;
    color: #FFFFFF;
    line-height: 33px;
    margin-top: 42px;
    text-align: center;
}