-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
602 lines (519 loc) · 61.6 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="theme-color" content="#016170">
<meta name="description" content="lorem">
<title>Digital Agency</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.css" />
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@300;400;600;700&display=swap"
rel="stylesheet">
<link rel="stylesheet" href="assets/css/style.css">
</head>
<body class="bg-white-2 font-nunito-sans">
<!-- START PRELOAD PAGE-->
<div id="preload" class="fixed inset-0 flex justify-center items-center bg-green-1 text-white-1 z-50">
<div class="border border-white-1 rounded-full p-6">
<svg width="72" height="72" viewBox="0 0 72 72" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M51.3687 64.9594L38.9412 28.7757C38.5293 27.6085 38.5979 26.3039 39.2845 25.2054V25.1367H31.5946C32.2812 26.2353 32.4186 27.6085 32.0066 28.8443L19.5105 64.9594C19.3732 65.5087 19.0986 65.9206 18.8239 66.3326L18 67.4998H25.2779C24.866 66.3326 24.7973 65.0967 25.2093 63.9295L31.114 46.9019C35.9514 45.901 41.6018 41.7524 41.6018 41.7524L49.1715 63.9295C49.5148 65.0967 49.5148 66.3326 49.0342 67.4998H52.8792L52.0553 66.3326C51.7806 65.9206 51.506 65.5087 51.3687 64.9594ZM31.6633 45.1854L37.2247 29.1876L41.6018 41.7524C37.5875 44.3929 35.3966 45.2986 31.6633 45.1854Z"
fill="#FFFFFC" />
<path
d="M31.1141 4.49988H18.5493C19.2359 5.6671 19.5792 6.97164 19.5792 8.27617V43.0867C19.5792 44.3912 19.2359 45.6958 18.5493 46.863H31.1141C42.7176 46.7943 52.1926 37.3193 52.1926 25.6471C52.1926 14.0436 42.7176 4.56854 31.1141 4.49988ZM31.0454 45.0778H24.7974V6.28504H31.0454C41.7563 6.28504 46.9745 15.0048 46.9745 25.6471C46.9745 36.358 41.7563 45.0778 31.0454 45.0778Z"
fill="#FFFFFC" />
</svg>
</div>
</div>
<!-- END PRELOAD PAGE-->
<!-- START NAVBAR -->
<nav
class="flex items-center justify-between bg-green-1 border-b border-b-white-1 py-3 px-4 text-white-1 md:px-12 lg:py-9 lg:px-28">
<a href="#">
<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M34.2458 43.3064L25.9608 19.1839C25.6862 18.4058 25.732 17.5361 26.1897 16.8037V16.7579H21.0631C21.5208 17.4903 21.6124 18.4058 21.3377 19.2297L13.007 43.3064C12.9155 43.6726 12.7324 43.9472 12.5493 44.2219L12 45H16.852C16.5773 44.2219 16.5315 43.3979 16.8062 42.6198L20.7427 31.268C23.9676 30.6008 27.7345 27.8351 27.7345 27.8351L32.781 42.6198C33.0099 43.3979 33.0099 44.2219 32.6895 45H35.2528L34.7035 44.2219C34.5204 43.9472 34.3373 43.6726 34.2458 43.3064ZM21.1089 30.1237L24.8165 19.4586L27.7345 27.8351C25.0583 29.5954 23.5977 30.1992 21.1089 30.1237Z"
fill="#FFFFFC" />
<path
d="M20.7427 2.99992H12.3662C12.8239 3.77807 13.0528 4.64776 13.0528 5.51745V28.7245C13.0528 29.5941 12.8239 30.4638 12.3662 31.242H20.7427C28.4784 31.1962 34.7951 24.8795 34.7951 17.0981C34.7951 9.3624 28.4784 3.0457 20.7427 2.99992ZM20.6969 30.0519H16.5316V4.19003H20.6969C27.8375 4.19003 31.3163 10.0032 31.3163 17.0981C31.3163 24.2387 27.8375 30.0519 20.6969 30.0519Z"
fill="#FFFFFC" />
</svg>
</a>
<div>
<button class="md:hidden">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M2 5.995C2 5.445 2.446 5 2.995 5H11.005C11.2689 5 11.522 5.10483 11.7086 5.29143C11.8952 5.47803 12 5.73111 12 5.995C12 6.25889 11.8952 6.51197 11.7086 6.69857C11.522 6.88517 11.2689 6.99 11.005 6.99H2.995C2.73111 6.99 2.47803 6.88517 2.29143 6.69857C2.10483 6.51197 2 6.25889 2 5.995ZM2 12C2 11.45 2.446 11.005 2.995 11.005H21.005C21.2689 11.005 21.522 11.1098 21.7086 11.2964C21.8952 11.483 22 11.7361 22 12C22 12.2639 21.8952 12.517 21.7086 12.7036C21.522 12.8902 21.2689 12.995 21.005 12.995H2.995C2.73111 12.995 2.47803 12.8902 2.29143 12.7036C2.10483 12.517 2 12.2639 2 12ZM2.995 17.01C2.73111 17.01 2.47803 17.1148 2.29143 17.3014C2.10483 17.488 2 17.7411 2 18.005C2 18.2689 2.10483 18.522 2.29143 18.7086C2.47803 18.8952 2.73111 19 2.995 19H15.005C15.2689 19 15.522 18.8952 15.7086 18.7086C15.8952 18.522 16 18.2689 16 18.005C16 17.7411 15.8952 17.488 15.7086 17.3014C15.522 17.1148 15.2689 17.01 15.005 17.01H2.995Z"
fill="#FFFFFC" />
</svg>
</button>
<div
class="dropdown fixed bg-black-1 w-full inset-0 px-7 py-3.75 z-20 transition duration-500 transform translate-x-full md:transform-none md:block md:static md:bg-transparent md:p-0">
<button type="button" class="md:hidden">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M1.5 12C1.5 11.8011 1.57902 11.6103 1.71967 11.4697C1.86032 11.329 2.05109 11.25 2.25 11.25H19.9395L15.219 6.531C15.0782 6.39017 14.9991 6.19916 14.9991 6C14.9991 5.80084 15.0782 5.60983 15.219 5.469C15.3598 5.32817 15.5508 5.24905 15.75 5.24905C15.9492 5.24905 16.1402 5.32817 16.281 5.469L22.281 11.469C22.3508 11.5387 22.4063 11.6214 22.4441 11.7126C22.4819 11.8037 22.5013 11.9014 22.5013 12C22.5013 12.0987 22.4819 12.1963 22.4441 12.2875C22.4063 12.3786 22.3508 12.4613 22.281 12.531L16.281 18.531C16.1402 18.6718 15.9492 18.7509 15.75 18.7509C15.5508 18.7509 15.3598 18.6718 15.219 18.531C15.0782 18.3902 14.9991 18.1992 14.9991 18C14.9991 17.8008 15.0782 17.6098 15.219 17.469L19.9395 12.75H2.25C2.05109 12.75 1.86032 12.671 1.71967 12.5303C1.57902 12.3897 1.5 12.1989 1.5 12Z"
fill="#FFFFFC" />
</svg>
</button>
<ul class="text-center md:flex md:text-left md:space-x-8">
<li class="active md:opacity-50"><a href="#home" class="inline-block py-4 px-8 md:p-0">Home</a></li>
<li class="lg:opacity-60"><a href="#service" class="inline-block py-4 px-8 md:p-0">Service</a></li>
<li class="lg:opacity-60"><a href="#work" class="inline-block py-4 px-8 md:p-0">Work</a></li>
<li class="lg:opacity-60"><a href="#blog" class="inline-block py-4 px-8 md:p-0">Blog</a></li>
<li class="lg:opacity-60"><a href="#" class="inline-block py-4 px-8 md:p-0">Contact</a></li>
</ul>
</div>
</div>
</nav>
<!-- END NAVBAR -->
<!-- START HERO -->
<section id="hero" class="bg-green-1 h-42rem px-4 text-white-1 text-center md:px-20">
<div class="relative top-16 lg:top-12">
<h1
class="font-wagon-bold text-2x md:text-5xl md:tracking-wide md:leading-72px lg:text-7xl lg:leading-98px">
Digital <span>Agency</span>
With <br /> Solid Design</h1>
<p class="my-4 lg:text-lg">We provide various services to make your business grow and get bigger. Your
satisfaction is our first
priority.</p>
<svg class="inline-block lg:w-24 lg:h-24 lg:relative lg:-right-2" width="57" height="57" viewBox="0 0 57 57"
fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M44.5429 18.0468C44.5998 17.8893 44.6473 17.7612 44.6848 17.6235C44.8624 16.9057 44.8147 16.2004 44.6491 15.477C44.4115 14.4701 43.9594 13.5638 43.4 12.7078C42.4713 11.2975 41.2903 10.1059 39.9545 9.09262C37.9756 7.58713 35.7863 6.51555 33.4056 5.83842C32.0678 5.46243 30.7219 5.23358 29.3402 5.27968C28.8404 5.29551 28.351 5.36024 27.8618 5.44458C27.5781 5.49702 27.3053 5.63757 27.0323 5.75851C26.9347 5.7989 26.8372 5.83929 26.7578 5.76182C26.708 5.6938 26.6577 5.58656 26.6567 5.50815C26.6643 5.32178 26.7901 5.19282 26.9463 5.13211C27.2583 4.99109 27.5601 4.82078 27.8927 4.75795C28.4305 4.64361 28.9787 4.57817 29.5374 4.56163C30.5953 4.49003 31.6655 4.62417 32.7076 4.86648C36.3453 5.72451 39.5324 7.42128 42.2015 10.0655C43.3922 11.2471 44.3692 12.5883 44.9862 14.1592C45.5224 15.5351 45.7449 16.9147 45.1939 18.3723C45.3025 18.4396 45.4109 18.4873 45.5097 18.5449C46.8022 19.2254 48.0373 20.0242 49.1469 20.9912C50.2269 21.9291 51.171 22.9863 51.8139 24.2726C52.015 24.6819 52.177 25.1113 52.2998 25.5412C52.8646 27.6618 52.0635 29.5146 50.155 30.5964C49.4637 30.9871 48.7216 31.2314 47.9492 31.4073C46.4434 31.7392 44.9145 31.7773 43.384 31.6781C42.9621 31.6538 42.5497 31.6 42.1179 31.566C42.0296 31.5572 41.9512 31.5582 41.8236 31.5499C41.8645 31.6867 41.8954 31.8137 41.9261 31.9212C42.2424 32.9468 42.3925 34.0038 42.2583 35.074C42.098 36.4092 41.5531 37.5628 40.5445 38.477C39.9432 39.0136 39.2712 39.3845 38.5097 39.6486C37.3089 40.065 36.0651 40.1682 34.7998 40.1149C34.633 40.1071 34.4663 40.0993 34.27 40.0821C34.2716 40.2193 34.283 40.3466 34.2844 40.4643C34.338 41.6597 34.0967 42.7802 33.3831 43.7692C32.8723 44.491 32.1922 45.009 31.4029 45.4009C30.3894 45.9033 29.3236 46.1417 28.2071 46.2336C26.6598 46.3699 25.1288 46.2315 23.615 45.8969C23.4971 45.8787 23.3693 45.8508 23.2219 45.8232C23.2335 45.9701 23.2446 46.0778 23.2559 46.2051C23.4088 47.4973 23.5028 48.7903 23.4008 50.0856C23.359 50.6841 23.2681 51.2735 23.1576 51.863C23.0844 52.2953 22.9228 52.7188 22.6725 53.0943C22.4896 53.3809 22.3146 53.5006 22.0409 53.5627C22.0406 53.5431 22.0305 53.5138 22.0305 53.5138C22.3505 53.2257 22.4929 52.8416 22.5959 52.4384C22.7551 51.8189 22.8063 51.1908 22.8184 50.5632C22.8578 48.9549 22.7207 47.3488 22.4956 45.7535C22.4855 45.7242 22.4753 45.6949 22.4647 45.6264C22.3761 45.5981 22.2776 45.5601 22.1694 45.532C19.5521 44.7401 17.1646 43.4944 15.0458 41.7749C13.9172 40.867 12.9145 39.8301 12.1934 38.5643C11.9331 38.1165 11.7413 37.658 11.6078 37.1597C11.515 36.7784 11.481 36.3965 11.5254 36.0136C11.6425 35.1593 12.1059 34.5655 12.9061 34.2617C13.4624 34.0491 14.0309 34.0423 14.62 34.1136C15.8277 34.2657 16.9019 34.7331 17.9001 35.3975C20.1143 36.9001 21.5998 38.9508 22.3269 41.5203C22.6136 42.5365 22.7932 43.6029 23.0214 44.6393C23.0424 44.7567 23.0634 44.8741 23.0844 44.9915C23.1239 45.0106 23.1437 45.03 23.1732 45.0395C24.9726 45.4785 26.7984 45.6722 28.6483 45.4243C29.6956 45.2842 30.6825 45.0076 31.5873 44.4379C33.0758 43.4886 33.7818 41.8722 33.5044 40.0129C33.4062 39.9945 33.2784 39.9666 33.1605 39.9484C30.8326 39.5746 28.6472 38.8363 26.6227 37.6156C25.7833 37.1062 25.0019 36.5372 24.3363 35.81C23.9489 35.3931 23.5906 34.9464 23.3882 34.4195C23.267 34.1268 23.1749 33.8044 23.1515 33.491C23.0839 32.7663 23.4493 32.1737 24.1121 31.852C24.4923 31.6807 24.8934 31.6072 25.3051 31.6023C26.0109 31.5938 26.6989 31.7423 27.3586 31.9794C28.9142 32.5293 30.2485 33.4249 31.3998 34.5875C32.6899 35.8856 33.6296 37.384 34.0826 39.1824C34.0928 39.2117 34.103 39.241 34.1233 39.2996C34.2116 39.3083 34.3099 39.3267 34.3982 39.3355C35.4285 39.4112 36.4673 39.3791 37.4841 39.1511C38.2761 38.9749 39.0078 38.6818 39.6687 38.2032C40.5726 37.5551 41.1404 36.6757 41.3922 35.604C41.5979 34.7781 41.6073 33.9348 41.4403 33.0937C41.3463 32.6145 41.1937 32.1555 41.0704 31.6865C41.0189 31.4812 40.8904 31.3945 40.6743 31.3579C39.2009 31.1208 37.7652 30.7656 36.3577 30.3022C34.2024 29.6126 32.1134 28.7358 30.1872 27.5336C29.2488 26.9469 28.3781 26.2908 27.6329 25.4665C27.2651 25.0494 26.946 24.6022 26.7729 24.0651C26.4977 23.1959 26.8515 22.4564 27.7004 22.1226C27.9345 22.0217 28.1886 21.9599 28.4432 21.9372C28.8448 21.9029 29.2369 21.8982 29.6294 21.9327C30.5029 22.0103 31.3586 22.2451 32.1761 22.5588C35.0519 23.6417 37.5133 25.3276 39.5123 27.6858C40.2483 28.5592 40.8776 29.5222 41.3607 30.5555C41.431 30.7017 41.501 30.8087 41.6972 30.826C43.2682 31.0227 44.8283 31.1313 46.4047 30.9652C47.3055 30.8759 48.1859 30.7084 49.0251 30.3846C49.513 30.2022 49.9807 29.9613 50.3886 29.6426C51.4475 28.8358 51.9052 27.7714 51.801 26.4492C51.7209 25.4992 51.3479 24.6508 50.8481 23.8529C50.1785 22.7924 49.3149 21.9107 48.3349 21.1284C47.3251 20.3171 46.2386 19.644 45.0845 19.0599C45.0252 19.0214 44.9662 19.0025 44.8875 18.9838C44.8294 19.0433 44.7711 19.0833 44.7326 19.1425C44.2307 19.7956 43.5991 20.264 42.8279 20.538C42.3203 20.7206 41.7929 20.8839 41.2645 20.9687C39.0041 21.3195 36.8238 20.9929 34.7341 20.0573C34.2511 19.8377 33.7869 19.559 33.4099 19.191C33.2909 19.0748 33.1719 18.9586 33.0625 18.8325C32.4155 18.0266 32.5813 17.1422 33.4373 16.5829C33.7972 16.3531 34.1976 16.2208 34.6083 16.1374C35.2536 15.9923 35.92 15.9647 36.5967 15.9859C38.2933 16.0341 39.9445 16.3867 41.5491 16.9261C42.4447 17.2192 43.3121 17.6009 44.1886 17.9334C44.3161 17.9417 44.4246 17.9894 44.5429 18.0468ZM22.3957 44.7841C22.3222 44.3831 22.2591 44.0309 22.1861 43.6691C21.9466 42.5053 21.6778 41.3517 21.1843 40.2695C20.2279 38.1928 18.7866 36.5534 16.7831 35.4502C16.0429 35.0375 15.2455 34.7629 14.3918 34.7045C13.9797 34.6703 13.5779 34.685 13.1778 34.8368C12.6119 35.0594 12.2637 35.4557 12.2222 36.0738C12.2061 36.3681 12.2099 36.6818 12.3015 36.965C12.4241 37.3753 12.5859 37.7851 12.7964 38.1649C13.3976 39.2361 14.2318 40.1279 15.1629 40.9206C17.1936 42.6509 19.5027 43.8975 22.0418 44.71C22.1401 44.7284 22.248 44.7369 22.3957 44.7841ZM40.6358 30.6035C40.5954 30.5059 40.585 30.4571 40.555 30.4084C40.1537 29.6486 39.6843 28.9385 39.1469 28.2784C37.7739 26.6087 36.1205 25.266 34.2353 24.2201C32.9622 23.5198 31.6419 22.9672 30.2074 22.71C29.7456 22.6273 29.265 22.6037 28.7945 22.6094C28.5004 22.6129 28.2073 22.6949 27.9243 22.8062C27.5145 22.968 27.3716 23.3128 27.4845 23.733C27.536 23.9383 27.6265 24.1234 27.7366 24.3084C28.047 24.8438 28.4738 25.2799 28.9393 25.6762C29.6427 26.2853 30.404 26.8153 31.2232 27.2662C34.0956 28.8884 37.1769 29.9394 40.41 30.5768C40.4591 30.586 40.5278 30.595 40.6358 30.6035ZM33.3866 39.181C33.3658 39.0832 33.3648 39.0048 33.3346 38.9365C33.2129 38.6047 33.1206 38.2627 32.9696 37.941C32.1032 36.0103 30.7226 34.527 28.9445 33.4112C28.0753 32.8727 27.1685 32.4719 26.1566 32.2979C25.6948 32.2152 25.2338 32.1914 24.7644 32.2951C24.002 32.4807 23.6848 33.0042 23.8901 33.7664C24.003 34.1866 24.2427 34.5562 24.5115 34.8961C25.0893 35.6538 25.8414 36.2329 26.6416 36.7429C28.6373 38.0129 30.8229 38.7708 33.1412 39.1546C33.2002 39.1734 33.2786 39.1725 33.3866 39.181ZM44.246 18.6288C44.1572 18.5809 44.0979 18.5424 44.0485 18.5136C42.0871 17.6451 40.0499 16.9932 37.9192 16.715C37.0256 16.5984 36.1328 16.5405 35.2324 16.6691C34.8311 16.7229 34.4206 16.8259 34.05 16.9872C33.2502 17.3302 33.1593 17.9195 33.7649 18.5495C34.1521 18.9468 34.6162 19.2255 35.1188 19.4449C36.9815 20.2557 38.9165 20.5559 40.9331 20.3158C41.6772 20.2284 42.3905 20.0335 43.0528 19.6726C43.5105 19.422 43.9085 19.0937 44.246 18.6288Z"
fill="#FFFFFC" />
</svg>
<div class="text-center">
<a href="#"
class="circle-text relative inline-flex justify-center mt-10 md:text-lg lg:text-2xl lg:mt-8">Let's
explore
the creative
work.</a>
</div>
</div>
</section>
<!-- END HERO -->
<!-- START SERVICES -->
<section id="service" class="pt-20 px-4 pb-16 md:px-12 lg:flex lg:flex-row lg:px-28 lg:py-20">
<div class="lg:w-1/2">
<p class="mb-4 font-wagon-bold text-3xl leading-48px tracking-wide lg:text-5xl lg:leading-72px">Want you to
boost your business growth?
Solution is here.</p>
<p class="lg:text-lg">We provide various services to make your business grow and get bigger. Your
satisfaction is our first
priority.</p>
<a href="#" class="circle-text relative hidden mt-10 lg:flex">Click to see details, see our work more.</a>
</div>
<div class="mt-16 space-y-8 md:flex md:flex-wrap md:space-y-0 lg:w-1/2 lg:mt-0">
<div class="relative px-4 py-8 border border-black-1 md:w-1/2">
<span class="absolute -top-3 bg-white-2 font-wagon-bold text-2xl lg:-top-4">01</span>
<h2 class="font-bold text-xl mb-3">Web Content</h2>
<p>Amet minim mollit non deserunt ullamco est sit aliqua dolor do amet sint. Velit officia consequat
duis enim velit mollit. Exercitation veniam consequat sunt nostrud amet.</p>
</div>
<div class="relative px-4 py-8 border border-black-1 md:w-1/2">
<span class="absolute -top-3 bg-white-2 font-wagon-bold text-2xl lg:-top-4">02</span>
<h2 class="font-bold text-xl mb-3">Branding</h2>
<p>Amet minim mollit non deserunt ullamco est sit aliqua dolor do amet sint. Velit officia consequat
duis enim velit mollit. Exercitation veniam consequat sunt nostrud amet.</p>
</div>
<div class="relative px-4 py-8 border border-black-1 md:w-1/2">
<span class="absolute -top-3 bg-white-2 font-wagon-bold text-2xl lg:-top-4">03</span>
<h2 class="font-bold text-xl mb-3">SEO Consultancy</h2>
<p>Amet minim mollit non deserunt ullamco est sit aliqua dolor do amet sint. Velit officia consequat
duis enim velit mollit. Exercitation veniam consequat sunt nostrud amet.</p>
</div>
<div class="relative px-4 py-8 border border-black-1 md:w-1/2">
<span class="absolute -top-3 bg-white-2 font-wagon-bold text-2xl lg:-top-4">04</span>
<h2 class="font-bold text-xl mb-3">Market Analysis</h2>
<p>Amet minim mollit non deserunt ullamco est sit aliqua dolor do amet sint. Velit officia consequat
duis enim velit mollit. Exercitation veniam consequat sunt nostrud amet.</p>
</div>
</div>
<div class="text-center mt-10 ">
<a href="#" class="circle-text relative inline-flex justify-center lg:hidden">Click to see details, see our work
more.</a>
</div>
</section>
<!-- END SERVICES -->
<!-- START STATS -->
<section id="stat"
class="flex flex-col items-center space-y-8 py-40 bg-black-1 text-white-1 px-5 md:flex md:flex-row md:space-x-8 md:space-y-0 md:px-12 lg:px-28 lg:py-16">
<div class="w-full border-b border-white-1 pb-5 text-center lg:text-left">
<p class="font-wagon-bold text-3xl lg:text-6xl">40+</p>
<p>Happy Clients</p>
</div>
<div class="w-full border-b border-white-1 pb-5 text-center lg:text-left">
<p class="font-wagon-bold text-3xl lg:text-6xl">540</p>
<p>Project Completed</p>
</div>
<div class="w-full border-b border-white-1 pb-5 text-center lg:text-left">
<p class="font-wagon-bold text-3xl lg:text-6xl">300</p>
<p>Dedicated Members</p>
</div>
<div class="w-full border-b border-white-1 pb-5 text-center lg:text-left">
<p class="font-wagon-bold text-3xl lg:text-6xl">25+</p>
<p>Awards Won</p>
</div>
</section>
<!-- END STATS -->
<!-- START OUR WORKS -->
<section id="work" class="px-4 py-20 md:px-12 lg:px-28 lg:py-28">
<div class="flex items-center space-x-3 font-wagon-bold text-3xl">
<p class="lg:text-5xl">Our Works</p>
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M17.4804 27.3465C17.5794 23.604 16.056 19.8718 12.7157 17.6193C11.4222 16.747 9.88992 16.4295 8.38086 16.1655C14.5115 15.9552 16.6398 9.53873 17.4929 4.57153C17.1966 9.02649 19.5258 13.8385 24.2856 14.2825C19.5473 17.0701 17.9211 22.1853 17.4804 27.3465Z"
stroke="#020E10" stroke-width="2" stroke-miterlimit="1.5" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
</div>
<div class="flex flex-col mt-10 mb-8 md:flex-row">
<div class="mb-8 md:w-3/5 md:flex md:flex-col md:bg-yellow-1 md:p-10 md:mb-0">
<img class="object-cover w-full lg:h-40rem" src="./assets/images/work-1.png" alt="Work 1" width="342"
height="300">
<div class="hidden mt-4 justify-between items-center md:flex">
<p class="text-2xl font-bold">Project Name</p>
<p>Category</p>
</div>
</div>
<div class="space-y-8 md:flex md:flex-col md:w-2/5 md:pl-8">
<img class="block object-cover w-full md:h-full" src="./assets/images/work-3.png" alt="Work 2"
width="342" height="300">
<img class="block object-cover w-full md:h-full" src="./assets/images/work-2.png" alt="Work 3"
width="342" height="300">
</div>
</div>
<div class="text-center">
<a href="#" class="circle-text relative inline-flex justify-center lg:text-2xl lg:justify-end">Let's explore the more
creative work.</a>
</div>
</section>
<!-- END OUR WORKS -->
<!-- START TESTIMONIAL-->
<section id="testimonial" class="relative bg-green-1 px-4 py-20 text-white-1 md:px-12 lg:px-28">
<div class="flex items-end justify-between mb-10 md:justify-start md:items-center md:space-x-6">
<p class="font-wagon-bold text-3xl lg:text-5xl">What people are saying about us</p>
<svg width="60" height="60" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M39.8865 13.74C40.4311 13.8323 40.9473 13.4656 41.0396 12.9211C41.1318 12.3766 40.7652 11.8604 40.2207 11.7681L39.8865 13.74ZM8.40696 17.9358L7.79687 17.1435L7.79687 17.1435L8.40696 17.9358ZM11.5728 38.6488L11.8607 37.6911L11.8607 37.6911L11.5728 38.6488ZM16.2644 39.743L16.3341 38.7455L16.3334 38.7454L16.2644 39.743ZM19.369 46.754L19.5092 45.7638L19.5088 45.7638L19.369 46.754ZM25.8666 40.4391L25.8515 41.4389L25.852 41.4389L25.8666 40.4391ZM30.077 40.2079L29.986 39.2121H29.986L30.077 40.2079ZM49.6319 34.59L49.1511 33.7131V33.7131L49.6319 34.59ZM42.2938 12.4529C41.7493 12.3604 41.233 12.7269 41.1405 13.2714C41.0481 13.8159 41.4145 14.3322 41.959 14.4247L42.2938 12.4529ZM43.6543 13.1055C43.1893 13.4034 43.0538 14.0219 43.3517 14.4869C43.6496 14.952 44.2681 15.0875 44.7331 14.7896L43.6543 13.1055ZM46.0948 13.8768C46.5669 13.5903 46.7174 12.9752 46.4308 12.5031C46.1443 12.0309 45.5293 11.8805 45.0571 12.167L46.0948 13.8768ZM45.5354 13.8571C45.0857 14.1776 44.981 14.802 45.3015 15.2518C45.6221 15.7015 46.2465 15.8063 46.6963 15.4857L45.5354 13.8571ZM48.6315 14.1107C49.0869 13.7982 49.2027 13.1757 48.8902 12.7203C48.5777 12.265 47.9553 12.1491 47.4999 12.4616L48.6315 14.1107ZM47.2547 14.7979C46.8175 15.1353 46.7364 15.7632 47.0737 16.2005C47.4111 16.6378 48.039 16.7189 48.4763 16.3815L47.2547 14.7979ZM50.3696 14.9323C50.8458 14.6524 51.0049 14.0396 50.7251 13.5635C50.4452 13.0873 49.8324 12.9282 49.3563 13.208L50.3696 14.9323ZM48.9624 15.9865C48.5457 16.349 48.5018 16.9807 48.8642 17.3973C49.2267 17.814 49.8584 17.858 50.275 17.4955L48.9624 15.9865ZM52.2219 16.031C52.7049 15.7631 52.8793 15.1545 52.6115 14.6715C52.3437 14.1885 51.7351 14.014 51.2521 14.2818L52.2219 16.031ZM50.7718 17.5931C50.3705 17.9725 50.3527 18.6054 50.7321 19.0067C51.1115 19.4081 51.7444 19.4259 52.1458 19.0465L50.7718 17.5931ZM53.9141 17.7177C54.3745 17.4127 54.5005 16.7922 54.1955 16.3318C53.8905 15.8713 53.27 15.7454 52.8096 16.0504L53.9141 17.7177ZM52.41 19.4473C52.0075 19.8255 51.9878 20.4583 52.366 20.8608C52.7442 21.2633 53.3771 21.283 53.7796 20.9048L52.41 19.4473ZM55.1979 19.7051C55.6546 19.3946 55.7731 18.7726 55.4625 18.3159C55.1519 17.8592 54.53 17.7407 54.0733 18.0513L55.1979 19.7051ZM53.6034 21.3633C53.1989 21.7393 53.1758 22.372 53.5519 22.7765C53.9279 23.181 54.5607 23.2041 54.9652 22.8281L53.6034 21.3633ZM56.5325 21.5717C57.0075 21.29 57.1642 20.6766 56.8826 20.2015C56.6009 19.7265 55.9874 19.5698 55.5124 19.8515L56.5325 21.5717ZM54.5344 23.7234C54.1168 24.0848 54.0712 24.7164 54.4326 25.134C54.794 25.5516 55.4255 25.5972 55.8431 25.2358L54.5344 23.7234ZM57.5859 23.8794C58.0199 23.5379 58.0949 22.9092 57.7534 22.4751C57.4119 22.0411 56.7832 21.9661 56.3492 22.3076L57.5859 23.8794ZM54.769 26.55C54.3274 26.8817 54.2382 27.5085 54.5698 27.9502C54.9015 28.3918 55.5283 28.481 55.97 28.1493L54.769 26.55ZM57.6229 26.925C58.0968 26.6414 58.2511 26.0273 57.9676 25.5534C57.684 25.0795 57.0699 24.9252 56.596 25.2087L57.6229 26.925ZM10.7854 39.1741C10.3577 39.5236 10.2942 40.1535 10.6436 40.5812C10.9931 41.0089 11.623 41.0724 12.0507 40.723L10.7854 39.1741ZM13.2886 39.8315C13.7496 39.5273 13.8768 38.9071 13.5726 38.4461C13.2685 37.9851 12.6483 37.8579 12.1873 38.162L13.2886 39.8315ZM13.8253 39.9984C13.383 40.329 13.2924 40.9557 13.623 41.3981C13.9536 41.8405 14.5803 41.9311 15.0227 41.6004L13.8253 39.9984ZM16.5118 40.5406C16.9622 40.2211 17.0684 39.5969 16.7488 39.1464C16.4293 38.6959 15.8051 38.5898 15.3546 38.9093L16.5118 40.5406ZM25.347 41.5718C24.9578 41.9637 24.9601 42.5969 25.352 42.986C25.7439 43.3752 26.377 43.3729 26.7662 42.981L25.347 41.5718ZM28.6241 41.0521C28.9983 40.6458 28.9722 40.0132 28.566 39.6391C28.1598 39.2649 27.5271 39.2909 27.153 39.6972L28.6241 41.0521ZM25.7971 44.0022C26.1601 43.586 26.117 42.9543 25.7008 42.5913C25.2846 42.2283 24.6529 42.2714 24.2899 42.6876L25.7971 44.0022ZM22.7572 44.2315C22.3878 44.6421 22.4212 45.2744 22.8318 45.6438C23.2423 46.0132 23.8746 45.9798 24.244 45.5692L22.7572 44.2315ZM23.1842 46.6969C23.6293 46.3699 23.7251 45.7441 23.3982 45.299C23.0712 44.8539 22.4453 44.7581 22.0002 45.085L23.1842 46.6969ZM19.7647 47.4157C19.3597 47.7911 19.3357 48.4238 19.7112 48.8289C20.0866 49.2339 20.7193 49.2578 21.1244 48.8824L19.7647 47.4157ZM28.5429 41.1031C28.0909 41.4205 27.9818 42.0442 28.2992 42.4962C28.6166 42.9482 29.2403 43.0573 29.6923 42.7399L28.5429 41.1031ZM32.0808 40.8934C32.5421 40.5897 32.6699 39.9696 32.3663 39.5083C32.0626 39.0469 31.4425 38.9191 30.9812 39.2228L32.0808 40.8934ZM32.5046 40.7979C32.1039 41.1779 32.0871 41.8109 32.4672 42.2116C32.8472 42.6123 33.4801 42.6291 33.8809 42.2491L32.5046 40.7979ZM35.967 40.2999C36.4216 39.9862 36.5357 39.3634 36.222 38.9089C35.9083 38.4543 35.2855 38.3402 34.831 38.6539L35.967 40.2999ZM36.2021 40.1711C35.8593 40.6042 35.9325 41.2331 36.3656 41.5758C36.7987 41.9186 37.4276 41.8454 37.7703 41.4123L36.2021 40.1711ZM39.7651 39.4529C40.2159 39.1339 40.3228 38.5098 40.0039 38.059C39.6849 37.6081 39.0608 37.5012 38.61 37.8202L39.7651 39.4529ZM40.2974 39.3075C39.947 39.7344 40.009 40.3645 40.4359 40.7149C40.8628 41.0654 41.4929 41.0034 41.8433 40.5765L40.2974 39.3075ZM44.4428 37.9944C44.884 37.6622 44.9724 37.0352 44.6402 36.594C44.308 36.1528 43.681 36.0644 43.2398 36.3966L44.4428 37.9944ZM44.557 37.7898C44.2087 38.2184 44.2738 38.8482 44.7024 39.1965C45.131 39.5448 45.7608 39.4797 46.1091 39.0511L44.557 37.7898ZM49.6128 35.7243C50.032 35.3647 50.0802 34.7333 49.7205 34.3142C49.3609 33.8951 48.7295 33.8469 48.3104 34.2065L49.6128 35.7243ZM49.2686 36.4116C48.929 36.8471 49.0068 37.4755 49.4423 37.8151C49.8778 38.1547 50.5062 38.0769 50.8458 37.6414L49.2686 36.4116ZM57.7273 29.8724C58.0934 29.4589 58.0549 28.8269 57.6414 28.4608C57.2279 28.0948 56.5959 28.1332 56.2298 28.5468L57.7273 29.8724ZM53.0568 34.8069C52.7015 35.2297 52.7561 35.8605 53.1789 36.2158C53.6017 36.5712 54.2325 36.5165 54.5878 36.0937L53.0568 34.8069ZM57.5241 32.8043C57.8968 32.3967 57.8685 31.7642 57.4609 31.3915C57.0534 31.0188 56.4208 31.0471 56.0481 31.4547L57.5241 32.8043ZM40.2207 11.7681C29.1203 9.88687 16.3761 10.5374 7.79687 17.1435L9.01706 18.7281C16.9311 12.6344 28.9757 11.8909 39.8865 13.74L40.2207 11.7681ZM7.79687 17.1435C3.29987 20.6061 1.39125 25.3742 2.0522 29.764C2.71514 34.167 5.93605 37.9983 11.2848 39.6064L11.8607 37.6911C7.17756 36.2831 4.56644 33.0297 4.0299 29.4662C3.49137 25.8894 5.01581 21.8091 9.01706 18.7281L7.79687 17.1435ZM11.2848 39.6064C12.7175 40.0372 14.2681 40.6072 16.1953 40.7406L16.3334 38.7454C14.6906 38.6317 13.4215 38.1604 11.8607 37.6911L11.2848 39.6064ZM16.1947 40.7406C15.8875 40.7191 15.6906 40.5636 15.6443 40.5267C15.5721 40.4692 15.5248 40.4147 15.5047 40.3908C15.4622 40.34 15.4365 40.2982 15.4316 40.2902C15.4172 40.267 15.4128 40.2567 15.4222 40.2753C15.4378 40.3059 15.4656 40.3645 15.5074 40.457C15.5891 40.6379 15.7038 40.9025 15.8431 41.2294C16.1214 41.8823 16.4837 42.7496 16.854 43.6283C17.2222 44.5019 17.5975 45.3852 17.895 46.0535C18.0429 46.3857 18.1771 46.6773 18.2843 46.8917C18.3364 46.9958 18.3921 47.1019 18.4463 47.1908C18.4713 47.2319 18.5131 47.2977 18.5677 47.3645C18.5941 47.3967 18.6444 47.4552 18.7164 47.5153C18.7654 47.5562 18.946 47.7041 19.2291 47.7441L19.5088 45.7638C19.7853 45.8028 19.9579 45.9464 19.9979 45.9798C20.0608 46.0323 20.1007 46.0798 20.1155 46.0979C20.1471 46.1365 20.1612 46.1615 20.1541 46.1499C20.144 46.1334 20.1179 46.0866 20.0731 45.9971C19.9867 45.8243 19.8673 45.566 19.7222 45.2401C19.4338 44.5923 19.0655 43.726 18.697 42.8516C18.3307 41.9822 17.9632 41.1028 17.6829 40.4452C17.543 40.1168 17.4212 39.8352 17.3299 39.6332C17.2851 39.5343 17.2423 39.4423 17.2055 39.3699C17.1888 39.337 17.1629 39.2872 17.1319 39.2371C17.1187 39.2158 17.0859 39.1637 17.0376 39.1061C17.0146 39.0787 16.9647 39.0215 16.8903 38.9622C16.8417 38.9236 16.6429 38.767 16.3341 38.7455L16.1947 40.7406ZM19.2287 47.7441C19.4281 47.7723 19.5846 47.7332 19.6479 47.7151C19.7243 47.6934 19.7832 47.6669 19.8168 47.6507C19.8839 47.6182 19.9355 47.5844 19.9611 47.5671C20.0168 47.5296 20.0674 47.4893 20.103 47.4601C20.1792 47.3976 20.2708 47.3161 20.368 47.2273C20.5659 47.0463 20.8322 46.7926 21.1389 46.4956C21.7544 45.8997 22.5575 45.1054 23.3538 44.3145C24.1528 43.521 24.9432 42.7326 25.5427 42.1393C25.8424 41.8427 26.0903 41.5988 26.2649 41.4301C26.3531 41.3448 26.4173 41.2839 26.4582 41.2463C26.4802 41.2261 26.4863 41.221 26.4822 41.2245C26.4804 41.226 26.4759 41.2297 26.4694 41.2348C26.4635 41.2394 26.4515 41.2488 26.435 41.2604C26.4225 41.2693 26.3869 41.2941 26.3372 41.3208C26.3125 41.3341 26.2665 41.3576 26.2056 41.3796C26.1582 41.3968 26.0268 41.4416 25.8515 41.4389L25.8816 39.4392C25.7057 39.4365 25.5734 39.4815 25.5249 39.499C25.463 39.5214 25.4159 39.5455 25.3897 39.5595C25.3372 39.5878 25.2981 39.6149 25.2812 39.6268C25.2439 39.6531 25.2139 39.6779 25.1997 39.6898C25.167 39.7171 25.1332 39.7476 25.1047 39.7738C25.0448 39.8289 24.9659 39.904 24.8749 39.992C24.6912 40.1696 24.436 40.4206 24.1357 40.7178C23.5353 41.3122 22.7382 42.1071 21.9444 42.8955C21.148 43.6865 20.3531 44.4726 19.7478 45.0587C19.4441 45.3527 19.1943 45.5904 19.0181 45.7515C18.9282 45.8338 18.8683 45.8861 18.8345 45.9138C18.8151 45.9298 18.8211 45.9236 18.8432 45.9087C18.8521 45.9028 18.8898 45.8774 18.9458 45.8503C18.9737 45.8367 19.0278 45.8122 19.1001 45.7916C19.1593 45.7747 19.3125 45.736 19.5092 45.7638L19.2287 47.7441ZM25.852 41.4389C27.3107 41.4601 28.768 41.3317 30.168 41.2038L29.986 39.2121C28.5753 39.341 27.2188 39.4586 25.8811 39.4392L25.852 41.4389ZM30.1679 41.2038C37.2708 40.5549 44.3628 38.6196 50.1127 35.4668L49.1511 33.7131C43.6871 36.7092 36.8717 38.5831 29.986 39.2121L30.1679 41.2038ZM50.1127 35.4668C53.3601 33.6862 55.2805 31.444 56.0411 28.9677C56.8002 26.4965 56.3542 23.9547 55.1907 21.6695C52.8865 17.144 47.6488 13.3622 42.2938 12.4529L41.959 14.4247C46.7263 15.2342 51.4074 18.6469 53.4084 22.5769C54.3974 24.5194 54.7006 26.5205 54.1293 28.3805C53.5595 30.2354 52.0698 32.1128 49.1511 33.7131L50.1127 35.4668ZM44.7331 14.7896C44.986 14.6276 45.2318 14.4548 45.452 14.3022C45.6792 14.1446 45.8861 14.0034 46.0948 13.8768L45.0571 12.167C44.7916 12.3282 44.5409 12.5002 44.3123 12.6587C44.0766 12.8221 43.8684 12.9683 43.6543 13.1055L44.7331 14.7896ZM46.6963 15.4857C47.3611 15.0119 47.9829 14.5558 48.6315 14.1107L47.4999 12.4616C46.8323 12.9198 46.171 13.404 45.5354 13.8571L46.6963 15.4857ZM48.4763 16.3815C49.2398 15.7926 49.7287 15.309 50.3696 14.9323L49.3563 13.208C48.5783 13.6652 47.7913 14.384 47.2547 14.7979L48.4763 16.3815ZM50.275 17.4955C50.9209 16.9336 51.5748 16.3898 52.2219 16.031L51.2521 14.2818C50.3982 14.7553 49.6001 15.4317 48.9624 15.9865L50.275 17.4955ZM52.1458 19.0465C52.6553 18.5648 53.2476 18.1592 53.9141 17.7177L52.8096 16.0504C52.1485 16.4883 51.4217 16.9788 50.7718 17.5931L52.1458 19.0465ZM53.7796 20.9048C54.2771 20.4373 54.7123 20.0354 55.1979 19.7051L54.0733 18.0513C53.4389 18.4827 52.8961 18.9905 52.41 19.4473L53.7796 20.9048ZM54.9652 22.8281C55.4954 22.3351 56.0083 21.8825 56.5325 21.5717L55.5124 19.8515C54.7833 20.2838 54.1306 20.8731 53.6034 21.3633L54.9652 22.8281ZM55.8431 25.2358C56.3963 24.7571 56.9233 24.4007 57.5859 23.8794L56.3492 22.3076C55.8297 22.7164 55.1195 23.2171 54.5344 23.7234L55.8431 25.2358ZM55.97 28.1493C56.6294 27.6541 57.063 27.26 57.6229 26.925L56.596 25.2087C55.9196 25.6134 55.2579 26.1829 54.769 26.55L55.97 28.1493ZM12.0507 40.723C12.431 40.4124 12.8479 40.1221 13.2886 39.8315L12.1873 38.162C11.7251 38.4669 11.243 38.8003 10.7854 39.1741L12.0507 40.723ZM15.0227 41.6004C15.5026 41.2417 15.9879 40.9122 16.5118 40.5406L15.3546 38.9093C14.8746 39.2498 14.3307 39.6207 13.8253 39.9984L15.0227 41.6004ZM26.7662 42.981C27.3895 42.3532 28.0151 41.7134 28.6241 41.0521L27.153 39.6972C26.5693 40.3309 25.9644 40.95 25.347 41.5718L26.7662 42.981ZM24.2899 42.6876C24.0845 42.923 23.8533 43.1461 23.5859 43.4009C23.3287 43.6459 23.0329 43.9252 22.7572 44.2315L24.244 45.5692C24.4581 45.3313 24.6937 45.1079 24.9656 44.8488C25.2272 44.5995 25.5226 44.3169 25.7971 44.0022L24.2899 42.6876ZM22.0002 45.085C21.479 45.4679 21.0666 45.9371 20.725 46.3417C20.3607 46.7732 20.0859 47.1179 19.7647 47.4157L21.1244 48.8824C21.5609 48.4777 21.942 48.0005 22.2531 47.632C22.5869 47.2367 22.8695 46.9281 23.1842 46.6969L22.0002 45.085ZM29.6923 42.7399C30.1472 42.4204 30.5704 42.0669 30.952 41.7533C31.3456 41.43 31.7036 41.1416 32.0808 40.8934L30.9812 39.2228C30.5056 39.5358 30.0739 39.8863 29.6824 40.208C29.279 40.5394 28.9219 40.8369 28.5429 41.1031L29.6923 42.7399ZM33.8809 42.2491C34.2402 41.9083 34.6461 41.4801 34.9621 41.1674C35.3089 40.8242 35.6325 40.5308 35.967 40.2999L34.831 38.6539C34.3511 38.9851 33.9291 39.3759 33.5553 39.7458C33.1505 40.1464 32.8605 40.4604 32.5046 40.7979L33.8809 42.2491ZM37.7703 41.4123C38.3578 40.6701 39.0399 39.966 39.7651 39.4529L38.61 37.8202C37.68 38.4781 36.8637 39.3352 36.2021 40.1711L37.7703 41.4123ZM41.8433 40.5765C42.6222 39.6276 43.5113 38.6956 44.4428 37.9944L43.2398 36.3966C42.134 37.2291 41.1309 38.2921 40.2974 39.3075L41.8433 40.5765ZM46.1091 39.0511C47.0603 37.8805 48.3518 36.8064 49.6128 35.7243L48.3104 34.2065C47.1074 35.2388 45.6485 36.4465 44.557 37.7898L46.1091 39.0511ZM50.8458 37.6414C52.9546 34.9369 55.372 32.5331 57.7273 29.8724L56.2298 28.5468C53.9917 31.075 51.4221 33.6498 49.2686 36.4116L50.8458 37.6414ZM54.5878 36.0937C55.5203 34.9843 56.5213 33.9011 57.5241 32.8043L56.0481 31.4547C55.0577 32.5378 54.0227 33.6578 53.0568 34.8069L54.5878 36.0937Z"
fill="#FFFFFC" />
</svg>
</div>
<div class="swiper">
<div class="swiper-wrapper">
<div class="swiper-slide p-8 bg-black-1 text-white-1 lg:bg-transparent">
<div class="flex space-x-3 mb-6">
<figure class="w-8 h-8 rounded-full">
<img class="w-full h-full object-cover rounded-full" src="./assets/images/user-1.png"
alt="Robert Fox" width="56" height="56">
</figure>
<div>
<p class="font-bold">Robert Fox</p>
<p class="opacity-60">CEO</p>
</div>
</div>
<p class="leading-6">Amet minim mollit non deserunt ullamco est sit aliqua dolor do amet sint. Velit
officia consequat duis enim velit mollit. Exercitation veniam consequat sunt nostrud amet. Velit
officia consequat duis enim velit mollit.</p>
</div>
<div class="swiper-slide p-8 bg-black-1 text-white-1 lg:bg-transparent">
<div class="flex space-x-3 mb-6">
<figure class="w-8 h-8 rounded-full">
<img class="w-full h-full object-cover rounded-full" src="./assets/images/user-2.png"
alt="Jerome Bell" width="56" height="56">
</figure>
<div>
<p class="font-bold">Jerome Bell</p>
<p class="opacity-60">Product Designer</p>
</div>
</div>
<p class="leading-6">Amet minim mollit non deserunt ullamco est sit aliqua dolor do amet sint. Velit
officia consequat duis enim velit mollit. Exercitation veniam consequat sunt nostrud amet. Velit
officia consequat duis enim velit mollit.</p>
</div>
<div class="swiper-slide p-8 bg-black-1 text-white-1 lg:bg-transparent">
<div class="flex space-x-3 mb-6">
<figure class="w-8 h-8 rounded-full">
<img class="w-full h-full object-cover rounded-full" src="./assets/images/user-3.png"
alt="Leslie Alexander" width="56" height="56">
</figure>
<div>
<p class="font-bold">Leslie Alexander</p>
<p class="opacity-60">UX Researcherr</p>
</div>
</div>
<p class="leading-6">Amet minim mollit non deserunt ullamco est sit aliqua dolor do amet sint. Velit
officia consequat duis enim velit mollit. Exercitation veniam consequat sunt nostrud amet. Velit
officia consequat duis enim velit mollit.</p>
</div>
</div>
<div class="swiper-button absolute bottom-8 right-0">
<div class="swiper-button-prev">
<svg width="42" height="42" viewBox="0 0 42 42" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M18.375 7.875L20.2519 9.70331L10.3031 19.6875H36.75V22.3125H10.3031L20.2519 32.2521L18.375 34.125L5.25 21L18.375 7.875Z"
fill="#FFFFFC" />
</svg>
</div>
<div class="swiper-button-next">
<svg width="42" height="42" viewBox="0 0 42 42" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M23.625 7.875L21.7481 9.70331L31.6969 19.6875H5.25V22.3125H31.6969L21.7481 32.2521L23.625 34.125L36.75 21L23.625 7.875Z"
fill="#FFFFFC" />
</svg>
</div>
</div>
</div>
</section>
<!-- END TESTIMONIAL-->
<!-- START BLOG-->
<section id="blog" class="px-4 py-20 md:px-12 lg:px-28">
<div class="flex items-end justify-between mb-10 md:justify-start md:items-center md:space-x-4">
<p class="font-wagon-bold text-3xl leading-48px lg:text-5xl">See our blog posts</p>
<svg width="42" height="42" viewBox="0 0 42 42" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M11.0841 14.897C12.722 12.8041 13.9955 10.3678 15.749 8.3999C20.1678 11.0334 35.5667 19.9952 38.8501 21.6769C35.9698 21.6871 33.2467 21.6979 30.1256 21.9859C31.4368 24.6433 32.9387 27.7008 33.7124 30.4847C29.0526 26.6606 13.1518 16.7623 11.0841 14.897Z"
stroke="#020E10" stroke-width="2" stroke-miterlimit="1.5" stroke-linecap="round"
stroke-linejoin="round" />
<path fill-rule="evenodd" clip-rule="evenodd"
d="M3.13463 20.5579C5.04033 19.6287 6.79238 18.3486 8.48472 17.0791C9.89196 19.2584 14.6314 27.2239 16.4045 30.2201C14.5263 29.1061 12.293 28.5641 10.2729 27.7579C9.93741 28.7506 9.81929 29.8023 9.53787 30.8126C9.26384 31.7967 8.81928 32.7101 8.67296 33.7316C7.15602 31.4871 3.99704 22.7247 3.13463 20.5579Z"
stroke="#020E10" stroke-width="2" stroke-miterlimit="1.5" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
</div>
<div class="space-y-6 md:flex md:flex-wrap lg:space-y-0">
<div class="space-y-4 md:flex md:flex-col md:w-1/2 md:pr-8 lg:space-y-0 lg:flex-row">
<a class="w-full h-64 mb-4 lg:w-1/2 lg:h-56" href="#">
<img class="w-full h-full object-cover" src="./assets/images/blog-1.png" alt="How to select colors">
</a>
<div class="space-y-2 lg:w-1/2 lg:pl-5">
<p class="opacity-50 lg:text-sm">June 18, 2022</p>
<h2 class="text-xl font-bold"><a href="#">How to select colors</a></h2>
<p class="opacity-50">Amet minim mollit non deserunt ullamco est sit aliqua dolor do amet sint.
Velit officia consequat duis enim velit mollit.</p>
<a href="#" class="read-more flex items-center mt-4">
Read More
<svg class="inline-block ml-2" width="24" height="24" viewBox="0 0 24 24" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M13.5 4.5L12.4275 5.54475L18.1125 11.25H3V12.75H18.1125L12.4275 18.4298L13.5 19.5L21 12L13.5 4.5Z"
fill="#020E10" />
</svg>
</a>
</div>
</div>
<div class="space-y-4 md:flex md:flex-col md:w-1/2 md:pr-8 md:space-y-0 lg:flex-row">
<a class="w-full h-64 mb-4 lg:w-1/2 lg:h-56" href="#">
<img class="w-full h-full object-cover" src="./assets/images/blog-2.png"
alt="Micro tips for UI design">
</a>
<div class="space-y-2 lg:w-1/2 lg:pl-5">
<p class="opacity-50 text-sm">June 18, 2022</p>
<h2 class="text-xl font-bold"><a href="#">Micro tips for UI design</a></h2>
<p class="opacity-50">Amet minim mollit non deserunt ullamco est sit aliqua dolor do amet sint.
Velit officia consequat duis enim velit mollit.</p>
<a href="#" class="read-more flex items-center mt-4">
Read More
<svg class="inline-block ml-2" width="24" height="24" viewBox="0 0 24 24" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M13.5 4.5L12.4275 5.54475L18.1125 11.25H3V12.75H18.1125L12.4275 18.4298L13.5 19.5L21 12L13.5 4.5Z"
fill="#020E10" />
</svg>
</a>
</div>
</div>
<div class="space-y-4 md:flex md:flex-col md:w-1/2 md:pr-8 md:space-y-0 lg:flex-row">
<a class="w-full h-64 mb-4 lg:w-1/2 lg:h-56" href="#">
<img class="w-full h-full object-cover" src="./assets/images/blog-3.png" alt="Prototype in figma">
</a>
<div class="space-y-2 lg:w-1/2 lg:pl-5">
<p class="opacity-50 text-sm">June 18, 2022</p>
<h2 class="text-xl font-bold"><a href="#">Prototype in figma</a></h2>
<p class="opacity-50">Amet minim mollit non deserunt ullamco est sit aliqua dolor do amet sint.
Velit officia consequat duis enim velit mollit.</p>
<a href="#" class="read-more flex items-center mt-4">
Read More
<svg class="inline-block ml-2" width="24" height="24" viewBox="0 0 24 24" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M13.5 4.5L12.4275 5.54475L18.1125 11.25H3V12.75H18.1125L12.4275 18.4298L13.5 19.5L21 12L13.5 4.5Z"
fill="#020E10" />
</svg>
</a>
</div>
</div>
<div class="space-y-4 md:flex md:flex-col md:w-1/2 md:pr-8 md:space-y-0 lg:flex-row">
<a class="w-full h-64 mb-4 lg:w-1/2 lg:h-56" href="#">
<img class="w-full h-full object-cover" src="./assets/images/blog-4.png" alt="2022 design trends">
</a>
<div class="space-y-2 lg:w-1/2 lg:pl-5">
<p class="opacity-50 lg:text-sm">June 18, 2022</p>
<h2 class="text-xl font-bold"><a href="#">2022 design trends</a></h2>
<p class="opacity-50">Amet minim mollit non deserunt ullamco est sit aliqua dolor do amet sint.
Velit officia consequat duis enim velit mollit.</p>
<a href="#" class="read-more flex items-center mt-4">
Read More
<svg class="inline-block ml-2" width="24" height="24" viewBox="0 0 24 24" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M13.5 4.5L12.4275 5.54475L18.1125 11.25H3V12.75H18.1125L12.4275 18.4298L13.5 19.5L21 12L13.5 4.5Z"
fill="#020E10" />
</svg>
</a>
</div>
</div>
</div>
<div class="text-center mt-10">
<a href="#" class="circle-text relative inline-flex justify-center lg:text-2xl">Click to explore more blog posts.</a>
</div>
</section>
<!-- END BLOG-->
<!-- START FOOTER -->
<footer class="bg-black-1 px-4 py-14 text-white-1 md:px-12 lg:px-28">
<div class="space-y-10 lg:flex lg:justify-between lg:items-center lg:space-y-0">
<div class="space-y-8">
<a href="#">
<svg width="56" height="56" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M39.9532 50.524L30.2874 22.3811C29.967 21.4733 30.0204 20.4586 30.5544 19.6042V19.5508H24.5734C25.1074 20.4052 25.2142 21.4733 24.8938 22.4345L15.1746 50.524C15.0678 50.9512 14.8542 51.2716 14.6406 51.592L13.9998 52.4999H19.6604C19.34 51.592 19.2866 50.6308 19.607 49.7229L24.1995 36.4792C27.962 35.7007 32.3567 32.4741 32.3567 32.4741L38.2443 49.7229C38.5113 50.6308 38.5113 51.592 38.1375 52.4999H41.128L40.4872 51.592C40.2736 51.2716 40.06 50.9512 39.9532 50.524ZM24.6268 35.1442L28.9523 22.7015L32.3567 32.4741C29.2345 34.5278 27.5305 35.2322 24.6268 35.1442Z"
fill="#FFFFFC" />
<path
d="M24.1996 3.49991H14.427C14.961 4.40774 15.228 5.42238 15.228 6.43702V33.5119C15.228 34.5265 14.961 35.5411 14.427 36.449H24.1996C33.2245 36.3956 40.594 29.0261 40.594 19.9477C40.594 10.9228 33.2245 3.55331 24.1996 3.49991ZM24.1462 35.0605H19.2866V4.88836H24.1462C32.4769 4.88836 36.5354 11.6704 36.5354 19.9477C36.5354 28.2785 32.4769 35.0605 24.1462 35.0605Z"
fill="#FFFFFC" />
</svg>
</a>
<div class="text-xs space-y-2">
<p class="opacity-60">Copyright © 2022 Dezign UI Template.</p>
<p class="opacity-60">All rights reserved</p>
<p class="opacity-60">UI Engineer: <a class="underline"
href="https://www.linkedin.com/in/muhammad-arief-nugraha/" target="_blank">Muhammad Arief
Nugraha</a></p>
</div>
<div class="flex space-x-4">
<a href="#">
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M16.0007 7.4668C13.6832 7.4668 13.3923 7.47693 12.4821 7.51835C11.5736 7.55995 10.9535 7.70378 10.4109 7.9148C9.84969 8.13276 9.37359 8.42432 8.89928 8.89881C8.42461 9.37313 8.13305 9.84922 7.91438 10.4103C7.70282 10.9531 7.55882 11.5733 7.51793 12.4814C7.47722 13.3917 7.46655 13.6827 7.46655 16.0002C7.46655 18.3178 7.47686 18.6077 7.51811 19.5179C7.55989 20.4264 7.70371 21.0465 7.91456 21.5891C8.13269 22.1503 8.42425 22.6264 8.89875 23.1007C9.37288 23.5754 9.84898 23.8677 10.4099 24.0856C10.9528 24.2967 11.5731 24.4405 12.4814 24.4821C13.3916 24.5235 13.6823 24.5336 15.9996 24.5336C18.3173 24.5336 18.6073 24.5235 19.5175 24.4821C20.426 24.4405 21.0468 24.2967 21.5897 24.0856C22.1508 23.8677 22.6262 23.5754 23.1003 23.1007C23.575 22.6264 23.8665 22.1503 24.0852 21.5893C24.295 21.0465 24.439 20.4262 24.4817 19.5181C24.5226 18.6079 24.5332 18.3178 24.5332 16.0002C24.5332 13.6827 24.5226 13.3918 24.4817 12.4816C24.439 11.5732 24.295 10.9531 24.0852 10.4105C23.8665 9.84922 23.575 9.37313 23.1003 8.89881C22.6256 8.42414 22.151 8.13258 21.5892 7.9148C21.0452 7.70378 20.4247 7.55995 19.5163 7.51835C18.606 7.47693 18.3163 7.4668 15.998 7.4668H16.0007ZM15.2351 9.00457C15.4623 9.00421 15.7158 9.00457 16.0006 9.00457C18.2791 9.00457 18.5491 9.01274 19.4489 9.05363C20.2809 9.09168 20.7324 9.2307 21.0332 9.3475C21.4315 9.50217 21.7154 9.68706 22.0139 9.98573C22.3125 10.2844 22.4974 10.5688 22.6525 10.9671C22.7693 11.2675 22.9085 11.7191 22.9463 12.5511C22.9872 13.4507 22.9961 13.7209 22.9961 15.9982C22.9961 18.2756 22.9872 18.5458 22.9463 19.4454C22.9083 20.2774 22.7693 20.729 22.6525 21.0294C22.4978 21.4276 22.3125 21.7112 22.0139 22.0097C21.7152 22.3084 21.4316 22.4932 21.0332 22.6479C20.7328 22.7652 20.2809 22.9039 19.4489 22.942C18.5493 22.9828 18.2791 22.9917 16.0006 22.9917C13.722 22.9917 13.452 22.9828 12.5524 22.942C11.7204 22.9036 11.2689 22.7645 10.9679 22.6477C10.5697 22.4931 10.2852 22.3082 9.98654 22.0095C9.68787 21.7108 9.50298 21.4271 9.34796 21.0287C9.23116 20.7282 9.09196 20.2767 9.05409 19.4447C9.0132 18.5451 9.00502 18.2749 9.00502 15.9961C9.00502 13.7173 9.0132 13.4485 9.05409 12.549C9.09213 11.717 9.23116 11.2654 9.34796 10.9646C9.50263 10.5664 9.68787 10.2819 9.98654 9.98324C10.2852 9.68457 10.5697 9.49968 10.9679 9.34466C11.2687 9.22732 11.7204 9.08866 12.5524 9.05043C13.3396 9.01488 13.6447 9.00421 15.2351 9.00243V9.00457ZM20.5557 10.4215C19.9904 10.4215 19.5317 10.8796 19.5317 11.4451C19.5317 12.0105 19.9904 12.4691 20.5557 12.4691C21.1211 12.4691 21.5797 12.0105 21.5797 11.4451C21.5797 10.8798 21.1211 10.4215 20.5557 10.4215ZM16.0007 11.6179C13.5806 11.6179 11.6184 13.5801 11.6184 16.0002C11.6184 18.4203 13.5806 20.3816 16.0007 20.3816C18.4208 20.3816 20.3823 18.4203 20.3823 16.0002C20.3823 13.5801 18.4208 11.6179 16.0007 11.6179ZM16.0007 13.1557C17.5715 13.1557 18.8451 14.4292 18.8451 16.0002C18.8451 17.5711 17.5715 18.8447 16.0007 18.8447C14.4296 18.8447 13.1562 17.5711 13.1562 16.0002C13.1562 14.4292 14.4296 13.1557 16.0007 13.1557Z"
stroke="#FFFFFC" stroke-width="0.5" />
</svg>
</a>
<a href="#">
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M24.5332 15.9883C24.5332 16.5654 24.4745 17.1417 24.3591 17.7034C24.2465 18.2518 24.0799 18.7902 23.8615 19.3049C23.6482 19.8105 23.3836 20.2977 23.0744 20.7521C22.7698 21.2036 22.419 21.6271 22.0335 22.0133C21.6473 22.3977 21.2222 22.7476 20.771 23.0535C20.3151 23.3605 19.8272 23.6247 19.3213 23.8391C18.8059 24.0562 18.2662 24.2227 17.7183 24.335C17.1558 24.4507 16.5774 24.5098 15.9995 24.5098C15.4211 24.5098 14.8428 24.4507 14.2811 24.335C13.7323 24.2227 13.1927 24.0562 12.6777 23.8391C12.1718 23.6247 11.6834 23.3605 11.2276 23.0535C10.7763 22.7476 10.3513 22.3977 9.96587 22.0133C9.58003 21.6271 9.22915 21.2036 8.92414 20.7521C8.61663 20.2977 8.35159 19.8105 8.13743 19.3049C7.91906 18.7902 7.75199 18.2518 7.63907 17.7034C7.5249 17.1417 7.46655 16.5654 7.46655 15.9883C7.46655 15.4108 7.52487 14.8332 7.6391 14.2727C7.75203 13.7243 7.91909 13.1851 8.13747 12.6712C8.35163 12.1653 8.61666 11.6776 8.92418 11.2232C9.22919 10.7714 9.58006 10.3486 9.9659 9.96207C10.3513 9.57759 10.7764 9.22852 11.2276 8.92312C11.6835 8.61478 12.1719 8.35059 12.6777 8.13587C13.1927 7.91822 13.7323 7.75139 14.2811 7.63989C14.8428 7.52506 15.4212 7.4668 15.9995 7.4668C16.5775 7.4668 17.1558 7.52506 17.7184 7.63989C18.2663 7.75142 18.8059 7.91825 19.3214 8.13587C19.8272 8.35056 20.3152 8.61478 20.771 8.92312C21.2223 9.22852 21.6473 9.57759 22.0336 9.96207C22.419 10.3486 22.7699 10.7714 23.0745 11.2232C23.3836 11.6776 23.6482 12.1653 23.8615 12.6712C24.0799 13.1851 24.2465 13.7243 24.3591 14.2727C24.4745 14.8332 24.5332 15.4108 24.5332 15.9883ZM12.8901 9.40618C10.8579 10.3645 9.34119 12.2343 8.86824 14.4879C9.06036 14.4895 12.0972 14.5278 15.5961 13.5995C14.3348 11.3618 12.9872 9.53562 12.8901 9.40618ZM16.1999 14.7201C12.4476 15.8418 8.84699 15.7611 8.71783 15.7561C8.71573 15.8343 8.71199 15.91 8.71199 15.9883C8.71199 17.8577 9.41827 19.562 10.5792 20.8507C10.5767 20.8469 12.571 17.3139 16.5036 16.0441C16.5986 16.0124 16.6953 15.9841 16.7912 15.9567C16.6083 15.5431 16.4086 15.1287 16.1999 14.7201ZM20.8122 10.5267C19.5292 9.39701 17.8446 8.71176 15.9995 8.71176C15.4074 8.71176 14.8327 8.78333 14.2823 8.91564C14.3915 9.06212 15.7603 10.8754 17.0066 13.1605C19.7563 12.1312 20.7943 10.5533 20.8122 10.5267ZM17.2879 17.1625C17.2717 17.1679 17.2554 17.1725 17.2396 17.1783C12.9398 18.6751 11.5357 21.6915 11.5205 21.7245C12.7577 22.6852 14.3094 23.2648 15.9995 23.2648C17.0087 23.2648 17.97 23.0596 18.8446 22.6881C18.7367 22.0523 18.3134 19.8238 17.2879 17.1625ZM20.0718 22.0232C21.7081 20.9206 22.8702 19.1697 23.1944 17.1416C23.0444 17.0934 21.0055 16.4489 18.6533 16.8254C19.6092 19.4485 19.9976 21.5847 20.0718 22.0232ZM17.5675 14.2449C17.7367 14.5919 17.9005 14.9451 18.0517 15.3001C18.1055 15.4274 18.158 15.5522 18.2092 15.677C20.7127 15.3625 23.179 15.8917 23.2845 15.9133C23.2678 14.1883 22.6498 12.6051 21.6273 11.3656C21.6136 11.3851 20.4448 13.0715 17.5675 14.2449Z"
stroke="#FFFFFC" stroke-width="0.5" />
</svg>
</a>
<a href="#">
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M15.5208 13.0051L15.5544 13.5587L14.9948 13.4909C12.9579 13.2311 11.1784 12.3498 9.66756 10.8696L8.92891 10.1352L8.73865 10.6776C8.33575 11.8865 8.59316 13.1633 9.43253 14.022C9.8802 14.4965 9.77948 14.5643 9.00725 14.2819C8.73865 14.1915 8.50363 14.1237 8.48124 14.1576C8.4029 14.2367 8.6715 15.2648 8.88414 15.6716C9.17513 16.2365 9.76828 16.7902 10.4174 17.1178L10.9658 17.3777L10.3167 17.389C9.68994 17.389 9.66756 17.4003 9.73471 17.6376C9.95854 18.372 10.8427 19.1516 11.8276 19.4906L12.5214 19.7278L11.9171 20.0894C11.0218 20.6091 9.96973 20.9029 8.91772 20.9255C8.41409 20.9368 8 20.982 8 21.0159C8 21.1289 9.36538 21.7616 10.16 22.0102C12.5438 22.7446 15.3753 22.4282 17.5017 21.1741C19.0126 20.2815 20.5235 18.5076 21.2286 16.7902C21.6091 15.875 21.9896 14.2028 21.9896 13.4006C21.9896 12.8808 22.0232 12.813 22.6499 12.1916C23.0192 11.83 23.3662 11.4346 23.4333 11.3216C23.5452 11.1069 23.534 11.1069 22.9633 11.299C22.012 11.638 21.8777 11.5928 22.3477 11.0843C22.6947 10.7228 23.1088 10.0674 23.1088 9.87536C23.1088 9.84146 22.9409 9.89796 22.7506 9.99964C22.5492 10.1126 22.1015 10.2821 21.7658 10.3838L21.1614 10.5759L20.613 10.203C20.3108 9.99964 19.8856 9.77367 19.6617 9.70588C19.0909 9.5477 18.218 9.57029 17.7032 9.75107C16.3042 10.2595 15.4201 11.5702 15.5208 13.0051Z"
stroke="#FFFFFC" stroke-width="0.5" />
</svg>
</a>
<a href="#">
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M22.6679 10.4995C23.4022 10.701 23.9805 11.2948 24.1768 12.0488C24.5335 13.4153 24.5335 16.2666 24.5335 16.2666C24.5335 16.2666 24.5335 19.1178 24.1768 20.4845C23.9805 21.2385 23.4022 21.8322 22.6679 22.0338C21.3371 22.4 16.0001 22.4 16.0001 22.4C16.0001 22.4 10.6632 22.4 9.3323 22.0338C8.59795 21.8322 8.01962 21.2385 7.82335 20.4845C7.4668 19.1178 7.4668 16.2666 7.4668 16.2666C7.4668 16.2666 7.4668 13.4153 7.82335 12.0488C8.01962 11.2948 8.59795 10.701 9.3323 10.4995C10.6632 10.1333 16.0001 10.1333 16.0001 10.1333C16.0001 10.1333 21.3371 10.1333 22.6679 10.4995ZM14.4001 13.8666V19.1999L18.6668 16.5333L14.4001 13.8666Z"
stroke="#FFFFFC" stroke-width="0.5" />
</svg>
</a>
</div>
</div>
<div class="space-y-6 lg:space-y-0 lg:flex">
<div class="lg:order-3">
<p class="font-semibold text-lg mb-6">Stay up to date</p>
<form action="" class="text-sm relative">
<input class="block w-full bg-transparent border border-white-1 py-2 px-3" type="email"
name="email" id="email" placeholder="Your email address">
<button type="submit" class="absolute top-1/2 right-4 transform -translate-y-1/2">
<svg width="18" height="18" viewBox="0 0 18 18" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path opacity="0.8" fill-rule="evenodd" clip-rule="evenodd"
d="M17.0303 0.969691C17.2341 1.17342 17.3031 1.47584 17.2079 1.74778L11.9579 16.7478C11.8563 17.038 11.5878 17.2369 11.2806 17.2494C10.9733 17.2619 10.6895 17.0856 10.5646 16.8046L7.6818 10.3182L1.1954 7.43538C0.91439 7.31049 0.738092 7.02671 0.750627 6.71945C0.763163 6.41219 0.961991 6.14371 1.25224 6.04213L16.2522 0.792127C16.5242 0.696948 16.8266 0.765962 17.0303 0.969691ZM9.14456 9.91612L11.1671 14.4667L14.7064 4.35429L9.14456 9.91612ZM13.6457 3.29362L3.53331 6.83297L8.0839 8.85546L13.6457 3.29362Z"
fill="#FFFFFC" />
</svg>
</button>
</form>
</div>
<div class="text-center lg:order-1 md:text-left">
<p class="text-lg font-semibold mb-6">Company</p>
<div class="space-y-3">
<a class="block opacity-60" href="#">Contact</a>
<a class="block opacity-60" href="#">Blog</a>
<a class="block opacity-60" href="#">Work</a>
<a class="block opacity-60" href="#">Service</a>
</div>
</div>
<div class="text-center lg:order-2 lg:mx-12 md:text-left">
<p class="text-lg font-semibold mb-6">Support</p>
<div class="space-y-3">
<a class="block opacity-60" href="#">Help center</a>
<a class="block opacity-60" href="#">Terms of service</a>
<a class="block opacity-60" href="#">Privacy policy</a>
</div>
</div>
</div>
</div>
</footer>
<!-- END FOOTER -->
<script src="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.js"></script>
<script src="./assets/js/circletype.min.js"></script>
<script>
// CHECK IF PAGE ALREADY LOAD OR NOT
let checkInterval = setInterval(() => {
if(document.readyState === 'complete') {
document.getElementById('preload').classList.add('transform', '-translate-x-full', 'transition', 'duration-1000');
clearInterval(checkInterval)
}
}, 1000);
// CIRCLE TEXT
const circleText = document.querySelectorAll('.circle-text');
circleText.forEach(text => {
let circle = new CircleType(text);
circle.forceWidth(true);
text.querySelector('div').style.animation = 'circleAnim 30s linear infinite'
});
// CAROUSEL
const swiper = new Swiper('.swiper', {
loop: true,
centeredSlides: true,
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
breakpoints: {
992: {
slidesPerView: 3,
spaceBetween: 38
},
450: {
slidesPerView: 2,
spaceBetween: 38
}
},
autoplay: {
delay: 3000,
pauseOnMouseEnter: true
}
});
// HANDLE DROPDOWN MENU NAVBAR
let dropdownBtn = document.querySelector('nav button');
let dropdown = document.querySelector('nav .dropdown');
let closeDropdown = document.querySelector('nav .dropdown button');
dropdownBtn.addEventListener('click', function () {
dropdown.classList.remove('translate-x-full');
dropdown.classList.add('translate-x-0')
});
closeDropdown.addEventListener('click', function () {
dropdown.classList.add('translate-x-full');
dropdown.classList.remove('translate-x-0')
})
</script>
</body>
</html>