/* 隐藏原生滚动条但保持滚动功能 */ body  {
    scrollbar-width: none;
    /* Firefox */ -ms-overflow-style: none;
    /* IE and Edge */ margin: 0;
    padding: 0;
    overflow: hidden;
    /* 防止双重滚动条 */ position: fixed;
    width: 100%;
    height: 100%;

}
body::-webkit-scrollbar  {
    display: none;
    /* Chrome,
    Safari,
    Opera */
}
.scroll-container  {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    scrollbar-width: none;
    -ms-overflow-style: none;
    overflow: hidden;

}
.scroll-container::-webkit-scrollbar  {
    display: none;

}
.scroll-content  {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    /* 优化性能 */ scrollbar-width: none;
    -ms-overflow-style: none;
    padding-top: calc(80 * 100vw / 1920);

}
.scroll-content::-webkit-scrollbar  {
    display: none;

}
/* 时间轴克隆元素样式 */ .entry-clone  {
    pointer-events: none;
    /* 确保克隆元素不拦截点击事件 */ max-height: calc(80vh - 100px);
    /* 限制最大高度，避免内容过高时溢出屏幕 */ overflow: visible;
    /* 允许内容溢出显示 */
}
.entry-clone .time-label  {
    color: #333;
    font-weight: bold;
    margin-left: calc(1 * 100vw / 1920);
    margin-top: calc(-100 * 100vw / 1920);

}
.entry-clone .content  {
    background-color: #fff;
    margin-top: calc(0 * 100vw / 1920);
    /* box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    */ height: auto;
    /* 确保内容高度自适应 */ min-height: calc(100 * 100vw / 1920);
    /* 最小高度确保内容可见 */ width: calc(600 * 100vw / 1920);
    /* 保持与原始内容相同的宽度 */
}
/* Header样式 */ #header-container  {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    background-color: transparent;
    transition: background-color 0.3s ease;

}
#header-container.scrolled  {
    background-color: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);

}
#header-container.scrolled nav .nav-links a  {
    color: #333;

}
#header-container.scrolled nav .nav-links a:hover,
#header-container.scrolled nav .nav-links a.active  {
    color: #0066FF;

}
/* 导航链接颜色 */ .nav-links a  {
    color: #5C5D95;

}
.nav-links a.active  {
    color: #327EF7;

}
/* 调整logo颜色（如果logo是SVG） */ .logo img  {
    transition: filter 0.3s ease;

}
#header-container.scrolled .logo img  {
    filter: none;

}
.bg-box  {
    position: fixed;
    left: 0;
    top: calc(80* 100vw / 1920);
    width: 100%;
    height: calc(593 * 100vw / 1920);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: opacity 2.5s ease;
    z-index: -1;
    pointer-events: none;

}

.bg-box .introduc-p1  {
    font-size: calc(50 * 100vw / 1920);
    font-weight: bold;
    line-height: calc(36 * 100vw / 1920);
    color: #fff;
    opacity: 0;
    animation: fadeInUp 1s ease forwards 1s;

}
.bg-box .introduc-p2  {
    margin-top: calc(50 * 100vw / 1920);
    font-size: calc(50 * 100vw / 1920);
    font-weight: bold;
    line-height: normal;
    color: #FFFFFF;
    opacity: 0;
    animation: fadeInUp 1s ease forwards 1.3s;

}
.introduction-banner  {
    position: relative;
    padding: 0;
    width: 100vw;
    height: calc(815 * 100vw / 1920);
    /* background: #fff; */
    z-index: 3;
    overflow: hidden;

}

/* Company Banner视频背景样式 */
.introduction-banner .video-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background-size: cover;
}

.introduction-banner .video-background video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
}

/* Company Banner视频蒙版样式 */
.introduction-banner .video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 2;
    /* 初始隐藏，延迟显示 */
    opacity: 0;
    transition: opacity 0.5s ease;
}

