-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathapply.html
More file actions
286 lines (261 loc) · 22.6 KB
/
Copy pathapply.html
File metadata and controls
286 lines (261 loc) · 22.6 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
<!DOCTYPE html>
<html class="dark" lang="en">
<head>
<meta charset="utf-8"/>
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
<title>Cornell Hyperloop — Apply</title>
<meta name="description" content="Apply to join Cornell Hyperloop. Learn roles, recruitment timeline, and how to get involved with the team."/>
<meta name="robots" content="index,follow"/>
<link rel="canonical" href="https://www.cornellhyperloop.com/apply.html"/>
<meta property="og:title" content="Cornell Hyperloop — Apply"/>
<meta property="og:description" content="Apply to join Cornell Hyperloop. Learn roles, recruitment timeline, and how to get involved with the team."/>
<meta property="og:type" content="website"/>
<meta property="og:url" content="https://www.cornellhyperloop.com/apply.html"/>
<meta property="og:image" content="https://www.cornellhyperloop.com/res/2025springhyperloop.avif"/>
<meta property="og:image:alt" content="Cornell Hyperloop team at competition"/>
<meta property="og:site_name" content="Cornell Hyperloop"/>
<meta name="twitter:card" content="summary_large_image"/>
<meta name="twitter:title" content="Cornell Hyperloop — Apply"/>
<meta name="twitter:description" content="Apply to join Cornell Hyperloop. Learn roles, recruitment timeline, and how to get involved with the team."/>
<meta name="twitter:image" content="https://www.cornellhyperloop.com/res/2025springhyperloop.avif"/>
<link rel="icon" href="/favicon.png?v=6" type="image/png"/>
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; base-uri 'self'; form-action 'self'; img-src 'self' data: https:; font-src 'self' data:; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline'; connect-src 'self'; frame-src https://www.youtube.com; worker-src 'self'; object-src 'none'"/>
<link rel="stylesheet" href="res/tw.css?v=8"/>
<style>
html { scroll-behavior: smooth; }
@font-face{font-family:'Material Symbols Outlined';src:url('res/fonts/material-symbols-outlined.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('res/fonts/inter/inter-variablefont_opsz,wght.subset.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('res/fonts/inter/inter-italic-variablefont_opsz,wght.ttf') format('truetype');font-weight:100 900;font-style:italic;font-display:swap}
@font-face{font-family:'Space Grotesk';src:url('res/fonts/space_grotesk/spacegrotesk-variablefont_wght.subset.woff2') format('woff2');font-weight:300 700;font-style:normal;font-display:swap}
.material-symbols-outlined{font-family:'Material Symbols Outlined';font-weight:normal;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-feature-settings:'liga';-webkit-font-smoothing:antialiased}
.material-symbols-outlined { font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24 }
.grid-overlay {
background-image: linear-gradient(to right, rgba(255,255,255,0.05) 1px, transparent 1px),
linear-gradient(to bottom, rgba(255,255,255,0.05) 1px, transparent 1px);
background-size: 40px 40px;
}
html,body{background:#0c1324;color:#dce1fb;overflow-x:hidden}
.card-hover-line::after {
content: '';
position: absolute;
bottom: 0; left: 0;
width: 0; height: 2px;
background: #d22b2b;
transition: width 0.4s ease;
}
.card-hover-line:hover::after { width: 100%; }
</style>
</head>
<body class="bg-background text-on-background font-body-md text-body-md overflow-x-hidden">
<div id="nav-placeholder"></div>
<main>
<!-- Hero -->
<section class="relative py-28 md:py-28 border-b border-outline-variant overflow-hidden">
<div class="grid-overlay absolute inset-0 opacity-30"></div>
<div class="absolute inset-0 z-0">
<img src="res/recruitment.avif" alt="Cornell Hyperloop pod" class="w-full h-full object-cover opacity-40"/>
<div class="absolute inset-0 bg-gradient-to-r from-background via-background/80 to-background/40"></div>
</div>
<div class="relative z-10 max-w-container-max mx-auto px-6 md:px-margin">
<div class="border-l-2 border-primary-container pl-8 max-w-3xl">
<span class="font-label-caps text-label-caps text-primary tracking-[0.2em] uppercase flex items-center gap-2 mb-4">
<span class="w-8 h-[1px] bg-primary block"></span>Recruitment
</span>
<h1 class="font-headline-xl text-headline-xl text-on-surface uppercase tracking-tighter mb-6" style="font-size:clamp(1.75rem,10vw,4rem)">
Join the<br/><span class="text-primary-container">Team.</span>
</h1>
<p class="font-body-lg text-body-lg text-on-surface-variant mb-8">
Our team is open to students from all majors and backgrounds who bring dedication and a drive to build the future of transportation.
</p>
<div class="flex flex-wrap gap-4">
<a href="#coffee-chat" class="bg-primary-container text-on-primary-container font-label-caps text-label-caps uppercase px-8 py-4 tracking-widest hover:bg-primary transition-colors duration-200 inline-flex items-center gap-2">
Book a Coffee Chat <span class="material-symbols-outlined text-base">calendar_today</span>
</a>
<a href="#process" class="border border-outline text-on-surface font-label-caps text-label-caps uppercase px-8 py-4 tracking-widest hover:bg-surface-container-high transition-colors duration-200 inline-block">
Recruitment Timeline
</a>
</div>
</div>
</div>
</section>
<!-- Recruitment Timeline -->
<section id="process" class="py-24 border-b border-outline-variant bg-surface-container-low relative overflow-hidden">
<div class="grid-overlay absolute inset-0 opacity-10"></div>
<div class="relative z-10 max-w-container-max mx-auto px-margin">
<div class="mb-16">
<span class="font-label-caps text-label-caps text-primary tracking-[0.2em] uppercase flex items-center gap-2 mb-4">
<span class="w-8 h-[1px] bg-primary block"></span>Process
</span>
<h2 class="font-headline-lg text-headline-lg text-on-surface uppercase mb-4">
Recruitment <span class="text-primary">Timeline</span>
</h2>
<p class="font-body-md text-body-md text-on-surface-variant max-w-2xl">
Thank you for your interest in joining Cornell Hyperloop! Applications are not open yet, so check back later. In the meantime, come meet the team at the events below.
</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-gutter relative">
<div class="relative z-10 bg-surface border border-outline-variant p-6 hover:border-primary-container transition-colors duration-300">
<span class="absolute top-4 right-4 font-label-caps text-[10px] text-outline-variant">REQ-01</span>
<div class="font-mono-stats text-mono-stats text-primary mb-4 border-l-4 border-primary-container pl-4">01</div>
<h3 class="font-headline-md text-headline-md text-on-surface mb-2 uppercase">Recruitment Begins</h3>
<p class="font-body-md text-body-md text-on-surface-variant mb-4">The project team recruitment cycle opens for the fall semester.</p>
<span class="font-label-caps text-label-caps text-secondary">MONDAY, AUG. 17</span>
</div>
<div class="relative z-10 bg-surface border border-outline-variant p-6 hover:border-primary-container transition-colors duration-300">
<span class="absolute top-4 right-4 font-label-caps text-[10px] text-outline-variant">REQ-02</span>
<div class="font-mono-stats text-mono-stats text-primary mb-4 border-l-4 border-primary-container pl-4">02</div>
<h3 class="font-headline-md text-headline-md text-on-surface mb-2 uppercase">Project Teams Fest</h3>
<p class="font-body-md text-body-md text-on-surface-variant mb-4">Stop by to connect with Cornell project teams across campus.</p>
<span class="font-label-caps text-label-caps text-secondary">TUESDAY, SEPT. 1 · 4-6 P.M. · DUFFIELD ATRIUM</span>
</div>
<div class="relative z-10 bg-surface border border-outline-variant p-6 hover:border-primary-container transition-colors duration-300">
<span class="absolute top-4 right-4 font-label-caps text-[10px] text-outline-variant">REQ-03</span>
<div class="font-mono-stats text-mono-stats text-primary mb-4 border-l-4 border-primary-container pl-4">03</div>
<h3 class="font-headline-md text-headline-md text-on-surface mb-2 uppercase">Info Session #1</h3>
<p class="font-body-md text-body-md text-on-surface-variant mb-4">Meet the team and learn more about the recruitment process.</p>
<span class="font-label-caps text-label-caps text-secondary">DATE TBA · LOCATION TBA</span>
</div>
<div class="relative z-10 bg-surface border border-outline-variant p-6 hover:border-primary-container transition-colors duration-300">
<span class="absolute top-4 right-4 font-label-caps text-[10px] text-outline-variant">REQ-04</span>
<div class="font-mono-stats text-mono-stats text-primary mb-4 border-l-4 border-primary-container pl-4">04</div>
<h3 class="font-headline-md text-headline-md text-on-surface mb-2 uppercase">Info Session #2</h3>
<p class="font-body-md text-body-md text-on-surface-variant mb-4">A second chance to connect with the team and ask questions.</p>
<span class="font-label-caps text-label-caps text-secondary">DATE TBA · LOCATION TBA</span>
</div>
<div class="relative z-10 bg-surface border border-outline-variant p-6 hover:border-primary-container transition-colors duration-300">
<span class="absolute top-4 right-4 font-label-caps text-[10px] text-outline-variant">REQ-05</span>
<div class="font-mono-stats text-mono-stats text-primary mb-4 border-l-4 border-primary-container pl-4">05</div>
<h3 class="font-headline-md text-headline-md text-on-surface mb-2 uppercase">Upperclassmen Apps Due</h3>
<p class="font-body-md text-body-md text-on-surface-variant mb-4">Submit your application before the deadline if you're applying as an upperclassman.</p>
<span class="font-label-caps text-label-caps text-secondary">SEPT. 3 · 11:59 P.M.</span>
</div>
<div class="relative z-10 bg-surface border border-outline-variant p-6 hover:border-primary-container transition-colors duration-300">
<span class="absolute top-4 right-4 font-label-caps text-[10px] text-outline-variant">REQ-06</span>
<div class="font-mono-stats text-mono-stats text-primary mb-4 border-l-4 border-primary-container pl-4">06</div>
<h3 class="font-headline-md text-headline-md text-on-surface mb-2 uppercase">Club Fest</h3>
<p class="font-body-md text-body-md text-on-surface-variant mb-4">Come meet the team and learn where Hyperloop fits into Cornell's project team community.</p>
<span class="font-label-caps text-label-caps text-secondary">SATURDAY, SEPT. 5 · 12-1:30 P.M. · ARTS QUAD</span>
</div>
<div class="relative z-10 bg-surface border border-outline-variant p-6 hover:border-primary-container transition-colors duration-300 md:col-span-2 xl:col-span-1">
<span class="absolute top-4 right-4 font-label-caps text-[10px] text-outline-variant">REQ-07</span>
<div class="font-mono-stats text-mono-stats text-primary mb-4 border-l-4 border-primary-container pl-4">07</div>
<h3 class="font-headline-md text-headline-md text-on-surface mb-2 uppercase">First-Year & Transfer Apps Due</h3>
<p class="font-body-md text-body-md text-on-surface-variant mb-4">Submit your application before the final deadline if you're a first-year or transfer student.</p>
<span class="font-label-caps text-label-caps text-secondary">OCT. 15 · 11:59 P.M.</span>
</div>
</div>
</div>
</section>
<!-- Apply Now + Coffee Chat -->
<section class="py-24 border-t border-outline-variant relative overflow-hidden">
<div class="grid-overlay absolute inset-0 opacity-10"></div>
<div class="relative z-10 max-w-container-max mx-auto px-margin">
<div class="grid grid-cols-1 md:grid-cols-2 gap-gutter">
<!-- Apply Now -->
<div class="bg-surface-container border border-outline-variant p-10 relative hover:border-primary-container transition-colors duration-300">
<span class="absolute top-4 right-4 font-label-caps text-[10px] text-outline-variant">ACT-01</span>
<span class="font-label-caps text-label-caps text-primary tracking-[0.2em] uppercase flex items-center gap-2 mb-6">
<span class="w-6 h-[1px] bg-primary block"></span>Ready to Build
</span>
<h2 class="font-headline-lg text-headline-lg text-on-surface uppercase mb-4">Apply Now</h2>
<p class="font-body-lg text-body-lg text-on-surface-variant mb-8">
Applications are not open yet. Check back later once recruitment begins, and use the timeline above to plan around key deadlines.
</p>
<a href="https://docs.google.com/forms/d/1sPtAzhjPhRhKtASWjQM1wjvRpK3uUw3u0lAEz_C1fdw/viewform?edit_requested=true" target="_blank" rel="noopener noreferrer" class="bg-primary-container text-on-primary-container font-label-caps text-label-caps uppercase px-8 py-4 tracking-widest hover:bg-primary transition-colors duration-200 inline-flex items-center gap-2">
Check Back Later <span class="material-symbols-outlined text-base">arrow_forward</span>
</a>
</div>
<!-- Coffee Chat -->
<div id="coffee-chat" class="bg-surface-container-low border border-outline-variant p-10 relative hover:border-primary-container transition-colors duration-300">
<span class="absolute top-4 right-4 font-label-caps text-[10px] text-outline-variant">ACT-02</span>
<span class="font-label-caps text-label-caps text-primary tracking-[0.2em] uppercase flex items-center gap-2 mb-6">
<span class="w-6 h-[1px] bg-primary block"></span>Have Questions?
</span>
<h2 class="font-headline-lg text-headline-lg text-on-surface uppercase mb-4">Book a Coffee Chat</h2>
<p class="font-body-lg text-body-lg text-on-surface-variant mb-8">
Schedule a 15–30 minute conversation with a current team member. We'll help you understand the team, our learning experiences, and how you can contribute.
</p>
<a href="https://docs.google.com/spreadsheets/d/1dNMgZvfc6trl_DMQmWL9ydKeLyWDeT2Gayc5EeEScpw/edit?gid=0#gid=0" target="_blank" rel="noopener noreferrer" class="border border-outline text-on-surface font-label-caps text-label-caps uppercase px-8 py-4 tracking-widest hover:bg-surface-container-high transition-colors duration-200 inline-flex items-center gap-2">
Book Now <span class="material-symbols-outlined text-base">calendar_today</span>
</a>
</div>
</div>
</div>
</section>
<!-- Open Roles -->
<section id="roles" class="py-24 border-t border-outline-variant relative overflow-hidden">
<div class="grid-overlay absolute inset-0 opacity-10"></div>
<div class="relative z-10 max-w-container-max mx-auto px-margin">
<div class="flex items-center gap-4 mb-12">
<span class="font-label-caps text-label-caps text-primary tracking-[0.2em] uppercase flex items-center gap-2">
<span class="w-8 h-[1px] bg-primary block"></span>Open Roles
</span>
<div class="h-px bg-outline-variant flex-grow opacity-50"></div>
<span class="font-label-caps text-label-caps text-on-surface-variant uppercase">ROL-06</span>
</div>
<p class="font-body-lg text-body-lg text-on-surface-variant max-w-2xl mb-12">
We recruit across all engineering disciplines and backgrounds. Find the subteam that matches your skills and ambitions.
</p>
<div class="grid grid-cols-1 md:grid-cols-3 gap-gutter">
<a href="subteam-views/subteam-structures.html" class="group relative bg-surface-container border border-outline-variant p-6 hover:border-primary-container transition-colors duration-300 card-hover-line overflow-hidden block">
<span class="absolute top-4 right-4 font-label-caps text-[10px] text-outline-variant group-hover:text-primary transition-colors">UNIT-M1</span>
<span class="material-symbols-outlined text-primary-container text-3xl mb-4 block">architecture</span>
<h3 class="font-headline-md text-headline-md text-primary mb-2 uppercase">Structures</h3>
<p class="font-body-md text-body-md text-on-surface-variant mb-4 text-sm">Aerospace-grade chassis and aeroshell design. CAD, FEA, and composite manufacturing.</p>
<span class="font-label-caps text-label-caps text-primary border border-outline-variant px-4 py-2 group-hover:border-primary group-hover:bg-surface-container-high transition-all duration-200 inline-flex items-center gap-2">
Learn More <span class="material-symbols-outlined text-base">arrow_forward</span>
</span>
</a>
<a href="subteam-views/subteam-braking.html" class="group relative bg-surface-container border border-outline-variant p-6 hover:border-primary-container transition-colors duration-300 card-hover-line overflow-hidden block">
<span class="absolute top-4 right-4 font-label-caps text-[10px] text-outline-variant group-hover:text-primary transition-colors">UNIT-M2</span>
<span class="material-symbols-outlined text-primary-container text-3xl mb-4 block">speed</span>
<h3 class="font-headline-md text-headline-md text-primary mb-2 uppercase">Braking</h3>
<p class="font-body-md text-body-md text-on-surface-variant mb-4 text-sm">Fail-safe friction and eddy-current braking systems for sub-sonic deceleration.</p>
<span class="font-label-caps text-label-caps text-primary border border-outline-variant px-4 py-2 group-hover:border-primary group-hover:bg-surface-container-high transition-all duration-200 inline-flex items-center gap-2">
Learn More <span class="material-symbols-outlined text-base">arrow_forward</span>
</span>
</a>
<a href="subteam-views/subteam-magnetic.html" class="group relative bg-surface-container border border-outline-variant p-6 hover:border-primary-container transition-colors duration-300 card-hover-line overflow-hidden block">
<span class="absolute top-4 right-4 font-label-caps text-[10px] text-outline-variant group-hover:text-primary transition-colors">UNIT-M3</span>
<span class="material-symbols-outlined text-primary-container text-3xl mb-4 block">ssid_chart</span>
<h3 class="font-headline-md text-headline-md text-primary mb-2 uppercase">Magnetics</h3>
<p class="font-body-md text-body-md text-on-surface-variant mb-4 text-sm">Magnetic levitation and linear induction motor systems for contactless propulsion.</p>
<span class="font-label-caps text-label-caps text-primary border border-outline-variant px-4 py-2 group-hover:border-primary group-hover:bg-surface-container-high transition-all duration-200 inline-flex items-center gap-2">
Learn More <span class="material-symbols-outlined text-base">arrow_forward</span>
</span>
</a>
<a href="subteam-views/subteam-ecc.html" class="group relative bg-surface-container border border-outline-variant p-6 hover:border-primary-container transition-colors duration-300 card-hover-line overflow-hidden block">
<span class="absolute top-4 right-4 font-label-caps text-[10px] text-outline-variant group-hover:text-primary transition-colors">UNIT-E1</span>
<span class="material-symbols-outlined text-primary-container text-3xl mb-4 block">developer_board</span>
<h3 class="font-headline-md text-headline-md text-primary mb-2 uppercase">ECC</h3>
<p class="font-body-md text-body-md text-on-surface-variant mb-4 text-sm">Electronics, Controls & Communications. Embedded systems, sensor fusion, and telemetry.</p>
<span class="font-label-caps text-label-caps text-primary border border-outline-variant px-4 py-2 group-hover:border-primary group-hover:bg-surface-container-high transition-all duration-200 inline-flex items-center gap-2">
Learn More <span class="material-symbols-outlined text-base">arrow_forward</span>
</span>
</a>
<a href="subteam-views/subteam-power.html" class="group relative bg-surface-container border border-outline-variant p-6 hover:border-primary-container transition-colors duration-300 card-hover-line overflow-hidden block">
<span class="absolute top-4 right-4 font-label-caps text-[10px] text-outline-variant group-hover:text-primary transition-colors">UNIT-E2</span>
<span class="material-symbols-outlined text-primary-container text-3xl mb-4 block">electric_bolt</span>
<h3 class="font-headline-md text-headline-md text-primary mb-2 uppercase">Power Systems</h3>
<p class="font-body-md text-body-md text-on-surface-variant mb-4 text-sm">High-voltage battery packs and power distribution. Thermal management and energy optimization.</p>
<span class="font-label-caps text-label-caps text-primary border border-outline-variant px-4 py-2 group-hover:border-primary group-hover:bg-surface-container-high transition-all duration-200 inline-flex items-center gap-2">
Learn More <span class="material-symbols-outlined text-base">arrow_forward</span>
</span>
</a>
<a href="subteam-views/subteam-business.html" class="group relative bg-surface-container border border-outline-variant p-6 hover:border-primary-container transition-colors duration-300 card-hover-line overflow-hidden block">
<span class="absolute top-4 right-4 font-label-caps text-[10px] text-outline-variant group-hover:text-primary transition-colors">UNIT-B1</span>
<span class="material-symbols-outlined text-primary-container text-3xl mb-4 block">groups</span>
<h3 class="font-headline-md text-headline-md text-primary mb-2 uppercase">Business</h3>
<p class="font-body-md text-body-md text-on-surface-variant mb-4 text-sm">Sponsorships, outreach, and team operations. The backbone sustaining our engineering mission.</p>
<span class="font-label-caps text-label-caps text-primary border border-outline-variant px-4 py-2 group-hover:border-primary group-hover:bg-surface-container-high transition-all duration-200 inline-flex items-center gap-2">
Learn More <span class="material-symbols-outlined text-base">arrow_forward</span>
</span>
</a>
</div>
</div>
</section>
</main>
<div id="footer-placeholder"></div>
<script src="shared.js?v=8"></script>
</body>
</html>