-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
412 lines (376 loc) · 28.8 KB
/
index.html
File metadata and controls
412 lines (376 loc) · 28.8 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0">
<meta name="theme-color" content="#f44234">
<meta name="title" content="MainRoute Core | Be Passionate For Future" />
<meta name="description" content="MainRoute Core, led by M Ramzan Ch. We engineer high-performance PWAs, enterprise software, and open-source contributions." />
<meta name="keywords" content="MainRoute, MainRoute Core, MR Core, MRC, M Ramzan Ch, MegaMind-Solution, Web Development, Software Development, Modifications, Git Folder Downloader, Pro Bandey" />
<meta name="author" content="M Ramzan Ch" />
<meta name="copyright" content="MainRoute Core" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://mainroute-core.github.io/" />
<meta property="og:title" content="MainRoute Core | Be Passionate For Future" />
<meta property="og:description" content="A specialized technology powerhouse delivering PWA, open-source, and custom software solutions." />
<meta property="og:image" content="/src/social.png" />
<script>
if ('serviceWorker' in navigator) { window.addEventListener('load', () => { navigator.serviceWorker.register('/sw.js') .then(reg => { console.log('Core Service Worker Active. Scope:', reg.scope); }) .catch(err => { console.error('× Service Worker Registration Failed:', err); }); }); }
</script>
<link rel="manifest" href="/manifest.webmanifest">
<link rel="canonical" href="https://mainroute-core.github.io/">
<link rel="shortcut icon" type="image/x-icon" sizes="any" href="/favicon.ico">
<link rel="icon" type="image/png" sizes="16x16" href="/src/16.png">
<link rel="icon" type="image/png" sizes="16x16" href="/src/32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/src/144.png">
<link rel="icon" type="image/png" sizes="16x16" href="/src/192.png">
<link rel="icon" type="image/png" sizes="16x16" href="/src/512.png">
<link rel="apple-touch-icon" type="image/png" sizes="180x180" href="/src/apple-touch-icon.png">
<link rel="apple-touch-icon" type="image/png" sizes="167x167" href="/src/apple-touch-167.png">
<link rel="apple-touch-icon" type="image/png" sizes="152x152" href="/src/apple-touch-152.png">
<link rel="apple-touch-icon" type="image/png" sizes="120x120" href="/src/apple-touch-120.png">
<title>MainRoute Core</title>
<link href="/src/CoreSans-Regular_en.otf" rel="stylesheet">
<link rel="stylesheet" href="/css/global.css">
<link rel="stylesheet" href="/css/index.css">
</head>
<body>
<div id="loader" class="loader" style="pointer-events: none;">
<img style="height: 120px; width: 120px; pointer-events: none;" src="/src/mrc-nuca-loading.svg" alt="mrc-nuca-loading">
<div class="loader-text-wrapper">
<span class="loader-text-letter">I</span>
<span class="loader-text-letter">n</span>
<span class="loader-text-letter">i</span>
<span class="loader-text-letter">t</span>
<span class="loader-text-letter">i</span>
<span class="loader-text-letter">a</span>
<span class="loader-text-letter">l</span>
<span class="loader-text-letter">i</span>
<span class="loader-text-letter">z</span>
<span class="loader-text-letter">i</span>
<span class="loader-text-letter">n</span>
<span class="loader-text-letter">g</span>
<hr>
<span class="loader-text-letter">C</span>
<span class="loader-text-letter">o</span>
<span class="loader-text-letter">r</span>
<span class="loader-text-letter">e</span>
<div class="loader-colors"></div>
</div>
</div>
<div id="scroll-progress-container">
<div id="scroll-progress"></div>
</div>
<div class="tech-grid"></div>
<header class="header" id="navbar">
<div class="nav-bar glass-panel">
<a href="/" class="nav-logo">
<img src="/src/mrc-nuca.svg" alt="MRC Logo">
<span style="color:var(--text-main);">MainRoute <span class="txt-mrc">Core</span></span>
</a>
<nav class="desktop-nav">
<a href="/About/">About Us</a>
<a href="/Clog/">Clog</a>
<a href="/Media/">Media & Press Kit</a>
<a href="/CopyRight/">Brand Guidelines</a>
<a href="/Contact/">Contact Us</a>
<div style="width: 1px; height: 16px; background: var(--glass-border);"></div>
<div class="system-status">
<div class="status-dot"></div> Active
</div>
</nav>
<button id="mobile-menu-btn" class="mobile-menu-btn" title="Menu Button">
<svg class="icon"><use href="/src/global.svg#icon-menu"></use></svg>
</button>
</div>
<div id="mobile-menu" class="mobile-menu glass-panel">
<a href="/About/">About Us</a>
<a href="/Clog/">Clog</a>
<a href="/Media/">Media & Press Kit</a>
<a href="/CopyRight/">Brand Guidelines</a>
<a href="/Contact/">Contact</a>
<div class="mobile-menu-goto-id">
<a href="#expertise">Expertise</a>
<a href="#workflow">Workflow</a>
<a href="#open-source">Open Source</a>
</div>
</div>
</header>
<section class="hero">
<div class="container grid-2">
<div class="hero-content">
<div class="hero-tag reveal">
<svg class="icon" style="width:14px; height:14px;"><use href="/src/global.svg#icon-sparkles"></use></svg>
Be Passionate For Future
</div>
<h1 class="hero-title reveal delay-100">
FUTURE <br>
<span class="text-gradient">ENGINEERED.</span>
</h1>
<p class="hero-desc reveal delay-200 capitalize">
A specialized technology powerhouse led by <span class="font-bold txt-main">M Ramzan Ch</span>.
Originating with roots globally, we engineer high-performance PWAs, Web Tech, Enterprise Software, Browsers Exts, and Robust Open-Source infrastructure.
</p>
<div class="flex flex-wrap gap-4 reveal delay-300">
<a href="#contact" class="btn btn-prim">
Initiate Collaboration <svg class="icon"><use href="/src/global.svg#icon-arrow-right"></use></svg>
</a>
<a href="#open-source" class="btn btn-out">
The FOSS Lab <svg class="icon"><use href="/src/global.svg#icon-github"></use></svg>
</a>
</div>
</div>
<div class="hero-graphics scale-in delay-200">
<div class="spin1"></div>
<div class="spin2" ></div>
<div class="spin3" ></div>
<div class="spin4" ></div>
<div class="glass-panel pad-2 border-50 z-ind-10">
<svg xmlns="http://www.w3.org/2000/svg" id="Nuca" width="512" height="512" viewBox="0 0 300 300">
<defs>
<radialGradient id="CoreToOrbit" cx="150" cy="150" r="150" gradientUnits="userSpaceOnUse"><stop offset="0%" stop-color="#4b1010" /><stop offset="35%" stop-color="#990000" /><stop offset="70%" stop-color="#e62e2e" /><stop offset="85%" stop-color="#d42929" /><stop offset="100%" stop-color="#f44234" /></radialGradient>
</defs>
<style>
#Nuca { transform-origin: center;filter: grayscale(1); border-radius: 2.5rem; border:2px solid var(--border-light);}
#Nuca:hover{filter: none;}
#K-Orbit, #L-Orbit, #M-Orbit {transform-box: fill-box;transform-origin: center;}
#Nuca:hover #K-Orbit {animation: spinK 3s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;}
@keyframes spinK { from { transform: rotate(540deg); } to { transform: rotate(0deg); }}
#Nuca:hover #L-Orbit { animation: spinL 3s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;}
@keyframes spinL {from { transform: rotate(0deg); } to { transform: rotate(540deg); }}
#Nuca:hover #M-Orbit {animation: spinM 3s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;}
@keyframes spinM {from { transform: rotate(720deg); }to { transform: rotate(0deg); }}
#Nuca:hover #Core {opacity: 0;transform: scale(0.6);transform-origin: center; animation: PopOut 0.8s ease-out forwards;animation-delay: .5s;}
@keyframes PopOut {0% { opacity: 0; transform: scale(0.6); }70% { opacity: 1; transform: scale(1.15); }100% { opacity: 1; transform: scale(1); }}
</style>
<path id="K-Orbit" fill="url(#CoreToOrbit)" d="M145.251 8.285c3.712-.208 7.945-.077 11.656.087a141.1 141.1 0 0 1 70.903 22.9c4.328 2.828 8.175 5.131 9.265 10.493.68 3.234.04 6.606-1.782 9.363a11.76 11.76 0 0 1-7.746 5.08c-4.202.77-6.937-.672-10.234-2.945-26.917-18.557-58.1-24.906-90.17-18.883A117.42 117.42 0 0 0 53.4 82.678c-18.764 27.478-25.144 57.758-19.025 90.431 2.006 9.192 4.572 17.71 8.633 26.236.92 1.932 1.971 4.384 3.138 6.155 4.546 1.752 8.054 4.01 10.453 8.435a17.6 17.6 0 0 1 1.39 13.445c-2.84 9.317-12.788 14.524-22.025 11.511a17.52 17.52 0 0 1-10.182-8.716c-2.242-4.44-2.319-8.609-.796-13.245-2.982-5.141-5.053-10.046-7.229-15.517-6.278-15.79-9.116-31.141-9.673-48.08A142.04 142.04 0 0 1 46.04 53.352a141.33 141.33 0 0 1 99.211-45.067m112.563 52.862c1.078-.097 3.041.122 4.097.339 4.19.857 7.87 3.341 10.23 6.907 2.658 4.045 3.131 8.354 2.154 12.996.382.962 1.465 2.892 1.977 3.878a122 122 0 0 1 3.18 6.506 142.5 142.5 0 0 1 9.497 29.22 142 142 0 0 1-19.989 106.51 141.55 141.55 0 0 1-88.613 60.898 142.72 142.72 0 0 1-109.005-20.313c-4.56-2.994-8.303-5.587-8.803-11.483a12.2 12.2 0 0 1 3.008-9.036 12.05 12.05 0 0 1 11.923-3.743c3.393.815 6.683 3.573 9.62 5.471 20.864 13.483 46.293 19.846 71.112 18.109a117.38 117.38 0 0 0 80.947-40.512 117.07 117.07 0 0 0 28.51-84.683 116.8 116.8 0 0 0-11.133-42.599c-.643-1.347-2.66-5.729-3.474-6.56-1.141-1.167-3.677-1.84-5.573-3.592-3.188-2.95-4.933-6.764-5.185-11.075a16.67 16.67 0 0 1 4.15-11.85c3.113-3.494 6.756-5.103 11.37-5.388"/>
<path id="L-Orbit" fill="url(#CoreToOrbit)" d="M146.268 48.549c20.718-1.121 43.18 5.5 60.328 17.087a102.37 102.37 0 0 1 35.956 42.414 76 76 0 0 1 2.762 6.698c1.098 3.082 1.503 5.561 3.82 7.992 1.599 1.678 2.775 4.92 3.2 7.189a17.3 17.3 0 0 1-2.796 12.988c-2.6 3.746-6.696 6.203-11.161 7.001a17.47 17.47 0 0 1-13.091-2.95c-6.802-4.807-9.381-14.081-5.403-21.57.714-1.342 1.51-2.454 2.394-3.68-.869-2.567-2.701-6.257-3.998-8.644a78.46 78.46 0 0 0-46.856-37.682 76.9 76.9 0 0 0-29.502-2.628 78.25 78.25 0 0 0-61.082 42.231 95 95 0 0 0-3.73 8.357c-.921 2.396-1.667 4.893-2.564 7.3-2.887 7.928-13.835 9.62-19.589 3.813-5.254-5.302-3.59-10.16-1.495-16.291a102.7 102.7 0 0 1 20.557-35.482 100.88 100.88 0 0 1 59.906-32.954c4.239-.679 8.083-.94 12.344-1.19M63.884 159.144c2.211-.201 4.958.316 7.017 1.11 4.1 1.544 7.4 4.686 9.143 8.705 2.238 5.12 1.717 8.967-.219 13.928 7.27 16.907 22.868 31.17 39.653 38.386a77.4 77.4 0 0 0 59.343.74 77.76 77.76 0 0 0 41.995-40.015c1.553-3.37 2.813-6.9 3.872-10.455.306-1.025.631-2.144 1.058-3.118a11.5 11.5 0 0 1 6.438-6.144 12.5 12.5 0 0 1 9.54.279 11.93 11.93 0 0 1 6.214 6.663c.563 1.493.806 3.088.712 4.682-.287 4.56-4.381 14.373-6.337 18.634-4.058 8.43-8.306 15.377-14.325 22.61a101.25 101.25 0 0 1-68.398 35.922 101.44 101.44 0 0 1-91.744-41.39 101 101 0 0 1-7.837-12.788c-1.176-2.286-2.267-5.048-3.612-7.197-.723-.785-1.726-1.317-2.515-2.038-10.695-9.772-4.374-27.471 10.002-28.514"/>
<path id="M-Orbit" fill="url(#CoreToOrbit)" d="M169.396 86.037c6.189-.877 13.106 2.313 16.292 7.71.624 1.057 1.336 3.117 2.187 3.933 1.466 1.406 3.37 2.529 4.838 3.961 19.787 17.297 26.867 45.76 17.84 70.365a64.26 64.26 0 0 1-26.446 32.369c-4.248 2.6-7.401 3.921-12.332 2.732a11.4 11.4 0 0 1-3.955-1.919c-6.675-4.982-6.192-15.136.583-19.715 1.901-1.285 4.183-2.004 6.097-3.45 3.149-2.38 5.81-4.976 8.146-8.146a40 40 0 0 0 7.31-30.09c-1.34-8.706-6.232-18.862-13.451-24.137q-1.237.259-2.483.471a17 17 0 0 1-12.892-3.052 17.06 17.06 0 0 1-6.8-11.212c-.702-4.66.49-9.408 3.31-13.184 2.97-3.933 6.951-5.957 11.756-6.636m-46.521 6.593c3.063-.392 6.16.412 8.644 2.247 2.53 1.866 4.146 4.77 4.582 7.867a11.9 11.9 0 0 1-4.806 11.396c-1.628 1.194-3.553 2.122-5.291 3.441-3.36 2.55-5.829 4.875-8.346 8.249a40.1 40.1 0 0 0-7.706 30.305 40.17 40.17 0 0 0 15.56 25.885c4.311-1.758 8.612-2.16 13.062-.536a16.27 16.27 0 0 1 9.211 8.505 16.3 16.3 0 0 1 .425 12.66c-1.627 4.351-4.527 7.297-8.714 9.211-1.207.506-2.8.919-4.088 1.114-4.88.78-9.854-.657-13.566-3.919-.734-.644-2.177-2.607-2.777-2.99-2.504-1.6-5.119-3.063-7.515-4.845a64.17 64.17 0 0 1-25.2-42.623 64.22 64.22 0 0 1 12.116-46.943c4.757-6.342 16.522-17.906 24.409-19.024"/>
<path id="Core" fill="url(#CoreToOrbit)" d="M148.682 128.84c12.318-1.365 23.408 7.519 24.766 19.837 1.356 12.32-7.534 23.406-19.853 24.756-12.31 1.35-23.385-7.534-24.74-19.841-1.357-12.31 7.518-23.39 19.827-24.753"/>
</svg>
</div>
<div class="glass-panel flex items-center gap-4 pos-abs pad-2" style="bottom: 0; right: 0; border-radius: 1rem; z-index: 20; animation: float 4s infinite alternate;">
<img src="src/pb.png" alt="Pro Bandey" class="border-50" style="width: 40px; height: 40px; border: 2px solid var(--mrc);">
<div>
<div class="font-bold" style="line-height: 1.2;">Pro Bandey</div>
<div class="txt-mrc font-mono" style="font-size: 0.7rem;">Professional Dev & Project's Brand</div>
</div>
</div>
</div>
</div>
</section>
<div class="marquee">
<div class="marquee-content">
<span class="marquee-item marquee-stroke">Progress</span>
<span class="marquee-item txt-mrc">Native</span>
<span class="marquee-item marquee-stroke">Solution</span>
<span class="marquee-item txt-mrc">Ecosystem</span>
<span class="marquee-item marquee-stroke">Architecture</span>
<span class="marquee-item txt-mrc">Engine</span>
<span class="marquee-item marquee-stroke">Progress</span>
<span class="marquee-item txt-mrc">Native</span>
<span class="marquee-item marquee-stroke">Solution</span>
<span class="marquee-item txt-mrc">Ecosystem</span>
<span class="marquee-item marquee-stroke">Architecture</span>
<span class="marquee-item txt-mrc">Engine</span>
</div>
</div>
<section class="section">
<div class="container grid grid-4 stats-grid"">
<div class="stat-item reveal">
<div class="stat-num">50<span class="txt-mrc">+</span></div>
<div class="stat-label">Projects Delivered</div>
</div>
<div class="stat-item reveal delay-100">
<div class="stat-num">15<span class="txt-mrc">K</span></div>
<div class="stat-label">Open Source Commits</div>
</div>
<div class="stat-item reveal delay-200">
<div class="stat-num">90+<span class="txt-mrc">%</span></div>
<div class="stat-label">Client Satisfaction</div>
</div>
<div class="stat-item reveal delay-300">
<div class="stat-num">24<span class="txt-mrc">/7</span></div>
<div class="stat-label">System Reliability</div>
</div>
</div>
</section>
<section id="workflow" class="section">
<div class="container">
<div class="section-header reveal">
<div class="hero-tag">PHASE: 01 — 04</div>
<h2 class="section-title">The <span class="txt-mrc">Workflow.</span></h2>
<p class="section-desc">Our systematic, battle-tested approach to translating complex requirements into highly scalable digital infrastructure.</p>
</div>
<div class="grid grid-4 gap-4">
<div class="glass-panel card reveal">
<div class="font-black" style="font-size: 3rem; color: rgba(255,255,255,0.05); margin-bottom: 1rem;">01</div>
<h4 class="card-title uppercase">Discovery</h4>
<p class="card-text">Deep dive analysis of current technical debt, user behavior, and infrastructure requirements.</p>
</div>
<div class="glass-panel card reveal delay-100">
<div class="font-black" style="font-size: 3rem; color: rgba(255,255,255,0.05); margin-bottom: 1rem;">02</div>
<h4 class="card-title uppercase">Architecture</h4>
<p class="card-text">Designing decoupled, scalable macro-systems using modern frameworks and principles.</p>
</div>
<div class="glass-panel card reveal delay-200">
<div class="font-black" style="font-size: 3rem; color: rgba(255,255,255,0.05); margin-bottom: 1rem;">03</div>
<h4 class="card-title uppercase">Development</h4>
<p class="card-text">High-velocity engineering sprints with strict continuous integration and automated testing.</p>
</div>
<div class="glass-panel card reveal delay-300">
<div class="font-black" style="font-size: 3rem; color: rgba(255,255,255,0.05); margin-bottom: 1rem;">04</div>
<h4 class="card-title uppercase">Deployment</h4>
<p class="card-text">Zero-downtime go-live protocols with 24/7 proactive monitoring and performance optimization.</p>
</div>
</div>
</div>
</section>
<section id="expertise" class="section bg-surf-ela">
<div class="pos-abs inset-0" style="background-image: radial-gradient(rgb(143 143 143 / 30%) 1px, rgb(96 83 83 / 15%) 1px); background-size: 20px 20px;"></div>
<div class="container">
<div class="txt-center reveal" style="margin-bottom: 4rem;">
<h2 class="section-title">The <span class="txt-mrc">Arsenal.</span></h2>
<div style="width: 60px; height: 4px; background: var(--mrc); margin: 0 auto; border-radius: 2px;"></div>
</div>
<div class="grid gap-4 grid-3">
<div class="glass-panel card scale-in">
<div class="card-icon"><svg class="icon"><use href="/src/global.svg#icon-smartphone"></use></svg></div>
<h3 class="card-title uppercase">Technologies</h3>
<p class="card-text">Performance-driven Progress for best experiences, ensuring zero-latency feel even in low connectivity zones.</p>
<div class="tags"><span class="tag">Service Workers</span><span class="tag">API</span></div>
</div>
<div class="glass-panel card scale-in delay-100" style="background: linear-gradient(180deg, rgba(244, 66, 52, 0.05), transparent); border-color: rgba(244, 66, 52, 0.3);">
<div class="card-icon" style="background: var(--mrc); color: white;"><svg class="icon"><use href="/src/global.svg#icon-code"></use></svg></div>
<h3 class="card-title uppercase">Custom Engineering</h3>
<p class="card-text">Engineered scalability with complex modifications and API integrations. We construct the core engines that power modern platforms.</p>
<div class="tags"><span class="tag primary">integration</span><span class="tag primary">Security</span></div>
</div>
<div class="glass-panel card scale-in delay-200">
<div class="card-icon"><svg class="icon"><use href="/src/global.svg#icon-app-window"></use></svg></div>
<h3 class="card-title uppercase">Native</h3>
<p class="card-text">Fluid Native experiences optimized utilizing modern paradigms for peak accessibility and engagement metrics.</p>
<div class="tags"><span class="tag">Native</span><span class="tag">accessibility</span></div>
</div>
</div>
</div>
</section>
<section class="section" style="padding: 4rem 0; border-bottom: 1px solid var(--glass-border);">
<div class="container txt-center reveal">
<h4 class="font-mono txt-muted uppercase tracking-widest" style="font-size: 0.8rem; margin-bottom: 2.5rem;">Main Things We Focus</h4>
<div class="tech-icons">
<div class="tech-item"><svg class="icon" style="width:2rem; height:2rem;"><use href="/src/global.svg#icon-server"></use></svg><span>Web Technologies</span></div>
<div class="tech-item"><svg class="icon" style="width:2rem; height:2rem;"><use href="/src/global.svg#icon-database"></use></svg><span>DataBases</span></div>
<div class="tech-item"><svg class="icon" style="width:2rem; height:2rem;"><use href="/src/global.svg#icon-layout"></use></svg><span>LayOut/UI</span></div>
<div class="tech-item"><svg class="icon" style="width:2rem; height:2rem;"><use href="/src/global.svg#icon-smartphone"></use></svg><span>Mobile First</span></div>
<div class="tech-item"><svg class="icon" style="width:2rem; height:2rem;"><use href="/src/global.svg#icon-github"></use></svg><span>GitHub</span></div>
<div class="tech-item"><svg class="icon" style="width:2rem; height:2rem;"><use href="/src/global.svg#icon-git-merge"></use></svg><span>Git Flow</span></div>
</div>
</div>
</section>
<section id="open-source" class="section">
<div class="container grid-2 items-center">
<div class="reveal">
<div class="hero-tag txt-main bg-trans" style="border-color: var(--glass-border);">
<svg class="icon txt-mrc" style="fill:var(--mrc); width:14px; height:14px;"><use href="/src/global.svg#icon-heart"></use></svg> Community First
</div>
<h2 class="section-title">Empowering the <br><span class="txt-mrc">Open Community.</span></h2>
<p class="section-desc" style="margin-bottom: 3rem;">We believe in giving back to the foundation that built us. MainRoute Core actively constructs and maintains several open-source repositories that provide building blocks for modern web reliability and workflow automation.</p>
<a href="#" class="glass-panel card flex gap-2 pad-3" style="padding: 1.5rem;">
<div class="card-icon" style="margin: 0; width: 48px; height: 48px;"><svg class="icon"><use href="/src/global.svg#icon-github"></use></svg></div>
<div>
<h5 class="font-bold txt-lg">Core Architecture</h5>
<p class="txt-muted" style="font-size: 0.85rem; margin-top: 0.25rem;">Reusable, highly-tested logic for complex engines.</p>
</div>
</a>
</div>
</div>
</section>
<section id="contact" class="section bg-mrc txt-center ovfl-h">
<div class="pos-abs inset-0" style="background-image: radial-gradient(rgb(0 0 0 / 40%) 1px, rgb(96 83 83 / 15%) 1px); background-size: 20px 20px;"></div>
<div class="container reveal pos-rel z-ind-10" style="max-width: 800px;">
<h2 class="font-black uppercase txt-main" style="font-size: clamp(2rem, 5vw, 4rem); letter-spacing: -0.05em; margin-bottom: 1.5rem;">Ready to Engineer the Future?</h2>
<p class="txt-main" style="font-size: 1.25rem; margin-bottom: 2.5rem;">Let's discuss your architectural needs and build something extraordinary together.</p>
<a href="mailto:tellus@mrc.com" class="btn bg-main" style="color: var(--mrc);">
Start the Dialogue <svg class="icon"><use href="/src/global.svg#icon-send"></use></svg>
</a>
</div>
</section>
<footer class="mrc-footer pad-4 pos-rel">
<div class="container pad-0">
<div class="footer-grid">
<div class="footer-brand">
<div class="brand-logo flex items-start flex-row gap-2">
<img src="/src/mrc-nuca.svg" alt="MainRoute Core Logo">
<h3 class="txt-black capitalize pos-rel">MainRoute <span class="txt-mrc">Core</span></h3>
</div>
<p class="txt-muted">A specialized technology powerhouse delivering PWA, open-source, and custom software solutions.</p>
<div class="flex gap-2">
<a target="_blank" href="/Redirect/?id=core" class="social-btn" title="Social Link" aria-label="Social Link"><svg class="icon" style="width:1.2rem;"><use href="/src/global.svg#icon-github"></use></svg></a>
<a target="_blank" href="/Redirect/?id=google" class="social-btn" title="Social Link" aria-label="Social Link"><svg class="icon" style="width:1.2rem;"><use href="/src/global.svg#icon-google"></use></svg></a>
</div>
</div>
<div class="footer-col">
<h4 class="uppercase flex txt-main txt-center gap-1 font-md pos-rel">Navigation</h4>
<div class="footer-links">
<a class="active" href="/">Home</a>
<a href="/#expertise">Core Expertise</a>
<a href="/#workflow">Our Workflow</a>
<a href="/Clog/">Clog</a>
<a href="/About/#the-core-mind">The Core Mind</a>
</div>
</div>
<div class="footer-col">
<h4 class="uppercase flex txt-main txt-center gap-1 font-md pos-rel" >Resources</h4>
<div class="footer-links">
<a href="/Media/">Media & Press Kit</a>
<a href="/CopyRight/">Brand Guidelines</a>
<a href="/Privacy/">Privacy Policy</a>
<a href="/Terms/">Terms of Service</a>
<a href="/License/">Usage License</a>
</div>
</div>
<div class="footer-col">
<h4 class="uppercase flex txt-main txt-center gap-1 font-md pos-rel">Connect</h4>
<div class="footer-links" style="margin-bottom: 1rem;">
<a href="/Contact/">Contact US</a>
</div>
<div class="footer-contact-box">
<div class="contact-item">
<div class="contact-icon"><svg class="icon">
<use href="/src/global.svg#icon-mail"></use>
</svg></div>
<div class="contact-text">
<strong style="color: white; display: block; margin-bottom: 2px;">Inquiries</strong>
<a href="mailto:tellus@mrc.com" style="color: var(--txt-muted);">tellus@mrc.com</a>
</div>
</div>
<div class="contact-item" style="margin-top: 1.25rem;">
<div class="contact-icon">
<svg class="icon">
<use href="/src/global.svg#icon-map-pin"></use>
</svg></div>
<div class="contact-text">
<strong style="color: white; display: block; margin-bottom: 2px;">Served Area</strong>
Globally
</div>
</div>
</div>
</div>
</div>
<div class="footer-bottom">
<div class="footer-copy">
© 2024-<span id="year">2024</span> MainRoute Core. <a class="txt-bold" href="/Redirect/?id=mrc target="_blank">M Ramzan Ch</a> | <a class="txt-bold" href="/Redirect/?id=pb" target="_blank"">Pro Bandey</a>. All Rights Reserved.
</div>
<div class="footer-made-in">
Engineered with <svg class="icon"
style="color: var(--mrc); fill: var(--mrc); width: 14px; height: 14px;">
<use href="/src/global.svg#icon-heart"></use>
</svg> in Tech
</div>
</div>
</div>
</footer>
<script src="/js/global.js"></script>
</body>
</html>