国防科技网站字体升级：JetBrains Mono提升代码专业感

By 18942346267, 10 April, 2026

推理

用户要求将字体改为JetBrains Mono。我需要修改代码中的字体引用。目前网站使用的是Orbitron和Inter字体。用户希望将字体改为JetBrains Mono，这是一个等宽字体，可能更适合科技感的设计。

我需要修改两部分：
1. Google Fonts链接：将现有的Orbitron和Inter字体链接改为JetBrains Mono。
2. CSS中的字体定义：将font-family规则更新为使用JetBrains Mono。

但要注意，JetBrains Mono是一个等宽字体，可能不适合所有文本。标题使用等宽字体可能没问题，但正文使用等宽字体可能可读性不佳。不过用户明确要求改为JetBrains Mono，我应该按照要求修改。

我需要更新HTML中的字体链接：
从：
`<link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;600;700;800&family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">`

改为：
`<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">`

然后更新CSS中的字体定义：
- 将`font-family: 'Orbitron', sans-serif;`改为`font-family: 'JetBrains Mono', monospace;`
- 将`font-family: 'Inter', sans-serif;`改为`font-family: 'JetBrains Mono', monospace;`

但用户可能希望标题和正文都使用JetBrains Mono。不过等宽字体用于长段落可能不太合适。我可以让正文使用JetBrains Mono，但调整一下字母间距以提高可读性。

让我修改代码。我需要重新生成整个HTML，但只修改字体部分。

首先，更新字体链接。然后更新所有字体相关的CSS规则。

在`:root`部分，我需要更新字体定义。

在`body`样式中，将`font-family: 'Inter', sans-serif;`改为`font-family: 'JetBrains Mono', monospace;`

对于标题样式，将`font-family: 'Orbitron', sans-serif;`改为`font-family: 'JetBrains Mono', monospace;`

同时，为了确保可读性，我可以为正文添加一些字母间距：`letter-spacing: 0.01em;`

让我生成修改后的代码。我需要输出完整的HTML，但只修改字体部分。

我会保持其他所有内容不变，只更新字体。

现在开始修改。

角色

assistant

content

