Hugging Face's logo

Spaces:
vipra
/
pingaxai-com
Running

App Files Community
vipra commited on
Commit
d83e174
·
verified ·
1 Parent(s): 68d0e36

Add 2 files

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +1359 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Pingaxai Com
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: pingaxai-com
3
+ emoji: 🐳
4
+ colorFrom: blue
5
+ colorTo: blue
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,1359 @@
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>Pingax AI | Enterprise AI/ML Services & Solutions</title>
7
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
8
+ <link rel="preconnect" href="https://fonts.googleapis.com">
9
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
10
+ <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&family=Montserrat:wght@700;800&display=swap" rel="stylesheet">
11
+ <link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap" rel="stylesheet">
12
+ <style>
13
+ :root {
14
+ --primary: #4361EE;
15
+ --primary-dark: #3A0CA3;
16
+ --secondary: #3A86FF;
17
+ --accent: #7209B7;
18
+ --dark: #14213D;
19
+ --light: #F8F9FA;
20
+ --gray: #6C757D;
21
+ --success: #4CC9F0;
22
+ --danger: #F72585;
23
+ --warning: #FF9F1C;
24
+ --gradient: linear-gradient(135deg, #4361EE 0%, #3A0CA3 50%, #7209B7 100%);
25
+ --gradient-accent: linear-gradient(135deg, #4361EE 0%, #7209B7 100%);
26
+ --shadow: 0 4px 30px rgba(67, 97, 238, 0.15);
27
+ --shadow-hover: 0 10px 40px rgba(67, 97, 238, 0.25);
28
+ }
29
+
30
+ * {
31
+ margin: 0;
32
+ padding: 0;
33
+ box-sizing: border-box;
34
+ }
35
+
36
+ body {
37
+ font-family: 'Poppins', sans-serif;
38
+ color: var(--dark);
39
+ line-height: 1.6;
40
+ background-color: var(--light);
41
+ }
42
+
43
+ h1, h2, h3, h4 {
44
+ font-family: 'Space Grotesk', sans-serif;
45
+ font-weight: 700;
46
+ }
47
+
48
+ .container {
49
+ max-width: 1200px;
50
+ margin: 0 auto;
51
+ padding: 0 20px;
52
+ }
53
+
54
+ /* Header Styles */
55
+ header {
56
+ background-color: white;
57
+ box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
58
+ position: fixed;
59
+ width: 100%;
60
+ z-index: 1000;
61
+ }
62
+
63
+ nav {
64
+ display: flex;
65
+ justify-content: space-between;
66
+ align-items: center;
67
+ padding: 20px 0;
68
+ }
69
+
70
+ .logo {
71
+ display: flex;
72
+ align-items: center;
73
+ font-family: 'Space Grotesk', sans-serif;
74
+ font-weight: 800;
75
+ font-size: 26px;
76
+ background: var(--gradient);
77
+ -webkit-background-clip: text;
78
+ -webkit-text-fill-color: transparent;
79
+ background-clip: text;
80
+ }
81
+
82
+ .logo i {
83
+ margin-right: 10px;
84
+ color: var(--primary);
85
+ }
86
+
87
+ .nav-links {
88
+ display: flex;
89
+ list-style: none;
90
+ }
91
+
92
+ .nav-links li {
93
+ margin-left: 30px;
94
+ }
95
+
96
+ .nav-links a {
97
+ text-decoration: none;
98
+ color: var(--dark);
99
+ font-weight: 500;
100
+ transition: all 0.3s;
101
+ position: relative;
102
+ }
103
+
104
+ .nav-links a:after {
105
+ content: '';
106
+ position: absolute;
107
+ width: 0;
108
+ height: 3px;
109
+ background: var(--gradient-accent);
110
+ bottom: -5px;
111
+ left: 0;
112
+ transition: width 0.3s;
113
+ border-radius: 3px;
114
+ }
115
+
116
+ .nav-links a:hover:after {
117
+ width: 100%;
118
+ }
119
+
120
+ .nav-links a:hover {
121
+ color: var(--primary);
122
+ }
123
+
124
+ .menu-toggle {
125
+ display: none;
126
+ cursor: pointer;
127
+ font-size: 24px;
128
+ color: var(--primary);
129
+ }
130
+
131
+ /* Hero Section */
132
+ .hero {
133
+ padding: 180px 0 100px;
134
+ background: url('https://images.unsplash.com/photo-1620712943543-bcc4688e7485?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80') no-repeat center center/cover;
135
+ position: relative;
136
+ color: white;
137
+ text-align: center;
138
+ }
139
+
140
+ .hero::before {
141
+ content: '';
142
+ position: absolute;
143
+ top: 0;
144
+ left: 0;
145
+ width: 100%;
146
+ height: 100%;
147
+ background: rgba(20, 33, 61, 0.8);
148
+ background: linear-gradient(135deg, rgba(58, 12, 163, 0.9) 0%, rgba(67, 97, 238, 0.8) 100%);
149
+ }
150
+
151
+ .hero-content {
152
+ position: relative;
153
+ z-index: 1;
154
+ max-width: 800px;
155
+ margin: 0 auto;
156
+ }
157
+
158
+ .hero h1 {
159
+ font-size: 56px;
160
+ margin-bottom: 20px;
161
+ line-height: 1.2;
162
+ }
163
+
164
+ .hero p {
165
+ font-size: 20px;
166
+ margin-bottom: 30px;
167
+ opacity: 0.9;
168
+ }
169
+
170
+ .btn {
171
+ display: inline-block;
172
+ padding: 14px 32px;
173
+ background: var(--gradient);
174
+ color: white;
175
+ border-radius: 8px;
176
+ text-decoration: none;
177
+ font-weight: 600;
178
+ transition: all 0.3s;
179
+ border: none;
180
+ cursor: pointer;
181
+ font-size: 16px;
182
+ box-shadow: var(--shadow);
183
+ }
184
+
185
+ .btn:hover {
186
+ transform: translateY(-3px);
187
+ box-shadow: var(--shadow-hover);
188
+ }
189
+
190
+ .btn-outline {
191
+ background: transparent;
192
+ border: 2px solid white;
193
+ margin-left: 15px;
194
+ }
195
+
196
+ .btn-outline:hover {
197
+ background: white;
198
+ color: var(--primary);
199
+ box-shadow: 0 10px 20px rgba(255, 255, 255, 0.2);
200
+ }
201
+
202
+ /* Features Section */
203
+ .section {
204
+ padding: 100px 0;
205
+ }
206
+
207
+ .section-title {
208
+ text-align: center;
209
+ margin-bottom: 60px;
210
+ }
211
+
212
+ .section-title h2 {
213
+ font-size: 42px;
214
+ margin-bottom: 15px;
215
+ background: var(--gradient);
216
+ -webkit-background-clip: text;
217
+ -webkit-text-fill-color: transparent;
218
+ background-clip: text;
219
+ }
220
+
221
+ .section-title p {
222
+ max-width: 700px;
223
+ margin: 0 auto;
224
+ color: var(--gray);
225
+ font-size: 18px;
226
+ }
227
+
228
+ .features-grid {
229
+ display: grid;
230
+ grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
231
+ gap: 30px;
232
+ }
233
+
234
+ .feature-card {
235
+ background: white;
236
+ border-radius: 12px;
237
+ padding: 40px;
238
+ box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
239
+ transition: all 0.3s;
240
+ border: 1px solid rgba(67, 97, 238, 0.1);
241
+ }
242
+
243
+ .feature-card:hover {
244
+ transform: translateY(-10px);
245
+ box-shadow: var(--shadow-hover);
246
+ border-color: rgba(67, 97, 238, 0.2);
247
+ }
248
+
249
+ .feature-icon {
250
+ width: 70px;
251
+ height: 70px;
252
+ background: var(--gradient);
253
+ border-radius: 12px;
254
+ display: flex;
255
+ align-items: center;
256
+ justify-content: center;
257
+ margin-bottom: 25px;
258
+ color: white;
259
+ font-size: 28px;
260
+ }
261
+
262
+ .feature-card h3 {
263
+ font-size: 22px;
264
+ margin-bottom: 15px;
265
+ color: var(--dark);
266
+ }
267
+
268
+ .feature-card p {
269
+ color: var(--gray);
270
+ }
271
+
272
+ /* Cloud Platforms */
273
+ .cloud-platforms {
274
+ display: flex;
275
+ justify-content: center;
276
+ gap: 40px;
277
+ flex-wrap: wrap;
278
+ margin: 50px 0;
279
+ }
280
+
281
+ .platform {
282
+ display: flex;
283
+ align-items: center;
284
+ gap: 10px;
285
+ background: white;
286
+ padding: 12px 25px;
287
+ border-radius: 8px;
288
+ box-shadow: 0 2px 20px rgba(0, 0, 0, 0.05);
289
+ transition: all 0.3s;
290
+ }
291
+
292
+ .platform:hover {
293
+ transform: translateY(-5px);
294
+ }
295
+
296
+ .platform i {
297
+ font-size: 24px;
298
+ }
299
+
300
+ .platform.aws i {
301
+ color: #FF9900;
302
+ }
303
+
304
+ .platform.azure i {
305
+ color: #0089D6;
306
+ }
307
+
308
+ .platform.gcp i {
309
+ color: #4285F4;
310
+ }
311
+
312
+ /* How It Works */
313
+ .works-section {
314
+ background: linear-gradient(to bottom, #f9fafb 0%, white 100%);
315
+ }
316
+
317
+ .steps {
318
+ display: flex;
319
+ flex-wrap: wrap;
320
+ justify-content: center;
321
+ position: relative;
322
+ padding-top: 50px;
323
+ }
324
+
325
+ .step {
326
+ flex: 1;
327
+ min-width: 250px;
328
+ max-width: 300px;
329
+ padding: 0 20px 40px;
330
+ position: relative;
331
+ }
332
+
333
+ .step-number {
334
+ width: 60px;
335
+ height: 60px;
336
+ background: var(--gradient);
337
+ color: white;
338
+ border-radius: 50%;
339
+ display: flex;
340
+ align-items: center;
341
+ justify-content: center;
342
+ font-weight: 600;
343
+ margin: 0 auto 20px;
344
+ position: relative;
345
+ z-index: 2;
346
+ font-size: 24px;
347
+ font-family: 'Space Grotesk', sans-serif;
348
+ }
349
+
350
+ .step:not(:last-child)::after {
351
+ content: '';
352
+ position: absolute;
353
+ top: 30px;
354
+ height: 3px;
355
+ width: calc(100% - 100px);
356
+ background: linear-gradient(to right, var(--primary), var(--accent));
357
+ left: calc(50% + 30px);
358
+ opacity: 0.3;
359
+ }
360
+
361
+ .step-content {
362
+ background: white;
363
+ padding: 30px;
364
+ border-radius: 12px;
365
+ box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
366
+ height: 100%;
367
+ border: 1px solid rgba(67, 97, 238, 0.1);
368
+ }
369
+
370
+ .step-content h3 {
371
+ margin-bottom: 15px;
372
+ color: var(--dark);
373
+ }
374
+
375
+ /* Stats Section */
376
+ .stats {
377
+ display: grid;
378
+ grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
379
+ gap: 30px;
380
+ text-align: center;
381
+ }
382
+
383
+ .stat-item {
384
+ background: white;
385
+ padding: 30px;
386
+ border-radius: 12px;
387
+ box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
388
+ }
389
+
390
+ .stat-item h3 {
391
+ font-size: 56px;
392
+ font-family: 'Space Grotesk', sans-serif;
393
+ background: var(--gradient);
394
+ -webkit-background-clip: text;
395
+ -webkit-text-fill-color: transparent;
396
+ background-clip: text;
397
+ margin-bottom: 10px;
398
+ }
399
+
400
+ /* Demo Section */
401
+ .demo-section {
402
+ background-color: #f1f4f8;
403
+ padding: 80px 0;
404
+ }
405
+
406
+ .demo-container {
407
+ background: white;
408
+ border-radius: 12px;
409
+ padding: 40px;
410
+ box-shadow: 0 5px 30px rgba(0, 0, 0, 0.05);
411
+ }
412
+
413
+ .demo-tab-container {
414
+ display: flex;
415
+ gap: 15px;
416
+ margin-bottom: 30px;
417
+ justify-content: center;
418
+ flex-wrap: wrap;
419
+ }
420
+
421
+ .demo-tab {
422
+ min-width: 250px;
423
+ background: white;
424
+ padding: 20px;
425
+ border-radius: 8px;
426
+ box-shadow: 0 2px 10px rgba(0,0,0,0.1);
427
+ transition: all 0.3s;
428
+ border: 2px solid transparent;
429
+ text-align: center;
430
+ cursor: pointer;
431
+ }
432
+
433
+ .demo-tab:hover {
434
+ transform: translateY(-5px);
435
+ box-shadow: 0 5px 15px rgba(67, 97, 238, 0.1);
436
+ }
437
+
438
+ .demo-tab.active {
439
+ border-color: var(--primary);
440
+ background: rgba(67, 97, 238, 0.05);
441
+ }
442
+
443
+ .demo-tab h3 {
444
+ font-size: 18px;
445
+ margin-bottom: 10px;
446
+ color: var(--dark);
447
+ }
448
+
449
+ .demo-tab p {
450
+ font-size: 14px;
451
+ color: var(--gray);
452
+ }
453
+
454
+ .demo-content {
455
+ min-height: 500px;
456
+ display: flex;
457
+ align-items: center;
458
+ justify-content: center;
459
+ }
460
+
461
+ .demo-frame {
462
+ width: 100%;
463
+ height: 600px;
464
+ border: 1px solid #eee;
465
+ border-radius: 8px;
466
+ overflow: hidden;
467
+ }
468
+
469
+ /* Testimonials */
470
+ .testimonials {
471
+ background: linear-gradient(to bottom, white 0%, #f9fafb 100%);
472
+ }
473
+
474
+ .testimonial-grid {
475
+ display: grid;
476
+ grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
477
+ gap: 30px;
478
+ }
479
+
480
+ .testimonial-card {
481
+ background: white;
482
+ border-radius: 12px;
483
+ padding: 30px;
484
+ box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
485
+ border: 1px solid rgba(67, 97, 238, 0.1);
486
+ }
487
+
488
+ .testimonial-header {
489
+ display: flex;
490
+ align-items: center;
491
+ margin-bottom: 20px;
492
+ }
493
+
494
+ .testimonial-avatar {
495
+ width: 60px;
496
+ height: 60px;
497
+ border-radius: 50%;
498
+ object-fit: cover;
499
+ margin-right: 15px;
500
+ }
501
+
502
+ .testimonial-name h4 {
503
+ font-size: 18px;
504
+ margin-bottom: 5px;
505
+ }
506
+
507
+ .testimonial-name p {
508
+ color: var(--gray);
509
+ font-size: 14px;
510
+ }
511
+
512
+ .testimonial-content {
513
+ color: var(--gray);
514
+ font-style: italic;
515
+ line-height: 1.7;
516
+ }
517
+
518
+ .testimonial-rating {
519
+ color: #FFC107;
520
+ margin-top: 15px;
521
+ font-size: 16px;
522
+ }
523
+
524
+ /* CTA Section */
525
+ .cta {
526
+ background: var(--gradient);
527
+ color: white;
528
+ text-align: center;
529
+ padding: 100px 0;
530
+ position: relative;
531
+ overflow: hidden;
532
+ }
533
+
534
+ .cta::before {
535
+ content: '';
536
+ position: absolute;
537
+ width: 400px;
538
+ height: 400px;
539
+ background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0) 70%);
540
+ top: -100px;
541
+ right: -100px;
542
+ border-radius: 50%;
543
+ }
544
+
545
+ .cta::after {
546
+ content: '';
547
+ position: absolute;
548
+ width: 600px;
549
+ height: 600px;
550
+ background: radial-gradient(circle, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0) 70%);
551
+ bottom: -300px;
552
+ left: -300px;
553
+ border-radius: 50%;
554
+ }
555
+
556
+ .cta-content {
557
+ position: relative;
558
+ z-index: 1;
559
+ }
560
+
561
+ .cta h2 {
562
+ font-size: 42px;
563
+ margin-bottom: 20px;
564
+ }
565
+
566
+ .cta p {
567
+ max-width: 600px;
568
+ margin: 0 auto 30px;
569
+ opacity: 0.9;
570
+ font-size: 18px;
571
+ }
572
+
573
+ .cta .btn-outline {
574
+ background: transparent;
575
+ border: 2px solid white;
576
+ color: white;
577
+ }
578
+
579
+ .cta .btn-outline:hover {
580
+ background: white;
581
+ color: var(--primary);
582
+ }
583
+
584
+ /* Contact Section */
585
+ .contact-section {
586
+ padding: 80px 0;
587
+ background: #f9fafb;
588
+ }
589
+
590
+ .contact-container {
591
+ display: flex;
592
+ background: white;
593
+ border-radius: 12px;
594
+ overflow: hidden;
595
+ box-shadow: 0 5px 30px rgba(0,0,0,0.05);
596
+ }
597
+
598
+ .contact-info {
599
+ flex: 1;
600
+ padding: 40px;
601
+ background: var(--dark);
602
+ color: white;
603
+ }
604
+
605
+ .contact-info h3 {
606
+ font-size: 28px;
607
+ margin-bottom: 20px;
608
+ color: white;
609
+ }
610
+
611
+ .contact-info p {
612
+ opacity: 0.8;
613
+ margin-bottom: 30px;
614
+ }
615
+
616
+ .contact-details {
617
+ margin-top: 40px;
618
+ }
619
+
620
+ .contact-detail {
621
+ display: flex;
622
+ align-items: center;
623
+ margin-bottom: 20px;
624
+ }
625
+
626
+ .contact-detail i {
627
+ font-size: 20px;
628
+ margin-right: 15px;
629
+ color: var(--secondary);
630
+ }
631
+
632
+ .contact-form {
633
+ flex: 1;
634
+ padding: 40px;
635
+ }
636
+
637
+ .contact-form h3 {
638
+ font-size: 28px;
639
+ margin-bottom: 20px;
640
+ background: var(--gradient);
641
+ -webkit-background-clip: text;
642
+ -webkit-text-fill-color: transparent;
643
+ background-clip: text;
644
+ }
645
+
646
+ /* Footer */
647
+ footer {
648
+ background: var(--dark);
649
+ color: white;
650
+ padding: 100px 0 30px;
651
+ }
652
+
653
+ .footer-content {
654
+ display: grid;
655
+ grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
656
+ gap: 40px;
657
+ margin-bottom: 60px;
658
+ }
659
+
660
+ .footer-column h3 {
661
+ margin-bottom: 25px;
662
+ font-size: 20px;
663
+ position: relative;
664
+ display: inline-block;
665
+ }
666
+
667
+ .footer-column h3::after {
668
+ content: '';
669
+ position: absolute;
670
+ width: 40px;
671
+ height: 3px;
672
+ background: var(--gradient-accent);
673
+ bottom: -10px;
674
+ left: 0;
675
+ border-radius: 3px;
676
+ }
677
+
678
+ .footer-links {
679
+ list-style: none;
680
+ }
681
+
682
+ .footer-links li {
683
+ margin-bottom: 12px;
684
+ }
685
+
686
+ .footer-links a {
687
+ color: #CBD5E0;
688
+ text-decoration: none;
689
+ transition: all 0.3s;
690
+ }
691
+
692
+ .footer-links a:hover {
693
+ color: white;
694
+ padding-left: 5px;
695
+ }
696
+
697
+ .social-links {
698
+ display: flex;
699
+ margin-top: 20px;
700
+ }
701
+
702
+ .social-links a {
703
+ width: 40px;
704
+ height: 40px;
705
+ border-radius: 50%;
706
+ background: rgba(255, 255, 255, 0.1);
707
+ display: flex;
708
+ align-items: center;
709
+ justify-content: center;
710
+ margin-right: 10px;
711
+ color: white;
712
+ transition: all 0.3s;
713
+ }
714
+
715
+ .social-links a:hover {
716
+ background: var(--gradient-accent);
717
+ transform: translateY(-3px);
718
+ }
719
+
720
+ .footer-bottom {
721
+ text-align: center;
722
+ padding-top: 30px;
723
+ border-top: 1px solid rgba(255, 255, 255, 0.1);
724
+ font-size: 14px;
725
+ color: #CBD5E0;
726
+ }
727
+
728
+ /* Responsive */
729
+ @media (max-width: 1200px) {
730
+ .hero h1 {
731
+ font-size: 48px;
732
+ }
733
+ }
734
+
735
+ @media (max-width: 992px) {
736
+ .hero h1 {
737
+ font-size: 42px;
738
+ }
739
+
740
+ .section-title h2 {
741
+ font-size: 36px;
742
+ }
743
+
744
+ .step {
745
+ max-width: 250px;
746
+ }
747
+
748
+ .feature-card, .testimonial-card {
749
+ padding: 30px;
750
+ }
751
+
752
+ .contact-container {
753
+ flex-direction: column;
754
+ }
755
+ }
756
+
757
+ @media (max-width: 768px) {
758
+ .menu-toggle {
759
+ display: block;
760
+ }
761
+
762
+ .nav-links {
763
+ position: absolute;
764
+ top: 100%;
765
+ left: 0;
766
+ width: 100%;
767
+ background: white;
768
+ flex-direction: column;
769
+ padding: 20px;
770
+ box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
771
+ transform: translateY(-150%);
772
+ transition: all 0.3s;
773
+ border-radius: 0 0 12px 12px;
774
+ }
775
+
776
+ .nav-links.active {
777
+ transform: translateY(0);
778
+ }
779
+
780
+ .nav-links li {
781
+ margin: 15px 0;
782
+ }
783
+
784
+ .hero {
785
+ padding: 150px 0 80px;
786
+ }
787
+
788
+ .hero h1 {
789
+ font-size: 36px;
790
+ }
791
+
792
+ .hero p {
793
+ font-size: 18px;
794
+ }
795
+
796
+ .hero-buttons {
797
+ display: flex;
798
+ flex-direction: column;
799
+ align-items: center;
800
+ }
801
+
802
+ .btn-outline {
803
+ margin-left: 0;
804
+ margin-top: 15px;
805
+ }
806
+
807
+ .step {
808
+ max-width: 100%;
809
+ margin-bottom: 30px;
810
+ }
811
+
812
+ .step:not(:last-child)::after {
813
+ display: none;
814
+ }
815
+
816
+ .cta h2 {
817
+ font-size: 32px;
818
+ }
819
+ }
820
+
821
+ @media (max-width: 576px) {
822
+ .hero h1 {
823
+ font-size: 32px;
824
+ }
825
+
826
+ .section {
827
+ padding: 80px 0;
828
+ }
829
+
830
+ .demo-tab-container {
831
+ flex-direction: column;
832
+ }
833
+
834
+ .demo-tab {
835
+ min-width: 100%;
836
+ }
837
+ }
838
+
839
+ /* Animations */
840
+ @keyframes fadeIn {
841
+ from { opacity: 0; transform: translateY(20px); }
842
+ to { opacity: 1; transform: translateY(0); }
843
+ }
844
+
845
+ .fade-in {
846
+ opacity: 0;
847
+ animation: fadeIn 0.8s ease forwards;
848
+ }
849
+
850
+ .delay-1 { animation-delay: 0.2s; }
851
+ .delay-2 { animation-delay: 0.4s; }
852
+ .delay-3 { animation-delay: 0.6s; }
853
+ .delay-4 { animation-delay: 0.8s; }
854
+ </style>
855
+ </head>
856
+ <body>
857
+ <header>
858
+ <div class="container">
859
+ <nav>
860
+ <div class="logo">
861
+ <i class="fas fa-atom"></i>
862
+ <span>Pingax AI</span>
863
+ </div>
864
+ <div class="menu-toggle">
865
+ <i class="fas fa-bars"></i>
866
+ </div>
867
+ <ul class="nav-links">
868
+ <li><a href="#services">Solutions</a></li>
869
+ <li><a href="#use-cases">Demos</a></li>
870
+ <li><a href="#mlops">MLOps</a></li>
871
+ <li><a href="#testimonials">Testimonials</a></li>
872
+ <li><a href="#contact">Contact</a></li>
873
+ </ul>
874
+ </nav>
875
+ </div>
876
+ </header>
877
+
878
+ <section class="hero">
879
+ <div class="container">
880
+ <div class="hero-content">
881
+ <h1 class="fade-in">AI-Powered Ecommerce Solutions</h1>
882
+ <p class="fade-in delay-1">Transform your online business with our cutting-edge AI solutions for personalization, search, chat, and analytics.</p>
883
+ <div class="hero-buttons">
884
+ <a href="#use-cases" class="btn fade-in delay-2">View Demos</a>
885
+ <a href="#contact" class="btn btn-outline fade-in delay-3">Book Consultation</a>
886
+ </div>
887
+ </div>
888
+ </div>
889
+ </section>
890
+
891
+ <section id="services" class="section">
892
+ <div class="container">
893
+ <div class="section-title">
894
+ <h2>Ecommerce AI Solutions</h2>
895
+ <p>Specialized AI solutions designed to boost your ecommerce performance across key metrics</p>
896
+ </div>
897
+ <div class="features-grid">
898
+ <div class="feature-card fade-in">
899
+ <div class="feature-icon">
900
+ <i class="fas fa-search-dollar"></i>
901
+ </div>
902
+ <h3>Product Recommendations</h3>
903
+ <p>Personalized, real-time product recommendations that increase AOV and conversion rates using collaborative filtering and deep learning.</p>
904
+ </div>
905
+ <div class="feature-card fade-in delay-1">
906
+ <div class="feature-icon">
907
+ <i class="fas fa-images"></i>
908
+ </div>
909
+ <h3>Multimodal Search</h3>
910
+ <p>Visual search that connects text, images and voice to help customers find exactly what they're looking for.</p>
911
+ </div>
912
+ <div class="feature-card fade-in delay-2">
913
+ <div class="feature-icon">
914
+ <i class="fas fa-robot"></i>
915
+ </div>
916
+ <h3>AI Shopping Assistant</h3>
917
+ <p>Conversational AI that helps customers discover products, check inventory and answer questions 24/7.</p>
918
+ </div>
919
+ <div class="feature-card fade-in delay-3">
920
+ <div class="feature-icon">
921
+ <i class="fas fa-users"></i>
922
+ </div>
923
+ <h3>Customer Segmentation</h3>
924
+ <p>Advanced clustering to identify high-value segments and personalize marketing strategies accordingly.</p>
925
+ </div>
926
+ <div class="feature-card fade-in delay-1">
927
+ <div class="feature-icon">
928
+ <i class="fas fa-chart-line"></i>
929
+ </div>
930
+ <h3>LTV Prediction</h3>
931
+ <p>Predict customer lifetime value to optimize acquisition costs and retention strategies.</p>
932
+ </div>
933
+ <div class="feature-card fade-in delay-2">
934
+ <div class="feature-icon">
935
+ <i class="fas fa-shield-alt"></i>
936
+ </div>
937
+ <h3>Fraud Detection</h3>
938
+ <p>Real-time fraud scoring that reduces false positives while catching more fraudulent transactions.</p>
939
+ </div>
940
+ <div class="feature-card fade-in delay-3">
941
+ <div class="feature-icon">
942
+ <i class="fas fa-box"></i>
943
+ </div>
944
+ <h3>Demand Forecasting</h3>
945
+ <p>Accurate demand predictions to optimize inventory and reduce stockouts or overstocking.</p>
946
+ </div>
947
+ <div class="feature-card fade-in delay-1">
948
+ <div class="feature-icon">
949
+ <i class="fas fa-random"></i>
950
+ </div>
951
+ <h3>Cross-Sell/Upsell</h3>
952
+ <p>Contextual recommendations for complementary products that maximize basket size.</p>
953
+ </div>
954
+ </div>
955
+
956
+ <div class="section-title" style="margin-top: 80px;">
957
+ <h2>Cloud Platform Expertise</h2>
958
+ <p>We deploy and manage AI solutions across all major cloud providers</p>
959
+ </div>
960
+ <div class="cloud-platforms fade-in">
961
+ <div class="platform aws">
962
+ <i class="fab fa-aws"></i>
963
+ <span>AWS AI/ML Services</span>
964
+ </div>
965
+ <div class="platform azure">
966
+ <i class="fab fa-microsoft"></i>
967
+ <span>Azure Machine Learning</span>
968
+ </div>
969
+ <div class="platform gcp">
970
+ <i class="fab fa-google"></i>
971
+ <span>Google Vertex AI</span>
972
+ </div>
973
+ </div>
974
+ </div>
975
+ </section>
976
+
977
+ <section id="use-cases" class="demo-section">
978
+ <div class="container">
979
+ <div class="section-title">
980
+ <h2>Interactive AI Demos</h2>
981
+ <p>Explore our working AI implementations for ecommerce applications</p>
982
+ </div>
983
+
984
+ <div class="demo-container">
985
+ <div class="demo-tab-container">
986
+ <div class="demo-tab active" onclick="showDemo('similar')">
987
+ <h3>Similar Products</h3>
988
+ <p>Personalized recommendations engine using deep learning</p>
989
+ </div>
990
+ <div class="demo-tab" onclick="showDemo('multimodal')">
991
+ <h3>Multimodal Search</h3>
992
+ <p>Search across text, images and voice with unified results</p>
993
+ </div>
994
+ <div class="demo-tab" onclick="showDemo('chat')">
995
+ <h3>AI Shopping Assistant</h3>
996
+ <p>Conversational AI for product discovery and support</p>
997
+ </div>
998
+ </div>
999
+
1000
+ <div class="demo-content">
1001
+ <iframe id="similarDemo" class="demo-frame" src="https://huggingface.co/spaces/recsys/fashion-product-recommendation" frameborder="0"></iframe>
1002
+ <iframe id="multimodalDemo" class="demo-frame" src="https://huggingface.co/spaces/multimodal-search/product-visual-search" style="display:none;" frameborder="0"></iframe>
1003
+ <iframe id="chatDemo" class="demo-frame" src="https://huggingface.co/spaces/conversational-ai/shopping-assistant" style="display:none;" frameborder="0"></iframe>
1004
+ </div>
1005
+
1006
+ <div class="demo-tab-container" style="margin-top: 30px;">
1007
+ <div class="demo-tab" onclick="showDemo('segmentation')">
1008
+ <h3>Customer Segmentation</h3>
1009
+ <p>Identify high-value customer segments automatically</p>
1010
+ </div>
1011
+ <div class="demo-tab" onclick="showDemo('ltv')">
1012
+ <h3>LTV Prediction</h3>
1013
+ <p>Forecast customer lifetime value with machine learning</p>
1014
+ </div>
1015
+ <div class="demo-tab" onclick="showDemo('fraud')">
1016
+ <h3>Fraud Detection</h3>
1017
+ <p>Real-time scoring to identify suspicious transactions</p>
1018
+ </div>
1019
+ <div class="demo-tab" onclick="showDemo('forecasting')">
1020
+ <h3>Demand Forecasting</h3>
1021
+ <p>Predict product demand with time-series analysis</p>
1022
+ </div>
1023
+ </div>
1024
+ </div>
1025
+ </div>
1026
+ </section>
1027
+
1028
+ <section id="mlops" class="section works-section">
1029
+ <div class="container">
1030
+ <div class="section-title">
1031
+ <h2>MLOps & AIOps Framework</h2>
1032
+ <p>Our proven methodology for deploying and managing AI at scale</p>
1033
+ </div>
1034
+ <div class="steps">
1035
+ <div class="step fade-in">
1036
+ <div class="step-number">1</div>
1037
+ <div class="step-content">
1038
+ <h3>Model Development</h3>
1039
+ <p>Custom AI model development with proper version control, experiment tracking, and reproducibility using MLflow/DVC.</p>
1040
+ </div>
1041
+ </div>
1042
+ <div class="step fade-in delay-1">
1043
+ <div class="step-number">2</div>
1044
+ <div class="step-content">
1045
+ <h3>CI/CD Pipelines</h3>
1046
+ <p>Automated testing, containerization, and deployment pipelines with GitHub Actions, Jenkins, or cloud-native tools.</p>
1047
+ </div>
1048
+ </div>
1049
+ <div class="step fade-in delay-2">
1050
+ <div class="step-number">3</div>
1051
+ <div class="step-content">
1052
+ <h3>Monitoring & Governance</h3>
1053
+ <p>Performance monitoring, data drift detection, model explainability, and compliance tracking in production.</p>
1054
+ </div>
1055
+ </div>
1056
+ <div class="step fade-in delay-3">
1057
+ <div class="step-number">4</div>
1058
+ <div class="step-content">
1059
+ <h3>Auto-Retraining</h3>
1060
+ <p>Scheduled and trigger-based model retraining with automated A/B testing and canary deployments.</p>
1061
+ </div>
1062
+ </div>
1063
+ </div>
1064
+ </div>
1065
+ </section>
1066
+
1067
+ <section class="section">
1068
+ <div class="container">
1069
+ <div class="stats">
1070
+ <div class="stat-item fade-in">
1071
+ <h3>42%</h3>
1072
+ <p>Average conversion rate increase from recommendations</p>
1073
+ </div>
1074
+ <div class="stat-item fade-in delay-1">
1075
+ <h3>35%</h3>
1076
+ <p>Reduction in support costs with AI shopping assistants</p>
1077
+ </div>
1078
+ <div class="stat-item fade-in delay-2">
1079
+ <h3>60%</h3>
1080
+ <p>Fewer false positives in fraud detection</p>
1081
+ </div>
1082
+ <div class="stat-item fade-in delay-3">
1083
+ <h3>3x</h3>
1084
+ <p>ROI on AI investments within 6 months</p>
1085
+ </div>
1086
+ </div>
1087
+ </div>
1088
+ </section>
1089
+
1090
+ <section id="testimonials" class="section testimonials">
1091
+ <div class="container">
1092
+ <div class="section-title">
1093
+ <h2>Client Success Stories</h2>
1094
+ <p>Business leaders share their experiences with Pingax AI solutions</p>
1095
+ </div>
1096
+ <div class="testimonial-grid">
1097
+ <div class="testimonial-card fade-in">
1098
+ <div class="testimonial-header">
1099
+ <img src="https://randomuser.me/api/portraits/women/43.jpg" alt="Amanda Chen" class="testimonial-avatar">
1100
+ <div class="testimonial-name">
1101
+ <h4>Amanda Chen</h4>
1102
+ <p>CTO, StyleHub</p>
1103
+ </div>
1104
+ </div>
1105
+ <div class="testimonial-content">
1106
+ "Pingax's recommendation engine increased our conversion rate by 42% while reducing our infrastructure costs through their optimized MLOps approach on AWS. Their team seamlessly integrated with our ecommerce platform."
1107
+ </div>
1108
+ <div class="testimonial-rating">
1109
+ <i class="fas fa-star"></i>
1110
+ <i class="fas fa-star"></i>
1111
+ <i class="fas fa-star"></i>
1112
+ <i class="fas fa-star"></i>
1113
+ <i class="fas fa-star"></i>
1114
+ </div>
1115
+ </div>
1116
+ <div class="testimonial-card fade-in delay-1">
1117
+ <div class="testimonial-header">
1118
+ <img src="https://randomuser.me/api/portraits/men/65.jpg" alt="Raj Patel" class="testimonial-avatar">
1119
+ <div class="testimonial-name">
1120
+ <h4>Raj Patel</h4>
1121
+ <p>Head of AI, Global Retail Corp</p>
1122
+ </div>
1123
+ </div>
1124
+ <div class="testimonial-content">
1125
+ "Their multimodal search implementation reduced our product search abandonment by 35%. Customers can now find products using images from social media or vague descriptions."
1126
+ </div>
1127
+ <div class="testimonial-rating">
1128
+ <i class="fas fa-star"></i>
1129
+ <i class="fas fa-star"></i>
1130
+ <i class="fas fa-star"></i>
1131
+ <i class="fas fa-star"></i>
1132
+ <i class="fas fa-star"></i>
1133
+ </div>
1134
+ </div>
1135
+ <div class="testimonial-card fade-in delay-2">
1136
+ <div class="testimonial-header">
1137
+ <img src="https://randomuser.me/api/portraits/women/68.jpg" alt="Sophia Williams" class="testimonial-avatar">
1138
+ <div class="testimonial-name">
1139
+ <h4>Sophia Williams</h4>
1140
+ <p>CEO, LuxeHome</p>
1141
+ </div>
1142
+ </div>
1143
+ <div class="testimonial-content">
1144
+ "The AI shopping assistant Pingax developed reduced our customer service costs by 60% while improving satisfaction scores. Their expertise in conversational AI was evident throughout the project."
1145
+ </div>
1146
+ <div class="testimonial-rating">
1147
+ <i class="fas fa-star"></i>
1148
+ <i class="fas fa-star"></i>
1149
+ <i class="fas fa-star"></i>
1150
+ <i class="fas fa-star"></i>
1151
+ <i class="fas fa-star-half-alt"></i>
1152
+ </div>
1153
+ </div>
1154
+ </div>
1155
+ </div>
1156
+ </section>
1157
+
1158
+ <section class="cta">
1159
+ <div class="container">
1160
+ <div class="cta-content">
1161
+ <h2 class="fade-in">Ready to Transform Your Ecommerce Business?</h2>
1162
+ <p class="fade-in delay-1">Our team of AI specialists will help you implement proven solutions to increase conversions, AOV and customer loyalty.</p>
1163
+ <a href="#use-cases" class="btn fade-in delay-2">View All Demos</a>
1164
+ <a href="#contact" class="btn btn-outline fade-in delay-3">Schedule Consultation</a>
1165
+ </div>
1166
+ </div>
1167
+ </section>
1168
+
1169
+ <section id="contact" class="contact-section">
1170
+ <div class="container">
1171
+ <div class="section-title">
1172
+ <h2>Get Started with Pingax AI</h2>
1173
+ <p>Book a discovery call to discuss how we can help implement AI solutions for your business</p>
1174
+ </div>
1175
+ <div class="contact-container">
1176
+ <div class="contact-info">
1177
+ <h3>AI Strategy Session</h3>
1178
+ <p>During this 30-minute consultation, we'll:</p>
1179
+ <ul style="list-style-type: none; margin-left: 0;">
1180
+ <li style="margin-bottom: 15px; position: relative; padding-left: 25px;">
1181
+ <i class="fas fa-check-circle" style="position: absolute; left: 0; color: var(--success);"></i>
1182
+ Assess your current ecommerce metrics
1183
+ </li>
1184
+ <li style="margin-bottom: 15px; position: relative; padding-left: 25px;">
1185
+ <i class="fas fa-check-circle" style="position: absolute; left: 0; color: var(--success);"></i>
1186
+ Identify high-impact AI opportunities
1187
+ </li>
1188
+ <li style="margin-bottom: 15px; position: relative; padding-left: 25px;">
1189
+ <i class="fas fa-check-circle" style="position: absolute; left: 0; color: var(--success);"></i>
1190
+ Outline project scope & timeline
1191
+ </li>
1192
+ <li style="margin-bottom: 15px; position: relative; padding-left: 25px;">
1193
+ <i class="fas fa-check-circle" style="position: absolute; left: 0; color: var(--success);"></i>
1194
+ Provide estimated ROI projection
1195
+ </li>
1196
+ </ul>
1197
+ <div class="contact-details">
1198
+ <div class="contact-detail">
1199
+ <i class="fas fa-map-marker-alt"></i>
1200
+ <span>San Francisco, CA</span>
1201
+ </div>
1202
+ <div class="contact-detail">
1203
+ <i class="fas fa-envelope"></i>
1204
+ <span>hello@pingax.ai</span>
1205
+ </div>
1206
+ <div class="contact-detail">
1207
+ <i class="fas fa-phone"></i>
1208
+ <span>(555) 123-4567</span>
1209
+ </div>
1210
+ </div>
1211
+ </div>
1212
+ <div class="contact-form">
1213
+ <h3>Schedule Your Consultation</h3>
1214
+ <!-- Calendly inline widget begin -->
1215
+ <div class="calendly-inline-widget" data-url="https://calendly.com/vignesh2066/ai-strategy-get-your-poc-demo-pingax" style="min-width:320px;height:700px;"></div>
1216
+ <script type="text/javascript" src="https://assets.calendly.com/assets/external/widget.js" async></script>
1217
+ <!-- Calendly inline widget end -->
1218
+ </div>
1219
+ </div>
1220
+ </div>
1221
+ </section>
1222
+
1223
+ <footer>
1224
+ <div class="container">
1225
+ <div class="footer-content">
1226
+ <div class="footer-column">
1227
+ <h3>Pingax AI</h3>
1228
+ <p>Enterprise AI services and MLOps solutions to power your ecommerce transformation across cloud platforms.</p>
1229
+ <div class="social-links">
1230
+ <a href="#"><i class="fab fa-twitter"></i></a>
1231
+ <a href="#"><i class="fab fa-linkedin-in"></i></a>
1232
+ <a href="#"><i class="fab fa-github"></i></a>
1233
+ <a href="#"><i class="fab fa-youtube"></i></a>
1234
+ </div>
1235
+ </div>
1236
+ <div class="footer-column">
1237
+ <h3>Solutions</h3>
1238
+ <ul class="footer-links">
1239
+ <li><a href="#">Product Recommendations</a></li>
1240
+ <li><a href="#">Multimodal Search</a></li>
1241
+ <li><a href="#">AI Shopping Assistants</a></li>
1242
+ <li><a href="#">Customer Segmentation</a></li>
1243
+ <li><a href="#">LTV Prediction</a></li>
1244
+ </ul>
1245
+ </div>
1246
+ <div class="footer-column">
1247
+ <h3>Platforms</h3>
1248
+ <ul class="footer-links">
1249
+ <li><a href="#">AWS Machine Learning</a></li>
1250
+ <li><a href="#">Azure AI Services</a></li>
1251
+ <li><a href="#">Google Vertex AI</a></li>
1252
+ <li><a href="#">Hugging Face</a></li>
1253
+ <li><a href="#">OpenAI Integration</a></li>
1254
+ </ul>
1255
+ </div>
1256
+ <div class="footer-column">
1257
+ <h3>Company</h3>
1258
+ <ul class="footer-links">
1259
+ <li><a href="#">About Us</a></li>
1260
+ <li><a href="#">Case Studies</a></li>
1261
+ <li><a href="#">Careers</a></li>
1262
+ <li><a href="#">Blog</a></li>
1263
+ <li><a href="#contact">Contact Us</a></li>
1264
+ </ul>
1265
+ </div>
1266
+ </div>
1267
+ <div class="footer-bottom">
1268
+ <p>&copy; 2023 Pingax AI Technologies. All rights reserved. | <a href="#">Privacy Policy</a> | <a href="#">Terms of Service</a></p>
1269
+ </div>
1270
+ </div>
1271
+ </footer>
1272
+
1273
+ <script>
1274
+ // Mobile Menu Toggle
1275
+ const menuToggle = document.querySelector('.menu-toggle');
1276
+ const navLinks = document.querySelector('.nav-links');
1277
+
1278
+ menuToggle.addEventListener('click', () => {
1279
+ navLinks.classList.toggle('active');
1280
+ menuToggle.innerHTML = navLinks.classList.contains('active') ?
1281
+ '<i class="fas fa-times"></i>' : '<i class="fas fa-bars"></i>';
1282
+ });
1283
+
1284
+ // Close menu when clicking on links
1285
+ document.querySelectorAll('.nav-links a').forEach(link => {
1286
+ link.addEventListener('click', () => {
1287
+ navLinks.classList.remove('active');
1288
+ menuToggle.innerHTML = '<i class="fas fa-bars"></i>';
1289
+ });
1290
+ });
1291
+
1292
+ // Smooth scrolling for anchor links
1293
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
1294
+ anchor.addEventListener('click', function(e) {
1295
+ e.preventDefault();
1296
+
1297
+ const targetId = this.getAttribute('href');
1298
+ const targetElement = document.querySelector(targetId);
1299
+
1300
+ if (targetElement) {
1301
+ window.scrollTo({
1302
+ top: targetElement.offsetTop - 80,
1303
+ behavior: 'smooth'
1304
+ });
1305
+ }
1306
+ });
1307
+ });
1308
+
1309
+ // Demo tabs functionality
1310
+ function showDemo(demoId) {
1311
+ // Hide all demo frames
1312
+ document.querySelectorAll('.demo-frame').forEach(frame => {
1313
+ frame.style.display = 'none';
1314
+ });
1315
+
1316
+ // Remove active class from all tabs
1317
+ document.querySelectorAll('.demo-tab').forEach(tab => {
1318
+ tab.classList.remove('active');
1319
+ });
1320
+
1321
+ // Show selected demo and mark tab as active
1322
+ document.getElementById(demoId + 'Demo').style.display = 'block';
1323
+ event.currentTarget.classList.add('active');
1324
+
1325
+ // For second row of tabs that don't have iframes
1326
+ if(demoId === 'segmentation') {
1327
+ document.getElementById('similarDemo').style.display = 'block';
1328
+ document.getElementById('similarDemo').src = "https://huggingface.co/spaces/clustering/customer-segmentation";
1329
+ } else if(demoId === 'ltv') {
1330
+ document.getElementById('similarDemo').style.display = 'block';
1331
+ document.getElementById('similarDemo').src = "https://huggingface.co/spaces/prediction/customer-ltv";
1332
+ } else if(demoId === 'fraud') {
1333
+ document.getElementById('similarDemo').style.display = 'block';
1334
+ document.getElementById('similarDemo').src = "https://huggingface.co/spaces/fraud/fraud-detection";
1335
+ } else if(demoId === 'forecasting') {
1336
+ document.getElementById('similarDemo').style.display = 'block';
1337
+ document.getElementById('similarDemo').src = "https://huggingface.co/spaces/forecasting/demand-prediction";
1338
+ }
1339
+ }
1340
+
1341
+ // Animation on scroll
1342
+ function checkScroll() {
1343
+ const elements = document.querySelectorAll('.fade-in');
1344
+ elements.forEach(element => {
1345
+ const elementPosition = element.getBoundingClientRect().top;
1346
+ const screenPosition = window.innerHeight / 1.2;
1347
+
1348
+ if (elementPosition < screenPosition) {
1349
+ element.style.opacity = '1';
1350
+ element.style.transform = 'translateY(0)';
1351
+ }
1352
+ });
1353
+ }
1354
+
1355
+ window.addEventListener('scroll', checkScroll);
1356
+ window.addEventListener('load', checkScroll);
1357
+ </script>
1358
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: absolute; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">This website has been generated by <a href="https://enzostvs-deepsite.hf.space" style="color: #fff;" target="_blank" >DeepSite</a> <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;"></p><p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: absolute; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">This website has been generated by <a href="https://enzostvs-deepsite.hf.space" style="color: #fff;" target="_blank" >DeepSite</a> <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;"></p></body>
1359
+ </html>