Hugging Face's logo

Spaces:
manideepreddym
/
maniportfolio
Running

App Files Community
manideepreddym commited on
Commit
3376ad1
·
verified ·
1 Parent(s): c88bc22

Add 2 files

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +875 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Maniportfolio
3
- emoji: 🐢
4
- colorFrom: indigo
5
- colorTo: red
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: maniportfolio
3
+ emoji: 🐳
4
+ colorFrom: blue
5
+ colorTo: blue
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,875 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en" class="scroll-smooth">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Manideep Reddy - Data Sage</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <link href="https://fonts.googleapis.com/css2?family=Tangerine:wght@400;700&family=Raleway:wght@300;400;600;700&display=swap" rel="stylesheet">
10
+ <script>
11
+ tailwind.config = {
12
+ darkMode: 'class',
13
+ theme: {
14
+ extend: {
15
+ fontFamily: {
16
+ 'sanskrit': ['Tangerine', 'cursive'],
17
+ 'content': ['Raleway', 'sans-serif']
18
+ },
19
+ colors: {
20
+ 'saffron': '#FF9933',
21
+ 'royal-blue': '#4169E1',
22
+ 'ancient-gold': '#D4AF37',
23
+ 'indigo': '#4B0082',
24
+ 'ivory': '#FFFFF0',
25
+ 'dark-cloth': '#1A1A2E'
26
+ },
27
+ animation: {
28
+ 'fade-in': 'fadeIn 0.5s ease-in-out',
29
+ 'slide-up': 'slideUp 0.5s ease-out',
30
+ 'float': 'float 3s ease-in-out infinite',
31
+ 'scroll-text': 'scrollText 20s linear infinite'
32
+ },
33
+ keyframes: {
34
+ fadeIn: {
35
+ '0%': { opacity: '0' },
36
+ '100%': { opacity: '1' },
37
+ },
38
+ slideUp: {
39
+ '0%': { transform: 'translateY(20px)', opacity: '0' },
40
+ '100%': { transform: 'translateY(0)', opacity: '1' },
41
+ },
42
+ float: {
43
+ '0%, 100%': { transform: 'translateY(0)' },
44
+ '50%': { transform: 'translateY(-10px)' },
45
+ },
46
+ scrollText: {
47
+ '0%': { transform: 'translateX(100%)' },
48
+ '100%': { transform: 'translateX(-100%)' }
49
+ }
50
+ }
51
+ }
52
+ }
53
+ }
54
+ </script>
55
+ <style>
56
+ body {
57
+ font-family: 'content', sans-serif;
58
+ background-color: #FFFFF0;
59
+ color: #333;
60
+ }
61
+ .dark body {
62
+ background-color: #1A1A2E;
63
+ color: #EEE;
64
+ }
65
+ .page-border {
66
+ border: 15px solid transparent;
67
+ border-image: url('https://i.imgur.com/J4gX5bH.png') 30 round;
68
+ }
69
+ .mahabharat-bg {
70
+ background-image: url('https://i.imgur.com/d0Qm9uL.jpg');
71
+ background-size: cover;
72
+ background-position: center;
73
+ background-attachment: fixed;
74
+ }
75
+ .sanskrit-text {
76
+ font-family: 'sanskrit', cursive;
77
+ }
78
+ .palm-leaf {
79
+ background-color: #F5F5DC;
80
+ border: 1px solid #D2B48C;
81
+ box-shadow: 0 0 10px rgba(0,0,0,0.1);
82
+ position: relative;
83
+ }
84
+ .palm-leaf::before {
85
+ content: "";
86
+ position: absolute;
87
+ top: 0;
88
+ left: 0;
89
+ right: 0;
90
+ height: 30px;
91
+ background: linear-gradient(to bottom, #D2B48C, transparent);
92
+ }
93
+ .palm-leaf::after {
94
+ content: "";
95
+ position: absolute;
96
+ bottom: 0;
97
+ left: 0;
98
+ right: 0;
99
+ height: 30px;
100
+ background: linear-gradient(to top, #D2B48C, transparent);
101
+ }
102
+ .ancient-border {
103
+ border: 8px solid transparent;
104
+ border-image: url('https://i.imgur.com/J4gX5bH.png') 30 round;
105
+ }
106
+ .scroll-text-container {
107
+ overflow: hidden;
108
+ white-space: nowrap;
109
+ }
110
+ .scroll-text {
111
+ display: inline-block;
112
+ padding-left: 100%;
113
+ animation: scrollText 20s linear infinite;
114
+ }
115
+ </style>
116
+ </head>
117
+ <body class="dark:bg-dark-cloth dark:text-ivory transition-colors duration-500">
118
+ <!-- Ancient Scroll Header -->
119
+ <div class="bg-saffron text-indigo py-2 scroll-text-container hidden md:block">
120
+ <div class="scroll-text sanskrit-text text-2xl font-bold">
121
+ ॐ मणिदीप रेड्डी - दत्ता विश्लेषक | Data Sage harnessing the power of Drona's wisdom | संख्यात्मक ज्ञान से अर्जुन की तरह सटीक | माणिक्य की तरह दुर्लभ कौशल |
122
+ </div>
123
+ </div>
124
+
125
+ <!-- Navigation - Like a Warrior's Armor -->
126
+ <nav class="fixed w-full bg-ivory/90 dark:bg-indigo/90 backdrop-blur-md z-50 shadow-lg border-b-2 border-ancient-gold">
127
+ <div class="container mx-auto px-6 py-3">
128
+ <div class="flex justify-between items-center">
129
+ <a href="#home" class="text-2xl font-bold text-indigo dark:text-saffron flex items-center sanskrit-text">
130
+ <span class="mr-2">मणिदीप</span>
131
+ <i class="fas fa-database text-sm"></i>
132
+ </a>
133
+
134
+ <div class="hidden md:flex space-x-8">
135
+ <a href="#home" class="nav-link font-semibold text-indigo dark:text-saffron hover:text-royal-blue dark:hover:text-ancient-gold transition-colors">Home</a>
136
+ <a href="#experience" class="nav-link font-semibold text-indigo dark:text-saffron hover:text-royal-blue dark:hover:text-ancient-gold transition-colors">Experience</a>
137
+ <a href="#skills" class="nav-link font-semibold text-indigo dark:text-saffron hover:text-royal-blue dark:hover:text-ancient-gold transition-colors">Skills</a>
138
+ <a href="#education" class="nav-link font-semibold text-indigo dark:text-saffron hover:text-royal-blue dark:hover:text-ancient-gold transition-colors">Education</a>
139
+ <a href="#projects" class="nav-link font-semibold text-indigo dark:text-saffron hover:text-royal-blue dark:hover:text-ancient-gold transition-colors">Projects</a>
140
+ <a href="#contact" class="nav-link font-semibold text-indigo dark:text-saffron hover:text-royal-blue dark:hover:text-ancient-gold transition-colors">Contact</a>
141
+ </div>
142
+
143
+ <div class="flex items-center space-x-4">
144
+ <button id="theme-toggle" class="p-2 rounded-full hover:bg-royal-blue/20 dark:hover:bg-saffron/20 transition">
145
+ <i class="fas fa-moon dark:hidden text-indigo"></i>
146
+ <i class="fas fa-sun hidden dark:block text-saffron"></i>
147
+ </button>
148
+
149
+ <button id="mobile-menu-button" class="md:hidden p-2 rounded-full hover:bg-royal-blue/20 dark:hover:bg-saffron/20 transition">
150
+ <i class="fas fa-bars text-indigo dark:text-saffron"></i>
151
+ </button>
152
+ </div>
153
+ </div>
154
+
155
+ <!-- Mobile menu -->
156
+ <div id="mobile-menu" class="hidden md:hidden mt-3 pb-2">
157
+ <a href="#home" class="block py-2 px-4 hover:bg-royal-blue/10 dark:hover:bg-saffron/10 rounded">Home</a>
158
+ <a href="#experience" class="block py-2 px-4 hover:bg-royal-blue/10 dark:hover:bg-saffron/10 rounded">Experience</a>
159
+ <a href="#skills" class="block py-2 px-4 hover:bg-royal-blue/10 dark:hover:bg-saffron/10 rounded">Skills</a>
160
+ <a href="#education" class="block py-2 px-4 hover:bg-royal-blue/10 dark:hover:bg-saffron/10 rounded">Education</a>
161
+ <a href="#projects" class="block py-2 px-4 hover:bg-royal-blue/10 dark:hover:bg-saffron/10 rounded">Projects</a>
162
+ <a href="#contact" class="block py-2 px-4 hover:bg-royal-blue/10 dark:hover:bg-saffron/10 rounded">Contact</a>
163
+ </div>
164
+ </div>
165
+ </nav>
166
+
167
+ <!-- Hero Section - Like Arjuna's Entrance -->
168
+ <section id="home" class="min-h-screen flex items-center pt-20 mahabharat-bg relative">
169
+ <div class="absolute inset-0 bg-black/40 dark:bg-black/60"></div>
170
+ <div class="container mx-auto px-6 py-16 md:py-24 relative z-10">
171
+ <div class="flex flex-col md:flex-row items-center">
172
+ <div class="md:w-1/2 mb-12 md:mb-0 animate-fade-in">
173
+ <h1 class="text-4xl md:text-6xl font-bold mb-6 sanskrit-text text-saffron">
174
+ नमस्ते,
175
+ </h1>
176
+ <h1 class="text-4xl md:text-5xl font-bold mb-6 text-ivory">
177
+ I'm <span class="text-ancient-gold">Manideep Reddy</span>
178
+ </h1>
179
+ <h2 class="text-2xl md:text-3xl font-semibold mb-6 text-ivory/90 sanskrit-text">
180
+ A <span class="text-saffron">Data Sage</span> with skills sharp like Arjuna's arrows
181
+ </h2>
182
+ <div class="bg-ivory/90 dark:bg-indigo/90 p-6 rounded-lg shadow-lg mb-8 border-l-4 border-saffron">
183
+ <p class="text-lg text-gray-800 dark:text-ivory">
184
+ "Like the great scholars of the Mahabharata who interpreted celestial patterns,
185
+ I decipher complex data patterns to uncover strategic insights that drive
186
+ business decisions."
187
+ </p>
188
+ </div>
189
+ <div class="flex flex-wrap gap-4">
190
+ <a href="#experience" class="bg-saffron text-indigo px-6 py-3 rounded-lg font-medium hover:bg-opacity-90 transition flex items-center">
191
+ <i class="fas fa-scroll mr-2"></i> My Journey
192
+ </a>
193
+ <a href="#contact" class="border-2 border-ancient-gold text-ancient-gold px-6 py-3 rounded-lg font-medium hover:bg-ancient-gold/10 transition flex items-center">
194
+ <i class="fas fa-envelope mr-2"></i> Send Message
195
+ </a>
196
+ <a href="https://linkedin.com/in/manideep-reddy" target="_blank" class="border-2 border-royal-blue text-royal-blue px-6 py-3 rounded-lg font-medium hover:bg-royal-blue/10 transition flex items-center">
197
+ <i class="fab fa-linkedin-in mr-2"></i> LinkedIn
198
+ </a>
199
+ </div>
200
+ </div>
201
+ <div class="md:w-1/2 flex justify-center animate-float">
202
+ <div class="relative w-64 h-64 md:w-80 md:h-80">
203
+ <div class="absolute inset-0 rounded-full bg-saffron/20 backdrop-blur-sm border-4 border-ancient-gold shadow-xl"></div>
204
+ <div class="absolute inset-4 rounded-full bg-indigo/20 backdrop-blur-sm border-2 border-saffron animate-spin-slow"></div>
205
+ <img src="https://i.imgur.com/JG5XqQm.jpg" alt="Manideep Reddy" class="absolute inset-4 rounded-full object-cover border-2 border-ivory shadow-lg">
206
+ <div class="absolute -bottom-4 -right-4 bg-indigo dark:bg-saffron text-ivory dark:text-indigo p-3 rounded-full shadow-lg">
207
+ <i class="fas fa-database text-2xl"></i>
208
+ </div>
209
+ </div>
210
+ </div>
211
+ </div>
212
+ </div>
213
+ </section>
214
+
215
+ <!-- Quick Info - Like Krishna's Sudarshan Chakra -->
216
+ <div class="bg-indigo text-ivory py-6">
217
+ <div class="container mx-auto px-6">
218
+ <div class="flex flex-wrap justify-center gap-8 md:gap-16">
219
+ <div class="flex items-center">
220
+ <i class="fas fa-envelope text-saffron mr-3 text-xl"></i>
221
+ <div>
222
+ <div class="font-semibold">Email</div>
223
+ <div>manideepreddy.work@gmail.com</div>
224
+ </div>
225
+ </div>
226
+ <div class="flex items-center">
227
+ <i class="fas fa-phone-alt text-saffron mr-3 text-xl"></i>
228
+ <div>
229
+ <div class="font-semibold">Phone</div>
230
+ <div>(415)-902-1124</div>
231
+ </div>
232
+ </div>
233
+ <div class="flex items-center">
234
+ <i class="fas fa-map-marker-alt text-saffron mr-3 text-xl"></i>
235
+ <div>
236
+ <div class="font-semibold">Location</div>
237
+ <div>San Francisco, CA</div>
238
+ </div>
239
+ </div>
240
+ <div class="flex items-center">
241
+ <i class="fas fa-graduation-cap text-saffron mr-3 text-xl"></i>
242
+ <div>
243
+ <div class="font-semibold">Degree</div>
244
+ <div>MS in Data Science</div>
245
+ </div>
246
+ </div>
247
+ </div>
248
+ </div>
249
+ </div>
250
+
251
+ <!-- Professional Summary - Like Vyasa's Wisdom -->
252
+ <section class="py-16 bg-ivory dark:bg-dark-cloth">
253
+ <div class="container mx-auto px-6">
254
+ <div class="text-center mb-12">
255
+ <h2 class="text-3xl md:text-4xl font-bold mb-4 sanskrit-text text-indigo dark:text-saffron">Professional Dharmic Path</h2>
256
+ <div class="w-24 h-1 bg-ancient-gold mx-auto mb-6"></div>
257
+ </div>
258
+
259
+ <div class="max-w-4xl mx-auto bg-white dark:bg-indigo/10 p-8 rounded-xl shadow-md border-t-4 border-saffron animate-slide-up">
260
+ <div class="flex items-start">
261
+ <div class="hidden md:block mr-6">
262
+ <div class="bg-saffron/10 p-4 rounded-full border border-saffron/30">
263
+ <i class="fas fa-brain text-saffron text-3xl"></i>
264
+ </div>
265
+ </div>
266
+ <div>
267
+ <p class="text-lg mb-4 text-gray-700 dark:text-ivory/90">
268
+ Like the wise <span class="font-semibold text-indigo dark:text-saffron">Dronaacharya</span> who imparted strategic knowledge to the Pandavas,
269
+ I bring <span class="font-semibold text-indigo dark:text-saffron">3+ years</span> of experience in <span class="font-semibold text-indigo dark:text-saffron">data analysis</span>, wielding powerful tools like
270
+ <span class="font-semibold text-indigo dark:text-saffron">Python, SQL, R, and TensorFlow</span> to extract meaningful insights from complex data.
271
+ </p>
272
+ <p class="text-lg mb-4 text-gray-700 dark:text-ivory/90">
273
+ My expertise in <span class="font-semibold text-indigo dark:text-saffron">ETL processes, statistical analysis, and cloud platforms (AWS)</span>
274
+ mirrors the <span class="sanskrit-text text-xl text-indigo dark:text-saffron">ऋषि</span> (Rishi) tradition of transforming raw observations into enlightened wisdom.
275
+ </p>
276
+ <p class="text-lg text-gray-700 dark:text-ivory/90">
277
+ Just as <span class="font-semibold text-indigo dark:text-saffron">Chakravartin Samrat</span> used data-driven strategies to rule vast empires,
278
+ I employ <span class="font-semibold text-indigo dark:text-saffron">business process modeling and data mapping</span> to enhance client experiences
279
+ and operational efficiency.
280
+ </p>
281
+ </div>
282
+ </div>
283
+ </div>
284
+ </div>
285
+ </section>
286
+
287
+ <!-- Experience - Like the Kurukshetra Battles -->
288
+ <section id="experience" class="py-16 bg-gray-100 dark:bg-indigo/10">
289
+ <div class="container mx-auto px-6">
290
+ <div class="text-center mb-12">
291
+ <h2 class="text-3xl md:text-4xl font-bold mb-4 sanskrit-text text-indigo dark:text-saffron">Karma Yogic Journeys</h2>
292
+ <p class="text-gray-600 dark:text-ivory/70 max-w-2xl mx-auto">
293
+ My professional battles where I wielded data as my weapon
294
+ </p>
295
+ <div class="w-24 h-1 bg-ancient-gold mx-auto mb-6"></div>
296
+ </div>
297
+
298
+ <div class="max-w-4xl mx-auto">
299
+ <!-- Experience 1 -->
300
+ <div class="mb-12 p-6 bg-white dark:bg-indigo/20 rounded-xl shadow-md border-l-4 border-saffron animate-slide-up">
301
+ <div class="flex flex-col md:flex-row md:items-center justify-between mb-4">
302
+ <h3 class="text-xl md:text-2xl font-bold text-indigo dark:text-saffron">Data Analyst</h3>
303
+ <div class="text-royal-blue dark:text-ancient-gold font-semibold">Oct 2024 – Present</div>
304
+ </div>
305
+ <h4 class="text-lg font-semibold mb-4 text-gray-700 dark:text-ivory/80">ConvoSearch</h4>
306
+ <div class="space-y-4">
307
+ <div class="flex">
308
+ <div class="flex-shrink-0 mr-3 mt-1">
309
+ <div class="h-2 w-2 bg-saffron rounded-full"></div>
310
+ </div>
311
+ <p class="text-gray-700 dark:text-ivory/90">
312
+ Executed comprehensive data mining on large-scale user interaction logs using <span class="font-semibold text-indigo dark:text-saffron">SQL and Python (Pandas, NumPy)</span>, achieving <span class="font-semibold text-indigo dark:text-saffron">30% improvement</span> in search relevance.
313
+ </p>
314
+ </div>
315
+ <div class="flex">
316
+ <div class="flex-shrink-0 mr-3 mt-1">
317
+ <div class="h-2 w-2 bg-saffron rounded-full"></div>
318
+ </div>
319
+ <p class="text-gray-700 dark:text-ivory/90">
320
+ Leveraged <span class="font-semibold text-indigo dark:text-saffron">AWS S3</span> for scalable storage and access of terabyte-scale data, reducing retrieval latency by <span class="font-semibold text-indigo dark:text-saffron">40%</span>.
321
+ </p>
322
+ </div>
323
+ <div class="flex">
324
+ <div class="flex-shrink-0 mr-3 mt-1">
325
+ <div class="h-2 w-2 bg-saffron rounded-full"></div>
326
+ </div>
327
+ <p class="text-gray-700 dark:text-ivory/90">
328
+ Created data models that supported feature development contributing to a <span class="font-semibold text-indigo dark:text-saffron">15% increase</span> in user retention.
329
+ </p>
330
+ </div>
331
+ </div>
332
+ </div>
333
+
334
+ <!-- Experience 2 -->
335
+ <div class="mb-12 p-6 bg-white dark:bg-indigo/20 rounded-xl shadow-md border-l-4 border-royal-blue animate-slide-up" style="animation-delay: 0.1s;">
336
+ <div class="flex flex-col md:flex-row md:items-center justify-between mb-4">
337
+ <h3 class="text-xl md:text-2xl font-bold text-indigo dark:text-saffron">Data Scientist</h3>
338
+ <div class="text-royal-blue dark:text-ancient-gold font-semibold">Sep 2022 – Sep 2024</div>
339
+ </div>
340
+ <h4 class="text-lg font-semibold mb-4 text-gray-700 dark:text-ivory/80">Kubota Tractor Corporation</h4>
341
+ <div class="space-y-4">
342
+ <div class="flex">
343
+ <div class="flex-shrink-0 mr-3 mt-1">
344
+ <div class="h-2 w-2 bg-royal-blue rounded-full"></div>
345
+ </div>
346
+ <p class="text-gray-700 dark:text-ivory/90">
347
+ Performed data mining and advanced statistical analysis on sales/financing data, identifying key drivers that <span class="font-semibold text-indigo dark:text-saffron">increased profitability by 15%</span>.
348
+ </p>
349
+ </div>
350
+ <div class="flex">
351
+ <div class="flex-shrink-0 mr-3 mt-1">
352
+ <div class="h-2 w-2 bg-royal-blue rounded-full"></div>
353
+ </div>
354
+ <p class="text-gray-700 dark:text-ivory/90">
355
+ Conducted EDA using <span class="font-semibold text-indigo dark:text-saffron">Python (Pandas, NumPy)</span> and <span class="font-semibold text-indigo dark:text-saffron">SQL</span> on large datasets to uncover trends and prepare summaries.
356
+ </p>
357
+ </div>
358
+ <div class="flex">
359
+ <div class="flex-shrink-0 mr-3 mt-1">
360
+ <div class="h-2 w-2 bg-royal-blue rounded-full"></div>
361
+ </div>
362
+ <p class="text-gray-700 dark:text-ivory/90">
363
+ Worked in Agile environment with <span class="font-semibold text-indigo dark:text-saffron">Jira and Git</span>, contributing to <span class="font-semibold text-indigo dark:text-saffron">20% increase</span> in team project throughput.
364
+ </p>
365
+ </div>
366
+ </div>
367
+ </div>
368
+
369
+ <!-- Experience 3 -->
370
+ <div class="p-6 bg-white dark:bg-indigo/20 rounded-xl shadow-md border-l-4 border-ancient-gold animate-slide-up" style="animation-delay: 0.2s;">
371
+ <div class="flex flex-col md:flex-row md:items-center justify-between mb-4">
372
+ <h3 class="text-xl md:text-2xl font-bold text-indigo dark:text-saffron">Data Analyst Intern</h3>
373
+ <div class="text-royal-blue dark:text-ancient-gold font-semibold">Mar 2022 – Aug 2022</div>
374
+ </div>
375
+ <h4 class="text-lg font-semibold mb-4 text-gray-700 dark:text-ivory/80">Cognizant</h4>
376
+ <div class="space-y-4">
377
+ <div class="flex">
378
+ <div class="flex-shrink-0 mr-3 mt-1">
379
+ <div class="h-2 w-2 bg-ancient-gold rounded-full"></div>
380
+ </div>
381
+ <p class="text-gray-700 dark:text-ivory/90">
382
+ Processed, validated, and analyzed over <span class="font-semibold text-indigo dark:text-saffron">5 TB</span> of client transactional data using SQL-based ETL jobs and Python scripts.
383
+ </p>
384
+ </div>
385
+ <div class="flex">
386
+ <div class="flex-shrink-0 mr-3 mt-1">
387
+ <div class="h-2 w-2 bg-ancient-gold rounded-full"></div>
388
+ </div>
389
+ <p class="text-gray-700 dark:text-ivory/90">
390
+ Reduced data retrieval times by <span class="font-semibold text-indigo dark:text-saffron">30%</span> and boosted reporting accuracy by <span class="font-semibold text-indigo dark:text-saffron">25%</span>.
391
+ </p>
392
+ </div>
393
+ <div class="flex">
394
+ <div class="flex-shrink-0 mr-3 mt-1">
395
+ <div class="h-2 w-2 bg-ancient-gold rounded-full"></div>
396
+ </div>
397
+ <p class="text-gray-700 dark:text-ivory/90">
398
+ Assisted in business process mapping activities to support operational analysis.
399
+ </p>
400
+ </div>
401
+ </div>
402
+ </div>
403
+ </div>
404
+ </div>
405
+ </section>
406
+
407
+ <!-- Skills - Like the Astra Collection -->
408
+ <section id="skills" class="py-16 bg-ivory dark:bg-dark-cloth">
409
+ <div class="container mx-auto px-6">
410
+ <div class="text-center mb-12">
411
+ <h2 class="text-3xl md:text-4xl font-bold mb-4 sanskrit-text text-indigo dark:text-saffron">Divine Astras</h2>
412
+ <p class="text-gray-600 dark:text-ivory/70 max-w-2xl mx-auto">
413
+ The powerful weapons in my arsenal to conquer data challenges
414
+ </p>
415
+ <div class="w-24 h-1 bg-ancient-gold mx-auto mb-6"></div>
416
+ </div>
417
+
418
+ <!-- Skills Grid -->
419
+ <div class="grid grid-cols-2 md:grid-cols-4 gap-6">
420
+ <!-- Column 1: Programming Languages -->
421
+ <div class="bg-white dark:bg-indigo/10 p-6 rounded-xl shadow-md border-t-4 border-saffron animate-fade-in">
422
+ <h3 class="font-bold text-lg mb-4 text-indigo dark:text-saffron flex items-center">
423
+ <i class="fas fa-code mr-2"></i>
424
+ Programming
425
+ </h3>
426
+ <div class="space-y-3">
427
+ <div class="flex items-center">
428
+ <div class="w-2 h-2 bg-saffron rounded-full mr-2"></div>
429
+ <span>Python</span>
430
+ </div>
431
+ <div class="flex items-center">
432
+ <div class="w-2 h-2 bg-saffron rounded-full mr-2"></div>
433
+ <span>SQL</span>
434
+ </div>
435
+ <div class="flex items-center">
436
+ <div class="w-2 h-2 bg-saffron rounded-full mr-2"></div>
437
+ <span>R</span>
438
+ </div>
439
+ </div>
440
+ </div>
441
+
442
+ <!-- Column 2: Databases -->
443
+ <div class="bg-white dark:bg-indigo/10 p-6 rounded-xl shadow-md border-t-4 border-royal-blue animate-fade-in" style="animation-delay: 0.1s;">
444
+ <h3 class="font-bold text-lg mb-4 text-indigo dark:text-saffron flex items-center">
445
+ <i class="fas fa-database mr-2"></i>
446
+ Databases
447
+ </h3>
448
+ <div class="space-y-3">
449
+ <div class="flex items-center">
450
+ <div class="w-2 h-2 bg-royal-blue rounded-full mr-2"></div>
451
+ <span>MySQL</span>
452
+ </div>
453
+ <div class="flex items-center">
454
+ <div class="w-2 h-2 bg-royal-blue rounded-full mr-2"></div>
455
+ <span>PostgreSQL</span>
456
+ </div>
457
+ <div class="flex items-center">
458
+ <div class="w-2 h-2 bg-royal-blue rounded-full mr-2"></div>
459
+ <span>MongoDB</span>
460
+ </div>
461
+ </div>
462
+ </div>
463
+
464
+ <!-- Column 3: Tools -->
465
+ <div class="bg-white dark:bg-indigo/10 p-6 rounded-xl shadow-md border-t-4 border-ancient-gold animate-fade-in" style="animation-delay: 0.2s;">
466
+ <h3 class="font-bold text-lg mb-4 text-indigo dark:text-saffron flex items-center">
467
+ <i class="fas fa-tools mr-2"></i>
468
+ Tools
469
+ </h3>
470
+ <div class="space-y-3">
471
+ <div class="flex items-center">
472
+ <div class="w-2 h-2 bg-ancient-gold rounded-full mr-2"></div>
473
+ <span>AWS (S3, Kinesis, SNS)</span>
474
+ </div>
475
+ <div class="flex items-center">
476
+ <div class="w-2 h-2 bg-ancient-gold rounded-full mr-2"></div>
477
+ <span>Power BI</span>
478
+ </div>
479
+ <div class="flex items-center">
480
+ <div class="w-2 h-2 bg-ancient-gold rounded-full mr-2"></div>
481
+ <span>Tableau</span>
482
+ </div>
483
+ </div>
484
+ </div>
485
+
486
+ <!-- Column 4: ML/Stats -->
487
+ <div class="bg-white dark:bg-indigo/10 p-6 rounded-xl shadow-md border-t-4 border-indigo animate-fade-in" style="animation-delay: 0.3s;">
488
+ <h3 class="font-bold text-lg mb-4 text-indigo dark:text-saffron flex items-center">
489
+ <i class="fas fa-brain mr-2"></i>
490
+ ML & Stats
491
+ </h3>
492
+ <div class="space-y-3">
493
+ <div class="flex items-center">
494
+ <div class="w-2 h-2 bg-indigo rounded-full mr-2"></div>
495
+ <span>TensorFlow</span>
496
+ </div>
497
+ <div class="flex items-center">
498
+ <div class="w-2 h-2 bg-indigo rounded-full mr-2"></div>
499
+ <span>PyTorch</span>
500
+ </div>
501
+ <div class="flex items-center">
502
+ <div class="w-2 h-2 bg-indigo rounded-full mr-2"></div>
503
+ <span>Statistical Analysis</span>
504
+ </div>
505
+ </div>
506
+ </div>
507
+ </div>
508
+
509
+ <!-- Skill Bars -->
510
+ <div class="mt-12 max-w-4xl mx-auto animate-slide-up" style="animation-delay: 0.4s;">
511
+ <h3 class="font-bold text-xl mb-6 text-indigo dark:text-saffron text-center">Weapon Proficiency</h3>
512
+
513
+ <div class="space-y-6">
514
+ <div>
515
+ <div class="flex justify-between mb-2">
516
+ <span class="font-medium">Python (Pandas, NumPy)</span>
517
+ <span class="text-royal-blue dark:text-ancient-gold font-bold">95%</span>
518
+ </div>
519
+ <div class="w-full bg-gray-200 dark:bg-indigo/30 rounded-full h-3">
520
+ <div class="bg-saffron h-3 rounded-full" style="width: 95%"></div>
521
+ </div>
522
+ </div>
523
+
524
+ <div>
525
+ <div class="flex justify-between mb-2">
526
+ <span class="font-medium">SQL (MySQL, PostgreSQL)</span>
527
+ <span class="text-royal-blue dark:text-ancient-gold font-bold">90%</span>
528
+ </div>
529
+ <div class="w-full bg-gray-200 dark:bg-indigo/30 rounded-full h-3">
530
+ <div class="bg-royal-blue h-3 rounded-full" style="width: 90%"></div>
531
+ </div>
532
+ </div>
533
+
534
+ <div>
535
+ <div class="flex justify-between mb-2">
536
+ <span class="font-medium">Data Visualization (Power BI, Tableau)</span>
537
+ <span class="text-royal-blue dark:text-ancient-gold font-bold">85%</span>
538
+ </div>
539
+ <div class="w-full bg-gray-200 dark:bg-indigo/30 rounded-full h-3">
540
+ <div class="bg-ancient-gold h-3 rounded-full" style="width: 85%"></div>
541
+ </div>
542
+ </div>
543
+
544
+ <div>
545
+ <div class="flex justify-between mb-2">
546
+ <span class="font-medium">AWS Cloud Services</span>
547
+ <span class="text-royal-blue dark:text-ancient-gold font-bold">80%</span>
548
+ </div>
549
+ <div class="w-full bg-gray-200 dark:bg-indigo/30 rounded-full h-3">
550
+ <div class="bg-indigo h-3 rounded-full" style="width: 80%"></div>
551
+ </div>
552
+ </div>
553
+ </div>
554
+ </div>
555
+ </div>
556
+ </section>
557
+
558
+ <!-- Education - Like Gurus' Ashram -->
559
+ <section id="education" class="py-16 bg-gray-100 dark:bg-indigo/10">
560
+ <div class="container mx-auto px-6">
561
+ <div class="text-center mb-12">
562
+ <h2 class="text-3xl md:text-4xl font-bold mb-4 sanskrit-text text-indigo dark:text-saffron">Gurukul Learning</h2>
563
+ <p class="text-gray-600 dark:text-ivory/70 max-w-2xl mx-auto">
564
+ The knowledge acquired from the great institutions
565
+ </p>
566
+ <div class="w-24 h-1 bg-ancient-gold mx-auto mb-6"></div>
567
+ </div>
568
+
569
+ <div class="max-w-4xl mx-auto">
570
+ <div class="bg-white dark:bg-indigo/20 p-8 rounded-xl shadow-md border-l-4 border-saffron animate-slide-up">
571
+ <div class="flex flex-col md:flex-row">
572
+ <div class="md:w-1/3 mb-6 md:mb-0 flex justify-center">
573
+ <div class="w-32 h-32 rounded-full bg-indigo/10 dark:bg-saffron/10 border-4 border-saffron/30 flex items-center justify-center">
574
+ <i class="fas fa-university text-indigo dark:text-saffron text-4xl"></i>
575
+ </div>
576
+ </div>
577
+ <div class="md:w-2/3 md:pl-8">
578
+ <h3 class="text-2xl font-bold text-indigo dark:text-saffron mb-2">University of the Pacific</h3>
579
+ <div class="text-lg text-royal-blue dark:text-ancient-gold font-medium mb-4">Master of Science in Data Science</div>
580
+ <p class="text-gray-700 dark:text-ivory/90 mb-4">
581
+ Like the Pandavas trained in the arts of war, I mastered the skills of data analysis, machine learning, and statistical modeling under the guidance of esteemed professors.
582
+ </p>
583
+ <div class="text-gray-600 dark:text-ivory/70 font-medium">
584
+ Aug 2022 - May 2024
585
+ </div>
586
+ </div>
587
+ </div>
588
+ </div>
589
+ </div>
590
+ </div>
591
+ </section>
592
+
593
+ <!-- Projects - Like Epic Achievements -->
594
+ <section id="projects" class="py-16 bg-ivory dark:bg-dark-cloth">
595
+ <div class="container mx-auto px-6">
596
+ <div class="text-center mb-12">
597
+ <h2 class="text-3xl md:text-4xl font-bold mb-4 sanskrit-text text-indigo dark:text-saffron">Legendary Projects</h2>
598
+ <p class="text-gray-600 dark:text-ivory/70 max-w-2xl mx-auto">
599
+ My heroic initiatives that solved complex real-world challenges
600
+ </p>
601
+ <div class="w-24 h-1 bg-ancient-gold mx-auto mb-6"></div>
602
+ </div>
603
+
604
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
605
+ <!-- Project 1 -->
606
+ <div class="bg-white dark:bg-indigo/10 rounded-xl overflow-hidden shadow-lg transition-transform duration-300 hover:scale-105">
607
+ <div class="h-48 bg-gradient-to-r from-indigo-500 to-purple-600 flex items-center justify-center relative">
608
+ <div class="absolute inset-0 bg-black/30"></div>
609
+ <i class="fas fa-heartbeat text-white text-6xl relative z-10"></i>
610
+ </div>
611
+ <div class="p-6">
612
+ <h3 class="text-xl font-bold mb-3 text-indigo dark:text-saffron">Wearable Health Insights Platform</h3>
613
+ <div class="flex flex-wrap gap-2 mb-4">
614
+ <span class="text-xs bg-saffron/20 text-indigo dark:text-saffron px-2 py-1 rounded">Python</span>
615
+ <span class="text-xs bg-saffron/20 text-indigo dark:text-saffron px-2 py-1 rounded">SQL</span>
616
+ <span class="text-xs bg-saffron/20 text-indigo dark:text-saffron px-2 py-1 rounded">TensorFlow</span>
617
+ <span class="text-xs bg-saffron/20 text-indigo dark:text-saffron px-2 py-1 rounded">AWS S3</span>
618
+ </div>
619
+ <p class="text-gray-700 dark:text-ivory/90 mb-4">
620
+ Like Dhanvantari's healing knowledge, this platform aggregates multi-source health data, performing data mapping that improved consolidation efficiency by 25%.
621
+ </p>
622
+ <div class="flex items-center text-sm text-gray-500 dark:text-ivory/70">
623
+ <i class="fas fa-medal text-ancient-gold mr-2"></i>
624
+ <span>Improved predictive model accuracy by 20%</span>
625
+ </div>
626
+ </div>
627
+ </div>
628
+
629
+ <!-- Project 2 -->
630
+ <div class="bg-white dark:bg-indigo/10 rounded-xl overflow-hidden shadow-lg transition-transform duration-300 hover:scale-105">
631
+ <div class="h-48 bg-gradient-to-r from-green-600 to-emerald-500 flex items-center justify-center relative">
632
+ <div class="absolute inset-0 bg-black/30"></div>
633
+ <i class="fas fa-tractor text-white text-6xl relative z-10"></i>
634
+ </div>
635
+ <div class="p-6">
636
+ <h3 class="text-xl font-bold mb-3 text-indigo dark:text-saffron">Optimization of Agriculture Production</h3>
637
+ <div class="flex flex-wrap gap-2 mb-4">
638
+ <span class="text-xs bg-saffron/20 text-indigo dark:text-saffron px-2 py-1 rounded">Python</span>
639
+ <span class="text-xs bg-saffron/20 text-indigo dark:text-saffron px-2 py-1 rounded">Pandas</span>
640
+ <span class="text-xs bg-saffron/20 text-indigo dark:text-saffron px-2 py-1 rounded">Scikit-learn</span>
641
+ <span class="text-xs bg-saffron/20 text-indigo dark:text-saffron px-2 py-1 rounded">TensorFlow</span>
642
+ </div>
643
+ <p class="text-gray-700 dark:text-ivory/90 mb-4">
644
+ Like the agricultural wisdom of ancient India, this project determines optimal cropping patterns based on soil types and climate conditions, achieving 93% prediction accuracy.
645
+ </p>
646
+ <div class="flex items-center text-sm text-gray-500 dark:text-ivory/70">
647
+ <i class="fas fa-medal text-ancient-gold mr-2"></i>
648
+ <span>Reduced data preprocessing time by 30%</span>
649
+ </div>
650
+ </div>
651
+ </div>
652
+ </div>
653
+ </div>
654
+ </section>
655
+
656
+ <!-- Contact - Like Sending a Messenger -->
657
+ <section id="contact" class="py-16 bg-gray-100 dark:bg-indigo/10">
658
+ <div class="container mx-auto px-6">
659
+ <div class="text-center mb-12">
660
+ <h2 class="text-3xl md:text-4xl font-bold mb-4 sanskrit-text text-indigo dark:text-saffron">Send Your Doota</h2>
661
+ <p class="text-gray-600 dark:text-ivory/70 max-w-2xl mx-auto">
662
+ Like messengers in the Mahabharata, send me your inquiries
663
+ </p>
664
+ <div class="w-24 h-1 bg-ancient-gold mx-auto mb-6"></div>
665
+ </div>
666
+
667
+ <div class="flex flex-col md:flex-row gap-12 max-w-6xl mx-auto">
668
+ <div class="md:w-1/2 animate-slide-up">
669
+ <form class="space-y-6">
670
+ <div>
671
+ <label for="name" class="block mb-2 font-medium text-indigo dark:text-saffron">Your Name</label>
672
+ <input type="text" id="name" class="w-full px-4 py-3 rounded-lg border border-gray-300 dark:border-indigo/50 bg-white dark:bg-indigo/20 focus:outline-none focus:ring-2 focus:ring-saffron focus:border-transparent">
673
+ </div>
674
+ <div>
675
+ <label for="email" class="block mb-2 font-medium text-indigo dark:text-saffron">Email Address</label>
676
+ <input type="email" id="email" class="w-full px-4 py-3 rounded-lg border border-gray-300 dark:border-indigo/50 bg-white dark:bg-indigo/20 focus:outline-none focus:ring-2 focus:ring-saffron focus:border-transparent">
677
+ </div>
678
+ <div>
679
+ <label for="subject" class="block mb-2 font-medium text-indigo dark:text-saffron">Subject</label>
680
+ <input type="text" id="subject" class="w-full px-4 py-3 rounded-lg border border-gray-300 dark:border-indigo/50 bg-white dark:bg-indigo/20 focus:outline-none focus:ring-2 focus:ring-saffron focus:border-transparent">
681
+ </div>
682
+ <div>
683
+ <label for="message" class="block mb-2 font-medium text-indigo dark:text-saffron">Message</label>
684
+ <textarea id="message" rows="5" class="w-full px-4 py-3 rounded-lg border border-gray-300 dark:border-indigo/50 bg-white dark:bg-indigo/20 focus:outline-none focus:ring-2 focus:ring-saffron focus:border-transparent"></textarea>
685
+ </div>
686
+ <button type="submit" class="bg-saffron text-indigo px-6 py-3 rounded-lg font-medium hover:bg-opacity-90 transition w-full shadow-md hover:shadow-lg transform hover:-translate-y-1">
687
+ <i class="fas fa-paper-plane mr-2"></i> Send Message
688
+ </button>
689
+ </form>
690
+ </div>
691
+
692
+ <div class="md:w-1/2 animate-slide-up" style="animation-delay: 0.1s;">
693
+ <div class="bg-white dark:bg-indigo/20 p-8 rounded-xl shadow-md h-full border-t-4 border-saffron">
694
+ <h3 class="text-xl font-bold mb-6 text-indigo dark:text-saffron">Contact Information</h3>
695
+
696
+ <div class="space-y-6">
697
+ <div class="flex items-start">
698
+ <div class="bg-saffron/10 p-3 rounded-full mr-4 border border-saffron/30">
699
+ <i class="fas fa-map-marker-alt text-saffron"></i>
700
+ </div>
701
+ <div>
702
+ <h4 class="font-semibold mb-1 text-indigo dark:text-saffron">Location</h4>
703
+ <p class="text-gray-700 dark:text-ivory/90">San Francisco, CA</p>
704
+ </div>
705
+ </div>
706
+
707
+ <div class="flex items-start">
708
+ <div class="bg-saffron/10 p-3 rounded-full mr-4 border border-saffron/30">
709
+ <i class="fas fa-envelope text-saffron"></i>
710
+ </div>
711
+ <div>
712
+ <h4 class="font-semibold mb-1 text-indigo dark:text-saffron">Email</h4>
713
+ <p class="text-gray-700 dark:text-ivory/90">manideepreddy.work@gmail.com</p>
714
+ </div>
715
+ </div>
716
+
717
+ <div class="flex items-start">
718
+ <div class="bg-saffron/10 p-3 rounded-full mr-4 border border-saffron/30">
719
+ <i class="fas fa-phone-alt text-saffron"></i>
720
+ </div>
721
+ <div>
722
+ <h4 class="font-semibold mb-1 text-indigo dark:text-saffron">Phone</h4>
723
+ <p class="text-gray-700 dark:text-ivory/90">(415)-902-1124</p>
724
+ </div>
725
+ </div>
726
+
727
+ <div class="flex items-start">
728
+ <div class="bg-saffron/10 p-3 rounded-full mr-4 border border-saffron/30">
729
+ <i class="fas fa-link text-saffron"></i>
730
+ </div>
731
+ <div>
732
+ <h4 class="font-semibold mb-1 text-indigo dark:text-saffron">Links</h4>
733
+ <div class="flex space-x-4">
734
+ <a href="https://linkedin.com/in/manideep-reddy" target="_blank" class="text-gray-700 dark:text-ivory/90 hover:text-saffron transition">
735
+ <i class="fab fa-linkedin-in text-xl"></i>
736
+ </a>
737
+ <a href="https://github.com/manideepreddym" target="_blank" class="text-gray-700 dark:text-ivory/90 hover:text-saffron transition">
738
+ <i class="fab fa-github text-xl"></i>
739
+ </a>
740
+ <a href="#" class="text-gray-700 dark:text-ivory/90 hover:text-saffron transition">
741
+ <i class="fas fa-globe text-xl"></i>
742
+ </a>
743
+ </div>
744
+ </div>
745
+ </div>
746
+ </div>
747
+ </div>
748
+ </div>
749
+ </div>
750
+ </div>
751
+ </section>
752
+
753
+ <!-- Footer - Like the End of an Era -->
754
+ <footer class="bg-indigo text-ivory py-12">
755
+ <div class="container mx-auto px-6">
756
+ <div class="flex flex-col md:flex-row justify-between items-center">
757
+ <div class="mb-6 md:mb-0 text-center md:text-left">
758
+ <a href="#home" class="text-2xl font-bold flex items-center justify-center md:justify-start sanskrit-text">
759
+ <span class="mr-2">मणिदीप</span>
760
+ <i class="fas fa-database text-sm text-saffron"></i>
761
+ </a>
762
+ <p class="mt-2 text-ivory/70">© 2024 Manideep Reddy. All rights reserved.</p>
763
+ </div>
764
+
765
+ <div class="flex flex-col md:flex-row md:space-x-8 space-y-4 md:space-y-0">
766
+ <a href="#home" class="hover:text-saffron transition">Home</a>
767
+ <a href="#experience" class="hover:text-saffron transition">Experience</a>
768
+ <a href="#skills" class="hover:text-saffron transition">Skills</a>
769
+ <a href="#education" class="hover:text-saffron transition">Education</a>
770
+ <a href="#contact" class="hover:text-saffron transition">Contact</a>
771
+ </div>
772
+ </div>
773
+
774
+ <div class="border-t border-ivory/20 mt-8 pt-8 text-center">
775
+ <p class="sanskrit-text text-xl text-saffron mb-2">यत्र योगेश्वरः कृष्णो यत्र पार्थो धनुर्धरः।</p>
776
+ <p class="text-ivory/70">"Where there is Dharma, there is victory"</p>
777
+ </div>
778
+ </div>
779
+ </footer>
780
+
781
+ <!-- Back to Top Button - Like Arjuna's Arrow -->
782
+ <button id="back-to-top" class="fixed bottom-8 right-8 w-12 h-12 bg-saffron text-indigo rounded-full shadow-lg hidden items-center justify-center transition-all hover:scale-110 hover:shadow-xl">
783
+ <i class="fas fa-arrow-up"></i>
784
+ </button>
785
+
786
+ <script>
787
+ // Mobile menu toggle
788
+ const mobileMenuButton = document.getElementById('mobile-menu-button');
789
+ const mobileMenu = document.getElementById('mobile-menu');
790
+
791
+ mobileMenuButton.addEventListener('click', () => {
792
+ mobileMenu.classList.toggle('hidden');
793
+ });
794
+
795
+ // Theme toggle
796
+ const themeToggle = document.getElementById('theme-toggle');
797
+ const html = document.documentElement;
798
+
799
+ // Check for saved user preference, if any, on load of the website
800
+ if (localStorage.getItem('theme') === 'dark' || (!localStorage.getItem('theme') && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
801
+ html.classList.add('dark');
802
+ } else {
803
+ html.classList.remove('dark');
804
+ }
805
+
806
+ themeToggle.addEventListener('click', () => {
807
+ html.classList.toggle('dark');
808
+ localStorage.setItem('theme', html.classList.contains('dark') ? 'dark' : 'light');
809
+ });
810
+
811
+ // Back to top button
812
+ const backToTopButton = document.getElementById('back-to-top');
813
+
814
+ window.addEventListener('scroll', () => {
815
+ if (window.pageYOffset > 300) {
816
+ backToTopButton.classList.remove('hidden');
817
+ backToTopButton.classList.add('flex');
818
+ } else {
819
+ backToTopButton.classList.add('hidden');
820
+ backToTopButton.classList.remove('flex');
821
+ }
822
+ });
823
+
824
+ backToTopButton.addEventListener('click', () => {
825
+ window.scrollTo({ top: 0, behavior: 'smooth' });
826
+ });
827
+
828
+ // Highlight active nav link
829
+ const sections = document.querySelectorAll('section');
830
+ const navLinks = document.querySelectorAll('.nav-link, #mobile-menu a');
831
+
832
+ window.addEventListener('scroll', () => {
833
+ let current = '';
834
+
835
+ sections.forEach(section => {
836
+ const sectionTop = section.offsetTop;
837
+ const sectionHeight = section.clientHeight;
838
+
839
+ if (pageYOffset >= sectionTop - 300) {
840
+ current = section.getAttribute('id');
841
+ }
842
+ });
843
+
844
+ navLinks.forEach(link => {
845
+ link.classList.remove('active');
846
+ if (link.getAttribute('href') === `#${current}`) {
847
+ link.classList.add('active');
848
+ }
849
+ });
850
+ });
851
+
852
+ // Smooth scrolling for anchor links
853
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
854
+ anchor.addEventListener('click', function(e) {
855
+ e.preventDefault();
856
+
857
+ const targetId = this.getAttribute('href');
858
+ const targetElement = document.querySelector(targetId);
859
+
860
+ if (targetElement) {
861
+ window.scrollTo({
862
+ top: targetElement.offsetTop - 80,
863
+ behavior: 'smooth'
864
+ });
865
+
866
+ // Close mobile menu if open
867
+ if (!mobileMenu.classList.contains('hidden')) {
868
+ mobileMenu.classList.add('hidden');
869
+ }
870
+ }
871
+ });
872
+ });
873
+ </script>
874
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - <a href="https://enzostvs-deepsite.hf.space?remix=manideepreddym/maniportfolio" style="color: #fff;text-decoration: underline;" target="_blank" >🧬 Remix</a></p></body>
875
+ </html>