-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
791 lines (720 loc) · 59.7 KB
/
index.html
File metadata and controls
791 lines (720 loc) · 59.7 KB
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
<!-- <!DOCTYPE html> -->
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="./css/style.css" >
<script src="https://cdn.tailwindcss.com"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<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:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
<style>
body{ margin : 3px;
padding: 0px;
}
</style>
<title>PORTFOLIO</title>
</head>
<body class="font-nonito ">
<!-- into section -->
<div id="homepage" class="min-h-screen md:h-screen bg-slate-900 relative overflow-hidden pt-20 md:pt-0">
<!-- navbar -->
<nav class="w-full fixed top-0 bg-slate-900 bg-opacity-95 backdrop-blur-md text-white z-20 shadow-lg border-b border-slate-700">
<div class="container mx-auto px-4 md:px-6 items-center py-4 flex justify-between">
<!-- Logo and Title -->
<a href="#homepage" class="flex items-center gap-2 group">
<div class="w-10 h-10 bg-gradient-to-br from-blue-500 to-cyan-500 rounded-lg flex items-center justify-center font-bold text-white group-hover:scale-110 transition-transform duration-300">
SM
</div>
<span class="text-xl font-bold text-white hidden sm:inline group-hover:text-gray-300 transition-colors">SACHIN MISHRA</span>
</a>
<!-- Desktop Navigation -->
<ul class="hidden md:flex space-x-1 font-medium md:text-sm uppercase text-gray-300">
<li>
<a href="#homepage" class="px-4 py-2 rounded-md hover:bg-slate-700 hover:text-white transition-all duration-300">Home</a>
</li>
<li>
<a href="#about" class="px-4 py-2 rounded-md hover:bg-slate-700 hover:text-white transition-all duration-300">About</a>
</li>
<li>
<a href="#publications" class="px-4 py-2 rounded-md hover:bg-slate-700 hover:text-white transition-all duration-300">Publications</a>
</li>
<li>
<a href="#works" class="px-4 py-2 rounded-md hover:bg-slate-700 hover:text-white transition-all duration-300">Works</a>
</li>
<li>
<a href="#contact" class="px-4 py-2 rounded-md hover:bg-slate-700 hover:text-white transition-all duration-300">Contact</a>
</li>
</ul>
<!-- Right Section: Social Links + Hamburger -->
<div class="flex items-center gap-3">
<!-- Resume Download (Desktop) -->
<a href=".\resume\Sachin_MSR.pdf" download aria-label="Download Resume" class="hidden md:inline-flex items-center gap-2 bg-gradient-to-r from-cyan-500 to-blue-500 hover:from-cyan-600 hover:to-blue-600 text-white px-3 py-2 rounded-md font-semibold transition-all duration-300">
Resume
</a>
<!-- Social Icons (Desktop) -->
<div class="hidden md:flex items-center gap-3">
<a href="https://github.com/Imsachin010" target="_blank" aria-label="GitHub" class="w-9 h-9 rounded-full bg-slate-700 hover:bg-blue-600 flex items-center justify-center transition-all duration-300 hover:scale-110">
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
<path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v 3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
</svg>
</a>
<a href="https://www.linkedin.com/in/sachinmishra010" target="_blank" aria-label="LinkedIn" class="w-9 h-9 rounded-full bg-slate-700 hover:bg-blue-600 flex items-center justify-center transition-all duration-300 hover:scale-110">
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
<path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.225 0z"/>
</svg>
</a>
</div>
<!-- Hamburger Menu (Mobile) -->
<div id="hamburger" class="md:hidden cursor-pointer z-30 flex flex-col gap-1.5 p-2 hover:bg-slate-700 rounded-lg transition-all duration-300">
<div id="line1" class="w-6 h-0.5 bg-white transition-all duration-300 origin-center"></div>
<div id="line2" class="w-6 h-0.5 bg-white transition-all duration-300"></div>
<div id="line3" class="w-6 h-0.5 bg-white transition-all duration-300 origin-center"></div>
</div>
</div>
<!-- Mobile Menu Backdrop -->
<div id="menuBackdrop" class="hidden fixed inset-0 bg-black bg-opacity-60 md:hidden z-10 transition-opacity duration-300"></div>
<!-- Mobile Menu -->
<ul id="menu" class="hidden md:hidden fixed left-0 top-0 w-full h-screen bg-gradient-to-b from-slate-800 to-slate-900 flex-col text-white text-center transition-all duration-500 ease-in-out pt-24 z-20">
<li class="py-4 border-b border-slate-700">
<a class="block px-6 py-3 font-medium hover:text-blue-400 hover:bg-slate-700 transition-all duration-300" href="#homepage">Home</a>
</li>
<li class="py-4 border-b border-slate-700">
<a class="block px-6 py-3 font-medium hover:text-blue-400 hover:bg-slate-700 transition-all duration-300" href="#about">About Me</a>
</li>
<li class="py-4 border-b border-slate-700">
<a class="block px-6 py-3 font-medium hover:text-blue-400 hover:bg-slate-700 transition-all duration-300" href="#publications">Publications</a>
</li>
<li class="py-4 border-b border-slate-700">
<a class="block px-6 py-3 font-medium hover:text-blue-400 hover:bg-slate-700 transition-all duration-300" href="#works">Works</a>
</li>
<li class="py-4 border-b border-slate-700">
<a class="block px-6 py-3 font-medium hover:text-blue-400 hover:bg-slate-700 transition-all duration-300" href="#contact">Contact</a>
</li>
<li class="py-4 border-b border-slate-700">
<a class="block px-6 py-3 font-medium hover:text-blue-400 hover:bg-slate-700 transition-all duration-300" href="./resume.pdf" download>Resume</a>
</li>
<!-- Mobile Social Links -->
<li class="py-6 flex justify-center gap-4">
<a href="https://github.com/Imsachin010" target="_blank" class="w-10 h-10 rounded-full bg-blue-600 flex items-center justify-center hover:bg-blue-700 transition-all">
<svg class="w-5 h-5" fill="white" viewBox="0 0 24 24">
<path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v 3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
</svg>
</a>
<a href="https://www.linkedin.com/in/sachinmishra010" target="_blank" class="w-10 h-10 rounded-full bg-blue-600 flex items-center justify-center hover:bg-blue-700 transition-all">
<svg class="w-5 h-5" fill="white" viewBox="0 0 24 24">
<path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.225 0z"/>
</svg>
</a>
</li>
</ul>
</div>
</nav>
<!-- intro contact -->
<!-- Main content wrapper -->
<div class="flex flex-col lg:flex-row items-center justify-center lg:justify-start lg:pr-96 h-full gap-5 lg:gap-16 px-4 md:px-8 py-10 lg:py-0">
<!-- Left side: Text content -->
<div class="w-full lg:w-auto flex flex-col gap-8 md:gap-10 justify-center order-2 lg:order-1 text-center lg:text-left">
<div class="text-3xl sm:text-4xl md:text-5xl lg:text-6xl xl:text-7xl font-bold leading-tight">
<span class="text-white">Research Scholar</span>
<p id="text" class="text-white mt-2"></p>
</div>
</div>
<!-- Right side: Image content - Centered on all screens -->
<div class="w-full lg:w-auto flex items-center justify-center order-1 lg:order-2 flex-shrink-0">
<img class="w-48 h-48 sm:w-64 sm:h-64 md:w-80 md:h-80 lg:w-96 lg:h-96 object-cover rounded-full shadow-2xl shadow-slate-800 border-4 border-slate-700" src="./img/man.jpg" alt="Profile Image">
</div>
</div>
<!-- Intro Card - Hidden on tablet and below, visible on lg+ (1024px+) -->
<div id="toggleSection" class="hidden lg:flex fixed lg:absolute bottom-5 right-5 lg:bottom-auto lg:top-1/2 lg:-translate-y-1/2 lg:right-8 xl:right-10 w-80 sm:w-96 bg-slate-800 rounded-xl shadow-2xl shadow-slate-900 p-6 border border-slate-700 z-50 transition-all duration-300" style="display: none;">
<div class="flex flex-col gap-4 w-full">
<h1 class="text-2xl font-bold text-white">Hey, I'm Sachin!</h1>
<p class="text-gray-300 text-sm leading-relaxed">
MS by Research student working at the intersection of machine learning, optimization, and model understanding, with a focus on building reliable and well-founded AI systems.
</p>
<button id="toggleButton" class="bg-white text-slate-900 text-md px-4 py-2 rounded-md font-semibold hover:bg-gray-200 transition-colors duration-200 w-full lg:w-fit cursor-pointer">
HIDE ME
</button>
</div>
</div>
<!-- Floating Click Button - Shows when intro card is hidden -->
<button id="toggleFloatingButton" class="fixed bottom-5 right-5 lg:bottom-auto lg:top-1/2 lg:-translate-y-1/2 lg:right-8 xl:right-10 bg-gradient-to-r from-blue-500 to-cyan-500 hover:from-blue-600 hover:to-cyan-600 text-white font-bold py-3 px-6 rounded-full shadow-2xl shadow-slate-900 border border-cyan-400 z-50 transition-all duration-300 text-sm animate-pulse cursor-pointer" style="display: block;">
👋 CLICK ME
</button>
</div>
<!-- about section -->
<div id="about" class="bg-slate-800 relative overflow-hidden mx-auto py-40 flex flex-col-reverse lg:flex-row items-center p-3 gap-20">
<!-- left side -->
<div class="ralative">
<!-- <div class="h-full rounded-full overflow-hidden">
<img height="640px" width='280px' src="./img/sachin 1.jpg" alt="">
</div> -->
</div>
<!-- right side -->
<div class="my-auto flex flex-col gap-5">
<h1 class="text-white text-4xl font-bold">ABOUT ME</h1>
<p class="text-gray-300 leading-relaxed">I am an MS by Research student in Artificial Intelligence and Data Science with a strong foundation in applied machine learning and deep learning. My work focuses on understanding models beyond surface-level performance, emphasizing objective design, optimization behavior, and evaluation of model reliability.
</p>
<p class="text-gray-300 leading-relaxed">I have hands-on experience with vision models and ML systems, and a solid theoretical grounding in generative modeling, including loss formulations, KL-divergence, and ELBO-based objectives. I am particularly interested in how optimization principles influence generalization, robustness, and reasoning in modern learning systems, and I aim to transition this understanding toward multimodal and language-based models.</p>
<!-- Experience Section -->
<div class="flex flex-col gap-4">
<h2 class="text-2xl font-bold text-white">EXPERIENCES</h2>
<!-- Experience Item 1 -->
<div class="border-l-4 border-white pl-4 py-3">
<h3 class="text-lg font-semibold text-white">Research Scholar</h3>
<p class="text-sm text-gray-400">International Institute of Information Technology Bangalore • Full-time</p>
<p class="text-sm text-gray-400">Jul 2025 - Present · Bengaluru, Karnataka, India</p>
<p class="text-sm text-gray-300 mt-2">Research & Development in Artificial Intelligence & Data Science, specifically focused on Optimization and Deep Generative AI. Optimizing Diffusion AI Model parameters and Optimization in Energy systems.</p>
</div>
<!-- Experience Item 2 -->
<div class="border-l-4 border-gray-400 pl-4 py-3">
<h3 class="text-lg font-semibold text-white">Machine Learning Intern</h3>
<p class="text-sm text-gray-400">BigMint (formerly SteelMint/CoalMint) • Internship</p>
<p class="text-sm text-gray-400">Feb 2025 - May 2025 · Raipur, Chhattisgarh, India</p>
<ul class="text-sm text-gray-300 mt-2 space-y-1 list-disc list-inside">
<li>Developed full-fledged application for commodities price forecasting with subscription and membership revenue models</li>
<li>Conducted in-depth time series analysis and feature engineering for predictive modeling</li>
<li>Developed ML/DL algorithms to predict HRC steel prices, enhancing forecasting accuracy</li>
</ul>
<p class="text-sm text-gray-400 mt-2"><strong>Skills:</strong> Python, Time Series Analysis, Deep Learning, Data Preprocessing</p>
</div>
<!-- Experience Item 3 -->
<div class="border-l-4 border-gray-500 pl-4 py-3">
<h3 class="text-lg font-semibold text-white">Research Intern</h3>
<p class="text-sm text-gray-400">IIIT-Naya Raipur • Internship</p>
<p class="text-sm text-gray-400">Aug 2023 - Nov 2023 · 4 months</p>
<p class="text-sm text-gray-300 mt-2">Part of Research & Development under Dr. Santosh Kumar (Professor CSE). Published paper on "UDR Fused Multimodal Approach for Disease Classification in Large Scale Datasets with Advanced CNNs".</p>
<p class="text-sm text-gray-400 mt-2"><strong>Skills:</strong> Machine Learning, Deep Learning, Computer Vision, CNNs, Multimodal Learning</p>
</div>
<!-- Experience Item 4 -->
<div class="border-l-4 border-gray-600 pl-4 py-3">
<h3 class="text-lg font-semibold text-white">Machine Learning Intern</h3>
<p class="text-sm text-gray-400">IIIT-Naya Raipur • Internship</p>
<p class="text-sm text-gray-400">May 2023 - Jul 2023 · 3 months</p>
<p class="text-sm text-gray-300 mt-2">Selected as ML Intern under Dr. Anurag Singh in the Outreach Internship Program. Developed IoT-enabled platform using ML algorithms for fitness scoring. Submitted research paper to NCC.</p>
<p class="text-sm text-gray-400 mt-2"><strong>Skills:</strong> Machine Learning, IoT, Feature Engineering, Model Development</p>
</div>
</div>
</div>
</div>
<!-- publications section -->
<div id="publications" class="py-20 bg-slate-900">
<div class="container mx-auto px-5">
<!-- Header -->
<div class="flex flex-col items-center gap-3 mb-10">
<h1 class="text-white font-bold text-4xl md:text-5xl">PUBLICATIONS</h1>
<p class="text-gray-400">Research & Academic Contributions</p>
<a href="https://scholar.google.com/citations?user=acsumE0AAAAJ&hl=en" target="_blank" class="text-gray-300 hover:text-white font-semibold mt-2">
📚 View on Google Scholar
</a>
</div>
<!-- Publications List -->
<div class="max-w-4xl mx-auto space-y-8">
<!-- Publication 1 -->
<div class="border-l-4 border-white pl-6 py-4 bg-slate-800 rounded-r-lg shadow-md hover:shadow-lg transition-all">
<div class="flex justify-between items-start gap-4 flex-wrap">
<div class="flex-1 min-w-0">
<span class="text-gray-400 font-bold text-sm">2025</span>
<h3 class="text-2xl font-bold text-white mt-2 mb-1">
Dynamic Query Handling with RAG Fusion for PDF-Based Knowledge Retrieval Systems
</h3>
<p class="text-gray-300 text-sm mb-3">
<span class="inline-block bg-slate-700 text-white px-3 py-1 rounded-full mr-2">Conference Paper</span>
IEEE • Apr 9, 2025
</p>
<!-- Authors -->
<p class="text-gray-300 text-sm mb-3">
<strong>Authors:</strong> Sachin Mishra and Co-authors
</p>
<!-- Tools Used -->
<p class="text-gray-300 text-sm mb-3">
<strong>Tools & Technologies:</strong> LangChain, Chroma DB, RAG Fusion, Vector Embeddings, Python, Large Language Models
</p>
<!-- Project Overview -->
<p class="text-gray-300 text-sm mb-4 leading-relaxed">
This study explores advancements in Retrieval Augmented Generation (RAG) systems tailored for PDF-based question answering. By leveraging domain-specific PDFs as input data, the proposed framework incorporates advanced retrieval techniques, including multi-query generation and RAG fusion, to enhance generated responses' relevance and contextual accuracy. The integration of advanced retrieval strategies significantly improves precision, reduces hallucinations, and enriches response quality for knowledge-intensive tasks.
</p>
<!-- Links -->
<div class="flex flex-wrap gap-3">
<a href="https://doi.org/10.1109/IATMSI64286.2025.10984648" class="inline-flex items-center gap-1 bg-slate-700 hover:bg-slate-600 text-white px-3 py-1 rounded-md text-sm font-medium transition-colors">
📄 DOI
</a>
<a href="https://ieeexplore.ieee.org/stamp/stamp.jsp?tp=&arnumber=11070378" class="inline-flex items-center gap-1 bg-slate-700 hover:bg-slate-600 text-white px-3 py-1 rounded-md text-sm font-medium transition-colors">
📋 Paper
</a>
<a href="https://ieeexplore.ieee.org/abstract/document/11070378" class="inline-flex items-center gap-1 bg-slate-700 hover:bg-slate-600 text-white px-3 py-1 rounded-md text-sm font-medium transition-colors">
🔗 IEEE
</a>
</div>
</div>
</div>
</div>
<!-- Publication 2 -->
<div class="border-l-4 border-white pl-6 py-4 bg-slate-800 rounded-r-lg shadow-md hover:shadow-lg transition-all">
<div class="flex justify-between items-start gap-4 flex-wrap">
<div class="flex-1 min-w-0">
<span class="text-gray-400 font-bold text-sm">2025</span>
<h3 class="text-2xl font-bold text-white mt-2 mb-1">
TransDFD: A Deepfake Detection System of Mesoscopic Level
</h3>
<p class="text-gray-300 text-sm mb-3">
<span class="inline-block bg-slate-700 text-white px-3 py-1 rounded-full mr-2">Conference Paper</span>
IEEE • Mar 7, 2025
</p>
<!-- Authors -->
<p class="text-gray-300 text-sm mb-3">
<strong>Authors:</strong> Sachin Mishra and Co-authors
</p>
<!-- Tools Used -->
<p class="text-gray-300 text-sm mb-3">
<strong>Tools & Technologies:</strong> Deep Learning, Transfer Learning, MesoNet-4, Conv2D, CNNs, Python, TensorFlow
</p>
<!-- Project Overview -->
<p class="text-gray-300 text-sm mb-4 leading-relaxed">
This research introduces TransDFD, a novel deepfake detection system developed at the mesoscopic level using a deep learning approach and deployed as "Deepfake-guard-AI". The model enhances the original MesoNet-4 architecture by integrating transfer learning with additional layers, optimizing performance on Indian datasets. The system successfully identifies video tampering methods like Deepfake and Face2Face manipulations with high accuracy.
</p>
<!-- Links -->
<div class="flex flex-wrap gap-3">
<a href="https://doi.org/10.1109/IATMSI64286.2025.10984648" class="inline-flex items-center gap-1 bg-slate-700 hover:bg-slate-600 text-white px-3 py-1 rounded-md text-sm font-medium transition-colors">
📄 DOI
</a>
<a href="https://ieeexplore.ieee.org/stamp/stamp.jsp?tp=&arnumber=10984648" class="inline-flex items-center gap-1 bg-slate-700 hover:bg-slate-600 text-white px-3 py-1 rounded-md text-sm font-medium transition-colors">
📋 Paper
</a>
<a href="https://ieeexplore.ieee.org/abstract/document/10984648" class="inline-flex items-center gap-1 bg-slate-700 hover:bg-slate-600 text-white px-3 py-1 rounded-md text-sm font-medium transition-colors">
🔗 IEEE
</a>
</div>
</div>
</div>
</div>
<!-- Publication 3 -->
<div class="border-l-4 border-white pl-6 py-4 bg-slate-800 rounded-r-lg shadow-md hover:shadow-lg transition-all">
<div class="flex justify-between items-start gap-4 flex-wrap">
<div class="flex-1 min-w-0">
<span class="text-gray-400 font-bold text-sm">2025</span>
<h3 class="text-2xl font-bold text-white mt-2 mb-1">
Automated Detection and Classification of Medicinal Plant Leaf Diseases using CNNs
</h3>
<p class="text-gray-300 text-sm mb-3">
<span class="inline-block bg-slate-700 text-white px-3 py-1 rounded-full mr-2">Conference Paper</span>
IEEE International Conference on Ambient Intelligence in Health Care (ICAIHC) • Jan 10, 2025
</p>
<!-- Authors -->
<p class="text-gray-300 text-sm mb-3">
<strong>Authors:</strong> Sachin Mishra and Co-authors
</p>
<!-- Tools Used -->
<p class="text-gray-300 text-sm mb-3">
<strong>Tools & Technologies:</strong> Convolutional Neural Networks (CNNs), Computer Vision, Deep Learning, Python, TensorFlow, Image Processing
</p>
<!-- Project Overview -->
<p class="text-gray-300 text-sm mb-4 leading-relaxed">
This research introduces a novel, fully automated system for detecting diseases in medicinal plant leaves using Convolutional Neural Networks (CNNs). Addressing the limitations of manual disease identification, which is time-consuming and prone to errors, the proposed system leverages computer vision and deep learning to classify and identify diseases with high accuracy (98.67%), ensuring efficient agricultural health management.
</p>
<!-- Links -->
<div class="flex flex-wrap gap-3">
<a href="https://doi.org/10.1109/ICAIHC64101.2025.10956946" class="inline-flex items-center gap-1 bg-slate-700 hover:bg-slate-600 text-white px-3 py-1 rounded-md text-sm font-medium transition-colors">
📄 DOI
</a>
<a href="https://ieeexplore.ieee.org/stamp/stamp.jsp?tp=&arnumber=10956946" class="inline-flex items-center gap-1 bg-slate-700 hover:bg-slate-600 text-white px-3 py-1 rounded-md text-sm font-medium transition-colors">
📋 Paper
</a>
<a href="https://ieeexplore.ieee.org/abstract/document/10956946" class="inline-flex items-center gap-1 bg-slate-700 hover:bg-slate-600 text-white px-3 py-1 rounded-md text-sm font-medium transition-colors">
🔗 IEEE
</a>
</div>
</div>
</div>
</div>
<!-- Publication 4 -->
<div class="border-l-4 border-white pl-6 py-4 bg-slate-800 rounded-r-lg shadow-md hover:shadow-lg transition-all">
<div class="flex justify-between items-start gap-4 flex-wrap">
<div class="flex-1 min-w-0">
<span class="text-gray-400 font-bold text-sm">2024</span>
<h3 class="text-2xl font-bold text-white mt-2 mb-1">
IoT-ML Driven Holistic Health Monitoring and Fitness Assessment
</h3>
<p class="text-gray-300 text-sm mb-3">
<span class="inline-block bg-slate-700 text-white px-3 py-1 rounded-full mr-2">Journal Article</span>
Institute of Electrical and Electronics Engineers (IEEE) • Jun 21, 2024
</p>
<!-- Authors -->
<p class="text-gray-300 text-sm mb-3">
<strong>Authors:</strong> Sachin Mishra and Co-authors
</p>
<!-- Tools Used -->
<p class="text-gray-300 text-sm mb-3">
<strong>Tools & Technologies:</strong> IoT, Machine Learning, Python, Data Analytics, Health Vitals Monitoring, Wearable Sensors
</p>
<!-- Project Overview -->
<p class="text-gray-300 text-sm mb-4 leading-relaxed">
This paper presents a novel solution featuring an IoT-ML enabled platform for self-monitoring of important health vitals and a fitness assessment score derived through ML algorithms. By integrating data on various health parameters including heart rate, blood oxygen levels, and sleep patterns, advanced machine learning models analyze this data and predict the fitness score that accurately reflects an individual's overall health and fitness level, enabling proactive well-being management.
</p>
<!-- Links -->
<div class="flex flex-wrap gap-3">
<a href="https://doi.org/10.1109/SCES61914.2024.10652387" class="inline-flex items-center gap-1 bg-slate-700 hover:bg-slate-600 text-white px-3 py-1 rounded-md text-sm font-medium transition-colors">
📄 DOI
</a>
<a href="https://ieeexplore.ieee.org/stamp/stamp.jsp?tp=&arnumber=10652387" class="inline-flex items-center gap-1 bg-slate-700 hover:bg-slate-600 text-white px-3 py-1 rounded-md text-sm font-medium transition-colors">
📋 Paper
</a>
<a href="https://ieeexplore.ieee.org/abstract/document/10652387" class="inline-flex items-center gap-1 bg-slate-700 hover:bg-slate-600 text-white px-3 py-1 rounded-md text-sm font-medium transition-colors">
🔗 IEEE
</a>
</div>
</div>
</div>
</div>
<!-- Publication 5 -->
<div class="border-l-4 border-white pl-6 py-4 bg-slate-800 rounded-r-lg shadow-md hover:shadow-lg transition-all">
<div class="flex justify-between items-start gap-4 flex-wrap">
<div class="flex-1 min-w-0">
<span class="text-gray-400 font-bold text-sm">2023</span>
<h3 class="text-2xl font-bold text-white mt-2 mb-1">
UDR Fused Multimodal Approach for Disease Classification in Large-Scale Datasets with Advanced CNNs
</h3>
<p class="text-gray-300 text-sm mb-3">
<span class="inline-block bg-slate-700 text-white px-3 py-1 rounded-full mr-2">Book Chapter</span>
SPRINGER LNNS (Scopus Indexed) • Dec 23, 2023
</p>
<!-- Authors -->
<p class="text-gray-300 text-sm mb-3">
<strong>Authors:</strong> Sachin Mishra and Co-authors
</p>
<!-- Tools Used -->
<p class="text-gray-300 text-sm mb-3">
<strong>Tools & Technologies:</strong> U-Net, DenseNet201, ResNet50, CNNs, Support Vector Machines (SVM), Deep Learning, Python
</p>
<!-- Project Overview -->
<p class="text-gray-300 text-sm mb-4 leading-relaxed">
This paper presents a holistic strategy for breast cancer multiclass disease classification employing advanced deep learning architectures, including U-Net, DenseNet201, and ResNet50 models (referred as UDR fused multimodal). By integrating SVM components to optimize model training on large-scale datasets, an ensembled model was built combining these networks based on their weights and architectures, culminating in a highly accurate classification system with 91.43% accuracy for medical imaging analysis.
</p>
<!-- Links -->
<div class="flex flex-wrap gap-3">
<a href="https://doi.org/10.1007/978-3-031-66410-6_25" class="inline-flex items-center gap-1 bg-slate-700 hover:bg-slate-600 text-white px-3 py-1 rounded-md text-sm font-medium transition-colors">
📄 DOI
</a>
<a href="https://doi.org/10.1007/978-3-031-66410-6_25" class="inline-flex items-center gap-1 bg-slate-700 hover:bg-slate-600 text-white px-3 py-1 rounded-md text-sm font-medium transition-colors">
📋 Paper
</a>
<a href="https://link.springer.com/chapter/10.1007/978-3-031-66410-6_25" class="inline-flex items-center gap-1 bg-slate-700 hover:bg-slate-600 text-white px-3 py-1 rounded-md text-sm font-medium transition-colors">
🔗 Springer
</a>
</div>
</div>
</div>
</div>
</div>
<!-- Add More CTA -->
<div class="flex justify-center mt-10">
<a href="https://scholar.google.com/citations?user=acsumE0AAAAJ&hl=en" target="_blank" class="bg-white hover:bg-gray-200 text-slate-900 font-bold py-3 px-6 rounded-lg transition-colors">
View All Publications on Google Scholar →
</a>
</div>
</div>
</div>
<!-- portfolio -->
<div id="works" class="py-20 bg-slate-800">
<!-- top -->
<div class="flex flex-col items-center gap-3 mb-10">
<h1 class="text-white font-bold text-3xl md:text-4xl">WORKS AND PROJECTS</h1>
<!-- <h2 class="text-white font-bold text-xl md:text-2xl">WORKS AND PROJECTS</h2> -->
<p class="w-11/12 sm:w-3/4 lg:w-1/2 text-center text-gray-400">Not an experienced one, but here are a few quality projects developed by me, focusing on contextual and functional design.</p>
</div>
<!-- Scrollable Projects Container -->
<div class="relative flex items-center justify-center px-5">
<!-- Left Arrow Button -->
<button id="scrollLeft" class="absolute left-0 z-10 bg-white hover:bg-gray-200 text-slate-900 rounded-full p-3 transition-all">
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path>
</svg>
</button>
<!-- Projects Scroll Container -->
<div id="projectsContainer" class="flex overflow-x-auto gap-6 px-16 py-5 snap-x snap-mandatory scroll-smooth" style="scroll-behavior: smooth; scrollbar-width: none;">
<!-- Project Card 1 -->
<div class="flex-shrink-0 w-full sm:w-80 snap-center bg-slate-700 rounded-lg shadow-lg p-6 hover:shadow-2xl transition-all">
<div class="flex flex-col items-center text-center gap-3">
<img class="w-24 h-24 rounded-full object-cover" src="./img/fintech.PNG" alt="Finance Tracker">
<h1 class="font-semibold text-lg text-white">Finance Tracker</h1>
<p class="text-sm text-gray-300">Track your finances and expenses efficiently</p>
<!-- Readiness Badge -->
<div class="flex items-center gap-2">
<span class="text-xs font-bold text-white bg-green-600 px-3 py-1 rounded-full">PRODUCTION READY</span>
</div>
<a class="bg-white text-slate-900 px-4 py-2 rounded-md text-sm hover:bg-gray-200 transition-all font-semibold" href="https://finance-tracker-neon-delta.vercel.app/">View Project</a>
</div>
</div>
<!-- Project Card 2 -->
<div class="flex-shrink-0 w-full sm:w-80 snap-center bg-slate-700 rounded-lg shadow-lg p-6 hover:shadow-2xl transition-all">
<div class="flex flex-col items-center text-center gap-3">
<img class="w-24 h-24 rounded-full object-cover" src="./img/icon.png" alt="Annacode">
<h1 class="font-semibold text-lg text-white">Annacode</h1>
<p class="text-sm text-gray-300">Programming learning platform</p>
<!-- Readiness Badge -->
<div class="flex items-center gap-2">
<span class="text-xs font-bold text-white bg-green-600 px-3 py-1 rounded-full">PRODUCTION READY</span>
</div>
<a class="bg-white text-slate-900 px-4 py-2 rounded-md text-sm hover:bg-gray-200 transition-all font-semibold" href="https://anna-code.vercel.app/">View Project</a>
</div>
</div>
<!-- Project Card 3 -->
<div class="flex-shrink-0 w-full sm:w-80 snap-center bg-slate-700 rounded-lg shadow-lg p-6 hover:shadow-2xl transition-all">
<div class="flex flex-col items-center text-center gap-3">
<img class="w-24 h-24 rounded-full object-cover" src="./img/back.jpg" alt="Deep Guard AI">
<h1 class="font-semibold text-lg text-white">Deep Guard AI</h1>
<p class="text-sm text-gray-300">AI-powered security & threat detection</p>
<!-- Readiness Badge -->
<div class="flex items-center gap-2">
<span class="text-xs font-bold text-white bg-yellow-500 px-3 py-1 rounded-full">IN DEVELOPMENT</span>
</div>
<a class="bg-white text-slate-900 px-4 py-2 rounded-md text-sm hover:bg-gray-200 transition-all font-semibold" href="https://github.com/Imsachin010/Trans_DFD">View Project</a>
</div>
</div>
<!-- Project Card 4 -->
<div class="flex-shrink-0 w-full sm:w-80 snap-center bg-slate-700 rounded-lg shadow-lg p-6 hover:shadow-2xl transition-all">
<div class="flex flex-col items-center text-center gap-3">
<img class="w-24 h-24 rounded-full object-cover" src="./img/logo.png" alt="GECR NSS">
<h1 class="font-semibold text-lg text-white">GECR NSS Website</h1>
<p class="text-sm text-gray-300">GEC Raipur NSS community portal</p>
<!-- Readiness Badge -->
<div class="flex items-center gap-2">
<span class="text-xs font-bold text-white bg-green-600 px-3 py-1 rounded-full">PRODUCTION READY</span>
</div>
<a class="bg-white text-slate-900 px-4 py-2 rounded-md text-sm hover:bg-gray-200 transition-all font-semibold" href="https://gecrnss.github.io/NSS/">View Project</a>
</div>
</div>
<!-- Project Card 5 -->
<div class="flex-shrink-0 w-full sm:w-80 snap-center bg-slate-700 rounded-lg shadow-lg p-6 hover:shadow-2xl transition-all">
<div class="flex flex-col items-center text-center gap-3">
<img class="w-24 h-24 rounded-full object-cover" src="./img/icon.png" alt="StartupConnekt">
<h1 class="font-semibold text-lg text-white">StartupConnekt</h1>
<p class="text-sm text-gray-300">Startup networking & collaboration platform</p>
<!-- Readiness Badge -->
<div class="flex items-center gap-2">
<span class="text-xs font-bold text-white bg-green-600 px-3 py-1 rounded-full">PRODUCTION READY</span>
</div>
<a class="bg-white text-slate-900 px-4 py-2 rounded-md text-sm hover:bg-gray-200 transition-all font-semibold" href="https://startup-connekt-fe.vercel.app/">View Project</a>
</div>
</div>
<!-- Project Card 6 -->
<div class="flex-shrink-0 w-full sm:w-80 snap-center bg-slate-700 rounded-lg shadow-lg p-6 hover:shadow-2xl transition-all">
<div class="flex flex-col items-center text-center gap-3">
<img class="w-24 h-24 rounded-full object-cover" src="./img/icon.png" alt="JS Projects">
<h1 class="font-semibold text-lg text-white">JavaScript Projects</h1>
<p class="text-sm text-gray-300">Collection of JavaScript practice projects</p>
<!-- Readiness Badge -->
<div class="flex items-center gap-2">
<span class="text-xs font-bold text-white bg-blue-600 px-3 py-1 rounded-full">COMPLETED</span>
</div>
<a class="bg-white text-slate-900 px-4 py-2 rounded-md text-sm hover:bg-gray-200 transition-all font-semibold" href="https://github.com/Imsachin010/Project_JS">View Project</a>
</div>
</div>
<!-- Project Card 7 -->
<div class="flex-shrink-0 w-full sm:w-80 snap-center bg-slate-700 rounded-lg shadow-lg p-6 hover:shadow-2xl transition-all">
<div class="flex flex-col items-center text-center gap-3">
<img class="w-24 h-24 rounded-full object-cover" src="./img/front.jpg" alt="AI ML Projects">
<h1 class="font-semibold text-lg text-white">AI/ML Projects</h1>
<p class="text-sm text-gray-300">Machine learning and AI implementations</p>
<!-- Readiness Badge -->
<div class="flex items-center gap-2">
<span class="text-xs font-bold text-white bg-yellow-500 px-3 py-1 rounded-full">IN DEVELOPMENT</span>
</div>
<a class="bg-white text-slate-900 px-4 py-2 rounded-md text-sm hover:bg-gray-200 transition-all font-semibold" href="https://github.com">View Project</a>
</div>
</div>
<!-- Project Card 8 -->
<div class="flex-shrink-0 w-full sm:w-80 snap-center bg-slate-700 rounded-lg shadow-lg p-6 hover:shadow-2xl transition-all">
<div class="flex flex-col items-center text-center gap-3">
<img class="w-24 h-24 rounded-full object-cover" src="./img/icon.png" alt="Health Monitoring">
<h1 class="font-semibold text-lg text-white">ML Health Monitoring App</h1>
<p class="text-sm text-gray-300">Smart health tracking with machine learning</p>
<!-- Readiness Badge -->
<div class="flex items-center gap-2">
<span class="text-xs font-bold text-white bg-green-600 px-3 py-1 rounded-full">PRODUCTION READY</span>
</div>
<a class="bg-white text-slate-900 px-4 py-2 rounded-md text-sm hover:bg-gray-200 transition-all font-semibold" href="https://github.com/Imsachin010/Smart-Health-Tracking-App">View Project</a>
</div>
</div>
</div>
<!-- Right Arrow Button -->
<button id="scrollRight" class="absolute right-0 z-10 bg-white hover:bg-gray-200 text-slate-900 rounded-full p-3 transition-all">
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
</svg>
</button>
</div>
<!-- Scroll Indicator -->
<div class="flex justify-center mt-8 gap-2">
<div id="scrollIndicator" class="text-center text-gray-300 text-sm">
Scroll left/right to view more projects →
</div>
</div>
</div>
<!-- contact -->
<div id="contact" class="py-20 bg-gradient-to-b from-slate-900 to-slate-950 relative overflow-hidden">
<!-- Subtle background gradient effect -->
<div class="absolute inset-0 opacity-20">
<div class="absolute top-0 right-0 w-96 h-96 bg-blue-500 rounded-full filter blur-3xl opacity-10"></div>
<div class="absolute bottom-0 left-0 w-96 h-96 bg-cyan-500 rounded-full filter blur-3xl opacity-10"></div>
</div>
<div class="container mx-auto max-w-2xl px-4 relative z-10">
<!-- Top Section -->
<div class="flex flex-col items-center gap-4 text-center mb-12">
<div class="inline-flex items-center gap-2 mb-2">
<div class="h-px w-8 bg-gradient-to-r from-transparent to-cyan-500"></div>
<span class="text-sm font-semibold text-cyan-400 uppercase tracking-widest">Get in Touch</span>
<div class="h-px w-8 bg-gradient-to-l from-transparent to-cyan-500"></div>
</div>
<h1 class="text-4xl md:text-5xl font-bold bg-gradient-to-r from-white via-white to-cyan-300 bg-clip-text text-transparent">Let's Connect</h1>
<p class="text-gray-400 text-lg max-w-md leading-relaxed">
Have a question or want to collaborate? I'd love to hear from you. Drop me a message and I'll get back to you as soon as possible.
</p>
</div>
<!-- Form Section -->
<form action="https://formspree.io/f/mnnakobj" method="POST" class="bg-slate-800 bg-opacity-50 backdrop-blur-sm rounded-2xl p-8 md:p-10 border border-slate-700 border-opacity-50 shadow-2xl hover:shadow-cyan-500/10 transition-all duration-300">
<!-- Name Input -->
<div class="mb-6 group">
<label class="text-sm font-semibold text-gray-300 mb-2 flex items-center gap-2">
<svg class="w-4 h-4 text-cyan-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
Your Name
</label>
<input
type="text"
name="name"
class="w-full px-4 py-3 bg-slate-700 bg-opacity-50 border border-slate-600 text-white placeholder-gray-500 rounded-lg focus:outline-none focus:ring-2 focus:ring-cyan-500 focus:border-transparent focus:bg-slate-700 transition-all duration-300 hover:border-slate-500"
placeholder="Enter your name"
required>
</div>
<!-- Email Input -->
<div class="mb-6 group">
<label class="text-sm font-semibold text-gray-300 mb-2 flex items-center gap-2">
<svg class="w-4 h-4 text-cyan-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path>
</svg>
Email Address
</label>
<input
type="email"
name="email"
class="w-full px-4 py-3 bg-slate-700 bg-opacity-50 border border-slate-600 text-white placeholder-gray-500 rounded-lg focus:outline-none focus:ring-2 focus:ring-cyan-500 focus:border-transparent focus:bg-slate-700 transition-all duration-300 hover:border-slate-500"
placeholder="your.email@example.com"
required>
</div>
<!-- Message Input -->
<div class="mb-8 group">
<label class="text-sm font-semibold text-gray-300 mb-2 flex items-center gap-2">
<svg class="w-4 h-4 text-cyan-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 8h10M7 12h4m1 8l-4-4H5a2 2 0 01-2-2V6a2 2 0 012-2h12a2 2 0 012 2v8a2 2 0 01-2 2h-3.28l-4 4v-4z"></path>
</svg>
Your Message
</label>
<textarea
name="message"
class="w-full px-4 py-3 bg-slate-700 bg-opacity-50 border border-slate-600 text-white placeholder-gray-500 rounded-lg focus:outline-none focus:ring-2 focus:ring-cyan-500 focus:border-transparent focus:bg-slate-700 transition-all duration-300 hover:border-slate-500 resize-none"
rows="5"
placeholder="Tell me about your project, questions, or collaboration ideas..."
required></textarea>
</div>
<input type="hidden" name="_replyto" value="007mishrasachinmishra@gmail.com">
<!-- Submit Button -->
<button
type="submit"
class="w-full bg-gradient-to-r from-blue-500 to-cyan-500 hover:from-blue-600 hover:to-cyan-600 text-white font-bold py-3 rounded-lg transition-all duration-300 transform hover:scale-105 hover:shadow-lg hover:shadow-cyan-500/50 active:scale-95 flex items-center justify-center gap-2 group">
<svg class="w-5 h-5 group-hover:translate-x-1 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14 5l7 7m0 0l-7 7m7-7H3"></path>
</svg>
Send Message
</button>
<!-- Help Text -->
<p class="text-center text-xs text-gray-500 mt-4">
I typically respond within 24-48 hours. Looking forward to connecting with you!
</p>
</form>
</div>
</div>
<!-- footer -->
<div class="w-full bg-gradient-to-b from-slate-900 to-slate-950 border-t border-slate-700 border-opacity-50">
<div class="container mx-auto px-4 md:px-8 py-16">
<!-- Main Footer Content -->
<div class="grid grid-cols-1 md:grid-cols-3 gap-12 mb-12">
<!-- Brand Section -->
<div class="flex flex-col gap-4">
<div class="flex items-center gap-3">
<div class="w-10 h-10 bg-gradient-to-br from-blue-500 to-cyan-500 rounded-lg flex items-center justify-center font-bold text-white text-sm">
SM
</div>
<div>
<h3 class="text-lg font-bold text-white">Sachin Mishra</h3>
<p class="text-xs text-gray-400">Research Scholar</p>
</div>
</div>
<p class="text-sm text-gray-400 leading-relaxed">
MS by Research | AI & Optimization | Deep Learning
</p>
</div>
<!-- Quick Links -->
<div class="flex flex-col gap-4">
<h4 class="text-sm font-semibold text-white uppercase tracking-wider">Navigate</h4>
<ul class="flex flex-col gap-2">
<li><a href="#homepage" class="text-gray-400 hover:text-white text-sm transition-colors duration-200">Home</a></li>
<li><a href="#about" class="text-gray-400 hover:text-white text-sm transition-colors duration-200">About</a></li>
<li><a href="#publications" class="text-gray-400 hover:text-white text-sm transition-colors duration-200">Publications</a></li>
<li><a href="#works" class="text-gray-400 hover:text-white text-sm transition-colors duration-200">Works</a></li>
</ul>
</div>
<!-- Connect Section -->
<div class="flex flex-col gap-4">
<h4 class="text-sm font-semibold text-white uppercase tracking-wider">Connect</h4>
<p class="text-sm text-gray-400">Get in touch via email or social media</p>
<a href="mailto:007mishrasachinmishra@gmail.com" class="text-blue-400 hover:text-cyan-400 text-sm transition-colors duration-200 font-medium">
Sachin.Mishra@iiitb.ac.in <br> 007mishrasachinmishra@gmail.com
</a>
</div>
</div>
<!-- Divider -->
<div class="h-px bg-gradient-to-r from-transparent via-slate-700 to-transparent mb-8"></div>
<!-- Social Links & Copyright -->
<div class="flex flex-col md:flex-row items-center justify-between gap-6">
<!-- Social Icons -->
<div class="flex items-center gap-4">
<a href="https://github.com/Imsachin010" target="_blank" aria-label="GitHub" class="w-10 h-10 rounded-full bg-slate-800 hover:bg-blue-600 flex items-center justify-center transition-all duration-300 hover:scale-110 hover:shadow-lg hover:shadow-blue-500/50 group">
<svg class="w-5 h-5 text-gray-400 group-hover:text-white transition-colors" fill="currentColor" viewBox="0 0 24 24">
<path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v 3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
</svg>
</a>
<a href="https://www.linkedin.com/in/sachinmishra010" target="_blank" aria-label="LinkedIn" class="w-10 h-10 rounded-full bg-slate-800 hover:bg-blue-600 flex items-center justify-center transition-all duration-300 hover:scale-110 hover:shadow-lg hover:shadow-blue-500/50 group">
<svg class="w-5 h-5 text-gray-400 group-hover:text-white transition-colors" fill="currentColor" viewBox="0 0 24 24">
<path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.225 0z"/>
</svg>
</a>
<a href="https://twitter.com/imSachin_010?t=kgh8Ta4q2BiYfPY9btKEIA&s=09" target="_blank" aria-label="Twitter" class="w-10 h-10 rounded-full bg-slate-800 hover:bg-blue-600 flex items-center justify-center transition-all duration-300 hover:scale-110 hover:shadow-lg hover:shadow-blue-500/50 group">
<svg class="w-5 h-5 text-gray-400 group-hover:text-white transition-colors" fill="currentColor" viewBox="0 0 24 24">
<path d="M23 3a10.9 10.9 0 01-3.14 1.53 4.48 4.48 0 00-7.86 3v1A10.66 10.66 0 013 4s-4 9 5 13a11.64 11.64 0 01-7 2s9 5 20 5a9.5 9.5 0 00-9-5.5c4.75 2.25 7-7 7-7-2.25 1-5.5.5-5.5.5"/>
</svg>
</a>
<a href="https://scholar.google.com/citations?user=acsumE0AAAAJ&hl=en" target="_blank" aria-label="Google Scholar" class="w-10 h-10 rounded-full bg-slate-800 hover:bg-blue-600 flex items-center justify-center transition-all duration-300 hover:scale-110 hover:shadow-lg hover:shadow-blue-500/50 group">
<svg class="w-5 h-5 text-gray-400 group-hover:text-white transition-colors" fill="currentColor" viewBox="0 0 24 24">
<path d="M12 0C5.373 0 0 5.373 0 12s5.373 12 12 12 12-5.373 12-12S18.627 0 12 0m0 23c-6.075 0-11-4.925-11-11S5.925 1 12 1s11 4.925 11 11-4.925 11-11 11m3.5-11c0-1.93-1.57-3.5-3.5-3.5S8.5 9.07 8.5 11s1.57 3.5 3.5 3.5 3.5-1.57 3.5-3.5"/>
</svg>
</a>
</div>
<!-- Copyright -->
<div class="text-center md:text-right">
<p class="text-gray-500 text-xs">
© 2026 Sachin Mishra. All rights reserved.
</p>
<p class="text-gray-600 text-xs mt-1">
Designed & Developed with <span class="text-cyan-400">💻</span>
</p>
</div>
</div>
</div>
</div>
<script src="./app.js"></script>
<script src="./css/autotyping.js"></script>
</body>
</html>