diff --git a/website/assets/clip-city.mp4 b/website/assets/clip-city.mp4 new file mode 100644 index 0000000..2ebc59e Binary files /dev/null and b/website/assets/clip-city.mp4 differ diff --git a/website/assets/clip-drone.mp4 b/website/assets/clip-drone.mp4 new file mode 100644 index 0000000..ea85e1e Binary files /dev/null and b/website/assets/clip-drone.mp4 differ diff --git a/website/assets/clip-jet.mp4 b/website/assets/clip-jet.mp4 new file mode 100644 index 0000000..b006ce7 Binary files /dev/null and b/website/assets/clip-jet.mp4 differ diff --git a/website/assets/clip-ship.mp4 b/website/assets/clip-ship.mp4 new file mode 100644 index 0000000..bcd11b4 Binary files /dev/null and b/website/assets/clip-ship.mp4 differ diff --git a/website/assets/clip-wildfire.mp4 b/website/assets/clip-wildfire.mp4 new file mode 100644 index 0000000..b898d65 Binary files /dev/null and b/website/assets/clip-wildfire.mp4 differ diff --git a/website/index.html b/website/index.html index a481dd4..9f75a7a 100644 --- a/website/index.html +++ b/website/index.html @@ -17,7 +17,8 @@ --pop:cubic-bezier(.2,.9,.3,1.15); } *{margin:0;padding:0;box-sizing:border-box} -html{scroll-behavior:smooth;background:var(--ink)} +html{background:var(--ink)} +@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}} body{background:var(--bg);color:var(--ink);font-family:var(--f1);font-size:16px;line-height:1.5;overflow-x:hidden} img{display:block;max-width:100%} a{color:inherit;text-decoration:none} @@ -30,16 +31,13 @@ .reveal.in{opacity:1;transform:none} /* nav */ -.nav{position:fixed;z-index:100;top:18px;left:28px;right:28px;height:64px;display:flex;align-items:center;justify-content:space-between; - transition:transform .45s var(--ease)} -.nav.hide{transform:translateY(-170%)} +.nav{position:absolute;z-index:100;top:18px;left:28px;right:28px;height:64px;display:flex;align-items:center;justify-content:space-between} .nav-pill{position:absolute;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:6px;padding:5px;border-radius:999px; background:rgba(255,255,255,.07); backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5); border:1px solid rgba(255,255,255,.16); box-shadow:0 8px 32px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.2)} .brand{display:flex;align-items:center;gap:11px;color:#fff;font-family:var(--f2);font-size:21px;font-weight:700;letter-spacing:2.5px;transition:opacity .3s,visibility .3s} -.on-light .brand{opacity:0;visibility:hidden;pointer-events:none} .brand:hover{opacity:.75} .brand svg{display:block;flex:none} .btn{height:40px;padding:0 24px;background:#fff;color:var(--ink);border:1px solid var(--ink);font-size:16px; @@ -70,21 +68,6 @@ .icon-btn:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.32)} .icon-btn:active{transform:scale(.95)} .icon-btn svg{stroke:#fff;display:block} -.on-light .nav-pill,.on-light .icon-btn{ - background:rgba(30,33,36,.1); - border-color:rgba(30,33,36,.16); - box-shadow:0 8px 28px rgba(0,0,0,.1),inset 0 1px 0 rgba(255,255,255,.4)} -.on-light .gh-btn{ - background:rgba(30,33,36,.78); - border-color:rgba(30,33,36,.85); - box-shadow:0 10px 30px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.18)} -.on-light .gh-btn:hover{background:rgba(30,33,36,.9)} -.on-light .icon-btn:hover{background:rgba(30,33,36,.18);border-color:rgba(30,33,36,.3)} -.on-light .nav-links a{color:var(--ink)} -.on-light .nav-links a:hover{background:rgba(30,33,36,.1)} -.on-light .nav-search svg{stroke:var(--ink)} -.on-light .nav-div{background:rgba(30,33,36,.18)} - /* hero */ .hero{position:relative;height:calc(100vh + 48px);min-height:640px;overflow:hidden;background:#0d0e10} .hero-media{position:absolute;inset:0;animation:kenburns 10s var(--ease) forwards} @@ -120,6 +103,8 @@ .slide-media{position:relative;flex:1;overflow:hidden} .slide-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:translateX(var(--pan,70px)) scale(1.05);transition:opacity .5s var(--ease),transform 1.2s var(--ease)} .slide-media img.show{opacity:1;transform:none} +.slide-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s var(--ease)} +.slide-media video.show{opacity:1} .slide-veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(30,33,36,.2),rgba(30,33,36,.45))} .slide-card{position:absolute;left:24px;top:24px;z-index:2;width:min(600px,80%);background:rgba(20,22,25,.5);backdrop-filter:blur(8px);padding:24px;color:#fff;border-radius:4px} .slide-tag{font-family:var(--f2);font-size:10px;letter-spacing:1.5px;text-transform:uppercase;opacity:.75;margin-bottom:12px} @@ -171,8 +156,8 @@ .careers{padding:110px 0 120px} .careers-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:80px;align-items:center} .careers-img{overflow:hidden;box-shadow:0 40px 80px rgba(0,0,0,.22)} -.careers-img img{width:100%;display:block;object-fit:cover;transition:transform 1.2s var(--ease)} -.careers-grid:hover .careers-img img{transform:scale(1.04)} +.careers-img img,.careers-img video{width:100%;display:block;object-fit:cover;transition:transform 1.2s var(--ease)} +.careers-grid:hover .careers-img img,.careers-grid:hover .careers-img video{transform:scale(1.04)} .careers-txt{text-align:left} .careers-eyebrow{font-family:var(--f2);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin-bottom:24px} .careers-txt h2{font-family:var(--f1);font-size:clamp(36px,3.8vw,58px);line-height:1.08;letter-spacing:-.025em;margin-bottom:26px} @@ -188,7 +173,7 @@ .partners h2{font-size:clamp(30px,3.6vw,52px);letter-spacing:-.01em;max-width:760px;line-height:1.12;margin-bottom:44px} .marquee{display:flex;gap:20px;width:max-content;animation:scroll 60s linear infinite;padding:0 10px} .marquee:hover{animation-play-state:paused} -@keyframes scroll{to{transform:translateX(-50%)}} +@keyframes scroll{to{transform:translateX(-33.3333%)}} .quote{width:300px;flex:none;background:#fff;padding:22px;display:flex;flex-direction:column;gap:16px;border:1px solid var(--line);transition:transform .3s var(--ease),box-shadow .3s} .quote:hover{transform:translateY(-5px);box-shadow:0 16px 36px rgba(0,0,0,.08)} .quote h3{font-family:var(--f2);font-size:14px;letter-spacing:1.5px} @@ -257,6 +242,13 @@ .careers-grid{grid-template-columns:1fr} .ctas{grid-template-columns:1fr} } +@media(max-width:640px){ + .updates .wrap{padding:0 16px} + .slide{padding:20px 14px 0} + .dot{width:13px} + .stage-dots{gap:5px} + .stage-btn{width:40px;height:40px} +} @@ -311,6 +303,7 @@
+
@@ -341,7 +334,7 @@
-
Velocity replaying recorded traffic from your own disk
+
The Archive

History nobody can take back

@@ -404,15 +397,15 @@

What it will not pretend