* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    line-height: 1.6;
    color: #333;
    background-color: #fff;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
.header {
    background: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
}

.navbar {
    padding: 0;
}

.nav-container {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 0 20px;
    height: 70px;
    gap: 40px;
}

.logo img {
    height: 40px;
}

.nav-menu {
    display: flex;
    list-style: none;
    align-items: center;
    gap: 30px;
}

.nav-item {
    position: relative;
    align-items: left;
}

.nav-link {
    text-decoration: none;
    color: #333;
    font-weight: 500;
    font-size: 16px;
    display: flex;
    align-items: left;
    gap: 5px;
    padding: 20px 0;
    transition: color 0.3s ease;
}

.nav-link:hover {
    color: #0066ff;
}

.arrow {
    font-size: 12px;
    transition: transform 0.3s ease;
}

.nav-item:hover .arrow {
    transform: rotate(180deg);
}

/* 下拉菜单 */
.dropdown-content {
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
    min-width: 600px;
    padding: 30px;
    display: none;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    z-index: 100;
}

.nav-item:hover .dropdown-content {
    display: grid;
}

.dropdown-section h4 {
    color: #666;
    font-size: 14px;
    margin-bottom: 15px;
    font-weight: 600;
}

.dropdown-section a {
    display: block;
    color: #333;
    text-decoration: none;
    padding: 8px 0;
    font-size: 14px;
    transition: color 0.3s ease;
}

.dropdown-section a:hover {
    color: #0066ff;
}

/* 导航栏右侧操作区 */
.nav-actions {
    display: flex;
    align-items: center;
    gap: 20px;
}

.phone {
    color: #0066ff;
    font-weight: 600;
    font-size: 16px;
}

.search-btn {
    background: none;
    border: none;
    font-size: 18px;
    cursor: pointer;
    padding: 8px;
}

.join-meeting-btn, .start-meeting-btn, .download-btn, .login-btn {
    padding: 10px 20px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
    border: 1px solid transparent;
}

.join-meeting-btn {
    background: #f8f9fa;
    color: #333;
    border-color: #e9ecef;
}

.start-meeting-btn {
    background: #0066ff;
    color: white;
}

.download-btn {
    background: #28a745;
    color: white;
}

.login-btn {
    background: transparent;
    color: #333;
}

.join-meeting-btn:hover, .login-btn:hover {
    background: #e9ecef;
}

.start-meeting-btn:hover {
    background: #0052cc;
}

.download-btn:hover {
    background: #1e7e34;
}

/* 主要内容区域 */
.main-content {
     padding-top: 70px; 
}

/* 主页Hero区域 */
.hero-banner {
    background-color: #f1f1f1f5;
    padding: 100px 0 60px;
    overflow: hidden;
    border-radius: 0 0 40px 40px;
    position: relative;
    margin-bottom: 40px;
}

.hero-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
    min-height: 600px;
}

.hero-text {
    max-width: 500px;
}

.hero-title {
    font-size: 48px;
    font-weight: 700;
    line-height: 1.2;
    color: #333;
    margin-bottom: 24px;
}

.hero-description {
    font-size: 18px;
    line-height: 1.6;
    color: #666;
    margin-bottom: 40px;
}

.hero-buttons {
    display: flex;
    gap: 16px;
}

