* {margin: 0;padding: 0;box-sizing: border-box;font-family: 'Segoe UI', 'Microsoft YaHei', sans-serif;}
		body,html{overflow: hidden;height: 100%;}
        body {overflow-x: hidden;color: #333;background-color: #f8f9fa;}
        /* 顶部固定区域容器 */
        .top-fixed-container {position: fixed;top: 0;left: 0;width: 100%;height: 80px;z-index: 1000;}
        /* 顶部固定区域背景 - 透明效果 */
        .top-fixed-bg {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.95);opacity: 0.2;transition: all 0.3s ease;
        }
        /* 滚动时顶部导航栏背景样式变化 */
        .top-fixed-container.scrolled .top-fixed-bg {opacity: 0.2;box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);}
        .text-center {text-align: center;}
        /* 顶部固定区域内容 - 不透明 */
        .top-fixed-content {position: relative;height: 100%;display: flex;align-items: center;justify-content: space-between;padding: 0 40px;}
        /* Logo样式 */
        .logo {height: 40px;display: flex;align-items: center;gap: 12px;}
        .logo-image {height: 100%;width: auto;max-width: 200px;}
        .logo-title {font-weight: 500;font-size: 22px;color: #FFFFFF;letter-spacing: 1px;}
        /* 导航菜单容器 - 在右侧 */
        .nav-menu {display: flex;align-items: center;gap: 40px;}
        /* 产品介绍样式 */
        .nav-link {font-weight: 500;font-size: 22px;color: #FFFFFF;text-decoration: none;transition: color 0.3s ease;cursor: pointer;}
        .nav-link:hover {color: #06C196;}
		/* 下载按钮样式 */
		.download-btn {background: #06C196;border-radius: 25px;padding: 12px 32px;font-weight: 500;font-size: 20px;color: #FFFFFF;text-decoration: none;border: none;cursor: pointer;transition: all 0.3s ease;display: inline-block;}
		.download-btn:hover {background: #05A882;transform: translateY(-2px);box-shadow: 0 4px 12px rgba(6, 193, 150, 0.3);}
		/* 全屏页面区域 */
		.fullpage-section {width: 100%;height: 100vh;position: relative;display: flex;align-items: center;justify-content: center;padding-top: 80px;overflow: hidden;}
		/* 背景图片容器 */
		.bg-image {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-size: cover;background-position: center;z-index: -1;}
		/* 页面2的背景层 */
		.page2-main-bg {background-image: url('../img/4.png');z-index: -3;}
		/* 页面2左侧背景 */
		.page2-left-bg {position: absolute;bottom: 0;left: 0;width: 200%;height: 200%;max-width: 801px;max-height: 1080px;background-image: url('../img/left.png');background-size: cover;background-position: center;z-index: -2;transform: translateX(-100%);transition: transform 1.2s cubic-bezier(0.4, 0, 0.2, 1);}
		/* 页面2右侧背景 */
		.page2-right-bg {position: absolute;bottom: 0;right: 0;width: 200%;height: 200%;max-width: 802px;max-height: 1079px;background-image: url('../img/right.png');background-size: cover;background-position: center;z-index: -2;transform: translateX(100%);transition: transform 1.2s cubic-bezier(0.4, 0, 0.2, 1);}
		/* 页面2内容容器 */
		.page2-content {width: 100%;max-width: 1200px;padding: 40px;display: flex;flex-direction: column;align-items: center;justify-content: center;text-align: center;z-index: 1;transform: translateY(-200px);}
		/* 页面2主标题 */
		.page2-title {font-weight: bold;font-size: 76px;color: #000000;margin-bottom: 20px;text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);text-shadow: 0 0 8px #ffffff;}
		/* 页面2副标题 */
		.page2-title-small {font-weight: 400;font-size: 60px;color: #000000;margin-bottom: 40px;text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);text-shadow: 0 0 8px #ffffff;}
		/* 渐变文字容器 - 水平排列 */
		.gradient-text-container {display: flex;align-items: center;justify-content: center;gap: 20px;margin-top: 20px;}
		/* 左侧渐变线条 */
		.gradient-line-left {background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #06C196 100%);width: 100px;height: 6px;border-radius: 3px;}
		/* 中间文字 */
		.center-text {font-size: 28px;font-weight: 500;color: #333;white-space: nowrap;text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);text-shadow: 0 0 4px #ffffff;}
		/* 右侧渐变线条 */
		.gradient-line-right {background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, #06C196 100%);width: 100px;height: 6px;border-radius: 3px;}
		/* 第一页特定样式 */
		.page1-content {width: 100%;max-width: 1200px;display: flex;flex-direction: column;align-items: center;justify-content: center;text-align: center;padding: 20px;}
		/* 主标题区域 */
		.main-title-container { display: flex;flex-direction: column;align-items: flex-start;margin-bottom: 40px;width: 100%;}
		/* 一站式客服系统 - 大标题 */
		.main-title-line1 {display: flex;flex-wrap: wrap;align-items: center;gap: 20px;margin-bottom: 20px;}
		.main-title-line1 img{width: 100%;max-width: 887px;}
		.main-title-1 {font-weight: bold;font-size: 76px;color: #FFFFFF;line-height: 1.1;text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);}
		/* 多端便捷专业 - 绿色标签 */
		.title-tags {display: flex;flex-wrap: wrap;gap: 12px;align-items: center;}
		.title-tag {background: #06C196;border-radius: 18px;padding: 8px 20px;font-weight: 400;font-size: 30px;color: #FFFFFF;white-space: nowrap;}
		/* Social chat system - 英文副标题 */
		.subtitle-english {font-family: "Microsoft JhengHei", "微软简标宋", sans-serif;font-weight: 400;font-size: 76px;color: #C7F8ED;margin-bottom: 90px;line-height: 1;text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);}
		/* 三行描述文字 */
		.description-lines {display: flex;flex-direction: column;gap: 15px;margin-bottom: 60px;text-align: left;}
		.description-line {font-weight: 400;font-size: 28px;color: #FFFFFF;line-height: 1.4;text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);}
		/* 红框标题区域 */
		.red-box-container {position: relative;margin-bottom: 60px;width: 100%;max-width: 800px;}
		.red-box-title {font-size: 56px;font-weight: 700;color: #FFFFFF;margin-bottom: 20px;text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);letter-spacing: 2px;}
		/* 页面4的平台卡片 */
		.platforms-section {display: flex;justify-content: center;gap: 100px;margin: 200px auto;max-width: 1200px;padding: 0 20px;flex-wrap: wrap;}
		.platform-item {width: 200px;height: 80px;background: white;border-radius: 15px;display: flex;align-items: center;justify-content: center;box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);transition: transform 0.3s ease;flex-direction: column;text-decoration: none;}
		.platform-item:hover {transform: translateY(-5px);}
		.platform-icon {font-size: 24px;color: #333;}
		.platform-item span {font-size: 16px;font-weight: 500;color: #333;}
		.footer-section {position: absolute;bottom: 0;left: 0;right: 0;background-color: white;padding: 30px;text-align: center;color: #666;font-size: 14px;line-height: 1.6;box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);}
		/* 页面指示器 */
		.page-indicator {position: absolute;bottom: 30px;left: 50%;transform: translateX(-50%);display: flex;gap: 12px;}
		.indicator-dot {width: 12px;height: 12px;border-radius: 50%;background-color: rgba(160, 160, 160, 0.5);cursor: pointer;transition: all 0.3s ease;}
		.indicator-dot.active {background-color: #fff;transform: scale(1.2);}
		/* 向下箭头 */
		.down-arrow {position: absolute;bottom: 60px;left: 50%;transform: translateX(-50%);width: 50px;height: 50px;background-color: rgba(255, 255, 255, 0.9);border-radius: 50%;display: flex;align-items: center;justify-content: center;cursor: pointer;box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);transition: all 0.3s ease;z-index: 10;}
		.down-arrow:hover {background-color: white;transform: translateX(-50%) translateY(5px);box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);}
		.down-arrow i {font-size: 24px;color: #06C196;}

		/* 页面4垂直居中内容容器 */
		.page4-center-content {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 2;display: flex;flex-direction: column;align-items: center;justify-content: center;width: 100%;padding: 20px;text-align: center;}
		

		/* 添加悬停图片的样式 */
        .platform-item {
            position: relative;
            text-decoration: none;
            transition: all 0.3s ease;
        }
        
        /* iOS悬停图片 */
        .platform-item.ios:hover .hover-image {
            display: block;
            background-image: url('../img/Android-qcode.png'); /* iOS悬停图片路径 */
        }
        
        /* Android悬停图片 */
        .platform-item.android:hover .hover-image {
            display: block;
            background-image: url('../img/ios-qcode.png'); /* Android悬停图片路径 */
        }
        
        /* 悬停图片样式 */
        .hover-image {
            display: none;
            position: absolute;
            bottom: 120%; /* 在图标上方显示 */
            left: 50%;
            transform: translateX(-50%);
            width: 200px; /* 图片宽度 */
            height: 150px; /* 图片高度 */
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            border-radius: 10px;
            box-shadow: 0 5px 20px rgba(0, 0, 0, 0.3);
            z-index: 100;
            animation: fadeInUp 0.3s ease;
        }
        
        /* 添加小三角形指示器 */
        .hover-image::after {
            content: '';
            position: absolute;
            top: 100%;
            left: 50%;
            transform: translateX(-50%);
            border-width: 10px;
            border-style: solid;
            border-color: white transparent transparent transparent;
        }
        
        /* 淡入动画 */
        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateX(-50%) translateY(10px);
            }
            to {
                opacity: 1;
                transform: translateX(-50%) translateY(0);
            }
        }
        
        /* 为平台项添加悬停效果增强 */
        .platform-item:hover {
            transform: translateY(-5px);
        }
        
        .platform-item:hover .platform-icon {
            color: #ff6b6b; /* 悬停时图标颜色变化 */
        }
        
        .platform-item:hover span {
            color: #ff6b6b; /* 悬停时文字颜色变化 */
        }

@keyframes glow {
    0% {filter: drop-shadow(0 0 8px rgba(255, 255, 255, 1))}
	50% {filter: drop-shadow(0 0 16px rgba(255, 255, 255, 0.2))}
    100% {filter: drop-shadow(0 0 8px rgba(255, 255, 255, 1))}
}

		/* 响应式设计 */
		@media (max-width: 1920px) {
		.page2-left-bg {left: -300px;}
		.page2-right-bg {right: -300px;}
		}
		@media (max-width: 1024px) {
		.top-fixed-content {padding: 0 30px;}
		.nav-menu {gap: 30px;}
		.logo-title {font-size: 20px;}
		.nav-link {font-size: 20px;}
		.download-btn {padding: 10px 26px;font-size: 18px;}
		.main-title-1 {font-size: 60px;}
		.subtitle-english {font-size: 60px;}
		.title-tag {font-size: 24px;padding: 6px 16px;}
		.description-line {font-size: 24px;}
		.red-box-title {font-size: 48px;}
		.page2-content {transform: translateY(-150px);}
		.page2-title {font-size: 60px;}
		.page2-title-small {font-size: 48px;}
		.center-text {font-size: 24px;}
		.page2-left-bg {left: -420px;}
		.page2-right-bg {right: -420px;}
		@media (max-width: 768px) {
		.top-fixed-container {height: 70px;}
		.top-fixed-content {padding: 0 20px;}
		.logo {height: 35px;}
		.logo-title {font-size: 18px;}
		.nav-menu {gap: 20px;}
		.nav-link {font-size: 18px;}
		.download-btn {padding: 8px 22px;font-size: 16px;}
		.fullpage-section {padding-top: 70px;}
		.main-title-1 {font-size: 48px;}
		.subtitle-english {font-size: 48px;margin-bottom: 60px;}
		.title-tag {font-size: 20px;padding: 4px 12px;}
		.description-line {font-size: 20px;}
		.red-box-title {font-size: 36px;}
		.page2-content {transform: translateY(-100px);padding: 20px;}
		.center-text {font-size: 20px;}
		.gradient-line-left,.gradient-line-right {width: 60px;}
		.gradient-text-container {gap: 15px;}
		.page2-title {font-size: 48px;}
		.page2-title-small {font-size: 36px;}
		.page2-left-bg {left: -520px;}
		.page2-right-bg {right: -520px;}
		.platforms-grid {gap: 30px;}
		.platform-item {min-width: 120px;}}
		@media (max-width: 640px) {
		.top-fixed-content {padding: 0 15px;}
		.logo-title {font-size: 16px;}
		.nav-menu {gap: 15px;}
		.nav-link {font-size: 16px;}
		.download-btn {padding: 6px 18px;font-size: 14px;}
		.main-title-1 {font-size: 36px;}
		.subtitle-english {font-size: 36px;margin-bottom: 40px;}
		.title-tag {font-size: 16px;padding: 4px 10px;}
		.description-line {font-size: 18px;}
		.red-box-title {font-size: 32px;}
		.page2-content {transform: translateY(-80px);}
		.page2-title {font-size: 36px;}
		.page2-title-small {font-size: 28px;}
		.center-text {font-size: 18px;}
		.gradient-line-left,.gradient-line-right {width: 40px;}
		.gradient-text-container {gap: 10px;}
		.page2-left-bg {left: -570px;}
		.page2-right-bg {right: -570px;}
		.platforms-grid {gap: 20px;}
		.platform-item {min-width: 100px;}}
		@media (max-width: 480px) {
		.top-fixed-container {height: auto;}
		.top-fixed-content {flex-direction: column;padding: 10px;}
		.logo {margin-bottom: 10px;}
		.nav-menu {margin-bottom: 10px;gap: 10px;}
		.fullpage-section {padding-top: 140px;}
		.main-title-1 {font-size: 28px;}
		.subtitle-english {font-size: 28px;margin-bottom: 30px;}
		.description-line {font-size: 16px;}
		.red-box-title {font-size: 28px;}
		.page2-content {transform: translateY(-60px);}
		.page2-title {font-size: 28px;}
		.page2-title-small {font-size: 22px;}
		.center-text {font-size: 16px;}
		.gradient-text-container {flex-direction: column;gap: 10px;}
		.gradient-line-left,.gradient-line-right {width: 60px;}
		/*.page2-left-bg,	.page2-right-bg {width: 80px;left: -80px;right: -80px;}*/
		.platforms-grid {flex-direction: column;align-items: center;gap: 30px;}
		.platforms-section{margin-top:-15px;gap:25px 100px;}
		}