/* 蒙版延迟显示状态 */
.introduction-banner .video-overlay.delayed-show {
    opacity: 1;
}
.introduction-banner .circle-item-1  {
    position: absolute;
    left: calc(602 * 100vw / 1920);
    top: calc(34 * 100vw / 1920);
    width: calc(131 * 100vw / 1920);
    height: calc(142 * 100vw / 1920);
    background: linear-gradient(161deg, #EDDDFF 11%, #AE72E3 96%);
    box-sizing: border-box;
    border: 1px solid;
    border-image: linear-gradient(148deg, #FFFFFF 18%, #A0A2FB 106%);
    filter: blur(calc(31 * 100vw / 1920));
    border-radius: 50%;

}
.introduction-banner .introduction-content  {
    position: relative;
    padding: calc(185 * 100vw / 1920) 0 0 calc(240 * 100vw / 1920);

}
.introduction-box  {
    position: relative;
    width: calc(1440 * 100vw / 1920);
    margin: calc(182 * 100vw / 1920) auto 0;
    display: flex;
    justify-content: space-between;
    z-index: 1;

}
.introduction-box .circle-item-2  {
    position: absolute;
    left: calc(120* 100vw / 1920);
    top: calc(-200* 100vw / 1920);
    width: calc(374* 100vw / 1920);
    height: calc(374* 100vw / 1920);
    background: url('../../images/solutions/decoration-ball.png') no-repeat center / cover;
    /* filter: blur(calc(31* 100vw / 1920));
    */ border-radius: 50%;
    opacity: 1;

}
.introduction-box .introduction-left  {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;

}
.introduction-left .vie-title-box  {
    padding: 0;

}
.introduction-left .vie-sub-title-box  {
    display: flex;
    flex-direction: column;
    align-items: flex-start;

}
.vie-sub-title-box .sub-title  {
    color: #4179EB;
    font-weight: normal;
    font-size: calc(24 * 100vw / 1920);

}
.vie-sub-title-box .main-title  {
    margin-top: calc(2 * 100vw / 1920);
    font-size: calc(38 * 100vw / 1920);
    font-weight: bold;
    line-height: 130%;
    letter-spacing: 0em;
    color: #4179EB;
    background: linear-gradient(90deg, #A9CEF9 0%, #4179EB 71%, #7B86E1 100%),
    #3B4AAA;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;

}
.introduction-box .introduction-right  {
    position: relative;
    width: calc(953 * 100vw / 1920);

}
.introduction-right p  {
    font-size: calc(18 * 100vw / 1920);
    font-weight: normal;
    line-height: 190%;
    letter-spacing: 0em;
    color: #2F2F2F;

}
.introduction-right p+p  {
    margin-top: calc(24 * 100vw / 1920);

}
.timeline-box  {
    width: calc(1440 * 100vw / 1920);
    margin: calc(256 * 100vw / 1920) auto 0;
    display: flex;
    justify-content: space-between;

}
.timeline-box .timeline-left  {

}
.timeline-left .vie-title-box  {
    padding: 0;

}
/* 添加发展历程标题组固定时的样式 */ .timeline-left .vie-title-box.fixed  {
    position: fixed;
    top: 110px;
    z-index: 1000;
    background-color: #fff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 16px;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transition: none !important;

}
.timeline-box .timeline-right  {
    padding-top: calc(32 * 100vw / 1920);
    width: calc(953 * 100vw / 1920);

}
/* 重置header样式，覆盖首页的动画效果 */ header  {
    animation: none;
    opacity: 1;
    transform: none;

}
header nav  {
    animation: none;
    opacity: 1;
    transform: none;
    background: #FFFFFF;

}
.nav-links li  {
    animation: none;
    opacity: 1;
    transform: none;

}
.banner-content .consult-btn:hover  {
    background: rgba(255, 255, 255, 0.1);

}
.banner-content .consult-btn span  {
    font-size: calc(17 * 100vw / 1920);
    color: #FFFFFF;
    font-weight: 400;
    /* display: flex;
    */ /* align-items: center;
    */ height: calc(32 * 100vw / 1920);

}
.banner-content .consult-btn img  {
    width: calc(52 * 100vw / 1920);
    height: calc(52 * 100vw / 1920);
    display: block;

}
.container  {
    max-width: calc(1462 * 100vw / 1920);
    margin: 0 auto;
    padding: 0 calc(20 * 100vw / 1920);

}
/* 标题组样式 */ .title-group  {
    position: relative;
    height: calc(200 * 100vw / 1920);
    margin-bottom: 0;
    top: calc(100 * 100vw / 1920);
    z-index: 2;

}
.title-group .subtitle  {
    position: absolute;
    left: 0;
    top: calc(0 * 100vw / 1920);
    height: calc(18 * 100vw / 1920);
    font-size: calc(18 * 100vw / 1920);
    font-weight: 600;
    line-height: calc(22 * 100vw / 1920);
    text-transform: uppercase;
    letter-spacing: 0em;
    font-variation-settings: "opsz" auto;
    color: #5C5D95;

}
.title-group .subtitle::before  {
    content: '';
    position: absolute;
    left: calc(-23 * 100vw / 1920);
    top: calc(6 * 100vw / 1920);
    width: calc(9 * 100vw / 1920);
    height: calc(9 * 100vw / 1920);
    background-color: #5C5D95;
    border-radius: 50%;

}
.title-group .main-title  {
    position: absolute;
    left: 0;
    top: calc(32 * 100vw / 1920);
    width: calc(689 * 100vw / 1920);
    height: calc(137 * 100vw / 1920);
    font-size: calc(50 * 100vw / 1920);
    font-weight: bold;
    line-height: 136%;
    letter-spacing: 0em;
    color: #6567DE;
    background: linear-gradient(106deg, #6567DE 47%, #A0A2FB 117%),
    linear-gradient(90deg, #A9CEF9 0%, #4179EB 71%, #7B86E1 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    text-align: left;

}
:root  {
    --timeline-offset: 140px;
    --primary-color: #6567DE;
    --secondary-color: #A0A2FB;
    --gradient-bg: linear-gradient(106deg, #6567DE 47%, #A0A2FB 117%),
    linear-gradient(90deg, #A9CEF9 0%, #4179EB 71%, #7B86E1 100%);
    --marker-size: calc(16 * 100vw / 1920);
    --marker-border: 1px;
    /* 保持为1像素的细线 */ --marker-glow: 2px;
    /* 减小发光效果 */ --beam-width: 1px;
    /* 保持为1像素的细线 */ --content-radius: calc(12 * 100vw / 1920);
    --content-shadow: 0 calc(4 * 100vw / 1920) calc(20 * 100vw / 1920) rgba(0, 0, 0, 0.1);
    --timeline-spacing: calc(60 * 100vw / 1920);
    --entry-transition: 0.8s cubic-bezier(0.22, 1, 0.36, 1);

}
/* 时间轴容器 */ .timeline-container  {
    max-width: calc(1000 * 100vw / 1920);
    margin: 0 auto;
    position: relative;
    padding-top: calc(20 * 100vw / 1920);

}
/* 时间轴条目 */ .entry  {
    display: grid;
    grid-template-columns: var(--timeline-offset) 1fr;
    gap: calc(30 * 100vw / 1920);
    margin-bottom: calc(300 * 100vw / 1920);
    opacity: 0;
    transform: translateY(calc(20 * 100vw / 1920));
    transition: opacity var(--entry-transition),
    transform var(--entry-transition);
    position: relative;

}
/* 时间标签 */ .time-label  {
    position: sticky;
    top: calc(100 * 100vw / 1920);
    width: calc(300 * 100vw / 1920);
    align-self: start;
    color: #4179EB;
    font-size: calc(74 * 100vw / 1920);
    font-weight: 900;
    line-height: normal;
    letter-spacing: 0em;
    background: linear-gradient(90deg, #A9CEF9 0%, #4179EB 71%, #7B86E1 100%),
    #3B4AAA;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    z-index: 2;

}
/* 内容区域 */ .content  {
    left: calc(299 * 100vw / 1920);
    padding: calc(24 * 100vw / 1920);
    width: calc(600 * 100vw / 1920);
    position: relative;
    overflow: hidden;

}
/* 时间节点 */ .marker  {
    position: absolute;
    left: calc(328 * 100vw / 1920);
    top: calc(30 * 100vw / 1920);
    width: calc(46 * 100vw / 1920);
    height: calc(46 * 100vw / 1920);
    /* background: #96A6EC;
    */ border: 1px solid #96A6EC;
    /* 保持为1像素的细线 */ border-radius: 50%;
    z-index: 1;
    transform: none !important;
    /* 防止被父元素的hover效果放大 */
}
.marker-2  {
    position: absolute;
    left: calc(347 * 100vw / 1920);
    top: calc(50 * 100vw / 1920);
    width: calc(6 * 100vw / 1920);
    /* 进一步减小定位点的大小，保持细线效果 */ height: calc(6 * 100vw / 1920);
    background: linear-gradient(90deg, #9090E2 0%, #619BF3 71%, #5182F4 100%);
    border-radius: 50%;
    z-index: 1;
    transform: none !important;
    /* 防止被父元素的hover效果放大 */ box-shadow: none !important;
    /* 移除所有可能的阴影效果 */
}
.content h3  {
    margin-bottom: calc(18 * 100vw / 1920);
    font-size: calc(18 * 100vw / 1920);
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0em;
    color: #2F2F2F;
    position: relative;

}
.content p  {
    margin-bottom: calc(18 * 100vw / 1920);
    font-size: calc(18 * 100vw / 1920);
    font-weight: 200;
    line-height: 1.8;
    letter-spacing: 0em;
    color: #2F2F2F;

}
/* 内容图片 */ .content img  {
    width: calc(426 * 100vw / 1920);
    height: auto;
    object-fit: contain;
    border-radius: calc(8 * 100vw / 1920);
    margin-top: calc(16 * 100vw / 1920);
    margin-bottom: calc(16 * 100vw / 1920);
    box-shadow: 0 calc(4 * 100vw / 1920) calc(12 * 100vw / 1920) rgba(0, 0, 0, 0.1);

}
/* 时间轴竖线 - 独立处理 */ .beam  {
    position: absolute;
    left: calc(350 * 100vw / 1920);
    top: 0;
    width: 1px;
    /* 直接指定1像素的细线 */ height: 100% !important;
    /* 强制使用100%高度 */ background: linear-gradient(to bottom,
    transparent 0%,
    var(--primary-color) 10%,
    var(--primary-color) 90%, transparent 100%);
    z-index: 10;
    /* 提高层级，确保在上层 */ opacity: 0.8 !important;
    /* 强制保持可见 */ visibility: visible !important;
    /* 强制保持可见 */ transform: none !important;
    /* 防止被意外放大 */ pointer-events: none;
    /* 确保不拦截点击事件 */
}
/* 克隆光束样式 */ .beam-clone  {
    position: absolute;
    width: 1px;
    height: 100vh !important;
    /* 强制使用视口高度 */ background: linear-gradient(to bottom,
    transparent 0%,
    var(--primary-color) 10%,
    var(--primary-color) 90%, transparent 100%);
    z-index: 10;
    /* 提高层级，确保在上层 */ pointer-events: none;

}
/* 确保光束不受其他元素的隐藏影响 */ #timeline-beam  {
    transition: opacity 0.2s ease;

}
.entry.visible  {
    opacity: 1;
    transform: translateY(0);

}
/* 为每个时间点添加不同的延迟，创造级联动画效果 */ .entry:nth-child(1).visible  {
    transition-delay: 0.1s;

}
.entry:nth-child(2).visible  {
    transition-delay: 0.2s;

}
.entry:nth-child(3).visible  {
    transition-delay: 0.3s;

}
.entry:nth-child(4).visible  {
    transition-delay: 0.4s;

}
.entry:nth-child(5).visible  {
    transition-delay: 0.5s;

}
.entry:nth-child(6).visible  {
    transition-delay: 0.6s;

}
.entry:nth-child(7).visible  {
    transition-delay: 0.7s;

}
.entry:nth-child(8).visible  {
    transition-delay: 0.8s;

}
.entry:nth-child(9).visible  {
    transition-delay: 0.9s;

}
.entry:nth-child(10).visible  {
    transition-delay: 1.0s;

}
.entry:nth-child(11).visible  {
    transition-delay: 1.1s;

}
.entry:nth-child(12).visible  {
    transition-delay: 1.2s;

}
@keyframes fadeInUp   {

    from  {
        opacity: 0;
        transform: translateY(30px);

    }
    to  {
        opacity: 1;
        transform: translateY(0);

    }

}