.btn-download,
.btn-learn-more {
    padding: 16px 32px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.btn-download {
    background: #1664ff;
    color: white;
    border-color: #1664ff;
}

.btn-learn-more {
    background: transparent;
    color: #333;
    border-color: #ddd;
}

.btn-download:hover {
    background: #0052cc;
    border-color: #0052cc;
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(22, 100, 255, 0.3);
}

.btn-learn-more:hover {
    border-color: #1664ff;
    color: #1664ff;
}

/* 会议界面模拟 */
.hero-image {
    display: flex;
    justify-content: center;
    align-items: center;
}

.meeting-interface {
    width: 480px;
    height: 360px;
    background: linear-gradient(135deg, #1664ff 0%, #4285f4 100%);
    border-radius: 20px;
    padding: 16px;
    box-shadow: 0 20px 60px rgba(22, 100, 255, 0.3);
    position: relative;
    overflow: hidden;
}

.interface-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    color: white;
}

.status-indicators {
    display: flex;
    gap: 8px;
    font-size: 12px;
}

.time-display {
    font-size: 14px;
    font-weight: 600;
}

.expand-icon {
    font-size: 16px;
}

.video-participants {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 16px;
}

.participant-video {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    padding: 12px;
    position: relative;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.participant-video.main-speaker {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
}

.participant-avatar {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: linear-gradient(45deg, #ff6b6b, #4ecdc4);
    position: relative;
}

.participant-video:not(.main-speaker) .participant-avatar {
    width: 40px;
    height: 40px;
    margin-bottom: 8px;
}

.participant-avatar.secondary {
    background: linear-gradient(45deg, #a8e6cf, #88d8c0);
}

.participant-avatar.third {
    background: linear-gradient(45deg, #ffd93d, #ffb74d);
}

.participant-name {
    color: white;
    font-size: 12px;
    font-weight: 500;
}

.mic-status {
    position: absolute;
    top: 8px;
    right: 8px;
    font-size: 8px;
}

.interface-sidebar {
    position: absolute;
    right: 16px;
    top: 80px;
    width: 120px;
}

.chat-panel {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    padding: 8px;
    margin-bottom: 12px;
    backdrop-filter: blur(10px);
}

.chat-header {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
}

.calendar-widget {
    background: rgba(255, 255, 255, 0.9);
    border-radius: 8px;
    padding: 12px;
    color: #333;
}

.date-display {
    font-size: 20px;
    font-weight: 700;
    text-align: center;
    margin-bottom: 8px;
}

.calendar-info {
    font-size: 10px;
}

.event-time {
    color: #666;
    margin-bottom: 4px;
}

.event-title {
    font-weight: 600;
}

.control-bar {
    position: absolute;
    bottom: 16px;
    left: 16px;
    right: 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.control-icons {
    display: flex;
    gap: 8px;
}

.control-btn {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    border: none;
    color: white;
    cursor: pointer;
    transition: all 0.3s ease;
    backdrop-filter: blur(10px);
}

.control-btn:hover {
    background: rgba(255, 255, 255, 0.3);
    transform: scale(1.1);
}

.end-meeting-btn {
    background: #ff4757;
    color: white;
    border: none;
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 12px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.end-meeting-btn:hover {
    background: #ff3742;
    transform: scale(1.05);
}

/* Hero区域内的动态服务栏 */
.hero-services {
    margin-top: 50px;
    padding-top: 30px;
    border-top: 1px solid #e9ecef;
}

.hero-services .services-list {
    display: flex;
    justify-content: flex-start;
    gap: 30px;
    flex-wrap: wrap;
}

.hero-services .service-item {
    color: #666;
    text-decoration: none;
    font-size: 16px;
    padding: 12px 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    font-weight: 500;
    border-bottom: 3px solid transparent;
    transform: translateY(0);
}

.hero-services .service-item::after {
    content: '';
    position: absolute;
    width: 1px;
    height: 16px;
    background: #ddd;
    right: -20px;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.3s ease;
}

.hero-services .service-item:last-child::after {
    display: none;
}

.hero-services .service-item:hover {
    color: #1664ff;
    transform: translateY(-2px);
}

.hero-services .service-item:active {
    transform: translateY(0);
    transition: transform 0.1s ease;
}

.hero-services .service-item.active {
    color: #1664ff;
    font-weight: 600;
    border-bottom-color: #1664ff;
    transform: translateY(-1px);
}

/* 点击时的涟漪效果 */
.hero-services .service-item {
    overflow: hidden;
}

.hero-services .service-item::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    border-radius: 50%;
    background: rgba(22, 100, 255, 0.1);
    transform: translate(-50%, -50%);
    transition: width 0.3s ease, height 0.3s ease;
    z-index: -1;
}

.hero-services .service-item:active::before {
    width: 100px;
    height: 100px;
}

/* 内容切换样式 */
.hero-content {
    display: none;
    opacity: 0;
    transform: translateX(30px);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
    min-height: 600px;
}

.hero-content.active {
    display: grid;
    opacity: 1;
    transform: translateX(0);
}

/* 添加更细腻的动画效果 */
.hero-content .hero-text {
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.hero-content .hero-image {
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Hero图片样式 */
.hero-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 20px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1);
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    max-height: 500px;
}

.hero-img:hover {
    transform: scale(1.02);
    box-shadow: 0 25px 80px rgba(0, 0, 0, 0.15);
}

/* 淡入动画关键帧 */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInLeft {
    from {
        opacity: 0;
        transform: translateX(-30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translateX(30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes scaleIn {
    from {
        opacity: 0;
        transform: scale(0.95);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

/* 腾讯元宝界面样式 */
.yuanbao-interface {
    width: 480px;
    height: 360px;
    background: linear-gradient(135deg, #e8f4f8 0%, #d4f1d4 100%);
    border-radius: 20px;
    padding: 20px;
    position: relative;
    box-shadow: 0 20px 60px rgba(0, 150, 100, 0.15);
}

.yuanbao-chat {
    background: white;
    border-radius: 12px;
    padding: 16px;
    height: 250px;
    position: relative;
    border: 1px solid #e0e0e0;
}

.user-info {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}

.user-avatar {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: linear-gradient(45deg, #4CAF50, #81C784);
}

.user-name {
    font-weight: 600;
    font-size: 14px;
    color: #333;
}

.user-status {
    font-size: 12px;
    color: #666;
}

.message-bubble {
    background: #f5f5f5;
    border-radius: 8px;
    padding: 12px;
    margin: 12px 0;
    font-size: 13px;
    line-height: 1.4;
    color: #555;
}

.deepseek-badge {
    position: absolute;
    bottom: 12px;
    right: 12px;
    background: linear-gradient(45deg, #4CAF50, #66BB6A);
    color: white;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
}

.yuanbao-features {
    position: absolute;
    top: 20px;
    right: 20px;
}

.feature-circle {
    width: 60px;
    height: 60px;
    background: linear-gradient(45deg, #4CAF50, #81C784);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 24px;
    box-shadow: 0 8px 25px rgba(76, 175, 80, 0.3);
}

/* 企业版界面样式 */
.enterprise-interface {
    width: 480px;
    height: 360px;
    background: linear-gradient(135deg, #1664ff 0%, #4285f4 100%);
    border-radius: 20px;
    padding: 16px;
    position: relative;
    box-shadow: 0 20px 60px rgba(22, 100, 255, 0.3);
}

.enterprise-features {
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 100%;
}

.participant-count {
    position: absolute;
    top: 20px;
    right: 20px;
    background: rgba(255, 255, 255, 0.9);
    border-radius: 12px;
    padding: 12px 16px;
    text-align: center;
}

.count-label {
    display: block;
    font-size: 12px;
    color: #666;
    margin-bottom: 4px;
}

.count-number {
    display: block;
    font-size: 20px;
    font-weight: 700;
    color: #1664ff;
}

.enterprise-participants {
    display: flex;
    gap: 12px;
    margin-top: 50px;
}

.participant-small {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    padding: 8px;
    text-align: center;
    color: white;
    backdrop-filter: blur(10px);
}

.participant-small .participant-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    margin: 0 auto 6px;
}

.business1 {
    background: linear-gradient(45deg, #ff6b6b, #ffa726);
}

.business2 {
    background: linear-gradient(45deg, #42a5f5, #66bb6a);
}

.business3 {
    background: linear-gradient(45deg, #ab47bc, #ef5350);
}

.participant-small .participant-name {
    font-size: 10px;
    font-weight: 500;
}

.main-presenter {
    flex: 1;
    margin-top: 20px;
}

.presenter-video {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    height: 120px;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.enterprise-icons {
    position: absolute;
    bottom: 20px;
    left: 20px;
    display: flex;
    gap: 16px;
}

.icon-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.icon-circle {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: white;
}

.icon-circle.blue {
    background: #2196F3;
}

.icon-circle.black {
    background: #424242;
}

.icon-item span {
    color: white;
    font-size: 10px;
    font-weight: 500;
}

/* 万象如意（会议室）界面样式 */
.rooms-interface {
    width: 480px;
    height: 360px;
    background: linear-gradient(135deg, #f0f2ff 0%, #e8f4f8 100%);
    border-radius: 20px;
    padding: 20px;
    position: relative;
    overflow: hidden;
}

.meeting-room-scene {
    width: 100%;
    height: 100%;
    position: relative;
}

.room-display {
    width: 60%;
    height: 140px;
    background: linear-gradient(135deg, #2c3e50, #34495e);
    border-radius: 12px;
    position: relative;
    margin: 20px auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.room-screen {
    width: 80%;
    height: 70%;
    background: #1a1a1a;
    border-radius: 8px;
    border: 2px solid #555;
}

.room-people {
    position: absolute;
    bottom: -30px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 8px;
}

.person {
    width: 20px;
    height: 30px;
    border-radius: 10px 10px 6px 6px;
}

.person1 {
    background: linear-gradient(45deg, #3498db, #2980b9);
}

.person2 {
    background: linear-gradient(45deg, #e74c3c, #c0392b);
}

.person3 {
    background: linear-gradient(45deg, #f39c12, #e67e22);
}

.feature-tags {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.feature-tag {
    background: white;
    border-radius: 12px;
    padding: 12px 16px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    max-width: 180px;
    position: relative;
}

.feature-tag.orange::before {
    content: '';
    position: absolute;
    left: -8px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    background: #ff9500;
    border-radius: 50%;
}

.feature-tag.purple::before {
    content: '';
    position: absolute;
    left: -8px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    background: #9c27b0;
    border-radius: 50%;
}

.tag-icon {
    font-size: 20px;
    margin-bottom: 6px;
}

.tag-title {
    display: block;
    font-weight: 600;
    font-size: 14px;
    color: #333;
    margin-bottom: 4px;
}

.tag-desc {
    display: block;
    font-size: 11px;
    color: #666;
    line-height: 1.3;
}

.tianlai-badge {
    position: absolute;
    bottom: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    background: linear-gradient(45deg, #2196F3, #42A5F5);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 25px rgba(33, 150, 243, 0.3);
}

.badge-icon {
    color: white;
    font-size: 20px;
}

/* 专家服务界面样式 */
.expert-interface {
    width: 480px;
    height: 360px;
    background: linear-gradient(135deg, #fff8e1 0%, #f3e5f5 100%);
    border-radius: 20px;
    padding: 20px;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.service-cards {
    display: flex;
    gap: 12px;
    justify-content: center;
}

.service-card {
    background: white;
    border-radius: 12px;
    padding: 16px 12px;
    text-align: center;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
    min-width: 100px;
    flex: 1;
}

.service-card.blue {
    border-top: 3px solid #2196F3;
}

.service-card.green {
    border-top: 3px solid #4CAF50;
}

.service-card.orange {
    border-top: 3px solid #FF9800;
}

.card-icon {
    font-size: 24px;
    margin-bottom: 8px;
}

.service-card h4 {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 6px;
    color: #333;
}

.service-card p {
    font-size: 12px;
    color: #666;
    line-height: 1.3;
}

.expert-team {
    flex: 1;
    position: relative;
    background: linear-gradient(135deg, #f5f5f5, #e8e8e8);
    border-radius: 12px;
    overflow: hidden;
}

.team-photo {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 20px;
}

.team-member {
    width: 60px;
    height: 80px;
    border-radius: 30px 30px 20px 20px;
    position: relative;
}

.member1 {
    background: linear-gradient(45deg, #6a4c93, #9b59b6);
}

.member2 {
    background: linear-gradient(45deg, #3498db, #2980b9);
}

.member3 {
    background: linear-gradient(45deg, #e74c3c, #c0392b);
}

.expert-badge {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    background: linear-gradient(45deg, #FF9800, #F57C00);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 25px rgba(255, 152, 0, 0.3);
}

.expert-badge .badge-icon {
    color: white;
    font-size: 20px;
}

/* 第二部分 - 主要特性展示 */
.features-section {
    background: white;
    padding: 80px 0;
    border-radius: 40px 40px 0 0;
    position: relative;
    margin-top: -40px;
}

.section-header {
    text-align: center;
    margin-bottom: 60px;
}

.section-title {
    font-size: 48px;
    font-weight: 700;
    margin-bottom: 50px;
    color: #333;
}

/* 功能选择栏 */
.feature-tabs {
    display: flex;
    justify-content: flex-start;
    gap: 40px;
    margin-bottom: 30px;
    padding-bottom: 15px;
    border-bottom: 1px solid #e9ecef;
}

.feature-tab {
    padding: 12px 0;
    background: transparent;
    border: none;
    color: #666;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    border-bottom: 3px solid transparent;
    transform: translateY(0);
    overflow: hidden;
}

.feature-tab::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    border-radius: 50%;
    background: rgba(22, 100, 255, 0.1);
    transform: translate(-50%, -50%);
    transition: width 0.3s ease, height 0.3s ease;
    z-index: -1;
}

.feature-tab:active::before {
    width: 120px;
    height: 120px;
}

.feature-tab.active {
    color: #1664ff;
    border-bottom-color: #1664ff;
    font-weight: 600;
    transform: translateY(-1px);
}

.feature-tab:hover:not(.active) {
    color: #1664ff;
    transform: translateY(-2px);
}

.feature-tab:active {
    transform: translateY(0);
    transition: transform 0.1s ease;
}

/* 功能内容区域 */
.feature-content {
    display: none;
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    margin-top: 60px;
}

.feature-content.active {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
    opacity: 1;
    transform: translateY(0);
}

/* Feature内容元素的动画 */
.feature-content .feature-text {
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.feature-content .feature-image {
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Feature视频样式 */
.feature-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1);
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    max-height: 500px;
    background: #f8f9fa;
}

.feature-video:hover {
    transform: scale(1.02);
    box-shadow: 0 25px 80px rgba(0, 0, 0, 0.15);
}

/* 确保视频在不同容器中的表现 */
.feature-image {
    overflow: hidden;
    border-radius: 20px;
    position: relative;
}

/* 添加视频加载时的占位效果 */
.feature-video::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(45deg, #f0f0f0 25%, transparent 25%),
                linear-gradient(-45deg, #f0f0f0 25%, transparent 25%),
                linear-gradient(45deg, transparent 75%, #f0f0f0 75%),
                linear-gradient(-45deg, transparent 75%, #f0f0f0 75%);
    background-size: 20px 20px;
    background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
    animation: loading 1s linear infinite;
    z-index: -1;
}

@keyframes loading {
    0% { background-position: 0 0, 0 10px, 10px -10px, -10px 0px; }
    100% { background-position: 20px 20px, 20px 30px, 30px 10px, 10px 20px; }
}

.feature-text {
    max-width: 500px;
}

.feature-title {
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 30px;
    color: #333;
    line-height: 1.2;
}

.feature-list {
    list-style: none;
    margin-bottom: 40px;
}

.feature-list li {
    padding: 12px 0;
    font-size: 16px;
    color: #666;
    line-height: 1.6;
    position: relative;
    padding-left: 20px;
}

.feature-list li:before {
    content: '✓';
    position: absolute;
    left: 0;
    color: #28a745;
    font-weight: bold;
    font-size: 14px;
}

.feature-list strong {
    color: #333;
    font-weight: 600;
}

.feature-buttons {
    display: flex;
    gap: 16px;
}

.feature-image {
    display: flex;
    justify-content: center;
    align-items: center;
}

/* 演示界面通用样式 */
.meeting-demo,
.webinar-demo,
.rooms-demo,
.connector-demo {
    width: 480px;
    height: 360px;
    background: linear-gradient(135deg, #1664ff 0%, #4285f4 100%);
    border-radius: 20px;
    padding: 20px;
    position: relative;
    box-shadow: 0 20px 60px rgba(22, 100, 255, 0.2);
    overflow: hidden;
}

.demo-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    color: white;
}

.demo-logo {
    font-size: 14px;
    font-weight: 600;
}

.demo-controls {
    display: flex;
    gap: 10px;
}

.control-icon {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    padding: 8px 12px;
    font-size: 14px;
    color: white;
}

/* 视频会议演示 */
.meeting-demo .demo-content {
    height: calc(100% - 60px);
}

.video-grid {
    display: flex;
    flex-direction: column;
    height: 100%;
    gap: 15px;
}

.video-tile.large {
    flex: 1;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: flex-end;
    padding: 15px;
}

.participant-info {
    color: white;
}

.participant-name {
    font-size: 16px;
    font-weight: 600;
    display: block;
}

.participant-role {
    font-size: 12px;
    opacity: 0.8;
}

.video-controls {
    margin-top: auto;
}

.control-bar {
    background: rgba(0, 0, 0, 0.3);
    border-radius: 25px;
    padding: 10px 20px;
}

.control-icons {
    display: flex;
    justify-content: center;
    gap: 20px;
}

.control-icons .icon {
    font-size: 18px;
    opacity: 0.8;
    transition: opacity 0.3s ease;
}

.control-icons .icon:hover {
    opacity: 1;
}

/* 网络研讨会演示 */
.webinar-interface {
    display: flex;
    gap: 15px;
    height: calc(100% - 50px);
}

.host-panel {
    background: rgba(255, 255, 255, 0.95);
    border-radius: 12px;
    padding: 16px;
    width: 250px;
    color: #333;
}

.panel-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 15px;
    font-size: 14px;
    font-weight: 500;
}

.panel-icon {
    font-size: 16px;
    color: #666;
}

.participants-list {
    margin-bottom: 15px;
}

.participant-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid #f0f0f0;
    position: relative;
}

.participant-item:last-child {
    border-bottom: none;
}

.participant-item.selected {
    background: rgba(22, 100, 255, 0.05);
    border-radius: 6px;
    padding: 8px 6px;
    margin: 2px 0;
}

.avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(45deg, #ff6b6b, #4ecdc4);
}

.participant-item:nth-child(2) .avatar {
    background: linear-gradient(45deg, #a8e6cf, #88d8c0);
}

.participant-item:nth-child(3) .avatar {
    background: linear-gradient(45deg, #ffd93d, #ffb74d);
}

.participant-item:nth-child(4) .avatar {
    background: linear-gradient(45deg, #ff9ff3, #f368e0);
}

.name {
    font-size: 14px;
    font-weight: 500;
    flex: 1;
}

.role {
    font-size: 12px;
    color: #666;
}

.check {
    color: #1664ff;
    font-weight: bold;
    position: absolute;
    right: 10px;
}

.assign-btn {
    width: 100%;
    background: #1664ff;
    color: white;
    border: none;
    border-radius: 8px;
    padding: 10px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}

.webinar-stats {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.role-stats {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.role-item {
    display: flex;
    align-items: center;
    gap: 15px;
    background: rgba(255, 255, 255, 0.9);
    border-radius: 12px;
    padding: 15px 20px;
    color: #333;
}

.role-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: white;
}

.role-icon.blue {
    background: #2196F3;
}

.role-icon.orange {
    background: #FF9800;
}

.role-icon.yellow {
    background: #FFC107;
}

.role-info {
    display: flex;
    flex-direction: column;
}

.role-count {
    font-size: 18px;
    font-weight: 700;
    color: #333;
}

.role-label {
    font-size: 12px;
    color: #666;
}

/* 会议室Rooms演示 */
.rooms-interface {
    display: flex;
    flex-direction: column;
    height: calc(100% - 50px);
    gap: 15px;
}

.main-screen {
    flex: 1;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    padding: 15px;
    display: flex;
    flex-direction: column;
}

.screen-content {
    flex: 1;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 8px;
    margin-bottom: 10px;
}

.participants-row {
    display: flex;
    gap: 8px;
    justify-content: center;
}

.participant-small {
    width: 60px;
    height: 45px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 6px;
}

.rooms-controls {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    padding: 15px;
    backdrop-filter: blur(10px);
}

.control-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}

.control-item {
    background: rgba(255, 255, 255, 0.2);
    border: none;
    border-radius: 8px;
    padding: 12px;
    color: white;
    font-size: 16px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.control-item:hover {
    background: rgba(255, 255, 255, 0.3);
    transform: scale(1.05);
}

/* 连接器演示 */
.connector-interface {
    height: calc(100% - 50px);
    display: flex;
    align-items: center;
    justify-content: center;
}

.connection-diagram {
    position: relative;
    width: 300px;
    height: 250px;
}

.device-node {
    position: absolute;
    background: rgba(255, 255, 255, 0.9);
    border-radius: 12px;
    padding: 15px;
    text-align: center;
    color: #333;
    min-width: 80px;
}

.device-node.center {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: rgba(255, 255, 255, 1);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.device-node.left {
    top: 20%;
    left: 0;
}

.device-node.right {
    top: 20%;
    right: 0;
}

.device-node.bottom {
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}

.device-icon {
    font-size: 24px;
    margin-bottom: 8px;
}

.device-label {
    font-size: 12px;
    font-weight: 500;
}

.connection-lines {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
}

.line {
    position: absolute;
    background: rgba(255, 255, 255, 0.3);
    height: 2px;
}

.line-1 {
    top: 30%;
    left: 80px;
    width: 140px;
}

.line-2 {
    top: 30%;
    right: 80px;
    width: 140px;
}

.line-3 {
    bottom: 60px;
    left: 50%;
    width: 2px;
    height: 80px;
    transform: translateX(-50%);
}
/* 行业解决方案轮播 */
.industry-solutions {
    background: #ffffff;
    padding: 80px 0;
    position: relative;
}

.industry-solutions .section-title {
    text-align: center;
    font-size: 40px;
    font-weight: 700;
    color: #333;
    margin-bottom: 50px;
    letter-spacing: -0.5px;
}

.wrapper {
    /*max-width: 1400px;*/
    width: 100%;
    position: relative;
    margin: 0 auto;
    padding: 0 60px 0 60px;
}

.wrapper i {
    height: 50px;
    width: 50px;
    background: rgba(255, 255, 255, 0.9);
    text-align: center;
    line-height: 50px;
    border-radius: 50%;
    cursor: pointer;
    position: absolute;
    top: 50%;
    font-size: 1.25rem;
    transform: translateY(-50%);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.23);
    z-index: 100;
    color: #333;
    transition: all 0.3s ease;
}

.wrapper i:hover {
    background: #007AFF;
    color: white;
    transform: translateY(-50%) scale(1.1);
}

.wrapper i:first-child {
    left: 0;
}

.wrapper i:last-child {
    right: 0;
}

.wrapper .carousel {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    scrollbar-width: 0;
    padding: 0 120px 0 10px;
    gap: 0;
}

.carousel::-webkit-scrollbar {
    display: none;
}

.carousel :where(.card, .img) {
    display: flex;
    align-items: center;
    justify-content: center;
}

.carousel.dragging {
    scroll-snap-type: none;
    scroll-behavior: auto;
}

.carousel.no-transition {
    scroll-behavior: auto;
}

.carousel.dragging .card {
    cursor: grab;
    user-select: none;
}

.carousel .card {
    scroll-snap-align: start;
    height: 380px;
    list-style: none;
    background: #fff;
    border-radius: 16px;
    display: flex;
    cursor: pointer;
    width: 320px;
    padding: 0;
    margin-right: 24px;
    flex: none;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    text-align: center;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    border: 1px solid #f0f0f0;
    overflow: hidden;
    position: relative;
}

.carousel .card:last-child {
    margin-right: 24px;
}

.carousel .card:hover {
    transform: translateY(-8px);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
}

.card:hover .card-content {
    height: 100%;
    border-radius: 16px;
    bottom: 0;
}

.card:hover .short-desc {
    opacity: 0;
    transform: translateY(-10px);
}

.card:hover .detailed-content {
    opacity: 1;
    top: 0;
    transform: translateY(0);
}

.card .img {
    background: transparent;
    width: 100%;
    height: 100%;
    border-radius: 16px 16px 0 0;
    margin-bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.card .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 16px 16px 0 0;
    border: none;
}

.card-content {
    width: 100%;
    height: 180px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    position: absolute;
    bottom: 0;
    left: 0;
    background: #fff;
    border-radius: 16px 16px 0 0;
    transition: height 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94), border-radius 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    will-change: height, border-radius;
    z-index: 2;
}

.card h2 {
    font-weight: 600;
    font-size: 20px;
    margin: 0 0 16px 0;
    color: #333;
    text-align: left;
}

.card-description {
    flex: 1;
    position: relative;
    overflow: hidden;
}

.short-desc {
    color: #666;
    font-size: 14px;
    line-height: 1.5;
    text-align: left;
    margin: 0;
    transition: all 0.3s ease;
}

.detailed-content {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    opacity: 0;
    transition: all 0.3s ease;
    transform: translateY(20px);
}

.detailed-desc {
    color: #666;
    font-size: 13px;
    line-height: 1.4;
    text-align: left;
    margin: 0 0 16px 0;
}

.learn-more-btn {
    background: transparent;
    border: 2px solid #333;
    border-radius: 24px;
    padding: 8px 24px;
    font-size: 14px;
    color: #333;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 500;
}

.learn-more-btn:hover {
    background: #333;
    color: #fff;
}

/* 轮播图动画效果 */
.stagger-animation {
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.6s ease;
}

.stagger-animation.visible {
    opacity: 1;
    transform: translateY(0);
}

.carousel .card {
    animation: slideInFromRight 0.6s ease-out;
}

@keyframes slideInFromRight {
    from {
        opacity: 0;
        transform: translateX(30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.industry-card img {
    width: 100%;
    height: 65%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.industry-card:hover img {
    transform: scale(1.05);
}

.card-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20px;
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(10px);
    height: 35%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 悬停时的扩展内容 */
.card-content-expanded {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 24px;
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(10px);
    height: 80%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    transform: translateY(100%);
    transition: transform 0.4s ease;
    z-index: 5;
}

.industry-card:hover .card-content-expanded {
    transform: translateY(0);
}

.card-content-expanded h3 {
    font-size: 24px;
    font-weight: 600;
    color: #333;
    margin-bottom: 16px;
    margin-top: 0;
}

.card-content-expanded p {
    font-size: 15px;
    color: #666;
    line-height: 1.7;
    margin: 0;
}

.card-content-expanded .full-description {
    font-size: 14px;
    color: #888;
    line-height: 1.6;
    margin-top: 12px;
}

.card-content h3 {
    font-size: 22px;
    font-weight: 600;
    color: #333;
    margin-bottom: 12px;
    margin-top: 0;
}

.card-content p {
    font-size: 14px;
    color: #666;
    line-height: 1.6;
    margin: 0;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
}

/* 轮播导航容器 */
.carousel-navigation {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    z-index: 1000;
}

/* 轮播按钮 */
.carousel-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.95);
    border: 2px solid rgba(0, 0, 0, 0.1);
    font-size: 24px;
    color: #333;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
    pointer-events: auto;
    user-select: none;
    outline: none;
    -webkit-tap-highlight-color: transparent;
}

.carousel-btn:hover {
    background: #007AFF;
    color: white;
    transform: translateY(-50%) scale(1.05);
    box-shadow: 0 6px 20px rgba(0, 122, 255, 0.3);
    border-color: #007AFF;
}

.carousel-btn:active {
    transform: translateY(-50%) scale(0.95);
    transition: transform 0.1s ease;
}

.carousel-prev {
    left: 15px;
}

.carousel-next {
    right: 15px;
}

/* 兼容旧的类名 */
.prev-btn {
    left: 15px;
}

.next-btn {
    right: 15px;
}

/* 千行百业最佳实践 */
.best-practices {
    background: #f8f9fa;
    padding: 80px 0;
    position: relative;
    overflow: visible; /* 确保logo不被截断 */
}

/* 行业标签 */
.industry-tags {
    margin-top: 50px;
    text-align: center;
}

.tags-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px;
    margin-bottom: 40px;
}

.industry-tag {
    padding: 8px 20px;
    background: white;
    border: 2px solid #e9ecef;
    border-radius: 25px;
    font-size: 14px;
    font-weight: 500;
    color: #666;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    user-select: none;
}

.industry-tag:hover {
    border-color: #1664ff;
    color: #1664ff;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(22, 100, 255, 0.15);
}

.industry-tag.active {
    background: #1664ff;
    border-color: #1664ff;
    color: white;
    transform: translateY(-1px);
    box-shadow: 0 4px 15px rgba(22, 100, 255, 0.3);
}

/* 企业logo展示区域 */
.enterprise-logos {
    margin-top: 30px;
    position: relative;
    min-height: 400px;
}

.logo-category {
    display: none;
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.logo-category.active {
    display: block;
    opacity: 1;
    transform: translateY(0);
}

.logos-grid {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 20px;
    padding: 30px;
    background: white;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.logo-item {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    border: 1px solid #f0f0f0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    min-height: 70px;
}

.logo-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
    background: white;
    border-color: #e0e0e0;
}

.logo-img {
    max-width: 100%;
    max-height: 50px;
    width: auto;
    height: auto;
    object-fit: contain;
    transition: transform 0.3s ease;
    filter: grayscale(0.3);
}

.logo-item:hover .logo-img {
    transform: scale(1.05);
    filter: grayscale(0);
}

.category-logos {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
    transition: transform 0.3s ease;
}

.category-logos:hover {
    transform: scale(1.02);
}

.best-practices .section-header {
    text-align: center;
    margin-bottom: 60px;
}

.best-practices .section-title {
    font-size: 40px;
    font-weight: 700;
    color: #333;
    margin-bottom: 20px;
    letter-spacing: -0.5px;
}

.best-practices .section-subtitle {
    font-size: 16px;
    color: #666;
    line-height: 1.6;
    max-width: 800px;
    margin: 0 auto;
}

/* 千行百业最佳实践 - 完全重新设计 */
.practices-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 20px 60px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible; /* 确保logo不被截断 */
}

.practices-grid {
    display: flex;
    gap: 40px;
    align-items: flex-start;
    justify-content: flex-start;
    overflow-x: auto;
    overflow-y: visible; /* 确保logo在垂直方向不被截断 */
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding: 60px 20px 0; /* 顶部padding为logo留出空间 */
}

.practices-grid::-webkit-scrollbar {
    display: none;
}

.practice-item {
    flex: 0 0 350px;
    text-align: center;
    padding: 60px 30px 50px; /* 减少顶部padding */
    background: #f8f9fa;
    border-radius: 24px;
    position: relative;
    transition: all 0.3s ease;
    border: 1px solid #e8ecf0;
    scroll-snap-align: start;
    min-height: 280px;
    overflow: visible; /* 确保logo不被截断 */
    background: linear-gradient(0deg,rgba(186,216,243,.04) 38.33%,rgba(186,216,243,.2)),#fff;

}
.practices-grid .practice-item:nth-child(2) {
    background:linear-gradient(0deg, rgba(247, 208, 208, 0.04) 39.5%, rgba(247, 208, 208, 0.2) 100%), rgb(255, 255, 255);
}

.practices-grid .practice-item:nth-child(3) {
    background:linear-gradient(0deg, rgba(89, 149, 82, 0.02) 38.83%, rgba(89, 149, 82, 0.08) 100%), rgb(255, 255, 255); width: 100%; display: inline-block;
}

.practices-grid .practice-item:nth-child(4) {
    background:linear-gradient(0deg, rgba(216, 216, 216, 0.04) 39.5%, rgba(216, 216, 216, 0.2) 100%), rgb(255, 255, 255); width: 100%; display: inline-block;
}

.practice-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.practice-logo {
    position: absolute;
    top: -50px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
}

.logo-circle {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 600;
    font-size: 18px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    border: 4px solid white;
}

.logo-circle.blue {
    background: linear-gradient(135deg, #1976d2 0%, #1565c0 100%);
}

.logo-circle.orange {
    background: linear-gradient(135deg, #ff9800 0%, #f57c00 100%);
}

.logo-circle.green {
    background: linear-gradient(135deg, #4caf50 0%, #388e3c 100%);
}

.logo-circle.red {
    background: linear-gradient(135deg, #f44336 0%, #d32f2f 100%);
}

.logo-circle.purple {
    background: linear-gradient(135deg, #9c27b0 0%, #7b1fa2 100%);
}

.logo-circle.teal {
    background: linear-gradient(135deg, #009688 0%, #00695c 100%);
}

.logo-circle.red {
    background: linear-gradient(135deg, #ff6b6b 0%, #ee5a24 100%);
}

.logo-circle.teal {
    background: linear-gradient(135deg, #48cae4 0%, #0077b6 100%);
}

.logo-circle.blue {
    background: linear-gradient(135deg, #4dabf7 0%, #1864ab 100%);
}

.logo-circle.purple {
    background: linear-gradient(135deg, #9775fa 0%, #6c5ce7 100%);
}

.logo-circle.orange {
    background: linear-gradient(135deg, #ffa726 0%, #f57c00 100%);
}

.logo-circle.midea-blue {
    background: linear-gradient(135deg, #1565c0 0%, #0d47a1 100%);
}

.logo-circle.future-orange {
    background: linear-gradient(135deg, #ff8f00 0%, #e65100 100%);
}

.logo-circle.grid-green {
    background: linear-gradient(135deg, #2e7d32 0%, #1b5e20 100%);
}

.practice-title {
    font-size: 22px;
    font-weight: 600;
    color: #333;
    margin: 30px 0 20px;
    text-align: center;
}

.practice-description {
    font-size: 15px;
    color: #666;
    line-height: 1.7;
    text-align: center;
    margin: 0;
    padding: 0 15px;
}

/* 导航按钮 */
.practices-nav-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid #e0e0e0;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    z-index: 100;
    color: #666;
}

.practices-nav-btn:hover {
    background: #007AFF;
    color: white;
    transform: translateY(-50%) scale(1.1);
    box-shadow: 0 4px 12px rgba(0, 122, 255, 0.3);
}

.practices-prev {
    left: -20px;
}

.practices-next {
    right: -20px;
}

/* 响应式设计 */
@media screen and (max-width: 1200px) {
    .practices-container {
        padding: 120px 10px 60px; /* 保持顶部空间 */
    }

    .practice-item {
        flex: 0 0 320px;
    }
}

@media screen and (max-width: 1024px) {
    .practices-grid {
        gap: 30px;
    }

    .practice-item {
        flex: 0 0 300px;
    }
}

@media screen and (max-width: 768px) {
    .practices-container {
        padding: 100px 10px 40px; /* 保持顶部空间但稍微减少 */
    }

    .practices-grid {
        gap: 20px;
        padding: 50px 10px 0; /* 调整顶部padding */
    }

    .practice-item {
        flex: 0 0 280px;
        padding: 50px 20px 40px; /* 减少顶部padding */
    }

    .logo-circle {
        width: 80px;
        height: 80px;
        font-size: 16px;
    }

    .practice-logo {
        top: -40px;
    }

    .practice-title {
        font-size: 20px;
        margin: 25px 0 15px;
    }

    .practice-description {
        font-size: 14px;
        padding: 0 10px;
    }
}

@media screen and (max-width: 480px) {
    .practices-nav-btn {
        width: 35px;
        height: 35px;
        font-size: 14px;
    }

    .practices-prev {
        left: -15px;
    }

    .practices-next {
        right: -15px;
    }

    .practice-item {
        flex: 0 0 260px;
    }
}



/* 行业标签 */
.industry-tags {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-top: 40px;
}

.tags-container {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: center;
    max-width: 1000px;
}

.industry-tag {
    padding: 8px 16px;
    background: #f1f3f4;
    color: #666;
    border-radius: 20px;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.3s ease;
    white-space: nowrap;
}

.industry-tag.active {
    background: #1664ff;
    color: white;
}

.industry-tag:hover:not(.active) {
    background: #e3f2fd;
    color: #1664ff;
}

.tags-scroll-btn {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(0, 0, 0, 0.1);
    font-size: 16px;
    color: #666;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.tags-scroll-btn:hover {
    background: #fff;
    color: #1664ff;
    border-color: rgba(22, 100, 255, 0.3);
}

.carousel-indicators {
    display: flex;
    justify-content: center;
    gap: 16px;
    margin-top: 40px;
}

.indicator {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #ddd;
    cursor: pointer;
    transition: all 0.3s ease;
}

.indicator.active {
    background: #1664ff;
    transform: scale(1.3);
}

/* 产品详细介绍 */
.product-details {
    padding: 80px 0;
}

.product-detail {
    display: none;
    margin-bottom: 100px;
}

.product-detail.active {
    display: block;
}

.detail-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.detail-text h2 {
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 30px;
    color: #333;
}

.feature-list {
    list-style: none;
    margin-bottom: 40px;
}

.feature-list li {
    padding: 10px 0;
    font-size: 16px;
    color: #666;
    position: relative;
    padding-left: 20px;
}

.feature-list li:before {
    content: '✓';
    position: absolute;
    left: 0;
    color: #28a745;
    font-weight: bold;
}

.cta-buttons {
    display: flex;
    gap: 20px;
}

.btn-outline,
.btn-primary {
    padding: 15px 30px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    display: inline-block;
    text-align: center;
}

.btn-outline {
    background: transparent;
    color: #0066ff;
    border: 2px solid #0066ff;
}

.btn-primary {
    background: #0066ff;
    color: white;
    border: 2px solid #0066ff;
}

.btn-outline:hover {
    background: #0066ff;
    color: white;
}

.btn-primary:hover {
    background: #0052cc;
    border-color: #0052cc;
}

/* 模拟界面展示 */
.detail-image {
    display: flex;
    justify-content: center;
    align-items: center;
}

.mock-video-interface,
.mock-webinar-interface,
.mock-rooms-interface,
.mock-connector-interface {
    width: 400px;
    height: 300px;
    background: #f8f9fa;
    border-radius: 12px;
    border: 1px solid #e9ecef;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.video-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    width: 80%;
    height: 70%;
}

.video-tile {
    background: #0066ff;
    border-radius: 8px;
    opacity: 0.7;
}

.webinar-stage {
    width: 80%;
    height: 50%;
    background: #0066ff;
    border-radius: 8px;
    margin-bottom: 10px;
}

.participant-list {
    width: 80%;
    height: 30%;
    background: #e9ecef;
    border-radius: 8px;
}

.rooms-display,
.connector-diagram {
    width: 80%;
    height: 80%;
    background: linear-gradient(45deg, #0066ff, #667eea);
    border-radius: 8px;
}

/* 解决方案展示 */
.solutions-section {
    padding: 80px 0;
    background: #f8f9fa;
    text-align: center;
}

.solutions-section h2 {
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 50px;
    color: #333;
}

.solutions-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 20px;
    max-width: 800px;
    margin: 0 auto;
}

.solution-item {
    background: white;
    padding: 20px;
    border-radius: 8px;
    font-weight: 500;
    border: 1px solid #e9ecef;
    transition: all 0.3s ease;
    cursor: pointer;
}

.solution-item:hover {
    border-color: #0066ff;
    color: #0066ff;
    transform: translateY(-2px);
}

/* 全球覆盖 */
.global-coverage {
    padding: 80px 0;
    text-align: center;
}

.global-coverage h2 {
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 30px;
    color: #333;
}

.global-coverage p {
    font-size: 18px;
    color: #666;
    margin-bottom: 20px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

/* 推荐方案 */
.recommended-plans {
    padding: 80px 0;
    background: #f8f9fa;
    text-align: center;
}

.recommended-plans h2 {
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 40px;
    color: #333;
}

.plan-tabs {
    display: flex;
    justify-content: center;
    gap: 0;
}

.plan-tab {
    padding: 15px 30px;
    background: white;
    border: 1px solid #e9ecef;
    color: #666;
    cursor: pointer;
    transition: all 0.3s ease;
}

.plan-tab:first-child {
    border-radius: 25px 0 0 25px;
}

.plan-tab:last-child {
    border-radius: 0 25px 25px 0;
}

.plan-tab.active {
    background: #0066ff;
    color: white;
    border-color: #0066ff;
}

/* 会议安全保障 */
.security-guarantee {
    background: white;
    padding: 80px 0;
}

.security-title {
    text-align: center;
    font-size: 36px;
    font-weight: 700;
    color: #333;
    margin-bottom: 60px;
    letter-spacing: -0.5px;
}

.security-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
    max-width: 1000px;
    margin: 0 auto;
}

.security-card {
    background: white;
    border-radius: 16px;
    padding: 40px 30px;
    text-align: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
    cursor: pointer;
}

.security-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12);
}

.security-icon {
    width: 80px;
    height: 80px;
    margin: 0 auto 25px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.security-name {
    font-size: 20px;
    font-weight: 600;
    color: #333;
    margin-bottom: 15px;
}

.security-desc {
    font-size: 15px;
    color: #666;
    line-height: 1.6;
}

/* 安全图标样式 */
.security-icon.green {
    background: linear-gradient(135deg, #4caf50, #388e3c);
}

.security-icon.orange {
    background: linear-gradient(135deg, #ff9800, #f57c00);
}

.security-icon.blue {
    background: linear-gradient(135deg, #2196f3, #1976d2);
}

/* 盾牌图标 */
.icon-shield {
    position: relative;
    width: 40px;
    height: 45px;
}

.shield-body {
    width: 40px;
    height: 35px;
    background: white;
    border-radius: 20px 20px 0 0;
    position: relative;
}

.shield-body::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 15px solid white;
}

.shield-check {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #4caf50;
    font-size: 20px;
    font-weight: bold;
    z-index: 2;
}

/* 管理员图标 */
.icon-admin {
    position: relative;
    width: 40px;
    height: 40px;
}

.admin-person {
    width: 20px;
    height: 20px;
    background: white;
    border-radius: 50%;
    position: absolute;
}

.admin-person:first-child {
    top: 0;
    left: 0;
}

.admin-person:nth-child(2) {
    bottom: 0;
    right: 0;
}

.admin-person::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 12px;
    height: 12px;
    background: #ff9800;
    border-radius: 50%;
}

/* 认证图标 */
.icon-cert {
    position: relative;
    width: 40px;
    height: 40px;
}

.cert-badge {
    width: 40px;
    height: 40px;
    background: white;
    border-radius: 50%;
    position: relative;
}

.cert-badge::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 32px;
    height: 32px;
    background: #2196f3;
    border-radius: 50%;
}

.cert-star {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 16px;
    font-weight: bold;
    z-index: 2;
}

/* 全方位服务 */
.comprehensive-service {
    background: white;
    padding: 80px 0;
}

.service-title {
    text-align: center;
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 60px;
    letter-spacing: -0.5px;
}

.service-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    max-width: 1200px;
    margin: 0 auto;
}

.service-card {
    background: white;
    border-radius: 16px;
    padding: 30px 20px;
    text-align: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
    cursor: pointer;
}

.service-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12);
}

.service-icon {
    width: 60px;
    height: 60px;
    margin: 0 auto 20px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.service-name {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin-bottom: 12px;
}

.service-desc {
    font-size: 14px;
    color: #666;
    line-height: 1.6;
}

/* 图标样式 */
.service-icon.expert {
    background: linear-gradient(135deg, #ff9800, #f57c00);
}

.service-icon.support {
    background: linear-gradient(135deg, #2196f3, #1976d2);
}

.service-icon.help {
    background: linear-gradient(135deg, #4caf50, #388e3c);
}

.service-icon.practice {
    background: linear-gradient(135deg, #ff9800, #f57c00);
}

.service-icon.escort {
    background: linear-gradient(135deg, #4caf50, #388e3c);
}

.service-icon.rooms {
    background: linear-gradient(135deg, #2196f3, #1976d2);
}

.service-icon.mra {
    background: linear-gradient(135deg, #2196f3, #1976d2);
}

.service-icon.dev {
    background: linear-gradient(135deg, #4caf50, #388e3c);
}

/* 具体图标 */
.icon-person {
    width: 24px;
    height: 24px;
    background: white;
    border-radius: 50%;
    position: relative;
}

.icon-person::before {
    content: '';
    position: absolute;
    top: 6px;
    left: 50%;
    transform: translateX(-50%);
    width: 12px;
    height: 8px;
    background: #ff9800;
    border-radius: 50% 50% 0 0;
}

.icon-bubble {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 16px;
    height: 16px;
    background: white;
    border-radius: 50%;
    border: 2px solid #ff9800;
}

.icon-gear {
    width: 24px;
    height: 24px;
    background: white;
    border-radius: 50%;
    position: relative;
}

.icon-gear::before {
    content: '⚙';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 16px;
    color: #2196f3;
}

.icon-question {
    width: 24px;
    height: 24px;
    background: white;
    border-radius: 50%;
    position: relative;
}

.icon-question::before {
    content: '?';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 18px;
    font-weight: bold;
    color: #4caf50;
}

.icon-document {
    width: 24px;
    height: 24px;
    background: white;
    border-radius: 4px;
    position: relative;
}

.icon-document::before {
    content: '';
    position: absolute;
    top: 4px;
    left: 4px;
    right: 4px;
    bottom: 4px;
    background: #ff9800;
    border-radius: 2px;
}

.icon-arrows {
    width: 24px;
    height: 24px;
    background: white;
    border-radius: 50%;
    position: relative;
}

.icon-arrows::before {
    content: '↑↑';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 12px;
    color: #4caf50;
    font-weight: bold;
}

.icon-building {
    width: 24px;
    height: 24px;
    background: white;
    border-radius: 4px;
    position: relative;
}

.icon-building::before {
    content: '🏢';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 16px;
}

.icon-chart {
    width: 24px;
    height: 24px;
    background: white;
    border-radius: 4px;
    position: relative;
}

.icon-chart::before {
    content: '📊';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 16px;
}

.icon-code {
    width: 24px;
    height: 24px;
    background: white;
    border-radius: 4px;
    position: relative;
}

.icon-code::before {
    content: '<>';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 14px;
    font-weight: bold;
    color: #4caf50;
}

/* 打造沉浸式会议体验 */
.immersive-experience {
    background: #f8f9fa;
    padding: 60px 0;
}

.section-title-center {
    text-align: center;
    margin-bottom: 50px;
}

.immersive-title {
    font-size: 36px;
    font-weight: 600;
    color: #000;
    margin: 0;
    line-height: 1.2;
}

/* 体验模块 */
.experience-modules {
    display: flex;
    gap: 30px;
    margin-bottom: 80px;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

.experience-module {
    flex: 1;
    height: 400px;
    border-radius: 20px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.3s ease;
}

.experience-module:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}

/* XX天籁模块 */
.tianlai-module {
    background: linear-gradient(135deg, #1976d2 0%, #1565c0 100%);
}

.tianlai-module .module-background {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 300"><rect width="400" height="300" fill="rgba(255,255,255,0.1)"/><circle cx="100" cy="150" r="50" fill="rgba(255,255,255,0.05)"/><circle cx="300" cy="100" r="40" fill="rgba(255,255,255,0.05)"/></svg>');
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0.3;
}

/* 3D通话模块 */
.threed-module {
    background: linear-gradient(135deg, #1a1a1a 0%, #0d47a1 100%);
}

.threed-module .module-background {
    background: radial-gradient(circle at 70% 30%, rgba(255,255,255,0.1) 0%, transparent 50%);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.module-content {
    position: relative;
    z-index: 2;
    padding: 40px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    color: white;
}

.module-icon {
    margin-bottom: 20px;
}

.sound-wave-icon {
    display: flex;
    gap: 4px;
    align-items: flex-end;
}

.wave-bar {
    width: 6px;
    background: white;
    border-radius: 3px;
    animation: wave 1.5s ease-in-out infinite;
}

.wave-bar:nth-child(1) { height: 20px; animation-delay: 0s; }
.wave-bar:nth-child(2) { height: 30px; animation-delay: 0.2s; }
.wave-bar:nth-child(3) { height: 25px; animation-delay: 0.4s; }
.wave-bar:nth-child(4) { height: 35px; animation-delay: 0.6s; }

@keyframes wave {
    0%, 100% { transform: scaleY(1); }
    50% { transform: scaleY(1.5); }
}

.module-title {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 15px;
}

.module-description {
    font-size: 16px;
    line-height: 1.6;
    opacity: 0.9;
}

.module-badge {
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 14px;
    opacity: 0.8;
}

.module-graphic {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 120px;
    height: 120px;
}

.hologram-person {
    width: 100%;
    height: 100%;
    background: radial-gradient(circle, rgba(255,165,0,0.8) 0%, rgba(255,20,147,0.6) 50%, rgba(138,43,226,0.4) 100%);
    border-radius: 50%;
    position: relative;
    animation: hologram 3s ease-in-out infinite;
}

.hologram-person::before {
    content: '';
    position: absolute;
    top: 20%;
    left: 50%;
    transform: translateX(-50%);
    width: 60%;
    height: 40%;
    background: rgba(255,255,255,0.3);
    border-radius: 50% 50% 0 0;
}

@keyframes hologram {
    0%, 100% { transform: scale(1) rotate(0deg); }
    50% { transform: scale(1.1) rotate(5deg); }
}

.phone-icon {
    position: absolute;
    bottom: 20px;
    right: 20px;
    width: 40px;
    height: 40px;
}

.receiver {
    width: 20px;
    height: 30px;
    background: white;
    border-radius: 10px;
    position: relative;
}

.receiver::before {
    content: '';
    position: absolute;
    top: -5px;
    left: 50%;
    transform: translateX(-50%);
    width: 30px;
    height: 8px;
    background: white;
    border-radius: 4px;
}

.sound-lines {
    position: absolute;
    top: -10px;
    right: 25px;
}

.sound-line {
    width: 20px;
    height: 2px;
    background: white;
    margin-bottom: 3px;
    border-radius: 1px;
    transform-origin: right;
}

.sound-line:nth-child(1) { transform: rotate(-15deg); }
.sound-line:nth-child(2) { transform: rotate(-30deg); }

/* 交互式图片区域 */
.interactive-images {
    display: flex;
    gap: 40px;
    max-width: 1200px;
    margin: 0 auto;
    height: 450px;
}

.image-container {
    flex: 1;
    position: relative;
    transition: all 0.5s ease;
    cursor: pointer;
    border-radius: 20px;
    overflow: hidden;
}

.image-container:hover {
    flex: 1.5;
}

    .image-container:not(:hover) {
        flex: 0.8;
    }
.interactive-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 20px;
    transition: all 0.5s ease;
    background: #f8f9fa;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .nav-container {
        flex-direction: row;
        height: auto;
        padding: 12px 20px;
        justify-content: space-between;
        align-items: center;
    }
    
    .nav-menu {
        margin: 0;
        flex-wrap: nowrap;
        justify-content: flex-end;
        gap: 20px;
    }
    
    .logo img {
        height: 32px;
    }
    
    .nav-link {
        font-size: 14px;
        padding: 8px 12px;
    }
    
    .nav-actions {
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px;
    }
    
    .dropdown-content {
        grid-template-columns: 1fr;
        min-width: 300px;
    }
    
    /* Hero section 响应式 */
    .hero-banner {
        padding: 80px 0 40px;
    }
    
    .hero-content {
        grid-template-columns: 1fr;
        gap: 40px;
        text-align: center;
    }
    
    .hero-title {
        font-size: 36px;
    }
    
    .hero-description {
        font-size: 16px;
    }
    
    .hero-buttons {
        justify-content: center;
        flex-wrap: wrap;
    }
    
    .meeting-interface {
        width: 100%;
        max-width: 400px;
        height: 300px;
    }
    
    .interface-sidebar {
        right: 12px;
        top: 60px;
        width: 100px;
    }
    
    .calendar-widget {
        padding: 8px;
    }
    
    .date-display {
        font-size: 16px;
    }
    
    .hero-services .services-list {
        gap: 20px;
        justify-content: flex-start;
        flex-wrap: wrap;
    }
    
    .hero-services .service-item {
        font-size: 14px;
        padding: 8px 0;
    }
    
    .hero-services .service-item::after {
        display: none;
    }
    
    /* Hero区域圆角调整 */
    .hero-banner {
        border-radius: 0 0 20px 20px;
        margin-bottom: 20px;
    }
    
    .features-section {
        border-radius: 20px 20px 0 0;
        margin-top: -20px;
    }
    
    .section-title {
        font-size: 32px;
    }
    
    .feature-tabs {
        flex-wrap: wrap;
        gap: 20px;
    }
    
    .feature-tab {
        padding: 8px 0;
        font-size: 14px;
    }
    
    .feature-content.active {
        grid-template-columns: 1fr;
        gap: 40px;
        text-align: center;
    }
    
    .feature-title {
        font-size: 28px;
    }
    
    .feature-buttons {
        justify-content: center;
        flex-wrap: wrap;
    }

    /* 各种界面的响应式调整 */
    .meeting-interface,
    .yuanbao-interface,
    .enterprise-interface,
    .rooms-interface,
    .expert-interface,
    .meeting-demo,
    .webinar-demo,
    .rooms-demo,
    .connector-demo {
        width: 100%;
        max-width: 400px;
        height: 280px;
    }
    
    .webinar-interface {
        flex-direction: column;
        gap: 10px;
    }
    
    .host-panel {
        width: 100%;
    }
    
    .role-stats {
        flex-direction: row;
        gap: 10px;
    }
    
    .role-item {
        padding: 10px 12px;
        min-width: 100px;
    }
    
    /* 行业解决方案响应式 */
    .industry-solutions .section-title {
        font-size: 28px;
    }
    
    .carousel-container {
        margin: 0 20px;
        padding: 0 50px;
    }
    
    .carousel-track {
        gap: 20px;
    }
    
    .industry-card {
        flex: 0 0 calc(50% - 10px);
        height: 320px;
    }

    /* 千行百业最佳实践响应式 */
    .best-practices .section-title {
        font-size: 32px;
    }
    
    .practices-carousel-container {
        padding: 0 50px;
    }
    
    .practice-card {
        flex: 0 0 calc(50% - 15px);
        height: 260px;
        padding: 30px 20px;
    }
    
    .logo-circle {
        width: 60px;
        height: 60px;
        font-size: 14px;
    }
    
    .practice-title {
        font-size: 18px;
    }
    
    .practice-description {
        font-size: 13px;
    }
    
    .industry-tags {
        margin-top: 30px;
    }
    
    .tags-container {
        gap: 8px;
    }
    
    .industry-tag {
        padding: 6px 12px;
        font-size: 13px;
    }
    
    .card-image {
        height: 220px; /* 平板端适中尺寸 */
        margin-bottom: 18px;
    }
    
    .card-title {
        font-size: 20px; /* 平板端适中字体 */
        margin-bottom: 12px;
    }
    
    .card-description {
        font-size: 14px; /* 平板端适中字体 */
    }
    
    .carousel-btn {
        width: 42px;
        height: 42px;
        font-size: 18px;
    }
    
    .prev-btn {
        left: 12px;
    }
    
    .next-btn {
        right: 12px;
    }
    
    .feature-tags {
        position: static;
        transform: none;
        margin-top: 20px;
        gap: 10px;
    }
    
    .feature-tag {
        max-width: none;
        font-size: 12px;
    }
    
    .service-cards {
        flex-direction: column;
        gap: 8px;
    }
    
    .hero-section h1 {
        font-size: 32px;
    }
    
    .detail-content {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .feature-tabs {
        flex-wrap: wrap;
        gap: 5px;
    }
    
    .solutions-grid {
        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    }
    
    .cta-buttons {
        flex-direction: column;
        align-items: center;
    }
    
    /* 新闻中心平板端适配 */
    .newscontainer {
        flex-wrap: wrap;
        gap: 16px;
        padding: 0 15px;
    }
    
    .newsitem {
        flex: 0 0 calc(50% - 8px);
    }
    
    .newsitem img {
        height: 160px;
    }
    
    .newsitem-text {
        font-size: 14px;
        padding: 16px;
    }
}

/* 新闻中心区域 */
.newcenter {
    background: #f8f9fa;
    padding: 60px 0;
}

.newscontainer {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    gap: 24px;
    justify-content: space-between;
    align-items: flex-start;
}

.newsitem {
    flex: 1;
    background: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    cursor: pointer;
    display: flex;
    flex-direction: column;
}

.newsitem:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.newsitem img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
}

.newsitem-text {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    padding: 20px;
    line-height: 1.5;
    flex: 1;
    display: flex;
    align-items: center;
}

    .industry-tags {
        margin-top: 40px;
        padding: 0 20px;
    }
    
    .tags-container {
        gap: 12px;
        margin-bottom: 30px;
    }
    
    .industry-tag {
        padding: 8px 18px;
        font-size: 13px;
    }
    
    .enterprise-logos {
        margin-top: 25px;
        min-height: 350px;
        padding: 0 20px;
    }
    
    .logos-grid {
        border-radius: 18px;
        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
        gap: 15px;
        padding: 20px;
    }
    
    .logo-img {
        max-height: 40px;
    }


@media (max-width: 480px) {
    .hero-title {
        font-size: 28px;
    }
    
    .hero-description {
        font-size: 14px;
    }
    
    .btn-download,
    .btn-learn-more {
        padding: 14px 24px;
        font-size: 14px;
    }
    
    .meeting-interface {
        height: 250px;
    }
    
    .hero-services .services-list {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }
    
    /* 行业解决方案小屏幕适配 */
    .industry-solutions .section-title {
        font-size: 24px;
    }
    
    .carousel-container {
        margin: 0 15px;
        padding: 0 45px; /* 手机端给按钮留空间 */
    }
    
    .carousel-track {
        gap: 16px;
    }
    
    .industry-card {
        flex: 0 0 calc(100% - 16px);
        height: 280px;
    }

    /* 千行百业最佳实践手机端 */
    .best-practices .section-title {
        font-size: 28px;
    }
    
    .practices-carousel-container {
        padding: 0 40px;
    }
    
    .practice-card {
        flex: 0 0 calc(100% - 20px);
        height: 240px;
        padding: 25px 20px;
    }
    
    .logo-circle {
        width: 50px;
        height: 50px;
        font-size: 12px;
    }
    
    .practice-title {
        font-size: 16px;
    }

    .industry-tags {
        margin-top: 30px;
        padding: 0 15px;
    }
    
    .tags-container {
        gap: 10px;
        margin-bottom: 25px;
    }
    
    .industry-tag {
        padding: 6px 16px;
        font-size: 13px;
        border-radius: 20px;
    }
    
    .enterprise-logos {
        margin-top: 20px;
        min-height: 300px;
        padding: 0 15px;
    }
    
    .logos-grid {
        border-radius: 15px;
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
        grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
        gap: 10px;
        padding: 15px;
    }
    
    .logo-item {
        padding: 10px;
        min-height: 60px;
    }
    
    .logo-img {
        max-height: 30px;
    }
    
    .category-logos:hover {
        transform: none;
    }
    
    .practice-description {
        font-size: 12px;
    }
    
    .tags-container {
        gap: 6px;
        flex-wrap: wrap;
    }
    
    .industry-tag {
        padding: 5px 10px;
        font-size: 12px;
    }
    
    .card-image {
        height: 200px; /* 手机端保持合适尺寸 */
        margin-bottom: 16px;
    }
    
    .card-title {
        font-size: 20px; /* 手机端保持可读性 */
        margin-bottom: 10px;
    }
    
    .card-description {
        font-size: 14px; /* 手机端保持可读性 */
    }
    
    .carousel-btn {
        width: 38px;
        height: 38px;
        font-size: 16px;
    }
    
    .prev-btn {
        left: 8px;
    }
    
    .next-btn {
        right: 8px;
    }
    
    .hero-section h1 {
        font-size: 24px;
    }
    
    .detail-text h2 {
        font-size: 24px;
    }
    
    .solutions-section h2,
    .global-coverage h2,
    .recommended-plans h2,
    .immersive-experience h2,
    .comprehensive-service h2,
    .security-guarantee h2 {
        font-size: 24px;
    }
    
    /* 新闻中心手机端适配 */
    .newscontainer {
        flex-direction: column;
        gap: 12px;
        padding: 0 10px;
    }
    
    .newsitem {
        flex: none;
    }
    
    .newsitem img {
        height: 140px;
    }
    
    .newsitem-text {
        font-size: 13px;
        padding: 12px;
    }
    
    /* 沉浸式体验平板端适配 */
        .experience-modules {
        flex-direction: column;
        gap: 20px;
    }

    .experience-module {
        height: 300px;
    }

    
    .interactive-images {
        flex-direction: column;
        height: auto;
        gap: 20px;
    }
    
    .image-container {
        height: 300px;
    }
    
    .image-container:hover {
        flex: none;
        transform: scale(1.02);
    }
    
    .image-container:not(:hover) {
        flex: none;
    }

    .security-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .security-card {
        padding: 30px 20px;
    }

    .security-title {
        font-size: 28px;
        margin-bottom: 40px;
    }

    .security-icon {
        width: 70px;
        height: 70px;
        margin-bottom: 20px;
    }

    .security-name {
        font-size: 18px;
        margin-bottom: 12px;
    }

    .security-desc {
        font-size: 14px;
    }

    /* 导航栏移动端优化 */
    .header {
        padding: 0;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    }
    
    .nav-container {
        padding: 10px 15px;
        gap: 10px;
    }
    
    .logo img {
        height: 26px;
    }
    
    .nav-menu {
        gap: 12px;
    }
    
    .nav-link {
        font-size: 13px;
        padding: 6px 10px;
        white-space: nowrap;
        border-radius: 6px;
        transition: all 0.3s ease;
    }
    
    .nav-link:hover {
        background: rgba(0, 122, 255, 0.1);
        color: #007AFF;
    }
}

/* 极小屏幕适配 */
@media (max-width: 375px) {
    .nav-container {
        padding: 8px 12px;
        gap: 8px;
    }
    
    .logo img {
        height: 24px;
    }
    
    .nav-menu {
        gap: 8px;
    }
    
    .nav-link {
        font-size: 12px;
        padding: 4px 8px;
    }
}

/* Footer样式 */
.footer {
    background: #f8f9fa;
    padding: 60px 0 20px;
}

/* 下载区域 */
.download-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 60px;
    padding-bottom: 40px;
    border-bottom: 1px solid #e9ecef;
}

.download-text h2 {
    font-size: 28px;
    font-weight: 700;
    color: #333;
    margin-bottom: 8px;
}

.download-text p {
    font-size: 16px;
    color: #666;
}

.download-platforms {
    display: flex;
    gap: 24px;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.platform-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    padding: 8px;
    border-radius: 12px;
}

.platform-item:hover {
    transform: translateY(-4px);
    background: rgba(255, 255, 255, 0.1);
}

.platform-icon {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    transition: all 0.3s ease;
    color: white;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.platform-icon:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
}

.platform-icon.apple {
    background: linear-gradient(135deg, #007AFF 0%, #0051D5 100%);
}

.platform-icon.windows {
    background: linear-gradient(135deg, #0078D4 0%, #106EBE 100%);
}

.platform-icon.linux {
    background: linear-gradient(135deg, #FFA500 0%, #FF8C00 100%);
}

.platform-icon.outlook {
    background: linear-gradient(135deg, #0078D4 0%, #005A9E 100%);
}

.platform-icon.ios {
    background: linear-gradient(135deg, #007AFF 0%, #0051D5 100%);
}

.platform-icon.android {
    background: linear-gradient(135deg, #34A853 0%, #137333 100%);
}

.platform-icon.miniprogram {
    background: linear-gradient(135deg, #07C160 0%, #06AD56 100%);
}

.platform-name {
    font-size: 13px;
    color: #333;
    font-weight: 500;
    text-align: center;
    margin-top: 2px;
}

/* 链接区域 */
.footer-links {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 40px;
    margin-bottom: 40px;
    padding-bottom: 40px;
    border-bottom: 1px solid #e9ecef;
}

.link-column h4 {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin-bottom: 20px;
}

.link-column ul {
    list-style: none;
}

.link-column li {
    margin-bottom: 12px;
}

.link-column a {
    color: #666;
    text-decoration: none;
    font-size: 14px;
    transition: color 0.3s ease;
}

.link-column a:hover {
    color: #007AFF;
}

/* 二维码区域 */
.qr-section {
    text-align: center;
}

.qr-code {
    margin-top: 10px;
}

.qr-placeholder {
    width: 100px;
    height: 100px;
    background: white;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 24px;
}

.qr-placeholder p {
    font-size: 12px;
    color: #666;
    margin-top: 5px;
}

/* 底部信息 */
.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 20px;
}

.footer-info p {
    font-size: 12px;
    color: #999;
    margin-bottom: 5px;
}

.contact-buttons {
    display: flex;
    align-items: center;
    gap: 15px;
}

.contact-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    font-size: 12px;
    color: #666;
    cursor: pointer;
    transition: all 0.3s ease;
}

.contact-btn:hover {
    border-color: #007AFF;
    color: #007AFF;
}

.contact-icon {
    font-size: 14px;
}

.product-selector select {
    padding: 8px 12px;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    background: white;
    font-size: 12px;
    color: #666;
    cursor: pointer;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .download-section {
        flex-direction: column;
        gap: 30px;
        text-align: center;
    }

    .download-platforms {
        flex-wrap: wrap;
        gap: 20px;
        justify-content: center;
    }

    .footer-links {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }

    .footer-bottom {
        flex-direction: column;
        gap: 20px;
        text-align: center;
    }

    .contact-buttons {
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .download-platforms {
        grid-template-columns: repeat(3, 1fr);
    }

    .footer-links {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .contact-buttons {
        flex-direction: column;
        width: 100%;
    }

    .contact-btn {
        width: 100%;
        justify-content: center;
    }
}

/* 文章页面样式 */
.article-content {
    max-width: 800px;
    margin: 0 auto;
    padding: 40px 20px;
    line-height: 1.6;
}

.article-content h1 {
    font-size: 2rem;
    color: #333;
    margin-bottom: 20px;
    font-weight: 600;
}

.article-content h2 {
    font-size: 1.5rem;
    color: #333;
    margin: 30px 0 15px 0;
    font-weight: 600;
}

.article-content h3 {
    font-size: 1.3rem;
    color: #333;
    margin: 25px 0 10px 0;
    font-weight: 600;
}

.article-content h4 {
    font-size: 1.1rem;
    color: #333;
    margin: 20px 0 10px 0;
    font-weight: 600;
}

.article-content p {
    color: #555;
    margin-bottom: 15px;
}

.article-content ul {
    margin: 15px 0;
    padding-left: 20px;
}

.article-content li {
    margin-bottom: 8px;
    color: #555;
}

.article-content strong {
    color: #333;
    font-weight: 600;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .article-content {
        padding: 30px 15px;
    }
    
    .article-content h1 {
        font-size: 1.8rem;
    }
    
    .article-content h2 {
        font-size: 1.4rem;
    }
    
    .article-content h3 {
        font-size: 1.2rem;
    }
}

@media (max-width: 480px) {
    .article-content {
        padding: 20px 10px;
    }
    
    .article-content h1 {
        font-size: 1.6rem;
    }
    
    .article-content h2 {
        font-size: 1.3rem;
    }
    
    .article-content h3 {
        font-size: 1.1rem;
    }
}

/* 页面滚动动画效果 */
.fade-in-up {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.6s ease;
}

.fade-in-up.visible {
    opacity: 1;
    transform: translateY(0);
}

.fade-in-left {
    opacity: 0;
    transform: translateX(-30px);
    transition: all 0.6s ease;
}

.fade-in-left.visible {
    opacity: 1;
    transform: translateX(0);
}

.fade-in-right {
    opacity: 0;
    transform: translateX(30px);
    transition: all 0.6s ease;
}

.fade-in-right.visible {
    opacity: 1;
    transform: translateX(0);
}

.scale-in {
    opacity: 0;
    transform: scale(0.9);
    transition: all 0.6s ease;
}

.scale-in.visible {
    opacity: 1;
    transform: scale(1);
}

.stagger-animation {
    transition-delay: 0s;
}

.stagger-animation.visible:nth-child(1) {
    transition-delay: 0.1s;
}

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

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

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

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

/* 轮播响应式设计 */
@media screen and (max-width: 1200px) {
    .carousel .card {
        width: 300px;
        height: 360px;
    }

    .carousel .card:last-child {
        margin-right: 24px;
    }

    .card-content {
        height: 170px;
        padding: 20px;
    }

    .card:hover .card-content {
        height: 100%;
        bottom: 0;
    }

    .card h2 {
        font-size: 18px;
        margin-bottom: 14px;
    }

    .short-desc {
        font-size: 13px;
    }

    .detailed-desc {
        font-size: 12px;
    }
}

@media screen and (max-width: 900px) {
    .carousel .card {
        width: 280px;
        height: 340px;
        margin-right: 20px;
    }

    .carousel .card:last-child {
        margin-right: 20px;
    }

    .card-content {
        height: 160px;
        padding: 18px;
    }

    .card:hover .card-content {
        height: 100%;
        bottom: 0;
    }

    .card h2 {
        font-size: 17px;
        margin-bottom: 12px;
    }

    .short-desc {
        font-size: 12px;
    }

    .detailed-desc {
        font-size: 11px;
    }

    .learn-more-btn {
        padding: 6px 20px;
        font-size: 13px;
    }

    .wrapper {
        padding: 0 40px;
    }
}

@media screen and (max-width: 600px) {
    .carousel .card {
        width: 260px;
        height: 320px;
        margin-right: 16px;
    }

    .carousel .card:last-child {
        margin-right: 16px;
    }

    .card-content {
        height: 150px;
        padding: 16px;
    }

    .card:hover .card-content {
        height: 100%;
        bottom: 0;
    }

    .card h2 {
        font-size: 16px;
        margin-bottom: 10px;
    }

    .short-desc {
        font-size: 11px;
        line-height: 1.3;
    }

    .detailed-desc {
        font-size: 10px;
        line-height: 1.3;
    }

    .learn-more-btn {
        padding: 5px 16px;
        font-size: 12px;
    }

    .wrapper {
        padding: 0 30px;
    }

    .wrapper .carousel {
        padding: 0 10px;
    }
}

/* 千行百业最佳实践响应式 */
@media screen and (max-width: 900px) {
    .practices-carousel {
        grid-auto-columns: calc((100% / 2) - 9px);
    }
}

@media screen and (max-width: 600px) {
    .practices-carousel {
        grid-auto-columns: 100%;
    }
}

/* 侧边栏样式 */
.sidebar-contact {
    position: fixed;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1000;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 12px 6px;
    background: rgba(255, 255, 255, 0.95);
    border-radius: 28px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.contact-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 8px 6px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: 16px;
    position: relative;
    min-width: 60px;
}

.contact-item:hover {
    background: rgba(0, 122, 255, 0.1);
    transform: translateX(-5px);
}

.contact-item.main-contact {
    background: linear-gradient(135deg, #007AFF 0%, #5856D6 100%);
    color: white;
    padding: 10px 6px;
    margin-bottom: 6px;
    box-shadow: 0 3px 12px rgba(0, 122, 255, 0.3);
}

.contact-item.main-contact:hover {
    background: linear-gradient(135deg, #0056CC 0%, #4A47B8 100%);
    transform: translateX(-8px) scale(1.05);
    box-shadow: 0 6px 20px rgba(0, 122, 255, 0.4);
}

.contact-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    overflow: hidden;
    margin-bottom: 6px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

.contact-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.contact-icon {
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 4px;
    font-size: 14px;
    color: #666;
    transition: color 0.3s ease;
}

.contact-item:hover .contact-icon {
    color: #007AFF;
}

.contact-label {
    font-size: 10px;
    font-weight: 500;
    text-align: center;
    line-height: 1.1;
    color: #333;
    transition: color 0.3s ease;
}

.contact-item.main-contact .contact-label {
    color: white;
    font-weight: 600;
    font-size: 11px;
}

.contact-item:hover .contact-label {
    color: #007AFF;
}

.contact-item.main-contact:hover .contact-label {
    color: white;
}

/* 移动端适配 */
@media (max-width: 768px) {
    .sidebar-contact {
        right: 12px;
        padding: 10px 5px;
        gap: 4px;
        border-radius: 24px;
    }
    
    .contact-item {
        padding: 6px 4px;
        min-width: 50px;
        border-radius: 12px;
    }
    
    .contact-item.main-contact {
        padding: 8px 4px;
        margin-bottom: 4px;
    }
    
    .contact-avatar {
        width: 30px;
        height: 30px;
        margin-bottom: 4px;
    }
    
    .contact-icon {
        width: 22px;
        height: 22px;
        font-size: 12px;
        margin-bottom: 3px;
    }
    
    .contact-label {
        font-size: 9px;
    }
    
    .contact-item.main-contact .contact-label {
        font-size: 10px;
    }
}

/* 极小屏幕隐藏侧边栏 */
@media (max-width: 760px) {
    .immersive-experience{
        display: none;
    }
    .service-grid {
        grid-template-columns: repeat(1, 1fr);
    }
    .security-grid {
        grid-template-columns: repeat(1, 1fr);
    }
    .wrapper i:last-child {
        right: 0;
    }
    .newcenter .newsitem{width:100%}
}