市场夺宝奇兵
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

654 lines
30 KiB

3 months ago
  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  7. <meta http-equiv="pragma" content="no-cache">
  8. <meta http-equiv="cache-control" content="no-cache">
  9. <meta http-equiv="expires" content="0">
  10. <!-- 网站图标 -->
  11. <link rel="shortcut icon" href="dbqb_favicon.ico" />
  12. <link rel="bookmark" href="dbqb_favicon.ico" />
  13. <!-- SEO优化 -->
  14. <meta http-equiv="keywords" content="夺宝奇兵,homilychart,homilylink">
  15. <meta http-equiv="description" content="HomilyLink">
  16. <title>夺宝奇兵 - AI炒股时代,机构界的黑科技!</title>
  17. <!-- 引入第三方库 -->
  18. <script src="https://cdn.tailwindcss.com"></script>
  19. <script type="text/javascript" src="https://hc.homilychart.com/hc/210802/js/jquery-1.9.1.min.js"></script>
  20. <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
  21. <!-- Tailwind配置 -->
  22. <script>
  23. tailwind.config = {
  24. theme: {
  25. extend: {
  26. colors: {
  27. primary: '#3B82F6',
  28. secondary: '#10B981',
  29. accent: '#8B5CF6',
  30. dark: '#1E293B',
  31. light: '#F8FAFC'
  32. },
  33. fontFamily: {
  34. sans: ['Inter', 'system-ui', 'sans-serif'],
  35. },
  36. },
  37. }
  38. }
  39. </script>
  40. <script type="module" crossorigin src="/assets/index-zbKZ74xR.js"></script>
  41. </head>
  42. <body class="font-sans bg-light text-dark">
  43. <!-- 页面加载状态 -->
  44. <div id="loadingOverlay" class="loading-overlay">
  45. <div class="loading-spinner"></div>
  46. </div>
  47. <!-- 头部导航区域 -->
  48. <header class="fixed w-full bg-white/90 backdrop-blur-sm shadow-sm z-50 transition-all duration-300">
  49. <div class="container mx-auto px-4 py-3 flex justify-between items-center">
  50. <a href="#" class="flex items-center space-x-2">
  51. <div class="w-10 h-10 rounded-lg gradient-bg flex items-center justify-center">
  52. <img alt="夺宝奇兵" src="https://hc.homilychart.com/hc/250121/img/20230711171637.png"
  53. style="width: 40px;height: 40px;">
  54. </div>
  55. <span class="text-xl font-bold bg-clip-text text-transparent bg-gradient-to-r from-primary to-accent">
  56. 夺宝奇兵
  57. </span>
  58. </a>
  59. <!-- 桌面导航菜单 -->
  60. <nav class="hidden md:flex items-center space-x-8">
  61. <a href="#features" class="font-medium hover:text-primary transition-colors">特色功能</a>
  62. <a href="#kc" class="font-medium hover:text-primary transition-colors">最新课程</a>
  63. <a href="hcdbqb-guide.html" class="font-medium hover:text-primary transition-colors">操作指南</a>
  64. <a href="https://wa.me/+6588792879?text=夺宝奇兵指南我需要帮助" target="_blank"
  65. class="px-5 py-2 rounded-full gradient-bg text-white font-medium hover:shadow-lg transition-all">
  66. 联系我们
  67. </a>
  68. </nav>
  69. <!-- 移动端菜单按钮 -->
  70. <button id="menuBtn" class="md:hidden text-xl">
  71. <i class="fa fa-bars"></i>
  72. </button>
  73. </div>
  74. <!-- 移动端导航菜单 -->
  75. <div id="mobileMenu" class="md:hidden hidden bg-white border-t animate-fade-in">
  76. <div class="container mx-auto px-4 py-3 flex flex-col space-y-4">
  77. <a href="#features" class="font-medium py-2 hover:text-primary transition-colors">特色功能</a>
  78. <a href="#kc" class="font-medium py-2 hover:text-primary transition-colors">最新课程</a>
  79. <a href="hcdbqb-guide.html" class="font-medium py-2 hover:text-primary transition-colors">操作指南</a>
  80. <a href="https://wa.me/+6588792879?text=夺宝奇兵指南我需要帮助" target="_blank"
  81. class="py-2 rounded-full gradient-bg text-white font-medium text-center hover:shadow-lg transition-all">
  82. 联系我们
  83. </a>
  84. </div>
  85. </div>
  86. </header>
  87. <!-- 英雄区域 -->
  88. <section class="pt-32 pb-20 md:pt-40 md:pb-32 px-4 bg-gradient-to-b from-blue-50 to-white">
  89. <div class="container mx-auto max-w-6xl">
  90. <div class="flex flex-col md:flex-row items-center">
  91. <div class="md:w-1/2 mb-10 md:mb-0 animate-fade-in">
  92. <h1 class="text-[clamp(2rem,5vw,3.5rem)] font-bold leading-tight text-shadow-custom mb-6">
  93. 夺宝奇兵,<br>
  94. <span class="bg-clip-text text-transparent bg-gradient-to-r from-primary to-accent">现在免费体验!</span>
  95. </h1>
  96. <p class="text-lg text-gray-600 mb-8 max-w-lg">
  97. AI时代股票投资必备机构界的黑科技!<br />
  98. 现开放免费体验7天的活动,立刻注册报名吧!
  99. </p>
  100. <div class="flex flex-col sm:flex-row gap-4">
  101. <a href="#register"
  102. class="px-8 py-3 rounded-full gradient-bg text-white font-medium text-center hover:shadow-lg hover:shadow-primary/20 transition-all transform hover:-translate-y-0.5">
  103. 立即注册
  104. </a>
  105. <a href="#promotions"
  106. class="px-8 py-3 rounded-full border-2 border-primary text-primary font-medium text-center hover:bg-primary/5 transition-all">
  107. 了解更多
  108. </a>
  109. <a href="hcdbqb-download.html"
  110. class="px-8 py-3 rounded-full border-2 border-primary text-primary font-medium text-center hover:bg-primary/5 transition-all">
  111. 立刻下载
  112. </a>
  113. </div>
  114. </div>
  115. <div class="md:w-1/2 animate-fade-in delay-200">
  116. <div class="relative">
  117. <div class="absolute -inset-4 bg-gradient-to-r from-primary/20 to-accent/20 rounded-3xl blur-xl opacity-70">
  118. </div>
  119. <img src="https://hc.homilychart.com/hc/250121/img/dbqbindex.jpg" alt="夺宝奇兵"
  120. class="relative z-10 rounded-2xl shadow-xl w-full object-cover">
  121. </div>
  122. </div>
  123. </div>
  124. </div>
  125. </section>
  126. <!-- 特色功能区域 -->
  127. <section id="features" class="py-16 px-4 bg-white">
  128. <div class="container mx-auto max-w-6xl">
  129. <div class="text-center mb-16 animate-fade-in">
  130. <h2 class="text-[clamp(1.5rem,3vw,2.5rem)] font-bold mb-4">您可以免费体验什么?</h2>
  131. <p class="text-gray-600 max-w-2xl mx-auto">您可以免费体验 超级云脑 AI预测大模型 夺宝利剑三个模块 7天 </p>
  132. </div>
  133. <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
  134. <div class="bg-white p-8 rounded-2xl shadow-lg card-hover animate-fade-in delay-100">
  135. <div class="w-14 h-14 rounded-xl bg-blue-100 flex items-center justify-center mb-6">
  136. <img alt="夺宝奇兵" src="https://hc.homilychart.com/hc/250121/img/chaojiyunnao.png">
  137. </div>
  138. <h3 class="text-xl font-semibold mb-3">超级云脑</h3>
  139. <p class="text-gray-600">您的股票该体检了!<br />从十大维度,为您的股票进行全面体检!</p>
  140. </div>
  141. <div class="bg-white p-8 rounded-2xl shadow-lg card-hover animate-fade-in delay-200">
  142. <div class="w-14 h-14 rounded-xl bg-purple-100 flex items-center justify-center mb-6">
  143. <img alt="夺宝奇兵" src="https://hc.homilychart.com/hc/250121/img/AIyuce.png">
  144. </div>
  145. <h3 class="text-xl font-semibold mb-3">AI预测大模型</h3>
  146. <p class="text-gray-600">采用最先进的安全技术,保护您的数据和隐私,让您高枕无忧地开展业务。</p>
  147. </div>
  148. <div class="bg-white p-8 rounded-2xl shadow-lg card-hover animate-fade-in delay-300">
  149. <div class="w-14 h-14 rounded-xl bg-green-100 flex items-center justify-center mb-6">
  150. <img alt="夺宝奇兵" src="https://hc.homilychart.com/hc/250121/img/duobaolijian.png">
  151. </div>
  152. <h3 class="text-xl font-semibold mb-3">夺宝利剑</h3>
  153. <p class="text-gray-600">根据您的具体需求提供个性化解决方案,灵活适应不同业务场景和规模。</p>
  154. </div>
  155. </div>
  156. </div>
  157. </section>
  158. <!-- 产品宣传区域 -->
  159. <section id="promotions" class="py-20 px-4 bg-gray-50">
  160. <div class="container mx-auto max-w-6xl">
  161. <div class="text-center mb-16 animate-fade-in">
  162. <h2 class="text-[clamp(1.5rem,3vw,2.5rem)] font-bold mb-4">我们的创新解决方案</h2>
  163. <p class="text-gray-600 max-w-2xl mx-auto">探索我们的核心产品和服务,了解如何为您的业务创造价值</p>
  164. </div>
  165. <!-- 宣传项 1 - 超级云脑 -->
  166. <div class="bg-white rounded-3xl shadow-xl overflow-hidden mb-16 flex flex-col md:flex-row animate-fade-in">
  167. <div class="md:w-1/2">
  168. <img src="https://hc.homilychart.com/hc/250121/img/chaojiyunnaoimg.jpg" alt="智能数据分析平台"
  169. class="w-full h-full object-cover">
  170. </div>
  171. <div class="md:w-1/2 p-8 md:p-12 flex flex-col justify-center">
  172. <span class="inline-block px-4 py-1 rounded-full bg-blue-100 text-primary text-sm font-medium mb-4">
  173. HomilyLink > 夺宝奇兵 > 超级云脑
  174. </span>
  175. <h3 class="text-2xl md:text-3xl font-bold mb-4">超级云脑:股票体检专家</h3>
  176. <p class="text-gray-600 mb-6">
  177. 利用人工智能和机器学习技术,快速处理和分析海量数据,通过十大维度为您的股票进行专科体检,追踪机构行为。
  178. </p>
  179. <ul class="space-y-3 mb-8">
  180. <li class="flex items-start">
  181. <i class="fa fa-check-circle text-secondary mt-1 mr-3"></i>
  182. <span>云脑探秘</span>
  183. </li>
  184. <li class="flex items-start">
  185. <i class="fa fa-check-circle text-secondary mt-1 mr-3"></i>
  186. <span>机构动向</span>
  187. </li>
  188. <li class="flex items-start">
  189. <i class="fa fa-check-circle text-secondary mt-1 mr-3"></i>
  190. <span>体检专家</span>
  191. </li>
  192. </ul>
  193. <a href="#register" class="inline-flex items-center text-primary font-medium hover:underline">
  194. 注册了解更多 <i class="fa fa-arrow-right ml-2"></i>
  195. </a>
  196. </div>
  197. </div>
  198. <!-- 宣传项 2 - AI预测大模型 -->
  199. <div
  200. class="bg-white rounded-3xl shadow-xl overflow-hidden mb-16 flex flex-col md:flex-row-reverse animate-fade-in delay-100">
  201. <div class="md:w-1/2">
  202. <img src="https://hc.homilychart.com/hc/250121/img/aiyucedamoxing.jpg" alt="AI预测大模型"
  203. class="w-full h-full object-cover">
  204. </div>
  205. <div class="md:w-1/2 p-8 md:p-12 flex flex-col justify-center">
  206. <span class="inline-block px-4 py-1 rounded-full bg-purple-100 text-accent text-sm font-medium mb-4">
  207. HomilyLink > 夺宝奇兵 > AI预测大模型
  208. </span>
  209. <h3 class="text-2xl md:text-3xl font-bold mb-4">AI预测大模型</h3>
  210. <p class="text-gray-600 mb-6">
  211. AI 预测大模型颠覆传统,以深度学习与算法挖股市数据抓趋势、预测高低点;AI时空共振结合前沿 AI与时空共振精准识别变盘点。
  212. </p>
  213. <ul class="space-y-3 mb-8">
  214. <li class="flex items-start">
  215. <i class="fa fa-check-circle text-secondary mt-1 mr-3"></i>
  216. <span>AI股价预测术</span>
  217. </li>
  218. <li class="flex items-start">
  219. <i class="fa fa-check-circle text-secondary mt-1 mr-3"></i>
  220. <span>AI时空共振</span>
  221. </li>
  222. <li class="flex items-start">
  223. <i class="fa fa-check-circle text-secondary mt-1 mr-3"></i>
  224. <span>未来预测</span>
  225. </li>
  226. </ul>
  227. <a href="#register" class="inline-flex items-center text-primary font-medium hover:underline">
  228. 注册了解更多 <i class="fa fa-arrow-right ml-2"></i>
  229. </a>
  230. </div>
  231. </div>
  232. <!-- 宣传项 3 - 夺宝利剑 -->
  233. <div
  234. class="bg-white rounded-3xl shadow-xl overflow-hidden mb-16 flex flex-col md:flex-row-reverse animate-fade-in delay-100">
  235. <div class="md:w-1/2">
  236. <img src="https://hc.homilychart.com/hc/250121/img/duobaolijianindex.jpg" alt="夺宝利剑"
  237. class="w-full h-full object-cover">
  238. </div>
  239. <div class="md:w-1/2 p-8 md:p-12 flex flex-col justify-center">
  240. <span class="inline-block px-4 py-1 rounded-full bg-purple-100 text-accent text-sm font-medium mb-4">
  241. HomilyLink > 夺宝奇兵 > Ai金牛 > 夺宝利剑
  242. </span>
  243. <h3 class="text-2xl md:text-3xl font-bold mb-4">夺宝利剑</h3>
  244. <p class="text-gray-600 mb-6">
  245. 最聪明的AI智能均线结合三维波动量,让您在AI时代深度追踪机构的操盘行为!
  246. </p>
  247. <ul class="space-y-3 mb-8">
  248. <li class="flex items-start">
  249. <i class="fa fa-check-circle text-secondary mt-1 mr-3"></i>
  250. <span>最聪明的AI智能均线</span>
  251. </li>
  252. <li class="flex items-start">
  253. <i class="fa fa-check-circle text-secondary mt-1 mr-3"></i>
  254. <span>三维波动量</span>
  255. </li>
  256. <li class="flex items-start">
  257. <i class="fa fa-check-circle text-secondary mt-1 mr-3"></i>
  258. <span>AI大数据模型</span>
  259. </li>
  260. </ul>
  261. <a href="#register" class="inline-flex items-center text-primary font-medium hover:underline">
  262. 注册了解更多 <i class="fa fa-arrow-right ml-2"></i>
  263. </a>
  264. </div>
  265. </div>
  266. <!-- 宣传项 4 - 专题讲座 -->
  267. <div id="kc"
  268. class="bg-white rounded-3xl shadow-xl overflow-hidden flex flex-col md:flex-row animate-fade-in delay-200">
  269. <div class="md:w-1/2">
  270. <img src="https://hc.homilychart.com/hc/250121/img/kecheng.jpg" alt="John Lu谈股专题讲座"
  271. class="w-full h-full object-cover">
  272. </div>
  273. <div class="md:w-1/2 p-8 md:p-12 flex flex-col justify-center">
  274. <span class="inline-block px-4 py-1 rounded-full bg-green-100 text-secondary text-sm font-medium mb-4">
  275. HomilyLink > 消息 > John Lu谈股财富圈
  276. </span>
  277. <h3 class="text-2xl md:text-3xl font-bold mb-4">HomilyLink专题讲座</h3>
  278. <p class="text-gray-600 mb-6">
  279. 我们推出 HomilyLink专题讲座;结合市场事实热点与机构领域黑科技 "夺宝奇兵",助力投资者提升股市获利能力。
  280. </p>
  281. <ul class="space-y-3 mb-8">
  282. <li class="flex items-start">
  283. <i class="fa fa-check-circle text-secondary mt-1 mr-3"></i>
  284. <span>新加坡时间</span>
  285. </li>
  286. <li class="flex items-start">
  287. <i class="fa fa-check-circle text-secondary mt-1 mr-3"></i>
  288. <span>注意换算当地时间</span>
  289. </li>
  290. <li class="flex items-start">
  291. <i class="fa fa-check-circle text-secondary mt-1 mr-3"></i>
  292. <span>HomilyLink班级群课程</span>
  293. </li>
  294. </ul>
  295. <a href="#register" class="inline-flex items-center text-primary font-medium hover:underline">
  296. 注册了解更多 <i class="fa fa-arrow-right ml-2"></i>
  297. </a>
  298. </div>
  299. </div>
  300. </div>
  301. </section>
  302. <!-- 注册表单区域 -->
  303. <section id="register" class="py-20 px-4 bg-white">
  304. <div class="container mx-auto max-w-6xl">
  305. <div class="bg-gradient-to-br from-dark to-gray-800 rounded-3xl shadow-2xl overflow-hidden">
  306. <div class="grid grid-cols-1 md:grid-cols-2">
  307. <div class="p-8 md:p-12 text-white flex flex-col justify-center">
  308. <h2 class="text-2xl md:text-3xl font-bold mb-4">立即注册,开启智能体验之旅!</h2>
  309. <p class="text-gray-300 mb-8">
  310. 填写报名表,我们会尽快为您开启智能体验之旅!
  311. </p>
  312. <div class="space-y-6">
  313. <div class="flex items-start">
  314. <div class="w-10 h-10 rounded-full bg-primary/20 flex items-center justify-center mr-4 mt-1">
  315. <img alt="超级云脑" src="https://hc.homilychart.com/hc/250121/img/chaojiyunnao.png">
  316. </div>
  317. <div>
  318. <h3 class="font-semibold mb-1">超级云脑</h3>
  319. <p class="text-gray-400 text-sm">您的股票体检专家!</p>
  320. </div>
  321. </div>
  322. <div class="flex items-start">
  323. <div class="w-10 h-10 rounded-full bg-primary/20 flex items-center justify-center mr-4 mt-1">
  324. <img alt="AI预测大模型" src="https://hc.homilychart.com/hc/250121/img/AIyuce.png">
  325. </div>
  326. <div>
  327. <h3 class="font-semibold mb-1">AI预测大模型</h3>
  328. <p class="text-gray-400 text-sm">时间空间价格AI精准预测!</p>
  329. </div>
  330. </div>
  331. <div class="flex items-start">
  332. <div class="w-10 h-10 rounded-full bg-primary/20 flex items-center justify-center mr-4 mt-1">
  333. <img alt="夺宝利剑" src="https://hc.homilychart.com/hc/250121/img/duobaolijian.png">
  334. </div>
  335. <div>
  336. <h3 class="font-semibold mb-1">夺宝利剑</h3>
  337. <p class="text-gray-400 text-sm">最聪明的AI智能均线+三维波动量</p>
  338. </div>
  339. </div>
  340. </div>
  341. </div>
  342. <div class="bg-white p-8 md:p-12">
  343. <form id="registrationForm" class="space-y-6">
  344. <input type="hidden" name="zbtype" id="zbType" value="6">
  345. <div>
  346. <label for="userNameInfo" class="block text-sm font-medium text-gray-700 mb-1">姓名</label>
  347. <input type="text" id="userNameInfo" name="userNameInfo"
  348. class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:ring-2 focus:ring-primary focus:border-primary transition-all"
  349. placeholder="请输入您的姓名" required>
  350. </div>
  351. <div>
  352. <label for="countryInfo" class="block text-sm font-medium text-gray-700 mb-1">国家/地区代码</label>
  353. <select id="countryInfo" name="countryInfo"
  354. class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:ring-2 focus:ring-primary focus:border-primary transition-all"
  355. required>
  356. <option value="+65">+65 新加坡</option>
  357. <option value="+60">+60 马来西亚</option>
  358. <option value="+852">+852 香港</option>
  359. <option value="+1" selected>+1 美国</option>
  360. <option value="+62">+62 印尼</option>
  361. <option value="+1">+1 加拿大</option>
  362. <option value="+61">+61 澳大利亚</option>
  363. <option value="+673">+673 文莱</option>
  364. <option value="+886">+886 台湾</option>
  365. <option value="+86">+86 中国</option>
  366. <option value="+0">+0 其他</option>
  367. <option value="+64">+64 新西兰</option>
  368. <option value="+44">+44 英国</option>
  369. <option value="+81">+81 日本</option>
  370. <option value="+49">+49 德国</option>
  371. <option value="+82">+82 韩国</option>
  372. <option value="+84">+84 越南</option>
  373. <option value="+971">+971 阿联酋</option>
  374. <option value="+45">+45 丹麦</option>
  375. <option value="+853">+853 澳门</option>
  376. <option value="+66">+66 泰国</option>
  377. <option value="+91">+91 印度</option>
  378. <option value="+41">+41 瑞士</option>
  379. <option value="+358">+358 芬兰</option>
  380. <option value="+33">+33 法国</option>
  381. <option value="+63">+63 菲律宾</option>
  382. <option value="+31">+31 荷兰</option>
  383. <option value="+46">+46 瑞典</option>
  384. <option value="+34">+34 西班牙</option>
  385. <option value="+54">+54 阿根廷</option>
  386. <option value="+39">+39 意大利</option>
  387. <option value="+7">+7 俄罗斯</option>
  388. <option value="+420">+420 捷克</option>
  389. </select>
  390. </div>
  391. <div>
  392. <label for="userMobile" class="block text-sm font-medium text-gray-700 mb-1">电话号码</label>
  393. <input type="tel" name="userMobile" id="userMobile" placeholder="纯手机号 ( 不含国家编号 )"
  394. onkeyup="value=value.replace(/[^\d]/g,'').replace(/^0/g,'')"
  395. class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:ring-2 focus:ring-primary focus:border-primary transition-all"
  396. autocomplete="off" required>
  397. </div>
  398. <div>
  399. <label for="userWechat" class="block text-sm font-medium text-gray-700 mb-1">微信ID</label>
  400. <input type="text" name="userWechat" id="userWechat" placeholder="微信ID ( 如没有WhatsApp )"
  401. autocomplete="off"
  402. class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:ring-2 focus:ring-primary focus:border-primary transition-all">
  403. </div>
  404. <div>
  405. <label for="userEmail" class="block text-sm font-medium text-gray-700 mb-1">电子邮箱</label>
  406. <input type="email" placeholder="请输入您的邮箱" name="userEmail" id="userEmail" autocomplete="off"
  407. class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:ring-2 focus:ring-primary focus:border-primary transition-all"
  408. required>
  409. </div>
  410. <div class="flex items-start">
  411. <input type="checkbox" id="agreement" name="agreement" class="mt-1 mr-2" required>
  412. <label for="agreement" class="text-sm text-gray-600">
  413. 我同意接收相关产品和服务的资讯
  414. </label>
  415. </div>
  416. <button type="submit" id="submitBtn"
  417. class="w-full py-3 px-6 rounded-lg gradient-bg text-white font-medium hover:shadow-lg hover:shadow-primary/20 transition-all transform hover:-translate-y-0.5">
  418. 提交注册
  419. </button>
  420. </form>
  421. </div>
  422. </div>
  423. </div>
  424. </div>
  425. </section>
  426. <!-- 页脚区域 -->
  427. <footer class="bg-dark text-white py-12 px-4">
  428. <div class="container mx-auto max-w-6xl">
  429. <div class="grid grid-cols-1 md:grid-cols-4 gap-8 mb-8">
  430. <div>
  431. <div class="flex items-center space-x-2 mb-6">
  432. <div class="w-10 h-10 rounded-lg gradient-bg flex items-center justify-center">
  433. <img alt="夺宝奇兵" src="https://hc.homilychart.com/hc/250121/img/20230711171637.png"
  434. style="width: 40px;height: 40px;">
  435. </div>
  436. <span class="text-xl font-bold">夺宝奇兵</span>
  437. </div>
  438. <p class="text-gray-400 mb-6">
  439. AI炒股时代 机构界的黑科技!
  440. </p>
  441. <div class="flex space-x-4">
  442. <a href="#"
  443. class="w-10 h-10 rounded-full bg-gray-800 flex items-center justify-center hover:bg-primary transition-colors">
  444. <i class="fa fa-facebook"></i>
  445. </a>
  446. <a href="#"
  447. class="w-10 h-10 rounded-full bg-gray-800 flex items-center justify-center hover:bg-primary transition-colors">
  448. <i class="fa fa-twitter"></i>
  449. </a>
  450. <a href="#"
  451. class="w-10 h-10 rounded-full bg-gray-800 flex items-center justify-center hover:bg-primary transition-colors">
  452. <i class="fa fa-linkedin"></i>
  453. </a>
  454. <a href="#"
  455. class="w-10 h-10 rounded-full bg-gray-800 flex items-center justify-center hover:bg-primary transition-colors">
  456. <i class="fa fa-instagram"></i>
  457. </a>
  458. </div>
  459. </div>
  460. <div>
  461. <h4 class="text-lg font-semibold mb-6">产品</h4>
  462. <ul class="space-y-3">
  463. <li><a href="https://wa.me/+6588792879?text=我要了解弘历云版软件" target="_blank"
  464. class="text-gray-400 hover:text-white transition-colors">弘历云版软件</a></li>
  465. <li><a href="https://wa.me/+6588792879?text=我要了解HomilyChart" target="_blank"
  466. class="text-gray-400 hover:text-white transition-colors">HomilyChart</a></li>
  467. <li><a href="https://wa.me/+6588792879?text=我要了解夺宝奇兵" target="_blank"
  468. class="text-gray-400 hover:text-white transition-colors">夺宝奇兵</a></li>
  469. <li><a href="https://wa.me/+6588792879?text=我要了解博股会员"
  470. class="text-gray-400 hover:text-white transition-colors">博股会员</a></li>
  471. <li><a href="https://wa.me/+6588792879?text=我要了解最新软件"
  472. class="text-gray-400 hover:text-white transition-colors">最新软件</a></li>
  473. </ul>
  474. </div>
  475. <div>
  476. <h4 class="text-lg font-semibold mb-6">公司</h4>
  477. <ul class="space-y-3">
  478. <li><a href="https://wa.me/+6588792879?text=我要咨询" target="_blank"
  479. class="text-gray-400 hover:text-white transition-colors">关于我们</a></li>
  480. <li><a href="https://wa.me/+6588792879?text=我要咨询" target="_blank"
  481. class="text-gray-400 hover:text-white transition-colors">团队介绍</a></li>
  482. <li><a href="https://wa.me/+6588792879?text=我要咨询" target="_blank"
  483. class="text-gray-400 hover:text-white transition-colors">联系我们</a></li>
  484. </ul>
  485. </div>
  486. <div>
  487. <h4 class="text-lg font-semibold mb-6">支持</h4>
  488. <ul class="space-y-3">
  489. <li><a href="hcdbqb-guide.html" class="text-gray-400 hover:text-white transition-colors">帮助中心</a></li>
  490. <li><a href="https://wa.me/+6588792879?text=我有问题" target="_blank"
  491. class="text-gray-400 hover:text-white transition-colors">常见问题</a></li>
  492. </ul>
  493. </div>
  494. </div>
  495. <div class="border-t border-gray-800 pt-8 flex flex-col md:flex-row justify-between items-center">
  496. <p class="text-gray-500 text-sm mb-4 md:mb-0">
  497. &copy; Copyright 2025.Capitalmaster Pte Ltd All Rights Reserved.
  498. </p>
  499. <div class="flex space-x-6">
  500. 如需帮助,请及时联系我们!
  501. </div>
  502. </div>
  503. </div>
  504. </footer>
  505. <!-- 表单提交成功提示模态框 -->
  506. <div id="successModal" class="fixed inset-0 bg-black/50 flex items-center justify-center z-50 hidden">
  507. <div class="bg-white rounded-2xl p-8 max-w-md w-full mx-4 transform transition-all relative">
  508. <!-- 关闭按钮 - 右上角叉号 -->
  509. <button id="closeModal" class="absolute top-4 right-4 text-gray-400 hover:text-gray-600 transition-colors">
  510. <i class="fa fa-times text-xl"></i>
  511. </button>
  512. <div class="text-center">
  513. <div class="w-16 h-16 rounded-full bg-green-100 flex items-center justify-center mx-auto mb-6">
  514. <i class="fa fa-check text-secondary text-2xl"></i>
  515. </div>
  516. <h3 class="text-xl font-bold mb-2">注册成功!</h3>
  517. <p class="text-gray-600 mb-6">感谢您的注册,我们的顾问将尽快与您联系。</p>
  518. <a href="https://wa.me/8615318705910?text=%E6%8A%A5%E5%90%8D%E8%AF%BE%E7%A8%8B" target="_blank"
  519. class="inline-block px-6 py-2 bg-primary text-white rounded-lg hover:bg-primary/90 transition-colors">
  520. 联系我们
  521. </a>
  522. </div>
  523. </div>
  524. </div>
  525. <!-- 整合后的脚本 -->
  526. <!-- 整合后的样式 -->
  527. <style>
  528. /* 全局动画定义 */
  529. @keyframes fadeIn {
  530. from {
  531. opacity: 0;
  532. transform: translateY(20px);
  533. }
  534. to {
  535. opacity: 1;
  536. transform: translateY(0);
  537. }
  538. }
  539. @keyframes spin {
  540. 0% {
  541. transform: rotate(0deg);
  542. }
  543. 100% {
  544. transform: rotate(360deg);
  545. }
  546. }
  547. /* 自定义样式 */
  548. .content-auto {
  549. content-visibility: auto;
  550. }
  551. .text-shadow-custom {
  552. text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  553. }
  554. .card-hover {
  555. transition: all 0.3s ease;
  556. }
  557. .card-hover:hover {
  558. box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  559. transform: translateY(-4px);
  560. }
  561. .gradient-bg {
  562. background: linear-gradient(135deg, #3B82F6 0%, #8B5CF6 100%);
  563. }
  564. /* 动画类 */
  565. .animate-fade-in {
  566. animation: fadeIn 0.6s ease-out forwards;
  567. }
  568. .delay-100 {
  569. animation-delay: 0.1s;
  570. }
  571. .delay-200 {
  572. animation-delay: 0.2s;
  573. }
  574. .delay-300 {
  575. animation-delay: 0.3s;
  576. }
  577. /* 平滑滚动 */
  578. html {
  579. scroll-behavior: smooth;
  580. }
  581. /* 加载状态样式 */
  582. .loading-overlay {
  583. display: none;
  584. position: fixed;
  585. top: 0;
  586. left: 0;
  587. width: 100%;
  588. height: 100%;
  589. background: rgba(0, 0, 0, 0.5);
  590. z-index: 9999;
  591. justify-content: center;
  592. align-items: center;
  593. }
  594. .loading-spinner {
  595. width: 50px;
  596. height: 50px;
  597. border: 5px solid #f3f3f3;
  598. border-top: 5px solid #3B82F6;
  599. border-radius: 50%;
  600. animation: spin 1s linear infinite;
  601. }
  602. </style>
  603. </body>
  604. </html>