Spaces:
Running
Running
| <html lang="zh-CN"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>DeepShape - AI 口腔修复体设计专家</title> | |
| <link rel="icon" type="image/x-icon" href="/static/favicon.ico"> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script src="https://unpkg.com/feather-icons"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.globe.min.js"></script> | |
| <script> | |
| tailwind.config = { | |
| theme: { | |
| extend: { | |
| colors: { | |
| 'primary': '#2563eb', // 科技蓝 | |
| 'secondary': '#10b981' // 活力绿 | |
| } | |
| } | |
| } | |
| } | |
| </script> | |
| <style> | |
| @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap'); | |
| body { font-family: 'Inter', sans-serif; } | |
| .gradient-bg { background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%); } | |
| .product-card { transition: transform 0.3s ease, box-shadow 0.3s ease; } | |
| .product-card:hover { transform: translateY(-5px); box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); } | |
| .feature-icon { width: 64px; height: 64px; background: linear-gradient(135deg, #3b82f6, #60a5fa); } | |
| .vanta-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; } | |
| </style> | |
| </head> | |
| <body class="bg-white text-gray-800"> | |
| <!-- 导航栏 --> | |
| <nav class="fixed w-full bg-white/90 backdrop-blur-md z-50 shadow-sm"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="flex justify-between items-center h-16"> | |
| <div class="flex items-center"> | |
| <span class="text-2xl font-bold text-primary">DeepShape</span> | |
| </div> | |
| <div class="hidden md:flex items-center space-x-8"> | |
| <a href="#products" class="text-gray-600 hover:text-primary transition">产品</a> | |
| <a href="#technology" class="text-gray-600 hover:text-primary transition">技术优势</a> | |
| <a href="#cases" class="text-gray-600 hover:text-primary transition">应用场景</a> | |
| <a href="#partners" class="text-gray-600 hover:text-primary transition">合作</a> | |
| <a href="#contact" class="bg-primary text-white px-4 py-2 rounded-lg hover:bg-blue-600 transition">联系我们</a> | |
| </div> | |
| <div class="md:hidden"> | |
| <button id="menu-btn" class="text-gray-600"> | |
| <i data-feather="menu"></i> | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- 移动端菜单 --> | |
| <div id="mobile-menu" class="hidden md:hidden bg-white border-t"> | |
| <div class="px-2 pt-2 pb-3 space-y-1"> | |
| <a href="#products" class="block px-3 py-2 text-gray-600 hover:text-primary">产品</a> | |
| <a href="#technology" class="block px-3 py-2 text-gray-600 hover:text-primary">技术优势</a> | |
| <a href="#cases" class="block px-3 py-2 text-gray-600 hover:text-primary">应用场景</a> | |
| <a href="#partners" class="block px-3 py-2 text-gray-600 hover:text-primary">合作</a> | |
| <a href="#contact" class="block px-3 py-2 bg-primary text-white rounded mx-3 text-center">联系我们</a> | |
| </div> | |
| </div> | |
| </nav> | |
| <!-- 头部横幅 --> | |
| <header class="relative gradient-bg pt-24 pb-20 overflow-hidden"> | |
| <div id="vanta-bg" class="vanta-bg"></div> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10"> | |
| <div class="text-center"> | |
| <h1 class="text-4xl md:text-6xl font-bold text-gray-900 mb-6">AI 驱动口腔修复设计新纪元</h1> | |
| <p class="text-xl md:text-2xl text-gray-600 mb-8 max-w-3xl mx-auto">DeepShape 深形智能，专注于人工智能技术在口腔修复体设计领域的创新应用，为牙科医生与技工所提供精准、高效、可靠的智能设计解决方案。</p> | |
| <div class="flex flex-col sm:flex-row gap-4 justify-center"> | |
| <a href="#products" class="bg-primary text-white px-8 py-3 rounded-lg font-medium hover:bg-blue-600 transition inline-flex items-center justify-center"> | |
| 探索产品 <i data-feather="arrow-right" class="ml-2 w-4 h-4"></i> | |
| </a> | |
| <a href="#contact" class="border border-primary text-primary px-8 py-3 rounded-lg font-medium hover:bg-blue-50 transition inline-flex items-center justify-center"> | |
| 预约演示 <i data-feather="calendar" class="ml-2 w-4 h-4"></i> | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| </header> | |
| <!-- 产品功能介绍区 --> | |
| <section id="products" class="py-20 bg-white"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl md:text-4xl font-bold text-gray-900 mb-4">核心产品</h2> | |
| <p class="text-xl text-gray-600 max-w-3xl mx-auto">两款强大的 AI 工具，重塑口腔修复体设计的工作流程</p> | |
| </div> | |
| <div class="grid md:grid-cols-2 gap-12"> | |
| <!-- 产品 1 --> | |
| <div class="product-card bg-gradient-to-br from-blue-50 to-indigo-50 rounded-2xl p-8"> | |
| <div class="flex items-center mb-6"> | |
| <div class="feature-icon rounded-xl flex items-center justify-center mr-4"> | |
| <i data-feather="edit-3" class="text-white w-8 h-8"></i> | |
| </div> | |
| <h3 class="text-2xl font-bold text-gray-900">AI 口腔修复体设计工具</h3> | |
| </div> | |
| <p class="text-gray-600 mb-6">基于深度学习算法，自动生成高精度、个性化的口腔修复体3D模型。大幅缩短设计时间，提升设计质量与一致性。</p> | |
| <ul class="space-y-3 mb-6"> | |
| <li class="flex items-center text-gray-700"><i data-feather="check" class="text-secondary mr-2 w-4 h-4"></i> 智能识别牙体预备形态</li> | |
| <li class="flex items-center text-gray-700"><i data-feather="check" class="text-secondary mr-2 w-4 h-4"></i> 自动生成符合生物力学的最优形态</li> | |
| <li class="flex items-center text-gray-700"><i data-feather="check" class="text-secondary mr-2 w-4 h-4"></i> 支持全冠、桥体、贴面等多种修复类型</li> | |
| <li class="flex items-center text-gray-700"><i data-feather="check" class="text-secondary mr-2 w-4 h-4"></i> 与主流CAD软件无缝集成</li> | |
| </ul> | |
| <a href="#" class="inline-flex items-center text-primary font-medium hover:text-blue-600"> | |
| 了解更多 <i data-feather="arrow-right" class="ml-1 w-4 h-4"></i> | |
| </a> | |
| </div> | |
| <!-- 产品 2 --> | |
| <div class="product-card bg-gradient-to-br from-green-50 to-emerald-50 rounded-2xl p-8"> | |
| <div class="flex items-center mb-6"> | |
| <div class="feature-icon rounded-xl flex items-center justify-center mr-4" style="background: linear-gradient(135deg, #10b981, #34d399);"> | |
| <i data-feather="bar-chart-2" class="text-white w-8 h-8"></i> | |
| </div> | |
| <h3 class="text-2xl font-bold text-gray-900">AI 修复体设计分析工具</h3> | |
| </div> | |
| <p class="text-gray-600 mb-6">对设计完成的修复体进行全方位的智能分析评估，预测其长期临床表现，为医生提供数据驱动的决策支持。</p> | |
| <ul class="space-y-3 mb-6"> | |
| <li class="flex items-center text-gray-700"><i data-feather="check" class="text-secondary mr-2 w-4 h-4"></i> 咬合接触点分析与优化建议</li> | |
| <li class="flex items-center text-gray-700"><i data-feather="check" class="text-secondary mr-2 w-4 h-4"></i> 边缘密合度自动检测与评分</li> | |
| <li class="flex items-center text-gray-700"><i data-feather="check" class="text-secondary mr-2 w-4 h-4"></i> 应力分布模拟与薄弱点预警</li> | |
| <li class="flex items-center text-gray-700"><i data-feather="check" class="text-secondary mr-2 w-4 h-4"></i> 美学效果可视化评估</li> | |
| </ul> | |
| <a href="#" class="inline-flex items-center text-primary font-medium hover:text-blue-600"> | |
| 了解更多 <i data-feather="arrow-right" class="ml-1 w-4 h-4"></i> | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- 技术优势展示 --> | |
| <section id="technology" class="py-20 bg-gray-50"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl md:text-4xl font-bold text-gray-900 mb-4">技术优势</h2> | |
| <p class="text-xl text-gray-600 max-w-3xl mx-auto">融合前沿 AI 技术与口腔医学专业知识</p> | |
| </div> | |
| <div class="grid md:grid-cols-3 gap-8"> | |
| <div class="text-center p-6"> | |
| <div class="bg-primary/10 w-20 h-20 rounded-full flex items-center justify-center mx-auto mb-4"> | |
| <i data-feather="cpu" class="text-primary w-10 h-10"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-2">强大算法引擎</h3> | |
| <p class="text-gray-600">基于数百万临床数据训练的深度学习模型，确保设计的精准性与可靠性。</p> | |
| </div> | |
| <div class="text-center p-6"> | |
| <div class="bg-primary/10 w-20 h-20 rounded-full flex items-center justify-center mx-auto mb-4"> | |
| <i data-feather="zap" class="text-primary w-10 h-10"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-2">极速处理</h3> | |
| <p class="text-gray-600">复杂修复体设计任务从数小时缩短至分钟级，显著提升工作效率。</p> | |
| </div> | |
| <div class="text-center p-6"> | |
| <div class="bg-primary/10 w-20 h-20 rounded-full flex items-center justify-center mx-auto mb-4"> | |
| <i data-feather="shield" class="text-primary w-10 h-10"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-2">安全合规</h3> | |
| <p class="text-gray-600">严格遵循医疗数据安全规范，通过多项国际标准认证。</p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- 用户案例或应用场景 --> | |
| <section id="cases" class="py-20 bg-white"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl md:text-4xl font-bold text-gray-900 mb-4">应用场景</h2> | |
| <p class="text-xl text-gray-600 max-w-3xl mx-auto">助力各类口腔医疗机构提升诊疗水平与运营效率</p> | |
| </div> | |
| <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8"> | |
| <div class="bg-gray-50 rounded-xl p-6"> | |
| <img src="http://static.photos/medical/320x240/1" alt="大型口腔医院" class="rounded-lg mb-4 w-full h-40 object-cover"> | |
| <h3 class="text-lg font-semibold mb-2">大型口腔医院</h3> | |
| <p class="text-gray-600 text-sm">处理高病例量，标准化设计流程，保证不同医生间设计质量的一致性。</p> | |
| </div> | |
| <div class="bg-gray-50 rounded-xl p-6"> | |
| <img src="http://static.photos/workspace/320x240/2" alt="私立诊所" class="rounded-lg mb-4 w-full h-40 object-cover"> | |
| <h3 class="text-lg font-semibold mb-2">私立诊所</h3> | |
| <p class="text-gray-600 text-sm">无需雇佣专职技工，降低运营成本，为患者提供高品质的修复体。</p> | |
| </div> | |
| <div class="bg-gray-50 rounded-xl p-6"> | |
| <img src="http://static.photos/industry/320x240/3" alt="义齿加工所" class="rounded-lg mb-4 w-full h-40 object-cover"> | |
| <h3 class="text-lg font-semibold mb-2">义齿加工所</h3> | |
| <p class="text-gray-600 text-sm">应对技工人才短缺，提升产能与设计精度，承接更多复杂订单。</p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- 技术支持与合作信息 --> | |
| <section id="partners" class="py-20 bg-gray-50"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl md:text-4xl font-bold text-gray-900 mb-4">技术合作</h2> | |
| <p class="text-xl text-gray-600 max-w-3xl mx-auto">与行业领导者共同推动口腔数字化发展</p> | |
| </div> | |
| <div class="flex flex-wrap justify-center items-center gap-12 mb-12 opacity-60"> | |
| <!-- 合作伙伴Logo占位 --> | |
| <div class="bg-white p-4 rounded-lg shadow-sm">合作伙伴A</div> | |
| <div class="bg-white p-4 rounded-lg shadow-sm">合作伙伴B</div> | |
| <div class="bg-white p-4 rounded-lg shadow-sm">合作伙伴C</div> | |
| <div class="bg-white p-4 rounded-lg shadow-sm">合作伙伴D</div> | |
| </div> | |
| <div class="text-center"> | |
| <p class="text-gray-600 mb-6">我们提供全面的技术支持，包括 API 接口、定制化开发与专业技术培训。</p> | |
| <a href="#contact" class="bg-primary text-white px-6 py-3 rounded-lg font-medium hover:bg-blue-600 transition inline-flex items-center"> | |
| 成为合作伙伴 <i data-feather="users" class="ml-2 w-4 h-4"></i> | |
| </a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- 联系与咨询入口 --> | |
| <section id="contact" class="py-20 bg-white"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="grid md:grid-cols-2 gap-12 items-center"> | |
| <div> | |
| <h2 class="text-3xl md:text-4xl font-bold text-gray-900 mb-4">开启智能口腔设计之旅</h2> | |
| <p class="text-xl text-gray-600 mb-8">我们的专家团队随时准备为您提供产品演示、技术咨询与定制化解决方案。</p> | |
| <div class="space-y-4"> | |
| <div class="flex items-center"> | |
| <i data-feather="mail" class="text-primary mr-3"></i> | |
| <span>contact@deepshape.ai</span> | |
| </div> | |
| <div class="flex items-center"> | |
| <i data-feather="phone" class="text-primary mr-3"></i> | |
| <span>400-888-XXXX</span> | |
| </div> | |
| <div class="flex items-center"> | |
| <i data-feather="map-pin" class="text-primary mr-3"></i> | |
| <span>上海市浦东新区张江科学城</span> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="bg-gray-50 rounded-xl p-8"> | |
| <h3 | |
| </body> | |
| </html> |