Hugging Face's logo

Spaces:
tongxiaojun
/
the-star-foundation
Running

App Files Community
tongxiaojun commited on
Commit
9b82347
·
verified ·
1 Parent(s): fd91b85

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +6 -4
  2. index.html +1214 -19
  3. prompts.txt +1 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: The Star Foundation
3
- emoji: 🐠
4
  colorFrom: purple
5
- colorTo: red
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: the-star-foundation
3
+ emoji: 🐳
4
  colorFrom: purple
5
+ colorTo: purple
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,1214 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Star Foundation | Mining the Future of Intelligence</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');
11
+
12
+ body {
13
+ font-family: 'Space Grotesk', sans-serif;
14
+ background-color: #0a0e17;
15
+ color: #e0e0e0;
16
+ overflow-x: hidden;
17
+ }
18
+
19
+ .hero-bg {
20
+ background: radial-gradient(circle at 50% 50%, #0f172a 0%, #020617 100%);
21
+ }
22
+
23
+ .star-pattern {
24
+ background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%239C92AC' fill-opacity='0.1' fill-rule='evenodd'%3E%3Ccircle cx='3' cy='3' r='3'/%3E%3Ccircle cx='13' cy='13' r='3'/%3E%3C/g%3E%3C/svg%3E");
25
+ }
26
+
27
+ .nav-link {
28
+ position: relative;
29
+ }
30
+
31
+ .nav-link::after {
32
+ content: '';
33
+ position: absolute;
34
+ width: 0;
35
+ height: 2px;
36
+ bottom: -2px;
37
+ left: 0;
38
+ background-color: #3b82f6;
39
+ transition: width 0.3s ease;
40
+ }
41
+
42
+ .nav-link:hover::after {
43
+ width: 100%;
44
+ }
45
+
46
+ .mining-card {
47
+ transition: all 0.3s ease;
48
+ background: rgba(15, 23, 42, 0.7);
49
+ backdrop-filter: blur(10px);
50
+ border: 1px solid rgba(59, 130, 246, 0.2);
51
+ }
52
+
53
+ .mining-card:hover {
54
+ transform: translateY(-5px);
55
+ box-shadow: 0 10px 25px rgba(59, 130, 246, 0.3);
56
+ border-color: rgba(59, 130, 246, 0.5);
57
+ }
58
+
59
+ .gradient-text {
60
+ background: linear-gradient(90deg, #3b82f6, #8b5cf6);
61
+ -webkit-background-clip: text;
62
+ background-clip: text;
63
+ color: transparent;
64
+ }
65
+
66
+ .animated-star {
67
+ position: absolute;
68
+ width: 2px;
69
+ height: 2px;
70
+ background: white;
71
+ border-radius: 50%;
72
+ animation: twinkle 4s infinite;
73
+ }
74
+
75
+ @keyframes twinkle {
76
+ 0%, 100% { opacity: 0.2; }
77
+ 50% { opacity: 1; }
78
+ }
79
+
80
+ .parallax {
81
+ background-attachment: fixed;
82
+ background-position: center;
83
+ background-repeat: no-repeat;
84
+ background-size: cover;
85
+ }
86
+
87
+ .floating {
88
+ animation: floating 6s ease-in-out infinite;
89
+ }
90
+
91
+ @keyframes floating {
92
+ 0% { transform: translateY(0px); }
93
+ 50% { transform: translateY(-15px); }
94
+ 100% { transform: translateY(0px); }
95
+ }
96
+
97
+ .glow {
98
+ box-shadow: 0 0 20px rgba(59, 130, 246, 0.5);
99
+ }
100
+
101
+ .typewriter {
102
+ overflow: hidden;
103
+ border-right: 2px solid #3b82f6;
104
+ white-space: nowrap;
105
+ animation: typing 3.5s steps(40, end), blink-caret 0.75s step-end infinite;
106
+ }
107
+
108
+ @keyframes typing {
109
+ from { width: 0 }
110
+ to { width: 100% }
111
+ }
112
+
113
+ @keyframes blink-caret {
114
+ from, to { border-color: transparent }
115
+ 50% { border-color: #3b82f6 }
116
+ }
117
+ </style>
118
+ </head>
119
+ <body class="star-pattern">
120
+ <!-- Stars Background Animation -->
121
+ <div id="stars-container" class="fixed inset-0 overflow-hidden pointer-events-none z-0"></div>
122
+
123
+ <!-- Navigation -->
124
+ <nav class="fixed w-full z-50 bg-black bg-opacity-80 backdrop-filter backdrop-blur-lg border-b border-gray-800">
125
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
126
+ <div class="flex justify-between h-16">
127
+ <div class="flex items-center">
128
+ <div class="flex-shrink-0 flex items-center">
129
+ <div class="w-10 h-10 rounded-full bg-gradient-to-br from-blue-500 to-indigo-600 flex items-center justify-center text-white font-bold text-xl">
130
+ SF
131
+ </div>
132
+ <span class="ml-3 text-xl font-bold text-white hidden md:block">Star Foundation</span>
133
+ </div>
134
+ </div>
135
+ <div class="hidden md:ml-6 md:flex md:items-center md:space-x-8">
136
+ <a href="#home" class="nav-link text-white px-3 py-2 text-sm font-medium">Home</a>
137
+ <a href="#about" class="nav-link text-gray-300 hover:text-white px-3 py-2 text-sm font-medium">About</a>
138
+ <a href="#vision" class="nav-link text-gray-300 hover:text-white px-3 py-2 text-sm font-medium">Vision</a>
139
+ <a href="#mining" class="nav-link text-gray-300 hover:text-white px-3 py-2 text-sm font-medium">Space Mining</a>
140
+ <a href="#grants" class="nav-link text-gray-300 hover:text-white px-3 py-2 text-sm font-medium">Grants</a>
141
+ <a href="#discoveries" class="nav-link text-gray-300 hover:text-white px-3 py-2 text-sm font-medium">Discoveries</a>
142
+ <a href="#join" class="nav-link text-gray-300 hover:text-white px-3 py-2 text-sm font-medium">Join Us</a>
143
+ </div>
144
+ <div class="flex items-center md:hidden">
145
+ <button id="mobile-menu-button" class="text-gray-300 hover:text-white focus:outline-none">
146
+ <svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
147
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path>
148
+ </svg>
149
+ </button>
150
+ </div>
151
+ </div>
152
+ </div>
153
+
154
+ <!-- Mobile menu -->
155
+ <div id="mobile-menu" class="hidden md:hidden bg-gray-900">
156
+ <div class="px-2 pt-2 pb-3 space-y-1 sm:px-3">
157
+ <a href="#home" class="block px-3 py-2 text-base font-medium text-white">Home</a>
158
+ <a href="#about" class="block px-3 py-2 text-base font-medium text-gray-300 hover:text-white">About</a>
159
+ <a href="#vision" class="block px-3 py-2 text-base font-medium text-gray-300 hover:text-white">Vision</a>
160
+ <a href="#mining" class="block px-3 py-2 text-base font-medium text-gray-300 hover:text-white">Space Mining</a>
161
+ <a href="#grants" class="block px-3 py-2 text-base font-medium text-gray-300 hover:text-white">Grants</a>
162
+ <a href="#discoveries" class="block px-3 py-2 text-base font-medium text-gray-300 hover:text-white">Discoveries</a>
163
+ <a href="#join" class="block px-3 py-2 text-base font-medium text-gray-300 hover:text-white">Join Us</a>
164
+ </div>
165
+ </div>
166
+ </nav>
167
+
168
+ <!-- Hero Section -->
169
+ <section id="home" class="hero-bg min-h-screen flex items-center justify-center relative overflow-hidden pt-16">
170
+ <div class="absolute inset-0 z-10 flex items-center justify-center">
171
+ <div class="w-64 h-64 rounded-full bg-blue-500 opacity-20 filter blur-3xl"></div>
172
+ </div>
173
+
174
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-24 z-20 text-center">
175
+ <h1 class="text-4xl md:text-6xl font-bold text-white mb-6">
176
+ <span class="gradient-text">Mining the Future</span> of Intelligence
177
+ </h1>
178
+ <p class="text-xl md:text-2xl text-gray-300 mb-12 max-w-3xl mx-auto">
179
+ Extracting the universe's most precious resources: human intelligence and information.
180
+ </p>
181
+ <div class="flex flex-col sm:flex-row justify-center gap-4">
182
+ <a href="#mining" class="px-8 py-4 bg-gradient-to-r from-blue-600 to-indigo-600 text-white font-medium rounded-lg hover:from-blue-700 hover:to-indigo-700 transition duration-300 transform hover:scale-105">
183
+ Explore Information Mining
184
+ </a>
185
+ <a href="#grants" class="px-8 py-4 border border-blue-500 text-blue-400 font-medium rounded-lg hover:bg-blue-900 hover:bg-opacity-30 transition duration-300 transform hover:scale-105">
186
+ Apply for Grants
187
+ </a>
188
+ </div>
189
+ </div>
190
+
191
+ <div class="absolute bottom-10 left-0 right-0 flex justify-center z-20">
192
+ <a href="#about" class="text-gray-400 hover:text-white animate-bounce">
193
+ <svg class="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
194
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 14l-7 7m0 0l-7-7m7 7V3"></path>
195
+ </svg>
196
+ </a>
197
+ </div>
198
+ </section>
199
+
200
+ <!-- About Section -->
201
+ <section id="about" class="py-20 relative">
202
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
203
+ <div class="text-center mb-16">
204
+ <h2 class="text-3xl md:text-4xl font-bold text-white mb-4">
205
+ About <span class="gradient-text">Star Foundation</span>
206
+ </h2>
207
+ <div class="w-20 h-1 bg-gradient-to-r from-blue-500 to-indigo-600 mx-auto"></div>
208
+ </div>
209
+
210
+ <div class="grid md:grid-cols-2 gap-12 items-center">
211
+ <div class="relative">
212
+ <div class="absolute -inset-4 bg-gradient-to-r from-blue-500 to-indigo-600 rounded-xl blur opacity-25"></div>
213
+ <div class="relative bg-gray-900 rounded-xl p-8 h-full border border-gray-800">
214
+ <h3 class="text-2xl font-bold text-white mb-4">Our Foundation</h3>
215
+ <p class="text-gray-300 mb-6">
216
+ Star Foundation is a pioneering organization dedicated to the future of space mining.
217
+ We focus on developing the infrastructure and knowledge needed to extract resources beyond Earth.
218
+ </p>
219
+ <p class="text-gray-300 mb-6">
220
+ Our first phase is centered on <span class="text-blue-400">Information Mining</span> - the extraction and utilization of human knowledge,
221
+ scientific discoveries, and data systems that will power our journey to the stars.
222
+ </p>
223
+ <div class="flex items-center mt-8">
224
+ <div class="w-12 h-12 rounded-full bg-blue-900 flex items-center justify-center text-blue-400">
225
+ <i class="fas fa-map-marker-alt text-xl"></i>
226
+ </div>
227
+ <div class="ml-4">
228
+ <h4 class="text-white font-medium">Registered in</h4>
229
+ <p class="text-gray-400">Crypto Valley, Switzerland</p>
230
+ </div>
231
+ </div>
232
+ </div>
233
+ </div>
234
+
235
+ <div>
236
+ <div class="bg-gray-900 rounded-xl p-8 border border-gray-800">
237
+ <h3 class="text-2xl font-bold text-white mb-6">Our Governance</h3>
238
+
239
+ <div class="space-y-6">
240
+ <div class="flex">
241
+ <div class="flex-shrink-0">
242
+ <div class="w-10 h-10 rounded-full bg-blue-900 flex items-center justify-center text-blue-400">
243
+ <i class="fas fa-network-wired"></i>
244
+ </div>
245
+ </div>
246
+ <div class="ml-4">
247
+ <h4 class="text-lg font-medium text-white">Decentralized Structure</h4>
248
+ <p class="text-gray-400 mt-1">
249
+ Utilizing blockchain technology for transparent decision-making and fund allocation.
250
+ </p>
251
+ </div>
252
+ </div>
253
+
254
+ <div class="flex">
255
+ <div class="flex-shrink-0">
256
+ <div class="w-10 h-10 rounded-full bg-blue-900 flex items-center justify-center text-blue-400">
257
+ <i class="fas fa-users"></i>
258
+ </div>
259
+ </div>
260
+ <div class="ml-4">
261
+ <h4 class="text-lg font-medium text-white">Expert Council</h4>
262
+ <p class="text-gray-400 mt-1">
263
+ A multidisciplinary team of scientists, engineers, and visionaries guiding our mission.
264
+ </p>
265
+ </div>
266
+ </div>
267
+
268
+ <div class="flex">
269
+ <div class="flex-shrink-0">
270
+ <div class="w-10 h-10 rounded-full bg-blue-900 flex items-center justify-center text-blue-400">
271
+ <i class="fas fa-lock-open"></i>
272
+ </div>
273
+ </div>
274
+ <div class="ml-4">
275
+ <h4 class="text-lg font-medium text-white">Open Participation</h4>
276
+ <p class="text-gray-400 mt-1">
277
+ Researchers and contributors worldwide can participate through our Web3 ecosystem.
278
+ </p>
279
+ </div>
280
+ </div>
281
+ </div>
282
+ </div>
283
+ </div>
284
+ </div>
285
+ </div>
286
+ </section>
287
+
288
+ <!-- Vision Section -->
289
+ <section id="vision" class="py-20 bg-gradient-to-b from-gray-900 to-black relative overflow-hidden">
290
+ <div class="absolute inset-0 z-0">
291
+ <div class="absolute top-0 left-0 w-full h-full opacity-10">
292
+ <div class="absolute top-1/4 left-1/4 w-64 h-64 rounded-full bg-blue-500 filter blur-3xl"></div>
293
+ <div class="absolute bottom-1/4 right-1/4 w-64 h-64 rounded-full bg-indigo-500 filter blur-3xl"></div>
294
+ </div>
295
+ </div>
296
+
297
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
298
+ <div class="text-center mb-16">
299
+ <h2 class="text-3xl md:text-4xl font-bold text-white mb-4">
300
+ Our <span class="gradient-text">Vision & Mission</span>
301
+ </h2>
302
+ <div class="w-20 h-1 bg-gradient-to-r from-blue-500 to-indigo-600 mx-auto"></div>
303
+ </div>
304
+
305
+ <div class="grid md:grid-cols-2 gap-12 mb-16">
306
+ <div class="bg-gray-900 bg-opacity-70 rounded-xl p-8 border border-gray-800 backdrop-filter backdrop-blur-sm">
307
+ <div class="flex items-center mb-6">
308
+ <div class="w-12 h-12 rounded-full bg-blue-900 flex items-center justify-center text-blue-400 mr-4">
309
+ <i class="fas fa-eye text-xl"></i>
310
+ </div>
311
+ <h3 class="text-2xl font-bold text-white">Vision</h3>
312
+ </div>
313
+ <p class="text-gray-300 mb-6">
314
+ To become the first "Mining Bank" of the space civilization era, facilitating the transition from Earth-based to space-based resource extraction.
315
+ </p>
316
+ <p class="text-gray-300">
317
+ We envision a future where humanity's economic foundation extends beyond our planet, powered by intelligent systems that can identify, extract, and utilize extraterrestrial resources.
318
+ </p>
319
+ </div>
320
+
321
+ <div class="bg-gray-900 bg-opacity-70 rounded-xl p-8 border border-gray-800 backdrop-filter backdrop-blur-sm">
322
+ <div class="flex items-center mb-6">
323
+ <div class="w-12 h-12 rounded-full bg-indigo-900 flex items-center justify-center text-indigo-400 mr-4">
324
+ <i class="fas fa-bullseye text-xl"></i>
325
+ </div>
326
+ <h3 class="text-2xl font-bold text-white">Mission</h3>
327
+ </div>
328
+ <p class="text-gray-300 mb-6">
329
+ To bridge human intelligence with solar system resources through a phased approach to space mining.
330
+ </p>
331
+ <p class="text-gray-300">
332
+ Starting with Information Mining on Earth, we're developing the knowledge and technologies needed for Energy and Material Mining in space, creating a sustainable pathway to an interplanetary economy.
333
+ </p>
334
+ </div>
335
+ </div>
336
+
337
+ <div class="text-center mb-12">
338
+ <h3 class="text-2xl md:text-3xl font-bold text-white mb-6">
339
+ The Three <span class="gradient-text">Mining Paradigms</span>
340
+ </h3>
341
+ <p class="text-gray-400 max-w-3xl mx-auto">
342
+ Our approach to space resource utilization is built on three foundational pillars:
343
+ </p>
344
+ </div>
345
+
346
+ <div class="grid md:grid-cols-3 gap-8">
347
+ <div class="mining-card rounded-xl p-6 hover:glow">
348
+ <div class="w-16 h-16 rounded-full bg-blue-900 flex items-center justify-center text-blue-400 mb-4 mx-auto">
349
+ <i class="fas fa-brain text-2xl"></i>
350
+ </div>
351
+ <h4 class="text-xl font-bold text-white text-center mb-3">Information Mining</h4>
352
+ <p class="text-gray-400 text-center">
353
+ Extraction and utilization of human knowledge, scientific discoveries, and data systems that power our spacefaring civilization.
354
+ </p>
355
+ </div>
356
+
357
+ <div class="mining-card rounded-xl p-6 hover:glow">
358
+ <div class="w-16 h-16 rounded-full bg-purple-900 flex items-center justify-center text-purple-400 mb-4 mx-auto">
359
+ <i class="fas fa-bolt text-2xl"></i>
360
+ </div>
361
+ <h4 class="text-xl font-bold text-white text-center mb-3">Energy Mining</h4>
362
+ <p class="text-gray-400 text-center">
363
+ Harvesting and transmitting space-based energy sources including solar, nuclear, and potential new forms of cosmic energy.
364
+ </p>
365
+ </div>
366
+
367
+ <div class="mining-card rounded-xl p-6 hover:glow">
368
+ <div class="w-16 h-16 rounded-full bg-indigo-900 flex items-center justify-center text-indigo-400 mb-4 mx-auto">
369
+ <i class="fas fa-atom text-2xl"></i>
370
+ </div>
371
+ <h4 class="text-xl font-bold text-white text-center mb-3">Material Mining</h4>
372
+ <p class="text-gray-400 text-center">
373
+ Extraction and processing of physical resources from asteroids, moons, and other celestial bodies including metals, water, and rare elements.
374
+ </p>
375
+ </div>
376
+ </div>
377
+ </div>
378
+ </section>
379
+
380
+ <!-- Space Mining Section -->
381
+ <section id="mining" class="py-20 relative">
382
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
383
+ <div class="text-center mb-16">
384
+ <h2 class="text-3xl md:text-4xl font-bold text-white mb-4">
385
+ <span class="gradient-text">Space Mining</span> Introduction
386
+ </h2>
387
+ <div class="w-20 h-1 bg-gradient-to-r from-blue-500 to-indigo-600 mx-auto"></div>
388
+ </div>
389
+
390
+ <div class="mb-16 rounded-xl overflow-hidden border border-gray-800">
391
+ <div class="aspect-w-16 aspect-h-9 bg-gray-900 flex items-center justify-center">
392
+ <div class="w-full h-full flex items-center justify-center relative">
393
+ <div class="absolute inset-0 bg-gradient-to-br from-blue-900 to-indigo-900 opacity-30"></div>
394
+ <div class="relative z-10 text-center p-8">
395
+ <i class="fas fa-play-circle text-6xl text-blue-400 mb-4 opacity-80"></i>
396
+ <h3 class="text-2xl font-bold text-white mb-2">Space Mining: The Next Frontier</h3>
397
+ <p class="text-gray-300 max-w-2xl mx-auto">
398
+ Watch our introductory video to understand how we're approaching the challenge of extraterrestrial resource extraction.
399
+ </p>
400
+ </div>
401
+ </div>
402
+ </div>
403
+ </div>
404
+
405
+ <div class="grid md:grid-cols-3 gap-8 mb-16">
406
+ <div class="mining-card rounded-xl p-8 hover:glow">
407
+ <div class="flex items-center mb-6">
408
+ <div class="w-12 h-12 rounded-full bg-blue-900 flex items-center justify-center text-blue-400 mr-4">
409
+ <i class="fas fa-brain text-xl"></i>
410
+ </div>
411
+ <h3 class="text-xl font-bold text-white">Information Mining</h3>
412
+ </div>
413
+ <p class="text-gray-400 mb-4">
414
+ The foundation of our spacefaring future lies in the effective mining and utilization of information resources:
415
+ </p>
416
+ <ul class="text-gray-400 space-y-2">
417
+ <li class="flex items-start">
418
+ <i class="fas fa-check-circle text-blue-400 mt-1 mr-2"></i>
419
+ <span>Human knowledge and cognitive systems</span>
420
+ </li>
421
+ <li class="flex items-start">
422
+ <i class="fas fa-check-circle text-blue-400 mt-1 mr-2"></i>
423
+ <span>Scientific discoveries and research data</span>
424
+ </li>
425
+ <li class="flex items-start">
426
+ <i class="fas fa-check-circle text-blue-400 mt-1 mr-2"></i>
427
+ <span>Computational and AI systems</span>
428
+ </li>
429
+ <li class="flex items-start">
430
+ <i class="fas fa-check-circle text-blue-400 mt-1 mr-2"></i>
431
+ <span>Cultural and historical knowledge archives</span>
432
+ </li>
433
+ </ul>
434
+ </div>
435
+
436
+ <div class="mining-card rounded-xl p-8 hover:glow">
437
+ <div class="flex items-center mb-6">
438
+ <div class="w-12 h-12 rounded-full bg-purple-900 flex items-center justify-center text-purple-400 mr-4">
439
+ <i class="fas fa-bolt text-xl"></i>
440
+ </div>
441
+ <h3 class="text-xl font-bold text-white">Energy Mining</h3>
442
+ </div>
443
+ <p class="text-gray-400 mb-4">
444
+ The next phase focuses on harvesting cosmic energy sources to power our expansion:
445
+ </p>
446
+ <ul class="text-gray-400 space-y-2">
447
+ <li class="flex items-start">
448
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
449
+ <span>Space-based solar power collection</span>
450
+ </li>
451
+ <li class="flex items-start">
452
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
453
+ <span>Nuclear energy systems for space applications</span>
454
+ </li>
455
+ <li class="flex items-start">
456
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
457
+ <span>Wireless energy transmission technologies</span>
458
+ </li>
459
+ <li class="flex items-start">
460
+ <i class="fas fa-check-circle text-purple-400 mt-1 mr-2"></i>
461
+ <span>Novel energy harvesting methods</span>
462
+ </li>
463
+ </ul>
464
+ </div>
465
+
466
+ <div class="mining-card rounded-xl p-8 hover:glow">
467
+ <div class="flex items-center mb-6">
468
+ <div class="w-12 h-12 rounded-full bg-indigo-900 flex items-center justify-center text-indigo-400 mr-4">
469
+ <i class="fas fa-atom text-xl"></i>
470
+ </div>
471
+ <h3 class="text-xl font-bold text-white">Material Mining</h3>
472
+ </div>
473
+ <p class="text-gray-400 mb-4">
474
+ The ultimate goal: extracting physical resources from celestial bodies:
475
+ </p>
476
+ <ul class="text-gray-400 space-y-2">
477
+ <li class="flex items-start">
478
+ <i class="fas fa-check-circle text-indigo-400 mt-1 mr-2"></i>
479
+ <span>Asteroid metal mining (iron, nickel, platinum)</span>
480
+ </li>
481
+ <li class="flex items-start">
482
+ <i class="fas fa-check-circle text-indigo-400 mt-1 mr-2"></i>
483
+ <span>Water extraction from lunar and asteroid sources</span>
484
+ </li>
485
+ <li class="flex items-start">
486
+ <i class="fas fa-check-circle text-indigo-400 mt-1 mr-2"></i>
487
+ <span>Rare earth and precious element recovery</span>
488
+ </li>
489
+ <li class="flex items-start">
490
+ <i class="fas fa-check-circle text-indigo-400 mt-1 mr-2"></i>
491
+ <span>In-situ resource utilization (ISRU) technologies</span>
492
+ </li>
493
+ </ul>
494
+ </div>
495
+ </div>
496
+
497
+ <div class="bg-gray-900 rounded-xl p-8 border border-gray-800">
498
+ <h3 class="text-2xl font-bold text-white mb-6 text-center">Why Information Mining First?</h3>
499
+ <div class="grid md:grid-cols-2 gap-8">
500
+ <div>
501
+ <p class="text-gray-400 mb-6">
502
+ Before we can effectively mine physical resources in space, we must first mine the information that will make it possible. This includes:
503
+ </p>
504
+ <ul class="text-gray-400 space-y-3">
505
+ <li class="flex items-start">
506
+ <div class="flex-shrink-0 mt-1">
507
+ <div class="w-6 h-6 rounded-full bg-blue-900 flex items-center justify-center text-blue-400">
508
+ <i class="fas fa-check text-xs"></i>
509
+ </div>
510
+ </div>
511
+ <span class="ml-3">Scientific breakthroughs in materials and propulsion</span>
512
+ </li>
513
+ <li class="flex items-start">
514
+ <div class="flex-shrink-0 mt-1">
515
+ <div class="w-6 h-6 rounded-full bg-blue-900 flex items-center justify-center text-blue-400">
516
+ <i class="fas fa-check text-xs"></i>
517
+ </div>
518
+ </div>
519
+ <span class="ml-3">Advanced robotics and autonomous systems</span>
520
+ </li>
521
+ <li class="flex items-start">
522
+ <div class="flex-shrink-0 mt-1">
523
+ <div class="w-6 h-6 rounded-full bg-blue-900 flex items-center justify-center text-blue-400">
524
+ <i class="fas fa-check text-xs"></i>
525
+ </div>
526
+ </div>
527
+ <span class="ml-3">Space resource identification and mapping</span>
528
+ </li>
529
+ </ul>
530
+ </div>
531
+ <div>
532
+ <p class="text-gray-400 mb-6">
533
+ Our current focus areas in Information Mining:
534
+ </p>
535
+ <div class="flex flex-wrap gap-2">
536
+ <span class="px-3 py-1 rounded-full bg-blue-900 bg-opacity-50 text-blue-400 text-sm">Life Sciences</span>
537
+ <span class="px-3 py-1 rounded-full bg-blue-900 bg-opacity-50 text-blue-400 text-sm">Space Technology</span>
538
+ <span class="px-3 py-1 rounded-full bg-blue-900 bg-opacity-50 text-blue-400 text-sm">Energy Systems</span>
539
+ <span class="px-3 py-1 rounded-full bg-blue-900 bg-opacity-50 text-blue-400 text-sm">AI & Robotics</span>
540
+ <span class="px-3 py-1 rounded-full bg-blue-900 bg-opacity-50 text-blue-400 text-sm">Data Science</span>
541
+ <span class="px-3 py-1 rounded-full bg-blue-900 bg-opacity-50 text-blue-400 text-sm">Materials Science</span>
542
+ </div>
543
+ <div class="mt-6">
544
+ <a href="#grants" class="inline-flex items-center text-blue-400 hover:text-white">
545
+ Learn about our grant programs
546
+ <i class="fas fa-arrow-right ml-2"></i>
547
+ </a>
548
+ </div>
549
+ </div>
550
+ </div>
551
+ </div>
552
+ </div>
553
+ </section>
554
+
555
+ <!-- Grants Section -->
556
+ <section id="grants" class="py-20 bg-gradient-to-b from-black to-gray-900 relative">
557
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
558
+ <div class="text-center mb-16">
559
+ <h2 class="text-3xl md:text-4xl font-bold text-white mb-4">
560
+ <span class="gradient-text">Grants & Investments</span>
561
+ </h2>
562
+ <div class="w-20 h-1 bg-gradient-to-r from-blue-500 to-indigo-600 mx-auto"></div>
563
+ </div>
564
+
565
+ <div class="grid md:grid-cols-2 gap-12 mb-16">
566
+ <div class="bg-gray-900 rounded-xl p-8 border border-gray-800">
567
+ <h3 class="text-2xl font-bold text-white mb-6">Supporting Information Mining</h3>
568
+ <p class="text-gray-400 mb-6">
569
+ Star Foundation provides funding and resources to researchers and organizations working on projects that advance our understanding and capabilities in Information Mining.
570
+ </p>
571
+
572
+ <div class="space-y-6">
573
+ <div class="flex">
574
+ <div class="flex-shrink-0">
575
+ <div class="w-10 h-10 rounded-full bg-blue-900 flex items-center justify-center text-blue-400">
576
+ <i class="fas fa-flask"></i>
577
+ </div>
578
+ </div>
579
+ <div class="ml-4">
580
+ <h4 class="text-lg font-medium text-white">Research Grants</h4>
581
+ <p class="text-gray-400 mt-1">
582
+ Funding for academic and independent research in key focus areas.
583
+ </p>
584
+ </div>
585
+ </div>
586
+
587
+ <div class="flex">
588
+ <div class="flex-shrink-0">
589
+ <div class="w-10 h-10 rounded-full bg-blue-900 flex items-center justify-center text-blue-400">
590
+ <i class="fas fa-rocket"></i>
591
+ </div>
592
+ </div>
593
+ <div class="ml-4">
594
+ <h4 class="text-lg font-medium text-white">Technology Development</h4>
595
+ <p class="text-gray-400 mt-1">
596
+ Support for prototyping and testing new technologies.
597
+ </p>
598
+ </div>
599
+ </div>
600
+
601
+ <div class="flex">
602
+ <div class="flex-shrink-0">
603
+ <div class="w-10 h-10 rounded-full bg-blue-900 flex items-center justify-center text-blue-400">
604
+ <i class="fas fa-network-wired"></i>
605
+ </div>
606
+ </div>
607
+ <div class="ml-4">
608
+ <h4 class="text-lg font-medium text-white">Open Source Initiatives</h4>
609
+ <p class="text-gray-400 mt-1">
610
+ Funding for projects that create open tools and platforms.
611
+ </p>
612
+ </div>
613
+ </div>
614
+ </div>
615
+ </div>
616
+
617
+ <div class="bg-gray-900 rounded-xl p-8 border border-gray-800">
618
+ <h3 class="text-2xl font-bold text-white mb-6">Application Process</h3>
619
+
620
+ <div class="space-y-8">
621
+ <div class="flex">
622
+ <div class="flex-shrink-0 flex items-center justify-center w-12 h-12 rounded-full bg-blue-900 text-blue-400 font-bold text-lg">
623
+ 1
624
+ </div>
625
+ <div class="ml-4">
626
+ <h4 class="text-lg font-medium text-white">Submit Proposal</h4>
627
+ <p class="text-gray-400 mt-1">
628
+ Present your project idea through our online portal.
629
+ </p>
630
+ </div>
631
+ </div>
632
+
633
+ <div class="flex">
634
+ <div class="flex-shrink-0 flex items-center justify-center w-12 h-12 rounded-full bg-blue-900 text-blue-400 font-bold text-lg">
635
+ 2
636
+ </div>
637
+ <div class="ml-4">
638
+ <h4 class="text-lg font-medium text-white">Technical Review</h4>
639
+ <p class="text-gray-400 mt-1">
640
+ Our expert panel evaluates the scientific merit and alignment with our goals.
641
+ </p>
642
+ </div>
643
+ </div>
644
+
645
+ <div class="flex">
646
+ <div class="flex-shrink-0 flex items-center justify-center w-12 h-12 rounded-full bg-blue-900 text-blue-400 font-bold text-lg">
647
+ 3
648
+ </div>
649
+ <div class="ml-4">
650
+ <h4 class="text-lg font-medium text-white">Funding Decision</h4>
651
+ <p class="text-gray-400 mt-1">
652
+ Successful applicants receive funding and resources.
653
+ </p>
654
+ </div>
655
+ </div>
656
+
657
+ <div class="pt-4">
658
+ <a href="#" class="inline-flex items-center px-6 py-3 border border-blue-500 text-blue-400 font-medium rounded-lg hover:bg-blue-900 hover:bg-opacity-30 transition duration-300">
659
+ Apply for Grants
660
+ <i class="fas fa-arrow-right ml-2"></i>
661
+ </a>
662
+ </div>
663
+ </div>
664
+ </div>
665
+ </div>
666
+
667
+ <div class="text-center mb-12">
668
+ <h3 class="text-2xl md:text-3xl font-bold text-white mb-6">
669
+ Featured <span class="gradient-text">Projects</span>
670
+ </h3>
671
+ <p class="text-gray-400 max-w-3xl mx-auto">
672
+ Some of the groundbreaking work we're supporting through our grant programs:
673
+ </p>
674
+ </div>
675
+
676
+ <div class="grid md:grid-cols-3 gap-8">
677
+ <div class="mining-card rounded-xl overflow-hidden hover:glow">
678
+ <div class="h-48 bg-gradient-to-br from-blue-900 to-indigo-900 flex items-center justify-center">
679
+ <i class="fas fa-brain text-5xl text-blue-400 opacity-70"></i>
680
+ </div>
681
+ <div class="p-6">
682
+ <h4 class="text-xl font-bold text-white mb-2">Neural Interface Systems</h4>
683
+ <p class="text-gray-400 text-sm mb-4">University of Zurich</p>
684
+ <p class="text-gray-400 mb-4">
685
+ Developing advanced brain-computer interfaces for space applications.
686
+ </p>
687
+ <div class="flex justify-between items-center">
688
+ <span class="text-blue-400 text-sm">2022-2024</span>
689
+ <span class="text-gray-500 text-sm">$2.4M</span>
690
+ </div>
691
+ </div>
692
+ </div>
693
+
694
+ <div class="mining-card rounded-xl overflow-hidden hover:glow">
695
+ <div class="h-48 bg-gradient-to-br from-purple-900 to-indigo-900 flex items-center justify-center">
696
+ <i class="fas fa-robot text-5xl text-purple-400 opacity-70"></i>
697
+ </div>
698
+ <div class="p-6">
699
+ <h4 class="text-xl font-bold text-white mb-2">Autonomous Mining Robots</h4>
700
+ <p class="text-gray-400 text-sm mb-4">ETH Zurich</p>
701
+ <p class="text-gray-400 mb-4">
702
+ AI-powered robotic systems for extraterrestrial resource identification.
703
+ </p>
704
+ <div class="flex justify-between items-center">
705
+ <span class="text-purple-400 text-sm">2023-2025</span>
706
+ <span class="text-gray-500 text-sm">$3.1M</span>
707
+ </div>
708
+ </div>
709
+ </div>
710
+
711
+ <div class="mining-card rounded-xl overflow-hidden hover:glow">
712
+ <div class="h-48 bg-gradient-to-br from-indigo-900 to-blue-900 flex items-center justify-center">
713
+ <i class="fas fa-database text-5xl text-indigo-400 opacity-70"></i>
714
+ </div>
715
+ <div class="p-6">
716
+ <h4 class="text-xl font-bold text-white mb-2">Space Data Commons</h4>
717
+ <p class="text-gray-400 text-sm mb-4">Open Source Initiative</p>
718
+ <p class="text-gray-400 mb-4">
719
+ Decentralized platform for sharing space research data.
720
+ </p>
721
+ <div class="flex justify-between items-center">
722
+ <span class="text-indigo-400 text-sm">2021-2023</span>
723
+ <span class="text-gray-500 text-sm">$1.8M</span>
724
+ </div>
725
+ </div>
726
+ </div>
727
+ </div>
728
+ </div>
729
+ </section>
730
+
731
+ <!-- Discoveries Section -->
732
+ <section id="discoveries" class="py-20 relative">
733
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
734
+ <div class="text-center mb-16">
735
+ <h2 class="text-3xl md:text-4xl font-bold text-white mb-4">
736
+ Scientific <span class="gradient-text">Discoveries</span>
737
+ </h2>
738
+ <div class="w-20 h-1 bg-gradient-to-r from-blue-500 to-indigo-600 mx-auto"></div>
739
+ </div>
740
+
741
+ <div class="mb-12">
742
+ <div class="flex flex-col md:flex-row justify-between items-center mb-8">
743
+ <h3 class="text-2xl font-bold text-white mb-4 md:mb-0">
744
+ From <span class="text-blue-400">Information Mining</span>
745
+ </h3>
746
+ <div class="flex space-x-2">
747
+ <button class="px-4 py-2 bg-blue-900 bg-opacity-50 text-blue-400 rounded-lg text-sm">All</button>
748
+ <button class="px-4 py-2 bg-gray-800 hover:bg-gray-700 text-gray-300 rounded-lg text-sm">Life Sciences</button>
749
+ <button class="px-4 py-2 bg-gray-800 hover:bg-gray-700 text-gray-300 rounded-lg text-sm">Space Tech</button>
750
+ <button class="px-4 py-2 bg-gray-800 hover:bg-gray-700 text-gray-300 rounded-lg text-sm">Energy</button>
751
+ <button class="px-4 py-2 bg-gray-800 hover:bg-gray-700 text-gray-300 rounded-lg text-sm">Software</button>
752
+ </div>
753
+ </div>
754
+
755
+ <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
756
+ <div class="bg-gray-900 rounded-xl p-6 border border-gray-800 hover:border-blue-500 transition duration-300">
757
+ <div class="flex items-center mb-4">
758
+ <div class="w-10 h-10 rounded-full bg-blue-900 flex items-center justify-center text-blue-400 mr-3">
759
+ <i class="fas fa-dna"></i>
760
+ </div>
761
+ <span class="text-sm text-gray-400">Life Sciences</span>
762
+ </div>
763
+ <h4 class="text-xl font-bold text-white mb-3">Genetic Adaptations for Space</h4>
764
+ <p class="text-gray-400 mb-4">
765
+ Discovered genetic markers that may help humans adapt to long-duration spaceflight.
766
+ </p>
767
+ <div class="flex justify-between items-center">
768
+ <span class="text-xs text-gray-500">Published: June 2023</span>
769
+ <a href="#" class="text-blue-400 hover:text-white text-sm flex items-center">
770
+ Read more <i class="fas fa-arrow-right ml-1 text-xs"></i>
771
+ </a>
772
+ </div>
773
+ </div>
774
+
775
+ <div class="bg-gray-900 rounded-xl p-6 border border-gray-800 hover:border-blue-500 transition duration-300">
776
+ <div class="flex items-center mb-4">
777
+ <div class="w-10 h-10 rounded-full bg-purple-900 flex items-center justify-center text-purple-400 mr-3">
778
+ <i class="fas fa-satellite"></i>
779
+ </div>
780
+ <span class="text-sm text-gray-400">Space Tech</span>
781
+ </div>
782
+ <h4 class="text-xl font-bold text-white mb-3">Asteroid Composition AI</h4>
783
+ <p class="text-gray-400 mb-4">
784
+ New AI model can predict asteroid composition with 92% accuracy from spectral data.
785
+ </p>
786
+ <div class="flex justify-between items-center">
787
+ <span class="text-xs text-gray-500">Published: April 2023</span>
788
+ <a href="#" class="text-blue-400 hover:text-white text-sm flex items-center">
789
+ Read more <i class="fas fa-arrow-right ml-1 text-xs"></i>
790
+ </a>
791
+ </div>
792
+ </div>
793
+
794
+ <div class="bg-gray-900 rounded-xl p-6 border border-gray-800 hover:border-blue-500 transition duration-300">
795
+ <div class="flex items-center mb-4">
796
+ <div class="w-10 h-10 rounded-full bg-indigo-900 flex items-center justify-center text-indigo-400 mr-3">
797
+ <i class="fas fa-bolt"></i>
798
+ </div>
799
+ <span class="text-sm text-gray-400">Energy</span>
800
+ </div>
801
+ <h4 class="text-xl font-bold text-white mb-3">Wireless Power Breakthrough</h4>
802
+ <p class="text-gray-400 mb-4">
803
+ Achieved 85% efficiency in kilometer-scale wireless energy transmission.
804
+ </p>
805
+ <div class="flex justify-between items-center">
806
+ <span class="text-xs text-gray-500">Published: February 2023</span>
807
+ <a href="#" class="text-blue-400 hover:text-white text-sm flex items-center">
808
+ Read more <i class="fas fa-arrow-right ml-1 text-xs"></i>
809
+ </a>
810
+ </div>
811
+ </div>
812
+
813
+ <div class="bg-gray-900 rounded-xl p-6 border border-gray-800 hover:border-blue-500 transition duration-300">
814
+ <div class="flex items-center mb-4">
815
+ <div class="w-10 h-10 rounded-full bg-blue-900 flex items-center justify-center text-blue-400 mr-3">
816
+ <i class="fas fa-code"></i>
817
+ </div>
818
+ <span class="text-sm text-gray-400">Software</span>
819
+ </div>
820
+ <h4 class="text-xl font-bold text-white mb-3">Decentralized Research Network</h4>
821
+ <p class="text-gray-400 mb-4">
822
+ Launched open platform for collaborative space research with 5,000+ active users.
823
+ </p>
824
+ <div class="flex justify-between items-center">
825
+ <span class="text-xs text-gray-500">Published: January 2023</span>
826
+ <a href="#" class="text-blue-400 hover:text-white text-sm flex items-center">
827
+ Read more <i class="fas fa-arrow-right ml-1 text-xs"></i>
828
+ </a>
829
+ </div>
830
+ </div>
831
+
832
+ <div class="bg-gray-900 rounded-xl p-6 border border-gray-800 hover:border-blue-500 transition duration-300">
833
+ <div class="flex items-center mb-4">
834
+ <div class="w-10 h-10 rounded-full bg-purple-900 flex items-center justify-center text-purple-400 mr-3">
835
+ <i class="fas fa-atom"></i>
836
+ </div>
837
+ <span class="text-sm text-gray-400">Materials</span>
838
+ </div>
839
+ <h4 class="text-xl font-bold text-white mb-3">Lunar Concrete Formula</h4>
840
+ <p class="text-gray-400 mb-4">
841
+ Developed construction material using simulated lunar regolith with 3x Earth concrete strength.
842
+ </p>
843
+ <div class="flex justify-between items-center">
844
+ <span class="text-xs text-gray-500">Published: December 2022</span>
845
+ <a href="#" class="text-blue-400 hover:text-white text-sm flex items-center">
846
+ Read more <i class="fas fa-arrow-right ml-1 text-xs"></i>
847
+ </a>
848
+ </div>
849
+ </div>
850
+
851
+ <div class="bg-gray-900 rounded-xl p-6 border border-gray-800 hover:border-blue-500 transition duration-300">
852
+ <div class="flex items-center mb-4">
853
+ <div class="w-10 h-10 rounded-full bg-indigo-900 flex items-center justify-center text-indigo-400 mr-3">
854
+ <i class="fas fa-brain"></i>
855
+ </div>
856
+ <span class="text-sm text-gray-400">Neuroscience</span>
857
+ </div>
858
+ <h4 class="text-xl font-bold text-white mb-3">Cognitive Load in Microgravity</h4>
859
+ <p class="text-gray-400 mb-4">
860
+ Identified neural patterns that explain decreased cognitive performance in microgravity.
861
+ </p>
862
+ <div class="flex justify-between items-center">
863
+ <span class="text-xs text-gray-500">Published: October 2022</span>
864
+ <a href="#" class="text-blue-400 hover:text-white text-sm flex items-center">
865
+ Read more <i class="fas fa-arrow-right ml-1 text-xs"></i>
866
+ </a>
867
+ </div>
868
+ </div>
869
+ </div>
870
+ </div>
871
+
872
+ <div class="bg-gray-900 rounded-xl p-8 border border-gray-800">
873
+ <h3 class="text-2xl font-bold text-white mb-6 text-center">Research Impact</h3>
874
+
875
+ <div class="grid md:grid-cols-3 gap-8">
876
+ <div class="text-center">
877
+ <div class="text-5xl font-bold text-blue-400 mb-2">47</div>
878
+ <div class="text-gray-400">Peer-reviewed publications</div>
879
+ </div>
880
+
881
+ <div class="text-center">
882
+ <div class="text-5xl font-bold text-purple-400 mb-2">12</div>
883
+ <div class="text-gray-400">Patent applications</div>
884
+ </div>
885
+
886
+ <div class="text-center">
887
+ <div class="text-5xl font-bold text-indigo-400 mb-2">5</div>
888
+ <div class="text-gray-400">Technologies in space trials</div>
889
+ </div>
890
+ </div>
891
+
892
+ <div class="mt-12">
893
+ <div class="flex flex-col md:flex-row justify-between items-center">
894
+ <div class="mb-6 md:mb-0">
895
+ <h4 class="text-xl font-bold text-white mb-2">Research Hotspots</h4>
896
+ <p class="text-gray-400 max-w-md">
897
+ The most active areas of research in our Information Mining initiative:
898
+ </p>
899
+ </div>
900
+ <div class="flex flex-wrap gap-2">
901
+ <span class="px-4 py-2 rounded-full bg-blue-900 bg-opacity-50 text-blue-400">AI & Machine Learning</span>
902
+ <span class="px-4 py-2 rounded-full bg-purple-900 bg-opacity-50 text-purple-400">Space Neuroscience</span>
903
+ <span class="px-4 py-2 rounded-full bg-indigo-900 bg-opacity-50 text-indigo-400">Autonomous Systems</span>
904
+ <span class="px-4 py-2 rounded-full bg-blue-900 bg-opacity-50 text-blue-400">Materials Informatics</span>
905
+ </div>
906
+ </div>
907
+ </div>
908
+ </div>
909
+ </div>
910
+ </section>
911
+
912
+ <!-- Join Us Section -->
913
+ <section id="join" class="py-20 bg-gradient-to-b from-gray-900 to-black relative overflow-hidden">
914
+ <div class="absolute inset-0 z-0 opacity-20">
915
+ <div class="absolute top-0 left-0 w-full h-full">
916
+ <div class="absolute top-1/3 left-1/4 w-64 h-64 rounded-full bg-blue-500 filter blur-3xl"></div>
917
+ <div class="absolute bottom-1/4 right-1/4 w-64 h-64 rounded-full bg-indigo-500 filter blur-3xl"></div>
918
+ </div>
919
+ </div>
920
+
921
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
922
+ <div class="text-center mb-16">
923
+ <h2 class="text-3xl md:text-4xl font-bold text-white mb-4">
924
+ <span class="gradient-text">Join Us</span> in Shaping the Future
925
+ </h2>
926
+ <div class="w-20 h-1 bg-gradient-to-r from-blue-500 to-indigo-600 mx-auto"></div>
927
+ </div>
928
+
929
+ <div class="grid md:grid-cols-2 gap-12 mb-16">
930
+ <div class="bg-gray-900 rounded-xl p-8 border border-gray-800">
931
+ <h3 class="text-2xl font-bold text-white mb-6">Become Part of Our Mission</h3>
932
+
933
+ <div class="space-y-6">
934
+ <div class="flex">
935
+ <div class="flex-shrink-0">
936
+ <div class="w-10 h-10 rounded-full bg-blue-900 flex items-center justify-center text-blue-400">
937
+ <i class="fas fa-user-tie"></i>
938
+ </div>
939
+ </div>
940
+ <div class="ml-4">
941
+ <h4 class="text-lg font-medium text-white">Researchers & Scientists</h4>
942
+ <p class="text-gray-400 mt-1">
943
+ Contribute your expertise to our Information Mining initiatives.
944
+ </p>
945
+ </div>
946
+ </div>
947
+
948
+ <div class="flex">
949
+ <div class="flex-shrink-0">
950
+ <div class="w-10 h-10 rounded-full bg-blue-900 flex items-center justify-center text-blue-400">
951
+ <i class="fas fa-hand-holding-usd"></i>
952
+ </div>
953
+ </div>
954
+ <div class="ml-4">
955
+ <h4 class="text-lg font-medium text-white">Investors & Partners</h4>
956
+ <p class="text-gray-400 mt-1">
957
+ Support our mission through strategic partnerships and funding.
958
+ </p>
959
+ </div>
960
+ </div>
961
+
962
+ <div class="flex">
963
+ <div class="flex-shrink-0">
964
+ <div class="w-10 h-10 rounded-full bg-blue-900 flex items-center justify-center text-blue-400">
965
+ <i class="fas fa-lightbulb"></i>
966
+ </div>
967
+ </div>
968
+ <div class="ml-4">
969
+ <h4 class="text-lg font-medium text-white">Advisors & Visionaries</h4>
970
+ <p class="text-gray-400 mt-1">
971
+ Help guide our long-term strategy and technological direction.
972
+ </p>
973
+ </div>
974
+ </div>
975
+
976
+ <div class="flex">
977
+ <div class="flex-shrink-0">
978
+ <div class="w-10 h-10 rounded-full bg-blue-900 flex items-center justify-center text-blue-400">
979
+ <i class="fas fa-code"></i>
980
+ </div>
981
+ </div>
982
+ <div class="ml-4">
983
+ <h4 class="text-lg font-medium text-white">Developers & Engineers</h4>
984
+ <p class="text-gray-400 mt-1">
985
+ Build the systems and infrastructure that will power our spacefaring future.
986
+ </p>
987
+ </div>
988
+ </div>
989
+ </div>
990
+ </div>
991
+
992
+ <div class="bg-gray-900 rounded-xl p-8 border border-gray-800">
993
+ <h3 class="text-2xl font-bold text-white mb-6">Contact Information</h3>
994
+
995
+ <div class="space-y-6">
996
+ <div class="flex items-start">
997
+ <div class="flex-shrink-0 mt-1">
998
+ <div class="w-10 h-10 rounded-full bg-blue-900 flex items-center justify-center text-blue-400">
999
+ <i class="fas fa-map-marker-alt"></i>
1000
+ </div>
1001
+ </div>
1002
+ <div class="ml-4">
1003
+ <h4 class="text-lg font-medium text-white">Headquarters</h4>
1004
+ <p class="text-gray-400 mt-1">
1005
+ Crypto Valley, Zug, Switzerland
1006
+ </p>
1007
+ </div>
1008
+ </div>
1009
+
1010
+ <div class="flex items-start">
1011
+ <div class="flex-shrink-0 mt-1">
1012
+ <div class="w-10 h-10 rounded-full bg-blue-900 flex items-center justify-center text-blue-400">
1013
+ <i class="fas fa-envelope"></i>
1014
+ </div>
1015
+ </div>
1016
+ <div class="ml-4">
1017
+ <h4 class="text-lg font-medium text-white">Email</h4>
1018
+ <p class="text-gray-400 mt-1">
1019
+ [email protected]
1020
+ </p>
1021
+ </div>
1022
+ </div>
1023
+
1024
+ <div class="flex items-start">
1025
+ <div class="flex-shrink-0 mt-1">
1026
+ <div class="w-10 h-10 rounded-full bg-blue-900 flex items-center justify-center text-blue-400">
1027
+ <i class="fas fa-globe"></i>
1028
+ </div>
1029
+ </div>
1030
+ <div class="ml-4">
1031
+ <h4 class="text-lg font-medium text-white">Web3 Integration</h4>
1032
+ <p class="text-gray-400 mt-1">
1033
+ Connect with your Ethereum wallet to access decentralized features
1034
+ </p>
1035
+ <button class="mt-3 px-4 py-2 bg-gray-800 hover:bg-gray-700 text-gray-300 rounded-lg text-sm flex items-center">
1036
+ <i class="fab fa-ethereum mr-2"></i> Connect Wallet
1037
+ </button>
1038
+ </div>
1039
+ </div>
1040
+ </div>
1041
+ </div>
1042
+ </div>
1043
+
1044
+ <div class="bg-gray-900 rounded-xl p-8 border border-gray-800">
1045
+ <h3 class="text-2xl font-bold text-white mb-6 text-center">Stay Updated</h3>
1046
+
1047
+ <div class="max-w-2xl mx-auto">
1048
+ <p class="text-gray-400 text-center mb-8">
1049
+ Subscribe to our newsletter for the latest updates on our projects, research, and opportunities to get involved.
1050
+ </p>
1051
+
1052
+ <form class="flex flex-col sm:flex-row gap-4">
1053
+ <input type="email" placeholder="Your email address" class="flex-grow px-4 py-3 bg-gray-800 border border-gray-700 rounded-lg text-white focus:outline-none focus:ring-2 focus:ring-blue-500">
1054
+ <button type="submit" class="px-6 py-3 bg-gradient-to-r from-blue-600 to-indigo-600 text-white font-medium rounded-lg hover:from-blue-700 hover:to-indigo-700 transition duration-300">
1055
+ Subscribe
1056
+ </button>
1057
+ </form>
1058
+
1059
+ <div class="flex justify-center space-x-6 mt-8">
1060
+ <a href="#" class="text-gray-400 hover:text-white">
1061
+ <i class="fab fa-twitter text-xl"></i>
1062
+ </a>
1063
+ <a href="#" class="text-gray-400 hover:text-white">
1064
+ <i class="fab fa-linkedin text-xl"></i>
1065
+ </a>
1066
+ <a href="#" class="text-gray-400 hover:text-white">
1067
+ <i class="fab fa-github text-xl"></i>
1068
+ </a>
1069
+ <a href="#" class="text-gray-400 hover:text-white">
1070
+ <i class="fab fa-discord text-xl"></i>
1071
+ </a>
1072
+ <a href="#" class="text-gray-400 hover:text-white">
1073
+ <i class="fab fa-telegram text-xl"></i>
1074
+ </a>
1075
+ </div>
1076
+ </div>
1077
+ </div>
1078
+ </div>
1079
+ </section>
1080
+
1081
+ <!-- Footer -->
1082
+ <footer class="bg-black py-12 border-t border-gray-800">
1083
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
1084
+ <div class="grid grid-cols-2 md:grid-cols-4 gap-8">
1085
+ <div>
1086
+ <h3 class="text-white font-bold mb-4">Star Foundation</h3>
1087
+ <p class="text-gray-400 text-sm">
1088
+ Mining the future of intelligence through space resource utilization.
1089
+ </p>
1090
+ </div>
1091
+
1092
+ <div>
1093
+ <h3 class="text-white font-bold mb-4">Navigation</h3>
1094
+ <ul class="space-y-2">
1095
+ <li><a href="#home" class="text-gray-400 hover:text-white text-sm">Home</a></li>
1096
+ <li><a href="#about" class="text-gray-400 hover:text-white text-sm">About</a></li>
1097
+ <li><a href="#vision" class="text-gray-400 hover:text-white text-sm">Vision</a></li>
1098
+ <li><a href="#mining" class="text-gray-400 hover:text-white text-sm">Space Mining</a></li>
1099
+ </ul>
1100
+ </div>
1101
+
1102
+ <div>
1103
+ <h3 class="text-white font-bold mb-4">Resources</h3>
1104
+ <ul class="space-y-2">
1105
+ <li><a href="#grants" class="text-gray-400 hover:text-white text-sm">Grants</a></li>
1106
+ <li><a href="#discoveries" class="text-gray-400 hover:text-white text-sm">Discoveries</a></li>
1107
+ <li><a href="#join" class="text-gray-400 hover:text-white text-sm">Join Us</a></li>
1108
+ <li><a href="#" class="text-gray-400 hover:text-white text-sm">News</a></li>
1109
+ </ul>
1110
+ </div>
1111
+
1112
+ <div>
1113
+ <h3 class="text-white font-bold mb-4">Legal</h3>
1114
+ <ul class="space-y-2">
1115
+ <li><a href="#" class="text-gray-400 hover:text-white text-sm">Privacy Policy</a></li>
1116
+ <li><a href="#" class="text-gray-400 hover:text-white text-sm">Terms of Service</a></li>
1117
+ <li><a href="#" class="text-gray-400 hover:text-white text-sm">Cookie Policy</a></li>
1118
+ </ul>
1119
+ </div>
1120
+ </div>
1121
+
1122
+ <div class="mt-12 pt-8 border-t border-gray-800 flex flex-col md:flex-row justify-between items-center">
1123
+ <p class="text-gray-500 text-sm mb-4 md:mb-0">
1124
+ © 2023 Star Foundation. All rights reserved.
1125
+ </p>
1126
+ <div class="flex space-x-6">
1127
+ <a href="#" class="text-gray-500 hover:text-white">
1128
+ <i class="fab fa-ethereum"></i>
1129
+ </a>
1130
+ <a href="#" class="text-gray-500 hover:text-white">
1131
+ <i class="fab fa-bitcoin"></i>
1132
+ </a>
1133
+ <a href="#" class="text-gray-500 hover:text-white">
1134
+ <i class="fas fa-globe"></i>
1135
+ </a>
1136
+ </div>
1137
+ </div>
1138
+ </div>
1139
+ </footer>
1140
+
1141
+ <script>
1142
+ // Mobile menu toggle
1143
+ document.getElementById('mobile-menu-button').addEventListener('click', function() {
1144
+ const menu = document.getElementById('mobile-menu');
1145
+ menu.classList.toggle('hidden');
1146
+ });
1147
+
1148
+ // Create stars background
1149
+ function createStars() {
1150
+ const container = document.getElementById('stars-container');
1151
+ const starCount = 200;
1152
+
1153
+ for (let i = 0; i < starCount; i++) {
1154
+ const star = document.createElement('div');
1155
+ star.className = 'animated-star';
1156
+
1157
+ // Random position
1158
+ const x = Math.random() * 100;
1159
+ const y = Math.random() * 100;
1160
+ star.style.left = `${x}%`;
1161
+ star.style.top = `${y}%`;
1162
+
1163
+ // Random size
1164
+ const size = Math.random() * 2;
1165
+ star.style.width = `${size}px`;
1166
+ star.style.height = `${size}px`;
1167
+
1168
+ // Random animation delay
1169
+ const delay = Math.random() * 5;
1170
+ star.style.animationDelay = `${delay}s`;
1171
+
1172
+ container.appendChild(star);
1173
+ }
1174
+ }
1175
+
1176
+ // Smooth scrolling for anchor links
1177
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
1178
+ anchor.addEventListener('click', function (e) {
1179
+ e.preventDefault();
1180
+
1181
+ const targetId = this.getAttribute('href');
1182
+ const targetElement = document.querySelector(targetId);
1183
+
1184
+ if (targetElement) {
1185
+ window.scrollTo({
1186
+ top: targetElement.offsetTop - 80,
1187
+ behavior: 'smooth'
1188
+ });
1189
+
1190
+ // Close mobile menu if open
1191
+ const mobileMenu = document.getElementById('mobile-menu');
1192
+ if (!mobileMenu.classList.contains('hidden')) {
1193
+ mobileMenu.classList.add('hidden');
1194
+ }
1195
+ }
1196
+ });
1197
+ });
1198
+
1199
+ // Initialize when page loads
1200
+ window.addEventListener('DOMContentLoaded', () => {
1201
+ createStars();
1202
+
1203
+ // Typewriter effect for hero text
1204
+ const heroText = document.querySelector('.hero-bg h1');
1205
+ if (heroText) {
1206
+ heroText.classList.add('typewriter');
1207
+ setTimeout(() => {
1208
+ heroText.style.borderRight = 'none';
1209
+ }, 3500);
1210
+ }
1211
+ });
1212
+ </script>
1213
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=tongxiaojun/the-star-foundation" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
1214
+ </html>
prompts.txt ADDED
@@ -0,0 +1 @@
 
 
1
+ 下面是根据您提供的内容策划的 **Star Foundation 官网（star.org）** 网站结构与内容建议： --- ## 🌐 Star Foundation 官网策划方案 ### 一、网站整体定位与风格 - **目标定位**：国际化、科技感、未来感，体现前沿科学投资与宇宙探索的融合。 - **核心主题**：太空采矿新范式的引领者——从“信息矿”开始，链接人类智慧与宇宙资源。 - **视觉风格**：深空蓝+星光银为主色调，加入未来科技风格的界面设计（如动态星图、粒子动效、透明渐变等）。 --- ### 二、网站主导航结构（建议七大一级菜单） 1. **首页（Home）** 2. **关于我们（About）** 3. **愿景与使命（Vision）** 4. **太空采矿导论（Space Mining）** 5. **项目资助（Grants & Investments）** 6. **科学成果（Discoveries）** 7. **联系与加入（Join Us）** --- ### 三、各页面详细内容规划 --- #### 1. **首页（Home）** - 大幅横屏视觉动画：信息流与宇宙交汇的动态画面（例如从人脑神经网络过渡到星图） - 核心Slogan： > "**Mining the Future of Intelligence** – 开采宇宙中最珍贵的资源：人类智慧与信息。" - 快速入口按钮： - 探索信息矿 - 申请资助 - 加入我们 --- #### 2. **关于我们（About）** - Star Foundation 简介（重点突出以下内容）： - 专注于**太空采矿**的未来基金会 - 第一阶段目标：**信息矿开发** - 注册地：**瑞士加密谷** - 基金会治理结构与发起人（如合适可以引入去中心化或Web3元素） --- #### 3. **愿景与使命（Vision）** - 愿景：成为太空文明时代的第一座“矿业银行” - 使命：从人类智慧出发，迈向太阳系资源的智能采集 - 三大“矿种”概念介绍（信息矿、能量矿、物质矿） - 可采用3D交互模型或动态图标阐释三者差异 --- #### 4. **太空采矿导论（Space Mining）** - 内容模块化展示，建议如下格式： 1. **导论视频**（2~3分钟短片，动画+配音） 2. 三大矿种简介（卡片式介绍）： - 信息矿：大脑、科学成果、数据系统等 - 能量矿：太阳能、核能、太空无线能传输 - 物质矿：小行星金属、水资源、稀有元素等 3. 信息矿重点介绍（延展细节至科研领域） --- #### 5. **项目资助（Grants & Investments）** - 描述 Star Foundation 如何支持信息矿开发： - 科学研究资助机制 - 对象领域：生命科学、航天科技、新能源、开源软件 - 申请方式与评估流程 - 展示当前/过去资助项目（卡片式） - 科研团队简介 - 研究成果简述 - 资助金额/形式 --- #### 6. **科学成果（Discoveries）** - 展示从“信息矿”开发中产生的最新成果 - 分类展示（生命科学 / 航天 / 新能源 / 开源软件） - 可加入**数据可视化**模块，如： - 成果分布图 - 研究热点词云 - 研究影响力网络图 --- #### 7. **联系与加入（Join Us）** - 加入方式（作为研究人员、资助者、顾问、合作伙伴） - 加密谷办公地址与联系方式 - 加入邮件列表 - 支持Web3身份/钱包接入（如未来有DAO计划） --- ### 四、附加功能建议 - **多语言支持**（英文为主，中文/法语/德语可选） - **Web3支持**（链上身份认证、透明资助记录） - **新闻与媒体中心**（发布研究、合作、演讲等资讯） - **沉浸式介绍页面**（像Apple产品那样的滚动视差设计） --- 是否需要我为这个网站生成一个初步的视觉草图或页面结构图？