Sangeethvr commited on
Commit
c39c00b
·
verified ·
1 Parent(s): 3600015

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +977 -19
  3. prompts.txt +1 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Techcom
3
- emoji: 🏃
4
- colorFrom: pink
5
- colorTo: yellow
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: techcom
3
+ emoji: 🐳
4
+ colorFrom: red
5
+ colorTo: purple
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,977 @@
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">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>TN TechConnect - Platform for Tamil Nadu Engineering Professionals</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
+ <style>
10
+ .gradient-bg {
11
+ background: linear-gradient(135deg, #1e3a8a 0%, #1e40af 50%, #1d4ed8 100%);
12
+ }
13
+ .card-hover:hover {
14
+ transform: translateY(-5px);
15
+ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
16
+ }
17
+ .podcast-wave {
18
+ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 320'%3E%3Cpath fill='%23f8fafc' fill-opacity='1' d='M0,256L48,261.3C96,267,192,277,288,261.3C384,245,480,203,576,197.3C672,192,768,224,864,234.7C960,245,1056,235,1152,213.3C1248,192,1344,160,1392,144L1440,128L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z'%3E%3C/path%3E%3C/svg%3E");
19
+ background-repeat: no-repeat;
20
+ background-position: bottom;
21
+ background-size: cover;
22
+ }
23
+ .testimonial-card {
24
+ background: rgba(255, 255, 255, 0.1);
25
+ backdrop-filter: blur(10px);
26
+ border: 1px solid rgba(255, 255, 255, 0.2);
27
+ }
28
+ .animated-underline {
29
+ position: relative;
30
+ display: inline-block;
31
+ }
32
+ .animated-underline::after {
33
+ content: '';
34
+ position: absolute;
35
+ width: 100%;
36
+ transform: scaleX(0);
37
+ height: 2px;
38
+ bottom: 0;
39
+ left: 0;
40
+ background-color: white;
41
+ transform-origin: bottom right;
42
+ transition: transform 0.25s ease-out;
43
+ }
44
+ .animated-underline:hover::after {
45
+ transform: scaleX(1);
46
+ transform-origin: bottom left;
47
+ }
48
+ </style>
49
+ </head>
50
+ <body class="bg-gray-50 font-sans">
51
+ <!-- Navigation -->
52
+ <nav class="gradient-bg text-white shadow-lg sticky top-0 z-50">
53
+ <div class="container mx-auto px-6 py-4">
54
+ <div class="flex justify-between items-center">
55
+ <div class="flex items-center space-x-4">
56
+ <div class="flex items-center">
57
+ <i class="fas fa-microchip text-3xl mr-2"></i>
58
+ <span class="text-xl font-bold">TN TechConnect</span>
59
+ </div>
60
+ </div>
61
+ <div class="hidden md:flex items-center space-x-8">
62
+ <a href="#home" class="animated-underline">Home</a>
63
+ <a href="#internships" class="animated-underline">Internships</a>
64
+ <a href="#conferences" class="animated-underline">Tech Events</a>
65
+ <a href="#research" class="animated-underline">Research</a>
66
+ <a href="#community" class="animated-underline">Community</a>
67
+ <a href="#podcasts" class="animated-underline">Podcasts</a>
68
+ </div>
69
+ <div class="md:hidden">
70
+ <button class="mobile-menu-button p-2 focus:outline-none">
71
+ <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
72
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path>
73
+ </svg>
74
+ </button>
75
+ </div>
76
+ </div>
77
+ </div>
78
+ <!-- Mobile menu -->
79
+ <div class="mobile-menu hidden md:hidden gradient-bg pb-4">
80
+ <a href="#home" class="block py-2 px-4 hover:bg-blue-700">Home</a>
81
+ <a href="#internships" class="block py-2 px-4 hover:bg-blue-700">Internships</a>
82
+ <a href="#conferences" class="block py-2 px-4 hover:bg-blue-700">Tech Events</a>
83
+ <a href="#research" class="block py-2 px-4 hover:bg-blue-700">Research</a>
84
+ <a href="#community" class="block py-2 px-4 hover:bg-blue-700">Community</a>
85
+ <a href="#podcasts" class="block py-2 px-4 hover:bg-blue-700">Podcasts</a>
86
+ </div>
87
+ </nav>
88
+
89
+ <!-- Hero Section -->
90
+ <section id="home" class="gradient-bg text-white py-20">
91
+ <div class="container mx-auto px-6 flex flex-col md:flex-row items-center">
92
+ <div class="md:w-1/2 mb-10 md:mb-0">
93
+ <h1 class="text-4xl md:text-5xl font-bold leading-tight mb-4">Connecting Tamil Nadu's Engineers to Global Tech Opportunities</h1>
94
+ <p class="text-xl mb-8">Your premier platform for tech internships, international opportunities, conferences, and collaborative projects.</p>
95
+ <div class="flex flex-wrap gap-4">
96
+ <a href="#internships" class="bg-white text-blue-800 hover:bg-gray-100 px-6 py-3 rounded-lg font-semibold transition duration-300">Explore Internships</a>
97
+ <a href="#community" class="border border-white text-white hover:bg-white hover:text-blue-800 px-6 py-3 rounded-lg font-semibold transition duration-300">Join Community</a>
98
+ </div>
99
+ </div>
100
+ <div class="md:w-1/2 flex justify-center">
101
+ <img src="https://images.unsplash.com/photo-1622675363311-3e1904dc1885?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Engineering Professionals" class="rounded-lg shadow-2xl max-w-md w-full">
102
+ </div>
103
+ </div>
104
+ </section>
105
+
106
+ <!-- Stats Section -->
107
+ <section class="bg-white py-12">
108
+ <div class="container mx-auto px-6">
109
+ <div class="grid grid-cols-2 md:grid-cols-4 gap-8 text-center">
110
+ <div class="p-4">
111
+ <div class="text-4xl font-bold text-blue-800 mb-2">300+</div>
112
+ <div class="text-gray-600">Tech Internships</div>
113
+ </div>
114
+ <div class="p-4">
115
+ <div class="text-4xl font-bold text-blue-800 mb-2">80+</div>
116
+ <div class="text-gray-600">Upcoming Tech Events</div>
117
+ </div>
118
+ <div class="p-4">
119
+ <div class="text-4xl font-bold text-blue-800 mb-2">1000+</div>
120
+ <div class="text-gray-600">Active Members</div>
121
+ </div>
122
+ <div class="p-4">
123
+ <div class="text-4xl font-bold text-blue-800 mb-2">120+</div>
124
+ <div class="text-gray-600">Research Papers</div>
125
+ </div>
126
+ </div>
127
+ </div>
128
+ </section>
129
+
130
+ <!-- Internships Section -->
131
+ <section id="internships" class="py-20 bg-gray-50">
132
+ <div class="container mx-auto px-6">
133
+ <div class="text-center mb-16">
134
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Global Internship Opportunities</h2>
135
+ <p class="text-xl text-gray-600 max-w-3xl mx-auto">Discover prestigious internship programs at top tech companies with experiences from TN engineers.</p>
136
+ </div>
137
+
138
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
139
+ <!-- Internship Card 1 -->
140
+ <div class="bg-white rounded-xl shadow-md overflow-hidden transition duration-300 card-hover">
141
+ <div class="h-48 bg-blue-100 flex items-center justify-center">
142
+ <i class="fas fa-robot text-6xl text-blue-600"></i>
143
+ </div>
144
+ <div class="p-6">
145
+ <div class="uppercase tracking-wide text-sm font-semibold text-blue-600">USA • 6 Months</div>
146
+ <h3 class="mt-2 text-xl font-semibold text-gray-800">AI Research Intern</h3>
147
+ <p class="mt-2 text-gray-600">Work on cutting-edge AI projects at Google's Mountain View campus with mentorship from top researchers.</p>
148
+ <div class="mt-4 flex items-center">
149
+ <div class="flex-shrink-0">
150
+ <img class="h-10 w-10 rounded-full" src="https://randomuser.me/api/portraits/women/42.jpg" alt="Priya">
151
+ </div>
152
+ <div class="ml-3">
153
+ <p class="text-sm font-medium text-gray-900">Priya, Chennai</p>
154
+ <p class="text-sm text-gray-500">Completed 2022</p>
155
+ </div>
156
+ </div>
157
+ <button class="mt-4 w-full bg-blue-600 hover:bg-blue-700 text-white py-2 px-4 rounded-lg transition duration-300">
158
+ View Details & Experiences
159
+ </button>
160
+ </div>
161
+ </div>
162
+
163
+ <!-- Internship Card 2 -->
164
+ <div class="bg-white rounded-xl shadow-md overflow-hidden transition duration-300 card-hover">
165
+ <div class="h-48 bg-green-100 flex items-center justify-center">
166
+ <i class="fas fa-code text-6xl text-green-600"></i>
167
+ </div>
168
+ <div class="p-6">
169
+ <div class="uppercase tracking-wide text-sm font-semibold text-green-600">Germany • 1 Year</div>
170
+ <h3 class="mt-2 text-xl font-semibold text-gray-800">Software Engineering Intern</h3>
171
+ <p class="mt-2 text-gray-600">Develop scalable systems at SAP's Berlin office with exposure to enterprise software development.</p>
172
+ <div class="mt-4 flex items-center">
173
+ <div class="flex-shrink-0">
174
+ <img class="h-10 w-10 rounded-full" src="https://randomuser.me/api/portraits/men/32.jpg" alt="Arjun">
175
+ </div>
176
+ <div class="ml-3">
177
+ <p class="text-sm font-medium text-gray-900">Arjun, Coimbatore</p>
178
+ <p class="text-sm text-gray-500">Completed 2021</p>
179
+ </div>
180
+ </div>
181
+ <button class="mt-4 w-full bg-green-600 hover:bg-green-700 text-white py-2 px-4 rounded-lg transition duration-300">
182
+ View Details & Experiences
183
+ </button>
184
+ </div>
185
+ </div>
186
+
187
+ <!-- Internship Card 3 -->
188
+ <div class="bg-white rounded-xl shadow-md overflow-hidden transition duration-300 card-hover">
189
+ <div class="h-48 bg-purple-100 flex items-center justify-center">
190
+ <i class="fas fa-bolt text-6xl text-purple-600"></i>
191
+ </div>
192
+ <div class="p-6">
193
+ <div class="uppercase tracking-wide text-sm font-semibold text-purple-600">Singapore • 8 Months</div>
194
+ <h3 class="mt-2 text-xl font-semibold text-gray-800">Hardware Engineering Intern</h3>
195
+ <p class="mt-2 text-gray-600">Work on next-gen semiconductor designs at TSMC's Singapore facility with industry experts.</p>
196
+ <div class="mt-4 flex items-center">
197
+ <div class="flex-shrink-0">
198
+ <img class="h-10 w-10 rounded-full" src="https://randomuser.me/api/portraits/women/68.jpg" alt="Meena">
199
+ </div>
200
+ <div class="ml-3">
201
+ <p class="text-sm font-medium text-gray-900">Meena, Madurai</p>
202
+ <p class="text-sm text-gray-500">Completed 2023</p>
203
+ </div>
204
+ </div>
205
+ <button class="mt-4 w-full bg-purple-600 hover:bg-purple-700 text-white py-2 px-4 rounded-lg transition duration-300">
206
+ View Details & Experiences
207
+ </button>
208
+ </div>
209
+ </div>
210
+ </div>
211
+
212
+ <div class="text-center mt-12">
213
+ <a href="#" class="inline-block bg-blue-800 hover:bg-blue-900 text-white px-6 py-3 rounded-lg font-semibold transition duration-300">
214
+ View All Internship Programs <i class="fas fa-arrow-right ml-2"></i>
215
+ </a>
216
+ </div>
217
+ </div>
218
+ </section>
219
+
220
+ <!-- Tech Events Section -->
221
+ <section id="conferences" class="py-20 bg-white">
222
+ <div class="container mx-auto px-6">
223
+ <div class="text-center mb-16">
224
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Upcoming Tech Events & Hackathons</h2>
225
+ <p class="text-xl text-gray-600 max-w-3xl mx-auto">Stay updated with the latest tech conferences, workshops, and competitions in your field.</p>
226
+ </div>
227
+
228
+ <div class="flex flex-wrap justify-center mb-8">
229
+ <button class="px-4 py-2 m-1 bg-blue-600 text-white rounded-full">All</button>
230
+ <button class="px-4 py-2 m-1 bg-gray-200 hover:bg-gray-300 rounded-full">AI/ML</button>
231
+ <button class="px-4 py-2 m-1 bg-gray-200 hover:bg-gray-300 rounded-full">Web Dev</button>
232
+ <button class="px-4 py-2 m-1 bg-gray-200 hover:bg-gray-300 rounded-full">IoT</button>
233
+ <button class="px-4 py-2 m-1 bg-gray-200 hover:bg-gray-300 rounded-full">Cybersecurity</button>
234
+ <button class="px-4 py-2 m-1 bg-gray-200 hover:bg-gray-300 rounded-full">Blockchain</button>
235
+ </div>
236
+
237
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
238
+ <!-- Event 1 -->
239
+ <div class="bg-gray-50 rounded-xl shadow-md overflow-hidden transition duration-300 card-hover">
240
+ <div class="p-6">
241
+ <div class="flex justify-between items-start">
242
+ <div>
243
+ <span class="inline-block px-3 py-1 text-sm font-semibold text-blue-800 bg-blue-100 rounded-full">AI/ML</span>
244
+ <h3 class="mt-3 text-xl font-semibold text-gray-800">AI Summit Chennai 2023</h3>
245
+ <p class="mt-2 text-gray-600">November 15-18, 2023 • Chennai, India</p>
246
+ </div>
247
+ <div class="text-right">
248
+ <div class="text-2xl font-bold text-blue-800">₹2,999</div>
249
+ <div class="text-sm text-gray-500">Early Bird</div>
250
+ </div>
251
+ </div>
252
+ <p class="mt-4 text-gray-700">Premier event for AI professionals featuring cutting-edge research and innovative applications from industry leaders.</p>
253
+ <div class="mt-6 flex justify-between items-center">
254
+ <div class="flex items-center">
255
+ <i class="fas fa-users text-gray-500 mr-2"></i>
256
+ <span class="text-sm text-gray-600">800+ attendees</span>
257
+ </div>
258
+ <button class="text-blue-600 hover:text-blue-800 font-medium">
259
+ Register Now <i class="fas fa-arrow-right ml-1"></i>
260
+ </button>
261
+ </div>
262
+ </div>
263
+ </div>
264
+
265
+ <!-- Event 2 -->
266
+ <div class="bg-gray-50 rounded-xl shadow-md overflow-hidden transition duration-300 card-hover">
267
+ <div class="p-6">
268
+ <div class="flex justify-between items-start">
269
+ <div>
270
+ <span class="inline-block px-3 py-1 text-sm font-semibold text-green-800 bg-green-100 rounded-full">Web Dev</span>
271
+ <h3 class="mt-3 text-xl font-semibold text-gray-800">React Conf India</h3>
272
+ <p class="mt-2 text-gray-600">February 7-9, 2024 • Bangalore, India</p>
273
+ </div>
274
+ <div class="text-right">
275
+ <div class="text-2xl font-bold text-green-800">₹3,500</div>
276
+ <div class="text-sm text-gray-500">Standard</div>
277
+ </div>
278
+ </div>
279
+ <p class="mt-4 text-gray-700">Learn from React core team members and industry experts about the future of frontend development.</p>
280
+ <div class="mt-6 flex justify-between items-center">
281
+ <div class="flex items-center">
282
+ <i class="fas fa-users text-gray-500 mr-2"></i>
283
+ <span class="text-sm text-gray-600">500+ attendees</span>
284
+ </div>
285
+ <button class="text-green-600 hover:text-green-800 font-medium">
286
+ Register Now <i class="fas fa-arrow-right ml-1"></i>
287
+ </button>
288
+ </div>
289
+ </div>
290
+ </div>
291
+
292
+ <!-- Event 3 -->
293
+ <div class="bg-gray-50 rounded-xl shadow-md overflow-hidden transition duration-300 card-hover">
294
+ <div class="p-6">
295
+ <div class="flex justify-between items-start">
296
+ <div>
297
+ <span class="inline-block px-3 py-1 text-sm font-semibold text-purple-800 bg-purple-100 rounded-full">Blockchain</span>
298
+ <h3 class="mt-3 text-xl font-semibold text-gray-800">ETHGlobal Chennai</h3>
299
+ <p class="mt-2 text-gray-600">December 1-3, 2023 • Chennai, India</p>
300
+ </div>
301
+ <div class="text-right">
302
+ <div class="text-2xl font-bold text-purple-800">Free</div>
303
+ <div class="text-sm text-gray-500">Hackathon</div>
304
+ </div>
305
+ </div>
306
+ <p class="mt-4 text-gray-700">48-hour blockchain hackathon with $50k in prizes and mentorship from Ethereum core developers.</p>
307
+ <div class="mt-6 flex justify-between items-center">
308
+ <div class="flex items-center">
309
+ <i class="fas fa-users text-gray-500 mr-2"></i>
310
+ <span class="text-sm text-gray-600">300+ participants</span>
311
+ </div>
312
+ <button class="text-purple-600 hover:text-purple-800 font-medium">
313
+ Apply Now <i class="fas fa-arrow-right ml-1"></i>
314
+ </button>
315
+ </div>
316
+ </div>
317
+ </div>
318
+ </div>
319
+
320
+ <div class="text-center mt-12">
321
+ <a href="#" class="inline-block bg-blue-800 hover:bg-blue-900 text-white px-6 py-3 rounded-lg font-semibold transition duration-300">
322
+ View All Tech Events <i class="fas fa-arrow-right ml-2"></i>
323
+ </a>
324
+ </div>
325
+ </div>
326
+ </section>
327
+
328
+ <!-- Research Section -->
329
+ <section id="research" class="py-20 bg-gray-50">
330
+ <div class="container mx-auto px-6">
331
+ <div class="text-center mb-16">
332
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Engineering Research & Publications</h2>
333
+ <p class="text-xl text-gray-600 max-w-3xl mx-auto">Showcasing groundbreaking research by Tamil Nadu engineering professionals.</p>
334
+ </div>
335
+
336
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-8 mb-12">
337
+ <!-- Featured Research -->
338
+ <div class="bg-white p-8 rounded-xl shadow-lg">
339
+ <div class="flex items-center mb-4">
340
+ <span class="inline-block px-3 py-1 text-sm font-semibold text-blue-800 bg-blue-100 rounded-full">Featured</span>
341
+ <span class="ml-3 text-sm text-gray-500">Published: June 2023</span>
342
+ </div>
343
+ <h3 class="text-2xl font-bold text-gray-800 mb-3">Novel AI Architecture for Tamil Language Processing</h3>
344
+ <p class="text-gray-700 mb-4">This research from Anna University presents a breakthrough neural network design specifically optimized for Tamil NLP tasks with 98% accuracy.</p>
345
+ <div class="flex items-center">
346
+ <div class="flex-shrink-0">
347
+ <img class="h-10 w-10 rounded-full" src="https://randomuser.me/api/portraits/men/75.jpg" alt="Dr. Karthik">
348
+ </div>
349
+ <div class="ml-3">
350
+ <p class="text-sm font-medium text-gray-900">Dr. Karthik, et al.</p>
351
+ <p class="text-sm text-gray-500">Nature Machine Intelligence (Impact Factor: 15.5)</p>
352
+ </div>
353
+ </div>
354
+ <div class="mt-6 flex justify-between items-center">
355
+ <div class="flex space-x-4">
356
+ <span class="text-sm text-gray-600"><i class="fas fa-download mr-1"></i> 524 Downloads</span>
357
+ <span class="text-sm text-gray-600"><i class="fas fa-quote-right mr-1"></i> 38 Citations</span>
358
+ </div>
359
+ <a href="#" class="text-blue-600 hover:text-blue-800 font-medium">
360
+ Read Full Paper <i class="fas fa-arrow-right ml-1"></i>
361
+ </a>
362
+ </div>
363
+ </div>
364
+
365
+ <!-- Research Opportunities -->
366
+ <div class="bg-blue-800 text-white p-8 rounded-xl shadow-lg">
367
+ <h3 class="text-2xl font-bold mb-4">Research Collaboration Opportunities</h3>
368
+ <p class="mb-6">Connect with international researchers and tech companies for collaborative projects. Find funding opportunities and research positions.</p>
369
+ <div class="space-y-4">
370
+ <div class="flex items-start">
371
+ <div class="flex-shrink-0 mt-1">
372
+ <i class="fas fa-microchip text-blue-300"></i>
373
+ </div>
374
+ <div class="ml-3">
375
+ <h4 class="font-semibold">Google Research India</h4>
376
+ <p class="text-blue-200 text-sm">Looking for collaborators in AI for social good projects</p>
377
+ </div>
378
+ </div>
379
+ <div class="flex items-start">
380
+ <div class="flex-shrink-0 mt-1">
381
+ <i class="fas fa-atom text-blue-300"></i>
382
+ </div>
383
+ <div class="ml-3">
384
+ <h4 class="font-semibold">MIT-Tamil Nadu Initiative</h4>
385
+ <p class="text-blue-200 text-sm">Grants available for sustainable technology research</p>
386
+ </div>
387
+ </div>
388
+ <div class="flex items-start">
389
+ <div class="flex-shrink-0 mt-1">
390
+ <i class="fas fa-brain text-blue-300"></i>
391
+ </div>
392
+ <div class="ml-3">
393
+ <h4 class="font-semibold">DeepMind Research</h4>
394
+ <p class="text-blue-200 text-sm">PhD positions in reinforcement learning at Cambridge</p>
395
+ </div>
396
+ </div>
397
+ </div>
398
+ <button class="mt-6 w-full bg-white hover:bg-gray-100 text-blue-800 py-2 px-4 rounded-lg font-medium transition duration-300">
399
+ Explore Research Opportunities
400
+ </button>
401
+ </div>
402
+ </div>
403
+
404
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
405
+ <!-- Research Card 1 -->
406
+ <div class="bg-white rounded-lg shadow-md overflow-hidden transition duration-300 card-hover">
407
+ <div class="p-6">
408
+ <span class="inline-block px-2 py-1 text-xs font-semibold text-green-800 bg-green-100 rounded-full">Renewable Energy</span>
409
+ <h3 class="mt-2 text-lg font-semibold text-gray-800">Solar Panel Efficiency Breakthrough</h3>
410
+ <p class="mt-2 text-sm text-gray-600">New perovskite solar cell design achieves 32% efficiency in testing at IIT Madras labs.</p>
411
+ <div class="mt-4 flex justify-between items-center">
412
+ <span class="text-xs text-gray-500">Dr. Anitha et al. • Science Advances</span>
413
+ <a href="#" class="text-green-600 hover:text-green-800 text-sm font-medium">
414
+ View <i class="fas fa-arrow-right ml-1"></i>
415
+ </a>
416
+ </div>
417
+ </div>
418
+ </div>
419
+
420
+ <!-- Research Card 2 -->
421
+ <div class="bg-white rounded-lg shadow-md overflow-hidden transition duration-300 card-hover">
422
+ <div class="p-6">
423
+ <span class="inline-block px-2 py-1 text-xs font-semibold text-purple-800 bg-purple-100 rounded-full">AI/ML</span>
424
+ <h3 class="mt-2 text-lg font-semibold text-gray-800">Federated Learning for Healthcare</h3>
425
+ <p class="mt-2 text-sm text-gray-600">Privacy-preserving AI model trained across multiple Tamil Nadu hospitals without data sharing.</p>
426
+ <div class="mt-4 flex justify-between items-center">
427
+ <span class="text-xs text-gray-500">Dr. Rajesh et al. • Nature Digital Medicine</span>
428
+ <a href="#" class="text-purple-600 hover:text-purple-800 text-sm font-medium">
429
+ View <i class="fas fa-arrow-right ml-1"></i>
430
+ </a>
431
+ </div>
432
+ </div>
433
+ </div>
434
+
435
+ <!-- Research Card 3 -->
436
+ <div class="bg-white rounded-lg shadow-md overflow-hidden transition duration-300 card-hover">
437
+ <div class="p-6">
438
+ <span class="inline-block px-2 py-1 text-xs font-semibold text-red-800 bg-red-100 rounded-full">Materials Science</span>
439
+ <h3 class="mt-2 text-lg font-semibold text-gray-800">Graphene Production Innovation</h3>
440
+ <p class="mt-2 text-sm text-gray-600">Low-cost method for mass production of graphene developed at PSG Tech with commercial applications.</p>
441
+ <div class="mt-4 flex justify-between items-center">
442
+ <span class="text-xs text-gray-500">Dr. Malar et al. • Advanced Materials</span>
443
+ <a href="#" class="text-red-600 hover:text-red-800 text-sm font-medium">
444
+ View <i class="fas fa-arrow-right ml-1"></i>
445
+ </a>
446
+ </div>
447
+ </div>
448
+ </div>
449
+ </div>
450
+
451
+ <div class="text-center mt-12">
452
+ <a href="#" class="inline-block bg-blue-800 hover:bg-blue-900 text-white px-6 py-3 rounded-lg font-semibold transition duration-300">
453
+ Browse All Publications <i class="fas fa-arrow-right ml-2"></i>
454
+ </a>
455
+ </div>
456
+ </div>
457
+ </section>
458
+
459
+ <!-- Community Section -->
460
+ <section id="community" class="py-20 bg-white">
461
+ <div class="container mx-auto px-6">
462
+ <div class="text-center mb-16">
463
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Tech Community Network</h2>
464
+ <p class="text-xl text-gray-600 max-w-3xl mx-auto">Connect with fellow TN engineering professionals, share experiences, and get mentorship.</p>
465
+ </div>
466
+
467
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-12">
468
+ <!-- Discussion Forum -->
469
+ <div>
470
+ <h3 class="text-2xl font-semibold text-gray-800 mb-6">Discussion Forums</h3>
471
+ <div class="space-y-6">
472
+ <!-- Forum Topic 1 -->
473
+ <div class="bg-gray-50 p-6 rounded-lg shadow-sm">
474
+ <div class="flex justify-between items-start">
475
+ <div>
476
+ <span class="inline-block px-2 py-1 text-xs font-semibold text-blue-800 bg-blue-100 rounded-full">Internship</span>
477
+ <h4 class="mt-2 font-medium text-gray-800">Google Summer Internship - Application Tips</h4>
478
+ </div>
479
+ <span class="text-xs text-gray-500">2h ago</span>
480
+ </div>
481
+ <p class="mt-3 text-sm text-gray-600">Sharing my experience applying to Google STEP internship including resume tips and technical interview preparation.</p>
482
+ <div class="mt-4 flex justify-between items-center">
483
+ <div class="flex items-center space-x-4">
484
+ <div class="flex items-center">
485
+ <i class="fas fa-comment-alt text-gray-400 mr-1"></i>
486
+ <span class="text-xs text-gray-600">24 comments</span>
487
+ </div>
488
+ <div class="flex items-center">
489
+ <i class="fas fa-eye text-gray-400 mr-1"></i>
490
+ <span class="text-xs text-gray-600">356 views</span>
491
+ </div>
492
+ </div>
493
+ <div class="flex-shrink-0">
494
+ <img class="h-8 w-8 rounded-full" src="https://randomuser.me/api/portraits/men/22.jpg" alt="Suresh">
495
+ </div>
496
+ </div>
497
+ </div>
498
+
499
+ <!-- Forum Topic 2 -->
500
+ <div class="bg-gray-50 p-6 rounded-lg shadow-sm">
501
+ <div class="flex justify-between items-start">
502
+ <div>
503
+ <span class="inline-block px-2 py-1 text-xs font-semibold text-green-800 bg-green-100 rounded-full">Career</span>
504
+ <h4 class="mt-2 font-medium text-gray-800">Transitioning from Service to Product Companies</h4>
505
+ </div>
506
+ <span class="text-xs text-gray-500">1d ago</span>
507
+ </div>
508
+ <p class="mt-3 text-sm text-gray-600">How I moved from TCS to a product startup in 6 months - skills to learn and interview strategies that worked.</p>
509
+ <div class="mt-4 flex justify-between items-center">
510
+ <div class="flex items-center space-x-4">
511
+ <div class="flex items-center">
512
+ <i class="fas fa-comment-alt text-gray-400 mr-1"></i>
513
+ <span class="text-xs text-gray-600">18 comments</span>
514
+ </div>
515
+ <div class="flex items-center">
516
+ <i class="fas fa-eye text-gray-400 mr-1"></i>
517
+ <span class="text-xs text-gray-600">289 views</span>
518
+ </div>
519
+ </div>
520
+ <div class="flex-shrink-0">
521
+ <img class="h-8 w-8 rounded-full" src="https://randomuser.me/api/portraits/women/33.jpg" alt="Lakshmi">
522
+ </div>
523
+ </div>
524
+ </div>
525
+
526
+ <!-- Forum Topic 3 -->
527
+ <div class="bg-gray-50 p-6 rounded-lg shadow-sm">
528
+ <div class="flex justify-between items-start">
529
+ <div>
530
+ <span class="inline-block px-2 py-1 text-xs font-semibold text-purple-800 bg-purple-100 rounded-full">Research</span>
531
+ <h4 class="mt-2 font-medium text-gray-800">Seeking Collaborators for AI in Agriculture Project</h4>
532
+ </div>
533
+ <span class="text-xs text-gray-500">3d ago</span>
534
+ </div>
535
+ <p class="mt-3 text-sm text-gray-600">Looking for ML engineers and agri-tech specialists across TN to participate in DST-funded research on crop yield prediction.</p>
536
+ <div class="mt-4 flex justify-between items-center">
537
+ <div class="flex items-center space-x-4">
538
+ <div class="flex items-center">
539
+ <i class="fas fa-comment-alt text-gray-400 mr-1"></i>
540
+ <span class="text-xs text-gray-600">15 comments</span>
541
+ </div>
542
+ <div class="flex items-center">
543
+ <i class="fas fa-eye text-gray-400 mr-1"></i>
544
+ <span class="text-xs text-gray-600">247 views</span>
545
+ </div>
546
+ </div>
547
+ <div class="flex-shrink-0">
548
+ <img class="h-8 w-8 rounded-full" src="https://randomuser.me/api/portraits/men/45.jpg" alt="Karthik">
549
+ </div>
550
+ </div>
551
+ </div>
552
+ </div>
553
+ <button class="mt-6 w-full bg-blue-600 hover:bg-blue-700 text-white py-2 px-4 rounded-lg font-medium transition duration-300">
554
+ Join Discussion Forum
555
+ </button>
556
+ </div>
557
+
558
+ <!-- Mentorship Program -->
559
+ <div>
560
+ <h3 class="text-2xl font-semibold text-gray-800 mb-6">Mentorship Program</h3>
561
+ <div class="bg-blue-50 p-6 rounded-lg mb-8">
562
+ <h4 class="text-lg font-semibold text-blue-800 mb-3">Connect with Experienced Professionals</h4>
563
+ <p class="text-gray-700 mb-4">Our mentorship program pairs early-career engineers with senior professionals at top tech companies.</p>
564
+ <div class="space-y-4">
565
+ <div class="flex items-start">
566
+ <div class="flex-shrink-0 mt-1">
567
+ <i class="fas fa-laptop-code text-blue-600"></i>
568
+ </div>
569
+ <div class="ml-3">
570
+ <h4 class="font-medium text-gray-800">One-on-One Guidance</h4>
571
+ <p class="text-sm text-gray-600">Personalized advice on career growth, technical skills, and interview preparation.</p>
572
+ </div>
573
+ </div>
574
+ <div class="flex items-start">
575
+ <div class="flex-shrink-0 mt-1">
576
+ <i class="fas fa-globe-americas text-blue-600"></i>
577
+ </div>
578
+ <div class="ml-3">
579
+ <h4 class="font-medium text-gray-800">Global Network</h4>
580
+ <p class="text-sm text-gray-600">Access to mentors working at FAANG companies and top startups worldwide.</p>
581
+ </div>
582
+ </div>
583
+ <div class="flex items-start">
584
+ <div class="flex-shrink-0 mt-1">
585
+ <i class="fas fa-handshake text-blue-600"></i>
586
+ </div>
587
+ <div class="ml-3">
588
+ <h4 class="font-medium text-gray-800">Specialty Matching</h4>
589
+ <p class="text-sm text-gray-600">Get matched with mentors in your specific tech domain (AI, Web, Cloud, etc.).</p>
590
+ </div>
591
+ </div>
592
+ </div>
593
+ </div>
594
+
595
+ <h4 class="text-lg font-semibold text-gray-800 mb-4">Featured Mentors</h4>
596
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
597
+ <!-- Mentor 1 -->
598
+ <div class="bg-white p-4 rounded-lg shadow-sm flex items-center">
599
+ <div class="flex-shrink-0">
600
+ <img class="h-12 w-12 rounded-full" src="https://randomuser.me/api/portraits/women/65.jpg" alt="Deepa">
601
+ </div>
602
+ <div class="ml-4">
603
+ <h5 class="font-medium text-gray-800">Deepa</h5>
604
+ <p class="text-sm text-gray-600">Senior Engineer • Google (ex-Microsoft)</p>
605
+ <div class="mt-1 flex space-x-2">
606
+ <span class="inline-block px-2 py-0.5 text-xs font-medium text-blue-800 bg-blue-100 rounded-full">Mentoring: 3</span>
607
+ <span class="inline-block px-2 py-0.5 text-xs font-medium text-green-800 bg-green-100 rounded-full">Available</span>
608
+ </div>
609
+ </div>
610
+ </div>
611
+
612
+ <!-- Mentor 2 -->
613
+ <div class="bg-white p-4 rounded-lg shadow-sm flex items-center">
614
+ <div class="flex-shrink-0">
615
+ <img class="h-12 w-12 rounded-full" src="https://randomuser.me/api/portraits/men/75.jpg" alt="Vijay">
616
+ </div>
617
+ <div class="ml-4">
618
+ <h5 class="font-medium text-gray-800">Vijay</h5>
619
+ <p class="text-sm text-gray-600">CTO • AI Startup (ex-Apple)</p>
620
+ <div class="mt-1 flex space-x-2">
621
+ <span class="inline-block px-2 py-0.5 text-xs font-medium text-blue-800 bg-blue-100 rounded-full">Mentoring: 5</span>
622
+ <span class="inline-block px-2 py-0.5 text-xs font-medium text-green-800 bg-green-100 rounded-full">Available</span>
623
+ </div>
624
+ </div>
625
+ </div>
626
+
627
+ <!-- Mentor 3 -->
628
+ <div class="bg-white p-4 rounded-lg shadow-sm flex items-center">
629
+ <div class="flex-shrink-0">
630
+ <img class="h-12 w-12 rounded-full" src="https://randomuser.me/api/portraits/women/42.jpg" alt="Priya">
631
+ </div>
632
+ <div class="ml-4">
633
+ <h5 class="font-medium text-gray-800">Priya</h5>
634
+ <p class="text-sm text-gray-600">Engineering Manager • Amazon</p>
635
+ <div class="mt-1 flex space-x-2">
636
+ <span class="inline-block px-2 py-0.5 text-xs font-medium text-blue-800 bg-blue-100 rounded-full">Mentoring: 2</span>
637
+ <span class="inline-block px-2 py-0.5 text-xs font-medium text-yellow-800 bg-yellow-100 rounded-full">Limited</span>
638
+ </div>
639
+ </div>
640
+ </div>
641
+
642
+ <!-- Mentor 4 -->
643
+ <div class="bg-white p-4 rounded-lg shadow-sm flex items-center">
644
+ <div class="flex-shrink-0">
645
+ <img class="h-12 w-12 rounded-full" src="https://randomuser.me/api/portraits/men/32.jpg" alt="Arvind">
646
+ </div>
647
+ <div class="ml-4">
648
+ <h5 class="font-medium text-gray-800">Arvind</h5>
649
+ <p class="text-sm text-gray-600">Principal Engineer • Microsoft</p>
650
+ <div class="mt-1 flex space-x-2">
651
+ <span class="inline-block px-2 py-0.5 text-xs font-medium text-blue-800 bg-blue-100 rounded-full">Mentoring: 4</span>
652
+ <span class="inline-block px-2 py-0.5 text-xs font-medium text-green-800 bg-green-100 rounded-full">Available</span>
653
+ </div>
654
+ </div>
655
+ </div>
656
+ </div>
657
+ <button class="mt-6 w-full bg-blue-600 hover:bg-blue-700 text-white py-2 px-4 rounded-lg font-medium transition duration-300">
658
+ Find a Mentor
659
+ </button>
660
+ </div>
661
+ </div>
662
+ </div>
663
+ </section>
664
+
665
+ <!-- Testimonials Section -->
666
+ <section class="py-20 gradient-bg text-white">
667
+ <div class="container mx-auto px-6">
668
+ <div class="text-center mb-16">
669
+ <h2 class="text-3xl md:text-4xl font-bold mb-4">Success Stories</h2>
670
+ <p class="text-xl max-w-3xl mx-auto">Hear from Tamil Nadu engineers who have pursued global opportunities and advanced their careers.</p>
671
+ </div>
672
+
673
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
674
+ <!-- Testimonial 1 -->
675
+ <div class="testimonial-card rounded-xl p-8 transition duration-300 card-hover">
676
+ <div class="flex items-center mb-6">
677
+ <div class="flex-shrink-0">
678
+ <img class="h-14 w-14 rounded-full" src="https://randomuser.me/api/portraits/women/44.jpg" alt="Sharmila">
679
+ </div>
680
+ <div class="ml-4">
681
+ <h4 class="font-bold">Sharmila</h4>
682
+ <p class="text-blue-200">AI Engineer at Google</p>
683
+ </div>
684
+ </div>
685
+ <p class="italic mb-6">"The mentorship I received through TN TechConnect was invaluable in securing my internship at Google Zurich. The mock interviews and resume reviews made all the difference in my application process."</p>
686
+ <div class="flex items-center">
687
+ <i class="fas fa-star text-yellow-300 mr-1"></i>
688
+ <i class="fas fa-star text-yellow-300 mr-1"></i>
689
+ <i class="fas fa-star text-yellow-300 mr-1"></i>
690
+ <i class="fas fa-star text-yellow-300 mr-1"></i>
691
+ <i class="fas fa-star text-yellow-300"></i>
692
+ </div>
693
+ </div>
694
+
695
+ <!-- Testimonial 2 -->
696
+ <div class="testimonial-card rounded-xl p-8 transition duration-300 card-hover">
697
+ <div class="flex items-center mb-6">
698
+ <div class="flex-shrink-0">
699
+ <img class="h-14 w-14 rounded-full" src="https://randomuser.me/api/portraits/men/54.jpg" alt="Ramesh">
700
+ </div>
701
+ <div class="ml-4">
702
+ <h4 class="font-bold">Ramesh</h4>
703
+ <p class="text-blue-200">CTO at HealthTech Startup</p>
704
+ </div>
705
+ </div>
706
+ <p class="italic mb-6">"After working at Amazon Seattle for 5 years, I wanted to give back. Through this platform, I've mentored 6 young engineers from Tamil Nadu who are now working at top tech companies globally."</p>
707
+ <div class="flex items-center">
708
+ <i class="fas fa-star text-yellow-300 mr-1"></i>
709
+ <i class="fas fa-star text-yellow-300 mr-1"></i>
710
+ <i class="fas fa-star text-yellow-300 mr-1"></i>
711
+ <i class="fas fa-star text-yellow-300 mr-1"></i>
712
+ <i class="fas fa-star text-yellow-300"></i>
713
+ </div>
714
+ </div>
715
+
716
+ <!-- Testimonial 3 -->
717
+ <div class="testimonial-card rounded-xl p-8 transition duration-300 card-hover">
718
+ <div class="flex items-center mb-6">
719
+ <div class="flex-shrink-0">
720
+ <img class="h-14 w-14 rounded-full" src="https://randomuser.me/api/portraits/women/68.jpg" alt="Meena">
721
+ </div>
722
+ <div class="ml-4">
723
+ <h4 class="font-bold">Meena</h4>
724
+ <p class="text-blue-200">Hardware Engineer at Intel</p>
725
+ </div>
726
+ </div>
727
+ <p class="italic mb-6">"The research collaboration I found through TN TechConnect led to my current position at Intel Oregon. The platform connected me with the right people at the right time in my career."</p>
728
+ <div class="flex items-center">
729
+ <i class="fas fa-star text-yellow-300 mr-1"></i>
730
+ <i class="fas fa-star text-yellow-300 mr-1"></i>
731
+ <i class="fas fa-star text-yellow-300 mr-1"></i>
732
+ <i class="fas fa-star text-yellow-300 mr-1"></i>
733
+ <i class="fas fa-star-half-alt text-yellow-300"></i>
734
+ </div>
735
+ </div>
736
+ </div>
737
+
738
+ <div class="text-center mt-12">
739
+ <a href="#" class="inline-block bg-white hover:bg-gray-100 text-blue-800 px-6 py-3 rounded-lg font-semibold transition duration-300">
740
+ Read More Success Stories
741
+ </a>
742
+ </div>
743
+ </div>
744
+ </section>
745
+
746
+ <!-- Podcasts Section -->
747
+ <section id="podcasts" class="py-20 bg-white podcast-wave">
748
+ <div class="container mx-auto px-6">
749
+ <div class="text-center mb-16">
750
+ <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">TN TechConnect Podcast</h2>
751
+ <p class="text-xl text-gray-600 max-w-3xl mx-auto">Listen to conversations with Tamil Nadu engineers who have worked at top global tech companies.</p>
752
+ </div>
753
+
754
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
755
+ <!-- Podcast 1 -->
756
+ <div class="bg-white rounded-xl shadow-lg overflow-hidden transition duration-300 card-hover">
757
+ <div class="relative">
758
+ <img src="https://images.unsplash.com/photo-1563986768609-322da13575f3?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Podcast Cover" class="w-full h-48 object-cover">
759
+ <div class="absolute inset-0 bg-blue-800 opacity-20"></div>
760
+ <div class="absolute bottom-4 left-4 bg-blue-600 text-white p-2 rounded-full">
761
+ <i class="fas fa-play text-lg"></i>
762
+ </div>
763
+ </div>
764
+ <div class="p-6">
765
+ <div class="flex justify-between items-start mb-2">
766
+ <span class="inline-block px-2 py-1 text-xs font-semibold text-blue-800 bg-blue-100 rounded-full">Episode 23</span>
767
+ <span class="text-xs text-gray-500">45 min</span>
768
+ </div>
769
+ <h3 class="text-xl font-semibold text-gray-800 mb-3">From Coimbatore to Google AI</h3>
770
+ <p class="text-gray-600 mb-4">Karthik shares his journey from PSG Tech to leading AI projects at Google's Zurich office.</p>
771
+ <div class="flex items-center">
772
+ <div class="flex-shrink-0">
773
+ <img class="h-10 w-10 rounded-full" src="https://randomuser.me/api/portraits/men/75.jpg" alt="Karthik">
774
+ </div>
775
+ <div class="ml-3">
776
+ <p class="text-sm font-medium text-gray-900">Karthik</p>
777
+ <p class="text-sm text-gray-500">AI Researcher</p>
778
+ </div>
779
+ </div>
780
+ </div>
781
+ </div>
782
+
783
+ <!-- Podcast 2 -->
784
+ <div class="bg-white rounded-xl shadow-lg overflow-hidden transition duration-300 card-hover">
785
+ <div class="relative">
786
+ <img src="https://images.unsplash.com/photo-1551288049-bebda4e38f71?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Podcast Cover" class="w-full h-48 object-cover">
787
+ <div class="absolute inset-0 bg-green-800 opacity-20"></div>
788
+ <div class="absolute bottom-4 left-4 bg-green-600 text-white p-2 rounded-full">
789
+ <i class="fas fa-play text-lg"></i>
790
+ </div>
791
+ </div>
792
+ <div class="p-6">
793
+ <div class="flex justify-between items-start mb-2">
794
+ <span class="inline-block px-2 py-1 text-xs font-semibold text-green-800 bg-green-100 rounded-full">Episode 22</span>
795
+ <span class="text-xs text-gray-500">52 min</span>
796
+ </div>
797
+ <h3 class="text-xl font-semibold text-gray-800 mb-3">Building a Cybersecurity Career</h3>
798
+ <p class="text-gray-600 mb-4">Anitha discusses her transition from Chennai to leading security projects at Palo Alto Networks.</p>
799
+ <div class="flex items-center">
800
+ <div class="flex-shrink-0">
801
+ <img class="h-10 w-10 rounded-full" src="https://randomuser.me/api/portraits/women/33.jpg" alt="Anitha">
802
+ </div>
803
+ <div class="ml-3">
804
+ <p class="text-sm font-medium text-gray-900">Anitha</p>
805
+ <p class="text-sm text-gray-500">Security Engineer</p>
806
+ </div>
807
+ </div>
808
+ </div>
809
+ </div>
810
+
811
+ <!-- Podcast 3 -->
812
+ <div class="bg-white rounded-xl shadow-lg overflow-hidden transition duration-300 card-hover">
813
+ <div class="relative">
814
+ <img src="https://images.unsplash.com/photo-1622675363311-3e1904dc1885?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Podcast Cover" class="w-full h-48 object-cover">
815
+ <div class="absolute inset-0 bg-purple-800 opacity-20"></div>
816
+ <div class="absolute bottom-4 left-4 bg-purple-600 text-white p-2 rounded-full">
817
+ <i class="fas fa-play text-lg"></i>
818
+ </div>
819
+ </div>
820
+ <div class="p-6">
821
+ <div class="flex justify-between items-start mb-2">
822
+ <span class="inline-block px-2 py-1 text-xs font-semibold text-purple-800 bg-purple-100 rounded-full">Episode 21</span>
823
+ <span class="text-xs text-gray-500">38 min</span>
824
+ </div>
825
+ <h3 class="text-xl font-semibold text-gray-800 mb-3">From TN to Silicon Valley</h3>
826
+ <p class="text-gray-600 mb-4">Suresh reflects on his journey from Anna University to founding a successful AI startup in California.</p>
827
+ <div class="flex items-center">
828
+ <div class="flex-shrink-0">
829
+ <img class="h-10 w-10 rounded-full" src="https://randomuser.me/api/portraits/men/22.jpg" alt="Suresh">
830
+ </div>
831
+ <div class="ml-3">
832
+ <p class="text-sm font-medium text-gray-900">Suresh</p>
833
+ <p class="text-sm text-gray-500">Startup Founder</p>
834
+ </div>
835
+ </div>
836
+ </div>
837
+ </div>
838
+ </div>
839
+
840
+ <div class="text-center mt-12">
841
+ <a href="#" class="inline-flex items-center bg-blue-800 hover:bg-blue-900 text-white px-6 py-3 rounded-lg font-semibold transition duration-300">
842
+ <i class="fas fa-headphones mr-2"></i> Browse All Episodes
843
+ </a>
844
+ </div>
845
+ </div>
846
+ </section>
847
+
848
+ <!-- CTA Section -->
849
+ <section class="py-16 bg-gray-900 text-white">
850
+ <div class="container mx-auto px-6 text-center">
851
+ <h2 class="text-3xl md:text-4xl font-bold mb-6">Ready to Advance Your Engineering Career?</h2>
852
+ <p class="text-xl mb-8 max-w-3xl mx-auto">Join our growing community of Tamil Nadu engineering professionals accessing global opportunities.</p>
853
+ <div class="flex flex-wrap justify-center gap-4">
854
+ <a href="#" class="bg-blue-600 hover:bg-blue-700 text-white px-8 py-4 rounded-lg font-semibold text-lg transition duration-300">
855
+ Create Free Account
856
+ </a>
857
+ <a href="#" class="border border-white hover:bg-white hover:text-gray-900 text-white px-8 py-4 rounded-lg font-semibold text-lg transition duration-300">
858
+ Learn More
859
+ </a>
860
+ </div>
861
+ </div>
862
+ </section>
863
+
864
+ <!-- Footer -->
865
+ <footer class="bg-gray-800 text-white pt-12 pb-6">
866
+ <div class="container mx-auto px-6">
867
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8 mb-8">
868
+ <div>
869
+ <h3 class="text-xl font-bold mb-4">TN TechConnect</h3>
870
+ <p class="mb-4">Empowering Tamil Nadu's engineering professionals with global opportunities and connections.</p>
871
+ <div class="flex space-x-4">
872
+ <a href="#" class="text-gray-400 hover:text-white">
873
+ <i class="fab fa-facebook-f"></i>
874
+ </a>
875
+ <a href="#" class="text-gray-400 hover:text-white">
876
+ <i class="fab fa-twitter"></i>
877
+ </a>
878
+ <a href="#" class="text-gray-400 hover:text-white">
879
+ <i class="fab fa-linkedin-in"></i>
880
+ </a>
881
+ <a href="#" class="text-gray-400 hover:text-white">
882
+ <i class="fab fa-instagram"></i>
883
+ </a>
884
+ </div>
885
+ </div>
886
+
887
+ <div>
888
+ <h4 class="text-lg font-semibold mb-4">Quick Links</h4>
889
+ <ul class="space-y-2">
890
+ <li><a href="#" class="hover:text-blue-300">Home</a></li>
891
+ <li><a href="#" class="hover:text-blue-300">Internships</a></li>
892
+ <li><a href="#" class="hover:text-blue-300">Tech Events</a></li>
893
+ <li><a href="#" class="hover:text-blue-300">Research</a></li>
894
+ <li><a href="#" class="hover:text-blue-300">Community</a></li>
895
+ <li><a href="#" class="hover:text-blue-300">Podcasts</a></li>
896
+ </ul>
897
+ </div>
898
+
899
+ <div>
900
+ <h4 class="text-lg font-semibold mb-4">Resources</h4>
901
+ <ul class="space-y-2">
902
+ <li><a href="#" class="hover:text-blue-300">Internship Guide</a></li>
903
+ <li><a href="#" class="hover:text-blue-300">Tech Event Calendar</a></li>
904
+ <li><a href="#" class="hover:text-blue-300">Research Grants</a></li>
905
+ <li><a href="#" class="hover:text-blue-300">Mentorship Program</a></li>
906
+ <li><a href="#" class="hover:text-blue-300">Engineer Directory</a></li>
907
+ <li><a href="#" class="hover:text-blue-300">FAQ</a></li>
908
+ </ul>
909
+ </div>
910
+
911
+ <div>
912
+ <h4 class="text-lg font-semibold mb-4">Contact Us</h4>
913
+ <ul class="space-y-2">
914
+ <li class="flex items-start">
915
+ <i class="fas fa-map-marker-alt mt-1 mr-3 text-blue-300"></i>
916
+ <span>123 Tech Park, Chennai, Tamil Nadu 600001</span>
917
+ </li>
918
+ <li class="flex items-center">
919
+ <i class="fas fa-phone-alt mr-3 text-blue-300"></i>
920
+ <span>+91 98765 43210</span>
921
+ </li>
922
+ <li class="flex items-center">
923
+ <i class="fas fa-envelope mr-3 text-blue-300"></i>
924
+ <span>contact@tntechconnect.org</span>
925
+ </li>
926
+ </ul>
927
+ </div>
928
+ </div>
929
+
930
+ <div class="border-t border-gray-700 pt-6 flex flex-col md:flex-row justify-between items-center">
931
+ <p class="text-gray-400 mb-4 md:mb-0">© 2023 TN TechConnect. All rights reserved.</p>
932
+ <div class="flex space-x-6">
933
+ <a href="#" class="text-gray-400 hover:text-white">Privacy Policy</a>
934
+ <a href="#" class="text-gray-400 hover:text-white">Terms of Service</a>
935
+ <a href="#" class="text-gray-400 hover:text-white">Cookie Policy</a>
936
+ </div>
937
+ </div>
938
+ </div>
939
+ </footer>
940
+
941
+ <script>
942
+ // Mobile menu toggle
943
+ const mobileMenuButton = document.querySelector('.mobile-menu-button');
944
+ const mobileMenu = document.querySelector('.mobile-menu');
945
+
946
+ mobileMenuButton.addEventListener('click', () => {
947
+ mobileMenu.classList.toggle('hidden');
948
+ });
949
+
950
+ // Smooth scrolling for anchor links
951
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
952
+ anchor.addEventListener('click', function (e) {
953
+ e.preventDefault();
954
+
955
+ document.querySelector(this.getAttribute('href')).scrollIntoView({
956
+ behavior: 'smooth'
957
+ });
958
+
959
+ // Close mobile menu if open
960
+ if (!mobileMenu.classList.contains('hidden')) {
961
+ mobileMenu.classList.add('hidden');
962
+ }
963
+ });
964
+ });
965
+
966
+ // Sticky header on scroll
967
+ window.addEventListener('scroll', function() {
968
+ const nav = document.querySelector('nav');
969
+ if (window.scrollY > 50) {
970
+ nav.classList.add('shadow-xl');
971
+ } else {
972
+ nav.classList.remove('shadow-xl');
973
+ }
974
+ });
975
+ </script>
976
+ <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=rocknlight/tn25" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p><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=Sangeethvr/techcom" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
977
+ </html>
prompts.txt ADDED
@@ -0,0 +1 @@
 
 
1
+ Retain the all the front end, and make it relevant for engineers now (instead of doctors) all the content isnisde will be for engineers of tamilnadu now