Hugging Face's logo

Spaces:
XXXMARK
/
arkep
Running

App Files Community
XXXMARK commited on
Commit
fdedcb4
·
verified ·
1 Parent(s): ec823ed

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +517 -19
  3. prompts.txt +0 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Arkep
3
- emoji: 🚀
4
- colorFrom: yellow
5
- colorTo: green
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: arkep
3
+ emoji: 🐳
4
+ colorFrom: green
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,517 @@
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>Arkep | Creative Solutions</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
+ color: #1a1a1a;
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
+ .card-hover {
25
+ transition: all 0.3s ease;
26
+ }
27
+
28
+ .card-hover:hover {
29
+ transform: translateY(-5px);
30
+ box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1);
31
+ }
32
+
33
+ .section-divider {
34
+ height: 1px;
35
+ background: linear-gradient(90deg, transparent, rgba(0,0,0,0.1), transparent);
36
+ }
37
+ </style>
38
+ </head>
39
+ <body class="bg-white">
40
+ <!-- Navigation -->
41
+ <nav class="py-6 px-4 md:px-8 lg:px-12">
42
+ <div class="max-w-7xl mx-auto flex justify-between items-center">
43
+ <div class="text-2xl font-bold">
44
+ <span class="gradient-text">ARKEP</span>
45
+ </div>
46
+ <div class="hidden md:flex space-x-8">
47
+ <a href="#services" class="text-gray-600 hover:text-gray-900 transition">Services</a>
48
+ <a href="#approach" class="text-gray-600 hover:text-gray-900 transition">Approach</a>
49
+ <a href="#testimonials" class="text-gray-600 hover:text-gray-900 transition">Testimonials</a>
50
+ <a href="#contact" class="text-gray-600 hover:text-gray-900 transition">Contact</a>
51
+ </div>
52
+ <button class="md:hidden text-gray-600">
53
+ <i class="fas fa-bars text-xl"></i>
54
+ </button>
55
+ </div>
56
+ </nav>
57
+
58
+ <!-- Hero Section -->
59
+ <section class="py-20 px-4 md:px-8 lg:px-12">
60
+ <div class="max-w-4xl mx-auto text-center">
61
+ <h1 class="text-4xl md:text-5xl lg:text-6xl font-light leading-tight mb-6">
62
+ Transforming <span class="gradient-text">Ideas</span> into<br>Innovative Solutions
63
+ </h1>
64
+ <p class="text-xl text-gray-600 mb-10 max-w-2xl mx-auto">
65
+ We help visionary thinkers turn their concepts into reality through creativity and cutting-edge technology.
66
+ </p>
67
+ <div class="flex flex-col sm:flex-row justify-center gap-4">
68
+ <button class="bg-gray-900 hover:bg-gray-800 text-white px-8 py-3 rounded-full font-medium transition">
69
+ Get Started
70
+ </button>
71
+ <button class="border border-gray-300 hover:border-gray-400 text-gray-800 px-8 py-3 rounded-full font-medium transition">
72
+ Learn More
73
+ </button>
74
+ </div>
75
+ </div>
76
+ </section>
77
+
78
+ <div class="section-divider my-12"></div>
79
+
80
+ <!-- Stats Section -->
81
+ <section class="py-16 px-4 md:px-8 lg:px-12">
82
+ <div class="max-w-6xl mx-auto">
83
+ <h2 class="text-3xl font-light text-center mb-16">
84
+ Why <span class="gradient-text">Choose</span> Arkep?
85
+ </h2>
86
+
87
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
88
+ <div class="bg-gray-50 p-8 rounded-xl card-hover">
89
+ <div class="text-5xl font-light mb-4 gradient-text">85%</div>
90
+ <h3 class="text-xl font-medium mb-3">Client Satisfaction</h3>
91
+ <p class="text-gray-600">
92
+ Our clients consistently rate their experience with us as exceptional, with 85% satisfaction across all projects.
93
+ </p>
94
+ </div>
95
+
96
+ <div class="bg-gray-50 p-8 rounded-xl card-hover">
97
+ <div class="text-5xl font-light mb-4 gradient-text">95%</div>
98
+ <h3 class="text-xl font-medium mb-3">On-Time Delivery</h3>
99
+ <p class="text-gray-600">
100
+ We meet deadlines with precision - 95% of our projects are delivered on time without compromising quality.
101
+ </p>
102
+ </div>
103
+
104
+ <div class="bg-gray-50 p-8 rounded-xl card-hover">
105
+ <div class="text-5xl font-light mb-4 gradient-text">90%</div>
106
+ <h3 class="text-xl font-medium mb-3">Return Clients</h3>
107
+ <p class="text-gray-600">
108
+ The majority of our clients return for additional projects, a testament to our lasting partnerships.
109
+ </p>
110
+ </div>
111
+ </div>
112
+ </div>
113
+ </section>
114
+
115
+ <div class="section-divider my-12"></div>
116
+
117
+ <!-- Approach Section -->
118
+ <section id="approach" class="py-16 px-4 md:px-8 lg:px-12">
119
+ <div class="max-w-6xl mx-auto">
120
+ <div class="flex flex-col lg:flex-row items-center gap-12">
121
+ <div class="lg:w-1/2">
122
+ <h2 class="text-3xl font-light mb-6">
123
+ How We Can <span class="gradient-text">Help</span> You
124
+ </h2>
125
+ <p class="text-lg text-gray-600 mb-8">
126
+ At Arkep, we're dedicated to your success. Our tailored solutions fit your unique needs, helping you explore opportunities, spark creativity, and drive meaningful growth.
127
+ </p>
128
+ <div class="space-y-6">
129
+ <div class="flex items-start gap-4">
130
+ <div class="mt-1 text-blue-500">
131
+ <i class="fas fa-check-circle text-xl"></i>
132
+ </div>
133
+ <div>
134
+ <h3 class="font-medium">Customized Solutions</h3>
135
+ <p class="text-gray-600">Approaches designed specifically for your challenges</p>
136
+ </div>
137
+ </div>
138
+ <div class="flex items-start gap-4">
139
+ <div class="mt-1 text-blue-500">
140
+ <i class="fas fa-check-circle text-xl"></i>
141
+ </div>
142
+ <div>
143
+ <h3 class="font-medium">Expert Guidance</h3>
144
+ <p class="text-gray-600">Seasoned professionals to navigate complex problems</p>
145
+ </div>
146
+ </div>
147
+ <div class="flex items-start gap-4">
148
+ <div class="mt-1 text-blue-500">
149
+ <i class="fas fa-check-circle text-xl"></i>
150
+ </div>
151
+ <div>
152
+ <h3 class="font-medium">Sustainable Results</h3>
153
+ <p class="text-gray-600">Solutions that deliver lasting impact</p>
154
+ </div>
155
+ </div>
156
+ </div>
157
+ </div>
158
+
159
+ <div class="lg:w-1/2 bg-gray-50 rounded-xl p-8">
160
+ <h3 class="text-xl font-medium mb-4">Our Process</h3>
161
+ <div class="space-y-6">
162
+ <div class="flex gap-4">
163
+ <div class="flex flex-col items-center">
164
+ <div class="w-8 h-8 rounded-full bg-blue-500 text-white flex items-center justify-center">1</div>
165
+ <div class="w-0.5 h-12 bg-gray-200"></div>
166
+ </div>
167
+ <div>
168
+ <h4 class="font-medium">Discovery</h4>
169
+ <p class="text-gray-600">Deep dive into your needs and objectives</p>
170
+ </div>
171
+ </div>
172
+ <div class="flex gap-4">
173
+ <div class="flex flex-col items-center">
174
+ <div class="w-8 h-8 rounded-full bg-blue-500 text-white flex items-center justify-center">2</div>
175
+ <div class="w-0.5 h-12 bg-gray-200"></div>
176
+ </div>
177
+ <div>
178
+ <h4 class="font-medium">Strategy</h4>
179
+ <p class="text-gray-600">Developing the optimal approach</p>
180
+ </div>
181
+ </div>
182
+ <div class="flex gap-4">
183
+ <div class="flex flex-col items-center">
184
+ <div class="w-8 h-8 rounded-full bg-blue-500 text-white flex items-center justify-center">3</div>
185
+ <div class="w-0.5 h-12 bg-gray-200"></div>
186
+ </div>
187
+ <div>
188
+ <h4 class="font-medium">Execution</h4>
189
+ <p class="text-gray-600">Implementing with precision and care</p>
190
+ </div>
191
+ </div>
192
+ <div class="flex gap-4">
193
+ <div class="flex flex-col items-center">
194
+ <div class="w-8 h-8 rounded-full bg-blue-500 text-white flex items-center justify-center">4</div>
195
+ </div>
196
+ <div>
197
+ <h4 class="font-medium">Iteration</h4>
198
+ <p class="text-gray-600">Refining based on feedback and results</p>
199
+ </div>
200
+ </div>
201
+ </div>
202
+ </div>
203
+ </div>
204
+ </div>
205
+ </section>
206
+
207
+ <div class="section-divider my-12"></div>
208
+
209
+ <!-- Services Section -->
210
+ <section id="services" class="py-16 px-4 md:px-8 lg:px-12">
211
+ <div class="max-w-6xl mx-auto">
212
+ <h2 class="text-3xl font-light text-center mb-16">
213
+ Our <span class="gradient-text">Services</span>
214
+ </h2>
215
+
216
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
217
+ <div class="bg-gray-50 p-8 rounded-xl card-hover">
218
+ <div class="w-12 h-12 rounded-full bg-blue-100 text-blue-600 flex items-center justify-center mb-4">
219
+ <i class="fas fa-code text-xl"></i>
220
+ </div>
221
+ <h3 class="text-xl font-medium mb-3">Custom Software</h3>
222
+ <p class="text-gray-600 mb-4">
223
+ Tailor-made software solutions designed to meet your specific needs and drive your success forward.
224
+ </p>
225
+ <a href="#" class="text-blue-600 hover:text-blue-800 font-medium inline-flex items-center">
226
+ Learn more <i class="fas fa-arrow-right ml-2"></i>
227
+ </a>
228
+ </div>
229
+
230
+ <div class="bg-gray-50 p-8 rounded-xl card-hover">
231
+ <div class="w-12 h-12 rounded-full bg-purple-100 text-purple-600 flex items-center justify-center mb-4">
232
+ <i class="fas fa-robot text-xl"></i>
233
+ </div>
234
+ <h3 class="text-xl font-medium mb-3">AI Integration</h3>
235
+ <p class="text-gray-600 mb-4">
236
+ Seamlessly integrate AI tools to enhance your processes and boost efficiency in your business operations.
237
+ </p>
238
+ <a href="#" class="text-blue-600 hover:text-blue-800 font-medium inline-flex items-center">
239
+ Learn more <i class="fas fa-arrow-right ml-2"></i>
240
+ </a>
241
+ </div>
242
+
243
+ <div class="bg-gray-50 p-8 rounded-xl card-hover">
244
+ <div class="w-12 h-12 rounded-full bg-indigo-100 text-indigo-600 flex items-center justify-center mb-4">
245
+ <i class="fas fa-laptop-code text-xl"></i>
246
+ </div>
247
+ <h3 class="text-xl font-medium mb-3">Digital Platforms</h3>
248
+ <p class="text-gray-600 mb-4">
249
+ Engaging digital platforms that connect users and enhance experiences through innovative design.
250
+ </p>
251
+ <a href="#" class="text-blue-600 hover:text-blue-800 font-medium inline-flex items-center">
252
+ Learn more <i class="fas fa-arrow-right ml-2"></i>
253
+ </a>
254
+ </div>
255
+
256
+ <div class="bg-gray-50 p-8 rounded-xl card-hover">
257
+ <div class="w-12 h-12 rounded-full bg-pink-100 text-pink-600 flex items-center justify-center mb-4">
258
+ <i class="fas fa-theater-masks text-xl"></i>
259
+ </div>
260
+ <h3 class="text-xl font-medium mb-3">Performance Arts</h3>
261
+ <p class="text-gray-600 mb-4">
262
+ Captivating performance arts that inspire, entertain, and celebrate cultural diversity.
263
+ </p>
264
+ <a href="#" class="text-blue-600 hover:text-blue-800 font-medium inline-flex items-center">
265
+ Learn more <i class="fas fa-arrow-right ml-2"></i>
266
+ </a>
267
+ </div>
268
+
269
+ <div class="bg-gray-50 p-8 rounded-xl card-hover">
270
+ <div class="w-12 h-12 rounded-full bg-yellow-100 text-yellow-600 flex items-center justify-center mb-4">
271
+ <i class="fas fa-music text-xl"></i>
272
+ </div>
273
+ <h3 class="text-xl font-medium mb-3">Music Production</h3>
274
+ <p class="text-gray-600 mb-4">
275
+ Bring your musical vision to life with services that capture your unique sound and style.
276
+ </p>
277
+ <a href="#" class="text-blue-600 hover:text-blue-800 font-medium inline-flex items-center">
278
+ Learn more <i class="fas fa-arrow-right ml-2"></i>
279
+ </a>
280
+ </div>
281
+
282
+ <div class="bg-gray-50 p-8 rounded-xl card-hover">
283
+ <div class="w-12 h-12 rounded-full bg-green-100 text-green-600 flex items-center justify-center mb-4">
284
+ <i class="fas fa-chart-line text-xl"></i>
285
+ </div>
286
+ <h3 class="text-xl font-medium mb-3">Consulting Services</h3>
287
+ <p class="text-gray-600 mb-4">
288
+ Expert guidance to help you achieve your business and personal goals with confidence.
289
+ </p>
290
+ <a href="#" class="text-blue-600 hover:text-blue-800 font-medium inline-flex items-center">
291
+ Learn more <i class="fas fa-arrow-right ml-2"></i>
292
+ </a>
293
+ </div>
294
+ </div>
295
+ </div>
296
+ </section>
297
+
298
+ <div class="section-divider my-12"></div>
299
+
300
+ <!-- Testimonials Section -->
301
+ <section id="testimonials" class="py-16 px-4 md:px-8 lg:px-12 bg-gray-50">
302
+ <div class="max-w-6xl mx-auto">
303
+ <h2 class="text-3xl font-light text-center mb-16">
304
+ What Our <span class="gradient-text">Clients</span> Say
305
+ </h2>
306
+
307
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
308
+ <div class="bg-white p-8 rounded-xl shadow-sm card-hover">
309
+ <div class="flex mb-4 text-yellow-400">
310
+ <i class="fas fa-star"></i>
311
+ <i class="fas fa-star"></i>
312
+ <i class="fas fa-star"></i>
313
+ <i class="fas fa-star"></i>
314
+ <i class="fas fa-star"></i>
315
+ </div>
316
+ <p class="text-gray-600 mb-6">
317
+ "Arkep transformed our vision into reality! Their innovative approach made all the difference for our project."
318
+ </p>
319
+ <div class="flex items-center">
320
+ <div class="w-10 h-10 rounded-full bg-gray-200 flex items-center justify-center mr-3">
321
+ <i class="fas fa-user text-gray-500"></i>
322
+ </div>
323
+ <div>
324
+ <h4 class="font-medium">Jordan Smith</h4>
325
+ <p class="text-sm text-gray-500">CEO, TechCorp</p>
326
+ </div>
327
+ </div>
328
+ </div>
329
+
330
+ <div class="bg-white p-8 rounded-xl shadow-sm card-hover">
331
+ <div class="flex mb-4 text-yellow-400">
332
+ <i class="fas fa-star"></i>
333
+ <i class="fas fa-star"></i>
334
+ <i class="fas fa-star"></i>
335
+ <i class="fas fa-star"></i>
336
+ <i class="fas fa-star"></i>
337
+ </div>
338
+ <p class="text-gray-600 mb-6">
339
+ "The team at Arkep exceeded our expectations! Their support and creativity were invaluable to our success."
340
+ </p>
341
+ <div class="flex items-center">
342
+ <div class="w-10 h-10 rounded-full bg-gray-200 flex items-center justify-center mr-3">
343
+ <i class="fas fa-user text-gray-500"></i>
344
+ </div>
345
+ <div>
346
+ <h4 class="font-medium">Emily Johnson</h4>
347
+ <p class="text-sm text-gray-500">Marketing Director</p>
348
+ </div>
349
+ </div>
350
+ </div>
351
+
352
+ <div class="bg-white p-8 rounded-xl shadow-sm card-hover">
353
+ <div class="flex mb-4 text-yellow-400">
354
+ <i class="fas fa-star"></i>
355
+ <i class="fas fa-star"></i>
356
+ <i class="fas fa-star"></i>
357
+ <i class="fas fa-star"></i>
358
+ <i class="fas fa-star"></i>
359
+ </div>
360
+ <p class="text-gray-600 mb-6">
361
+ "Working with Arkep was a game-changer! Their insights and solutions helped us grow beyond our goals."
362
+ </p>
363
+ <div class="flex items-center">
364
+ <div class="w-10 h-10 rounded-full bg-gray-200 flex items-center justify-center mr-3">
365
+ <i class="fas fa-user text-gray-500"></i>
366
+ </div>
367
+ <div>
368
+ <h4 class="font-medium">Michael Lee</h4>
369
+ <p class="text-sm text-gray-500">Founder, StartupX</p>
370
+ </div>
371
+ </div>
372
+ </div>
373
+ </div>
374
+ </div>
375
+ </section>
376
+
377
+ <div class="section-divider my-12"></div>
378
+
379
+ <!-- CTA Section -->
380
+ <section class="py-20 px-4 md:px-8 lg:px-12 bg-gradient-to-r from-blue-500 to-purple-600 text-white">
381
+ <div class="max-w-4xl mx-auto text-center">
382
+ <h2 class="text-3xl md:text-4xl font-light mb-6">
383
+ Ready to Transform Your Ideas into Reality?
384
+ </h2>
385
+ <p class="text-xl mb-8 opacity-90">
386
+ Let's create something amazing together. Get started with Arkep today.
387
+ </p>
388
+ <button class="bg-white text-gray-900 hover:bg-gray-100 px-8 py-3 rounded-full font-medium transition shadow-lg">
389
+ Get Started
390
+ </button>
391
+ </div>
392
+ </section>
393
+
394
+ <!-- Contact Section -->
395
+ <section id="contact" class="py-16 px-4 md:px-8 lg:px-12">
396
+ <div class="max-w-4xl mx-auto">
397
+ <h2 class="text-3xl font-light text-center mb-16">
398
+ Get in <span class="gradient-text">Touch</span>
399
+ </h2>
400
+
401
+ <div class="bg-white rounded-xl shadow-sm p-8">
402
+ <form>
403
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-6">
404
+ <div>
405
+ <label for="name" class="block text-sm font-medium text-gray-700 mb-1">Name</label>
406
+ <input type="text" id="name" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
407
+ </div>
408
+ <div>
409
+ <label for="email" class="block text-sm font-medium text-gray-700 mb-1">Email</label>
410
+ <input type="email" id="email" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
411
+ </div>
412
+ </div>
413
+ <div class="mb-6">
414
+ <label for="subject" class="block text-sm font-medium text-gray-700 mb-1">Subject</label>
415
+ <input type="text" id="subject" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
416
+ </div>
417
+ <div class="mb-6">
418
+ <label for="message" class="block text-sm font-medium text-gray-700 mb-1">Message</label>
419
+ <textarea id="message" rows="4" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"></textarea>
420
+ </div>
421
+ <button type="submit" class="bg-gray-900 hover:bg-gray-800 text-white px-8 py-3 rounded-full font-medium transition w-full md:w-auto">
422
+ Send Message
423
+ </button>
424
+ </form>
425
+ </div>
426
+ </div>
427
+ </section>
428
+
429
+ <!-- Footer -->
430
+ <footer class="bg-gray-900 text-white py-12 px-4 md:px-8 lg:px-12">
431
+ <div class="max-w-7xl mx-auto">
432
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
433
+ <div>
434
+ <h3 class="text-xl font-bold mb-4 gradient-text">ARKEP</h3>
435
+ <p class="text-gray-400">
436
+ Transforming ideas into innovative solutions through creativity and technology.
437
+ </p>
438
+ </div>
439
+ <div>
440
+ <h4 class="text-lg font-medium mb-4">Services</h4>
441
+ <ul class="space-y-2">
442
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Custom Software</a></li>
443
+ <li><a href="#" class="text-gray-400 hover:text-white transition">AI Integration</a></li>
444
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Digital Platforms</a></li>
445
+ </ul>
446
+ </div>
447
+ <div>
448
+ <h4 class="text-lg font-medium mb-4">Company</h4>
449
+ <ul class="space-y-2">
450
+ <li><a href="#" class="text-gray-400 hover:text-white transition">About Us</a></li>
451
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Our Approach</a></li>
452
+ <li><a href="#" class="text-gray-400 hover:text-white transition">Careers</a></li>
453
+ </ul>
454
+ </div>
455
+ <div>
456
+ <h4 class="text-lg font-medium mb-4">Connect</h4>
457
+ <div class="flex space-x-4 mb-4">
458
+ <a href="#" class="text-gray-400 hover:text-white transition"><i class="fab fa-twitter text-xl"></i></a>
459
+ <a href="#" class="text-gray-400 hover:text-white transition"><i class="fab fa-linkedin-in text-xl"></i></a>
460
+ <a href="#" class="text-gray-400 hover:text-white transition"><i class="fab fa-instagram text-xl"></i></a>
461
+ <a href="#" class="text-gray-400 hover:text-white transition"><i class="fab fa-github text-xl"></i></a>
462
+ </div>
463
+ <p class="text-gray-400">
464
+ [email protected]<br>
465
+ +1 (555) 123-4567
466
+ </p>
467
+ </div>
468
+ </div>
469
+ <div class="border-t border-gray-800 mt-12 pt-8 text-center text-gray-400">
470
+ <p>&copy; 2023 Arkep. All rights reserved.</p>
471
+ </div>
472
+ </div>
473
+ </footer>
474
+
475
+ <script>
476
+ // Simple JavaScript for demonstration
477
+ document.addEventListener('DOMContentLoaded', function() {
478
+ // Smooth scrolling for anchor links
479
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
480
+ anchor.addEventListener('click', function (e) {
481
+ e.preventDefault();
482
+
483
+ document.querySelector(this.getAttribute('href')).scrollIntoView({
484
+ behavior: 'smooth'
485
+ });
486
+ });
487
+ });
488
+
489
+ // Animation for elements when they come into view
490
+ const animateOnScroll = function() {
491
+ const elements = document.querySelectorAll('.card-hover');
492
+
493
+ elements.forEach(element => {
494
+ const elementPosition = element.getBoundingClientRect().top;
495
+ const screenPosition = window.innerHeight / 1.3;
496
+
497
+ if (elementPosition < screenPosition) {
498
+ element.style.opacity = '1';
499
+ element.style.transform = 'translateY(0)';
500
+ }
501
+ });
502
+ };
503
+
504
+ // Set initial state
505
+ document.querySelectorAll('.card-hover').forEach(el => {
506
+ el.style.opacity = '0';
507
+ el.style.transform = 'translateY(20px)';
508
+ el.style.transition = 'all 0.6s ease';
509
+ });
510
+
511
+ // Run on load and scroll
512
+ window.addEventListener('load', animateOnScroll);
513
+ window.addEventListener('scroll', animateOnScroll);
514
+ });
515
+ </script>
516
+ <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=XXXMARK/arkep" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
517
+ </html>
prompts.txt ADDED
File without changes