Backtun commited on
Commit
5786722
·
verified ·
1 Parent(s): 80f9d25

Add 2 files

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +470 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Conciencia Artificial Testing
3
- emoji: 😻
4
- colorFrom: indigo
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: conciencia-artificial-testing
3
+ emoji: 🐳
4
+ colorFrom: blue
5
+ colorTo: gray
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,470 @@
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>Conciencia Artificial | AI Education & Analysis</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=Inter:wght@300;400;500;600;700&display=swap');
11
+
12
+ body {
13
+ font-family: 'Inter', sans-serif;
14
+ background-color: #f8fafc;
15
+ }
16
+
17
+ .gradient-text {
18
+ background: linear-gradient(90deg, #3b82f6, #8b5cf6);
19
+ -webkit-background-clip: text;
20
+ background-clip: text;
21
+ color: transparent;
22
+ }
23
+
24
+ .article-card:hover {
25
+ transform: translateY(-5px);
26
+ box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
27
+ }
28
+
29
+ .nav-link:hover {
30
+ color: #8b5cf6;
31
+ }
32
+
33
+ .tag:hover {
34
+ background-color: #e0e7ff;
35
+ }
36
+
37
+ /* Custom scrollbar */
38
+ ::-webkit-scrollbar {
39
+ width: 8px;
40
+ }
41
+
42
+ ::-webkit-scrollbar-track {
43
+ background: #f1f1f1;
44
+ }
45
+
46
+ ::-webkit-scrollbar-thumb {
47
+ background: #8b5cf6;
48
+ border-radius: 4px;
49
+ }
50
+
51
+ ::-webkit-scrollbar-thumb:hover {
52
+ background: #7c3aed;
53
+ }
54
+ </style>
55
+ </head>
56
+ <body class="min-h-screen flex flex-col">
57
+ <!-- Navigation -->
58
+ <nav class="bg-white shadow-sm sticky top-0 z-50">
59
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
60
+ <div class="flex justify-between h-16">
61
+ <div class="flex items-center">
62
+ <div class="flex-shrink-0 flex items-center">
63
+ <span class="text-xl font-bold gradient-text">Conciencia Artificial</span>
64
+ </div>
65
+ <div class="hidden sm:ml-6 sm:flex sm:space-x-8">
66
+ <a href="#" class="nav-link border-indigo-500 text-gray-900 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Home</a>
67
+ <a href="#blog" class="nav-link border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">Blog</a>
68
+ <a href="#about" class="nav-link border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">About</a>
69
+ </div>
70
+ </div>
71
+ <div class="hidden sm:ml-6 sm:flex sm:items-center">
72
+ <button class="bg-gradient-to-r from-indigo-500 to-purple-600 text-white px-4 py-2 rounded-md text-sm font-medium hover:from-indigo-600 hover:to-purple-700 transition duration-150 ease-in-out">
73
+ Subscribe
74
+ </button>
75
+ </div>
76
+ <div class="-mr-2 flex items-center sm:hidden">
77
+ <button type="button" id="mobile-menu-button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500">
78
+ <span class="sr-only">Open main menu</span>
79
+ <i class="fas fa-bars"></i>
80
+ </button>
81
+ </div>
82
+ </div>
83
+ </div>
84
+
85
+ <!-- Mobile menu -->
86
+ <div id="mobile-menu" class="hidden sm:hidden bg-white shadow-md">
87
+ <div class="pt-2 pb-3 space-y-1">
88
+ <a href="#" class="bg-indigo-50 border-indigo-500 text-indigo-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Home</a>
89
+ <a href="#blog" class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Blog</a>
90
+ <a href="#about" class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">About</a>
91
+ <div class="mt-4 pl-3 pr-4 py-2">
92
+ <button class="w-full bg-gradient-to-r from-indigo-500 to-purple-600 text-white px-4 py-2 rounded-md text-sm font-medium hover:from-indigo-600 hover:to-purple-700 transition duration-150 ease-in-out">
93
+ Subscribe
94
+ </button>
95
+ </div>
96
+ </div>
97
+ </div>
98
+ </nav>
99
+
100
+ <!-- Hero Section -->
101
+ <header class="bg-gradient-to-r from-indigo-50 to-purple-50 py-16">
102
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
103
+ <div class="lg:grid lg:grid-cols-2 lg:gap-8 items-center">
104
+ <div class="mb-12 lg:mb-0">
105
+ <h1 class="text-4xl md:text-5xl font-bold text-gray-900 mb-6">
106
+ Exploring the <span class="gradient-text">Frontiers</span> of Artificial Intelligence
107
+ </h1>
108
+ <p class="text-lg text-gray-600 mb-8">
109
+ Conciencia Artificial brings you cutting-edge analysis, educational resources, and thoughtful perspectives on AI technologies shaping our future.
110
+ </p>
111
+ <div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4">
112
+ <a href="#blog" class="bg-gradient-to-r from-indigo-600 to-purple-700 text-white px-6 py-3 rounded-md text-sm font-medium hover:from-indigo-700 hover:to-purple-800 transition duration-150 ease-in-out text-center">
113
+ Explore Articles
114
+ </a>
115
+ <a href="#about" class="bg-white text-indigo-600 px-6 py-3 rounded-md text-sm font-medium hover:bg-gray-50 transition duration-150 ease-in-out shadow-sm text-center">
116
+ Learn About Us
117
+ </a>
118
+ </div>
119
+ </div>
120
+ <div class="relative">
121
+ <div class="absolute inset-0 bg-gradient-to-r from-indigo-100 to-purple-100 rounded-xl transform rotate-6"></div>
122
+ <div class="relative bg-white rounded-xl shadow-lg overflow-hidden">
123
+ <img src="https://images.unsplash.com/photo-1620712943543-bcc4688e7485?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1200&q=80" alt="AI Technology" class="w-full h-auto">
124
+ </div>
125
+ </div>
126
+ </div>
127
+ </div>
128
+ </header>
129
+
130
+ <!-- Featured Articles -->
131
+ <section id="blog" class="py-16 bg-white">
132
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
133
+ <div class="text-center mb-12">
134
+ <h2 class="text-3xl font-bold text-gray-900 mb-4">Featured Articles</h2>
135
+ <p class="text-lg text-gray-600 max-w-3xl mx-auto">
136
+ Dive into our latest insights on artificial intelligence, machine learning, and emerging technologies.
137
+ </p>
138
+ </div>
139
+
140
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
141
+ <!-- Article 1 -->
142
+ <article class="article-card bg-white rounded-lg overflow-hidden shadow-md transition duration-300 ease-in-out">
143
+ <div class="relative h-48 overflow-hidden">
144
+ <img src="https://images.unsplash.com/photo-1677442136019-21780ecad995?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=800&q=80" alt="Generative AI" class="w-full h-full object-cover">
145
+ <div class="absolute top-4 right-4">
146
+ <span class="bg-indigo-100 text-indigo-800 text-xs font-medium px-2.5 py-0.5 rounded-full">Education</span>
147
+ </div>
148
+ </div>
149
+ <div class="p-6">
150
+ <div class="flex items-center text-sm text-gray-500 mb-2">
151
+ <span>June 15, 2023</span>
152
+ <span class="mx-2">•</span>
153
+ <span>8 min read</span>
154
+ </div>
155
+ <h3 class="text-xl font-bold text-gray-900 mb-3">Understanding Generative AI: From GANs to Diffusion Models</h3>
156
+ <p class="text-gray-600 mb-4">
157
+ Explore the evolution of generative models and how they're transforming creative industries.
158
+ </p>
159
+ <div class="flex items-center">
160
+ <div class="flex-shrink-0">
161
+ <img class="h-10 w-10 rounded-full" src="https://randomuser.me/api/portraits/women/47.jpg" alt="Author">
162
+ </div>
163
+ <div class="ml-3">
164
+ <p class="text-sm font-medium text-gray-900">Dr. Elena Martinez</p>
165
+ <p class="text-sm text-gray-500">AI Researcher</p>
166
+ </div>
167
+ </div>
168
+ </div>
169
+ </article>
170
+
171
+ <!-- Article 2 -->
172
+ <article class="article-card bg-white rounded-lg overflow-hidden shadow-md transition duration-300 ease-in-out">
173
+ <div class="relative h-48 overflow-hidden">
174
+ <img src="https://images.unsplash.com/photo-1629904853893-c2c8981a1dc5?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=800&q=80" alt="AI Ethics" class="w-full h-full object-cover">
175
+ <div class="absolute top-4 right-4">
176
+ <span class="bg-purple-100 text-purple-800 text-xs font-medium px-2.5 py-0.5 rounded-full">Analysis</span>
177
+ </div>
178
+ </div>
179
+ <div class="p-6">
180
+ <div class="flex items-center text-sm text-gray-500 mb-2">
181
+ <span>June 8, 2023</span>
182
+ <span class="mx-2">•</span>
183
+ <span>12 min read</span>
184
+ </div>
185
+ <h3 class="text-xl font-bold text-gray-900 mb-3">The Ethical Implications of Large Language Models</h3>
186
+ <p class="text-gray-600 mb-4">
187
+ A deep dive into the challenges and responsibilities surrounding AI systems that can generate human-like text.
188
+ </p>
189
+ <div class="flex items-center">
190
+ <div class="flex-shrink-0">
191
+ <img class="h-10 w-10 rounded-full" src="https://randomuser.me/api/portraits/men/32.jpg" alt="Author">
192
+ </div>
193
+ <div class="ml-3">
194
+ <p class="text-sm font-medium text-gray-900">Prof. James Wilson</p>
195
+ <p class="text-sm text-gray-500">Ethics Specialist</p>
196
+ </div>
197
+ </div>
198
+ </div>
199
+ </article>
200
+
201
+ <!-- Article 3 -->
202
+ <article class="article-card bg-white rounded-lg overflow-hidden shadow-md transition duration-300 ease-in-out">
203
+ <div class="relative h-48 overflow-hidden">
204
+ <img src="https://images.unsplash.com/photo-1677442135453-3ffa9f4cae48?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=800&q=80" alt="AI News" class="w-full h-full object-cover">
205
+ <div class="absolute top-4 right-4">
206
+ <span class="bg-blue-100 text-blue-800 text-xs font-medium px-2.5 py-0.5 rounded-full">News</span>
207
+ </div>
208
+ </div>
209
+ <div class="p-6">
210
+ <div class="flex items-center text-sm text-gray-500 mb-2">
211
+ <span>June 1, 2023</span>
212
+ <span class="mx-2">•</span>
213
+ <span>6 min read</span>
214
+ </div>
215
+ <h3 class="text-xl font-bold text-gray-900 mb-3">Breakthrough in Multimodal AI: What It Means for the Future</h3>
216
+ <p class="text-gray-600 mb-4">
217
+ The latest advancements in AI systems that can process multiple data types simultaneously and their potential applications.
218
+ </p>
219
+ <div class="flex items-center">
220
+ <div class="flex-shrink-0">
221
+ <img class="h-10 w-10 rounded-full" src="https://randomuser.me/api/portraits/women/68.jpg" alt="Author">
222
+ </div>
223
+ <div class="ml-3">
224
+ <p class="text-sm font-medium text-gray-900">Sarah Chen</p>
225
+ <p class="text-sm text-gray-500">Tech Journalist</p>
226
+ </div>
227
+ </div>
228
+ </div>
229
+ </article>
230
+ </div>
231
+
232
+ <div class="mt-12 text-center">
233
+ <a href="#" class="inline-flex items-center px-6 py-3 border border-gray-300 shadow-sm text-base font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
234
+ View All Articles
235
+ <i class="fas fa-arrow-right ml-2"></i>
236
+ </a>
237
+ </div>
238
+ </div>
239
+ </section>
240
+
241
+ <!-- Categories Section -->
242
+ <section class="py-16 bg-gray-50">
243
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
244
+ <div class="text-center mb-12">
245
+ <h2 class="text-3xl font-bold text-gray-900 mb-4">Explore by Category</h2>
246
+ <p class="text-lg text-gray-600 max-w-3xl mx-auto">
247
+ Discover content tailored to your interests in artificial intelligence.
248
+ </p>
249
+ </div>
250
+
251
+ <div class="grid grid-cols-2 md:grid-cols-4 gap-6">
252
+ <a href="#" class="category-card bg-white p-6 rounded-lg shadow-sm hover:shadow-md transition duration-300 ease-in-out text-center">
253
+ <div class="mx-auto h-12 w-12 flex items-center justify-center rounded-full bg-indigo-100 text-indigo-600 mb-4">
254
+ <i class="fas fa-newspaper text-xl"></i>
255
+ </div>
256
+ <h3 class="text-lg font-medium text-gray-900 mb-2">News</h3>
257
+ <p class="text-sm text-gray-500">Latest developments in AI</p>
258
+ </a>
259
+
260
+ <a href="#" class="category-card bg-white p-6 rounded-lg shadow-sm hover:shadow-md transition duration-300 ease-in-out text-center">
261
+ <div class="mx-auto h-12 w-12 flex items-center justify-center rounded-full bg-purple-100 text-purple-600 mb-4">
262
+ <i class="fas fa-chart-line text-xl"></i>
263
+ </div>
264
+ <h3 class="text-lg font-medium text-gray-900 mb-2">Analysis</h3>
265
+ <p class="text-sm text-gray-500">In-depth technical reviews</p>
266
+ </a>
267
+
268
+ <a href="#" class="category-card bg-white p-6 rounded-lg shadow-sm hover:shadow-md transition duration-300 ease-in-out text-center">
269
+ <div class="mx-auto h-12 w-12 flex items-center justify-center rounded-full bg-blue-100 text-blue-600 mb-4">
270
+ <i class="fas fa-graduation-cap text-xl"></i>
271
+ </div>
272
+ <h3 class="text-lg font-medium text-gray-900 mb-2">Education</h3>
273
+ <p class="text-sm text-gray-500">Learn AI concepts</p>
274
+ </a>
275
+
276
+ <a href="#" class="category-card bg-white p-6 rounded-lg shadow-sm hover:shadow-md transition duration-300 ease-in-out text-center">
277
+ <div class="mx-auto h-12 w-12 flex items-center justify-center rounded-full bg-green-100 text-green-600 mb-4">
278
+ <i class="fas fa-lightbulb text-xl"></i>
279
+ </div>
280
+ <h3 class="text-lg font-medium text-gray-900 mb-2">Innovation</h3>
281
+ <p class="text-sm text-gray-500">Emerging technologies</p>
282
+ </a>
283
+ </div>
284
+ </div>
285
+ </section>
286
+
287
+ <!-- About Section -->
288
+ <section id="about" class="py-16 bg-white">
289
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
290
+ <div class="lg:grid lg:grid-cols-2 lg:gap-12 items-center">
291
+ <div class="mb-12 lg:mb-0">
292
+ <div class="relative">
293
+ <div class="absolute inset-0 bg-gradient-to-r from-indigo-100 to-purple-100 rounded-xl transform -rotate-3"></div>
294
+ <div class="relative bg-white rounded-xl shadow-lg overflow-hidden">
295
+ <img src="https://images.unsplash.com/photo-1571171637578-41bc2dd41cd2?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=800&q=80" alt="About Conciencia Artificial" class="w-full h-auto">
296
+ </div>
297
+ </div>
298
+ </div>
299
+ <div>
300
+ <h2 class="text-3xl font-bold text-gray-900 mb-6">About Conciencia Artificial</h2>
301
+ <p class="text-lg text-gray-600 mb-6">
302
+ Founded with a vision to democratize AI knowledge, Conciencia Artificial is a leading educational platform dedicated to exploring the frontiers of artificial intelligence.
303
+ </p>
304
+ <p class="text-lg text-gray-600 mb-6">
305
+ Our mission is to bridge the gap between cutting-edge AI research and practical applications, making complex concepts accessible to developers, enthusiasts, and professionals alike.
306
+ </p>
307
+ <div class="bg-indigo-50 p-6 rounded-lg mb-6">
308
+ <div class="flex">
309
+ <div class="flex-shrink-0">
310
+ <i class="fas fa-award text-indigo-600 text-2xl"></i>
311
+ </div>
312
+ <div class="ml-3">
313
+ <h3 class="text-lg font-medium text-indigo-800 mb-1">Recognized by Alibaba</h3>
314
+ <p class="text-indigo-700">
315
+ Proud recipient of the Alibaba MVP award for contributions to AI education and innovation.
316
+ </p>
317
+ </div>
318
+ </div>
319
+ </div>
320
+ <div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4">
321
+ <a href="#" class="bg-gradient-to-r from-indigo-600 to-purple-700 text-white px-6 py-3 rounded-md text-sm font-medium hover:from-indigo-700 hover:to-purple-800 transition duration-150 ease-in-out text-center">
322
+ Our Story
323
+ </a>
324
+ <a href="#" class="bg-white text-indigo-600 px-6 py-3 rounded-md text-sm font-medium hover:bg-gray-50 transition duration-150 ease-in-out shadow-sm text-center border border-gray-300">
325
+ Meet the Team
326
+ </a>
327
+ </div>
328
+ </div>
329
+ </div>
330
+ </div>
331
+ </section>
332
+
333
+ <!-- Newsletter -->
334
+ <section class="py-16 bg-gradient-to-r from-indigo-500 to-purple-600">
335
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
336
+ <div class="lg:grid lg:grid-cols-2 lg:gap-12 items-center">
337
+ <div class="mb-12 lg:mb-0">
338
+ <h2 class="text-3xl font-bold text-white mb-4">Stay Updated</h2>
339
+ <p class="text-lg text-indigo-100 mb-6">
340
+ Subscribe to our newsletter for the latest articles, research summaries, and AI insights delivered to your inbox.
341
+ </p>
342
+ <div class="flex items-center">
343
+ <div class="flex-shrink-0 bg-indigo-100 rounded-full p-2">
344
+ <i class="fas fa-envelope-open-text text-indigo-600 text-xl"></i>
345
+ </div>
346
+ <div class="ml-3">
347
+ <p class="text-sm text-indigo-100">Join 10,000+ AI enthusiasts</p>
348
+ </div>
349
+ </div>
350
+ </div>
351
+ <div>
352
+ <form class="space-y-4">
353
+ <div>
354
+ <label for="email" class="sr-only">Email address</label>
355
+ <input id="email" name="email" type="email" autocomplete="email" required class="w-full px-5 py-3 placeholder-gray-500 focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm border-gray-300 rounded-md" placeholder="Enter your email">
356
+ </div>
357
+ <div class="flex items-center">
358
+ <input id="terms" name="terms" type="checkbox" class="h-4 w-4 text-indigo-600 focus:ring-indigo-500 border-gray-300 rounded">
359
+ <label for="terms" class="ml-2 block text-sm text-indigo-100">
360
+ I agree to receive emails and accept the <a href="#" class="font-medium text-white hover:text-indigo-200">privacy policy</a>
361
+ </label>
362
+ </div>
363
+ <div>
364
+ <button type="submit" class="w-full flex justify-center items-center px-5 py-3 border border-transparent text-base font-medium rounded-md text-indigo-600 bg-white hover:bg-indigo-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
365
+ Subscribe
366
+ <i class="fas fa-paper-plane ml-2"></i>
367
+ </button>
368
+ </div>
369
+ </form>
370
+ </div>
371
+ </div>
372
+ </div>
373
+ </section>
374
+
375
+ <!-- Footer -->
376
+ <footer class="bg-gray-900 text-white pt-16 pb-8">
377
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
378
+ <div class="grid grid-cols-2 md:grid-cols-4 gap-8">
379
+ <div class="col-span-2">
380
+ <h3 class="text-xl font-bold gradient-text mb-4">Conciencia Artificial</h3>
381
+ <p class="text-gray-400 mb-6">
382
+ Exploring the frontiers of artificial intelligence through education, analysis, and thoughtful discussion.
383
+ </p>
384
+ <div class="flex space-x-6">
385
+ <a href="#" class="text-gray-400 hover:text-white">
386
+ <i class="fab fa-twitter text-xl"></i>
387
+ </a>
388
+ <a href="#" class="text-gray-400 hover:text-white">
389
+ <i class="fab fa-linkedin text-xl"></i>
390
+ </a>
391
+ <a href="#" class="text-gray-400 hover:text-white">
392
+ <i class="fab fa-github text-xl"></i>
393
+ </a>
394
+ <a href="#" class="text-gray-400 hover:text-white">
395
+ <i class="fab fa-youtube text-xl"></i>
396
+ </a>
397
+ </div>
398
+ </div>
399
+ <div>
400
+ <h3 class="text-sm font-semibold text-gray-300 tracking-wider uppercase mb-4">Navigation</h3>
401
+ <ul class="space-y-3">
402
+ <li><a href="#" class="text-gray-400 hover:text-white">Home</a></li>
403
+ <li><a href="#blog" class="text-gray-400 hover:text-white">Blog</a></li>
404
+ <li><a href="#about" class="text-gray-400 hover:text-white">About</a></li>
405
+ <li><a href="#" class="text-gray-400 hover:text-white">Categories</a></li>
406
+ <li><a href="#" class="text-gray-400 hover:text-white">Contact</a></li>
407
+ </ul>
408
+ </div>
409
+ <div>
410
+ <h3 class="text-sm font-semibold text-gray-300 tracking-wider uppercase mb-4">Legal</h3>
411
+ <ul class="space-y-3">
412
+ <li><a href="#" class="text-gray-400 hover:text-white">Privacy Policy</a></li>
413
+ <li><a href="#" class="text-gray-400 hover:text-white">Terms of Service</a></li>
414
+ <li><a href="#" class="text-gray-400 hover:text-white">Cookie Policy</a></li>
415
+ <li><a href="#" class="text-gray-400 hover:text-white">GDPR</a></li>
416
+ </ul>
417
+ </div>
418
+ </div>
419
+ <div class="mt-12 pt-8 border-t border-gray-800">
420
+ <p class="text-gray-400 text-sm text-center">
421
+ &copy; 2023 Conciencia Artificial. All rights reserved.
422
+ </p>
423
+ </div>
424
+ </div>
425
+ </footer>
426
+
427
+ <script>
428
+ // Mobile menu toggle
429
+ document.getElementById('mobile-menu-button').addEventListener('click', function() {
430
+ const menu = document.getElementById('mobile-menu');
431
+ menu.classList.toggle('hidden');
432
+ });
433
+
434
+ // Smooth scrolling for anchor links
435
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
436
+ anchor.addEventListener('click', function (e) {
437
+ e.preventDefault();
438
+
439
+ const targetId = this.getAttribute('href');
440
+ if (targetId === '#') return;
441
+
442
+ const targetElement = document.querySelector(targetId);
443
+ if (targetElement) {
444
+ targetElement.scrollIntoView({
445
+ behavior: 'smooth'
446
+ });
447
+
448
+ // Close mobile menu if open
449
+ const mobileMenu = document.getElementById('mobile-menu');
450
+ if (!mobileMenu.classList.contains('hidden')) {
451
+ mobileMenu.classList.add('hidden');
452
+ }
453
+ }
454
+ });
455
+ });
456
+
457
+ // Add shadow to navbar on scroll
458
+ window.addEventListener('scroll', function() {
459
+ const nav = document.querySelector('nav');
460
+ if (window.scrollY > 10) {
461
+ nav.classList.add('shadow-lg');
462
+ nav.classList.remove('shadow-sm');
463
+ } else {
464
+ nav.classList.remove('shadow-lg');
465
+ nav.classList.add('shadow-sm');
466
+ }
467
+ });
468
+ </script>
469
+ <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=Backtun/conciencia-artificial-testing" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
470
+ </html>