-
Notifications
You must be signed in to change notification settings - Fork 6
/
Copy pathindex.html
2950 lines (2833 loc) · 145 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
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
<!DOCTYPE html>
<html lang="en">
<!-- Mirrored from estudionk.com/ by HTTrack Website Copier/3.x [XR&CO'2014], Thu, 13 Jan 2022 10:25:28 GMT -->
<!-- Added by HTTrack --><meta
http-equiv="content-type"
content="text/html;charset=utf-8"
/><!-- /Added by HTTrack -->
<head>
<meta charset="UTF-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, maximum-scale=5"
/>
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Aparoksha, IIIT Allahabad</title>
<meta
name="description"
content="We create innovative digital products & future-oriented brands. We design for brands, we work for people."
/>
<meta
name="keywords"
content="design studio, brand studio, product design, uxui, branding, buenos aires, awwwards, argentina, estudionk, estudio nk"
/>
<link
rel="apple-touch-icon"
sizes="120x120"
href="./../estudionkcdn.sfo3.cdn.digitaloceanspaces.com/assets/favicon/apple-touch-icon.png"
/>
<link
rel="icon"
type="image/png"
sizes="32x32"
href="./../estudionkcdn.sfo3.cdn.digitaloceanspaces.com/assets/favicon/favicon-32x32.png"
/>
<link
rel="icon"
type="image/png"
sizes="16x16"
href="./../estudionkcdn.sfo3.cdn.digitaloceanspaces.com/assets/favicon/favicon-16x16.png"
/>
<link
rel="manifest"
href="https./://estudionkcdn.sfo3.cdn.digitaloceanspaces.com/assets/favicon/site.webmanifest"
/>
<link
rel="mask-icon"
href="https./://estudionkcdn.sfo3.cdn.digitaloceanspaces.com/assets/favicon/safari-pinned-tab.svg"
color="#5bbad5"
/>
<meta name="msapplication-TileColor" content="#da532c" />
<meta name="theme-color" content="#ffffff" />
<link
rel="shortcut icon"
href="https./://estudionkcdn.sfo3.cdn.digitaloceanspaces.com/assets/favicon/favicon.ico"
/>
<link rel="canonical" href="index.html" />
<meta property="og:site_name" content="estudio/nk" />
<meta property="og:type" content="article" />
<meta
property="og:title"
content="estudio/nk ® — UI/UX design studio, web design, e-commerce, digital products & branding"
/>
<meta
property="og:description"
content="We create innovative digital products & future-oriented brands. We design for brands, we work for people."
/>
<meta
property="og:image"
content="./../estudionkcdn.sfo3.cdn.digitaloceanspaces.com/assets/img/share/og_image_share.jpg"
/>
<meta property="og:url" content="index.html" />
<meta property="og:image:width" content="200" />
<meta property="og:image:height" content="200" />
<meta property="og:image:type" content="image/jpeg" />
<meta name="twitter:card" content="summary" />
<meta
name="twitter:description"
content="We create innovative digital products & future-oriented brands. We design for brands, we work for people."
/>
<meta
name="twitter:title"
content="estudio/nk ® — UI/UX design studio, web design, e-commerce, digital products & branding"
/>
<meta name="twitter:site" content="estudio/nk" />
<meta
name="twitter:image"
content="./../estudionkcdn.sfo3.cdn.digitaloceanspaces.com/assets/img/share/tw.jpg"
/>
<link defer href="dist/main8e0e.css?v=8" rel="stylesheet" />
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Organization",
"name": "estudio/nk",
"alternateName": "studio/nk",
"url": "https://estudionk.com/",
"logo": "https./://estudionkcdn.sfo3.cdn.digitaloceanspaces.com/assets/img/logo.png",
"sameAs": [
"https://www.facebook.com/elestudionk",
"https://twitter.com/elestudionk",
"https://www.instagram.com/elestudionk/",
"https://www.youtube.com/channel/UCELrWDFw2ZuwWkKlJrMXuoA",
"https://www.linkedin.com/company/elestudionk/"
]
}
</script>
<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "WebSite",
"name": "estudio/nk",
"url": "https://estudionk.com/",
"potentialAction": {
"@type": "SearchAction",
"target": "{search_term_string}",
"query-input": "required name=search_term_string"
}
}
</script>
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "WebPage",
"name": "estudio/nk",
"url": " https://estudionk.com/ ",
"description": "We’re a design studio focused on creating brands and digital products. We create innovative digital products & future-oriented brands. We design for brands, we work for people."
}
</script>
<!-- Google Tag Manager -->
<script async defer>
(function (w, d, s, l, i) {
w[l] = w[l] || [];
w[l].push({ "gtm.start": new Date().getTime(), event: "gtm.js" });
var f = d.getElementsByTagName(s)[0],
j = d.createElement(s),
dl = l != "dataLayer" ? "&l=" + l : "";
j.async = true;
j.src = "../www.googletagmanager.com/gtm5445.html?id=" + i + dl;
f.parentNode.insertBefore(j, f);
})(window, document, "script", "dataLayer", "GTM-5ZSFQWG");
</script>
<!-- End Google Tag Manager -->
<!-- Hotjar Tracking Code for www.estudionk.com -->
<script async defer>
(function (h, o, t, j, a, r) {
h.hj =
h.hj ||
function () {
(h.hj.q = h.hj.q || []).push(arguments);
};
h._hjSettings = { hjid: 1516725, hjsv: 6 };
a = o.getElementsByTagName("head")[0];
r = o.createElement("script");
r.async = 1;
r.src = t + h._hjSettings.hjid + j + h._hjSettings.hjsv;
a.appendChild(r);
})(window, document, "https://static.hotjar.com/c/hotjar-", ".js?sv=");
</script>
</head>
<body class="is-home">
<header class="header x fix top left z10 pen | js-header">
<div class="nav o-gutter-s df jcb aic">
<div class="c-nav__logo oh | js-inner-logo">
<div class="js-inner-header" data-cursor>
<a class="c-nav__logo--inner pea" href="index.html">
<svg
width="204"
height="33"
viewBox="0 0 204 33"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M150.529 0.945801H148.996H147.804L135.031 31.7713H136.223H137.756H138.778L151.551 0.945801H150.529Z"
fill="#00FFC2"
/>
<path
d="M158.704 31.7713H153.254V11.1642H158.704V13.7188C159.896 11.6752 162.45 10.6533 164.664 10.6533C169.774 10.6533 171.988 14.2298 171.988 18.828V31.7713H166.538V19.8499C166.538 17.6359 165.346 15.7625 162.791 15.7625C160.407 15.7625 159.044 17.6359 159.044 20.0202V31.7713H158.704Z"
fill="white"
/>
<path
d="M188.167 19.8496L196.512 31.771H189.7L184.42 23.9369L182.036 26.3212V31.771H176.586V2.1377H182.036V18.8277L189.189 11.1639H196.341L188.167 19.8496Z"
fill="white"
/>
<path
d="M201.621 10.9941C202.472 10.9941 203.153 11.6754 203.153 12.5269C203.153 13.3784 202.472 14.0597 201.621 14.0597C200.769 14.0597 200.088 13.3784 200.088 12.5269C200.088 11.6754 200.769 10.9941 201.621 10.9941ZM201.621 13.8894C202.302 13.8894 202.813 13.3784 202.813 12.5269C202.813 11.8457 202.302 11.1644 201.621 11.1644C200.939 11.1644 200.428 11.6754 200.428 12.5269C200.428 13.3784 200.939 13.8894 201.621 13.8894ZM201.45 13.3784H201.11V11.6754H201.791C202.132 11.6754 202.302 11.8457 202.302 12.1863C202.302 12.3566 202.132 12.6972 201.961 12.6972L202.302 13.3784H201.961L201.621 12.6972H201.45V13.3784ZM201.621 12.5269C201.791 12.5269 201.961 12.3566 201.961 12.3566C201.961 12.1863 201.791 12.016 201.621 12.016H201.45V12.5269H201.621Z"
fill="white"
/>
<path
d="M19.5853 21.3825C19.5853 14.9108 16.0088 10.6532 9.70747 10.6532C4.59828 10.4829 0 14.9108 0 21.3825C0 28.3651 4.76858 32.2821 10.3887 32.2821C15.1573 32.2821 18.2228 29.8978 19.4149 26.1511L16.0088 24.9589C15.1573 27.3432 13.7948 28.7057 10.3887 28.7057C6.98257 28.7057 4.25766 26.1511 4.25766 22.4043H19.7556C19.5853 22.4043 19.5853 21.8934 19.5853 21.3825ZM4.25766 19.3388C4.42797 16.6139 6.47165 14.0593 9.87778 14.0593C13.4542 14.0593 15.4979 16.4436 15.4979 19.3388H4.25766Z"
fill="white"
/>
<path
d="M32.1881 19.8498L28.782 19.1685C27.2492 18.8279 26.3977 17.9764 26.3977 16.6139C26.3977 15.2515 27.7601 13.889 29.8038 13.889C33.0397 13.889 33.8912 16.2733 34.0615 17.2952L37.6379 15.9327C37.2973 14.0593 35.4239 10.4829 29.8038 10.4829C25.7165 10.4829 22.4806 13.5484 22.4806 16.9546C22.4806 19.8498 24.354 22.0638 27.5898 22.745L31.1663 23.5965C32.8693 23.9371 33.8912 24.959 33.8912 26.3214C33.8912 27.8542 32.699 29.0463 30.3147 29.0463C27.4195 29.0463 25.7165 27.3433 25.5462 25.1293L21.9697 26.4917C22.3103 28.876 24.6946 32.4525 30.3147 32.4525C35.4239 32.4525 37.8082 29.0463 37.8082 26.1511C37.8082 22.9153 35.9349 20.7013 32.1881 19.8498Z"
fill="white"
/>
<path
d="M93.1573 31.771H97.0743V28.0243V1.28613H93.1573V14.0591C92.476 12.3561 90.4323 10.653 86.8559 10.653C81.0655 10.653 77.1484 15.5919 77.1484 21.3823C77.1484 27.5133 80.8952 32.2819 86.8559 32.2819C90.0917 32.2819 92.3057 30.5789 93.1573 28.5352V31.771ZM87.3668 28.7055C83.4498 28.7055 81.4061 25.64 81.4061 21.3823C81.4061 17.1246 83.7904 14.2294 87.5371 14.2294C91.2839 14.2294 93.4979 17.1246 93.4979 21.3823C93.1573 25.4697 90.9433 28.7055 87.3668 28.7055Z"
fill="white"
/>
<path
d="M106.612 11.1641H102.695V31.6008H106.612V11.1641Z"
fill="white"
/>
<path
d="M121.428 10.4829C115.297 10.4829 110.869 15.0812 110.869 21.3825C110.869 27.6839 115.297 32.2821 121.428 32.2821C127.559 32.2821 131.987 27.6839 131.987 21.3825C131.987 15.2515 127.559 10.4829 121.428 10.4829ZM121.428 28.7057C118.022 28.7057 114.957 26.1511 114.957 21.3825C114.957 16.6139 118.022 14.0593 121.428 14.0593C124.834 14.0593 127.9 16.6139 127.9 21.3825C127.729 26.1511 124.834 28.7057 121.428 28.7057Z"
fill="white"
/>
<path
d="M73.5726 27.8537V11.1636H69.4853V23.596C69.4853 26.6615 67.7822 28.8755 64.5464 28.8755C61.1403 28.8755 59.9481 26.3209 59.9481 23.596V11.1636H56.0311H47.686V4.8623H43.9393H43.5987V9.63089V11.1636H39.6816V14.7401H43.5987V25.9803C43.5987 29.7271 45.8127 31.7707 49.3891 31.7707C50.7516 31.7707 51.7734 31.4301 52.114 31.4301V28.024C51.7734 28.024 51.0922 28.1943 50.5813 28.1943C48.5376 28.1943 47.686 27.1725 47.686 25.2991V14.7401H56.0311V24.1069C56.0311 28.7052 58.9263 32.2817 63.6949 32.2817C66.0792 32.2817 68.6338 31.2598 69.8259 29.2161V31.7707H73.5726V27.8537Z"
fill="white"
/>
<path
d="M104.739 7.07676C106.243 7.07676 107.463 5.85678 107.463 4.35186C107.463 2.84693 106.243 1.62695 104.739 1.62695C103.234 1.62695 102.014 2.84693 102.014 4.35186C102.014 5.85678 103.234 7.07676 104.739 7.07676Z"
fill="white"
/>
</svg>
</a>
</div>
</div>
<div
class="c-nav__reel df aic pea cp | js-reel-open js-inner-header"
data-cursor
>
<div class="c-nav__reel--icon">
<svg
width="6"
height="10"
viewBox="0 0 6 10"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M5.5 5C2.73858 5 0.5 2.76142 0.5 5.58794e-07"
stroke="#00FFC2"
/>
<path d="M0.5 10C0.5 7.23858 2.73858 5 5.5 5" stroke="#00FFC2" />
</svg>
</div>
<div class="c-nav__reel--text">
<div class="c-nav__reel--cta tu white">
<span class="dib rel oh">
<span class="dib"> OUR REEL </span>
</span>
</div>
</div>
</div>
<div class="c-nav df aic">
<div class="c-nav__menu--talk pea | js-inner-header" data-cursor>
<a class="c-nav__talk--link underline-sm white" href="contact.html">
<span class="dib rel oh">
<span class="dib"> LET’S TALK </span>
</span>
</a>
</div>
<div
class="c-nav__menu rel df jcc aic fc cp pea | js-dropdown-btn"
data-cursor
>
<div class="c-nav__circle abs top left x y">
<svg
class="c-nav__progress x y | js-nav-progress"
viewBox="0 0 75 75"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<circle
class="c-nav__circle-progress | js-circle-progress"
cx="37.5"
cy="37.5"
r="36.5"
stroke="#08FFC2"
stroke-width="2"
/>
</svg>
</div>
<div class="c-nav__menu--line bg-white | js-menu-line-1"></div>
<div class="c-nav__menu--line bg-white | js-menu-line-2"></div>
<div class="c-nav__menu--close">
<div
class="c-nav__close--line c-nav__close--line-1 bg-white | js-close-line-1"
></div>
<div
class="c-nav__close--line c-nav__close--line-2 bg-white | js-close-line-2"
></div>
</div>
</div>
</div>
</div>
</header>
<div class="c-dropdown fix top left x y z5 | js-dropdown">
<div class="c-dropdown__inner rel x y">
<ul class="c-dropdown__main--list">
<li class="c-dropdown__main--item oh">
<a
class="c-dropdown__main--link c-dropdown__link c-title__three--link wct rel tu white | js-link-fx js-dropdown-item js-site-link"
data-cursor
href="studio.html"
>
<div class="c-dropdown__inner--hash abs">
<svg
width="34"
height="64"
viewBox="0 0 34 64"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M31.8969 0H28.7423H26.2886L0 64H2.45362H5.60827H7.71135L34 0H31.8969Z"
fill="#00FFC2"
/>
</svg>
</div>
<div class="c-dropdown__link--info">
<span class="dib rel">
<span class="dib | js-link-fx-inner"> STUDIO </span>
<span
class="dib abs top left italic dn s:dib | js-link-fx-inner"
>
STUDIO
</span>
</span>
</div>
</a>
</li>
<li class="c-dropdown__main--item oh">
<a
class="c-dropdown__main--link c-dropdown__link c-title__three--link wct rel tu white | js-link-fx js-dropdown-item js-site-link"
data-cursor
href="work.html"
>
<div class="c-dropdown__inner--hash abs">
<svg
width="34"
height="64"
viewBox="0 0 34 64"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M31.8969 0H28.7423H26.2886L0 64H2.45362H5.60827H7.71135L34 0H31.8969Z"
fill="#00FFC2"
/>
</svg>
</div>
<div class="c-dropdown__link--info">
<span class="dib rel">
<span class="dib | js-link-fx-inner"> WORK </span>
<span
class="dib abs top left italic dn s:dib | js-link-fx-inner"
>
WORK
</span>
</span>
<sup
class="c-dropdown__main--number c-dropdown__number abs italic tu txt-opacity sod"
>(10)</sup
>
</div>
</a>
</li>
<li class="c-dropdown__main--item oh">
<a
class="c-dropdown__main--link c-dropdown__link c-title__three--link wct rel tu white | js-link-fx js-dropdown-item js-site-link"
data-cursor
href="culture.html"
>
<div class="c-dropdown__inner--hash abs">
<svg
width="34"
height="64"
viewBox="0 0 34 64"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M31.8969 0H28.7423H26.2886L0 64H2.45362H5.60827H7.71135L34 0H31.8969Z"
fill="#00FFC2"
/>
</svg>
</div>
<div class="c-dropdown__link--info">
<span class="dib rel">
<span class="dib | js-link-fx-inner"> CULTURE </span>
<span
class="dib abs top left italic dn s:dib | js-link-fx-inner"
>
CULTURE
</span>
</span>
</div>
</a>
</li>
<li class="c-dropdown__main--item oh">
<a
class="c-dropdown__main--link c-dropdown__link c-title__three--link wct rel tu white | js-link-fx js-dropdown-item js-site-link"
data-cursor
href="news.html"
>
<div class="c-dropdown__inner--hash abs">
<svg
width="34"
height="64"
viewBox="0 0 34 64"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M31.8969 0H28.7423H26.2886L0 64H2.45362H5.60827H7.71135L34 0H31.8969Z"
fill="#00FFC2"
/>
</svg>
</div>
<div class="c-dropdown__link--info">
<span class="dib rel">
<span class="dib | js-link-fx-inner"> NEWS </span>
<span
class="dib abs top left italic dn s:dib | js-link-fx-inner"
>
NEWS
</span>
</span>
<sup
class="c-dropdown__main--number c-dropdown__number abs italic tu txt-opacity sod"
>(22)</sup
>
</div>
</a>
</li>
<li class="c-dropdown__main--item oh">
<a
class="c-dropdown__main--link c-dropdown__link c-title__three--link wct rel tu white | js-link-fx js-dropdown-item js-site-link"
data-cursor
href="contact.html"
>
<div class="c-dropdown__inner--hash abs">
<svg
width="34"
height="64"
viewBox="0 0 34 64"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M31.8969 0H28.7423H26.2886L0 64H2.45362H5.60827H7.71135L34 0H31.8969Z"
fill="#00FFC2"
/>
</svg>
</div>
<div class="c-dropdown__link--info">
<span class="dib rel">
<span class="dib | js-link-fx-inner"> CONTACT </span>
<span
class="dib abs top left italic dn s:dib | js-link-fx-inner"
>
CONTACT
</span>
</span>
</div>
</a>
</li>
</ul>
<ul class="c-dropdown__mid--list df jcs ais oh">
<li class="c-dropdown__mid--item">
<a
class="c-dropdown__mid--link c-dropdown__link rel tu white wct | js-link-fx js-dropdown-subitem js-site-link"
data-cursor
href="archive.html"
>
<div class="c-dropdown__inner--hash abs">
<svg
width="9"
height="16"
viewBox="0 0 9 16"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M8.4433 0H7.60825H6.95876L0 16H0.649488H1.48454H2.04124L9 0H8.4433Z"
fill="#00FFC2"
/>
</svg>
</div>
<div class="c-dropdown__link--mid">
<span class="dib rel oh">
<span class="dib | js-link-fx-inner"> ARCHIVE </span>
<span
class="dib abs top left italic dn s:dib | js-link-fx-inner"
>
ARCHIVE
</span>
</span>
<sup
class="c-dropdown__mid--number c-dropdown__number abs italic tu txt-opacity sod"
>(97)</sup
>
</div>
</a>
</li>
<li class="c-dropdown__mid--item">
<a
class="c-dropdown__mid--link c-dropdown__link rel tu white wct | js-link-fx js-dropdown-subitem js-site-link"
data-cursor
href="awards.html"
>
<div class="c-dropdown__inner--hash abs">
<svg
width="9"
height="16"
viewBox="0 0 9 16"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M8.4433 0H7.60825H6.95876L0 16H0.649488H1.48454H2.04124L9 0H8.4433Z"
fill="#00FFC2"
/>
</svg>
</div>
<div class="c-dropdown__link--mid">
<span class="dib rel oh">
<span class="dib | js-link-fx-inner"> AWARDS </span>
<span
class="dib abs top left italic dn s:dib | js-link-fx-inner"
>
AWARDS
</span>
</span>
<sup
class="c-dropdown__mid--number c-dropdown__number abs italic tu txt-opacity sod"
>(120)</sup
>
</div>
</a>
</li>
<li class="c-dropdown__mid--item">
<a
class="c-dropdown__mid--link c-dropdown__link rel tu white wct | js-link-fx js-dropdown-subitem js-site-link"
data-cursor
href="clients.html"
>
<div class="c-dropdown__inner--hash abs">
<svg
width="9"
height="16"
viewBox="0 0 9 16"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M8.4433 0H7.60825H6.95876L0 16H0.649488H1.48454H2.04124L9 0H8.4433Z"
fill="#00FFC2"
/>
</svg>
</div>
<div class="c-dropdown__link--mid">
<span class="dib rel oh">
<span class="dib | js-link-fx-inner"> CLIENTS </span>
<span
class="dib abs top left italic dn s:dib | js-link-fx-inner"
>
CLIENTS
</span>
</span>
<sup
class="c-dropdown__mid--number c-dropdown__number abs italic tu txt-opacity sod"
>(99)</sup
>
</div>
</a>
</li>
</ul>
<div class="c-dropdown__divider | js-dropdown-divider"></div>
<div class="c-dropdown__bot">
<div class="c-dropdown__bot--inner df jcb ais">
<div class="c-dropdown__legal df jcc ais | js-dropdown-bot">
<div
class="c-dropdown__leng rel | js-btn-leng"
style="display: none"
>
<div class="c-dropdown__leng--select txt-opacity">
<span class="c-leng__selected">EN</span>
<div class="c-leng__options abs | js-options-leng">
<a
class="c-leng__options--link rel lng-es"
href="#"
data-router-disabled
>ES</a
>
<a
class="c-leng__options--link abs top left lng-en"
href="#"
data-router-disabled
>EN</a
>
</div>
<svg
width="10"
height="8"
viewBox="0 0 10 8"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path d="M5 8C5 5.23858 7.23858 3 10 3" stroke="#00FFC2" />
<path
d="M-1.71363e-07 3C2.76142 3 5 5.23858 5 8"
stroke="#00FFC2"
/>
</svg>
</div>
</div>
<div class="c-dropdown__rights">
<a
class="c-dropdown__rights--link underline-terms h-color txt-opacity rel dib | js-site-s-link"
data-cursor
href="privacy.html"
>Privacy</a
>
<a
class="c-dropdown__rights--link underline-terms h-color txt-opacity rel dib | js-site-s-link"
data-cursor
href="legal.html"
>Legals</a
>
<a
class="c-dropdown__rights--link underline-terms h-color txt-opacity rel dib | js-site-s-link"
data-cursor
href="quality.html"
>Quality</a
>
<a
class="c-dropdown__rights--link underline-terms h-color txt-opacity rel dib | js-site-s-link"
data-cursor
href="careers.html"
>Carrers</a
>
</div>
</div>
<div class="c-dropdown__socials">
<ul class="c-dropdown__socials--list df">
<li class="c-dropdown__socials--item" data-cursor>
<a
class="js-dropdown-subitem"
href="https://www.facebook.com/elestudionk"
target="_blank"
>
<svg
width="14"
height="23"
viewBox="0 0 14 23"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12.2119 12.9375L12.834 8.77504H8.94423V6.07389C8.94423 4.93512 9.4876 3.8251 11.2297 3.8251H12.9981V0.281211C12.9981 0.281211 11.3934 0 9.85904 0C6.65566 0 4.56179 1.99363 4.56179 5.60266V8.77504H1.00098V12.9375H4.56179V23H8.94423V12.9375H12.2119Z"
fill="white"
/>
</svg>
</a>
</li>
<li class="c-dropdown__socials--item" data-cursor>
<a
class="js-dropdown-subitem"
href="https://www.instagram.com/elestudionk/"
target="_blank"
>
<svg
width="20"
height="21"
viewBox="0 0 20 21"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M10.0039 5.33397C7.16463 5.33397 4.87444 7.63847 4.87444 10.4955C4.87444 13.3525 7.16463 15.657 10.0039 15.657C12.8432 15.657 15.1334 13.3525 15.1334 10.4955C15.1334 7.63847 12.8432 5.33397 10.0039 5.33397ZM10.0039 13.8512C8.16909 13.8512 6.66909 12.3463 6.66909 10.4955C6.66909 8.64472 8.16463 7.13983 10.0039 7.13983C11.8432 7.13983 13.3387 8.64472 13.3387 10.4955C13.3387 12.3463 11.8387 13.8512 10.0039 13.8512ZM16.5396 5.12284C16.5396 5.79218 16.0039 6.32675 15.3432 6.32675C14.678 6.32675 14.1468 5.78768 14.1468 5.12284C14.1468 4.458 14.6825 3.91893 15.3432 3.91893C16.0039 3.91893 16.5396 4.458 16.5396 5.12284ZM19.937 6.34472C19.8611 4.73202 19.495 3.3035 18.3209 2.12655C17.1512 0.949597 15.7316 0.581238 14.1289 0.500378C12.4771 0.406042 7.52623 0.406042 5.87445 0.500378C4.27623 0.576746 2.85659 0.945105 1.68248 2.12206C0.508371 3.29901 0.146763 4.72753 0.0664063 6.34022C-0.0273438 8.00233 -0.0273438 12.9842 0.0664063 14.6463C0.142299 16.259 0.508371 17.6875 1.68248 18.8644C2.85659 20.0414 4.27177 20.4098 5.87445 20.4906C7.52623 20.585 12.4771 20.585 14.1289 20.4906C15.7316 20.4142 17.1512 20.0459 18.3209 18.8644C19.4905 17.6875 19.8566 16.259 19.937 14.6463C20.0307 12.9842 20.0307 8.00682 19.937 6.34472ZM17.803 16.4297C17.4548 17.3101 16.7807 17.9885 15.9012 18.3433C14.5843 18.8689 11.4593 18.7476 10.0039 18.7476C8.54855 18.7476 5.41909 18.8644 4.10659 18.3433C3.23159 17.993 2.55748 17.3146 2.2048 16.4297C1.68248 15.1045 1.80301 11.96 1.80301 10.4955C1.80301 9.03104 1.68694 5.88202 2.2048 4.56132C2.55301 3.68085 3.22712 3.00253 4.10659 2.64764C5.42355 2.12206 8.54855 2.24335 10.0039 2.24335C11.4593 2.24335 14.5887 2.12655 15.9012 2.64764C16.7762 2.99803 17.4503 3.67636 17.803 4.56132C18.3253 5.88651 18.2048 9.03104 18.2048 10.4955C18.2048 11.96 18.3253 15.109 17.803 16.4297Z"
fill="white"
/>
</svg>
</a>
</li>
<li class="c-dropdown__socials--item" data-cursor>
<a
class="js-dropdown-subitem"
href="https://www.linkedin.com/company/elestudionk/"
target="_blank"
>
<svg
width="20"
height="23"
viewBox="0 0 20 23"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M4.47679 20.1262H0.330357V6.69007H4.47679V20.1262ZM2.40134 4.85725C1.07545 4.85725 0 3.75218 0 2.418C9.49017e-09 1.77714 0.252998 1.16253 0.703336 0.70938C1.15367 0.256227 1.76446 0.00164795 2.40134 0.00164795C3.03821 0.00164795 3.649 0.256227 4.09934 0.70938C4.54968 1.16253 4.80268 1.77714 4.80268 2.418C4.80268 3.75218 3.72679 4.85725 2.40134 4.85725ZM19.9955 20.1262H15.858V13.5856C15.858 12.0268 15.8268 10.0278 13.7022 10.0278C11.5464 10.0278 11.2161 11.7213 11.2161 13.4733V20.1262H7.07411V6.69007H11.0509V8.52288H11.1089C11.6625 7.46721 13.0147 6.35315 15.0321 6.35315C19.2286 6.35315 20 9.13382 20 12.7455V20.1262H19.9955Z"
fill="white"
/>
</svg>
</a>
</li>
<li class="c-dropdown__socials--item" data-cursor>
<a
class="js-dropdown-subitem"
href="https://twitter.com/elestudionk"
target="_blank"
>
<svg
width="23"
height="23"
viewBox="0 0 23 23"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M20.6358 6.81529C20.6504 7.01959 20.6504 7.22394 20.6504 7.42824C20.6504 13.6598 15.9074 20.84 7.23857 20.84C4.56788 20.84 2.08694 20.0665 0 18.7239C0.379455 18.7677 0.744265 18.7823 1.13832 18.7823C3.34196 18.7823 5.37054 18.038 6.99047 16.7684C4.91814 16.7246 3.18146 15.3673 2.5831 13.4993C2.875 13.5431 3.16686 13.5723 3.47336 13.5723C3.89657 13.5723 4.31982 13.5139 4.71383 13.4117C2.55394 12.9739 0.933971 11.0767 0.933971 8.78547V8.72712C1.56148 9.07737 2.29124 9.29628 3.06466 9.32543C1.79499 8.47897 0.96317 7.03419 0.96317 5.39966C0.96317 4.52404 1.19663 3.72138 1.60528 3.02087C3.92572 5.88127 7.41368 7.74926 11.3248 7.95361C11.2519 7.60335 11.2081 7.23854 11.2081 6.87368C11.2081 4.27594 13.3096 2.15985 15.9219 2.15985C17.2791 2.15985 18.505 2.72901 19.366 3.64843C20.4314 3.44412 21.4529 3.05007 22.3578 2.51011C22.0075 3.60467 21.2632 4.52409 20.2855 5.1078C21.2341 5.0057 22.1535 4.74295 22.9999 4.37814C22.3579 5.31211 21.5552 6.14393 20.6358 6.81529Z"
fill="white"
/>
</svg>
</a>
</li>
<li class="c-dropdown__socials--item" data-cursor>
<a
class="js-dropdown-subitem"
href="https://www.youtube.com/channel/UCELrWDFw2ZuwWkKlJrMXuoA"
target="_blank"
>
<svg
width="25"
height="23"
viewBox="0 0 25 23"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M23.8559 5.57404C23.5833 4.51164 22.7801 3.67492 21.7602 3.39097C19.9117 2.875 12.4993 2.875 12.4993 2.875C12.4993 2.875 5.087 2.875 3.23843 3.39097C2.2186 3.67497 1.41539 4.51164 1.14277 5.57404C0.647461 7.49971 0.647461 11.5174 0.647461 11.5174C0.647461 11.5174 0.647461 15.5352 1.14277 17.4608C1.41539 18.5232 2.2186 19.3251 3.23843 19.609C5.087 20.125 12.4993 20.125 12.4993 20.125C12.4993 20.125 19.9117 20.125 21.7602 19.609C22.7801 19.3251 23.5833 18.5232 23.8559 17.4608C24.3512 15.5352 24.3512 11.5174 24.3512 11.5174C24.3512 11.5174 24.3512 7.49971 23.8559 5.57404ZM10.0751 15.1652V7.86964L16.2703 11.5175L10.0751 15.1652Z"
fill="white"
/>
</svg>
</a>
</li>
<li class="c-dropdown__socials--item" data-cursor>
<a
class="js-dropdown-subitem"
href="https://www.behance.net/elestudionk"
target="_blank"
>
<svg
width="26"
height="23"
viewBox="0 0 26 23"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M10.4722 10.6556C11.9076 9.97275 12.6569 8.93955 12.6569 7.33135C12.6569 4.15986 10.2826 3.38721 7.54271 3.38721H0V19.3075H7.75486C10.6618 19.3075 13.3927 17.9194 13.3927 14.6851C13.3927 12.686 12.4403 11.2081 10.4722 10.6556ZM3.51632 6.10498H6.81597C8.08437 6.10498 9.22639 6.45986 9.22639 7.92432C9.22639 9.27646 8.33715 9.82002 7.08229 9.82002H3.51632V6.10498ZM7.27639 16.6032H3.51632V12.2188H7.34861C8.89688 12.2188 9.87639 12.8612 9.87639 14.4919C9.87639 16.1001 8.70729 16.6032 7.27639 16.6032ZM23.4587 5.79053H16.9722V4.22275H23.4587V5.79053ZM26 13.7103C26 10.3007 23.9958 7.45713 20.3622 7.45713C16.8323 7.45713 14.4354 10.0985 14.4354 13.5575C14.4354 17.1468 16.7059 19.6085 20.3622 19.6085C23.1292 19.6085 24.9212 18.3687 25.7833 15.7317H22.9757C22.6733 16.7155 21.4274 17.2366 20.4615 17.2366C18.5972 17.2366 17.6177 16.1495 17.6177 14.3032H25.9729C25.9865 14.1145 26 13.9124 26 13.7103ZM17.6222 12.3087C17.726 10.7948 18.7372 9.84697 20.2628 9.84697C21.8608 9.84697 22.6642 10.7813 22.7997 12.3087H17.6222Z"
fill="white"
/>
</svg>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="loader">
<div class="loader-wrap rel x y df fc jcc aic">
<div class="loader-mask rel | js-loader-mask">
<div class="loader-mask-bg x y | js-loader-reveal">
<div
class="loader-mask-img-off"
style="
background: url('./../estudionkcdn.sfo3.cdn.digitaloceanspaces.com/assets/img/loader/off.png');
"
></div>
</div>
<div class="loader-mask-bg loader-mask-progress x y abs top left">
<div
class="loader-mask-img-on"
style="
background: url('./../estudionkcdn.sfo3.cdn.digitaloceanspaces.com/assets/img/loader/on.png');
"
></div>
</div>
</div>
</div>
</div>
<div class="skip-transition | js-skip-transition">
<p class="c-hero__subtitle--text txt-opacity link-fx cp">
<span class="tu">
<span class="underline dib">
<span class="dib rel">
<span class="dib"> SKIP transition </span>
</span>
</span>
</span>
</p>
<p class="pst-footer">Pst, you can turn them back on in the footer</p>
</div>
<div id="app">
<div class="fix top left x y z20 pen">
<span class="cursor">
<span class="cursor-move-inner">
<span class="cursor-inner"></span>
</span>
<span class="cursor-move-outer">
<span class="cursor-outer"></span>
</span>
<span class="cursor-move-outer-text">
<span class="cursor-outer-text white">Drag</span>
</span>
</span>
</div>
<div class="c-sound z5 | js-sound" style="opacity: 0">
<div class="c-hero__sound rel" data-cursor>
<div class="ww-vv cp sound-active | js-sound-toggle">
<div class="wave__music rel z2 | js-wave-bars">
<div class="wave__bar"></div>
<div class="wave__bar"></div>
<div class="wave__bar"></div>
<div class="wave__bar"></div>
</div>
<div class="music__state muted | js-sound-volumen">
<div class="music__state--txt rel tu white volumen-on">On</div>
<div
class="music__state--txt abs top left tu white volumen-off volumen-active"
>
Off
</div>
</div>
</div>
</div>
</div>
<div
class="c-hero__cookies hide-cookies df jcs aic z10 | js-hero-cookies"
data-not-cursor
>
<svg
class="c-hero__cookie dib"
width="14"
height="16"
viewBox="0 0 14 16"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M7 10.5C6.725 10.5 6.5 10.725 6.5 11C6.5 11.275 6.725 11.5 7 11.5C7.275 11.5 7.5 11.275 7.5 11C7.5 10.725 7.275 10.5 7 10.5ZM6 2.75C5.725 2.75 5.5 2.975 5.5 3.25C5.5 3.525 5.725 3.75 6 3.75C6.275 3.75 6.5 3.525 6.5 3.25C6.5 2.975 6.275 2.75 6 2.75ZM7 8.5C6.725 8.5 6.5 8.725 6.5 9C6.5 9.275 6.725 9.5 7 9.5C7.275 9.5 7.5 9.275 7.5 9C7.5 8.725 7.275 8.5 7 8.5ZM7 6.5C6.725 6.5 6.5 6.725 6.5 7C6.5 7.275 6.725 7.5 7 7.5C7.275 7.5 7.5 7.275 7.5 7C7.5 6.725 7.275 6.5 7 6.5ZM8 2.75C7.725 2.75 7.5 2.975 7.5 3.25C7.5 3.525 7.725 3.75 8 3.75C8.275 3.75 8.5 3.525 8.5 3.25C8.5 2.975 8.275 2.75 8 2.75ZM14 7.5C14 6.12187 12.8781 5 11.5 5H10.2625C10.5844 4.27812 10.6562 3.45625 10.4438 2.6375C10.1344 1.425 9.15 0.4375 7.94375 0.121875C7.63125 0.040625 7.31563 0 7 0C6.04688 0 5.15312 0.371875 4.48125 1.04375C3.80937 1.71563 3.4375 2.60938 3.4375 3.5625C3.4375 4.0625 3.54375 4.55312 3.74375 5H2.5C1.12188 5 0 6.12187 0 7.5C0 8.87813 1.12188 10 2.5 10H3.37188L1.55938 11.925C0.690625 12.9938 0.853125 14.5719 1.92188 15.4406C2.36875 15.8 2.92812 16 3.5 16C4.25625 16 4.96563 15.6625 5.44063 15.075L7 13.4625L8.55937 15.075C9.03438 15.6625 9.74375 16 10.5 16C11.0719 16 11.6312 15.8 12.075 15.4406C13.1438 14.5719 13.3062 12.9938 12.4375 11.925L10.625 10H11.5C12.8781 10 14 8.87813 14 7.5ZM9.51875 10.2219L11.6625 12.5531C12.1844 13.1969 12.0875 14.1406 11.4438 14.6625C11.1656 14.8875 10.8313 15 10.5 15C10.0625 15 9.63125 14.8094 9.33438 14.4469L7.775 12.8344C7.575 12.5875 7.2875 12.4656 7 12.4656C6.7125 12.4656 6.425 12.5875 6.225 12.8344L4.66563 14.4469C4.36875 14.8125 3.9375 15 3.5 15C3.16875 15 2.83438 14.8906 2.55625 14.6625C1.9125 14.1406 1.81563 13.1969 2.3375 12.5531L4.48125 10.2219C4.87812 9.73125 4.53125 9 3.9 9H2.5C1.67188 9 1 8.32812 1 7.5C1 6.67188 1.67188 6 2.5 6H5.05C5.34063 6 5.49375 5.64062 5.27812 5.44688C4.7625 4.98125 4.4375 4.3125 4.4375 3.5625C4.4375 2.14687 5.58437 1 7 1C7.225 1 7.45625 1.02813 7.69063 1.09063C8.55313 1.31563 9.25625 2.02187 9.475 2.8875C9.73438 3.90313 9.39062 4.84688 8.725 5.44688C8.50938 5.64375 8.65625 6.00313 8.95 6.00313H11.5C12.3281 6.00313 13 6.675 13 7.50313C13 8.33125 12.3281 9.00313 11.5 9.00313H10.1031C9.47187 9 9.12187 9.73125 9.51875 10.2219Z"
fill="white"
/>
</svg>
<p class="c-hero__cookies--text dib tu white">
This website uses cookies although we are not a bakery.
<a class="c-hero__more--cookies" href="privacy.html" target="_blank"
>Learn more.</a
>
</p>
<svg
class="c-hero__close--cookies cp dib | js-close-cookies"
width="25"
height="25"
viewBox="0 0 25 25"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<circle
cx="12.5"
cy="12.5"
r="12"
stroke="white"
stroke-opacity="0.5"
/>
<path d="M9.28516 16.4287L16.428 9.28585" stroke="white" />
<path d="M9.28516 9.28564L16.428 16.4285" stroke="white" />
</svg>
</div>
<div id="p-cover"></div>
<div class="c-reel__modal fix top left x y pen oh | js-reel">
<div class="c-reel__modal--close">
<div class="c-reel__modal--x cp | js-reel-close">
<div class="c-reel__menu--close">
<div
class="c-reel__close--line c-reel__close--line-1 bg-white"
></div>
<div
class="c-reel__close--line c-reel__close--line-2 bg-white"
></div>
</div>
</div>
</div>
<div class="c-reel__modal--wrap x y df jcc aic">
<div class="c-reel__modal--frame rel">
<!-- <video loop playsinline class="abs top left x y o-cover | js-reel-video" src="https./://estudionkcdn.sfo3.cdn.digitaloceanspaces.com/assets/img/reel2.mp4"></video> -->
<iframe
src="https://www.youtube.com/embed/wUcAAkYAJzc"
class="abs top left x y o-cover | js-reel-video"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen
></iframe>
<iframe
loop
playsinline
class="abs top left x y o-cover dn | js-reel-iframe"
></iframe>
</div>
</div>
</div>
<main data-smooth data-router-wrapper>
<article data-router-view="home" data-id="home">
<section data-smooth-item class="hero">
<div class="c-hero o-gutter-s">
<div class="c-hero__container df fc | js-t-fade js-t-t-home">
<div class="dn m:db">
<h1
class="c-title__one tu white | js-phrase-slider js-title-trigger"
>
<div class="c-hero__title--first rel dib x | js-title-fx">
<span class="dib rel | js-phrase-slide-1">
<span class="dib italic abs top left"> We </span>
<span class="dib rel italic c-hero__space-left--1">
<span class="dib"> design </span>
</span>
</span>
<span class="dib abs top left | js-phrase-slide-2">
<span class="dib italic abs top left"> We </span>
<span class="dib">
<span
class="dib italic abs top left c-hero__space-left--1"
>
work
</span>
</span>
</span>
</div>
<br />
</h1>
<h1
class="c-hero__title c-title__one tu white | js-phrase-slider--2"
>
<div class="c-hero__title--last rel dib x | js-title-fx">
<span class="dib rel | js-phrase-slide-3">
<span class="dib abs top left"> for </span>
<span class="dib rel c-hero__space-left--2">
<span class="dib"> brands. </span>
</span>
</span>
<span class="dib abs top left | js-phrase-slide-4">
<span class="dib abs top left"> for </span>
<span class="dib">
<span class="dib abs top left c-hero__space-left--2">
people.
</span>
</span>
</span>
</div>
<br />
</h1>
</div>
<div class="db m:dn">
<h1
class="c-hero__title c-title__one tu white | js-hero-subtitle"
>
<div class="c-hero__title--first rel dib italic oh x">
<span class="dib">
<span class="dib italic"> We </span> <br />
<span class="dib italic"> design </span>
</span>
</div>
<br />
<div class="c-hero__title--last rel dib oh x">
<span class="dib">