Hugging Face's logo

Spaces:
Mudrock10
/
anycoder-3f8734ca
Running

App Files Community
Mudrock10 commited on
Commit
938035a
·
verified ·
1 Parent(s): 7de37b7

Upload folder using huggingface_hub

Browse files
Files changed (1) hide show
  1. index.html +491 -19
index.html CHANGED
@@ -1,19 +1,491 @@
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>Resize Videos with AI in Seconds</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
+ .gradient-bg {
11
+ background: linear-gradient(135deg, #6B46C1 0%, #8B5CF6 100%);
12
+ }
13
+ .gradient-text {
14
+ background: linear-gradient(135deg, #6B46C1 0%, #8B5CF6 100%);
15
+ -webkit-background-clip: text;
16
+ -webkit-text-fill-color: transparent;
17
+ background-clip: text;
18
+ }
19
+ .card-hover {
20
+ transition: transform 0.3s ease, box-shadow 0.3s ease;
21
+ }
22
+ .card-hover:hover {
23
+ transform: translateY(-5px);
24
+ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
25
+ }
26
+ .pricing-card {
27
+ background: rgba(255, 255, 255, 0.05);
28
+ backdrop-filter: blur(10px);
29
+ border: 1px solid rgba(255, 255, 255, 0.1);
30
+ }
31
+ .testimonial-card {
32
+ background: rgba(255, 255, 255, 0.08);
33
+ backdrop-filter: blur(10px);
34
+ }
35
+ .upload-area {
36
+ border: 2px dashed rgba(255, 255, 255, 0.3);
37
+ transition: all 0.3s ease;
38
+ }
39
+ .upload-area:hover {
40
+ border-color: rgba(255, 255, 255, 0.6);
41
+ background: rgba(255, 255, 255, 0.05);
42
+ }
43
+ .feature-icon {
44
+ background: linear-gradient(135deg, #6B46C1 0%, #8B5CF6 100%);
45
+ }
46
+ </style>
47
+ </head>
48
+ <body class="gradient-bg text-white min-h-screen">
49
+ <!-- Header Navigation -->
50
+ <header class="px-6 py-4">
51
+ <nav class="max-w-7xl mx-auto flex items-center justify-between">
52
+ <div class="flex items-center space-x-2">
53
+ <div class="w-8 h-8 bg-white rounded-lg flex items-center justify-center">
54
+ <i class="fas fa-play text-purple-600"></i>
55
+ </div>
56
+ <span class="text-xl font-bold">VideoResize</span>
57
+ </div>
58
+ <div class="hidden md:flex items-center space-x-8">
59
+ <a href="#" class="hover:text-purple-200 transition-colors">Features</a>
60
+ <a href="#" class="hover:text-purple-200 transition-colors">Pricing</a>
61
+ <a href="#" class="hover:text-purple-200 transition-colors">About</a>
62
+ <a href="#" class="hover:text-purple-200 transition-colors">Contact</a>
63
+ </div>
64
+ <button class="bg-white text-purple-600 px-6 py-2 rounded-lg font-semibold hover:bg-gray-100 transition-colors">
65
+ Get Started
66
+ </button>
67
+ </nav>
68
+ </header>
69
+
70
+ <!-- Hero Section -->
71
+ <section class="px-6 py-20 text-center">
72
+ <div class="max-w-4xl mx-auto">
73
+ <h1 class="text-5xl md:text-6xl font-bold mb-6 leading-tight">
74
+ Resize Videos with AI in Seconds
75
+ </h1>
76
+ <p class="text-xl text-purple-100 mb-12 max-w-2xl mx-auto">
77
+ Automatically resize your videos with AI-powered content preservation.
78
+ </p>
79
+
80
+ <!-- Upload Area -->
81
+ <div class="upload-area rounded-2xl p-12 mb-8 max-w-md mx-auto">
82
+ <div class="text-center">
83
+ <div class="w-16 h-16 bg-purple-500 rounded-full flex items-center justify-center mx-auto mb-4">
84
+ <i class="fas fa-cloud-upload-alt text-white text-2xl"></i>
85
+ </div>
86
+ <p class="text-purple-200 mb-4">Drag & drop your video here</p>
87
+ <button class="bg-purple-600 hover:bg-purple-700 px-8 py-3 rounded-lg font-semibold transition-colors">
88
+ Browse Files
89
+ </button>
90
+ </div>
91
+ </div>
92
+
93
+ <!-- Social Proof -->
94
+ <div class="flex items-center justify-center space-x-8 text-sm text-purple-200">
95
+ <div class="flex items-center space-x-2">
96
+ <i class="fas fa-check-circle text-green-400"></i>
97
+ <span>Trusted by 10,000+ users</span>
98
+ </div>
99
+ <div class="flex items-center space-x-2">
100
+ <i class="fas fa-star text-yellow-400"></i>
101
+ <span>4.9/5 rating</span>
102
+ </div>
103
+ </div>
104
+ </div>
105
+ </section>
106
+
107
+ <!-- Features Section -->
108
+ <section class="px-6 py-20">
109
+ <div class="max-w-6xl mx-auto">
110
+ <div class="text-center mb-16">
111
+ <h2 class="text-4xl font-bold mb-4">Powerful AI Video Resizing</h2>
112
+ <p class="text-purple-100 max-w-2xl mx-auto">
113
+ Our advanced AI technology ensures your videos look perfect on any platform.
114
+ </p>
115
+ </div>
116
+
117
+ <div class="grid md:grid-cols-3 gap-8">
118
+ <!-- Feature 1 -->
119
+ <div class="card-hover bg-white/5 rounded-2xl p-8 text-center">
120
+ <div class="feature-icon w-16 h-16 rounded-2xl flex items-center justify-center mx-auto mb-6">
121
+ <i class="fas fa-expand-arrows-alt text-white text-2xl"></i>
122
+ </div>
123
+ <h3 class="text-2xl font-bold mb-4">Smart Resizing</h3>
124
+ <p class="text-purple-100">
125
+ Automatically adjusts aspect ratios while preserving important content.
126
+ </p>
127
+ </div>
128
+
129
+ <!-- Feature 2 -->
130
+ <div class="card-hover bg-white/5 rounded-2xl p-8 text-center">
131
+ <div class="feature-icon w-16 h-16 rounded-2xl flex items-center justify-center mx-auto mb-6">
132
+ <i class="fas fa-tachometer-alt text-white text-2xl"></i>
133
+ </div>
134
+ <h3 class="text-2xl font-bold mb-4">Lightning Fast</h3>
135
+ <p class="text-purple-100">
136
+ Process videos in seconds with our optimized AI algorithms.
137
+ </p>
138
+ </div>
139
+
140
+ <!-- Feature 3 -->
141
+ <div class="card-hover bg-white/5 rounded-2xl p-8 text-center">
142
+ <div class="feature-icon w-16 h-16 rounded-2xl flex items-center justify-center mx-auto mb-6">
143
+ <i class="fas fa-cog text-white text-2xl"></i>
144
+ </div>
145
+ <h3 class="text-2xl font-bold mb-4">Custom Settings</h3>
146
+ <p class="text-purple-100">
147
+ Fine-tune your video output with advanced customization options.
148
+ </p>
149
+ </div>
150
+ </div>
151
+ </div>
152
+ </section>
153
+
154
+ <!-- How It Works Section -->
155
+ <section class="px-6 py-20">
156
+ <div class="max-w-6xl mx-auto">
157
+ <div class="text-center mb-16">
158
+ <h2 class="text-4xl font-bold mb-4">How It Works</h2>
159
+ <p class="text-purple-100 max-w-2xl mx-auto">
160
+ Resize your videos in just three simple steps.
161
+ </p>
162
+ </div>
163
+
164
+ <div class="grid md:grid-cols-3 gap-8">
165
+ <!-- Step 1 -->
166
+ <div class="text-center">
167
+ <div class="w-16 h-16 bg-purple-500 rounded-full flex items-center justify-center mx-auto mb-6">
168
+ <span class="text-2xl font-bold">1</span>
169
+ </div>
170
+ <h3 class="text-2xl font-bold mb-4">Upload Your Video</h3>
171
+ <p class="text-purple-100">
172
+ Simply drag and drop your video file or browse from your device.
173
+ </p>
174
+ </div>
175
+
176
+ <!-- Step 2 -->
177
+ <div class="text-center">
178
+ <div class="w-16 h-16 bg-purple-500 rounded-full flex items-center justify-center mx-auto mb-6">
179
+ <span class="text-2xl font-bold">2</span>
180
+ </div>
181
+ <h3 class="text-2xl font-bold mb-4">Choose Your Settings</h3>
182
+ <p class="text-purple-100">
183
+ Select your desired output format and resolution options.
184
+ </p>
185
+ </div>
186
+
187
+ <!-- Step 3 -->
188
+ <div class="text-center">
189
+ <div class="w-16 h-16 bg-purple-500 rounded-full flex items-center justify-center mx-auto mb-6">
190
+ <span class="text-2xl font-bold">3</span>
191
+ </div>
192
+ <h3 class="text-2xl font-bold mb-4">Download Your Video</h3>
193
+ <p class="text-purple-100">
194
+ Get your perfectly resized video ready to share anywhere.
195
+ </p>
196
+ </div>
197
+ </div>
198
+ </div>
199
+ </section>
200
+
201
+ <!-- Video Demo Section -->
202
+ <section class="px-6 py-20">
203
+ <div class="max-w-6xl mx-auto">
204
+ <div class="grid md:grid-cols-2 gap-12 items-center">
205
+ <div>
206
+ <h2 class="text-4xl font-bold mb-6">See It In Action</h2>
207
+ <p class="text-purple-100 mb-8">
208
+ Watch how our AI-powered video resizing works its magic on your content.
209
+ </p>
210
+ <div class="space-y-4">
211
+ <div class="flex items-center space-x-3">
212
+ <i class="fas fa-check-circle text-green-400"></i>
213
+ <span>Preserves important content</span>
214
+ </div>
215
+ <div class="flex items-center space-x-3">
216
+ <i class="fas fa-check-circle text-green-400"></i>
217
+ <span>Maintains video quality</span>
218
+ </div>
219
+ <div class="flex items-center space-x-3">
220
+ <i class="fas fa-check-circle text-green-400"></i>
221
+ <span>Fast processing</span>
222
+ </div>
223
+ </div>
224
+ </div>
225
+ <div class="relative">
226
+ <div class="bg-gray-800 rounded-2xl p-4 aspect-video flex items-center justify-center">
227
+ <div class="text-center">
228
+ <i class="fas fa-play text-6xl text-purple-400"></i>
229
+ <p class="mt-4 text-purple-200">Video Demo</p>
230
+ </div>
231
+ </div>
232
+ </div>
233
+ </div>
234
+ </div>
235
+ </section>
236
+
237
+ <!-- Testimonials Section -->
238
+ <section class="px-6 py-20">
239
+ <div class="max-w-6xl mx-auto">
240
+ <div class="text-center mb-16">
241
+ <h2 class="text-4xl font-bold mb-4">What Our Users Say</h2>
242
+ <p class="text-purple-100 max-w-2xl mx-auto">
243
+ Hear from satisfied customers who love our video resizing service.
244
+ </p>
245
+ </div>
246
+
247
+ <div class="grid md:grid-cols-3 gap-8">
248
+ <!-- Testimonial 1 -->
249
+ <div class="testimonial-card rounded-2xl p-8">
250
+ <div class="flex items-center mb-6">
251
+ <div class="w-12 h-12 bg-purple-400 rounded-full flex items-center justify-center mr-4">
252
+ <i class="fas fa-user text-white"></i>
253
+ </div>
254
+ <div>
255
+ <h4 class="font-bold">Sarah Johnson</h4>
256
+ <p class="text-purple-200 text-sm">Content Creator</p>
257
+ </div>
258
+ </div>
259
+ <p class="text-purple-100">
260
+ "This tool saved me hours of work! The AI perfectly resized my videos for Instagram without cropping out important parts."
261
+ </p>
262
+ </div>
263
+
264
+ <!-- Testimonial 2 -->
265
+ <div class="testimonial-card rounded-2xl p-8">
266
+ <div class="flex items-center mb-6">
267
+ <div class="w-12 h-12 bg-purple-400 rounded-full flex items-center justify-center mr-4">
268
+ <i class="fas fa-user text-white"></i>
269
+ </div>
270
+ <div>
271
+ <h4 class="font-bold">Michael Chen</h4>
272
+ <p class="text-purple-200 text-sm">Marketing Manager</p>
273
+ </div>
274
+ </div>
275
+ <p class="text-purple-100">
276
+ "The quality is amazing and the processing speed is unmatched. Highly recommend for any video content needs."
277
+ </p>
278
+ </div>
279
+
280
+ <!-- Testimonial 3 -->
281
+ <div class="testimonial-card rounded-2xl p-8">
282
+ <div class="flex items-center mb-6">
283
+ <div class="w-12 h-12 bg-purple-400 rounded-full flex items-center justify-center mr-4">
284
+ <i class="fas fa-user text-white"></i>
285
+ </div>
286
+ <div>
287
+ <h4 class="font-bold">Emily Rodriguez</h4>
288
+ <p class="text-purple-200 text-sm">Social Media Specialist</p>
289
+ </div>
290
+ </div>
291
+ <p class="text-purple-100">
292
+ "Game changer for my social media workflow. The AI understands what's important in each frame."
293
+ </p>
294
+ </div>
295
+ </div>
296
+ </div>
297
+ </section>
298
+
299
+ <!-- Pricing Section -->
300
+ <section class="px-6 py-20">
301
+ <div class="max-w-6xl mx-auto">
302
+ <div class="text-center mb-16">
303
+ <h2 class="text-4xl font-bold mb-4">Simple Pricing</h2>
304
+ <p class="text-purple-100 max-w-2xl mx-auto">
305
+ Choose the perfect plan for your video resizing needs.
306
+ </p>
307
+ </div>
308
+
309
+ <div class="grid md:grid-cols-3 gap-8">
310
+ <!-- Basic Plan -->
311
+ <div class="pricing-card rounded-2xl p-8 text-center">
312
+ <h3 class="text-2xl font-bold mb-4">Basic</h3>
313
+ <div class="mb-6">
314
+ <span class="text-4xl font-bold">$9</span>
315
+ <span class="text-purple-200">/month</span>
316
+ </div>
317
+ <ul class="space-y-4 mb-8">
318
+ <li class="flex items-center justify-center">
319
+ <i class="fas fa-check text-green-400 mr-3"></i>
320
+ <span>10 videos/month</span>
321
+ </li>
322
+ <li class="flex items-center justify-center">
323
+ <i class="fas fa-check text-green-400 mr-3"></i>
324
+ <span>720p resolution</span>
325
+ </li>
326
+ <li class="flex items-center justify-center">
327
+ <i class="fas fa-check text-green-400 mr-3"></i>
328
+ <span>Basic AI features</span>
329
+ </li>
330
+ </ul>
331
+ <button class="w-full bg-purple-600 hover:bg-purple-700 py-3 rounded-lg font-semibold transition-colors">
332
+ Get Started
333
+ </button>
334
+ </div>
335
+
336
+ <!-- Pro Plan -->
337
+ <div class="pricing-card rounded-2xl p-8 text-center border-2 border-purple-400">
338
+ <h3 class="text-2xl font-bold mb-4">Pro</h3>
339
+ <div class="mb-6">
340
+ <span class="text-4xl font-bold">$29</span>
341
+ <span class="text-purple-200">/month</span>
342
+ </div>
343
+ <ul class="space-y-4 mb-8">
344
+ <li class="flex items-center justify-center">
345
+ <i class="fas fa-check text-green-400 mr-3"></i>
346
+ <span>50 videos/month</span>
347
+ </li>
348
+ <li class="flex items-center justify-center">
349
+ <i class="fas fa-check text-green-400 mr-3"></i>
350
+ <span>1080p resolution</span>
351
+ </li>
352
+ <li class="flex items-center justify-center">
353
+ <i class="fas fa-check text-green-400 mr-3"></i>
354
+ <span>Advanced AI features</span>
355
+ </li>
356
+ <li class="flex items-center justify-center">
357
+ <i class="fas fa-check text-green-400 mr-3"></i>
358
+ <span>Priority support</span>
359
+ </li>
360
+ </ul>
361
+ <button class="w-full bg-purple-600 hover:bg-purple-700 py-3 rounded-lg font-semibold transition-colors">
362
+ Get Started
363
+ </button>
364
+ </div>
365
+
366
+ <!-- Enterprise Plan -->
367
+ <div class="pricing-card rounded-2xl p-8 text-center">
368
+ <h3 class="text-2xl font-bold mb-4">Enterprise</h3>
369
+ <div class="mb-6">
370
+ <span class="text-4xl font-bold">$99</span>
371
+ <span class="text-purple-200">/month</span>
372
+ </div>
373
+ <ul class="space-y-4 mb-8">
374
+ <li class="flex items-center justify-center">
375
+ <i class="fas fa-check text-green-400 mr-3"></i>
376
+ <span>Unlimited videos</span>
377
+ </li>
378
+ <li class="flex items-center justify-center">
379
+ <i class="fas fa-check text-green-400 mr-3"></i>
380
+ <span>4K resolution</span>
381
+ </li>
382
+ <li class="flex items-center justify-center">
383
+ <i class="fas fa-check text-green-400 mr-3"></i>
384
+ <span>All AI features</span>
385
+ </li>
386
+ <li class="flex items-center justify-center">
387
+ <i class="fas fa-check text-green-400 mr-3"></i>
388
+ <span>Dedicated support</span>
389
+ </li>
390
+ <li class="flex items-center justify-center">
391
+ <i class="fas fa-check text-green-400 mr-3"></i>
392
+ <span>API access</span>
393
+ </li>
394
+ </ul>
395
+ <button class="w-full bg-purple-600 hover:bg-purple-700 py-3 rounded-lg font-semibold transition-colors">
396
+ Get Started
397
+ </button>
398
+ </div>
399
+ </div>
400
+ </div>
401
+ </section>
402
+
403
+ <!-- Footer -->
404
+ <footer class="px-6 py-12 border-t border-white/10">
405
+ <div class="max-w-6xl mx-auto">
406
+ <div class="grid md:grid-cols-4 gap-8 mb-8">
407
+ <div>
408
+ <div class="flex items-center space-x-2 mb-4">
409
+ <div class="w-8 h-8 bg-white rounded-lg flex items-center justify-center">
410
+ <i class="fas fa-play text-purple-600"></i>
411
+ </div>
412
+ <span class="text-xl font-bold">VideoResize</span>
413
+ </div>
414
+ <p class="text-purple-200 text-sm">
415
+ AI-powered video resizing for perfect content every time.
416
+ </p>
417
+ </div>
418
+
419
+ <div>
420
+ <h4 class="font-bold mb-4">Product</h4>
421
+ <ul class="space-y-2 text-purple-200">
422
+ <li><a href="#" class="hover:text-white transition-colors">Features</a></li>
423
+ <li><a href="#" class="hover:text-white transition-colors">Pricing</a></li>
424
+ <li><a href="#" class="hover:text-white transition-colors">About</a></li>
425
+ <li><a href="#" class="hover:text-white transition-colors">Contact</a></li>
426
+ </ul>
427
+ </div>
428
+
429
+ <div>
430
+ <h4 class="font-bold mb-4">Resources</h4>
431
+ <ul class="space-y-2 text-purple-200">
432
+ <li><a href="#" class="hover:text-white transition-colors">Blog</a></li>
433
+ <li><a href="#" class="hover:text-white transition-colors">Help Center</a></li>
434
+ <li><a href="#" class="hover:text-white transition-colors">API Docs</a></li>
435
+ <li><a href="#" class="hover:text-white transition-colors">Status</a></li>
436
+ </ul>
437
+ </div>
438
+
439
+ <div>
440
+ <h4 class="font-bold mb-4">Legal</h4>
441
+ <ul class="space-y-2 text-purple-200">
442
+ <li><a href="#" class="hover:text-white transition-colors">Privacy</a></li>
443
+ <li><a href="#" class="hover:text-white transition-colors">Terms</a></li>
444
+ <li><a href="#" class="hover:text-white transition-colors">Cookies</a></li>
445
+ </ul>
446
+ </div>
447
+ </div>
448
+
449
+ <div class="border-t border-white/10 pt-8 flex flex-col md:flex-row justify-between items-center">
450
+ <p class="text-purple-200 text-sm">
451
+ © 2024 VideoResize. All rights reserved.
452
+ </p>
453
+ <div class="flex space-x-4 mt-4 md:mt-0">
454
+ <a href="#" class="text-purple-200 hover:text-white transition-colors">
455
+ <i class="fab fa-twitter"></i>
456
+ </a>
457
+ <a href="#" class="text-purple-200 hover:text-white transition-colors">
458
+ <i class="fab fa-facebook"></i>
459
+ </a>
460
+ <a href="#" class="text-purple-200 hover:text-white transition-colors">
461
+ <i class="fab fa-instagram"></i>
462
+ </a>
463
+ <a href="#" class="text-purple-200 hover:text-white transition-colors">
464
+ <i class="fab fa-linkedin"></i>
465
+ </a>
466
+ </div>
467
+ </div>
468
+ </div>
469
+ </footer>
470
+
471
+ <script>
472
+ // Simple upload functionality
473
+ document.querySelector('button:contains("Browse Files")').addEventListener('click', function() {
474
+ const input = document.createElement('input');
475
+ input.type = 'file';
476
+ input.accept = 'video/*';
477
+ input.click();
478
+ });
479
+
480
+ // Mobile menu toggle (if needed)
481
+ const mobileMenuBtn = document.querySelector('.mobile-menu-btn');
482
+ const mobileMenu = document.querySelector('.mobile-menu');
483
+
484
+ if (mobileMenuBtn && mobileMenu) {
485
+ mobileMenuBtn.addEventListener('click', function() {
486
+ mobileMenu.classList.toggle('hidden');
487
+ });
488
+ }
489
+ </script>
490
+ </body>
491
+ </html>