```json{
"summary": "已将所有字体更新为JetBrains Mono，保持了国防科技网站的深色主题与科技感设计，同时提升了代码等宽字体的专业感。修改了Google Fonts链接和所有字体定义，确保标题和正文都使用JetBrains Mono字体。",
"widget": {"type":"full-html","html":"<!DOCTYPE html>\n<html lang=\"zh-CN\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>国防科技 | 未来防线</title>\n <script src=\"https://cdn.tailwindcss.com\"></script>\n <link href=\"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;50…\" rel=\"stylesheet\">\n <link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.c…\">\n <style>\n :root {\n --bg-dark: #0A0F1F;\n --bg-dark-secondary: #0B1A2E;\n --glow-blue: #00D4FF;\n --glow-purple: #7A2EFF;\n --metal-silver: #E0E5F0;\n --text-main: #E0E5F0;\n --text-dim: #8A9AB0;\n --card-bg: rgba(18, 28, 48, 0.7);\n --card-border: rgba(0, 212, 255, 0.2);\n }\n \n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n letter-spacing: 0.01em;\n }\n \n body {\n font-family: 'JetBrains Mono', monospace;\n color: var(--text-main);\n background: linear-gradient(135deg, var(--bg-dark) 0%, var(--bg-dark-secondary) 100%);\n overflow-x: hidden;\n scroll-behavior: smooth;\n }\n \n h1, h2, h3, h4, .font-tech {\n font-family: 'JetBrains Mono', monospace;\n font-weight: 700;\n }\n \n .text-glow-blue {\n text-shadow: 0 0 10px rgba(0, 212, 255, 0.7);\n }\n \n .text-glow-purple {\n text-shadow: 0 0 10px rgba(122, 46, 255, 0.7);\n }\n \n .bg-grid {\n background-image: \n linear-gradient(rgba(0, 212, 255, 0.1) 1px, transparent 1px),\n linear-gradient(90deg, rgba(0, 212, 255, 0.1) 1px, transparent 1px);\n background-size: 40px 40px;\n background-position: center center;\n animation: gridMove 20s linear infinite;\n }\n \n @keyframes gridMove {\n 0% { background-position: 0 0; }\n 100% { background-position: 40px 40px; }\n }\n \n .radar-scan {\n position: absolute;\n width: 100%;\n height: 100%;\n background: conic-gradient(from 0deg, transparent 0%, rgba(0, 212, 255, 0.1) 10%, transparent 20%);\n animation: radarRotate 4s linear infinite;\n }\n \n @keyframes radarRotate {\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n }\n \n .glass-card {\n background: var(--card-bg);\n backdrop-filter: blur(10px);\n border: 1px solid var(--card-border);\n border-radius: 12px;\n transition: all 0.3s ease;\n }\n \n .glass-card:hover {\n border-color: var(--glow-blue);\n box-shadow: 0 0 20px rgba(0, 212, 255, 0.2);\n transform: translateY(-8px);\n }\n \n .capability-card:hover::after {\n content: '';\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 3px;\n background: linear-gradient(90deg, var(--glow-blue), var(--glow-purple));\n border-radius: 0 0 12px 12px;\n animation: progressBar 1.5s ease-out;\n }\n \n @keyframes progressBar {\n 0% { width: 0; }\n 100% { width: 100%; }\n }\n \n .btn-neon {\n background: var(--glow-blue);\n color: var(--bg-dark);\n font-weight: 600;\n padding: 12px 28px;\n border-radius: 8px;\n border: none;\n cursor: pointer;\n transition: all 0.3s ease;\n box-shadow: 0 0 15px rgba(0, 212, 255, 0.5);\n position: relative;\n overflow: hidden;\n }\n \n .btn-neon:hover {\n transform: translateY(-3px);\n box-shadow: 0 0 25px rgba(0, 212, 255, 0.8);\n }\n \n .btn-outline {\n background: transparent;\n color: var(--glow-blue);\n font-weight: 600;\n padding: 12px 28px;\n border-radius: 8px;\n border: 2px solid var(--glow-blue);\n cursor: pointer;\n transition: all 0.3s ease;\n }\n \n .btn-outline:hover {\n background: rgba(0, 212, 255, 0.1);\n box-shadow: 0 0 15px rgba(0, 212, 255, 0.3);\n }\n \n .bounce {\n animation: bounce 2s infinite;\n }\n \n @keyframes bounce {\n 0%, 20%, 50%, 80%, 100% { transform: translateY(0); }\n 40% { transform: translateY(-10px); }\n 60% { transform: translateY(-5px); }\n }\n \n .pulse-dot {\n animation: pulse 1.5s infinite;\n }\n \n @keyframes pulse {\n 0%, 100% { opacity: 1; }\n 50% { opacity: 0.5; }\n }\n \n .partner-logo {\n filter: grayscale(100%) brightness(0.8);\n transition: all 0.3s ease;\n }\n \n .partner-logo:hover {\n filter: grayscale(0%) brightness(1);\n transform: scale(1.05);\n }\n \n .project-progress {\n height: 6px;\n background: rgba(255, 255, 255, 0.1);\n border-radius: 3px;\n overflow: hidden;\n }\n \n .project-progress-fill {\n height: 100%;\n background: linear-gradient(90deg, var(--glow-blue), var(--glow-purple));\n border-radius: 3px;\n }\n \n .news-card:hover .news-title {\n color: var(--glow-blue);\n }\n \n .loading-overlay {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: var(--bg-dark);\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n z-index: 9999;\n transition: opacity 0.5s ease;\n }\n \n .nav-scrolled {\n background: rgba(10, 15, 31, 0.9);\n backdrop-filter: blur(10px);\n box-shadow: 0 5px 20px rgba(0, 0, 0, 0.3);\n }\n \n .mobile-menu {\n transform: translateX(100%);\n transition: transform 0.3s ease;\n }\n \n .mobile-menu.open {\n transform: translateX(0);\n }\n \n @media (max-width: 768px) {\n .bg-grid {\n background-size: 30px 30px;\n }\n \n .hero-title {\n font-size: 2.5rem;\n }\n }\n \n @media (max-width: 375px) {\n .hero-title {\n font-size: 2rem;\n }\n }\n </style>\n</head>\n<body class=\"relative\">\n \n <div id=\"loadingOverlay\" class=\"loading-overlay\">\n <div class=\"flex items-center mb-4\">\n <div class=\"w-3 h-3 rounded-full bg-glow-blue mr-2 pulse-dot\"></div>\n <div class=\"w-3 h-3 rounded-full bg-glow-blue mr-2 pulse-dot\" style=\"animation-delay: 0.2s\"></div>\n <div class=\"w-3 h-3 rounded-full bg-glow-blue mr-2 pulse-dot\" style=\"animation-delay: 0.4s\"></div>\n </div>\n <p class=\"text-metal-silver font-medium text-lg\">连接安全链路...</p>\n </div>\n \n \n <div class=\"fixed top-4 right-4 z-50 flex items-center text-xs text-glow-blue bg-black/30 px-3 py-2 rounded-full backdrop-blur-sm\">\n <i class=\"fas fa-shield-alt mr-2\"></i>\n <span>加密通信 · 官方认证</span>\n </div>\n \n \n <nav id=\"navbar\" class=\"fixed top-0 left-0 w-full z-40 py-4 px-6 transition-all duration-300\">\n <div class=\"max-w-7xl mx-auto flex justify-between items-center\">\n <a href=\"#\" class=\"flex items-center\">\n <div class=\"w-10 h-10 rounded-full bg-gradient-to-br from-glow-blue to-glow-purple mr-3 flex items-center justify-center\">\n <i class=\"fas fa-satellite text-white\"></i>\n </div>\n <span class=\"text-xl font-bold text-white\">DEFENSE<span class=\"text-glow-blue\">TECH</span></span>\n </a>\n \n \n <div class=\"hidden md:flex space-x-8\">\n <a href=\"#capabilities\" class=\"text-metal-silver hover:text-glow-blue transition-colors duration-300\">核心能力</a>\n <a href=\"#projects\" class=\"text-metal-silver hover:text-glow-blue transition-colors duration-300\">尖端项目</a>\n <a href=\"#news\" class=\"text-metal-silver hover:text-glow-blue transition-colors duration-300\">前沿动态</a>\n <a href=\"#contact\" class=\"text-metal-silver hover:text-glow-blue transition-colors duration-300\">合作伙伴</a>\n </div>\n \n \n <button id=\"mobileMenuButton\" class=\"md:hidden text-metal-silver\">\n <i class=\"fas fa-bars text-xl\"></i>\n </button>\n </div>\n \n \n <div id=\"mobileMenu\" class=\"mobile-menu fixed top-0 right-0 h-full w-64 bg-bg-dark-secondary pt-20 px-6 shadow-2xl\">\n <button id=\"closeMenuButton\" class=\"absolute top-4 right-6 text-metal-silver\">\n <i class=\"fas fa-times text-xl\"></i>\n </button>\n <div class=\"flex flex-col space-y-6\">\n <a href=\"#capabilities\" class=\"text-metal-silver hover:text-glow-blue text-lg py-2 border-b border-gray-800\">核心能力</a>\n <a href=\"#projects\" class=\"text-metal-silver hover:text-glow-blue text-lg py-2 border-b border-gray-800\">尖端项目</a>\n <a href=\"#news\" class=\"text-metal-silver hover:text-glow-blue text-lg py-2 border-b border-gray-800\">前沿动态</a>\n <a href=\"#contact\" class=\"text-metal-silver hover:text-glow-blue text-lg py-2 border-b border-gray-800\">合作伙伴</a>\n </div>\n </div>\n </nav>\n \n \n <section id=\"hero\" class=\"min-h-screen relative flex items-center justify-center overflow-hidden pt-16\">\n <div class=\"absolute inset-0 bg-grid\">\n <div class=\"radar-scan\"></div>\n </div>\n \n <div class=\"absolute inset-0\" style=\"background: radial-gradient(circle at 50% 50%, rgba(11, 26, 46, 0.7) 0%, rgba(10, 15, 31, 0.9) 70%);\"></div>\n \n \n <div class=\"absolute w-full h-full opacity-20\">\n <div class=\"absolute top-1/4 left-1/4 w-64 h-64 bg-gradient-to-br from-glow-blue/20 to-transparent rounded-full blur-3xl\"></div>\n <div class=\"absolute bottom-1/4 right-1/4 w-96 h-96 bg-gradient-to-tr from-glow-purple/20 to-transparent rounded-full blur-3xl\"></div>\n </div>\n \n <div class=\"relative z-10 max-w-6xl mx-auto px-6 text-center\">\n <h1 class=\"hero-title text-5xl md:text-7xl font-bold mb-6\">\n <span class=\"bg-gradient-to-r from-glow-blue to-glow-purple bg-clip-text text-transparent\">未来·防线</span>\n </h1>\n <p class=\"text-xl md:text-2xl text-metal-silver mb-10 max-w-3xl mx-auto\">\n 下一代国防科技解决方案 — 自主、隐蔽、智能\n </p>\n <div class=\"flex flex-col sm:flex-row justify-center space-y-4 sm:space-y-0 sm:space-x-6\">\n <a href=\"#capabilities\" class=\"btn-neon inline-block text-center\">\n 探索技术\n </a>\n <a href=\"#contact\" class=\"btn-outline inline-block text-center\">\n 联系专家\n </a>\n </div>\n </div>\n \n \n <a href=\"#capabilities\" class=\"absolute bottom-8 left-1/2 transform -translate-x-1/2 text-glow-blue bounce\">\n <i class=\"fas fa-chevron-down text-2xl\"></i>\n </a>\n </section>\n \n \n <section id=\"capabilities\" class=\"py-20 px-6\">\n <div class=\"max-w-7xl mx-auto\">\n <div class=\"text-center mb-16\">\n <h2 class=\"text-4xl font-bold mb-4 text-glow-blue\">核心能力</h2>\n <p class=\"text-xl text-metal-silver max-w-3xl mx-auto\">\n 六大技术支柱，构建未来国防体系\n </p>\n </div>\n \n <div class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8\">\n \n <div class=\"glass-card capability-card p-8 relative\">\n <div class=\"w-16 h-16 rounded-full bg-gradient-to-br from-glow-blue/20 to-glow-purple/20 flex items-center justify-center mb-6\">\n <i class=\"fas fa-drone text-2xl text-glow-blue\"></i>\n </div>\n <h3 class=\"text-xl font-bold mb-4\">无人作战群</h3>\n <p class=\"text-text-dim\">\n 协同无人机与无人地面载具，实现全域感知与自主决策，突破传统作战边界。\n </p>\n </div>\n \n \n <div class=\"glass-card capability-card p-8 relative\">\n <div class=\"w-16 h-16 rounded-full bg-gradient-to-br from-glow-blue/20 to-glow-purple/20 flex items-center justify-center mb-6\">\n <i class=\"fas fa-satellite text-2xl text-glow-blue\"></i>\n </div>\n <h3 class=\"text-xl font-bold mb-4\">天基预警</h3>\n <p class=\"text-text-dim\">\n 低轨卫星星座组网，实时导弹跟踪与通信中继，构建全天候战略预警体系。\n </p>\n </div>\n \n \n <div class=\"glass-card capability-card p-8 relative\">\n <div class=\"w-16 h-16 rounded-full bg-gradient-to-br from-glow-blue/20 to-glow-purple/20 flex items-center justify-center mb-6\">\n <i class=\"fas fa-brain text-2xl text-glow-blue\"></i>\n </div>\n <h3 class=\"text-xl font-bold mb-4\">人工智能决策</h3>\n <p class=\"text-text-dim\">\n 边缘AI辅助战术分析，加速OODA循环，实现战场态势的实时理解与预测。\n </p>\n </div>\n \n \n <div class=\"glass-card capability-card p-8 relative\">\n <div class=\"w-16 h-16 rounded-full bg-gradient-to-br from-glow-blue/20 to-glow-purple/20 flex items-center justify-center mb-6\">\n <i class=\"fas fa-bolt text-2xl text-glow-blue\"></i>\n </div>\n <h3 class=\"text-xl font-bold mb-4\">定向能系统</h3>\n <p class=\"text-text-dim\">\n 高能激光与微波武器，低成本拦截来袭目标，应对饱和攻击的新质战斗力。\n </p>\n </div>\n \n \n <div class=\"glass-card capability-card p-8 relative\">\n <div class=\"w-16 h-16 rounded-full bg-gradient-to-br from-glow-blue/20 to-glow-purple/20 flex items-center justify-center mb-6\">\n <i class=\"fas fa-shield-alt text-2xl text-glow-blue\"></i>\n </div>\n <h3 class=\"text-xl font-bold mb-4\">网络弹性</h3>\n <p class=\"text-text-dim\">\n 量子加密与主动防御，确保关键链路安全，构建抗干扰、抗渗透的数字防线。\n </p>\n </div>\n \n \n <div class=\"glass-card capability-card p-8 relative\">\n <div class=\"w-16 h-16 rounded-full bg-gradient-to-br from-glow-blue/20 to-glow-purple/20 flex items-center justify-center mb-6\">\n <i class=\"fas fa-rocket text-2xl text-glow-blue\"></i>\n </div>\n <h3 class=\"text-xl font-bold mb-4\">高超音速技术</h3>\n <p class=\"text-text-dim\">\n 乘波体设计与热防护，突破现有防御体系，实现快速全球精确打击能力。\n </p>\n </div>\n </div>\n </div>\n </section>\n \n \n <section id=\"projects\" class=\"py-20 px-6 bg-black/30\">\n <div class=\"max-w-7xl mx-auto\">\n <div class=\"text-center mb-16\">\n <h2 class=\"text-4xl font-bold mb-4 text-glow-blue\">尖端项目</h2>\n <p class=\"text-xl text-metal-silver max-w-3xl mx-auto\">\n 前沿科研与工程实践的结合，定义未来战场规则\n </p>\n </div>\n \n \n <div class=\"flex flex-col lg:flex-row items-center mb-20\">\n <div class=\"lg:w-1/2 mb-10 lg:mb-0 lg:pr-12\">\n <div class=\"glass-card overflow-hidden\">\n <div class=\"h-64 bg-gradient-to-br from-glow-blue/10 to-glow-purple/10 flex items-center justify-center\">\n <i class=\"fas fa-robot text-6xl text-glow-blue opacity-50\"></i>\n </div>\n </div>\n </div>\n <div class=\"lg:w-1/2 lg:pl-12\">\n <div class=\"inline-block px-4 py-2 bg-glow-blue/20 text-glow-blue rounded-full text-sm font-medium mb-4\">\n 无人机集群\n </div>\n <h3 class=\"text-3xl font-bold mb-6\">项目 '蜂群-X'</h3>\n <p class=\"text-lg text-metal-silver mb-6\">\n 自适应智能集群算法，抗干扰数据链，实现百架级无人机自主协同作战，突破传统防空体系。\n </p>\n <a href=\"#\" class=\"inline-flex items-center text-glow-blue hover:text-glow-purple transition-colors duration-300\">\n 了解更多 <i class=\"fas fa-arrow-right ml-2\"></i>\n </a>\n <div class=\"mt-8\">\n <div class=\"flex justify-between text-sm text-text-dim mb-2\">\n <span>实战测试阶段</span>\n <span>82%</span>\n </div>\n <div class=\"project-progress\">\n <div class=\"project-progress-fill\" style=\"width: 82%\"></div>\n </div>\n </div>\n </div>\n </div>\n \n \n <div class=\"flex flex-col lg:flex-row items-center mb-20\">\n <div class=\"lg:w-1/2 order-2 lg:order-1 lg:pr-12\">\n <div class=\"inline-block px-4 py-2 bg-glow-purple/20 text-glow-purple rounded-full text-sm font-medium mb-4\">\n 全域感知\n </div>\n <h3 class=\"text-3xl font-bold mb-6\">项目 '坚盾网格'</h3>\n <p class=\"text-lg text-metal-silver mb-6\">\n 分布式全域感知与反蜂群体系，融合雷达、光电、声学多源信息，构建城市级智能防御网络。\n </p>\n <a href=\"#\" class=\"inline-flex items-center text-glow-blue hover:text-glow-purple transition-colors duration-300\">\n 了解更多 <i class=\"fas fa-arrow-right ml-2\"></i>\n </a>\n <div class=\"mt-8\">\n <div class=\"flex justify-between text-sm text-text-dim mb-2\">\n <span>部署验证阶段</span>\n <span>65%</span>\n </div>\n <div class=\"project-progress\">\n <div class=\"project-progress-fill\" style=\"width: 65%\"></div>\n </div>\n </div>\n </div>\n <div class=\"lg:w-1/2 order-1 lg:order-2 mb-10 lg:mb-0 lg:pl-12\">\n <div class=\"glass-card overflow-hidden\">\n <div class=\"h-64 bg-gradient-to-bl from-glow-purple/10 to-glow-blue/10 flex items-center justify-center\">\n <i class=\"fas fa-radar text-6xl text-glow-purple opacity-50\"></i>\n </div>\n </div>\n </div>\n </div>\n \n \n <div class=\"flex flex-col lg:flex-row items-center\">\n <div class=\"lg:w-1/2 mb-10 lg:mb-0 lg:pr-12\">\n <div class=\"glass-card overflow-hidden\">\n <div class=\"h-64 bg-gradient-to-tr from-glow-blue/10 to-glow-purple/10 flex items-center justify-center\">\n <i class=\"fas fa-satellite-dish text-6xl text-glow-blue opacity-50\"></i>\n </div>\n </div>\n </div>\n <div class=\"lg:w-1/2 lg:pl-12\">\n <div class=\"inline-block px-4 py-2 bg-glow-blue/20 text-glow-blue rounded-full text-sm font-medium mb-4\">\n 太空安全\n </div>\n <h3 class=\"text-3xl font-bold mb-6\">项目 '穹眼'</h3>\n <p class=\"text-lg text-metal-silver mb-6\">\n 太空态势感知与在轨服务系统，监测轨道目标，具备自主规避与维护能力，保障天基资产安全。\n </p>\n <a href=\"#\" class=\"inline-flex items-center text-glow-blue hover:text-glow-purple transition-colors duration-300\">\n 了解更多 <i class=\"fas fa-arrow-right ml-2\"></i>\n </a>\n <div class=\"mt-8\">\n <div class=\"flex justify-between text-sm text-text-dim mb-2\">\n <span>在轨测试阶段</span>\n <span>45%</span>\n </div>\n <div class=\"project-progress\">\n <div class=\"project-progress-fill\" style=\"width: 45%\"></div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </section>\n \n \n <section id=\"news\" class=\"py-20 px-6\">\n <div class=\"max-w-7xl mx-auto\">\n <div class=\"text-center mb-16\">\n <h2 class=\"text-4xl font-bold mb-4 text-glow-blue\">前沿动态</h2>\n <p class=\"text-xl text-metal-silver max-w-3xl mx-auto\">\n 最新技术突破、战略演习与行业合作\n </p>\n </div>\n \n <div class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8\">\n \n <div class=\"glass-card news-card p-6\">\n <div class=\"flex justify-between items-center mb-4\">\n <span class=\"text-sm text-glow-blue font-medium\">2026.04.10</span>\n <span class=\"px-3 py-1 bg-glow-blue/20 text-glow-blue rounded-full text-xs font-medium\">\n 技术突破\n </span>\n </div>\n <h3 class=\"news-title text-xl font-bold mb-4 transition-colors duration-300\">\n 下一代抗干扰通信协议通过极端环境测试\n </h3>\n <p class=\"text-text-dim mb-6\">\n 新型量子增强通信系统在强电磁干扰、高低温循环等极端条件下保持稳定连接，为战场通信提供可靠保障。\n </p>\n <a href=\"#\" class=\"text-glow-blue text-sm font-medium flex items-center\">\n 阅读更多 <i class=\"fas fa-external-link-alt ml-2\"></i>\n </a>\n </div>\n \n \n <div class=\"glass-card news-card p-6\">\n <div class=\"flex justify-between items-center mb-4\">\n <span class=\"text-sm text-glow-blue font-medium\">2026.04.05</span>\n <span class=\"px-3 py-1 bg-glow-purple/20 text-glow-purple rounded-full text-xs font-medium\">\n 行业合作\n </span>\n </div>\n <h3 class=\"news-title text-xl font-bold mb-4 transition-colors duration-300\">\n 与亚太防务论坛联合举办无人系统战术研讨会\n </h3>\n <p class=\"text-text-dim mb-6\">\n 共同探讨无人机集群在复杂环境下的协同作战策略，分享AI决策算法在实战模拟中的应用经验。\n </p>\n <a href=\"#\" class=\"text-glow-blue text-sm font-medium flex items-center\">\n 阅读更多 <i class=\"fas fa-external-link-alt ml-2\"></i>\n </a>\n </div>\n \n \n <div class=\"glass-card news-card p-6\">\n <div class=\"flex justify-between items-center mb-4\">\n <span class=\"text-sm text-glow-blue font-medium\">2026.03.28</span>\n <span class=\"px-3 py-1 bg-glow-blue/20 text-glow-blue rounded-full text-xs font-medium\">\n AI+防御\n </span>\n </div>\n <h3 class=\"news-title text-xl font-bold mb-4 transition-colors duration-300\">\n AI空战算法在模拟对抗中胜率提升31%\n </h3>\n <p class=\"text-text-dim mb-6\">\n 基于深度强化学习的空战决策系统，在1v1、2v2复杂场景模拟中，相比传统算法展现出显著优势。\n </p>\n <a href=\"#\" class=\"text-glow-blue text-sm font-medium flex items-center\">\n 阅读更多 <i class=\"fas fa-external-link-alt ml-2\"></i>\n </a>\n </div>\n </div>\n </div>\n </section>\n \n \n <section id=\"contact\" class=\"py-20 px-6 bg-black/30\">\n <div class=\"max-w-7xl mx-auto\">\n \n <div class=\"mb-20\">\n <h2 class=\"text-3xl font-bold mb-12 text-center text-glow-blue\">战略合作伙伴</h2>\n <div class=\"grid grid-cols-2 md:grid-cols-4 lg:grid-cols-6 gap-8\">\n <div class=\"partner-logo flex items-center justify-center h-20\">\n <i class=\"fas fa-industry text-4xl text-metal-silver opacity-70\"></i>\n </div>\n <div class=\"partner-logo flex items-center justify-center h-20\">\n <i class=\"fas fa-jet-fighter-up text-4xl text-metal-silver opacity-70\"></i>\n </div>\n <div class=\"partner-logo flex items-center justify-center h-20\">\n <i class=\"fas fa-satellite text-4xl text-metal-silver opacity-70\"></i>\n </div>\n <div class=\"partner-logo flex items-center justify-center h-20\">\n <i class=\"fas fa-microchip text-4xl text-metal-silver opacity-70\"></i>\n </div>\n <div class=\"partner-logo flex items-center justify-center h-20\">\n <i class=\"fas fa-shield-heart text-4xl text-metal-silver opacity-70\"></i>\n </div>\n <div class=\"partner-logo flex items-center justify-center h-20\">\n <i class=\"fas fa-globe-europe text-4xl text-metal-silver opacity-70\"></i>\n </div>\n </div>\n </div>\n \n \n <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-12\">\n \n <div>\n <h2 class=\"text-3xl font-bold mb-8 text-glow-blue\">联系专家团队</h2>\n <form id=\"contactForm\" class=\"space-y-6\">\n <div>\n <label for=\"name\" class=\"block text-metal-silver mb-2\">姓名 *</label>\n <input type=\"text\" id=\"name\" required class=\"w-full px-4 py-3 bg-card-bg border border-card-border rounded-lg text-white focus:outline-none focus:border-glow-blue transition-colors duration-300\">\n </div>\n <div>\n <label for=\"email\" class=\"block text-metal-silver mb-2\">邮箱 *</label>\n <input type=\"email\" id=\"email\" required class=\"w-full px-4 py-3 bg-card-bg border border-card-border rounded-lg text-white focus:outline-none focus:border-glow-blue transition-colors duration-300\">\n </div>\n <div>\n <label for=\"subject\" class=\"block text-metal-silver mb-2\">信息主题 *</label>\n <select id=\"subject\" required class=\"w-full px-4 py-3 bg-card-bg border border-card-border rounded-lg text-white focus:outline-none focus:border-glow-blue transition-colors duration-300\">\n <option value=\"\">选择咨询类型</option>\n <option value=\"technology\">技术合作</option>\n <option value=\"project\">项目咨询</option>\n <option value=\"partnership\">合作伙伴</option>\n <option value=\"other\">其他</option>\n </select>\n </div>\n <div>\n <label for=\"message\" class=\"block text-metal-silver mb-2\">详细信息</label>\n <textarea id=\"message\" rows=\"4\" class=\"w-full px-4 py-3 bg-card-bg border border-card-border rounded-lg text-white focus:outline-none focus:border-glow-blue transition-colors duration-300\"></textarea>\n </div>\n <button type=\"submit\" class=\"btn-neon w-full\">\n 发送信息\n </button>\n </form>\n </div>\n \n \n <div>\n <h2 class=\"text-3xl font-bold mb-8 text-glow-blue\">联系我们</h2>\n <div class=\"space-y-6\">\n <div class=\"flex items-start\">\n <div class=\"w-12 h-12 rounded-full bg-glow-blue/20 flex items-center justify-center mr-4\">\n <i class=\"fas fa-envelope text-glow-blue\"></i>\n </div>\n <div>\n <h3 class=\"text-xl font-bold mb-1\">邮箱</h3>\n <p class=\"text-metal-silver\">contact@defencetech.com</p>\n </div>\n </div>\n <div class=\"flex items-start\">\n <div class=\"w-12 h-12 rounded-full bg-glow-blue/20 flex items-center justify-center mr-4\">\n <i class=\"fas fa-phone text-glow-blue\"></i>\n </div>\n <div>\n <h3 class=\"text-xl font-bold mb-1\">电话</h3>\n <p class=\"text-metal-silver\">+86 (10) 1234 5678</p>\n </div>\n </div>\n <div class=\"flex items-start\">\n <div class=\"w-12 h-12 rounded-full bg-glow-blue/20 flex items-center justify-center mr-4\">\n <i class=\"fas fa-map-marker-alt text-glow-blue\"></i>\n </div>\n <div>\n <h3 class=\"text-xl font-bold mb-1\">地址</h3>\n <p class=\"text-metal-silver\">未来科学城国防科技园，北京，中国</p>\n </div>\n </div>\n </div>\n \n <div class=\"mt-12 p-6 glass-card\">\n <h3 class=\"text-xl font-bold mb-4 text-glow-blue\">安全须知</h3>\n <p class=\"text-text-dim\">\n 所有通信均采用端到端加密。为确保信息安全，请勿在未加密渠道发送敏感信息。\n </p>\n <div class=\"mt-4 flex items-center\">\n <i class=\"fas fa-lock text-glow-blue mr-2\"></i>\n <span class=\"text-sm text-metal-silver\">传输已加密 · 认证连接</span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </section>\n \n \n <footer class=\"py-8 px-6 border-t border-card-border\">\n <div class=\"max-w-7xl mx-auto\">\n <div class=\"flex flex-col md:flex-row justify-between items-center\">\n <div class=\"mb-6 md:mb-0\">\n <div class=\"flex items-center mb-4\">\n <div class=\"w-8 h-8 rounded-full bg-gradient-to-br from-glow-blue to-glow-purple mr-3 flex items-center justify-center\">\n <i class=\"fas fa-satellite text-white text-sm\"></i>\n </div>\n <span class=\"text-lg font-bold text-white\">DEFENSE<span class=\"text-glow-blue\">TECH</span></span>\n </div>\n <p class=\"text-text-dim text-sm\">© 2026 国防科技研究院. 保留所有权利.</p>\n </div>\n <div class=\"flex space-x-6\">\n <a href=\"#\" class=\"text-text-dim hover:text-glow-blue transition-colors duration-300 text-sm\">隐私政策</a>\n <a href=\"#\" class=\"text-text-dim hover:text-glow-blue transition-colors duration-300 text-sm\">使用条款</a>\n <a href=\"#\" class=\"text-text-dim hover:text-glow-blue transition-colors duration-300 text-sm\">安全声明</a>\n <a href=\"#\" class=\"text-text-dim hover:text-glow-blue transition-colors duration-300 text-sm\">网站地图</a>\n </div>\n </div>\n </div>\n </footer>\n \n \n <div id=\"successModal\" class=\"fixed inset-0 bg-black/80 flex items-center justify-center z-50 hidden\">\n <div class=\"glass-card p-8 max-w-md mx-4 text-center\">\n <div class=\"w-20 h-20 rounded-full bg-gradient-to-br from-glow-blue to-glow-purple flex items-center justify-center mx-auto mb-6\">\n <i class=\"fas fa-check text-3xl text-white\"></i>\n </div>\n <h3 class=\"text-2xl font-bold mb-4 text-glow-blue\">信息已发送</h3>\n <p class=\"text-metal-silver mb-6\">\n 感谢您的联系。我们的专家团队将在24小时内回复您。所有通信均采用加密传输。\n </p>\n <button id=\"closeModal\" class=\"btn-outline px-8\">确认</button>\n </div>\n </div>\n \n <script>\n // Wait for page to load\n window.addEventListener('load', function() {\n // Hide loading overlay\n setTimeout(function() {\n document.getElementById('loadingOverlay').style.opacity = '0';\n setTimeout(function() {\n document.getElementById('loadingOverlay').style.display = 'none';\n }, 500);\n }, 1500);\n \n // Navbar scroll effect\n window.addEventListener('scroll', function() {\n const navbar = document.getElementById('navbar');\n if (window.scrollY > 50) {\n navbar.classList.add('nav-scrolled');\n } else {\n navbar.classList.remove('nav-scrolled');\n }\n });\n \n // Mobile menu toggle\n const mobileMenuButton = document.getElementById('mobileMenuButton');\n const closeMenuButton = document.getElementById('closeMenuButton');\n const mobileMenu = document.getElementById('mobileMenu');\n \n mobileMenuButton.addEventListener('click', function() {\n mobileMenu.classList.add('open');\n });\n \n closeMenuButton.addEventListener('click', function() {\n mobileMenu.classList.remove('open');\n });\n \n // Close mobile menu when clicking on a link\n const mobileLinks = document.querySelectorAll('#mobileMenu a');\n mobileLinks.forEach(link => {\n link.addEventListener('click', function() {\n mobileMenu.classList.remove('open');\n });\n });\n \n // Smooth scrolling for anchor links\n document.querySelectorAll('a[href^=\"#\"]').forEach(anchor => {\n anchor.addEventListener('click', function(e) {\n if (this.getAttribute('href') === '#') return;\n \n e.preventDefault();\n const targetId = this.getAttribute('href');\n const targetElement = document.querySelector(targetId);\n \n if (targetElement) {\n window.scrollTo({\n top: targetElement.offsetTop - 80,\n behavior: 'smooth'\n });\n }\n });\n });\n \n // Contact form submission\n const contactForm = document.getElementById('contactForm');\n const successModal = document.getElementById('successModal');\n const closeModal = document.getElementById('closeModal');\n \n contactForm.addEventListener('submit', function(e) {\n e.preventDefault();\n \n // Show success modal\n successModal.classList.remove('hidden');\n \n // Reset form\n contactForm.reset();\n });\n \n closeModal.addEventListener('click', function() {\n successModal.classList.add('hidden');\n });\n \n // Close modal when clicking outside\n successModal.addEventListener('click', function(e) {\n if (e.target === successModal) {\n successModal.classList.add('hidden');\n }\n });\n \n // Add hover effect to capability cards\n const capabilityCards = document.querySelectorAll('.capability-card');\n capabilityCards.forEach(card => {\n card.addEventListener('mouseenter', function() {\n this.style.transform = 'translateY(-8px)';\n });\n \n card.addEventListener('mouseleave', function() {\n this.style.transform = 'translateY(0)';\n });\n });\n \n // Animate elements on scroll (simple version)\n function animateOnScroll() {\n const elements = document.querySelectorAll('.glass-card, h2, .btn-neon');\n \n elements.forEach(element => {\n const elementTop = element.getBoundingClientRect().top;\n const windowHeight = window.innerHeight;\n \n if (elementTop < windowHeight - 100) {\n element.style.opacity = '1';\n element.style.transform = 'translateY(0)';\n }\n });\n }\n \n // Set initial state for animation\n document.querySelectorAll('.glass-card, h2, .btn-neon').forEach(el => {\n el.style.opacity = '0';\n el.style.transform = 'translateY(20px)';\n el.style.transition = 'opacity 0.6s ease, transform 0.6s ease';\n });\n \n // Trigger animation on load and scroll\n setTimeout(animateOnScroll, 500);\n window.addEventListener('scroll', animateOnScroll);\n });\n </script>\n</body>\n</html>"},
"next": ["添加3D地球可视化", "集成实时数据仪表板", "增加多语言支持", "优化移动端性能", "添加视频展示功能"],
"breakpoint": "none"
}```

total_tokens

48522

summary

已将所有字体更新为JetBrains Mono，保持了国防科技网站的深色主题与科技感设计，同时提升了代码等宽字体的专业感。修改了Google Fonts链接和所有字体定义，确保标题和正文都使用JetBrains Mono字体。

uiParsing

关闭