编辑页面

HTML内容
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>空天智链云</title>
    
<style>
/* ===== 基础重置 ===== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
    font-size: 14px;
    color: #333;
    background: #f5f5f5;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}

/* ===== 移动端容器 ===== */
.app-container {
    max-width: 430px;
    margin: 0 auto;
    min-height: 100vh;
    background: #fff;
    position: relative;
}

/* ===== 返回按钮 ===== */
.back-btn {
    position: fixed;
    top: 30px;
    left: 15px;
    z-index: 200;
    width: 40px;
    height: 40px;
    background: rgba(255,255,255,0.9);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    cursor: pointer;
}

.back-btn svg {
    width: 20px;
    height: 20px;
    color: #333;
}

/* ===== 导航栏 ===== */
.nav-bar {
    width: 100%;
    background: #fff;
}

.status-bar {
    height: 24px;
    background: #fff;
}

.nav-content {
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.nav-title {
    font-size: 17px;
    font-weight: 600;
    color: #000;
}

/* ===== 页面内容 ===== */
.page {
    display: none;
    min-height: 100vh;
    padding-bottom: 60px;
}

.page.active {
    display: block;
}

.home-content {
    padding-top: 68px;
}

/* ===== Banner轮播 ===== */
.banner-section {
    padding: 0;
}

.banner {
    position: relative;
    height: 180px;
    overflow: hidden;
}

.banner-slider {
    display: flex;
    transition: transform 0.3s ease;
    height: 100%;
}

.banner-slide {
    min-width: 100%;
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
}

.banner-text {
    position: relative;
    z-index: 1;
}

.banner-text h2 {
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.banner-text p {
    color: rgba(255,255,255,0.9);
    font-size: 18px;
    font-weight: 600;
}

.banner-more {
    position: absolute;
    bottom: 20px;
    left: 20px;
    background: rgba(255,255,255,0.2);
    color: #fff;
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 12px;
}

.banner-page {
    position: absolute;
    bottom: 20px;
    right: 20px;
    background: rgba(0,0,0,0.3);
    color: #fff;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
}

.banner-dots {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 6px;
}

.dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(255,255,255,0.5);
    transition: all 0.3s;
}

.dot.active {
    width: 18px;
    border-radius: 3px;
    background: #fff;
}

/* ===== 核心数据 ===== */
.core-data {
    display: flex;
    justify-content: space-around;
    padding: 16px 10px;
    background: #fff;
}

.data-item {
    text-align: center;
    display: flex;
    flex-direction: column;
}

.data-num {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.2;
}

.data-num.blue { color: #0066cc; }
.data-num.green { color: #00b894; }
.data-num.orange { color: #fd7e14; }
.data-num.yellow { color: #ffc107; }

.data-unit {
    font-size: 14px;
}

.data-label {
    font-size: 11px;
    color: #666;
    margin-top: 4px;
}

/* ===== 核心业务入口 ===== */
.business-entry {
    display: flex;
    gap: 10px;
    padding: 0 15px 15px;
}

.business-card {
    flex: 1;
    border-radius: 12px;
    padding: 14px;
    position: relative;
    overflow: hidden;
    min-height: 100px;
    cursor: pointer;
}

.blue-card {
    background: linear-gradient(135deg, #1a4b8c 0%, #0066cc 100%);
}

.green-card {
    background: linear-gradient(135deg, #00a87a 0%, #00b894 100%);
}

.card-pattern {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0.15;
}

.card-pattern.hexagon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49' viewBox='0 0 28 49'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='1'%3E%3Cpath d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.card-pattern.city {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='52' viewBox='0 0 60 52'%3E%3Cg fill='%23ffffff'%3E%3Cpath d='M60 16.5L45 0v10.5H30V0L15 16.5h10.5v15H30v-15H60v15H49.5V16.5h10.5z'/%3E%3C/g%3E%3C/svg%3E");
}

.card-content {
    position: relative;
    z-index: 1;
    color: #fff;
}

.card-content h3 {
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
    opacity: 0.9;
}

.card-content p {
    font-size: 15px;
    font-weight: 600;
}

.card-content p .sub-text {
    font-size: 11px;
    font-weight: 400;
    opacity: 0.9;
}

.card-arrow {
    position: absolute;
    right: 14px;
    bottom: 14px;
    color: #fff;
    font-size: 18px;
}

.card-more {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(255,255,255,0.25);
    color: #fff;
    padding: 2px 10px;
    border-radius: 10px;
    font-size: 10px;
}

/* ===== AI机器人助手横幅 ===== */
.ai-robot-banner {
    margin: 0 15px 15px;
    background: linear-gradient(135deg, #1a4b8c 0%, #0066cc 100%);
    border-radius: 12px;
    padding: 20px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 120px;
    cursor: pointer;
}

.ai-robot-left {
    flex: 1;
}

.ai-robot-badge {
    background: rgba(255,255,255,0.2);
    color: #fff;
    padding: 3px 10px;
    border-radius: 10px;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 1px;
    display: inline-block;
    margin-bottom: 8px;
}

.ai-robot-left h3 {
    color: #fff;
    font-size: 18px;
    font-weight: 600;
}

.ai-arrow {
    color: #fff;
    font-size: 20px;
    margin-top: 8px;
    display: inline-block;
}

.ai-robot-right {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.ai-robot-icon {
    width: 70px;
    height: 80px;
    animation: float 3s ease-in-out infinite;
}

.ai-robot-brand {
    text-align: center;
    margin-top: -5px;
}

.ai-robot-brand span {
    color: #fff;
    font-size: 10px;
    font-weight: 600;
}

.ai-robot-brand small {
    color: rgba(255,255,255,0.7);
    font-size: 8px;
    display: block;
}

@keyframes float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
}

.ai-more {
    position: absolute;
    top: 10px;
    left: 10px;
    background: rgba(255,255,255,0.25);
    color: #fff;
    padding: 2px 10px;
    border-radius: 10px;
    font-size: 10px;
}

.banner-dots-small {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 6px;
}

.dot-small {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.dot-small.blue { background: #00b894; }
.dot-small.green { background: #0066cc; }
.dot-small.darkblue { background: #1a4b8c; }

/* ===== 功能金刚区 ===== */
.function-grid-section {
    padding: 0 15px 15px;
}

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

.func-item {
    background: #fff;
    border-radius: 10px;
    padding: 12px 8px;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s;
    position: relative;
}

.func-item:active {
    transform: scale(0.95);
}

.func-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    margin: 0 auto 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.func-icon svg {
    width: 24px;
    height: 24px;
    color: #fff;
}

.func-icon.red-icon { background: linear-gradient(135deg, #fd7e14 0%, #ff6b35 100%); }
.func-icon.blue-icon { background: linear-gradient(135deg, #0066cc 0%, #00a0e9 100%); }
.func-icon.purple-icon { background: linear-gradient(135deg, #6c5ce7 0%, #a29bfe 100%); }
.func-icon.green-icon { background: linear-gradient(135deg, #00b894 0%, #00cec9 100%); }
.func-icon.yellow-icon { background: linear-gradient(135deg, #ffc107 0%, #ffca28 100%); }
.func-icon.red-icon2 { background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%); }
.func-icon.blue-icon2 { background: linear-gradient(135deg, #3498db 0%, #2980b9 100%); }
.func-icon.orange-icon2 { background: linear-gradient(135deg, #e67e22 0%, #d35400 100%); }

.func-arrow {
    position: absolute;
    bottom: -2px;
    right: -2px;
    width: 16px;
    height: 16px;
    background: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}

.func-arrow.red { color: #e74c3c; }
.func-arrow.blue { color: #0066cc; }
.func-arrow.orange { color: #e67e22; }
.func-arrow.yellow { color: #ffc107; }

.func-name {
    font-size: 11px;
    color: #333;
    font-weight: 500;
}

/* ===== 新闻资讯区 ===== */
.news-section {
    padding: 0 15px 15px;
}

.section-header {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
}

.section-bar {
    width: 4px;
    height: 18px;
    border-radius: 2px;
    margin-right: 8px;
}

.section-bar.blue-bar { background: #0066cc; }

.section-title {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    flex: 1;
}

.section-more {
    font-size: 12px;
    color: #999;
}

/* 大头条 */
.news-headline {
    background: linear-gradient(135deg, #f0f7ff 0%, #e8f4ff 100%);
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 12px;
    position: relative;
    border-left: 4px solid #0066cc;
}

.headline-badge {
    position: absolute;
    top: 12px;
    right: 12px;
    background: #ff6b35;
    color: #fff;
    padding: 2px 10px;
    border-radius: 10px;
    font-size: 10px;
    font-weight: 600;
}

.news-headline h3 {
    font-size: 15px;
    font-weight: 600;
    color: #0066cc;
    line-height: 1.5;
    padding-right: 60px;
}

.headline-meta {
    display: flex;
    gap: 12px;
    margin-top: 10px;
    font-size: 11px;
    color: #999;
}

.headline-meta .readers {
    display: flex;
    align-items: center;
    gap: 4px;
}

/* 新闻列表 */
.news-list {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
}

.news-item {
    padding: 14px;
    border-bottom: 1px solid #f0f0f0;
    cursor: pointer;
}

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

.news-item:active {
    background: #f8f9fa;
}

.news-content h4 {
    font-size: 14px;
    font-weight: 500;
    color: #333;
    line-height: 1.4;
    margin-bottom: 6px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.news-content p {
    font-size: 12px;
    color: #999;
    line-height: 1.4;
    margin-bottom: 8px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.news-meta {
    display: flex;
    gap: 12px;
    font-size: 11px;
    color: #999;
}

.news-meta .readers {
    display: flex;
    align-items: center;
    gap: 4px;
}

/* 带图片的新闻 */
.news-item.with-image {
    display: flex;
    gap: 12px;
}

.news-item.with-image .news-image {
    width: 80px;
    height: 60px;
    border-radius: 8px;
    flex-shrink: 0;
}

.news-item.with-image .news-content {
    flex: 1;
}

.news-item.with-image .news-content h4 {
    -webkit-line-clamp: 2;
}

/* ===== 底部占位 ===== */
.bottom-placeholder {
    height: 20px;
}

/* ===== AI助手页面 ===== */
.ai-page-content {
    padding-top: 68px;
}

.ai-chat-container {
    padding: 20px 15px;
}

.ai-welcome {
    text-align: center;
    padding: 30px 20px;
    background: linear-gradient(180deg, #f0f7ff 0%, #fff 100%);
    border-radius: 16px;
    margin-bottom: 20px;
}

.robot-svg.large {
    width: 80px;
    height: 80px;
    animation: float 3s ease-in-out infinite;
}

.ai-welcome h2 {
    color: #1a4b8c;
    font-size: 20px;
    margin: 16px 0 10px;
}

.ai-welcome p {
    color: #666;
    font-size: 13px;
    margin-bottom: 16px;
}

.ai-services {
    list-style: none;
    display: inline-block;
    text-align: left;
}

.ai-services li {
    color: #333;
    font-size: 13px;
    padding: 6px 0;
    position: relative;
    padding-left: 20px;
}

.ai-services li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 6px;
    height: 6px;
    background: #00b894;
    border-radius: 50%;
}

.ai-quick-questions {
    background: #f8f9fa;
    border-radius: 16px;
    padding: 16px;
}

.quick-title {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin-bottom: 12px;
}

.quick-btns {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.quick-btn {
    background: #fff;
    border: 1px solid #e0e0e0;
    padding: 12px 16px;
    border-radius: 10px;
    font-size: 13px;
    color: #333;
    text-align: left;
    cursor: pointer;
    transition: all 0.3s;
}

.quick-btn:hover {
    background: #f0f7ff;
    border-color: #0066cc;
}

/* ===== 个人中心 ===== */
.profile-content {
    background: #f5f5f5;
}

.profile-header {
    background: linear-gradient(135deg, #1a4b8c 0%, #0066cc 100%);
    padding: 30px 20px 40px;
}

.avatar-area {
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
}

.avatar {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background: rgba(255,255,255,0.2);
    border: 3px solid rgba(255,255,255,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
}

.avatar svg {
    width: 40px;
    height: 40px;
    color: rgba(255,255,255,0.9);
}

.login-hint {
    color: rgba(255,255,255,0.9);
    font-size: 14px;
}

/* ===== 订单管理 ===== */
.order-section {
    background: #fff;
    margin: -20px 15px 10px;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

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

.section-title {
    font-size: 15px;
    font-weight: 600;
    color: #333;
}

.section-more {
    font-size: 12px;
    color: #999;
    display: flex;
    align-items: center;
    gap: 4px;
}

.order-status {
    display: flex;
    justify-content: space-around;
}

.status-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.status-icon {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: linear-gradient(135deg, #f0f7ff 0%, #e8f4ff 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.status-icon svg {
    width: 20px;
    height: 20px;
    color: #0066cc;
}

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

/* ===== 功能菜单 ===== */
.menu-section {
    padding: 0 15px;
}

.menu-group {
    background: #fff;
    border-radius: 12px;
    margin-bottom: 10px;
    overflow: hidden;
}

.menu-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px;
    border-bottom: 1px solid #f0f0f0;
    transition: background 0.2s;
    cursor: pointer;
}

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

.menu-item:active {
    background: #f8f9fa;
}

.menu-left {
    display: flex;
    align-items: center;
    gap: 12px;
}

.menu-left svg {
    width: 22px;
    height: 22px;
    color: #0066cc;
}

.menu-left span {
    font-size: 14px;
    color: #333;
}

/* ===== 底部导航 ===== */
.tab-bar {
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 430px;
    height: 60px;
    background: #fff;
    display: flex;
    justify-content: space-around;
    align-items: center;
    box-shadow: 0 -2px 10px rgba(0,0,0,0.05);
    z-index: 100;
    padding-bottom: env(safe-area-inset-bottom, 0);
}

.tab-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 8px 20px;
    color: #999;
    cursor: pointer;
    transition: all 0.3s;
}

.tab-item.active {
    color: #0066cc;
}

.tab-item svg {
    width: 24px;
    height: 24px;
}

.tab-item span {
    font-size: 10px;
}

.ai-center-btn {
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, #0066cc 0%, #00a0e9 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: -20px;
    box-shadow: 0 4px 12px rgba(0, 102, 204, 0.4);
}

.ai-center-btn svg {
    color: #fff;
    width: 24px;
    height: 24px;
}

.tab-item[data-page="ai"] {
    color: #999;
}

.tab-item[data-page="ai"].active {
    color: #0066cc;
}

/* ===== 动画 ===== */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.page.active .page-content > div {
    animation: fadeIn 0.4s ease forwards;
}

/* ===== 响应式 ===== */
@media screen and (max-width: 375px) {
    .function-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .business-card {
        min-height: 90px;
    }
}

/* ===== 子页面通用样式 ===== */
.page-sub .page-content {
    padding-top: 68px;
    padding-bottom: 30px;
    background: #f5f5f5;
    min-height: 100vh;
}

.sub-nav {
    position: relative;
}

.nav-back {
    position: absolute;
    left: 15px;
    font-size: 20px;
    color: #333;
    cursor: pointer;
}

.nav-back:hover {
    color: #0066cc;
}

/* ===== 科技服务页面子导航 ===== */
.page-sub .nav-content {
    position: relative;
}

.page-sub .nav-back {
    position: absolute;
    left: 15px;
    font-size: 22px;
    color: #333;
    cursor: pointer;
    z-index: 10;
}

/* ===== 子页面Banner ===== */
.sub-banner {
    margin: 0 15px 15px;
    background: linear-gradient(135deg, #1a4b8c 0%, #0066cc 100%);
    border-radius: 12px;
    padding: 20px;
    position: relative;
    min-height: 100px;
    display: flex;
    align-items: center;
}

.sub-banner-left {
    flex: 1;
}

.sub-brand {
    color: rgba(255,255,255,0.7);
    font-size: 10px;
    letter-spacing: 1px;
}

.sub-banner-left h2 {
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    margin: 4px 0;
}

.sub-banner-left p {
    color: rgba(255,255,255,0.8);
    font-size: 11px;
}

.sub-arrow {
    color: #fff;
    font-size: 24px;
    margin-top: 8px;
}

.sub-more {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(255,255,255,0.2);
    color: #fff;
    padding: 3px 12px;
    border-radius: 12px;
    font-size: 11px;
}

.sub-dots {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 6px;
}

.dot-sm {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.dot-sm.blue { background: #00b894; }
.dot-sm.green { background: #0066cc; }
.dot-sm.dark { background: #1a4b8c; }

/* ===== 科技服务功能网格 ===== */
.service-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    padding: 0 15px;
}

.service-item {
    background: #ff8c00;
    border-radius: 12px;
    padding: 20px 16px;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s;
    min-height: 90px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.service-item:active {
    transform: scale(0.95);
    opacity: 0.9;
}

.service-item.skyblue { background: #4fc3f7; }
.service-item.teal { background: #26a69a; }
.service-item.red { background: #ef5350; }
.service-item.darkblue { background: #1e88e5; }
.service-item.green { background: #66bb6a; }
.service-item.yellow { background: #ffca28; }
.service-item.brown { background: #8d6e63; }
.service-item.darkgreen { background: #2e7d32; }
.service-item.purple { background: #ab47bc; }

.service-name {
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 6px;
}

.service-en {
    color: rgba(255,255,255,0.85);
    font-size: 10px;
}

/* ===== 悬浮首页按钮 ===== */
.home-float-btn {
    position: fixed;
    bottom: 30px;
    right: 20px;
    width: 50px;
    height: 50px;
    background: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 15px rgba(0,0,0,0.15);
    cursor: pointer;
    z-index: 50;
}

.home-float-btn svg {
    width: 24px;
    height: 24px;
    color: #0066cc;
}

.home-float-btn:active {
    transform: scale(0.95);
}

/* ===== 会场预约页面 ===== */
.meeting-content {
    padding-top: 68px;
    padding-bottom: 30px;
    background: #f5f5f5;
    min-height: 100vh;
}

.meeting-search {
    padding: 0 15px 15px;
}

.search-bar {
    display: flex;
    align-items: center;
    background: #fff;
    border-radius: 25px;
    padding: 10px 16px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.search-bar svg {
    width: 18px;
    height: 18px;
    color: #999;
    margin-right: 10px;
}

.search-bar input {
    flex: 1;
    border: none;
    outline: none;
    font-size: 14px;
    color: #333;
    background: transparent;
}

.search-bar input::placeholder {
    color: #ccc;
}

.meeting-list {
    padding: 0 15px;
}

.venue-item {
    background: #fff;
    border-radius: 12px;
    margin-bottom: 12px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    cursor: pointer;
}

.venue-item:active {
    opacity: 0.9;
}

.venue-image {
    width: 100%;
    height: 140px;
    object-fit: cover;
}

.venue-info {
    padding: 14px;
}

.venue-name {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin-bottom: 8px;
}

.venue-tags {
    display: flex;
    gap: 6px;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

.venue-tag {
    padding: 3px 10px;
    border-radius: 4px;
    font-size: 11px;
}

.venue-tag.blue-tag {
    background: #e3f2fd;
    color: #0066cc;
}

.venue-tag.green-tag {
    background: #e8f5e9;
    color: #2e7d32;
}

.venue-tag.orange-tag {
    background: #fff3e0;
    color: #e65100;
}

.venue-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.venue-price {
    font-size: 18px;
    color: #ff6b35;
    font-weight: 600;
}

.venue-price span {
    font-size: 12px;
    color: #999;
    font-weight: 400;
}

.venue-address {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: #666;
    margin-top: 8px;
}

.venue-address svg {
    width: 14px;
    height: 14px;
    color: #999;
}

.book-btn {
    background: linear-gradient(135deg, #ff6b35 0%, #ff8c00 100%);
    color: #fff;
    border: none;
    padding: 8px 20px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
}

/* ===== 子页面Tab导航 ===== */
.tab-nav-section {
    padding: 0 15px 15px;
}

.tab-nav {
    display: flex;
    background: #fff;
    border-radius: 8px;
    padding: 4px;
}

.tab-nav-item {
    flex: 1;
    text-align: center;
    padding: 10px 0;
    font-size: 14px;
    color: #666;
    border-radius: 6px;
    cursor: pointer;
}

.tab-nav-item.active {
    background: linear-gradient(135deg, #0066cc 0%, #00a0e9 100%);
    color: #fff;
    font-weight: 600;
}

.tab-nav.red-nav .tab-nav-item.active {
    background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%);
}

.tab-nav.green-nav .tab-nav-item.active {
    background: linear-gradient(135deg, #00b894 0%, #00cec9 100%);
}

.tab-nav.blue-nav .tab-nav-item.active {
    background: linear-gradient(135deg, #3498db 0%, #2980b9 100%);
}

/* ===== 中试服务详情列表 ===== */
.service-detail-list {
    padding: 0 15px;
}

.service-detail-item {
    display: flex;
    gap: 12px;
    background: #fff;
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 10px;
}

.sd-left {
    flex-shrink: 0;
}

.sd-num {
    font-size: 24px;
    font-weight: 700;
    color: #0066cc;
    opacity: 0.3;
}

.sd-content {
    flex: 1;
}

.sd-title {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 6px;
}

.sd-content p {
    font-size: 13px;
    color: #666;
    line-height: 1.5;
}

/* ===== 技术经纪人卡片 ===== */
.broker-list {
    padding: 0 15px;
}

.broker-card {
    background: #fff;
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 12px;
}

.broker-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.broker-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: linear-gradient(135deg, #0066cc 0%, #00a0e9 100%);
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
}

.broker-info h3 {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
}

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

.broker-tags {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.broker-tag {
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 12px;
}

.broker-tag.blue-tag {
    background: #e3f2fd;
    color: #0066cc;
}

.broker-profile {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 12px;
}

.profile-tag {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 11px;
    margin-bottom: 6px;
}

.profile-tag.green-tag {
    background: #e8f5e9;
    color: #2e7d32;
}

.broker-profile p {
    font-size: 13px;
    color: #666;
    line-height: 1.5;
}

/* ===== 介绍内容 ===== */
.intro-content {
    padding: 0 15px 15px;
}

.intro-content p {
    background: #fff;
    border-radius: 10px;
    padding: 16px;
    font-size: 14px;
    color: #666;
    line-height: 1.6;
}

/* ===== 合作伙伴列表 ===== */
.partner-list {
    padding: 0 15px;
}

.partner-title {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 12px;
    padding-left: 8px;
    border-left: 3px solid #0066cc;
}

.partner-title.red-title {
    border-left-color: #e74c3c;
}

.partner-title.green-title {
    border-left-color: #00b894;
}

.partner-item {
    background: #fff;
    border-radius: 8px;
    padding: 12px 16px;
    margin-bottom: 8px;
    font-size: 14px;
    color: #333;
    cursor: pointer;
}

.partner-item:active {
    background: #f0f0f0;
}

.partner-item.red-item {
    border-left: 3px solid #e74c3c;
}

.partner-item.green-item {
    border-left: 3px solid #00b894;
}

/* ===== 申报服务表格 ===== */
.declare-table {
    margin: 0 15px;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
}

.declare-header {
    display: flex;
    background: linear-gradient(135deg, #0066cc 0%, #00a0e9 100%);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
}

.declare-header span {
    flex: 1;
    padding: 12px;
    text-align: center;
}

.declare-row {
    display: flex;
    border-bottom: 1px solid #f0f0f0;
}

.declare-row:last-child {
    border-bottom: none;
}

.declare-row span {
    flex: 1;
    padding: 12px;
    text-align: center;
    font-size: 14px;
    color: #333;
}

.declare-row span:last-child {
    color: #e74c3c;
    font-weight: 600;
}

/* ===== 成果转化列表 ===== */
.transform-list {
    padding: 0 15px;
}

.transform-item {
    display: flex;
    gap: 12px;
    background: #fff;
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 10px;
}

.transform-num {
    font-size: 28px;
    font-weight: 700;
    color: #0066cc;
    opacity: 0.2;
}

.transform-info h4 {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 6px;
}

.transform-info p {
    font-size: 13px;
    color: #666;
    line-height: 1.5;
}

/* ===== 银行网格 ===== */
.bank-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    padding: 0 15px;
}

.bank-item {
    background: #fff;
    border-radius: 10px;
    padding: 16px 8px;
    text-align: center;
    cursor: pointer;
}

.bank-item:active {
    opacity: 0.9;
}

.bank-logo {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    margin: 0 auto 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
}

.bank-item span {
    font-size: 12px;
    color: #333;
}

/* ===== 专家列表 ===== */
.expert-list {
    padding: 0 15px;
}

.expert-item {
    display: flex;
    gap: 14px;
    background: #fff;
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 10px;
}

.expert-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: linear-gradient(135deg, #00b894 0%, #00cec9 100%);
    color: #fff;
    font-size: 24px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.expert-info {
    flex: 1;
}

.expert-info h4 {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
}

.expert-info p {
    font-size: 13px;
    color: #666;
    margin-bottom: 8px;
}

.expert-field {
    display: inline-block;
    background: #e3f2fd;
    color: #0066cc;
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 12px;
}

/* ===== 各页Banner样式 ===== */
.pilot-banner {
    background: linear-gradient(135deg, #1a4b8c 0%, #0066cc 100%);
}

.broker-banner {
    background: linear-gradient(135deg, #00b894 0%, #00cec9 100%);
}

.quality-banner {
    background: linear-gradient(135deg, #c0392b 0%, #e74c3c 100%);
}

.ip-banner {
    background: linear-gradient(135deg, #2e7d32 0%, #43a047 100%);
}

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

.transform-banner {
    background: linear-gradient(135deg, #6c5ce7 0%, #a29bfe 100%);
}

.fintech-banner {
    background: linear-gradient(135deg, #3498db 0%, #2980b9 100%);
}

.talent-banner {
    background: linear-gradient(135deg, #1a237e 0%, #303f9f 100%);
}

/* ===== 党建链页面 ===== */
.party-banner {
    background: linear-gradient(135deg, #c0392b 0%, #e74c3c 100%);
}

.party-list {
    padding: 0 15px;
}

.party-item {
    background: #fff;
    border-radius: 8px;
    padding: 14px 16px;
    margin-bottom: 10px;
    font-size: 14px;
    color: #333;
    border-left: 3px solid #e74c3c;
}

.party-item:active {
    background: #f8f9fa;
}

/* ===== 产品发布页面 ===== */
.product-layout {
    display: flex;
    padding: 0 15px;
    gap: 12px;
}

.product-sidebar {
    width: 100px;
    flex-shrink: 0;
}

.sidebar-item {
    background: #f5f5f5;
    padding: 10px 8px;
    margin-bottom: 6px;
    border-radius: 6px;
    font-size: 11px;
    color: #666;
    text-align: center;
    cursor: pointer;
}

.sidebar-item.active {
    background: linear-gradient(135deg, #0066cc 0%, #00a0e9 100%);
    color: #fff;
}

.product-grid {
    flex: 1;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}

.product-card {
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    padding-bottom: 8px;
}

.product-img {
    height: 80px;
}

.product-name {
    display: block;
    padding: 8px 8px 4px;
    font-size: 12px;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.product-views {
    display: block;
    padding: 0 8px;
    font-size: 11px;
    color: #999;
}

/* ===== 企业展厅页面 ===== */
.enterprise-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    padding: 0 15px;
}

.enterprise-card {
    background: #fff;
    border-radius: 10px;
    padding: 16px 8px;
    text-align: center;
    cursor: pointer;
}

.enterprise-logo {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    margin: 0 auto 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
}

.enterprise-card span {
    font-size: 12px;
    color: #333;
}

/* ===== 产业链图谱页面 ===== */
.chain-map {
    padding: 0 15px;
}

.chain-section {
    background: #fff;
    border-radius: 10px;
    margin-bottom: 12px;
    overflow: hidden;
}

.chain-header {
    background: linear-gradient(135deg, #0066cc 0%, #00a0e9 100%);
    color: #fff;
    padding: 10px 14px;
    font-size: 14px;
    font-weight: 600;
}

.chain-items {
    padding: 10px 14px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.chain-item {
    background: #f0f7ff;
    color: #0066cc;
    padding: 6px 12px;
    border-radius: 16px;
    font-size: 12px;
}

/* ===== 生活服务页面 ===== */
.life-service-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
    padding: 0 15px;
    margin-bottom: 15px;
}

.life-service-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
}

.ls-icon {
    width: 50px;
    height: 50px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 8px;
}

.ls-icon svg {
    width: 24px;
    height: 24px;
}

.life-service-item span {
    font-size: 13px;
    color: #333;
}

.featured-banner {
    padding: 0 15px;
}

.featured-title {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 10px;
    padding-left: 8px;
    border-left: 3px solid #0066cc;
}

.featured-card {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    display: flex;
}

.featured-img {
    width: 100px;
    height: 80px;
    flex-shrink: 0;
}

.featured-info {
    padding: 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.featured-info h4 {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
}

.featured-info p {
    font-size: 12px;
    color: #666;
}

/* ===== 政策发布页面 ===== */
.policy-list {
    padding: 0 15px;
}

.policy-item {
    background: #fff;
    border-radius: 10px;
    padding: 14px;
    margin-bottom: 12px;
    display: flex;
    gap: 12px;
    cursor: pointer;
}

.policy-item:active {
    opacity: 0.9;
}

.policy-content {
    flex: 1;
}

.policy-content h3 {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    line-height: 1.4;
    margin-bottom: 6px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.policy-source {
    font-size: 12px;
    color: #0066cc;
    margin-bottom: 6px;
}

.policy-meta {
    display: flex;
    justify-content: space-between;
    font-size: 11px;
    color: #999;
}

.policy-icon {
    width: 40px;
    height: 40px;
    background: linear-gradient(135deg, #0066cc 0%, #00a0e9 100%);
    border-radius: 8px;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* ===== 科创活动页面 ===== */
.activity-list {
    padding: 0 15px;
}

.activity-item {
    background: #fff;
    border-radius: 10px;
    padding: 14px;
    margin-bottom: 12px;
    display: flex;
    gap: 12px;
    cursor: pointer;
}

.activity-item:active {
    opacity: 0.9;
}

.activity-content {
    flex: 1;
}

.activity-content h3 {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    line-height: 1.4;
    margin-bottom: 8px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.activity-meta {
    display: flex;
    gap: 12px;
    font-size: 12px;
    color: #999;
}

.activity-img {
    width: 70px;
    height: 70px;
    border-radius: 8px;
    flex-shrink: 0;
}

/* ===== 住宿页面 ===== */
.hotel-list {
    padding: 0 15px;
}

.hotel-item {
    background: #fff;
    border-radius: 10px;
    padding: 12px;
    margin-bottom: 12px;
    display: flex;
    gap: 12px;
    cursor: pointer;
}

.hotel-item:active {
    opacity: 0.9;
}

.hotel-img {
    width: 80px;
    height: 60px;
    border-radius: 8px;
    flex-shrink: 0;
}

.hotel-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.hotel-info h3 {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 6px;
}

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

/* ===== 出行页面 ===== */
.parking-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    padding: 0 15px;
}

.parking-item {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
}

.parking-item:active {
    opacity: 0.9;
}

.parking-img {
    height: 80px;
}

.parking-name {
    display: block;
    padding: 10px;
    font-size: 13px;
    color: #333;
    text-align: center;
}

/* ===== 美食页面 ===== */
.shop-list {
    padding: 0 15px;
}

.shop-item {
    background: #fff;
    border-radius: 10px;
    padding: 12px;
    margin-bottom: 12px;
    display: flex;
    gap: 12px;
    cursor: pointer;
}

.shop-item:active {
    opacity: 0.9;
}

.shop-img {
    width: 80px;
    height: 60px;
    border-radius: 8px;
    flex-shrink: 0;
}

.shop-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.shop-info h3 {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 6px;
}

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

/* ===== 饮品页面 ===== */
.drink-list {
    padding: 0 15px;
}

.drink-item {
    background: #fff;
    border-radius: 10px;
    padding: 12px;
    margin-bottom: 12px;
    display: flex;
    gap: 12px;
    cursor: pointer;
}

.drink-item:active {
    opacity: 0.9;
}

.drink-img {
    width: 80px;
    height: 60px;
    border-radius: 8px;
    flex-shrink: 0;
}

.drink-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.drink-info h3 {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 6px;
}

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

/* ===== 休闲页面 ===== */
.entertainment-list {
    padding: 0 15px;
}

.entertainment-item {
    background: #fff;
    border-radius: 10px;
    padding: 12px;
    margin-bottom: 12px;
    display: flex;
    gap: 12px;
    cursor: pointer;
}

.entertainment-item:active {
    opacity: 0.9;
}

.entertainment-img {
    width: 80px;
    height: 60px;
    border-radius: 8px;
    flex-shrink: 0;
}

.entertainment-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.entertainment-info h3 {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 6px;
}

.entertainment-info p {
    font-size: 12px;
    color: #666;
}

/* ===== 健康页面 ===== */
.health-list {
    padding: 0 15px;
}

.health-item {
    background: #fff;
    border-radius: 10px;
    padding: 12px;
    margin-bottom: 12px;
    display: flex;
    gap: 12px;
    cursor: pointer;
}

.health-item:active {
    opacity: 0.9;
}

.health-img {
    width: 80px;
    height: 60px;
    border-radius: 8px;
    flex-shrink: 0;
}

.health-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.health-info h3 {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 6px;
}

.health-info p {
    font-size: 12px;
    color: #666;
}

/* ===== 订单列表页面 ===== */
.order-list {
    padding: 12px 15px;
}

.order-card {
    background: #fff;
    border-radius: 10px;
    padding: 12px;
    margin-bottom: 12px;
    cursor: pointer;
}

.order-card:active {
    opacity: 0.9;
}

.order-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #f0f0f0;
}

.order-shop {
    font-size: 14px;
    font-weight: 600;
    color: #333;
}

.order-status-tag {
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 4px;
}

.order-status-tag.pending {
    color: #ff9800;
    background: #fff3e0;
}

.order-status-tag.completed {
    color: #4caf50;
    background: #e8f5e9;
}

.order-status-tag.cancelled {
    color: #999;
    background: #f5f5f5;
}

.order-content {
    display: flex;
    gap: 10px;
}

.order-img {
    width: 60px;
    height: 60px;
    border-radius: 6px;
    background: #e0e0e0;
    flex-shrink: 0;
}

.order-info {
    flex: 1;
}

.order-title {
    font-size: 14px;
    color: #333;
    margin-bottom: 4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.order-spec {
    font-size: 12px;
    color: #999;
    margin-bottom: 4px;
}

.order-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 8px;
}

.order-price {
    font-size: 14px;
    color: #ff5722;
    font-weight: 600;
}

.order-actions {
    display: flex;
    gap: 8px;
}

.order-btn {
    padding: 4px 12px;
    border-radius: 4px;
    font-size: 12px;
    border: 1px solid #ddd;
    background: #fff;
    color: #666;
}

.order-btn.primary {
    background: #0066cc;
    color: #fff;
    border-color: #0066cc;
}

/* ===== 消息列表页面 ===== */
.message-list {
    padding: 12px 15px;
}

.message-item {
    background: #fff;
    border-radius: 10px;
    padding: 14px;
    margin-bottom: 10px;
    cursor: pointer;
}

.message-item:active {
    opacity: 0.9;
}

.message-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.message-title {
    font-size: 15px;
    font-weight: 600;
    color: #333;
}

.message-time {
    font-size: 11px;
    color: #999;
}

.message-preview {
    font-size: 13px;
    color: #666;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.message-unread {
    width: 8px;
    height: 8px;
    background: #ff5722;
    border-radius: 50%;
    margin-left: 8px;
    flex-shrink: 0;
}

/* ===== 订阅列表页面 ===== */
.subscribe-list {
    padding: 12px 15px;
}

.subscribe-item {
    background: #fff;
    border-radius: 10px;
    padding: 14px;
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

.subscribe-item:active {
    opacity: 0.9;
}

.subscribe-info {
    flex: 1;
}

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

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

.subscribe-toggle {
    width: 44px;
    height: 26px;
    background: #ccc;
    border-radius: 13px;
    position: relative;
    transition: all 0.3s;
}

.subscribe-toggle.active {
    background: #4caf50;
}

.subscribe-toggle::after {
    content: '';
    position: absolute;
    width: 22px;
    height: 22px;
    background: #fff;
    border-radius: 50%;
    top: 2px;
    left: 2px;
    transition: all 0.3s;
}

.subscribe-toggle.active::after {
    left: 20px;
}

/* ===== 表单列表页面 ===== */
.form-list {
    padding: 12px 15px;
}

.form-card {
    background: #fff;
    border-radius: 10px;
    padding: 14px;
    margin-bottom: 10px;
    cursor: pointer;
}

.form-card:active {
    opacity: 0.9;
}

.form-title {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 8px;
}

.form-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.form-date {
    font-size: 12px;
    color: #999;
}

.form-status {
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 4px;
    background: #e3f2fd;
    color: #1976d2;
}

.form-status.completed {
    background: #e8f5e9;
    color: #4caf50;
}

/* ===== 打卡页面 ===== */
.checkin-summary {
    background: linear-gradient(135deg, #0066cc 0%, #00b894 100%);
    color: #fff;
    padding: 20px;
    text-align: center;
    margin: 12px 15px;
    border-radius: 12px;
}

.checkin-count {
    font-size: 48px;
    font-weight: 700;
    margin-bottom: 4px;
}

.checkin-label {
    font-size: 14px;
    opacity: 0.9;
}

.checkin-calendar {
    background: #fff;
    margin: 0 15px;
    border-radius: 10px;
    padding: 15px;
}

.calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.calendar-title {
    font-size: 15px;
    font-weight: 600;
    color: #333;
}

.calendar-nav {
    display: flex;
    gap: 15px;
}

.calendar-nav svg {
    width: 20px;
    height: 20px;
    color: #666;
    cursor: pointer;
}

.calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 8px;
    text-align: center;
}

.calendar-day-name {
    font-size: 12px;
    color: #999;
    padding: 4px;
}

.calendar-day {
    font-size: 13px;
    color: #333;
    padding: 8px 4px;
    border-radius: 50%;
}

.calendar-day.checkin {
    background: #4caf50;
    color: #fff;
}

.calendar-day.empty {
    background: transparent;
}

/* ===== 优惠券页面 ===== */
.coupon-list {
    padding: 12px 15px;
}

.coupon-item {
    background: linear-gradient(135deg, #ff9800 0%, #ff5722 100%);
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 12px;
    color: #fff;
    display: flex;
    gap: 15px;
    cursor: pointer;
}

.coupon-item:active {
    opacity: 0.9;
}

.coupon-item.used {
    background: linear-gradient(135deg, #9e9e9e 0%, #757575 100%);
}

.coupon-value {
    text-align: center;
    min-width: 80px;
}

.coupon-amount {
    font-size: 32px;
    font-weight: 700;
}

.coupon-unit {
    font-size: 12px;
    opacity: 0.9;
}

.coupon-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.coupon-title {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 4px;
}

.coupon-desc {
    font-size: 12px;
    opacity: 0.9;
    margin-bottom: 4px;
}

.coupon-time {
    font-size: 11px;
    opacity: 0.8;
}

.coupon-action {
    display: flex;
    align-items: center;
}

.coupon-btn {
    padding: 6px 14px;
    background: #fff;
    color: #ff5722;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
}

.coupon-item.used .coupon-btn {
    color: #999;
}

/* ===== 报价列表页面 ===== */
.quote-list {
    padding: 12px 15px;
}

.quote-item {
    background: #fff;
    border-radius: 10px;
    padding: 14px;
    margin-bottom: 10px;
    cursor: pointer;
}

.quote-item:active {
    opacity: 0.9;
}

.quote-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.quote-title {
    font-size: 15px;
    font-weight: 600;
    color: #333;
}

.quote-status {
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 4px;
}

.quote-status.pending {
    color: #ff9800;
    background: #fff3e0;
}

.quote-status.accepted {
    color: #4caf50;
    background: #e8f5e9;
}

.quote-price {
    font-size: 18px;
    font-weight: 700;
    color: #ff5722;
}

.quote-unit {
    font-size: 12px;
    font-weight: normal;
    color: #999;
}

/* ===== 收藏列表页面 ===== */
.favorite-list {
    padding: 12px 15px;
}

.favorite-item {
    background: #fff;
    border-radius: 10px;
    padding: 12px;
    margin-bottom: 10px;
    display: flex;
    gap: 12px;
    cursor: pointer;
}

.favorite-item:active {
    opacity: 0.9;
}

.favorite-img {
    width: 90px;
    height: 70px;
    border-radius: 8px;
    background: #e0e0e0;
    flex-shrink: 0;
}

.favorite-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.favorite-title {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin-bottom: 6px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.favorite-price {
    font-size: 16px;
    font-weight: 700;
    color: #ff5722;
}

.favorite-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.favorite-btn {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #f5f5f5;
    display: flex;
    align-items: center;
    justify-content: center;
}

.favorite-btn svg {
    width: 16px;
    height: 16px;
    color: #999;
}

.favorite-btn.active svg {
    color: #ff5722;
}

/* ===== 发布列表页面 ===== */
.post-list {
    padding: 12px 15px;
}

.post-item {
    background: #fff;
    border-radius: 10px;
    padding: 14px;
    margin-bottom: 10px;
    cursor: pointer;
}

.post-item:active {
    opacity: 0.9;
}

.post-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.post-title {
    font-size: 15px;
    font-weight: 600;
    color: #333;
}

.post-time {
    font-size: 11px;
    color: #999;
}

.post-content {
    font-size: 13px;
    color: #666;
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.post-stats {
    display: flex;
    gap: 20px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #f0f0f0;
}

.post-stat {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: #999;
}

.post-stat svg {
    width: 14px;
    height: 14px;
}

/* ===== 回复列表页面 ===== */
.reply-list {
    padding: 12px 15px;
}

.reply-item {
    background: #fff;
    border-radius: 10px;
    padding: 14px;
    margin-bottom: 10px;
    cursor: pointer;
}

.reply-item:active {
    opacity: 0.9;
}

.reply-origin {
    font-size: 12px;
    color: #999;
    margin-bottom: 8px;
}

.reply-origin span {
    color: #0066cc;
}

.reply-content {
    font-size: 14px;
    color: #333;
    line-height: 1.6;
    margin-bottom: 10px;
}

.reply-preview {
    background: #f8f8f8;
    padding: 10px;
    border-radius: 6px;
    font-size: 13px;
    color: #666;
    border-left: 3px solid #e0e0e0;
}

.reply-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
}

.reply-user {
    font-size: 12px;
    color: #0066cc;
}

.reply-time {
    font-size: 11px;
    color: #999;
}

/* ===== 订单状态切换 ===== */
.order-tabs {
    display: flex;
    background: #fff;
    padding: 0 15px;
    margin-top: 12px;
    border-radius: 10px;
    margin-left: 15px;
    margin-right: 15px;
}

.order-tab {
    flex: 1;
    text-align: center;
    padding: 12px 0;
    font-size: 14px;
    color: #666;
    position: relative;
}

.order-tab.active {
    color: #0066cc;
    font-weight: 600;
}

.order-tab.active::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 30px;
    height: 3px;
    background: #0066cc;
    border-radius: 2px;
}

/* ===== 产业空间页面 ===== */
.industry-tabs {
    display: flex;
    padding: 15px 20px;
    gap: 20px;
    background: #f5f6f7;
}

.industry-tab {
    padding: 8px 16px;
    font-size: 14px;
    color: #666;
    cursor: pointer;
    transition: all 0.2s;
}

.industry-tab.active {
    background: #1a4b8c;
    color: #fff;
    font-weight: 600;
    border-radius: 20px;
}

.industry-list {
    padding: 0 15px;
}

.industry-list.hidden {
    display: none;
}

.industry-card {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 15px;
    cursor: pointer;
}

.industry-card:active {
    opacity: 0.9;
}

.industry-img {
    width: 100%;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.industry-img-text {
    color: rgba(255,255,255,0.9);
    font-size: 24px;
    font-weight: 600;
    text-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

.industry-info {
    padding: 15px;
}

.industry-name {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin-bottom: 8px;
}

.industry-address {
    font-size: 14px;
    color: #999;
    display: flex;
    align-items: center;
    gap: 4px;
}

.industry-address svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

.industry-arrow {
    font-size: 20px;
    color: #ccc;
    margin-left: auto;
    padding-right: 5px;
}

/* ===== 产业空间卡片底部导航按钮 ===== */
.industry-card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 15px 15px;
    gap: 10px;
}

.industry-tags {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.industry-tag {
    padding: 3px 10px;
    border-radius: 4px;
    font-size: 11px;
    background: #f0f7ff;
    color: #0066cc;
}

.industry-tag.green-tag {
    background: #e8f5e9;
    color: #2e7d32;
}

.industry-tag.orange-tag {
    background: #fff3e0;
    color: #e65100;
}

.industry-nav-btn {
    display: flex;
    align-items: center;
    gap: 4px;
    background: linear-gradient(135deg, #0066cc 0%, #00a0e9 100%);
    color: #fff;
    padding: 6px 14px;
    border-radius: 16px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    flex-shrink: 0;
}

.industry-nav-btn:active {
    transform: scale(0.95);
    opacity: 0.9;
}

.industry-nav-btn svg {
    width: 14px;
    height: 14px;
}

</style>
</head>
<body>
    <div class="app-container">
        <!-- 返回按钮 -->
        <div class="back-btn" id="backBtn" style="display:none;">
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                <path d="M19 12H5M12 19l-7-7 7-7"/>
            </svg>
        </div>

        <!-- ==================== 首页 ==================== -->
        <div class="page page-home active" id="page-home">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content">
                    <span class="nav-title">空天智链云</span>
                </div>
            </div>
            <div class="page-content home-content">
                
                <!-- 第1屏：Banner轮播 -->
                <div class="banner-section">
                    <div class="banner">
                        <div class="banner-slider">
                            <div class="banner-slide" style="background: linear-gradient(135deg, #1a4b8c 0%, #0066cc 100%);">
                                <div class="banner-text">
                                    <h2>Aerospace Link Cloud</h2>
                                    <p>空天智链云</p>
                                </div>
                                <span class="banner-more">more</span>
                            </div>
                            <div class="banner-slide" style="background: linear-gradient(135deg, #00b894 0%, #00cec9 100%);">
                                <div class="banner-text">
                                    <h2>科技创新服务</h2>
                                    <p>赋能企业数字化转型</p>
                                </div>
                                <span class="banner-more">more</span>
                            </div>
                            <div class="banner-slide" style="background: linear-gradient(135deg, #6c5ce7 0%, #a29bfe 100%);">
                                <div class="banner-text">
                                    <h2>AI智能助手</h2>
                                    <p>智慧服务新体验</p>
                                </div>
                                <span class="banner-more">more</span>
                            </div>
                        </div>
                        <div class="banner-dots">
                            <span class="dot active"></span>
                            <span class="dot"></span>
                            <span class="dot"></span>
                        </div>
                        <span class="banner-page">1/3</span>
                    </div>
                </div>

                <!-- 第1屏：核心数据 -->
                <div class="core-data">
                    <div class="data-item">
                        <span class="data-num blue">178<span class="data-unit">+</span></span>
                        <span class="data-label">入驻企业</span>
                    </div>
                    <div class="data-item">
                        <span class="data-num green">120<span class="data-unit">+</span></span>
                        <span class="data-label">需求对接</span>
                    </div>
                    <div class="data-item">
                        <span class="data-num orange">30<span class="data-unit">+</span></span>
                        <span class="data-label">科创活动</span>
                    </div>
                    <div class="data-item">
                        <span class="data-num yellow">100<span class="data-unit">+</span></span>
                        <span class="data-label">政策发布</span>
                    </div>
                </div>

                <!-- 第2屏：核心业务入口 -->
                <div class="business-entry">
                    <div class="business-card blue-card" data-page="tech-service">
                        <div class="card-pattern hexagon"></div>
                        <div class="card-content">
                            <h3>TECHNOLOGY SERVICES</h3>
                            <p>科技服务</p>
                        </div>
                        <span class="card-arrow">→</span>
                        <span class="card-more">more</span>
                    </div>
                    <div class="business-card green-card" data-page="industry-space">
                        <div class="card-pattern city"></div>
                        <div class="card-content">
                            <h3>INDUSTRIAL SPACE</h3>
                            <p>产业空间 <span class="sub-text">区域空间直达</span> →</p>
                        </div>
                        <span class="card-more">more</span>
                    </div>
                </div>

                <!-- 第3屏：AI机器人助手 -->
                <div class="ai-robot-banner" data-page="ai">
                    <div class="ai-robot-left">
                        <div class="ai-robot-badge">AI ROBOT Assistant</div>
                        <h3>AI 机器人助手</h3>
                        <span class="ai-arrow">→</span>
                    </div>
                    <div class="ai-robot-right">
                        <svg viewBox="0 0 60 80" class="ai-robot-icon">
                            <defs>
<linearGradient id="aiGrad" x1="0%" y1="0%" x2="100%" y2="100%">
                                    <stop offset="0%" style="stop-color:#ffffff"/>
                                    <stop offset="100%" style="stop-color:#e0f7fa"/>
                                </linearGradient>
                            </defs>
                            <ellipse cx="30" cy="65" rx="20" ry="8" fill="rgba(0,0,0,0.1)"/>
                            <path d="M15 50 L10 30 L20 25 L30 20 L40 25 L50 30 L45 50 Z" fill="url(#aiGrad)"/>
                            <circle cx="22" cy="35" r="4" fill="#0066cc"/>
                            <circle cx="38" cy="35" r="4" fill="#0066cc"/>
                            <path d="M25 45 Q30 50 35 45" stroke="#0066cc" stroke-width="2" fill="none"/>
                            <ellipse cx="30" cy="25" rx="8" ry="3" fill="#0066cc"/>
                            <path d="M20 55 L15 70 M40 55 L45 70" stroke="url(#aiGrad)" stroke-width="3"/>
                            <path d="M10 30 L5 15 L15 20 Z" fill="url(#aiGrad)"/>
                            <path d="M50 30 L55 15 L45 20 Z" fill="url(#aiGrad)"/>
                        </svg>
                        <div class="ai-robot-brand">
                            <span>Aerospace</span>
                            <small>Link Cloud</small>
                        </div>
                    </div>
                    <span class="ai-more">more</span>
                    <div class="banner-dots-small">
                        <span class="dot-small blue"></span>
                        <span class="dot-small green"></span>
                        <span class="dot-small darkblue"></span>
                    </div>
                </div>

                <!-- 第3屏：功能金刚区（8个模块） -->
                <div class="function-grid-section">
                    <div class="function-grid">
                        <div class="func-item" data-page="party-chain">
                            <div class="func-icon red-icon">
                                <svg viewBox="0 0 24 24" fill="currentColor">
                                    <path d="M12 2L2 7v10l10 5 10-5V7L12 2z"/>
                                    <path d="M9 12l2 2 4-4" stroke="white" stroke-width="2" fill="none"/>
                                </svg>
                                <span class="func-arrow">→</span>
                            </div>
                            <span class="func-name">空天信息党链</span>
                        </div>
                        <div class="func-item" data-page="product-publish">
                            <div class="func-icon blue-icon">
                                <svg viewBox="0 0 24 24" fill="currentColor">
                                    <circle cx="12" cy="12" r="8"/>
                                    <ellipse cx="12" cy="12" rx="10" ry="4" fill="none" stroke="currentColor" stroke-width="1"/>
                                </svg>
                                <span class="func-arrow blue">→</span>
                            </div>
                            <span class="func-name">产品发布</span>
                        </div>
                        <div class="func-item" data-page="enterprise-hall">
                            <div class="func-icon purple-icon">
                                <svg viewBox="0 0 24 24" fill="currentColor">
                                    <path d="M12 2L2 12h3v8h14v-8h3L12 2z"/>
                                    <rect x="9" y="14" width="6" height="6"/>
                                </svg>
                                <span class="func-arrow blue">→</span>
                            </div>
                            <span class="func-name">企业展厅</span>
                        </div>
                        <div class="func-item" data-page="industry-chain">
                            <div class="func-icon green-icon">
                                <svg viewBox="0 0 24 24" fill="currentColor">
                                    <rect x="3" y="8" width="18" height="12" rx="2"/>
                                    <rect x="5" y="10" width="4" height="3" fill="white"/>
                                    <rect x="10" y="13" width="4" height="5" fill="white"/>
                                    <rect x="15" y="11" width="4" height="3" fill="white"/>
                                </svg>
                                <span class="func-arrow orange">→</span>
                            </div>
                            <span class="func-name">产业链图谱</span>
                        </div>
                        <div class="func-item" data-page="life-service">
                            <div class="func-icon yellow-icon">
                                <svg viewBox="0 0 24 24" fill="currentColor">
                                    <circle cx="12" cy="7" r="4"/>
                                    <path d="M12 14c-4 0-7 2-7 5v2h14v-2c0-3-3-5-7-5z"/>
                                </svg>
                                <span class="func-arrow yellow">→</span>
                            </div>
                            <span class="func-name">生活服务</span>
                        </div>
                        <div class="func-item" data-page="policy">
                            <div class="func-icon red-icon2">
                                <svg viewBox="0 0 24 24" fill="currentColor">
                                    <rect x="5" y="3" width="14" height="18" rx="2"/>
                                    <line x1="8" y1="8" x2="16" y2="8" stroke="white" stroke-width="2"/>
                                    <line x1="8" y1="12" x2="16" y2="12" stroke="white" stroke-width="2"/>
                                    <line x1="8" y1="16" x2="12" y2="16" stroke="white" stroke-width="2"/>
                                </svg>
                                <span class="func-arrow red">→</span>
                            </div>
                            <span class="func-name">政策发布</span>
                        </div>
                        <div class="func-item" data-page="activity">
                            <div class="func-icon blue-icon2">
                                <svg viewBox="0 0 24 24" fill="currentColor">
                                    <circle cx="9" cy="7" r="4"/>
                                    <circle cx="15" cy="7" r="4"/>
                                    <path d="M12 14c-4 0-7 2-7 5v2h14v-2c0-3-3-5-7-5z"/>
                                </svg>
                                <span class="func-arrow blue">→</span>
                            </div>
                            <span class="func-name">科创活动</span>
                        </div>
                        <div class="func-item" data-page="supply-demand">
                            <div class="func-icon orange-icon2">
                                <svg viewBox="0 0 24 24" fill="currentColor">
                                    <ellipse cx="12" cy="16" rx="10" ry="4"/>
                                    <path d="M12 4c-3 0-6 2-6 6 0 4 6 6 6 6s6-2 6-6c0-4-3-6-6-6z"/>
                                </svg>
                                <span class="func-arrow orange">→</span>
                            </div>
                            <span class="func-name">供需对接</span>
                        </div>
                    </div>
                </div>

                <!-- 第4屏：政策资讯区 -->
                <div class="news-section">
                    <div class="section-header">
                        <span class="section-bar blue-bar"></span>
                        <span class="section-title">政策资讯</span>
                        <span class="section-more">更多 ></span>
                    </div>
                    
                    <!-- 大头条 -->
                    <div class="news-headline">
                        <div class="headline-badge">大头条</div>
                        <h3>武昌区"十大应用场景"，重磅发布！</h3>
                        <div class="headline-meta">
                            <span class="readers"><svg viewBox="0 0 24 24" width="14" height="14"><circle cx="12" cy="8" r="4"/><path d="M12 14c-4 0-7 2-7 5v1h14v-1c0-3-3-5-7-5z"/></svg> 20人阅读</span>
                            <span class="date">2025-11-03</span>
                        </div>
                    </div>

                    <!-- 政策列表 -->
                    <div class="news-list">
                        <div class="news-item">
                            <div class="news-content">
                                <h4>小斗政策导航台 | 关于组织开展2025年度"61020"科技创新成果推荐工作的通知</h4>
                                <p>各市、州、直管市、神农架林区科技局：根据《湖北省支持高新...</p>
                                <div class="news-meta">
                                    <span class="readers"><svg viewBox="0 0 24 24" width="12" height="12"><circle cx="12" cy="8" r="4"/><path d="M12 14c-4 0-7 2-7 5v1h14v-1c0-3-3-5-7-5z"/></svg> 15人阅读</span>
                                    <span class="date">2025-07-01</span>
                                </div>
                            </div>
                        </div>
                        <div class="news-item">
                            <div class="news-content">
                                <h4>小斗政策导航台 | 关于组织开展2025年"楚天英才计划"技术技能人才项目申报推荐工作的通知</h4>
                                <p>各市州、直管市、神农架林区党委人才工作领导小组办公室...</p>
                                <div class="news-meta">
                                    <span class="readers"><svg viewBox="0 0 24 24" width="12" height="12"><circle cx="12" cy="8" r="4"/><path d="M12 14c-4 0-7 2-7 5v1h14v-1c0-3-3-5-7-5z"/></svg> 3人阅读</span>
                                    <span class="date">2025-07-01</span>
                                </div>
                            </div>
                        </div>
                        <div class="news-item">
                            <div class="news-content">
                                <h4>小斗政策导航台 | 关于组织申报2025年湖北省支持高新技术企业发展专项资金的通知</h4>
                                <p>各市、州、直管市、神农架林区科技局：根据《湖北省支持高新...</p>
                                <div class="news-meta">
                                    <span class="readers"><svg viewBox="0 0 24 24" width="12" height="12"><circle cx="12" cy="8" r="4"/><path d="M12 14c-4 0-7 2-7 5v1h14v-1c0-3-3-5-7-5z"/></svg> 1人阅读</span>
                                    <span class="date">2025-07-01</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- 第5屏：产业动态区 -->
                <div class="news-section">
                    <div class="section-header">
                        <span class="section-bar blue-bar"></span>
                        <span class="section-title">产业动态</span>
                        <span class="section-more">更多 ></span>
                    </div>
                    
                    <div class="news-list">
                        <div class="news-item with-image">
                            <div class="news-image" style="background: linear-gradient(135deg, #0066cc 0%, #00a0e9 100%);"></div>
                            <div class="news-content">
                                <h4>让技术在批量应用前先"练内功"，武汉七成北斗产品上市前先在这里"通关"</h4>
                                <div class="news-meta">
                                    <span class="readers"><svg viewBox="0 0 24 24" width="12" height="12"><circle cx="12" cy="8" r="4"/><path d="M12 14c-4 0-7 2-7 5v1h14v-1c0-3-3-5-7-5z"/></svg> 2人阅读</span>
                                    <span class="date">2026-04-13</span>
                                </div>
                            </div>
                        </div>
                        <div class="news-item with-image">
                            <div class="news-image" style="background: linear-gradient(135deg, #00b894 0%, #00cec9 100%);"></div>
                            <div class="news-content">
                                <h4>武汉16款北斗产品进入中央采购目录</h4>
                                <div class="news-meta">
                                    <span class="readers"><svg viewBox="0 0 24 24" width="12" height="12"><circle cx="12" cy="8" r="4"/><path d="M12 14c-4 0-7 2-7 5v1h14v-1c0-3-3-5-7-5z"/></svg> 1人阅读</span>
                                    <span class="date">2026-04-13</span>
                                </div>
                            </div>
                        </div>
                        <div class="news-item with-image">
                            <div class="news-image" style="background: linear-gradient(135deg, #6c5ce7 0%, #a29bfe 100%);"></div>
                            <div class="news-content">
                                <h4>盛阅春调研空天信息产业发展</h4>
                                <div class="news-meta">
                                    <span class="date">2026-04-13</span>
                                </div>
                            </div>
                        </div>
                        <div class="news-item with-image">
                            <div class="news-image" style="background: linear-gradient(135deg, #fd79a8 0%, #e84393 100%);"></div>
                            <div class="news-content">
                                <h4>法治护航促发展 创新聚力绘新篇 —— 武昌区高科技企业《民营经济促进法》宣贯会</h4>
                                <div class="news-meta">
                                    <span class="date">2025-06-27</span>
                                </div>
                            </div>
                        </div>
                        <div class="news-item with-image">
                            <div class="news-image" style="background: linear-gradient(135deg, #ffa726 0%, #ff9800 100%);"></div>
                            <div class="news-content">
                                <h4>武汉市中小企业商业价值信用贷款政策宣贯会</h4>
                                <div class="news-meta">
                                    <span class="readers"><svg viewBox="0 0 24 24" width="12" height="12"><circle cx="12" cy="8" r="4"/><path d="M12 14c-4 0-7 2-7 5v1h14v-1c0-3-3-5-7-5z"/></svg> 9人阅读</span>
                                    <span class="date">2025-06-20</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="bottom-placeholder"></div>
            </div>
        </div>

        <!-- ==================== AI助手页面 ==================== -->
        <div class="page page-ai" id="page-ai">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content">
                    <span class="nav-title">AI助手</span>
                </div>
            </div>
            <div class="page-content ai-page-content">
                <div class="ai-chat-container">
                    <div class="ai-welcome">
                        <svg viewBox="0 0 80 80" class="robot-svg large">
                            <defs>
                                <linearGradient id="robotGrad2" x1="0%" y1="0%" x2="100%" y2="100%">
                                    <stop offset="0%" style="stop-color:#0066cc"/>
                                    <stop offset="100%" style="stop-color:#00a0e9"/>
                                </linearGradient>
                            </defs>
                            <circle cx="40" cy="40" r="38" fill="url(#robotGrad2)"/>
                            <circle cx="28" cy="35" r="5" fill="white"/>
                            <circle cx="52" cy="35" r="5" fill="white"/>
                            <circle cx="28" cy="35" r="2" fill="#0066cc"/>
                            <circle cx="52" cy="35" r="2" fill="#0066cc"/>
                            <path d="M30 50 Q40 58 50 50" stroke="white" stroke-width="3" fill="none" stroke-linecap="round"/>
                            <rect x="32" y="20" width="16" height="4" rx="2" fill="white"/>
                        </svg>
                        <h2>空天智链AI助手</h2>
                        <p>您好！我是空天智链AI助手，可以为您提供：</p>
                        <ul class="ai-services">
                            <li>政策咨询服务</li>
                            <li>产业空间查询</li>
                            <li>企业需求对接</li>
                            <li>科技服务指导</li>
                        </ul>
                    </div>
                    
                    <div class="ai-quick-questions">
                        <div class="quick-title">快捷问题</div>
                        <div class="quick-btns">
                            <button class="quick-btn">园区有哪些优惠政策？</button>
                            <button class="quick-btn">如何发布企业需求？</button>
                            <button class="quick-btn">科创活动在哪里报名？</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- ==================== 个人中心 ==================== -->
        <div class="page page-profile" id="page-profile">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content">
                    <span class="nav-title">我的</span>
                </div>
            </div>
            <div class="page-content profile-content">
                <div class="profile-header">
                    <div class="avatar-area">
                        <div class="avatar">
                            <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/></svg>
                        </div>
                        <p class="login-hint">请点击登录</p>
                    </div>
                </div>

                <div class="order-section">
                    <div class="section-header">
                        <span class="section-title">我的订单</span>
                        <span class="section-more" data-page="profile-orders">所有订单 <svg viewBox="0 0 24 24" width="16" height="16"><path d="M9.4 18L8 16.6l4.6-4.6L8 7.4 9.4 6l6 6-6 6z" fill="currentColor"/></svg></span>
                    </div>
                    <div class="order-status">
                        <div class="status-item" data-page="profile-orders-active"><div class="status-icon"><svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8-8-8z"/></svg></div><span>进行中</span></div>
                        <div class="status-item" data-page="profile-orders-completed"><div class="status-icon"><svg viewBox="0 0 24 24" fill="currentColor"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z"/></svg></div><span>已完成</span></div>
                        <div class="status-item" data-page="profile-orders-cancelled"><div class="status-icon"><svg viewBox="0 0 24 24" fill="currentColor"><path d="M19 13H5v-2h14v2z"/></svg></div><span>已取消</span></div>
                        <div class="status-item" data-page="profile-orders-refund"><div class="status-icon"><svg viewBox="0 0 24 24" fill="currentColor"><circle cx="12" cy="12" r="8"/></svg></div><span>售后中</span></div>
                    </div>
                </div>

                <div class="menu-section">
                    <div class="menu-group">
                        <div class="menu-item" data-page="profile-messages"><div class="menu-left"><svg viewBox="0 0 24 24" fill="currentColor"><path d="M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H6l-2 2V4h16v12z"/></svg><span>最新消息</span></div><svg viewBox="0 0 24 24" width="20" height="20"><path d="M9.4 18L8 16.6l4.6-4.6L8 7.4 9.4 6l6 6-6 6z" fill="#ccc"/></svg></div>
                        <div class="menu-item" data-page="profile-subscribe"><div class="menu-left"><svg viewBox="0 0 24 24" fill="currentColor"><path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-5 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z"/></svg><span>我的订阅</span></div><svg viewBox="0 0 24 24" width="20" height="20"><path d="M9.4 18L8 16.6l4.6-4.6L8 7.4 9.4 6l6 6-6 6z" fill="#ccc"/></svg></div>
                        <div class="menu-item" data-page="profile-forms"><div class="menu-left"><svg viewBox="0 0 24 24" fill="currentColor"><path d="M14 2H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V8l-6-6zm4 18H6V4h7v5h5v11z"/></svg><span>我的表单</span></div><svg viewBox="0 0 24 24" width="20" height="20"><path d="M9.4 18L8 16.6l4.6-4.6L8 7.4 9.4 6l6 6-6 6z" fill="#ccc"/></svg></div>
                        <div class="menu-item" data-page="profile-checkin"><div class="menu-left"><svg viewBox="0 0 24 24" fill="currentColor"><path d="M19 3h-4.18C14.4 1.84 13.3 1 12 1c-1.3 0-2.4.84-2.82 2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-7 0c.55 0 1 .45 1 1s-.45 1-1 1-1-.45-1-1 .45-1 1-1zm2 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z"/></svg><span>我的打卡</span></div><svg viewBox="0 0 24 24" width="20" height="20"><path d="M9.4 18L8 16.6l4.6-4.6L8 7.4 9.4 6l6 6-6 6z" fill="#ccc"/></svg></div>
                        <div class="menu-item" data-page="profile-coupons"><div class="menu-left"><svg viewBox="0 0 24 24" fill="currentColor"><path d="M21.41 11.58l-9-9C12.05 2.22 11.55 2 11 2H4c-1.1 0-2 .9-2 2v7c0 .55.22 1.05.59 1.42l9 9c.36.36.86.58 1.41.58.55 0 1.05-.22 1.41-.59l7-7c.37-.36.59-.86.59-1.41 0-.55-.23-1.06-.59-1.42zM5.5 7C4.67 7 4 6.33 4 5.5S4.67 4 5.5 4 7 4.67 7 5.5 6.33 7 5.5 7z"/></svg><span>我的优惠券</span></div><svg viewBox="0 0 24 24" width="20" height="20"><path d="M9.4 18L8 16.6l4.6-4.6L8 7.4 9.4 6l6 6-6 6z" fill="#ccc"/></svg></div>
                        <div class="menu-item" data-page="profile-quotes"><div class="menu-left"><svg viewBox="0 0 24 24" fill="currentColor"><path d="M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H6l-2 2V4h16v12z"/></svg><span>我的报价</span></div><svg viewBox="0 0 24 24" width="20" height="20"><path d="M9.4 18L8 16.6l4.6-4.6L8 7.4 9.4 6l6 6-6 6z" fill="#ccc"/></svg></div>
                        <div class="menu-item" data-page="profile-favorites"><div class="menu-left"><svg viewBox="0 0 24 24" fill="currentColor"><path d="M16.5 3c-1.74 0-3.41.81-4.5 2.09C10.91 3.81 9.24 3 7.5 3 4.42 3 2 5.42 2 8.5c0 3.78 3.4 6.86 8.55 11.54L12 21.35l1.45-1.32C18.6 15.36 22 12.28 22 8.5 22 5.42 19.58 3 16.5 3z"/></svg><span>我的收藏</span></div><svg viewBox="0 0 24 24" width="20" height="20"><path d="M9.4 18L8 16.6l4.6-4.6L8 7.4 9.4 6l6 6-6 6z" fill="#ccc"/></svg></div>
                    </div>
                    <div class="menu-group">
                        <div class="menu-item" data-page="profile-posts"><div class="menu-left"><svg viewBox="0 0 24 24" fill="currentColor"><path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-5 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z"/></svg><span>我的发布</span></div><svg viewBox="0 0 24 24" width="20" height="20"><path d="M9.4 18L8 16.6l4.6-4.6L8 7.4 9.4 6l6 6-6 6z" fill="#ccc"/></svg></div>
                        <div class="menu-item" data-page="profile-replies"><div class="menu-left"><svg viewBox="0 0 24 24" fill="currentColor"><path d="M21 6h-2v9H6v2c0 .55.45 1 1 1h11l4 4V7c0-.55-.45-1-1-1zm-4 6V3c0-.55-.45-1-1-1H3c-.55 0-1 .45-1 1v14l4-4h10c.55 0 1-.45 1-1z"/></svg><span>回复我的</span></div><svg viewBox="0 0 24 24" width="20" height="20"><path d="M9.4 18L8 16.6l4.6-4.6L8 7.4 9.4 6l6 6-6 6z" fill="#ccc"/></svg></div>
                    </div>
                </div>
                <div class="bottom-placeholder"></div>
            </div>
        </div>

        <!-- ==================== 科技服务页面 ==================== -->
        <div class="page page-sub" id="page-tech-service">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content sub-nav">
                    <span class="nav-back" data-page="home">←</span>
                    <span class="nav-title">科创服务</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <!-- 品牌头图 -->
                <div class="sub-banner tech-banner">
                    <div class="sub-banner-left">
                        <span class="sub-brand">Aerospace Link Cloud</span>
                        <h2>科创服务</h2>
                        <p>TECHNOLOGY SERVICES</p>
                        <span class="sub-arrow">→</span>
                    </div>
                    <span class="sub-more">more</span>
                    <div class="sub-dots">
                        <span class="dot-sm blue"></span>
                        <span class="dot-sm green"></span>
                        <span class="dot-sm dark"></span>
                    </div>
                </div>

                <!-- 功能模块网格 2x5 -->
                <div class="service-grid">
                    <div class="service-item" data-page="meeting">
                        <span class="service-name">会场预约</span>
                        <span class="service-en">Conference Hall</span>
                    </div>
                    <div class="service-item skyblue" data-page="pilot">
                        <span class="service-name">中试平台</span>
                        <span class="service-en">Pilot-scale Platform</span>
                    </div>
                    <div class="service-item teal" data-page="broker">
                        <span class="service-name">技术经纪人服务</span>
                        <span class="service-en">Technology Brokerage</span>
                    </div>
                    <div class="service-item red" data-page="quality">
                        <span class="service-name">质量服务</span>
                        <span class="service-en">Quality Of Service</span>
                    </div>
                    <div class="service-item darkblue" data-page="ip">
                        <span class="service-name">知识产权</span>
                        <span class="service-en">Intellectual Property</span>
                    </div>
                    <div class="service-item green" data-page="declare">
                        <span class="service-name">申报服务</span>
                        <span class="service-en">Declaration Service</span>
                    </div>
                    <div class="service-item yellow" data-page="transform">
                        <span class="service-name">成果转化</span>
                        <span class="service-en">Transformation</span>
                    </div>
                    <div class="service-item brown" data-page="fintech">
                        <span class="service-name">科技金融</span>
                        <span class="service-en">FinTech</span>
                    </div>
                    <div class="service-item darkgreen" data-page="talent">
                        <span class="service-name">人才服务</span>
                        <span class="service-en">Talent Service</span>
                    </div>
                    <div class="service-item purple" data-page="supply-demand">
                        <span class="service-name">供需对接</span>
                        <span class="service-en">Supply And Demand</span>
                    </div>
                </div>

                <!-- 悬浮首页按钮 -->
                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                        <path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/>
                        <polyline points="9 22 9 12 15 12 15 22"/>
                    </svg>
                </div>

                <div class="bottom-placeholder"></div>
            </div>
        </div>

        <!-- ==================== 会场预约页面 ==================== -->
        <div class="page page-sub" id="page-meeting">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="tech-service">←</span>
                    <span class="nav-title">会场预约</span>
                </div>
            </div>
            <div class="page-content meeting-content">
                <!-- 搜索框 -->
                <div class="search-bar">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                        <circle cx="11" cy="11" r="8"/>
                        <path d="M21 21l-4.35-4.35"/>
                    </svg>
                    <span class="search-placeholder">请输入关键词</span>
                </div>

                <!-- 会场列表标题 -->
                <div class="list-header">
                    <span class="list-bar"></span>
                    <span class="list-title">会场预约</span>
                    <span class="list-more">更多 ></span>
                </div>

                <!-- 会场列表 -->
                <div class="venue-list">
                    <div class="venue-item">
                        <div class="venue-image" style="background: linear-gradient(135deg, #0066cc 0%, #00a0e9 100%);"></div>
                        <div class="venue-info">
                            <h3>阳光大厦湖北省技术市场协会</h3>
                            <div class="venue-tags">
                                <span class="venue-tag">会议室</span>
                            </div>
                            <div class="venue-price">¥ 1000.00<span class="unit">/ 半天</span></div>
                            <div class="venue-address">
                                <svgviewBox="0 0 24 24" fill="currentColor"><path d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z"/></svg>
                                <span>武汉市洪山区</span>
                            </div>
                        </div>
                        <button class="book-btn">立即预约</button>
                    </div>

                    <div class="venue-item">
                        <div class="venue-image" style="background: linear-gradient(135deg, #00b894 0%, #00cec9 100%);"></div>
                        <div class="venue-info">
                            <h3>水果湖街道玉丰酒店</h3>
                            <div class="venue-tags">
                                <span class="venue-tag">会议厅</span>
                            </div>
                            <div class="venue-price price-negotiable">价格面议</div>
                            <div class="venue-address">
                                <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z"/></svg>
                                <span>武汉市水果湖街道玉丰酒店</span>
                            </div>
                        </div>
                        <button class="book-btn">立即预约</button>
                    </div>

                    <div class="venue-item">
                        <div class="venue-image" style="background: linear-gradient(135deg, #6c5ce7 0%, #a29bfe 100%);"></div>
                        <div class="venue-info">
                            <h3>斗转科技园会议中心</h3>
                            <div class="venue-tags">
                                <span class="venue-tag">多功能厅</span>
                            </div>
                            <div class="venue-price">¥ 2000.00<span class="unit">/ 半天</span></div>
                            <div class="venue-address">
                                <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z"/></svg>
                                <span>武汉市武昌区中北路</span>
                            </div>
                        </div>
                        <button class="book-btn">立即预约</button>
                    </div>
                </div>

                <!-- 悬浮首页按钮 -->
                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                        <path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/>
                        <polyline points="9 22 9 12 15 12 15 22"/>
                    </svg>
                </div>
            </div>
        </div>

        <!-- ==================== 中试服务页面 ==================== -->
        <div class="page page-sub" id="page-pilot">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="tech-service">←</span>
                    <span class="nav-title">中试服务</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="sub-banner pilot-banner">
                    <div class="sub-banner-left">
                        <span class="sub-brand">HUBEI BEIDOU PILOT PLATFORM</span>
                        <h2>湖北省北斗创新应用中试平台</h2>
                        <p>PILOT PLATFORM</p>
                        <span class="sub-arrow">→</span>
                    </div>
                    <span class="sub-more">more</span>
                </div>
                
                <div class="tab-nav-section">
                    <div class="tab-nav">
                        <span class="tab-nav-item active">服务内容</span>
                        <span class="tab-nav-item">服务机构</span>
                        <span class="tab-nav-item">服务清单</span>
                    </div>
                </div>

                <div class="service-detail-list">
                    <div class="service-detail-item">
                        <div class="sd-left"><span class="sd-num">01</span></div>
                        <div class="sd-content">
                            <div class="sd-title">北斗产品计量与检测</div>
                            <p>针对芯片、模块、终端、天线等全产业链产品，进行射频、天线、环境适应性等143项参数的检测。</p>
                        </div>
                    </div>
                    <div class="service-detail-item">
                        <div class="sd-left"><span class="sd-num">02</span></div>
                        <div class="sd-content">
                            <div class="sd-title">材料测试</div>
                            <p>提供XPS、SEM、TEM等专业的微观物理/化学性能测试。</p>
                        </div>
                    </div>
                    <div class="service-detail-item">
                        <div class="sd-left"><span class="sd-num">03</span></div>
                        <div class="sd-content">
                            <div class="sd-title">技术研发</div>
                            <p>协助进行技术创新和新产品开发。</p>
                        </div>
                    </div>
                    <div class="service-detail-item">
                        <div class="sd-left"><span class="sd-num">04</span></div>
                        <div class="sd-content">
                            <div class="sd-title">软硬件开发及工业设计</div>
                            <p>提供工业设计、软件编写及硬件电路开发服务。</p>
                        </div>
                    </div>
                    <div class="service-detail-item">
                        <div class="sd-left"><span class="sd-num">05</span></div>
                        <div class="sd-content">
                            <div class="sd-title">标准化、认证认可</div>
                            <p>协助制定质量标准及办理各类产品认证。</p>
                        </div>
                    </div>
                    <div class="service-detail-item">
                        <div class="sd-left"><span class="sd-num">06</span></div>
                        <div class="sd-content">
                            <div class="sd-title">高价值专利服务</div>
                            <p>包含专利导航、维权、快审登记等知识产权服务。</p>
                        </div>
                    </div>
                    <div class="service-detail-item">
                        <div class="sd-left"><span class="sd-num">07</span></div>
                        <div class="sd-content">
                            <div class="sd-title">科技金融</div>
                            <p>提供投融资对接及知识产权质押贷款服务。</p>
                        </div>
                    </div>
                    <div class="service-detail-item">
                        <div class="sd-left"><span class="sd-num">08</span></div>
                        <div class="sd-content">
                            <div class="sd-title">法律服务</div>
                            <p>提供法治宣传、法律咨询、援助及公证等一站式服务。</p>
                        </div>
                    </div>
                </div>

                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 技术经纪人页面 ==================== -->
        <div class="page page-sub" id="page-broker">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="tech-service">←</span>
                    <span class="nav-title">技术经纪人</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="sub-banner broker-banner">
                    <div class="sub-banner-left">
                        <span class="sub-brand">TECHNICAL BROKER</span>
                        <h2>技术经纪人服务</h2>
                        <p>TECHNOLOGY BROKER SERVICES</p>
                        <span class="sub-arrow">→</span>
                    </div>
                    <span class="sub-more">more</span>
                </div>
                
                <div class="tab-nav-section">
                    <div class="tab-nav green-nav">
                        <span class="tab-nav-item active">服务团队</span>
                        <span class="tab-nav-item">服务流程</span>
                    </div>
                </div>

                <div class="broker-list">
                    <div class="broker-card">
                        <div class="broker-header">
                            <div class="broker-avatar">邱</div>
                            <div class="broker-info">
                                <h3>邱锦</h3>
                                <span class="broker-title">高级技术经纪人</span>
                            </div>
                        </div>
                        <div class="broker-tags">
                            <span class="broker-tag blue-tag">科技孵化</span>
                            <span class="broker-tag blue-tag">产业转化</span>
                            <span class="broker-tag blue-tag">项目申报</span>
                        </div>
                        <div class="broker-profile">
                            <span class="profile-tag green-tag">个人简介</span>
                            <p>从事技术转移转化工作5年，主导技术对接项目20+项，擅长技术评估与商业化路径设计。</p>
                        </div>
                    </div>
                    <div class="broker-card">
                        <div class="broker-header">
                            <div class="broker-avatar" style="background: linear-gradient(135deg, #26a69a, #00897b);">陈</div>
                            <div class="broker-info">
                                <h3>陈帅红</h3>
                                <span class="broker-title">初级技术经纪人</span>
                            </div>
                        </div>
                        <div class="broker-tags">
                            <span class="broker-tag blue-tag">成果对接</span>
                            <span class="broker-tag blue-tag">产学研合作</span>
                        </div>
                        <div class="broker-profile">
                            <span class="profile-tag green-tag">个人简介</span>
                            <p>专注科技企业服务，帮助企业对接高校科研资源，完成成果转化项目10+项。</p>
                        </div>
                    </div>
                </div>

                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 质量服务页面 ==================== -->
        <div class="page page-sub" id="page-quality">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="tech-service">←</span>
                    <span class="nav-title">质量服务</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="sub-banner quality-banner">
                    <div class="sub-banner-left">
                        <span class="sub-brand">QUALITY SERVICE STATION</span>
                        <h2>斗转科技园质量服务站</h2>
                        <p>QUALITY SERVICE</p>
                        <span class="sub-arrow">→</span>
                    </div>
                    <span class="sub-more">more</span>
                </div>
                
                <div class="tab-nav-section">
                    <div class="tab-nav red-nav">
                        <span class="tab-nav-item active">服务站介绍</span>
                        <span class="tab-nav-item">合作机构</span>
                        <span class="tab-nav-item">服务清单</span>
                    </div>
                </div>

                <div class="intro-content">
                    <p>斗转科技园质量服务站是在市场监督管理局指导下成立的省级服务站，致力于为园区企业提供一站式专业质量服务，助力企业提升竞争力。</p>
                </div>

                <div class="partner-list">
                    <div class="partner-title red-title">合作机构</div>
                    <div class="partner-item red-item">武汉市标准化研究院</div>
                    <div class="partner-item red-item">中国质量认证中心武汉分中心</div>
                    <div class="partner-item red-item">武汉地震计量检定与测量工程研究院</div>
                    <div class="partner-item red-item">方圆标志认证集团有限公司</div>
                    <div class="partner-item red-item">中标云（湖北）标准科技有限公司</div>
                </div>

                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 知识产权页面 ==================== -->
        <div class="page page-sub" id="page-ip">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="tech-service">←</span>
                    <span class="nav-title">知识产权</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="sub-banner ip-banner">
                    <div class="sub-banner-left">
                        <span class="sub-brand">INTELLECTUAL PROPERTY</span>
                        <h2>知识产权保护工作站</h2>
                        <p>IP PROTECTION WORKSTATION</p>
                        <span class="sub-arrow">→</span>
                    </div>
                    <span class="sub-more">more</span>
                </div>
                
                <div class="tab-nav-section">
                    <div class="tab-nav green-nav">
                        <span class="tab-nav-item active">服务站介绍</span>
                        <span class="tab-nav-item">合作机构</span>
                        <span class="tab-nav-item">服务清单</span>
                    </div>
                </div>

                <div class="intro-content">
                    <p>斗转科技园知识产权保护工作站成立于2020年，由市、区市场监督管理局管理。工作站服务近40家企业，开展130场活动，成功调解92件知识产权纠纷，获得省级站认定。</p>
                </div>

                <div class="partner-list">
                    <div class="partner-title green-title">合作机构</div>
                    <div class="partner-item green-item">武汉红讯软件技术服务有限公司</div>
                    <div class="partner-item green-item">湖北睿之扬科技有限公司</div>
                    <div class="partner-item green-item">武汉知识产权交易所</div>
                    <div class="partner-item green-item">中部知光技术转移有限公司</div>
                    <div class="partner-item green-item">武汉红宝石知识产权服务公司</div>
                </div>

                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 申报服务页面 ==================== -->
        <div class="page page-sub" id="page-declare">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="tech-service">←</span>
                    <span class="nav-title">申报服务</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="sub-banner declare-banner">
                    <div class="sub-banner-left">
                        <span class="sub-brand">PROJECT APPLICATION</span>
                        <h2>斗转科技园 项目申报服务站</h2>
                        <p>PROJECT DECLARATION</p>
                        <span class="sub-arrow">→</span>
                    </div>
                    <span class="sub-more">more</span>
                </div>
                
                <div class="tab-nav-section">
                    <div class="tab-nav">
                        <span class="tab-nav-item active">服务站介绍</span>
                        <span class="tab-nav-item">服务清单</span>
                    </div>
                </div>

                <div class="intro-content">
                    <p>斗转科技园项目申报服务站聚焦北斗及地理信息应用领域，通过"技术+企业+资本"的服务模式，助力企业申报高新技术企业、专精特新企业等资质认定。</p>
                </div>

                <div class="declare-table">
                    <div class="declare-header"><span>项目类型</span><span>补贴（万元）</span></div>
                    <div class="declare-row"><span>科技苗子</span><span>20</span></div>
                    <div class="declare-row"><span>高新企业培育</span><span>30</span></div>
                    <div class="declare-row"><span>数字化转型</span><span>30</span></div>
                    <div class="declare-row"><span>研发型企业</span><span>50</span></div>
                    <div class="declare-row"><span>博士后工作站</span><span>100</span></div>
                </div>

                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 成果转化页面 ==================== -->
        <div class="page page-sub" id="page-transform">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="tech-service">←</span>
                    <span class="nav-title">成果转化</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="sub-banner transform-banner">
                    <div class="sub-banner-left">
                        <span class="sub-brand">ACHIEVEMENT TRANSFORMATION</span>
                        <h2>斗转科技园 成果转化示范机构</h2>
                        <p>TRANSFORMATION DEMONSTRATION</p>
                        <span class="sub-arrow">→</span>
                    </div>
                    <span class="sub-more">more</span>
                </div>
                
                <div class="tab-nav-section">
                    <div class="tab-nav">
                        <span class="tab-nav-item active">服务站简介</span>
                        <span class="tab-nav-item">服务清单</span>
                    </div>
                </div>

                <div class="intro-content">
                    <p>成果转化服务站依托高校科研院所资源，与武汉大学等高校建立合作关系，为科技型初创企业提供场地、设施、技术对接等全方位支持，涵盖知识产权、科技人才、科技金融等领域服务。</p>
                </div>

                <div class="transform-list">
                    <div class="transform-item">
                        <div class="transform-num">01</div>
                        <div class="transform-info">
                            <h4>技术对接与成果转化</h4>
                            <p>挖掘企业需求，搭建合作平台，推动技术落地转化。</p>
                        </div>
                    </div>
                    <div class="transform-item">
                        <div class="transform-num">02</div>
                        <div class="transform-info">
                            <h4>知识产权运营</h4>
                            <p>涵盖培育布局、交易服务、维权援助等全链条服务。</p>
                        </div>
                    </div>
                </div>

                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 科技金融页面 ==================== -->
        <div class="page page-sub" id="page-fintech">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="tech-service">←</span>
                    <span class="nav-title">科技金融</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="sub-banner fintech-banner">
                    <div class="sub-banner-left">
                        <span class="sub-brand">FINANCIAL SERVICES</span>
                        <h2>斗转科技园 金融服务</h2>
                        <p>FINANCIAL SERVICES</p>
                        <span class="sub-arrow">→</span>
                    </div>
                    <span class="sub-more">more</span>
                </div>
                
                <div class="tab-nav-section">
                    <div class="tab-nav blue-nav">
                        <span class="tab-nav-item active">合作银行</span>
                        <span class="tab-nav-item">投融资机构</span>
                        <span class="tab-nav-item">担保公司</span>
                    </div>
                </div>

                <div class="bank-grid">
                    <div class="bank-item"><div class="bank-logo" style="background: #0066cc;">邮</div><span>中国邮政储蓄银行</span></div>
                    <div class="bank-item"><div class="bank-logo" style="background: #e74c3c;">中</div><span>中国银行</span></div>
                    <div class="bank-item"><div class="bank-logo" style="background: #0066cc;">工</div><span>工商银行</span></div>
                    <div class="bank-item"><div class="bank-logo" style="background: #27ae60;">农</div><span>农业银行</span></div>
                    <div class="bank-item"><div class="bank-logo" style="background: #0066cc;">建</div><span>建设银行</span></div>
                    <div class="bank-item"><div class="bank-logo" style="background: #e74c3c;">招</div><span>招商银行</span></div>
                </div>

                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 人才服务页面 ==================== -->
        <div class="page page-sub" id="page-talent">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="tech-service">←</span>
                    <span class="nav-title">人才服务</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="sub-banner talent-banner">
                    <div class="sub-banner-left">
                        <span class="sub-brand">EXPERT THINK TANK</span>
                        <h2>北斗低空经济专家智库</h2>
                        <p>LOW ALTITUDE ECONOMY EXPERT</p>
                        <span class="sub-arrow">→</span>
                    </div>
                    <span class="sub-more">more</span>
                </div>
                
                <div class="tab-nav-section">
                    <div class="tab-nav">
                        <span class="tab-nav-item active">专业领域</span>
                        <span class="tab-nav-item">政策研究领域</span>
                    </div>
                </div>

                <div class="expert-list">
                    <div class="expert-item">
                        <div class="expert-avatar">刘</div>
                        <div class="expert-info">
                            <h4>刘经南</h4>
                            <p>中国工程院院士 | 武汉大学教授</p>
                            <span class="expert-field">北斗导航、GNSS</span>
                        </div>
                    </div>
                    <div class="expert-item">
                        <div class="expert-avatar" style="background: linear-gradient(135deg, #1a4b8c, #0066cc);">龚</div>
                        <div class="expert-info">
                            <h4>龚健雅</h4>
                            <p>中国科学院院士 | 武汉大学教授</p>
                            <span class="expert-field">GIS、遥感</span>
                        </div>
                    </div>
                </div>

                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 空天信息党链页面 ==================== -->
        <div class="page page-sub" id="page-party-chain">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="home">←</span>
                    <span class="nav-title">空天信息党建链</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="sub-banner party-banner">
                    <div class="sub-banner-left">
                        <span class="sub-brand">AEROSPACE INFORMATION INDUSTRY CHAIN</span>
                        <h2>武昌区空天信息产业链</h2>
                        <p>党委成员单位</p>
                        <span class="sub-arrow">→</span>
                    </div>
                </div>
                
                <div class="tab-nav-section">
                    <div class="tab-nav red-nav">
                        <span class="tab-nav-item active">党委成员单位</span>
                        <span class="tab-nav-item">团委成员单位</span>
                    </div>
                </div>

                <div class="party-list">
                    <div class="party-item">湖北长江北斗数字信息有限公司</div>
                    <div class="party-item">中国电信股份有限公司武汉分公司</div>
                    <div class="party-item">武汉大学国家大学科技园</div>
                    <div class="party-item">武汉市标准信息研究所</div>
                    <div class="party-item">武汉依迅北斗信息技术有限公司</div>
                    <div class="party-item">中部（集团）有限公司</div>
                    <div class="party-item">武汉大学测绘学院</div>
                </div>

                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 产品发布页面 ==================== -->
        <div class="page page-sub" id="page-product-publish">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="home">←</span>
                    <span class="nav-title">产品发布</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="meeting-search">
                    <div class="search-bar">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="11" cy="11" r="8"/><path d="M21 21l-4.35-4.35"/></svg>
                        <input type="text" placeholder="搜索北斗产品">
                    </div>
                </div>

                <div class="product-layout">
                    <div class="product-sidebar">
                        <div class="sidebar-item active">开普勒卫星科技</div>
                        <div class="sidebar-item">鸣飞伟业</div>
                        <div class="sidebar-item">湖北低空经济</div>
                        <div class="sidebar-item">武汉云成卫星</div>
                        <div class="sidebar-item">依迅北斗</div>
                    </div>
                    <div class="product-grid">
                        <div class="product-card">
                            <div class="product-img" style="background: linear-gradient(135deg, #0066cc, #00a0e9);"></div>
                            <span class="product-name">北斗高精度定位终端</span>
                            <span class="product-views">5人阅读</span>
                        </div>
                        <div class="product-card">
                            <div class="product-img" style="background: linear-gradient(135deg, #00b894, #00cec9);"></div>
                            <span class="product-name">智能安全帽</span>
                            <span class="product-views">3人阅读</span>
                        </div>
                        <div class="product-card">
                            <div class="product-img" style="background: linear-gradient(135deg, #6c5ce7, #a29bfe);"></div>
                            <span class="product-name">车载监控终端</span>
                            <span class="product-views">2人阅读</span>
                        </div>
                        <div class="product-card">
                            <div class="product-img" style="background: linear-gradient(135deg, #fd7e14, #ff6b35);"></div>
                            <span class="product-name">便携式导航仪</span>
                            <span class="product-views">8人阅读</span>
                        </div>
                    </div>
                </div>

                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 企业展厅页面 ==================== -->
        <div class="page page-sub" id="page-enterprise-hall">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="home">←</span>
                    <span class="nav-title">企业展厅</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="tab-nav-section">
                    <div class="tab-nav">
                        <span class="tab-nav-item active">全部</span>
                        <span class="tab-nav-item">上游</span>
                        <span class="tab-nav-item">中游</span>
                        <span class="tab-nav-item">下游</span>
                    </div>
                </div>

                <div class="enterprise-grid">
                    <div class="enterprise-card">
                        <div class="enterprise-logo" style="background: linear-gradient(135deg, #ffd700, #ffb347);">中</div>
                        <span>中南电力设计院</span>
                    </div>
                    <div class="enterprise-card">
                        <div class="enterprise-logo" style="background: linear-gradient(135deg, #0066cc, #00a0e9);">云</div>
                        <span>武汉云成卫星</span>
                    </div>
                    <div class="enterprise-card">
                        <div class="enterprise-logo" style="background: linear-gradient(135deg, #e74c3c, #c0392b);">开</div>
                        <span>开普勒卫星科技</span>
                    </div>
                    <div class="enterprise-card">
                        <div class="enterprise-logo" style="background: linear-gradient(135deg, #3498db, #2980b9);">电</div>
                        <span>中国电信北斗</span>
                    </div>
                    <div class="enterprise-card">
                        <div class="enterprise-logo" style="background: linear-gradient(135deg, #27ae60, #2ecc71);">依</div>
                        <span>依迅北斗</span>
                    </div>
                    <div class="enterprise-card">
                        <div class="enterprise-logo" style="background: linear-gradient(135deg, #9b59b6, #8e44ad);">梦</div>
                        <span>梦芯科技</span>
                    </div>
                </div>

                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 产业链图谱页面 ==================== -->
        <div class="page page-sub" id="page-industry-chain">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="home">←</span>
                    <span class="nav-title">产业链地图</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="tab-nav-section">
                    <div class="tab-nav">
                        <span class="tab-nav-item active">产业链全景图</span>
                        <span class="tab-nav-item">产业空间图谱</span>
                        <span class="tab-nav-item">集群核心区</span>
                    </div>
                </div>

                <div class="chain-map">
                    <div class="chain-section">
                        <div class="chain-header">运营服务</div>
                        <div class="chain-items">
<div class="chain-item">行业监控与数据运营</div>
                            <div class="chain-item">位置服务运营</div>
                            <div class="chain-item">智慧城市</div>
                            <div class="chain-item">短报文与通信</div>
                            <div class="chain-item">军民融合与特种运营</div>
                        </div>
                    </div>
                    <div class="chain-section">
                        <div class="chain-header">终端产品</div>
                        <div class="chain-items">
                            <div class="chain-item">GIS数据采集产品</div>
                            <div class="chain-item">测量GNSS产品</div>
                            <div class="chain-item">内嵌式车载导航终端</div>
                            <div class="chain-item">便携式导航终端</div>
                            <div class="chain-item">航空/航海GNSS设备</div>
                        </div>
                    </div>
                    <div class="chain-section">
                        <div class="chain-header">基础器件</div>
                        <div class="chain-items">
                            <div class="chain-item">芯片、模块、天线</div>
                            <div class="chain-item">定位/差分/指向算法</div>
                            <div class="chain-item">多系统组合导航算法</div>
                            <div class="chain-item">系统引擎及处理软件</div>
                        </div>
                    </div>
                    <div class="chain-section">
                        <div class="chain-header">应用场景</div>
                        <div class="chain-items">
                            <div class="chain-item">无人机操控</div>
                            <div class="chain-item">测量测绘</div>
                            <div class="chain-item">智能矿山</div>
                            <div class="chain-item">精密农业</div>
                            <div class="chain-item">智慧物流</div>
                            <div class="chain-item">智能网联汽车</div>
                        </div>
                    </div>
                </div>

                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 生活服务页面 ==================== -->
        <div class="page page-sub" id="page-life-service">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="home">←</span>
                    <span class="nav-title">生活服务</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="life-service-grid">
                    <div class="life-service-item" data-page="life-hotel">
                        <div class="ls-icon" style="background: linear-gradient(135deg, #ff6b6b, #ee5a5a);">
                            <svg viewBox="0 0 24 24" fill="white"><path d="M7 13c1.66 0 3-1.34 3-3S8.66 7 7 7s-3 1.34-3 3 1.34 3 3 3zm12-6h-8v7H3V5H1v15h2v-3h18v3h2v-9c0-2.21-1.79-4-4-4z"/></svg>
                        </div>
                        <span>住宿</span>
                    </div>
                    <div class="life-service-item" data-page="life-travel">
                        <div class="ls-icon" style="background: linear-gradient(135deg, #4ecdc4, #44b3ab);">
                            <svg viewBox="0 0 24 24" fill="white"><path d="M18.92 6.01C18.72 5.42 18.16 5 17.5 5h-11c-.66 0-1.21.42-1.42 1.01L3 12v8c0 .55.45 1 1 1h1c.55 0 1-.45 1-1v-1h12v1c0 .55.45 1 1 1h1c.55 0 1-.45 1-1v-8l-2.08-5.99zM6.5 16c-.83 0-1.5-.67-1.5-1.5S5.67 13 6.5 13s1.5.67 1.5 1.5S7.33 16 6.5 16zm11 0c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5zM5 11l1.5-4.5h11L19 11H5z"/></svg>
                        </div>
                        <span>出行</span>
                    </div>
                    <div class="life-service-item" data-page="life-food">
                        <div class="ls-icon" style="background: linear-gradient(135deg, #ffa726, #ff9800);">
                            <svg viewBox="0 0 24 24" fill="white"><path d="M8.1 13.34l2.83-2.83L3.91 3.5c-1.56 1.56-1.56 4.09 0 5.66l4.19 4.18zm6.78-1.81c1.53.71 3.68.21 5.27-1.38 1.91-1.91 2.28-4.65.81-6.12-1.46-1.46-4.2-1.1-6.12.81-1.59 1.59-2.09 3.74-1.38 5.27L3.7 19.87l1.41 1.41L12 14.41l6.88 6.88 1.41-1.41L13.41 13l1.47-1.47z"/></svg>
                        </div>
                        <span>美食</span>
                    </div>
                    <div class="life-service-item" data-page="life-drink">
                        <div class="ls-icon" style="background: linear-gradient(135deg, #ab47bc, #9c27b0);">
                            <svg viewBox="0 0 24 24" fill="white"><path d="M18.5 3H6c-1.1 0-2 .9-2 2v5.71c0 3.83 2.95 7.18 6.78 7.29 3.96.12 7.22-3.06 7.22-7v-1h.5c1.93 0 3.5-1.57 3.5-3.5S20.43 3 18.5 3zM16 5v3H6V5h10zm2.5 3H18V5h.5c.83 0 1.5.67 1.5 1.5S19.33 8 18.5 8z"/></svg>
                        </div>
                        <span>饮品</span>
                    </div>
                    <div class="life-service-item" data-page="life-entertainment">
                        <div class="ls-icon" style="background: linear-gradient(135deg, #42a5f5, #1e88e5);">
                            <svg viewBox="0 0 24 24" fill="white"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/></svg>
                        </div>
                        <span>休闲</span>
                    </div>
                    <div class="life-service-item" data-page="life-health">
                        <div class="ls-icon" style="background: linear-gradient(135deg, #66bb6a, #43a047);">
                            <svg viewBox="0 0 24 24" fill="white"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 17h-2v-2h2v2zm2.07-7.75l-.9.92C12.45 12.9 13 13.5 13 15h-2v-.5c0-1.1.45-2.1 1.17-2.83l1.24-1.26c.37-.36.59-.86.59-1.41 0-1.1-.9-2-2-2s-2 .9-2 2H8c0-2.21 1.79-4 4-4s4 1.79 4 4c0 .88-.36 1.68-.93 2.25z"/></svg>
                        </div>
                        <span>健康</span>
                    </div>
                </div>

                <div class="featured-banner">
                    <div class="featured-title">精选推荐</div>
                    <div class="featured-card">
                        <div class="featured-img" style="background: linear-gradient(135deg, #667eea, #764ba2);"></div>
                        <div class="featured-info">
                            <h4>万丽酒店</h4>
                            <p>星级精品酒店客房</p>
                        </div>
                    </div>
                </div>

                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 政策发布页面 ==================== -->
        <div class="page page-sub" id="page-policy">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="home">←</span>
                    <span class="nav-title">政策发布</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="meeting-search">
                    <div class="search-bar">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="11" cy="11" r="8"/><path d="M21 21l-4.35-4.35"/></svg>
                        <input type="text" placeholder="输入政策关键词">
                    </div>
                </div>

                <div class="policy-list">
                    <div class="policy-item">
                        <div class="policy-content">
                            <h3>武昌区"十大应用场景"重磅发布！</h3>
                            <p class="policy-source">小斗政策导航台</p>
                            <div class="policy-meta">
                                <span>各市、州、直管市</span>
                                <span class="policy-views">20人阅读</span>
                            </div>
                        </div>
                        <div class="policy-icon">策</div>
                    </div>
                    <div class="policy-item">
                        <div class="policy-content">
                            <h3>关于组织开展2025年度"61020"科技创新成果推荐工作的通知</h3>
                            <p class="policy-source">小斗政策导航台</p>
                            <div class="policy-meta">
                                <span>各市、州科技局</span>
                                <span class="policy-views">15人阅读</span>
                            </div>
                        </div>
                        <div class="policy-icon">策</div>
                    </div>
                    <div class="policy-item">
                        <div class="policy-content">
                            <h3>关于组织开展2025年"楚天英才计划"技术技能人才项目申报</h3>
                            <p class="policy-source">小斗政策导航台</p>
                            <div class="policy-meta">
                                <span>各市州党委人才办</span>
                                <span class="policy-views">3人阅读</span>
                            </div>
                        </div>
                        <div class="policy-icon">策</div>
                    </div>
                    <div class="policy-item">
                        <div class="policy-content">
                            <h3>关于组织申报2025年湖北省支持高新技术企业发展专项资金</h3>
                            <p class="policy-source">小斗政策导航台</p>
                            <div class="policy-meta">
                                <span>各市、州科技局</span>
                                <span class="policy-views">1人阅读</span>
                            </div>
                        </div>
                        <div class="policy-icon">策</div>
                    </div>
                </div>

                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 科创活动页面 ==================== -->
        <div class="page page-sub" id="page-activity">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="home">←</span>
                    <span class="nav-title">科创活动</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="meeting-search">
                    <div class="search-bar">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="11" cy="11" r="8"/><path d="M21 21l-4.35-4.35"/></svg>
                        <input type="text" placeholder="请输入关键词">
                    </div>
                </div>

                <div class="activity-list">
                    <div class="activity-item">
                        <div class="activity-content">
                            <h3>法治护航促发展 创新聚力绘新篇 —— 武昌区高科技企业《民营经济促进法》宣贯会</h3>
                            <div class="activity-meta">
                                <span>2025-06-27</span>
                                <span class="activity-views">9人阅读</span>
                            </div>
                        </div>
                        <div class="activity-img" style="background: linear-gradient(135deg, #e74c3c, #c0392b);"></div>
                    </div>
                    <div class="activity-item">
                        <div class="activity-content">
                            <h3>武汉市中小企业商业价值信用贷款政策宣贯会</h3>
                            <div class="activity-meta">
                                <span>2025-06-20</span>
                                <span class="activity-views">9人阅读</span>
                            </div>
                        </div>
                        <div class="activity-img" style="background: linear-gradient(135deg, #3498db, #2980b9);"></div>
                    </div>
                    <div class="activity-item">
                        <div class="activity-content">
                            <h3>知识产权保护与运用专题培训会</h3>
                            <div class="activity-meta">
                                <span>2025-06-15</span>
                                <span class="activity-views">5人阅读</span>
                            </div>
                        </div>
                        <div class="activity-img" style="background: linear-gradient(135deg, #27ae60, #2ecc71);"></div>
                    </div>
                    <div class="activity-item">
                        <div class="activity-content">
                            <h3>专精特新企业培育专题辅导活动</h3>
                            <div class="activity-meta">
                                <span>2025-06-10</span>
                                <span class="activity-views">3人阅读</span>
                            </div>
                        </div>
                        <div class="activity-img" style="background: linear-gradient(135deg, #9b59b6, #8e44ad);"></div>
                    </div>
                    <div class="activity-item">
                        <div class="activity-content">
                            <h3>DeepSeek读书分享会 —— AI前沿技术交流</h3>
                            <div class="activity-meta">
                                <span>2025-06-05</span>
                                <span class="activity-views">2人阅读</span>
                            </div>
                        </div>
                        <div class="activity-img" style="background: linear-gradient(135deg, #1abc9c, #16a085);"></div>
                    </div>
                </div>

                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 住宿页面 ==================== -->
        <div class="page page-sub" id="page-life-hotel">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="life-service">←</span>
                    <span class="nav-title">住宿</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="meeting-search">
                    <div class="search-bar">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="11" cy="11" r="8"/><path d="M21 21l-4.35-4.35"/></svg>
                        <input type="text" placeholder="请输入关键词">
                    </div>
                </div>
                <div class="hotel-list">
                    <div class="hotel-item">
                        <div class="hotel-img" style="background: linear-gradient(135deg, #667eea, #764ba2);"></div>
                        <div class="hotel-info">
                            <h3>珞珈山宾馆</h3>
                            <p class="hotel-address">湖北省武汉市武昌区八一路299号</p>
                        </div>
                    </div>
                    <div class="hotel-item">
                        <div class="hotel-img" style="background: linear-gradient(135deg, #f093fb, #f5576c);"></div>
                        <div class="hotel-info">
                            <h3>万丽酒店</h3>
                            <p class="hotel-address">湖北省武汉市武昌区中北路</p>
                        </div>
                    </div>
                    <div class="hotel-item">
                        <div class="hotel-img" style="background: linear-gradient(135deg, #4facfe, #00f2fe);"></div>
                        <div class="hotel-info">
                            <h3>中南花园酒店</h3>
                            <p class="hotel-address">湖北省武汉市武昌区武珞路</p>
                        </div>
                    </div>
                </div>
                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 出行页面 ==================== -->
        <div class="page page-sub" id="page-life-travel">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="life-service">←</span>
                    <span class="nav-title">出行</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="meeting-search">
                    <div class="search-bar">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="11" cy="11" r="8"/><path d="M21 21l-4.35-4.35"/></svg>
                        <input type="text" placeholder="请输入关键词">
                    </div>
                </div>
                <div class="parking-grid">
                    <div class="parking-item">
                        <div class="parking-img" style="background: linear-gradient(135deg, #11998e, #38ef7d);"></div>
                        <span class="parking-name">水果湖公共停车场</span>
                    </div>
                    <div class="parking-item">
                        <div class="parking-img" style="background: linear-gradient(135deg, #667eea, #764ba2);"></div>
                        <span class="parking-name">武汉SKP地下停车场</span>
                    </div>
                    <div class="parking-item">
                        <div class="parking-img" style="background: linear-gradient(135deg, #fc4a1a, #f7b733);"></div>
                        <span class="parking-name">中北路停车场</span>
                    </div>
                    <div class="parking-item">
                        <div class="parking-img" style="background: linear-gradient(135deg, #4facfe, #00f2fe);"></div>
                        <span class="parking-name">斗转科技园停车场</span>
                    </div>
                </div>
                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 美食页面 ==================== -->
        <div class="page page-sub" id="page-life-food">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="life-service">←</span>
                    <span class="nav-title">美食</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="meeting-search">
                    <div class="search-bar">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="11" cy="11" r="8"/><path d="M21 21l-4.35-4.35"/></svg>
                        <input type="text" placeholder="请输入关键词">
                    </div>
                </div>
                <div class="shop-list">
                    <div class="shop-item">
                        <div class="shop-img" style="background: linear-gradient(135deg, #e74c3c, #c0392b);"></div>
                        <div class="shop-info">
                            <h3>香川火锅店</h3>
                            <p class="shop-address">武昌区中北路</p>
                        </div>
                    </div>
                    <div class="shop-item">
                        <div class="shop-img" style="background: linear-gradient(135deg, #f39c12, #e67e22);"></div>
                        <div class="shop-info">
                            <h3>实惠自助餐</h3>
                            <p class="shop-address">武昌区水果湖</p>
                        </div>
                    </div>
                    <div class="shop-item">
                        <div class="shop-img" style="background: linear-gradient(135deg, #27ae60, #2ecc71);"></div>
                        <div class="shop-info">
                            <h3>天天美食馆</h3>
                            <p class="shop-address">武昌区八一路</p>
                        </div>
                    </div>
                </div>
                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 饮品页面 ==================== -->
        <div class="page page-sub" id="page-life-drink">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="life-service">←</span>
                    <span class="nav-title">饮品</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="meeting-search">
                    <div class="search-bar">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="11" cy="11" r="8"/><path d="M21 21l-4.35-4.35"/></svg>
                        <input type="text" placeholder="请输入关键词">
                    </div>
                </div>
                <div class="drink-list">
                    <div class="drink-item">
                        <div class="drink-img" style="background: linear-gradient(135deg, #8b5a2b, #d2691e);"></div>
                        <div class="drink-info">
                            <h3>雅茶室</h3>
                            <p class="drink-address">日式和风茶室</p>
                        </div>
                    </div>
                    <div class="drink-item">
                        <div class="drink-img" style="background: linear-gradient(135deg, #ab47bc, #9c27b0);"></div>
                        <div class="drink-info">
                            <h3>奶茶屋</h3>
                            <p class="drink-address">现代简约风奶茶店</p>
                        </div>
                    </div>
                </div>
                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 休闲页面 ==================== -->
        <div class="page page-sub" id="page-life-entertainment">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="life-service">←</span>
                    <span class="nav-title">休闲</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="meeting-search">
                    <div class="search-bar">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="11" cy="11" r="8"/><path d="M21 21l-4.35-4.35"/></svg>
                        <input type="text" placeholder="请输入关键词">
                    </div>
                </div>
                <div class="entertainment-list">
                    <div class="entertainment-item">
                        <div class="entertainment-img" style="background: linear-gradient(135deg, #e74c3c, #c0392b);"></div>
                        <div class="entertainment-info">
                            <h3>KTV畅听</h3>
                            <p>KTV包房实景</p>
                        </div>
                    </div>
                    <div class="entertainment-item">
                        <div class="entertainment-img" style="background: linear-gradient(135deg, #3498db, #2980b9);"></div>
                        <div class="entertainment-info">
                            <h3>动感电玩城</h3>
                            <p>电玩城游戏机</p>
                        </div>
                    </div>
                </div>
                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 健康页面 ==================== -->
        <div class="page page-sub" id="page-life-health">
            <div class="nav-bar">
                <div class="status-bar"></div>
                <div class="nav-content page-nav">
                    <span class="nav-back" data-page="life-service">←</span>
                    <span class="nav-title">健康</span>
                </div>
            </div>
            <div class="page-content sub-page-content">
                <div class="meeting-search">
                    <div class="search-bar">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="11" cy="11" r="8"/><path d="M21 21l-4.35-4.35"/></svg>
                        <input type="text" placeholder="请输入关键词">
                    </div>
                </div>
                <div class="health-list">
                    <div class="health-item">
                        <div class="health-img" style="background: linear-gradient(135deg, #3498db, #2980b9);"></div>
                        <div class="health-info">
                            <h3>体检机构</h3>
                            <p>专业体检服务</p>
                        </div>
                    </div>
                    <div class="health-item">
                        <div class="health-img" style="background: linear-gradient(135deg, #e74c3c, #c0392b);"></div>
                        <div class="health-info">
                            <h3>艾灸馆</h3>
                            <p>中医艾灸理疗</p>
                        </div>
                    </div>
                </div>
                <div class="home-float-btn" data-page="home">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                </div>
            </div>
        </div>

        <!-- ==================== 底部导航 ==================== -->
        <div class="tab-bar" id="mainTabBar">
            <div class="tab-item active" data-page="home">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                    <path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/>
                    <polyline points="9 22 9 12 15 12 15 22"/>
                </svg>
                <span>首页</span>
            </div>
            <div class="tab-item" data-page="ai">
                <div class="ai-center-btn">
                    <svg viewBox="0 0 24 24" fill="currentColor">
                        <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 17h-2v-2h2v2zm2.07-7.75l-.9.92C13.45 12.9 13 13.5 13 15h-2v-.5c0-1.1.45-2.1 1.17-2.83l1.24-1.26c.37-.36.59-.86.59-1.41 0-1.1-.9-2-2-2s-2 .9-2 2H8c0-2.21 1.79-4 4-4s4 1.79 4 4c0 .88-.36 1.68-.93 2.25z"/>
                    </svg>
                </div>
                <span>AI助手</span>
            </div>
            <div class="tab-item" data-page="profile">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                    <path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/>
                    <circle cx="12" cy="7" r="4"/>
                </svg>
                <span>我的</span>
            </div>
        </div>
    </div>

    <!-- ==================== 我的订单页面 ==================== -->
    <div class="page page-sub" id="page-profile-orders">
        <div class="nav-bar">
            <div class="status-bar"></div>
            <div class="nav-content page-nav">
                <span class="nav-back" data-page="profile">←</span>
                <span class="nav-title">我的订单</span>
            </div>
        </div>
        <div class="page-content sub-page-content">
            <div class="tab-nav-section">
                <div class="tab-nav">
                    <span class="tab-nav-item active">全部</span>
                    <span class="tab-nav-item">进行中</span>
                    <span class="tab-nav-item">已完成</span>
                    <span class="tab-nav-item">售后</span>
                </div>
            </div>
            <div class="order-list">
                <div class="order-card">
                    <div class="order-shop">斗转科技园会议中心</div>
                    <div class="order-info">
                        <div class="order-name">多功能会议室</div>
                        <div class="order-date">2026-05-08</div>
                    </div>
                    <div class="order-status-tag active-tag">进行中</div>
                </div>
                <div class="order-card">
                    <div class="order-shop">阳光大厦湖北省技术市场协会</div>
                    <div class="order-info">
                        <div class="order-name">会议室预订</div>
                        <div class="order-date">2026-05-01</div>
                    </div>
                    <div class="order-status-tag completed-tag">已完成</div>
                </div>
            </div>
            <div class="home-float-btn" data-page="home">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
            </div>
        </div>
    </div>

    <!-- ==================== 最新消息页面 ==================== -->
    <div class="page page-sub" id="page-profile-messages">
        <div class="nav-bar">
            <div class="status-bar"></div>
            <div class="nav-content page-nav">
                <span class="nav-back" data-page="profile">←</span>
                <span class="nav-title">最新消息</span>
            </div>
        </div>
        <div class="page-content sub-page-content">
            <div class="message-list">
                <div class="message-item">
                    <div class="message-avatar">系</div>
                    <div class="message-content">
                        <div class="message-title">系统通知</div>
                        <div class="message-text">您的会议室预订已确认</div>
                        <div class="message-time">2026-05-08 10:30</div>
                    </div>
                </div>
                <div class="message-item">
                    <div class="message-avatar" style="background: linear-gradient(135deg, #00b894, #00cec9);">活</div>
                    <div class="message-content">
                        <div class="message-title">活动通知</div>
                        <div class="message-text">法治护航促发展活动即将开始</div>
                        <div class="message-time">2026-05-07 14:20</div>
                    </div>
                </div>
                <div class="message-item">
                    <div class="message-avatar" style="background: linear-gradient(135deg, #3498db, #2980b9);">政</div>
                    <div class="message-content">
                        <div class="message-title">政策推送</div>
                        <div class="message-text">武昌区十大应用场景重磅发布</div>
                        <div class="message-time">2026-05-06 09:00</div>
                    </div>
                </div>
            </div>
            <div class="home-float-btn" data-page="home">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
            </div>
        </div>
    </div>

    <!-- ==================== 我的订阅页面 ==================== -->
    <div class="page page-sub" id="page-profile-subscribe">
        <div class="nav-bar">
            <div class="status-bar"></div>
            <div class="nav-content page-nav">
                <span class="nav-back" data-page="profile">←</span>
                <span class="nav-title">我的订阅</span>
            </div>
        </div>
        <div class="page-content sub-page-content">
            <div class="subscribe-list">
                <div class="subscribe-item">
                    <div class="subscribe-icon" style="background: linear-gradient(135deg, #e74c3c, #c0392b);">
                        <svg viewBox="0 0 24 24" fill="white"><path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5"/></svg>
                    </div>
                    <div class="subscribe-info">
                        <div class="subscribe-name">政策动态</div>
                        <div class="subscribe-status">已订阅 · 每日推送</div>
                    </div>
                    <span class="subscribe-toggle active">已开启</span>
                </div>
                <div class="subscribe-item">
                    <div class="subscribe-icon" style="background: linear-gradient(135deg, #3498db, #2980b9);">
                        <svg viewBox="0 0 24 24" fill="white"><path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-5 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z"/></svg>
                    </div>
                    <div class="subscribe-info">
                        <div class="subscribe-name">活动资讯</div>
                        <div class="subscribe-status">已订阅 · 每周推送</div>
                    </div>
                    <span class="subscribe-toggle active">已开启</span>
                </div>
                <div class="subscribe-item">
                    <div class="subscribe-icon" style="background: linear-gradient(135deg, #27ae60, #2ecc71);">
                        <svg viewBox="0 0 24 24" fill="white"><path d="M16.5 3c-1.74 0-3.41.81-4.5 2.09C10.91 3.81 9.24 3 7.5 3 4.42 3 2 5.42 2 8.5c0 3.78 3.4 6.86 8.55 11.54L12 21.35l1.45-1.32C18.6 15.36 22 12.28 22 8.5 22 5.42 19.58 3 16.5 3z"/></svg>
                    </div>
                    <div class="subscribe-info">
                        <div class="subscribe-name">企业动态</div>
                        <div class="subscribe-status">未订阅</div>
                    </div>
                    <span class="subscribe-toggle">未开启</span>
                </div>
            </div>
            <div class="home-float-btn" data-page="home">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
            </div>
        </div>
    </div>

    <!-- ==================== 我的表单页面 ==================== -->
    <div class="page page-sub" id="page-profile-forms">
        <div class="nav-bar">
            <div class="status-bar"></div>
            <div class="nav-content page-nav">
                <span class="nav-back" data-page="profile">←</span>
                <span class="nav-title">我的表单</span>
            </div>
        </div>
        <div class="page-content sub-page-content">
            <div class="form-list">
                <div class="form-card">
                    <div class="form-status">已提交</div>
                    <div class="form-title">企业需求登记表</div>
                    <div class="form-time">2026-05-05 提交</div>
                </div>
                <div class="form-card">
                    <div class="form-status draft">草稿</div>
                    <div class="form-title">科技成果申报表</div>
                    <div class="form-time">2026-05-03 创建</div>
                </div>
                <div class="form-card">
                    <div class="form-status">已通过</div>
                    <div class="form-title">活动报名表</div>
                    <div class="form-time">2026-04-28 提交</div>
                </div>
            </div>
            <div class="home-float-btn" data-page="home">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
            </div>
        </div>
    </div>

    <!-- ==================== 我的打卡页面 ==================== -->
    <div class="page page-sub" id="page-profile-checkin">
        <div class="nav-bar">
            <div class="status-bar"></div>
            <div class="nav-content page-nav">
                <span class="nav-back" data-page="profile">←</span>
                <span class="nav-title">我的打卡</span>
            </div>
        </div>
        <div class="page-content sub-page-content">
            <div class="checkin-summary">
                <div class="checkin-num">28</div>
                <div class="checkin-label">连续打卡天数</div>
            </div>
            <div class="checkin-calendar">
                <div class="calendar-title">5月打卡日历</div>
                <div class="calendar-grid">
                    <span>一</span><span>二</span><span>三</span><span>四</span><span>五</span><span>六</span><span>日</span>
                    <span></span><span></span><span></span><span>1</span><span>2</span><span class="checked">3</span><span class="checked">4</span>
                    <span class="checked">5</span><span class="checked">6</span><span class="checked">7</span><span class="checked">8</span><span class="checked">9</span>
                </div>
            </div>
            <div class="home-float-btn" data-page="home">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
            </div>
        </div>
    </div>

    <!-- ==================== 我的优惠券页面 ==================== -->
    <div class="page page-sub" id="page-profile-coupons">
        <div class="nav-bar">
            <div class="status-bar"></div>
            <div class="nav-content page-nav">
                <span class="nav-back" data-page="profile">←</span>
                <span class="nav-title">我的优惠券</span>
            </div>
        </div>
        <div class="page-content sub-page-content">
            <div class="coupon-list">
                <div class="coupon-item">
                    <div class="coupon-price">¥50</div>
                    <div class="coupon-info">
                        <div class="coupon-name">会议室满减券</div>
                        <div class="coupon-condition">满200元可用</div>
                        <div class="coupon-date">有效期至 2026-06-30</div>
                    </div>
                    <span class="coupon-use">立即使用</span>
                </div>
                <div class="coupon-item">
                    <div class="coupon-price">¥20</div>
                    <div class="coupon-info">
                        <div class="coupon-name">活动报名券</div>
                        <div class="coupon-condition">满100元可用</div>
                        <div class="coupon-date">有效期至 2026-05-31</div>
                    </div>
                    <span class="coupon-use">立即使用</span>
                </div>
                <div class="coupon-item used">
                    <div class="coupon-price">¥30</div>
                    <div class="coupon-info">
                        <div class="coupon-name">科技服务券</div>
                        <div class="coupon-condition">已使用</div>
                        <div class="coupon-date">2026-04-15</div>
                    </div>
                    <span class="coupon-status">已用</span>
                </div>
            </div>
            <div class="home-float-btn" data-page="home">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
            </div>
        </div>
    </div>

    <!-- ==================== 我的报价页面 ==================== -->
    <div class="page page-sub" id="page-profile-quotes">
        <div class="nav-bar">
            <div class="status-bar"></div>
            <div class="nav-content page-nav">
                <span class="nav-back" data-page="profile">←</span>
                <span class="nav-title">我的报价</span>
            </div>
        </div>
        <div class="page-content sub-page-content">
            <div class="quote-list">
                <div class="quote-item">
                    <div class="quote-title">会议室租赁报价</div>
                    <div class="quote-company">需求方：武汉科技有限公司</div>
                    <div class="quote-price">¥1,500.00</div>
                    <div class="quote-status pending">待确认</div>
                </div>
                <div class="quote-item">
                    <div class="quote-title">活动场地报价</div>
                    <div class="quote-company">需求方：湖北北斗企业</div>
                    <div class="quote-price">¥3,200.00</div>
                    <div class="quote-status accepted">已接受</div>
                </div>
            </div>
            <div class="home-float-btn" data-page="home">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
            </div>
        </div>
    </div>

    <!-- ==================== 我的收藏页面 ==================== -->
    <div class="page page-sub" id="page-profile-favorites">
        <div class="nav-bar">
            <div class="status-bar"></div>
            <div class="nav-content page-nav">
                <span class="nav-back" data-page="profile">←</span>
                <span class="nav-title">我的收藏</span>
            </div>
        </div>
        <div class="page-content sub-page-content">
            <div class="favorite-list">
                <div class="favorite-item">
                    <div class="favorite-img" style="background: linear-gradient(135deg, #0066cc, #00a0e9);"></div>
                    <div class="favorite-info">
                        <div class="favorite-title">北斗高精度定位终端</div>
                        <div class="favorite-company">开普勒卫星科技</div>
                    </div>
                </div>
                <div class="favorite-item">
                    <div class="favorite-img" style="background: linear-gradient(135deg, #e74c3c, #c0392b);"></div>
                    <div class="favorite-info">
                        <div class="favorite-title">武昌区"十大应用场景"</div>
                        <div class="favorite-company">政策发布</div>
                    </div>
                </div>
                <div class="favorite-item">
                    <div class="favorite-img" style="background: linear-gradient(135deg, #27ae60, #2ecc71);"></div>
                    <div class="favorite-info">
                        <div class="favorite-title">法治护航促发展活动</div>
                        <div class="favorite-company">科创活动</div>
                    </div>
                </div>
            </div>
            <div class="home-float-btn" data-page="home">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
            </div>
        </div>
    </div>

    <!-- ==================== 我的发布页面 ==================== -->
    <div class="page page-sub" id="page-profile-posts">
        <div class="nav-bar">
            <div class="status-bar"></div>
            <div class="nav-content page-nav">
                <span class="nav-back" data-page="profile">←</span>
                <span class="nav-title">我的发布</span>
            </div>
        </div>
        <div class="page-content sub-page-content">
            <div class="post-list">
                <div class="post-item">
                    <div class="post-title">企业技术需求发布</div>
                    <div class="post-time">2026-05-07 14:30</div>
                    <div class="post-status published">已发布</div>
                </div>
                <div class="post-item">
                    <div class="post-title">产品供应信息</div>
                    <div class="post-time">2026-05-05 09:15</div>
                    <div class="post-status published">已发布</div>
                </div>
                <div class="post-item">
                    <div class="post-title">活动报名 - AI分享会</div>
                    <div class="post-time">2026-05-03 16:45</div>
                    <div class="post-status published">已发布</div>
                </div>
            </div>
            <div class="home-float-btn" data-page="home">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
            </div>
        </div>
    </div>

    <!-- ==================== 回复我的页面 ==================== -->
    <div class="page page-sub" id="page-profile-replies">
        <div class="nav-bar">
            <div class="status-bar"></div>
            <div class="nav-content page-nav">
                <span class="nav-back" data-page="profile">←</span>
                <span class="nav-title">回复我的</span>
            </div>
        </div>
        <div class="page-content sub-page-content">
            <div class="reply-list">
                <div class="reply-item">
                    <div class="reply-avatar">企</div>
                    <div class="reply-content">
                        <div class="reply-title">武汉科技有限公司 回复了您的需求</div>
                        <div class="reply-text">我们可以提供北斗芯片的技术支持...</div>
                        <div class="reply-time">2026-05-08 15:20</div>
                    </div>
                </div>
                <div class="reply-item">
                    <div class="reply-avatar" style="background: linear-gradient(135deg, #9b59b6, #8e44ad);">管</div>
                    <div class="reply-content">
                        <div class="reply-title">管理员 回复了您的问题</div>
                        <div class="reply-text">关于申报服务的具体流程已发送至您的邮箱</div>
                        <div class="reply-time">2026-05-07 10:00</div>
                    </div>
                </div>
            </div>
            <div class="home-float-btn" data-page="home">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
            </div>
        </div>
    </div>

        <!-- ==================== 产业空间页面 ==================== -->
    <div class="page page-sub" id="page-industry-space">
        <div class="nav-bar">
            <div class="status-bar"></div>
            <div class="nav-content page-nav">
                <span class="nav-back" data-page="home">←</span>
                <span class="nav-title">产业空间</span>
            </div>
        </div>
        <div class="page-content sub-page-content">
            <!-- 选项卡 - 胶囊样式 -->
            <div class="industry-tabs">
                <div class="industry-tab active" data-tab="park">产业园区</div>
                <div class="industry-tab" data-tab="building">产业楼宇</div>
                <div class="industry-tab" data-tab="venue">会议会场</div>
            </div>
            
            <!-- 产业园区列表 -->
            <div class="industry-list" id="industry-park-list">
                <div class="industry-card">
                    <div class="industry-img" style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);">
                        <div class="industry-img-text">科技园</div>
                    </div>
                    <div class="industry-info">
                        <div class="industry-name">斗转科技园</div>
                        <div class="industry-tags">
                            <span class="industry-tag">国家级园区</span>
                            <span class="industry-tag green-tag">高新技术企业</span>
                        </div>
                        <div class="industry-address" style="margin-top: 8px;">
                            <svg viewBox="0 0 24 24" fill="none" stroke="#999" stroke-width="2"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
                            武汉市洪山区珞喻路78号
                        </div>
                    </div>
                    <div class="industry-card-footer">
                        <div class="industry-tags">
                            <span class="industry-tag orange-tag">空天信息</span>
                            <span class="industry-tag orange-tag">北斗应用</span>
                        </div>
                        <div class="industry-nav-btn" onclick="navigateToAddress('斗转科技园')">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="3 11 22 2 13 21 11 13 3 11"/></svg>
                            导航
                        </div>
                    </div>
                </div>
                <div class="industry-card">
                    <div class="industry-img" style="background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);">
                        <div class="industry-img-text">创新港</div>
                    </div>
                    <div class="industry-info">
                        <div class="industry-name">珞珈创新港</div>
                        <div class="industry-tags">
                            <span class="industry-tag">省级园区</span>
                            <span class="industry-tag green-tag">产学研基地</span>
                        </div>
                        <div class="industry-address" style="margin-top: 8px;">
                            <svg viewBox="0 0 24 24" fill="none" stroke="#999" stroke-width="2"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
                            武汉市武昌区卓刀泉北路168号
                        </div>
                    </div>
                    <div class="industry-card-footer">
                        <div class="industry-tags">
                            <span class="industry-tag orange-tag">人工智能</span>
                            <span class="industry-tag orange-tag">智能制造</span>
                        </div>
                        <div class="industry-nav-btn" onclick="navigateToAddress('珞珈创新港')">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="3 11 22 2 13 21 11 13 3 11"/></svg>
                            导航
                        </div>
                    </div>
                </div>
                <div class="industry-card">
                    <div class="industry-img" style="background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);">
                        <div class="industry-img-text">未来城</div>
                    </div>
                    <div class="industry-info">
                        <div class="industry-name">光谷未来城</div>
                        <div class="industry-tags">
                            <span class="industry-tag">国家级高新区</span>
                            <span class="industry-tag green-tag">创新孵化</span>
                        </div>
                        <div class="industry-address" style="margin-top: 8px;">
                            <svg viewBox="0 0 24 24" fill="none" stroke="#999" stroke-width="2"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
                            武汉市东湖新技术开发区光谷大道77号
                        </div>
                    </div>
                    <div class="industry-card-footer">
                        <div class="industry-tags">
                            <span class="industry-tag orange-tag">光电子</span>
                            <span class="industry-tag orange-tag">半导体</span>
                        </div>
                        <div class="industry-nav-btn" onclick="navigateToAddress('光谷未来城')">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="3 11 22 2 13 21 11 13 3 11"/></svg>
                            导航
                        </div>
                    </div>
                </div>
                <div class="industry-card">
                    <div class="industry-img" style="background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);">
                        <div class="industry-img-text">产业园</div>
                    </div>
                    <div class="industry-info">
                        <div class="industry-name">北斗产业园</div>
                        <div class="industry-tags">
                            <span class="industry-tag">产业基地</span>
                            <span class="industry-tag green-tag">卫星应用</span>
                        </div>
                        <div class="industry-address" style="margin-top: 8px;">
                            <svg viewBox="0 0 24 24" fill="none" stroke="#999" stroke-width="2"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
                            武汉市新洲区阳逻经济开发区航天大道88号
                        </div>
                    </div>
                    <div class="industry-card-footer">
                        <div class="industry-tags">
                            <span class="industry-tag orange-tag">航天科技</span>
                            <span class="industry-tag orange-tag">遥感应用</span>
                        </div>
                        <div class="industry-nav-btn" onclick="navigateToAddress('北斗产业园')">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="3 11 22 2 13 21 11 13 3 11"/></svg>
                            导航
                        </div>
                    </div>
                </div>
                <div class="industry-card">
                    <div class="industry-img" style="background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);">
                        <div class="industry-img-text">工业园</div>
                    </div>
                    <div class="industry-info">
                        <div class="industry-name">中法生态示范城</div>
                        <div class="industry-tags">
                            <span class="industry-tag">国际合作</span>
                            <span class="industry-tag green-tag">绿色低碳</span>
                        </div>
                        <div class="industry-address" style="margin-top: 8px;">
                            <svg viewBox="0 0 24 24" fill="none" stroke="#999" stroke-width="2"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
                            武汉市蔡甸区知音湖大道89号
                        </div>
                    </div>
                    <div class="industry-card-footer">
                        <div class="industry-tags">
                            <span class="industry-tag orange-tag">新能源</span>
                            <span class="industry-tag orange-tag">智慧城市</span>
                        </div>
                        <div class="industry-nav-btn" onclick="navigateToAddress('中法生态示范城')">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="3 11 22 2 13 21 11 13 3 11"/></svg>
                            导航
                        </div>
                    </div>
                </div>
            </div>
            
            <!-- 产业楼宇列表 -->
            <div class="industry-list hidden" id="industry-building-list">
                <div class="industry-card">
                    <div class="industry-img" style="background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);">
                        <div class="industry-img-text">写字楼</div>
                    </div>
                    <div class="industry-info">
                        <div class="industry-name">光谷软件大厦</div>
                        <div class="industry-tags">
                            <span class="industry-tag">甲级写字楼</span>
                            <span class="industry-tag green-tag">5A品质</span>
                        </div>
                        <div class="industry-address" style="margin-top: 8px;">
                            <svg viewBox="0 0 24 24" fill="none" stroke="#999" stroke-width="2"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
                            武汉市洪山区光谷大道77号
                        </div>
                    </div>
                    <div class="industry-card-footer">
                        <div class="industry-tags">
                            <span class="industry-tag orange-tag">软件信息</span>
                            <span class="industry-tag orange-tag">互联网+</span>
                        </div>
                        <div class="industry-nav-btn" onclick="navigateToAddress('光谷软件大厦')">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="3 11 22 2 13 21 11 13 3 11"/></svg>
                            导航
                        </div>
                    </div>
                </div>
                <div class="industry-card">
                    <div class="industry-img" style="background: linear-gradient(135deg, #a18cd1 0%, #fbc2eb 100%);">
                        <div class="industry-img-text">科技楼</div>
                    </div>
                    <div class="industry-info">
                        <div class="industry-name">未来科技城写字楼</div>
                        <div class="industry-tags">
                            <span class="industry-tag">智慧楼宇</span>
                            <span class="industry-tag green-tag">绿色建筑</span>
                        </div>
                        <div class="industry-address" style="margin-top: 8px;">
                            <svg viewBox="0 0 24 24" fill="none" stroke="#999" stroke-width="2"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
                            武汉市东湖高新区高新大道999号
                        </div>
                    </div>
                    <div class="industry-card-footer">
                        <div class="industry-tags">
                            <span class="industry-tag orange-tag">人工智能</span>
                            <span class="industry-tag orange-tag">生物医药</span>
                        </div>
                        <div class="industry-nav-btn" onclick="navigateToAddress('未来科技城')">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="3 11 22 2 13 21 11 13 3 11"/></svg>
                            导航
                        </div>
                    </div>
                </div>
                <div class="industry-card">
                    <div class="industry-img" style="background: linear-gradient(135deg, #30cfd0 0%, #330867 100%);">
                        <div class="industry-img-text">研发中心</div>
                    </div>
                    <div class="industry-info">
                        <div class="industry-name">武汉光电工业技术研究院</div>
                        <div class="industry-tags">
                            <span class="industry-tag">研发总部</span>
                            <span class="industry-tag green-tag">孵化平台</span>
                        </div>
                        <div class="industry-address" style="margin-top: 8px;">
                            <svg viewBox="0 0 24 24" fill="none" stroke="#999" stroke-width="2"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
                            武汉市东湖高新区光谷一路与高新大道交汇处
                        </div>
                    </div>
                    <div class="industry-card-footer">
                        <div class="industry-tags">
                            <span class="industry-tag orange-tag">光电信息</span>
                            <span class="industry-tag orange-tag">激光技术</span>
                        </div>
                        <div class="industry-nav-btn" onclick="navigateToAddress('武汉光电工业技术研究院')">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="3 11 22 2 13 21 11 13 3 11"/></svg>
                            导航
                        </div>
                    </div>
                </div>
                <div class="industry-card">
                    <div class="industry-img" style="background: linear-gradient(135deg, #f7797d 0%, #FBD786 100%);">
                        <div class="industry-img-text">创业大厦</div>
                    </div>
                    <div class="industry-info">
                        <div class="industry-name">留学生创业园</div>
                        <div class="industry-tags">
                            <span class="industry-tag">海归创业</span>
                            <span class="industry-tag green-tag">政策扶持</span>
                        </div>
                        <div class="industry-address" style="margin-top: 8px;">
                            <svg viewBox="0 0 24 24" fill="none" stroke="#999" stroke-width="2"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
                            武汉市东湖高新区汤逊湖北路38号
                        </div>
                    </div>
                    <div class="industry-card-footer">
                        <div class="industry-tags">
                            <span class="industry-tag orange-tag">海归创业</span>
                            <span class="industry-tag orange-tag">国际合作</span>
                        </div>
                        <div class="industry-nav-btn" onclick="navigateToAddress('留学生创业园')">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="3 11 22 2 13 21 11 13 3 11"/></svg>
                            导航
                        </div>
                    </div>
                </div>
            </div>
            
            <!-- 会议会场列表 -->
            <div class="industry-list hidden" id="industry-venue-list">
                <div class="industry-card">
                    <div class="industry-img" style="background: linear-gradient(135deg, #30cfd0 0%, #330867 100%);">
                        <div class="industry-img-text">会议中心</div>
                    </div>
                    <div class="industry-info">
                        <div class="industry-name">中国光谷科技会展中心</div>
                        <div class="industry-tags">
                            <span class="industry-tag">大型展馆</span>
                            <span class="industry-tag green-tag">500+展位</span>
                        </div>
                        <div class="industry-address" style="margin-top: 8px;">
                            <svg viewBox="0 0 24 24" fill="none" stroke="#999" stroke-width="2"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
                            武汉市东湖高新区高新大道787号
                        </div>
                    </div>
                    <div class="industry-card-footer">
                        <div class="industry-tags">
                            <span class="industry-tag orange-tag">科技展览</span>
                            <span class="industry-tag orange-tag">国际论坛</span>
                        </div>
                        <div class="industry-nav-btn" onclick="navigateToAddress('中国光谷科技会展中心')">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="3 11 22 2 13 21 11 13 3 11"/></svg>
                            导航
                        </div>
                    </div>
                </div>
                <div class="industry-card">
                    <div class="industry-img" style="background: linear-gradient(135deg, #f7797d 0%, #FBD786 100%);">
                        <div class="industry-img-text">会议厅</div>
                    </div>
                    <div class="industry-info">
                        <div class="industry-name">武汉会议中心</div>
                        <div class="industry-tags">
                            <span class="industry-tag">政务会议</span>
                            <span class="industry-tag green-tag">多功能厅</span>
                        </div>
                        <div class="industry-address" style="margin-top: 8px;">
                            <svg viewBox="0 0 24 24" fill="none" stroke="#999" stroke-width="2"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
                            武汉市汉阳区鹦鹉大道619号
                        </div>
                    </div>
                    <div class="industry-card-footer">
                        <div class="industry-tags">
                            <span class="industry-tag orange-tag">商务会议</span>
                            <span class="industry-tag orange-tag">学术交流</span>
                        </div>
                        <div class="industry-nav-btn" onclick="navigateToAddress('武汉会议中心')">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="3 11 22 2 13 21 11 13 3 11"/></svg>
                            导航
                        </div>
                    </div>
                </div>
                <div class="industry-card">
                    <div class="industry-img" style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);">
                        <div class="industry-img-text">路演厅</div>
                    </div>
                    <div class="industry-info">
                        <div class="industry-name">科创路演大厅</div>
                        <div class="industry-tags">
                            <span class="industry-tag">路演场地</span>
                            <span class="industry-tag green-tag">项目对接</span>
                        </div>
                        <div class="industry-address" style="margin-top: 8px;">
                            <svg viewBox="0 0 24 24" fill="none" stroke="#999" stroke-width="2"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
                            武汉市武昌区科创路88号光谷资本大厦
                        </div>
                    </div>
                    <div class="industry-card-footer">
                        <div class="industry-tags">
                            <span class="industry-tag orange-tag">创业路演</span>
                            <span class="industry-tag orange-tag">投资对接</span>
                        </div>
                        <div class="industry-nav-btn" onclick="navigateToAddress('光谷资本大厦')">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="3 11 22 2 13 21 11 13 3 11"/></svg>
                            导航
                        </div>
                    </div>
                </div>
                <div class="industry-card">
                    <div class="industry-img" style="background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);">
                        <div class="industry-img-text">报告厅</div>
                    </div>
                    <div class="industry-info">
                        <div class="industry-name">武汉大学医学部学术报告厅</div>
                        <div class="industry-tags">
                            <span class="industry-tag">学术报告</span>
                            <span class="industry-tag green-tag">200席</span>
                        </div>
                        <div class="industry-address" style="margin-top: 8px;">
                            <svg viewBox="0 0 24 24" fill="none" stroke="#999" stroke-width="2"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>
                            武汉市武昌区东湖路39号
                        </div>
                    </div>
                    <div class="industry-card-footer">
                        <div class="industry-tags">
                            <span class="industry-tag orange-tag">学术报告</span>
                            <span class="industry-tag orange-tag">医学研讨</span>
                        </div>
                        <div class="industry-nav-btn" onclick="navigateToAddress('武汉大学医学部')">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="3 11 22 2 13 21 11 13 3 11"/></svg>
                            导航
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="home-float-btn" data-page="home">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
            </div>
        </div>
    </div>

            <div class="home-float-btn" data-page="home">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
            </div>
        </div>
    </div>

    
<script>
// ===== 空天智链云 Demo JavaScript =====

document.addEventListener('DOMContentLoaded', function() {
    // 页面元素
    const pages = document.querySelectorAll('.page');
    const tabItems = document.querySelectorAll('.tab-item');
    const bannerSlider = document.querySelector('.banner-slider');
    const dots = document.querySelectorAll('.dot');
    const backBtn = document.getElementById('backBtn');
    const mainTabBar = document.getElementById('mainTabBar');
    
    // 页面栈
    let pageStack = ['home'];
    let currentPage = 'home';
    
    // 当前Banner索引
    let currentBannerIndex = 0;
    let bannerInterval;

    // ===== 页面导航 =====
    function navigateTo(pageName) {
        // 保存当前页到栈
        if (currentPage !== pageName) {
            pageStack.push(pageName);
        }
        currentPage = pageName;
        
        // 更新页面显示
        pages.forEach(page => {
            const isActive = page.id === `page-${pageName}`;
            page.classList.toggle('active', isActive);
        });
        
        // 更新Tab状态（仅主Tab）
        if (['home', 'ai', 'profile'].includes(pageName)) {
            tabItems.forEach(item => {
                item.classList.toggle('active', item.dataset.page === pageName);
            });
        }
        
        // 显示/隐藏返回按钮和TabBar
        updateNavigationUI();
        
        // 滚动到顶部
        window.scrollTo(0, 0);
    }
    
    function updateNavigationUI() {
        const isSubPage = !['home', 'ai', 'profile'].includes(currentPage);
        backBtn.style.display = isSubPage ? 'flex' : 'none';
        mainTabBar.style.display = isSubPage ? 'none' : 'flex';
    }
    
    // 返回按钮
    backBtn.addEventListener('click', function() {
        pageStack.pop();
        const prevPage = pageStack.length > 0 ? pageStack[pageStack.length - 1] : 'home';
        currentPage = prevPage;
        
        pages.forEach(page => {
            const isActive = page.id === `page-${prevPage}`;
            page.classList.toggle('active', isActive);
        });
        
        if (['home', 'ai', 'profile'].includes(prevPage)) {
            tabItems.forEach(item => {
                item.classList.toggle('active', item.dataset.page === prevPage);
            });
        }
        
        updateNavigationUI();
        window.scrollTo(0, 0);
    });

    // ===== Tab切换 =====
    tabItems.forEach(item => {
        item.addEventListener('click', function() {
            const pageName = this.dataset.page;
            pageStack = [pageName];
            navigateTo(pageName);
        });
    });
    
    // ===== 所有可点击导航 =====
    document.querySelectorAll('[data-page]').forEach(el => {
        el.addEventListener('click', function(e) {
            e.stopPropagation();
            const pageName = this.dataset.page;
            if (pageName) {
                navigateTo(pageName);
            }
        });
    });

    // ===== Banner轮播 =====
    function startBannerAutoPlay() {
        bannerInterval = setInterval(() => {
            currentBannerIndex = (currentBannerIndex + 1) % 3;
            updateBanner();
        }, 4000);
    }
    
    function updateBanner() {
        if (bannerSlider) {
            bannerSlider.style.transform = `translateX(-${currentBannerIndex * 100}%)`;
        }
        
        dots.forEach((dot, index) => {
            dot.classList.toggle('active', index === currentBannerIndex);
        });
    }
    
    function stopBannerAutoPlay() {
        clearInterval(bannerInterval);
    }
    
    // 触摸事件处理Banner轮播
    let touchStartX = 0;
    let touchEndX = 0;
    
    if (bannerSlider) {
        bannerSlider.addEventListener('touchstart', function(e) {
            touchStartX = e.touches[0].clientX;
            stopBannerAutoPlay();
        });
        
        bannerSlider.addEventListener('touchend', function(e) {
            touchEndX = e.changedTouches[0].clientX;
            handleSwipe();
            startBannerAutoPlay();
        });
    }
    
    function handleSwipe() {
        const swipeThreshold = 50;
        const diff = touchStartX - touchEndX;
        
        if (Math.abs(diff) > swipeThreshold) {
            if (diff > 0) {
                currentBannerIndex = (currentBannerIndex + 1) % 3;
            } else {
                currentBannerIndex = (currentBannerIndex - 1 + 3) % 3;
            }
            updateBanner();
        }
    }
    
    dots.forEach((dot, index) => {
        dot.addEventListener('click', function() {
            currentBannerIndex = index;
            updateBanner();
            stopBannerAutoPlay();
            startBannerAutoPlay();
        });
    });
    
    startBannerAutoPlay();

    // ===== 新闻项点击 =====
    document.querySelectorAll('.news-item').forEach(item => {
        item.addEventListener('click', function() {
            const title = this.querySelector('h4');
            if (title) {
                alert('文章详情：\n' + title.textContent);
            }
        });
    });

    // ===== 快捷问题点击 =====
    document.querySelectorAll('.quick-btn').forEach(btn => {
        btn.addEventListener('click', function(e) {
            e.stopPropagation();
            alert('AI助手功能演示中...\n\n您点击了: ' + this.textContent);
        });
    });

    // ===== 功能模块点击 =====

    // ===== 控制台欢迎信息 =====
    console.log('%c 空天智链云 Demo ', 'background: linear-gradient(135deg, #0066cc 0%, #00a0e9 100%); color: white; font-size: 20px; padding: 10px 20px; border-radius: 5px;');
    console.log('%c 完整首页5屏布局 · 政策资讯 · 产业动态 ', 'color: #666; font-size: 12px;');

    // ===== 产业空间选项卡切换 =====
    const industryTabs = document.querySelectorAll('.industry-tab');
    industryTabs.forEach(tab => {
        tab.addEventListener('click', function() {
            // 切换选项卡激活状态
            industryTabs.forEach(t => t.classList.remove('active'));
            this.classList.add('active');
            
            // 切换列表显示
            const tabType = this.dataset.tab;
            const lists = ['park', 'building', 'venue'];
            lists.forEach(type => {
                const list = document.getElementById(`industry-${type}-list`);
                if (list) {
                    list.classList.toggle('hidden', type !== tabType);
                }
            });
        });
    });
});

// ===== 产业空间导航功能 =====
function navigateToAddress(locationName) {
    // 检测设备类型并调用对应的地图导航
    const userAgent = navigator.userAgent.toLowerCase();
    
    // 地址映射 - 完整的地址信息
    const addressMap = {
        '斗转科技园': '武汉市洪山区珞喻路78号',
        '珞珈创新港': '武汉市武昌区卓刀泉北路168号',
        '光谷未来城': '武汉市东湖新技术开发区光谷大道77号',
        '北斗产业园': '武汉市新洲区阳逻经济开发区航天大道88号',
        '中法生态示范城': '武汉市蔡甸区知音湖大道89号',
        '光谷软件大厦': '武汉市洪山区光谷大道77号',
        '未来科技城': '武汉市东湖高新区高新大道999号',
        '武汉光电工业技术研究院': '武汉市东湖高新区光谷一路与高新大道交汇处',
        '留学生创业园': '武汉市东湖高新区汤逊湖北路38号',
        '中国光谷科技会展中心': '武汉市东湖高新区高新大道787号',
        '武汉会议中心': '武汉市汉阳区鹦鹉大道619号',
        '光谷资本大厦': '武汉市武昌区科创路88号光谷资本大厦',
        '武汉大学医学部': '武汉市武昌区东湖路39号'
    };
    
    const fullAddress = addressMap[locationName] || locationName;
    
    // 构建导航链接
    let navUrl = '';
    
    if (/iphone|ipad|ipod/.test(userAgent)) {
        // iOS设备 - 使用苹果地图
        navUrl = `http://maps.apple.com/?daddr=${encodeURIComponent(fullAddress)}&dirflg=d`;
    } else if (/android/.test(userAgent)) {
        // Android设备 - 使用高德地图
        navUrl = `https://uri.amap.com/navigation?to=116.397428,39.90923,${encodeURIComponent(fullAddress)}&mode=car&callnative=1`;
    } else {
        // PC或其他设备 - 使用腾讯地图网页版
        navUrl = `https://apis.map.qq.com/uri/v1/marker?marker=coord:39.908823,116.397470&title=${encodeURIComponent(locationName)}&addr=${encodeURIComponent(fullAddress)}`;
    }
    
    // 显示导航选择提示
    const choice = confirm(`是否导航到：${locationName}\n地址：${fullAddress}\n\n点击"确定"使用浏览器导航\n点击"取消"复制地址`);
    
    if (choice) {
        // 打开导航链接
        window.location.href = navUrl;
    } else {
        // 复制地址到剪贴板
        copyToClipboard(`${locationName}，地址：${fullAddress}`);
    }
}

// 复制到剪贴板函数
function copyToClipboard(text) {
    if (navigator.clipboard && navigator.clipboard.writeText) {
        navigator.clipboard.writeText(text).then(function() {
            showToast('地址已复制到剪贴板');
        }, function(err) {
            console.error('复制失败:', err);
            showToast('复制失败，请手动复制');
        });
    } else {
        // 降级方案
        const textArea = document.createElement('textarea');
        textArea.value = text;
        textArea.style.position = 'fixed';
        textArea.style.left = '-9999px';
        document.body.appendChild(textArea);
        textArea.select();
        try {
            document.execCommand('copy');
            showToast('地址已复制到剪贴板');
        } catch (err) {
            console.error('复制失败:', err);
            showToast('复制失败，请手动复制');
        }
        document.body.removeChild(textArea);
    }
}

// 显示提示信息
function showToast(message) {
    // 创建toast元素
    const toast = document.createElement('div');
    toast.style.cssText = `
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background: rgba(0,0,0,0.8);
        color: #fff;
        padding: 12px 24px;
        border-radius: 8px;
        font-size: 14px;
        z-index: 10000;
        text-align: center;
        max-width: 280px;
    `;
    toast.textContent = message;
    document.body.appendChild(toast);
    
    // 2秒后移除
    setTimeout(function() {
        toast.style.opacity = '0';
        toast.style.transition = 'opacity 0.3s';
        setTimeout(function() {
            document.body.removeChild(toast);
        }, 300);
    }, 2000);
}

</script>
</body>
</html>