Hugging Face's logo

Spaces:
enzostvs
/
deepsite
Running

App Files Community
518
salahAlkaabi commited on
Commit
8b369c4
·
verified ·
1 Parent(s): 15a77af

Upload deepseek_html_20251020_4f8b66.html

Browse files
Files changed (1) hide show
  1. deepseek_html_20251020_4f8b66.html +741 -0
deepseek_html_20251020_4f8b66.html ADDED
@@ -0,0 +1,741 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="ar" dir="rtl">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Smart Lease – العقود الذكية للإيجار بنقرة واحدة</title>
7
+ <link rel="preconnect" href="https://fonts.googleapis.com">
8
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
9
+ <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&family=Noto+Kufi+Arabic:wght@300;400;500;600;700&display=swap" rel="stylesheet">
10
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
11
+ <style>
12
+ :root {
13
+ --primary-color: #81D8D0;
14
+ --primary-dark: #5bb8af;
15
+ --text-color: #333;
16
+ --light-bg: #f9f9f9;
17
+ --white: #ffffff;
18
+ --shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
19
+ --glow: 0 0 10px rgba(129, 216, 208, 0.5);
20
+ --transition: all 0.3s ease;
21
+ }
22
+
23
+ [data-theme="dark"] {
24
+ --text-color: #f0f0f0;
25
+ --light-bg: #1a1a1a;
26
+ --white: #2d2d2d;
27
+ --shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
28
+ }
29
+
30
+ * {
31
+ margin: 0;
32
+ padding: 0;
33
+ box-sizing: border-box;
34
+ }
35
+
36
+ body {
37
+ font-family: 'Noto Kufi Arabic', 'Poppins', sans-serif;
38
+ background-color: var(--light-bg);
39
+ color: var(--text-color);
40
+ line-height: 1.6;
41
+ transition: var(--transition);
42
+ }
43
+
44
+ .container {
45
+ width: 100%;
46
+ max-width: 1200px;
47
+ margin: 0 auto;
48
+ padding: 0 20px;
49
+ }
50
+
51
+ /* Header */
52
+ header {
53
+ background: linear-gradient(135deg, var(--white) 0%, #f0fdfc 100%);
54
+ padding: 20px 0;
55
+ box-shadow: var(--shadow);
56
+ position: sticky;
57
+ top: 0;
58
+ z-index: 100;
59
+ }
60
+
61
+ .header-container {
62
+ display: flex;
63
+ justify-content: space-between;
64
+ align-items: center;
65
+ }
66
+
67
+ .logo {
68
+ display: flex;
69
+ align-items: center;
70
+ gap: 10px;
71
+ font-weight: 700;
72
+ font-size: 1.5rem;
73
+ color: var(--primary-color);
74
+ }
75
+
76
+ .logo i {
77
+ font-size: 1.8rem;
78
+ }
79
+
80
+ .nav-controls {
81
+ display: flex;
82
+ align-items: center;
83
+ gap: 15px;
84
+ }
85
+
86
+ .theme-toggle, .lang-toggle {
87
+ background: none;
88
+ border: none;
89
+ cursor: pointer;
90
+ font-size: 1.2rem;
91
+ color: var(--text-color);
92
+ transition: var(--transition);
93
+ }
94
+
95
+ .theme-toggle:hover, .lang-toggle:hover {
96
+ color: var(--primary-color);
97
+ }
98
+
99
+ /* Hero Section */
100
+ .hero {
101
+ padding: 80px 0;
102
+ background: linear-gradient(135deg, var(--white) 0%, #e8f9f8 100%);
103
+ text-align: center;
104
+ position: relative;
105
+ overflow: hidden;
106
+ }
107
+
108
+ .hero::before {
109
+ content: '';
110
+ position: absolute;
111
+ width: 300px;
112
+ height: 300px;
113
+ background: radial-gradient(circle, var(--primary-color) 0%, transparent 70%);
114
+ opacity: 0.1;
115
+ top: -100px;
116
+ right: -100px;
117
+ border-radius: 50%;
118
+ }
119
+
120
+ .hero::after {
121
+ content: '';
122
+ position: absolute;
123
+ width: 200px;
124
+ height: 200px;
125
+ background: radial-gradient(circle, var(--primary-color) 0%, transparent 70%);
126
+ opacity: 0.1;
127
+ bottom: -50px;
128
+ left: -50px;
129
+ border-radius: 50%;
130
+ }
131
+
132
+ .hero-content {
133
+ max-width: 800px;
134
+ margin: 0 auto;
135
+ position: relative;
136
+ z-index: 1;
137
+ }
138
+
139
+ .hero h1 {
140
+ font-size: 2.5rem;
141
+ margin-bottom: 20px;
142
+ font-weight: 700;
143
+ color: var(--text-color);
144
+ }
145
+
146
+ .hero p {
147
+ font-size: 1.2rem;
148
+ margin-bottom: 30px;
149
+ color: #666;
150
+ }
151
+
152
+ .btn {
153
+ display: inline-block;
154
+ padding: 12px 30px;
155
+ background-color: var(--primary-color);
156
+ color: white;
157
+ border: none;
158
+ border-radius: 30px;
159
+ font-size: 1.1rem;
160
+ font-weight: 600;
161
+ cursor: pointer;
162
+ transition: var(--transition);
163
+ text-decoration: none;
164
+ box-shadow: var(--shadow);
165
+ }
166
+
167
+ .btn:hover {
168
+ background-color: var(--primary-dark);
169
+ transform: translateY(-3px);
170
+ box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
171
+ }
172
+
173
+ /* Steps Section */
174
+ .steps {
175
+ padding: 80px 0;
176
+ background-color: var(--white);
177
+ }
178
+
179
+ .section-title {
180
+ text-align: center;
181
+ margin-bottom: 50px;
182
+ font-size: 2rem;
183
+ font-weight: 700;
184
+ color: var(--text-color);
185
+ }
186
+
187
+ .steps-container {
188
+ display: flex;
189
+ justify-content: space-between;
190
+ flex-wrap: wrap;
191
+ gap: 30px;
192
+ }
193
+
194
+ .step {
195
+ flex: 1;
196
+ min-width: 300px;
197
+ text-align: center;
198
+ padding: 30px 20px;
199
+ background-color: var(--white);
200
+ border-radius: 15px;
201
+ box-shadow: var(--shadow);
202
+ transition: var(--transition);
203
+ }
204
+
205
+ .step:hover {
206
+ transform: translateY(-10px);
207
+ box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
208
+ }
209
+
210
+ .step-icon {
211
+ width: 80px;
212
+ height: 80px;
213
+ margin: 0 auto 20px;
214
+ background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
215
+ border-radius: 50%;
216
+ display: flex;
217
+ align-items: center;
218
+ justify-content: center;
219
+ font-size: 2rem;
220
+ color: white;
221
+ box-shadow: var(--glow);
222
+ }
223
+
224
+ .step h3 {
225
+ font-size: 1.5rem;
226
+ margin-bottom: 15px;
227
+ font-weight: 600;
228
+ }
229
+
230
+ .step p {
231
+ color: #666;
232
+ }
233
+
234
+ /* Blockchain Section */
235
+ .blockchain {
236
+ padding: 80px 0;
237
+ background-color: var(--light-bg);
238
+ position: relative;
239
+ overflow: hidden;
240
+ }
241
+
242
+ .blockchain::before {
243
+ content: '';
244
+ position: absolute;
245
+ width: 100%;
246
+ height: 2px;
247
+ background: linear-gradient(90deg, transparent, var(--primary-color), transparent);
248
+ top: 50%;
249
+ left: 0;
250
+ transform: translateY(-50%);
251
+ }
252
+
253
+ .blockchain-content {
254
+ display: flex;
255
+ align-items: center;
256
+ justify-content: space-between;
257
+ gap: 50px;
258
+ }
259
+
260
+ .blockchain-text {
261
+ flex: 1;
262
+ }
263
+
264
+ .blockchain-text h2 {
265
+ font-size: 2rem;
266
+ margin-bottom: 20px;
267
+ font-weight: 700;
268
+ }
269
+
270
+ .blockchain-text p {
271
+ margin-bottom: 20px;
272
+ color: #666;
273
+ }
274
+
275
+ .blockchain-visual {
276
+ flex: 1;
277
+ display: flex;
278
+ justify-content: center;
279
+ align-items: center;
280
+ }
281
+
282
+ .chain-animation {
283
+ position: relative;
284
+ width: 300px;
285
+ height: 200px;
286
+ }
287
+
288
+ .chain-link {
289
+ position: absolute;
290
+ width: 60px;
291
+ height: 60px;
292
+ border: 3px solid var(--primary-color);
293
+ border-radius: 50%;
294
+ display: flex;
295
+ align-items: center;
296
+ justify-content: center;
297
+ background-color: var(--white);
298
+ box-shadow: var(--glow);
299
+ }
300
+
301
+ .chain-link:nth-child(1) {
302
+ top: 0;
303
+ left: 0;
304
+ }
305
+
306
+ .chain-link:nth-child(2) {
307
+ top: 0;
308
+ right: 0;
309
+ }
310
+
311
+ .chain-link:nth-child(3) {
312
+ bottom: 0;
313
+ left: 50%;
314
+ transform: translateX(-50%);
315
+ }
316
+
317
+ .chain-link i {
318
+ font-size: 1.5rem;
319
+ color: var(--primary-color);
320
+ }
321
+
322
+ /* Vault Section */
323
+ .vault {
324
+ padding: 80px 0;
325
+ background-color: var(--white);
326
+ }
327
+
328
+ .vault-content {
329
+ display: flex;
330
+ align-items: center;
331
+ justify-content: space-between;
332
+ gap: 50px;
333
+ }
334
+
335
+ .vault-visual {
336
+ flex: 1;
337
+ display: flex;
338
+ justify-content: center;
339
+ }
340
+
341
+ .vault-icon {
342
+ width: 200px;
343
+ height: 200px;
344
+ background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
345
+ border-radius: 50%;
346
+ display: flex;
347
+ align-items: center;
348
+ justify-content: center;
349
+ font-size: 4rem;
350
+ color: white;
351
+ box-shadow: var(--glow);
352
+ }
353
+
354
+ .vault-text {
355
+ flex: 1;
356
+ }
357
+
358
+ .vault-text h2 {
359
+ font-size: 2rem;
360
+ margin-bottom: 20px;
361
+ font-weight: 700;
362
+ }
363
+
364
+ .vault-text p {
365
+ margin-bottom: 20px;
366
+ color: #666;
367
+ }
368
+
369
+ /* Export Section */
370
+ .export {
371
+ padding: 80px 0;
372
+ background-color: var(--light-bg);
373
+ }
374
+
375
+ .export-options {
376
+ display: flex;
377
+ justify-content: center;
378
+ flex-wrap: wrap;
379
+ gap: 20px;
380
+ margin-top: 40px;
381
+ }
382
+
383
+ .export-option {
384
+ display: flex;
385
+ flex-direction: column;
386
+ align-items: center;
387
+ padding: 20px;
388
+ background-color: var(--white);
389
+ border-radius: 15px;
390
+ box-shadow: var(--shadow);
391
+ transition: var(--transition);
392
+ min-width: 150px;
393
+ }
394
+
395
+ .export-option:hover {
396
+ transform: translateY(-5px);
397
+ box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
398
+ }
399
+
400
+ .export-option i {
401
+ font-size: 2rem;
402
+ margin-bottom: 15px;
403
+ color: var(--primary-color);
404
+ }
405
+
406
+ .export-option span {
407
+ font-weight: 500;
408
+ }
409
+
410
+ /* Legal Section */
411
+ .legal {
412
+ padding: 60px 0;
413
+ background-color: var(--white);
414
+ text-align: center;
415
+ }
416
+
417
+ .legal p {
418
+ font-size: 1.1rem;
419
+ color: #666;
420
+ max-width: 800px;
421
+ margin: 0 auto;
422
+ }
423
+
424
+ /* Footer */
425
+ footer {
426
+ padding: 60px 0 30px;
427
+ background: linear-gradient(135deg, var(--white) 0%, #e8f9f8 100%);
428
+ text-align: center;
429
+ }
430
+
431
+ .footer-cta {
432
+ display: flex;
433
+ justify-content: center;
434
+ flex-wrap: wrap;
435
+ gap: 20px;
436
+ margin-bottom: 40px;
437
+ }
438
+
439
+ .footer-links {
440
+ display: flex;
441
+ justify-content: center;
442
+ gap: 30px;
443
+ margin-top: 30px;
444
+ flex-wrap: wrap;
445
+ }
446
+
447
+ .footer-links a {
448
+ color: var(--text-color);
449
+ text-decoration: none;
450
+ transition: var(--transition);
451
+ }
452
+
453
+ .footer-links a:hover {
454
+ color: var(--primary-color);
455
+ }
456
+
457
+ .copyright {
458
+ margin-top: 30px;
459
+ color: #666;
460
+ font-size: 0.9rem;
461
+ }
462
+
463
+ /* Responsive */
464
+ @media (max-width: 992px) {
465
+ .blockchain-content, .vault-content {
466
+ flex-direction: column;
467
+ }
468
+
469
+ .hero h1 {
470
+ font-size: 2rem;
471
+ }
472
+ }
473
+
474
+ @media (max-width: 768px) {
475
+ .steps-container {
476
+ flex-direction: column;
477
+ }
478
+
479
+ .step {
480
+ min-width: 100%;
481
+ }
482
+
483
+ .hero h1 {
484
+ font-size: 1.8rem;
485
+ }
486
+
487
+ .section-title {
488
+ font-size: 1.7rem;
489
+ }
490
+ }
491
+
492
+ /* Animation */
493
+ @keyframes pulse {
494
+ 0% { transform: scale(1); }
495
+ 50% { transform: scale(1.05); }
496
+ 100% { transform: scale(1); }
497
+ }
498
+
499
+ .pulse {
500
+ animation: pulse 2s infinite;
501
+ }
502
+
503
+ /* Language Toggle */
504
+ .lang-ar {
505
+ display: block;
506
+ }
507
+
508
+ .lang-en {
509
+ display: none;
510
+ }
511
+
512
+ body[lang="en"] .lang-ar {
513
+ display: none;
514
+ }
515
+
516
+ body[lang="en"] .lang-en {
517
+ display: block;
518
+ }
519
+
520
+ body[lang="en"] {
521
+ direction: ltr;
522
+ text-align: left;
523
+ }
524
+
525
+ body[lang="en"] .hero::before {
526
+ right: auto;
527
+ left: -100px;
528
+ }
529
+
530
+ body[lang="en"] .hero::after {
531
+ left: auto;
532
+ right: -50px;
533
+ }
534
+ </style>
535
+ </head>
536
+ <body>
537
+ <header>
538
+ <div class="container header-container">
539
+ <div class="logo">
540
+ <i class="fas fa-file-contract"></i>
541
+ <span class="lang-ar">Smart Lease</span>
542
+ <span class="lang-en">Smart Lease</span>
543
+ </div>
544
+ <div class="nav-controls">
545
+ <button class="theme-toggle" id="themeToggle">
546
+ <i class="fas fa-moon"></i>
547
+ </button>
548
+ <button class="lang-toggle" id="langToggle">
549
+ <i class="fas fa-language"></i>
550
+ </button>
551
+ </div>
552
+ </div>
553
+ </header>
554
+
555
+ <section class="hero">
556
+ <div class="container hero-content">
557
+ <h1 class="lang-ar">Smart Lease – العقود الذكية للإيجار بنقرة واحدة</h1>
558
+ <h1 class="lang-en">Smart Lease – One-Click Smart Rental Contracts</h1>
559
+ <p class="lang-ar">وقّع عقد الإيجار… بدون ورق، بدون مكتب، بدون تأخير.</p>
560
+ <p class="lang-en">Sign your lease contract... without paper, without office, without delay.</p>
561
+ <a href="#" class="btn lang-ar">📥 أنشئ عقدك الآن</a>
562
+ <a href="#" class="btn lang-en">📥 Create Your Contract Now</a>
563
+ </div>
564
+ </section>
565
+
566
+ <section class="steps">
567
+ <div class="container">
568
+ <h2 class="section-title lang-ar">كيف تعمل العقود الذكية</h2>
569
+ <h2 class="section-title lang-en">How Smart Contracts Work</h2>
570
+ <div class="steps-container">
571
+ <div class="step">
572
+ <div class="step-icon">
573
+ <i class="fas fa-home"></i>
574
+ </div>
575
+ <h3 class="lang-ar">اختر العقار المراد تأجيره</h3>
576
+ <h3 class="lang-en">Choose the Property to Rent</h3>
577
+ <p class="lang-ar">تصفح قائمة العقارات المتاحة واختر العقار الذي ترغب في تأجيره</p>
578
+ <p class="lang-en">Browse the list of available properties and choose the one you want to rent</p>
579
+ </div>
580
+ <div class="step">
581
+ <div class="step-icon">
582
+ <i class="fas fa-user-edit"></i>
583
+ </div>
584
+ <h3 class="lang-ar">أضف بياناتك</h3>
585
+ <h3 class="lang-en">Add Your Information</h3>
586
+ <p class="lang-ar">أدخل بياناتك الشخصية ومدة الإيجار والمبلغ والمعلومات الأخرى المطلوبة</p>
587
+ <p class="lang-en">Enter your personal information, lease duration, amount, and other required details</p>
588
+ </div>
589
+ <div class="step">
590
+ <div class="step-icon">
591
+ <i class="fas fa-file-signature"></i>
592
+ </div>
593
+ <h3 class="lang-ar">اضغط توقيع 🔐</h3>
594
+ <h3 class="lang-en">Click Sign 🔐</h3>
595
+ <p class="lang-ar">قم بالتوقيع الرقمي على العقد وسيتم تخزينه في محفظتك العقارية</p>
596
+ <p class="lang-en">Digitally sign the contract and it will be stored in your property vault</p>
597
+ </div>
598
+ </div>
599
+ </div>
600
+ </section>
601
+
602
+ <section class="blockchain">
603
+ <div class="container blockchain-content">
604
+ <div class="blockchain-text">
605
+ <h2 class="lang-ar">العقود المبنية على تقنية البلوكتشين</h2>
606
+ <h2 class="lang-en">Blockchain-Based Contracts</h2>
607
+ <p class="lang-ar">كل عقد يتم توقيعه على البلوكتشين ولا يمكن تعديله بعد التوقيع</p>
608
+ <p class="lang-en">Every contract is signed on the blockchain and cannot be modified after signing</p>
609
+ <p class="lang-ar">يمكن لأي جهة التحقق من صحة العقد عبر رمز QR أو رابط توثيق</p>
610
+ <p class="lang-en">Any party can verify the contract validity via QR code or verification link</p>
611
+ </div>
612
+ <div class="blockchain-visual">
613
+ <div class="chain-animation">
614
+ <div class="chain-link pulse">
615
+ <i class="fas fa-user"></i>
616
+ </div>
617
+ <div class="chain-link pulse">
618
+ <i class="fas fa-file-contract"></i>
619
+ </div>
620
+ <div class="chain-link pulse">
621
+ <i class="fas fa-user-tie"></i>
622
+ </div>
623
+ </div>
624
+ </div>
625
+ </div>
626
+ </section>
627
+
628
+ <section class="vault">
629
+ <div class="container vault-content">
630
+ <div class="vault-visual">
631
+ <div class="vault-icon">
632
+ <i class="fas fa-shield-alt"></i>
633
+ </div>
634
+ </div>
635
+ <div class="vault-text">
636
+ <h2 class="lang-ar">التكامل مع Proppix Vault</h2>
637
+ <h2 class="lang-en">Integration with Proppix Vault</h2>
638
+ <p class="lang-ar">العقد يتم تخزينه داخل Vault الخاص بك للأبد</p>
639
+ <p class="lang-en">The contract is stored in your Vault forever</p>
640
+ <p class="lang-ar">شارك العقد مع أي جهة بنقرة واحدة</p>
641
+ <p class="lang-en">Share the contract with any party with one click</p>
642
+ </div>
643
+ </div>
644
+ </section>
645
+
646
+ <section class="export">
647
+ <div class="container">
648
+ <h2 class="section-title lang-ar">تصدير ومشاركة العقد</h2>
649
+ <h2 class="section-title lang-en">Export & Share Contract</h2>
650
+ <div class="export-options">
651
+ <div class="export-option">
652
+ <i class="fas fa-file-pdf"></i>
653
+ <span class="lang-ar">تحميل PDF</span>
654
+ <span class="lang-en">Download PDF</span>
655
+ </div>
656
+ <div class="export-option">
657
+ <i class="fas fa-link"></i>
658
+ <span class="lang-ar">نسخ رابط البلوكتشين</span>
659
+ <span class="lang-en">Copy Blockchain Link</span>
660
+ </div>
661
+ <div class="export-option">
662
+ <i class="fas fa-search"></i>
663
+ <span class="lang-ar">صفحة التحقق العامة</span>
664
+ <span class="lang-en">Public Verification Page</span>
665
+ </div>
666
+ <div class="export-option">
667
+ <i class="fab fa-whatsapp"></i>
668
+ <span class="lang-ar">إرسال عبر واتساب</span>
669
+ <span class="lang-en">Send via WhatsApp</span>
670
+ </div>
671
+ <div class="export-option">
672
+ <i class="fas fa-envelope"></i>
673
+ <span class="lang-ar">إرسال عبر البريد</span>
674
+ <span class="lang-en">Send via Email</span>
675
+ </div>
676
+ </div>
677
+ </div>
678
+ </section>
679
+
680
+ <section class="legal">
681
+ <div class="container">
682
+ <p class="lang-ar">متوافق بالكامل مع قوانين دبي للعقارات</p>
683
+ <p class="lang-en">Fully compliant with Dubai real estate laws</p>
684
+ <p class="lang-ar">جاهز لتقديمه للجهات الرسمية عند الحاجة</p>
685
+ <p class="lang-en">Ready to submit to official authorities when needed</p>
686
+ </div>
687
+ </section>
688
+
689
+ <footer>
690
+ <div class="container">
691
+ <div class="footer-cta">
692
+ <a href="#" class="btn lang-ar">📜 اقرأ المزيد عن العقود الذكية</a>
693
+ <a href="#" class="btn lang-en">📜 Read More About Smart Contracts</a>
694
+ <a href="#" class="btn lang-ar">📥 أنشئ عقدك الآن</a>
695
+ <a href="#" class="btn lang-en">📥 Create Your Contract Now</a>
696
+ <a href="#" class="btn lang-ar">🧠 اسأل AI عن العقد</a>
697
+ <a href="#" class="btn lang-en">🧠 Ask AI About the Contract</a>
698
+ </div>
699
+ <div class="footer-links">
700
+ <a href="#" class="lang-ar">الشروط والأحكام</a>
701
+ <a href="#" class="lang-en">Terms & Conditions</a>
702
+ <a href="#" class="lang-ar">سياسة الخصوصية</a>
703
+ <a href="#" class="lang-en">Privacy Policy</a>
704
+ <a href="#" class="lang-ar">اتصل بنا</a>
705
+ <a href="#" class="lang-en">Contact Us</a>
706
+ </div>
707
+ <div class="copyright">
708
+ <p class="lang-ar">© 2023 Smart Lease. جميع الحقوق محفوظة.</p>
709
+ <p class="lang-en">© 2023 Smart Lease. All rights reserved.</p>
710
+ </div>
711
+ </div>
712
+ </footer>
713
+
714
+ <script>
715
+ // Theme Toggle
716
+ const themeToggle = document.getElementById('themeToggle');
717
+ const themeIcon = themeToggle.querySelector('i');
718
+
719
+ themeToggle.addEventListener('click', () => {
720
+ document.body.setAttribute('data-theme',
721
+ document.body.getAttribute('data-theme') === 'dark' ? 'light' : 'dark');
722
+
723
+ if (document.body.getAttribute('data-theme') === 'dark') {
724
+ themeIcon.classList.remove('fa-moon');
725
+ themeIcon.classList.add('fa-sun');
726
+ } else {
727
+ themeIcon.classList.remove('fa-sun');
728
+ themeIcon.classList.add('fa-moon');
729
+ }
730
+ });
731
+
732
+ // Language Toggle
733
+ const langToggle = document.getElementById('langToggle');
734
+
735
+ langToggle.addEventListener('click', () => {
736
+ document.body.setAttribute('lang',
737
+ document.body.getAttribute('lang') === 'en' ? 'ar' : 'en');
738
+ });
739
+ </script>
740
+ </body>
741
+ </html>