diff --git a/website/assets/hero-bg.mp4 b/website/assets/hero-bg.mp4
new file mode 100644
index 00000000..e31f060c
Binary files /dev/null and b/website/assets/hero-bg.mp4 differ
diff --git a/website/index.html b/website/index.html
index e41245cb..a481dd45 100644
--- a/website/index.html
+++ b/website/index.html
@@ -17,7 +17,7 @@
   --pop:cubic-bezier(.2,.9,.3,1.15);
 }
 *{margin:0;padding:0;box-sizing:border-box}
-html{scroll-behavior:smooth}
+html{scroll-behavior:smooth;background:var(--ink)}
 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,37 +30,75 @@
 .reveal.in{opacity:1;transform:none}
 
 /* nav */
-.nav{position:fixed;z-index:100;top:16px;left:60px;right:60px;height:70px;display:flex;align-items:center;justify-content:space-between;
-  padding:0 20px;border-radius:10px;background:rgba(171,171,171,.1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
-  box-shadow:0 2px 10px rgba(0,0,0,.1);transition:background .35s,box-shadow .35s,transform .45s var(--ease),top .45s var(--ease)}
-.nav.scrolled{background:rgba(24,26,30,.5);box-shadow:0 8px 28px rgba(0,0,0,.25)}
-.nav.hide{transform:translateY(-110%)}
-.logo{font-family:var(--f2);font-size:18px;font-weight:500;letter-spacing:2px;color:#fff;transition:opacity .25s}
-.logo:hover{opacity:.7}
-.nav-actions{display:flex;align-items:center;gap:10px}
+.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-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;
   display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:background .22s,color .22s,transform .12s}
-.nav .btn{width:232px}
 .btn:hover{background:var(--ink);color:#fff}
 .btn:active{transform:scale(.97)}
-.icon-btn{width:40px;height:40px;background:#fff;border:1px solid var(--ink);display:inline-flex;align-items:center;justify-content:center;transition:background .22s,transform .12s}
-.icon-btn:hover{background:var(--ink)}
-.icon-btn:hover svg{stroke:#fff}
-.icon-btn svg{stroke:var(--ink);transition:stroke .22s}
-.icon-btn:active{transform:scale(.94)}
+.gh-btn{height:50px;padding:0 30px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;color:#fff;font-size:15px;font-weight:600;
+  background:rgba(255,255,255,.12);
+  backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5);
+  border:1px solid rgba(255,255,255,.24);
+  box-shadow:0 8px 32px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.3);
+  transition:background .3s,border-color .3s,transform .15s}
+.gh-btn:hover{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.4)}
+.gh-btn:active{transform:scale(.97)}
+.nav-right{display:flex;align-items:center;gap:12px}
+.nav-div{width:1px;height:18px;background:rgba(255,255,255,.18);margin:0 2px;flex:none}
+.nav-search{width:36px;height:36px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex:none;transition:background .25s}
+.nav-search:hover{background:rgba(255,255,255,.16)}
+.nav-search svg{stroke:#fff;display:block}
+.nav-links a{color:#fff;font-size:13.5px;font-weight:600;font-family:var(--f2);letter-spacing:.4px;padding:10px 15px;border-radius:999px;transition:background .25s}
+.nav-links a:hover{background:rgba(255,255,255,.14)}
+.icon-btn{width:50px;height:50px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
+  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);
+  transition:background .3s,border-color .3s,transform .15s}
+.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:100vh;min-height:640px;overflow:hidden;background:#0d0e10}
+.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}
-.hero-media img,.hero-media video{width:100%;height:120%;object-fit:cover;object-position:center top;display:block;filter:contrast(1.07) saturate(1.1)}
+.hero-media img,.hero-media video{width:100%;height:134%;object-fit:cover;object-position:center top;display:block;filter:contrast(1.07) saturate(1.1)}
+.hero-media video{opacity:0;transition:opacity 1.2s var(--ease)}
+.hero-media video.on{opacity:1}
 @keyframes kenburns{from{transform:scale(1.07)}to{transform:scale(1)}}
 .hero-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(30,33,36,.55) 0%,rgba(30,33,36,.18) 45%,rgba(30,33,36,.12) 100%)}
-.hero-content{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:110px 24px 100px;text-align:center}
+.hero-content{position:relative;z-index:2;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:110px 24px 100px;text-align:center}
 .hero-line{font-family:var(--f2);font-weight:500;font-size:clamp(46px,6vw,86px);letter-spacing:-.033em;line-height:1.06;color:#fff;
   opacity:0;transform:translateY(28px);animation:rise .9s var(--ease) forwards}
 .hero-line:nth-child(2){animation-delay:.15s}
 @keyframes rise{to{opacity:1;transform:none}}
-.scroll-cue{position:absolute;bottom:32px;left:50%;transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:9px;
+.scroll-cue{position:absolute;bottom:80px;left:50%;transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:9px;
   color:#efefef;font-size:12px;letter-spacing:2px;font-family:var(--f2);text-transform:uppercase;opacity:0;animation:fadein .8s .8s forwards;transition:opacity .25s}
 .scroll-cue:hover{opacity:.6}
 .scroll-cue svg{animation:bob 2.4s ease-in-out infinite}
@@ -68,66 +106,82 @@
 @keyframes fadein{to{opacity:1}}
 
 /* updates */
-.updates{padding:100px 0 70px}
+.updates{position:relative;margin-top:-48px;padding:64px 0 48px}
+.updates .wrap{max-width:none;padding:0 48px}
 .updates-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:26px;gap:20px}
-.tabs{display:flex;flex-wrap:wrap;gap:4px 22px}
-.tab{padding:6px 2px;font-size:15px;color:var(--ink);border-bottom:2px solid transparent;transition:color .2s,border-color .2s}
-.tab:hover{color:var(--muted)}
-.tab.active{border-color:var(--ink);font-weight:500}
-.see-all{font-family:var(--f2);font-size:10px;letter-spacing:1.5px;text-transform:uppercase;text-decoration:underline;text-underline-offset:4px;white-space:nowrap;transition:opacity .25s}
-.see-all:hover{opacity:.55}
+.tabs{display:flex;flex-wrap:wrap;gap:8px}
+.tab{padding:9px 16px;font-size:16px;color:var(--muted);background:rgba(30,33,36,.06);border-radius:4px;border:none;transition:background .2s,color .2s,box-shadow .2s}
+.tab:hover{color:var(--ink);background:rgba(30,33,36,.1)}
+.tab.active{background:#fff;color:var(--ink);box-shadow:0 1px 5px rgba(0,0,0,.14)}
+.see-all{font-family:var(--f2);font-size:11px;letter-spacing:1.2px;text-transform:uppercase;white-space:nowrap;padding:10px 16px;border:1px solid var(--ink);border-radius:4px;transition:background .22s,color .22s}
+.see-all:hover{background:var(--ink);color:#fff}
 .stage{position:relative}
-.slide{position:relative;height:min(86vh,940px);min-height:560px;margin:0 auto;overflow:hidden;background:#141518;border-radius:6px;padding:40px 24px 0;display:flex;flex-direction:column}
+.slide{position:relative;height:calc(100vh - 190px);min-height:560px;margin:0 auto;overflow:hidden;background:#141518;border-radius:6px;padding:36px 24px 0;display:flex;flex-direction:column}
 .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:scale(1.03);transition:opacity .55s var(--ease),transform 1s var(--ease)}
-.slide-media img.show{opacity:1;transform:scale(1)}
+.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-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}
 .slide-title{font-size:clamp(18px,2vw,26px);line-height:1.25;display:flex;justify-content:space-between;gap:20px;align-items:flex-start}
 .slide-title .arr{font-size:26px;transition:transform .25s var(--ease)}
 .slide:hover .slide-title .arr{transform:translate(5px,-5px)}
-.slide-bar{height:90px;flex:none;display:flex;align-items:center;justify-content:space-between}
+.slide-bar{height:72px;flex:none;display:flex;align-items:center;justify-content:space-between}
 .stage-nav{display:flex;gap:10px}
-.stage-btn{width:48px;height:48px;background:rgba(255,255,255,.14);color:#fff;font-size:20px;display:flex;align-items:center;justify-content:center;transition:background .25s,transform .12s}
-.stage-btn:hover{background:rgba(255,255,255,.32)}
+.stage-btn{width:52px;height:52px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);color:#fff;display:flex;align-items:center;justify-content:center;line-height:0;transition:background .25s,border-color .25s,transform .12s}
+.stage-btn svg{display:block;stroke:#fff}
+.stage-btn:hover{background:rgba(255,255,255,.28);border-color:rgba(255,255,255,.3)}
 .stage-btn:active{transform:scale(.93)}
 .stage-dots{display:flex;gap:7px}
-.dot{width:22px;height:2px;background:rgba(255,255,255,.35);cursor:pointer;transition:background .25s}
-.dot.active{background:#fff}
+.dot{position:relative;width:26px;height:2px;background:rgba(255,255,255,.28);cursor:pointer;overflow:hidden;transition:background .25s}
+.dot:hover{background:rgba(255,255,255,.5)}
+.dot::after{content:"";position:absolute;inset:0;background:#fff;transform:scaleX(0);transform-origin:left}
+.dot.active::after{animation:dotfill 6.5s linear forwards}
+.slide:hover .dot.active::after{animation-play-state:paused}
+@keyframes dotfill{to{transform:scaleX(1)}}
+.slide-card.anim{animation:cardIn .7s var(--ease)}
+@keyframes cardIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
+.stage.reveal{transition-delay:.15s}
 
 /* statement */
-.statement{padding:130px 0 110px;text-align:left}
-.statement p{max-width:1180px;font-size:clamp(28px,3.4vw,48px);line-height:1.32;letter-spacing:-.015em}
-.scrub span{display:inline-block;color:var(--ink);opacity:.1;transform:translateY(.32em);filter:blur(3px);transition:opacity .45s var(--ease),transform .45s var(--ease),filter .45s var(--ease)}
-.scrub span.lit{opacity:1;transform:none;filter:blur(0)}
+.statement{padding:140px 0 120px;text-align:center}
+.statement p{max-width:1300px;margin:0 auto;font-size:clamp(30px,3.5vw,56px);line-height:1.34;letter-spacing:-.02em}
+.scrub span{color:var(--ink);opacity:.13;filter:blur(1.5px);transition:opacity .4s linear,filter .4s linear}
+.scrub span.lit{opacity:1;filter:blur(0)}
 .scrub span.lit.strong{text-shadow:0 0 1px currentColor}
 
 /* software */
-.soft{padding:20px 0 100px}
-.soft .wrap{position:relative}
+.soft{padding:40px 0 60px}
+.soft-title{font-size:18px;font-weight:400;padding:100px 48px 24px;letter-spacing:0}
 .earmark{font-family:var(--f2);font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--earmark);margin-bottom:26px}
-.row{display:grid;grid-template-columns:1fr 460px;align-items:center;gap:24px;padding:26px 4px;border-top:1px solid var(--line);transition:background .25s}
+.row{position:relative;display:flex;flex-direction:column;gap:16px;padding:38px 48px 40px;border-top:1px solid var(--line);scroll-margin-top:110px;
+  transition:background .3s var(--ease)}
 .row:last-child{border-bottom:1px solid var(--line)}
-.row-text{display:flex;flex-direction:column;gap:8px;align-items:flex-start;text-align:left}
-.row-name{font-size:clamp(46px,5.6vw,88px);line-height:1;letter-spacing:-.02em;transition:transform .3s var(--ease)}
-.row-desc{font-size:16px;line-height:1.5;color:var(--muted);max-width:480px}
-.row:hover{background:#fafafa}
-.row:hover .row-name{transform:translateX(12px)}
-.preview{position:absolute;right:0;top:0;width:300px;height:150px;z-index:5;pointer-events:none;overflow:hidden;
-  opacity:0;transform:translateX(18px) scale(.92);transition:opacity .3s var(--ease),transform .4s var(--pop);box-shadow:0 24px 50px rgba(0,0,0,.22)}
-.preview.on{opacity:1;transform:translateX(0) scale(1)}
-.preview img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
-
-/* careers */
-.careers{padding:70px 0 90px}
-.careers-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
-.careers-img{overflow:hidden;aspect-ratio:570/500}
-.careers-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
+.row::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--ink);transform:scaleY(0);transform-origin:top;transition:transform .35s var(--ease)}
+.row:hover{background:#f4f4f3}
+.row:hover::before{transform:scaleY(1)}
+.row-name{font-size:clamp(44px,5vw,84px);line-height:1;letter-spacing:-.03em;font-weight:500;transition:transform .4s var(--ease)}
+.row-desc{font-size:17px;line-height:1.45;color:var(--ink-soft);transition:transform .4s var(--ease) .04s,color .3s}
+.row-index{position:absolute;top:42px;right:48px;font-size:15px;color:var(--muted);transition:color .3s}
+.row:hover .row-name{transform:translateX(18px)}
+.row:hover .row-desc{transform:translateX(18px);color:var(--ink)}
+.row:hover .row-index{color:var(--ink)}
+
+/* archive */
+.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-txt{text-align:center;padding:0 5%}
-.careers-txt h2{font-size:clamp(28px,3vw,40px);line-height:1.15;letter-spacing:-.01em;margin-bottom:22px}
-.careers-txt p{color:var(--muted);font-size:16px;line-height:1.6;max-width:480px;margin:0 auto 32px}
+.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}
+.careers-txt p{font-family:var(--f1);color:var(--ink-soft);font-size:18px;line-height:1.6;max-width:470px;margin:0 0 40px}
+.archive-stats{display:flex;gap:44px;margin-bottom:44px}
+.archive-stats b{display:block;font-family:var(--f1);font-size:27px;font-weight:500;letter-spacing:-.01em;margin-bottom:4px}
+.archive-stats span{font-size:13px;color:var(--muted)}
+.btn.solid{background:var(--ink);color:#fff}
+.btn.solid:hover{background:#000;color:#fff}
 
 /* partners */
 .partners{padding:60px 0 100px;overflow:hidden}
@@ -142,25 +196,42 @@
 
 /* ctas */
 .ctas{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:10px 0 60px}
-.cta{display:flex;justify-content:space-between;align-items:flex-start;background:var(--ink);color:#fff;padding:24px 24px 84px;font-size:clamp(26px,2.8vw,38px);letter-spacing:-.01em;transition:background .3s}
-.cta .arr{font-size:38px;transition:transform .3s var(--ease)}
+.cta{position:relative;overflow:hidden;display:flex;justify-content:space-between;align-items:flex-start;background:var(--ink);color:#fff;padding:28px 28px 88px;font-size:clamp(26px,2.8vw,38px);letter-spacing:-.01em;transition:background .35s}
+.cta::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.09),transparent);transform:skewX(-18deg);transition:left .7s var(--ease);pointer-events:none}
+.cta:hover::after{left:135%}
+.cta>span:first-child{transition:transform .35s var(--ease)}
+.cta .arr{display:flex;align-items:center;justify-content:center;width:58px;height:58px;flex:none;border:1px solid rgba(255,255,255,.35);border-radius:50%;transition:background .35s,color .35s,border-color .35s,transform .4s var(--pop)}
+.cta .arr svg{display:block}
 .cta:hover{background:#000}
-.cta:hover .arr{transform:translateX(8px)}
+.cta:hover>span:first-child{transform:translateX(8px)}
+.cta:hover .arr{background:#fff;color:var(--ink);border-color:#fff;transform:rotate(-45deg)}
 .cta.alt{background:#fff;color:var(--ink);border:1px solid var(--line)}
+.cta.alt::after{background:linear-gradient(100deg,transparent,rgba(30,33,36,.06),transparent)}
+.cta.alt .arr{border-color:rgba(30,33,36,.3)}
 .cta.alt:hover{background:#f6f6f4}
+.cta.alt:hover .arr{background:var(--ink);color:#fff;border-color:var(--ink)}
+.cta.alt.reveal{transition-delay:.12s}
 
 /* footer */
-footer{background:var(--ink);color:#fff;padding:90px 0 60px}
-.foot-grid{display:flex;justify-content:space-between;gap:60px;flex-wrap:wrap}
-.foot-brand p{opacity:.65;font-size:15px;margin-bottom:6px}
-.foot-brand button{margin-top:22px}
+footer{position:relative;background:var(--ink);color:#fff;padding:100px 0 0}
+footer::after{content:"";position:absolute;top:100%;left:0;right:0;height:120px;background:var(--ink)}
+.foot-grid{display:flex;justify-content:space-between;gap:60px;flex-wrap:wrap;padding-bottom:80px}
+.foot-tag{opacity:.6;font-size:16px;line-height:1.55;max-width:290px;margin:22px 0 30px}
+.foot-gh{display:inline-flex;align-items:center;gap:10px;height:42px;padding:0 20px;border:1px solid rgba(255,255,255,.3);color:#fff;font-size:15px;transition:background .25s,border-color .25s}
+.foot-gh:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.55)}
+.foot-gh svg{fill:#fff;display:block}
+.foot-col a{position:relative}
+.foot-col a::after{content:"";position:absolute;left:0;bottom:2px;width:100%;height:1px;background:#fff;transform:scaleX(0);transform-origin:right;transition:transform .3s var(--ease)}
+.foot-col a:hover::after{transform:scaleX(1);transform-origin:left}
+.foot-base{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.12);padding:26px 0 32px;font-size:13px;opacity:.55}
+.foot-mark{font-family:var(--f2);font-weight:500;font-size:clamp(110px,17.5vw,300px);line-height:.78;letter-spacing:.01em;text-align:center;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.13);user-select:none;pointer-events:none;margin:30px 0 -8px;white-space:nowrap}
 .foot-cols{display:flex;flex:1;justify-content:space-between;max-width:1050px;flex-wrap:wrap;gap:30px}
 .foot-col h4{font-family:var(--f2);font-size:10px;letter-spacing:1.5px;text-transform:uppercase;opacity:.5;margin-bottom:16px}
 .foot-col a{display:block;font-size:15px;padding:5px 0;opacity:.85;transition:opacity .2s,transform .2s var(--ease)}
 .foot-col a:hover{opacity:1;transform:translateX(3px)}
 
 /* overlays */
-.overlay{position:fixed;inset:0;z-index:200;background:rgba(20,22,25,.92);backdrop-filter:blur(10px);display:flex;flex-direction:column;
+.overlay{position:fixed;inset:0;z-index:200;background:rgba(22,24,28,.2);backdrop-filter:blur(12px) saturate(1.2);-webkit-backdrop-filter:blur(12px) saturate(1.2);display:flex;flex-direction:column;
   opacity:0;pointer-events:none;transition:opacity .35s var(--ease)}
 .overlay.open{opacity:1;pointer-events:auto}
 .overlay-top{display:flex;justify-content:flex-end;padding:26px 30px}
@@ -168,9 +239,10 @@
 .close-x:hover{transform:rotate(90deg)}
 .search-wrap{margin:auto;width:min(720px,88vw);transform:translateY(18px);transition:transform .4s var(--ease)}
 .overlay.open .search-wrap{transform:none}
-.search-wrap input{width:100%;background:none;border:none;border-bottom:2px solid rgba(255,255,255,.35);color:#fff;
-  font-family:var(--f2);font-size:clamp(28px,4vw,48px);padding:12px 4px;outline:none;letter-spacing:-.02em}
-.search-wrap input::placeholder{color:rgba(255,255,255,.35)}
+.search-wrap input{width:100%;background:#fff;border:none;border-radius:14px;color:var(--ink);
+  font-family:var(--f2);font-size:clamp(20px,2.4vw,28px);padding:20px 24px;outline:none;letter-spacing:-.01em;
+  box-shadow:0 24px 60px rgba(0,0,0,.28)}
+.search-wrap input::placeholder{color:var(--muted)}
 .search-hint{color:rgba(255,255,255,.5);font-size:11px;letter-spacing:2px;text-transform:uppercase;font-family:var(--f2);margin-top:14px}
 .menu-links{margin:auto;display:flex;flex-direction:column;gap:4px;width:min(720px,88vw)}
 .menu-links a{color:#fff;font-family:var(--f2);font-size:clamp(30px,4.4vw,52px);letter-spacing:-.02em;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.12);
@@ -178,9 +250,10 @@
 .menu-links a small{font-family:var(--f1);font-size:13px;opacity:.5;letter-spacing:1px}
 .menu-links a:hover{opacity:1;padding-left:12px}
 
-@media(max-width:1200px){.preview{display:none}.row{grid-template-columns:1fr}}
+@media(max-width:1200px){.row{padding:30px 24px 32px}.row-index{right:24px;top:32px}.soft-title{padding:70px 24px 20px}}
+@media(max-width:1100px){.nav-links{display:none}}
 @media(max-width:960px){
-  .row{grid-template-columns:1fr}
+  .gh-btn{width:auto;padding:0 20px}
   .careers-grid{grid-template-columns:1fr}
   .ctas{grid-template-columns:1fr}
 }
@@ -189,20 +262,34 @@
 <body>
 
 <nav class="nav" id="nav">
-  <a class="logo" href="#top">VELOCITY</a>
-  <div class="nav-actions">
-    <a class="btn" href="https://github.com/AndrewCTF/velocity" rel="noopener"><span>↖ Get Started</span></a>
-    <button class="icon-btn" id="searchBtn" aria-label="Search">
-      <svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke-width="1.6"><circle cx="7" cy="7" r="5.5"/><path d="M11 11l4 4"/></svg>
-    </button>
-    <button class="icon-btn" id="menuBtn" aria-label="Menu">
-      <svg width="18" height="12" viewBox="0 0 18 12" fill="none" stroke-width="1.6"><path d="M0 1h18M0 6h18M0 11h18"/></svg>
+  <a class="brand" href="#top" aria-label="Velocity home">
+    <svg width="23" height="23" viewBox="0 0 32 32" aria-hidden="true"><g fill="none" stroke="currentColor"><path d="M7 11 16 25.5 25 11" stroke-width="2.8" stroke-linejoin="miter"/><rect x="3.9" y="4.9" width="6.2" height="6.2" stroke-width="2"/></g><rect x="21.9" y="4.9" width="6.2" height="6.2" fill="currentColor"/></svg>
+    VELOCITY
+  </a>
+  <div class="nav-pill nav-links">
+    <a href="#row-explorer">Explorer</a>
+    <a href="#row-workflows">Workflows</a>
+    <a href="#row-briefs">Briefs</a>
+    <a href="#row-foundry">Foundry</a>
+    <a href="#row-satellites">Satellites</a>
+    <a href="#row-layers">Layers</a>
+    <span class="nav-div"></span>
+    <button class="nav-search" id="searchBtn" aria-label="Search">
+      <svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke-width="1.8"><circle cx="7" cy="7" r="5.5"/><path d="M11 11l4 4"/></svg>
     </button>
   </div>
+  <div class="nav-right">
+    <a class="gh-btn" href="https://github.com/AndrewCTF/velocity" target="_blank" rel="noopener noreferrer"><span>Get Started</span></a>
+  </div>
 </nav>
 
 <header class="hero" id="top">
-  <div class="hero-media"><img src="assets/hero-orbit.jpg" alt="Velocity's globe seen from orbit with live aircraft traffic" /></div>
+  <div class="hero-media">
+    <video id="heroVideo" poster="assets/hero-orbit.jpg" autoplay muted loop playsinline preload="auto"
+           aria-label="Aerial view of Earth with live traffic">
+      <source src="assets/hero-bg.mp4" type="video/mp4" />
+    </video>
+  </div>
   <div class="hero-scrim"></div>
   <div class="hero-content">
     <div class="hero-line">Every Movement on Earth</div>
@@ -233,8 +320,8 @@
         <div class="slide-bar">
           <div class="stage-dots" id="dots"></div>
           <div class="stage-nav">
-            <button class="stage-btn" id="prev" aria-label="Previous">←</button>
-            <button class="stage-btn" id="next" aria-label="Next">→</button>
+            <button class="stage-btn" id="prev" aria-label="Previous"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M19 12H5M11 18l-6-6 6-6"/></svg></button>
+            <button class="stage-btn" id="next" aria-label="Next"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg></button>
           </div>
         </div>
       </div>
@@ -244,24 +331,27 @@
 
 <section class="statement">
   <div class="wrap">
-    <p class="scrub" id="scrub">Flightradar24 keeps 7 days. MarineTraffic keeps 24 hours. <strong>You keep everything</strong> — every transponder ping, every radar sweep, every satellite pass, every vessel, every aircraft, every signal on Earth — fused into <strong>one living picture</strong> that never expires, never blinks, and <strong>never looks away</strong>.</p>
+    <p class="scrub" id="scrub">Flightradar24 keeps 7 days. MarineTraffic keeps 24 hours. <strong>You keep everything.</strong> Every signal on Earth, fused into <strong>one living picture</strong> that never expires, never blinks, and <strong>never looks away</strong>.</p>
   </div>
 </section>
 
 <section class="soft" id="software">
-  <div class="wrap">
-    <div class="earmark reveal">The Workspace · Twelve Apps, One Substrate</div>
-    <div id="rows"></div>
-  </div>
+  <div id="rows"></div>
 </section>
 
 <section class="careers" id="archive">
   <div class="wrap careers-grid">
     <div class="careers-img reveal"><img src="assets/replay-live.jpg" alt="Velocity replaying recorded traffic from your own disk" /></div>
     <div class="careers-txt reveal">
+      <div class="careers-eyebrow">The Archive</div>
       <h2>History nobody can take back</h2>
       <p>Turn on the archive profile and Velocity records position history to your disk, with a scrubber to rewind any layer to any past moment. No account to close, no tier to cut, no API to sunset.</p>
-      <a class="btn" href="https://github.com/AndrewCTF/velocity" rel="noopener">GET STARTED ON GITHUB</a>
+      <div class="archive-stats">
+        <div><b>7,609,574</b><span>fixes recorded</span></div>
+        <div><b>Any moment</b><span>scrubbable on your disk</span></div>
+        <div><b>Zero</b><span>accounts, keys or tiers</span></div>
+      </div>
+      <a class="btn solid" href="https://github.com/AndrewCTF/velocity" target="_blank" rel="noopener noreferrer">GET STARTED ON GITHUB</a>
     </div>
   </div>
 </section>
@@ -276,20 +366,31 @@ <h2 class="reveal">What it will not pretend</h2>
 
 <section class="ctas-wrap">
   <div class="wrap ctas" id="ctas">
-    <a class="cta reveal" href="https://github.com/AndrewCTF/velocity" rel="noopener"><span>Get Started on GitHub</span><span class="arr">→</span></a>
-    <a class="cta alt reveal" href="https://github.com/AndrewCTF/velocity#take-the-tour" rel="noopener"><span>Take the Tour</span><span class="arr">→</span></a>
+    <a class="cta reveal" href="https://github.com/AndrewCTF/velocity" target="_blank" rel="noopener noreferrer"><span>Get Started on GitHub</span><span class="arr"><svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg></span></a>
+    <a class="cta alt reveal" href="https://github.com/AndrewCTF/velocity#take-the-tour" target="_blank" rel="noopener noreferrer"><span>Take the Tour</span><span class="arr"><svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg></span></a>
   </div>
 </section>
 
 <footer>
   <div class="wrap foot-grid">
-    <div class="foot-brand">
-      <p>Built in the open. Owned by whoever runs it.</p>
-      <p>Velocity · AGPL-3.0-or-later · v1.0.1</p>
-      <p style="opacity:.45;font-size:13px;margin-top:18px;max-width:300px;line-height:1.5">Thanks to the volunteer feeder communities that make public tracking possible.</p>
+    <div class="foot-brand reveal">
+      <a class="brand" href="#top" aria-label="Velocity home">
+        <svg width="20" height="20" viewBox="0 0 32 32" aria-hidden="true"><g fill="none" stroke="currentColor"><path d="M7 11 16 25.5 25 11" stroke-width="2.8" stroke-linejoin="miter"/><rect x="3.9" y="4.9" width="6.2" height="6.2" stroke-width="2"/></g><rect x="21.9" y="4.9" width="6.2" height="6.2" fill="currentColor"/></svg>
+        VELOCITY
+      </a>
+      <p class="foot-tag">Built in the open. Owned by whoever runs it.</p>
+      <a class="foot-gh" href="https://github.com/AndrewCTF/velocity" target="_blank" rel="noopener noreferrer">
+        <svg width="15" height="15" viewBox="0 0 16 16" aria-hidden="true"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27s1.36.09 2 .27c1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0 0 16 8c0-4.42-3.58-8-8-8Z"/></svg>
+        Star on GitHub
+      </a>
     </div>
     <div class="foot-cols" id="footCols"></div>
   </div>
+  <div class="wrap foot-base">
+    <span>Velocity · AGPL-3.0-or-later · v1.0.1</span>
+    <span>Thanks to the volunteer feeder communities that make public tracking possible.</span>
+  </div>
+  <div class="foot-mark" aria-hidden="true">VELOCITY</div>
 </footer>
 
 <div class="overlay" id="searchOverlay">
@@ -300,28 +401,18 @@ <h2 class="reveal">What it will not pretend</h2>
   </div>
 </div>
 
-<div class="overlay" id="menuOverlay">
-  <div class="overlay-top"><button class="close-x" data-close>×</button></div>
-  <div class="menu-links">
-    <a href="#updates" data-close>Live Domains <small>01</small></a>
-    <a href="#software" data-close>Workspace <small>02</small></a>
-    <a href="#archive" data-close>The Archive <small>03</small></a>
-    <a href="#partners" data-close>Stated Limits <small>04</small></a>
-    <a href="https://github.com/AndrewCTF/velocity" rel="noopener">Get Started <small>↗</small></a>
-  </div>
-</div>
 
 <script>
 const SLIDES=[
- {tab:"Air",tag:"AIR",title:"13,000 aircraft on a typical day — ADS-B from OpenSky and airplanes.live, including ~140 military",img:"assets/band-air.jpg"},
- {tab:"Maritime",tag:"MARITIME",title:"33,000 vessels a day — keyless AIS, MMSI-deduplicated across public feeds",img:"assets/plate-europe-dense.jpg"},
- {tab:"Space",tag:"SPACE",title:"16,000 orbital objects propagated in-browser with real SGP4 physics",img:"assets/hero-satellites.jpg"},
- {tab:"Hazards",tag:"HAZARDS",title:"Quakes, wildfires, storms and outages — 250 events a day on the same timeline",img:"assets/plate-orbit-wide.jpg"},
- {tab:"Signals",tag:"SIGNALS",title:"GPS jamming inferred from ADS-B degradation — 200 cells flagged at a time",img:"assets/hero-selected-track.jpg"},
- {tab:"Infrastructure",tag:"INFRASTRUCTURE",title:"7,183 military bases, 3,804 ports, submarine cables — 53 country toolkits",img:"assets/rail-layers.jpg"},
- {tab:"Archive",tag:"THE ARCHIVE",title:"History nobody can take back — replay bounded only by your disk",img:"assets/replay-live.jpg"},
- {tab:"Agent",tag:"MCP AGENT",title:"Give your agent real eyes — 46 MCP tools over the live feeds",img:"assets/launch.jpg"},
- {tab:"Workspace",tag:"WORKSPACE",title:"Twelve apps, one workspace — the globe is the front door",img:"assets/ui-explorer.jpg"}
+ {tab:"Air",tag:"AIR",title:"13,000 aircraft on a typical day — ADS-B from OpenSky and airplanes.live, including ~140 military",img:"assets/band-air.jpg",chip:"Live · the North Sea and Baltic, one second of the feed"},
+ {tab:"Maritime",tag:"MARITIME",title:"33,000 vessels a day — keyless AIS, MMSI-deduplicated across public feeds",img:"assets/plate-europe-dense.jpg",chip:"Live · keyless AIS over northern Europe"},
+ {tab:"Space",tag:"SPACE",title:"16,000 orbital objects propagated in-browser with real SGP4 physics",img:"assets/hero-satellites.jpg",chip:"Live · real SGP4 propagation in your browser"},
+ {tab:"Hazards",tag:"HAZARDS",title:"Quakes, wildfires, storms and outages — 250 events a day on the same timeline",img:"assets/plate-orbit-wide.jpg",chip:"Live · USGS + GDELT on one timeline"},
+ {tab:"Signals",tag:"SIGNALS",title:"GPS jamming inferred from ADS-B degradation — 200 cells flagged at a time",img:"assets/hero-selected-track.jpg",chip:"Live · jamming cells from ADS-B degradation"},
+ {tab:"Infrastructure",tag:"INFRASTRUCTURE",title:"7,183 military bases, 3,804 ports, submarine cables — 53 country toolkits",img:"assets/rail-layers.jpg",chip:"Reference · 7,183 bases, 3,804 ports, submarine cables"},
+ {tab:"Archive",tag:"THE ARCHIVE",title:"History nobody can take back — replay bounded only by your disk",img:"assets/replay-live.jpg",chip:"Replay · the last hour, from your own disk"},
+ {tab:"Agent",tag:"MCP AGENT",title:"Give your agent real eyes — 46 MCP tools over the live feeds",img:"assets/launch.jpg",chip:"MCP · 46 tools over the live feeds"},
+ {tab:"Workspace",tag:"WORKSPACE",title:"Twelve apps, one workspace — the globe is the front door",img:"assets/ui-explorer.jpg",chip:"Apps · twelve, one live substrate"}
 ];
 const ROWS=[
  ["Explorer","Query every live entity like a database.","assets/ui-explorer.jpg"],
@@ -348,20 +439,23 @@ <h2 class="reveal">What it will not pretend</h2>
 /* carousel */
 let cur=0,timer;
 const tabsEl=document.getElementById('tabs'),dotsEl=document.getElementById('dots'),
- img=document.getElementById('slideImg'),tag=document.getElementById('slideTag'),ttl=document.getElementById('slideTitle');
+ img=document.getElementById('slideImg'),tag=document.getElementById('slideTag'),ttl=document.getElementById('slideTitle'),
+ card=document.querySelector('.slide-card');
 SLIDES.forEach((s,i)=>{
  const b=document.createElement('button');b.className='tab';b.textContent=s.tab;b.onclick=()=>go(i);tabsEl.appendChild(b);
  const d=document.createElement('div');d.className='dot';d.onclick=()=>go(i);dotsEl.appendChild(d);
 });
-function render(){
+function render(dir){
  const s=SLIDES[cur];
+ img.style.setProperty('--pan',((dir<0)?-70:70)+'px');
  img.classList.remove('show');
  const nxt=new Image();nxt.src=s.img;nxt.onload=()=>{img.src=s.img;img.alt=s.title;img.classList.add('show')};
  tag.textContent=s.tag;ttl.textContent=s.title;
+ card.classList.remove('anim');void card.offsetWidth;card.classList.add('anim');
  document.querySelectorAll('.tab').forEach((t,i)=>t.classList.toggle('active',i===cur));
  document.querySelectorAll('.dot').forEach((d,i)=>d.classList.toggle('active',i===cur));
 }
-function go(i){cur=(i+SLIDES.length)%SLIDES.length;render();restart()}
+function go(i){const dir=Math.sign(i-cur)||1;cur=(i+SLIDES.length)%SLIDES.length;render(dir);restart()}
 function restart(){clearInterval(timer);timer=setInterval(()=>go(cur+1),6500)}
 document.getElementById('prev').onclick=()=>go(cur-1);
 document.getElementById('next').onclick=()=>go(cur+1);
@@ -374,22 +468,12 @@ <h2 class="reveal">What it will not pretend</h2>
 });
 render();restart();
 
-/* software rows + hover preview */
+/* software rows */
 const rowsEl=document.getElementById('rows');
-const soft=document.getElementById('software');
-const preview=document.createElement('div');preview.className='preview';
-preview.innerHTML='<img alt="" />';soft.querySelector('.wrap').appendChild(preview);
-const previewImg=preview.querySelector('img');
-ROWS.forEach(([name,desc,imgSrc])=>{
- const a=document.createElement('a');a.href='#software';a.className='row reveal';
- a.innerHTML=`<span class="row-text"><span class="row-name">${name}</span><span class="row-desc">${desc}</span></span>`;
- a.addEventListener('mouseenter',()=>{
-  previewImg.src=imgSrc;
-  const r=a.getBoundingClientRect(),s=soft.querySelector('.wrap').getBoundingClientRect();
-  preview.style.top=(r.top-s.top+(r.height-preview.offsetHeight)/2)+'px';
-  preview.classList.add('on');
- });
- a.addEventListener('mouseleave',()=>preview.classList.remove('on'));
+ROWS.forEach(([name,desc,imgSrc],i)=>{
+ const a=document.createElement('a');a.href='https://github.com/AndrewCTF/velocity#take-the-tour';a.target='_blank';a.rel='noopener noreferrer';a.className='row reveal';a.id='row-'+name.toLowerCase();
+ a.style.transitionDelay=(i*0.07)+'s';
+ a.innerHTML=`<span class="row-index">/0.${i+1}</span><h3 class="row-name">${name}</h3><p class="row-desc">${desc}</p>`;
  rowsEl.appendChild(a);
 });
 
@@ -402,39 +486,60 @@ <h2 class="reveal">What it will not pretend</h2>
 
 /* footer */
 const fc=document.getElementById('footCols');
-Object.entries(FOOT).forEach(([h,links])=>{
- const c=document.createElement('div');c.className='foot-col';
+Object.entries(FOOT).forEach(([h,links],i)=>{
+ const c=document.createElement('div');c.className='foot-col reveal';c.style.transitionDelay=(i*0.07)+'s';
  c.innerHTML=`<h4>${h}</h4>`+links.map(([l,h])=>`<a href="${h}" rel="noopener">${l}</a>`).join('');
  fc.appendChild(c);
 });
 
+/* smooth lerp scroll */
+let st=scrollY,sraf=null;
+function sstep(){const y=scrollY,d=st-y;if(Math.abs(d)<.6){sraf=null;return}scrollTo(0,y+d*.085);sraf=requestAnimationFrame(sstep)}
+function lerpTo(top){st=Math.max(0,Math.min(document.documentElement.scrollHeight-innerHeight,top));if(!sraf)sraf=requestAnimationFrame(sstep)}
+function cancelLerp(){if(sraf){cancelAnimationFrame(sraf);sraf=null}}
+addEventListener('wheel',e=>{
+ if(e.ctrlKey||document.body.style.overflow==='hidden')return;
+ e.preventDefault();
+ if(!sraf)st=scrollY;
+ lerpTo(st+e.deltaY);
+},{passive:false});
+document.querySelectorAll('a[href^="#"]').forEach(a=>a.addEventListener('click',()=>cancelLerp()));
+
+/* hero video fade-in when playing */
+const heroVid=document.getElementById('heroVideo');
+if(heroVid)heroVid.addEventListener('playing',()=>heroVid.classList.add('on'),{once:true});
+
 /* nav behaviour */
 const nav=document.getElementById('nav');let lastY=0;
-addEventListener('scroll',()=>{
+const darkZones=[...document.querySelectorAll('.hero,footer')];
+function navTick(){
  const y=scrollY;
- nav.classList.toggle('scrolled',y>40);
- nav.classList.toggle('hide',y>500&&y>lastY);
+ nav.classList.toggle('hide',y>160&&y>lastY);
  lastY=y;
-},{passive:true});
+ const probe=y+45;
+ nav.classList.toggle('on-light',!darkZones.some(s=>probe>=s.offsetTop&&probe<s.offsetTop+s.offsetHeight));
+}
+addEventListener('scroll',navTick,{passive:true});navTick();
 
 /* overlays */
-const overlays=[document.getElementById('searchOverlay'),document.getElementById('menuOverlay')];
+const overlays=[document.getElementById('searchOverlay')];
 function closeOverlays(){overlays.forEach(o=>o.classList.remove('open'));document.body.style.overflow=''}
 function openOverlay(o){closeOverlays();o.classList.add('open');document.body.style.overflow='hidden';
  if(o.id==='searchOverlay')setTimeout(()=>document.getElementById('searchInput').focus(),150)}
 document.getElementById('searchBtn').onclick=()=>openOverlay(overlays[0]);
-document.getElementById('menuBtn').onclick=()=>openOverlay(overlays[1]);
 document.querySelectorAll('[data-close]').forEach(el=>el.addEventListener('click',closeOverlays));
 overlays.forEach(o=>o.addEventListener('click',e=>{if(e.target===o)closeOverlays()}));
 
 /* buttons & smooth scroll */
 document.querySelectorAll('[data-scroll]').forEach(b=>b.addEventListener('click',e=>{
- e.preventDefault();document.querySelector(b.dataset.scroll)?.scrollIntoView({behavior:'smooth'});
+ e.preventDefault();
+ const t=document.querySelector(b.dataset.scroll);
+ if(t)lerpTo(t.getBoundingClientRect().top+scrollY-80);
 }));
 document.querySelector('.see-all').onclick=e=>{e.preventDefault();go(cur+1)};
 document.getElementById('searchInput').addEventListener('keydown',e=>{
  if(e.key==='Enter'&&e.target.value.trim()){closeOverlays();
-  document.getElementById('updates').scrollIntoView({behavior:'smooth'});}
+  const t=document.getElementById('updates');lerpTo(t.getBoundingClientRect().top+scrollY-80);}
 });
 
 /* statement word scrub */
diff --git a/website/main.js b/website/main.js
deleted file mode 100644
index deb9f48f..00000000
--- a/website/main.js
+++ /dev/null
@@ -1,206 +0,0 @@
-// Velocity site behaviors: nav state, scroll reveals, count-ups, copy button.
-const reduce = matchMedia('(prefers-reduced-motion: reduce)').matches;
-
-// Nav background after leaving the hero
-const nav = document.getElementById('nav');
-// The announcement strip retracts on first scroll and the nav slides up into
-// its place, so it costs no vertical space below the fold.
-const topbar = document.getElementById('topbar');
-const topbarX = document.getElementById('topbar-x');
-let barDismissed = false;
-const onScroll = () => {
-  nav.classList.toggle('scrolled', scrollY > 40);
-  document.body.classList.toggle('bar-gone', barDismissed || scrollY > 24);
-};
-topbarX.addEventListener('click', () => {
-  barDismissed = true;
-  document.body.classList.add('bar-gone');
-  topbar.setAttribute('aria-hidden', 'true');
-  topbar.querySelectorAll('a,button').forEach((e) => e.setAttribute('tabindex', '-1'));
-});
-addEventListener('scroll', onScroll, { passive: true });
-onScroll();
-
-// Reveal on enter + count-ups
-const fmt = new Intl.NumberFormat('en-US');
-const countUp = (el) => {
-  const target = +el.dataset.count;
-  const prefix = el.dataset.prefix || '';
-  if (reduce) { el.textContent = prefix + fmt.format(target); return; }
-  const t0 = performance.now(), dur = 1400;
-  const tick = (t) => {
-    const k = Math.min(1, (t - t0) / dur);
-    const eased = 1 - Math.pow(1 - k, 3);
-    el.textContent = prefix + fmt.format(Math.round(target * eased));
-    if (k < 1) requestAnimationFrame(tick);
-  };
-  requestAnimationFrame(tick);
-};
-
-const io = new IntersectionObserver((entries) => {
-  for (const e of entries) {
-    if (!e.isIntersecting) continue;
-    // Idempotent instead of unobserved: a block jumped over by an End-key press
-    // or a scrollbar drag was never intersected, and unobserving on first hit
-    // meant it stayed invisible forever once passed. Now it catches up on
-    // re-entry, and re-firing on an already-revealed block is a no-op.
-    if (e.target.classList.contains('in')) continue;
-    e.target.classList.add('in');
-    // A wipe inside a revealed block runs with it, so the row and its artifact
-    // are one event rather than two.
-    e.target.querySelectorAll('.wipe, .wipe-r').forEach((w) => w.classList.add('in'));
-    e.target.querySelectorAll('[data-count]').forEach(countUp);
-  }
-  // threshold 0 + a bottom inset: a section taller than the viewport can never
-  // reach a ratio threshold, which left the last gallery cards at opacity 0.
-}, { threshold: 0, rootMargin: '0px 0px -12% 0px' });
-document.querySelectorAll('.reveal').forEach((el) => {
-  if (reduce) {
-    el.classList.add('in');
-    el.querySelectorAll('.wipe, .wipe-r').forEach((w) => w.classList.add('in'));
-    el.querySelectorAll('[data-count]').forEach(countUp);
-  } else io.observe(el);
-});
-
-// Mobile menu. The five section links are unreachable below 760px without it.
-const toggle = document.getElementById('nav-toggle');
-const navLinks = document.getElementById('nav-links');
-const navFoot = document.querySelector('.nav-foot');
-const setMenu = (open) => {
-  toggle.setAttribute('aria-expanded', String(open));
-  toggle.setAttribute('aria-label', open ? 'Close menu' : 'Open menu');
-  navLinks.toggleAttribute('data-open', open);
-  nav.classList.toggle('menu-open', open);
-  // Full-screen overlay, so the page behind it must not scroll.
-  document.body.classList.toggle('menu-locked', open);
-  navFoot.setAttribute('aria-hidden', String(!open));
-  navFoot.querySelectorAll('a').forEach((a) => a.setAttribute('tabindex', open ? '0' : '-1'));
-  // The overlay covers the viewport but does not stop the page behind it being
-  // tabbable, so tab focus walked into the hero button and the FAQ. inert takes
-  // that content out of both the tab order and the accessibility tree.
-  for (const el of document.body.children) {
-    if (el !== nav) el.toggleAttribute('inert', open);
-  }
-  // Move focus into the overlay. A rAF is too early: the pointer interaction
-  // that opened the menu still focuses the toggle afterwards.
-  if (open) setTimeout(() => navLinks.querySelector('a')?.focus(), 60);
-};
-toggle.addEventListener('click', () => setMenu(toggle.getAttribute('aria-expanded') !== 'true'));
-navLinks.addEventListener('click', (e) => { if (e.target.tagName === 'A') setMenu(false); });
-addEventListener('keydown', (e) => {
-  if (e.key === 'Escape' && toggle.getAttribute('aria-expanded') === 'true') { setMenu(false); toggle.focus(); }
-});
-// Leaving the breakpoint must not strand the panel open on desktop.
-matchMedia('(min-width: 761px)').addEventListener('change', (e) => { if (e.matches) setMenu(false); });
-
-// Copy quick-start commands
-document.querySelectorAll('.copy-btn').forEach((btn) => {
-  btn.addEventListener('click', async () => {
-    try {
-      await navigator.clipboard.writeText(btn.dataset.copy);
-      btn.textContent = 'copied';
-    } catch {
-      btn.textContent = 'copy failed';
-    }
-    setTimeout(() => (btn.textContent = 'copy'), 1600);
-  });
-});
-
-// ---------- launch film player ----------
-// The native controls are replaced, not restyled: browsers will not let you
-// touch their chrome, and a stock control bar is the one element on the page
-// that looks like every other page. Guarded so the rest of main.js is unaffected
-// if the band is ever removed.
-const film = document.getElementById('film');
-if (film) {
-  const video = document.getElementById('film-video');
-  const bigPlay = document.getElementById('film-play');
-  const bar = document.getElementById('film-bar');
-  const track = document.getElementById('film-track');
-  const fill = document.getElementById('film-fill');
-  const time = document.getElementById('film-time');
-  const toggleBtn = document.getElementById('film-toggle');
-  const muteBtn = document.getElementById('film-mute');
-  const fullBtn = document.getElementById('film-full');
-
-  const ICON = {
-    play: '<svg viewBox="0 0 24 24" aria-hidden="true" width="15" height="15"><path d="M8 5.2v13.6L19 12z" fill="currentColor"/></svg>',
-    pause: '<svg viewBox="0 0 24 24" aria-hidden="true" width="15" height="15"><path d="M7 5h3.4v14H7zM13.6 5H17v14h-3.4z" fill="currentColor"/></svg>',
-    loud: '<svg viewBox="0 0 24 24" aria-hidden="true" width="15" height="15"><path d="M4 9.5h3.4L12 5.6v12.8L7.4 14.5H4z" fill="currentColor"/><path d="M15.4 9.2a4 4 0 0 1 0 5.6M17.9 6.7a7.5 7.5 0 0 1 0 10.6" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"/></svg>',
-    muted: '<svg viewBox="0 0 24 24" aria-hidden="true" width="15" height="15"><path d="M4 9.5h3.4L12 5.6v12.8L7.4 14.5H4z" fill="currentColor"/><path d="M15.6 9.6l4.8 4.8M20.4 9.6l-4.8 4.8" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"/></svg>',
-  };
-  const clock = (s) => `${Math.floor(s / 60)}:${String(Math.floor(s % 60)).padStart(2, '0')}`;
-
-  // The bar lives only while the pointer is in the frame, and retreats a beat
-  // after it stops moving — the film should be the only thing on screen.
-  let idle;
-  const show = () => {
-    film.classList.add('is-live');
-    clearTimeout(idle);
-    if (!video.paused) idle = setTimeout(() => film.classList.remove('is-live'), 2200);
-  };
-  film.addEventListener('mousemove', show);
-  film.addEventListener('mouseleave', () => { if (!video.paused) film.classList.remove('is-live'); });
-  film.addEventListener('focusin', show);
-
-  const play = () => video.play().catch(() => {});
-  const flip = () => (video.paused ? play() : video.pause());
-  bigPlay.addEventListener('click', play);
-  video.addEventListener('click', flip);
-  toggleBtn.addEventListener('click', flip);
-
-  video.addEventListener('play', () => {
-    film.classList.add('is-playing');
-    toggleBtn.innerHTML = ICON.pause;
-    toggleBtn.setAttribute('aria-label', 'Pause');
-    show();
-  });
-  video.addEventListener('pause', () => {
-    toggleBtn.innerHTML = ICON.play;
-    toggleBtn.setAttribute('aria-label', 'Play');
-    show();
-  });
-  video.addEventListener('ended', () => {
-    // load() drops the decoded media so the poster comes back. Seeking to 0
-    // instead leaves the film's own first frame on screen, which is black.
-    film.classList.remove('is-playing', 'is-live');
-    video.load();
-  });
-  video.addEventListener('timeupdate', () => {
-    const d = video.duration || 52;
-    const p = Math.min(1, video.currentTime / d);
-    fill.style.width = `${(p * 100).toFixed(2)}%`;
-    time.textContent = `${clock(video.currentTime)} / ${clock(d)}`;
-    track.setAttribute('aria-valuenow', Math.round(video.currentTime));
-    track.setAttribute('aria-valuetext', `${Math.round(video.currentTime)} seconds`);
-  });
-
-  const seekTo = (clientX) => {
-    const r = track.getBoundingClientRect();
-    video.currentTime = ((clientX - r.left) / r.width) * (video.duration || 52);
-  };
-  track.addEventListener('pointerdown', (e) => {
-    seekTo(e.clientX);
-    const move = (m) => seekTo(m.clientX);
-    const up = () => { removeEventListener('pointermove', move); removeEventListener('pointerup', up); };
-    addEventListener('pointermove', move);
-    addEventListener('pointerup', up);
-  });
-  track.addEventListener('keydown', (e) => {
-    const step = { ArrowLeft: -5, ArrowRight: 5, Home: -1e4, End: 1e4 }[e.key];
-    if (step === undefined) return;
-    e.preventDefault();
-    video.currentTime = Math.max(0, Math.min(video.duration || 52, video.currentTime + step));
-  });
-
-  muteBtn.addEventListener('click', () => {
-    video.muted = !video.muted;
-    muteBtn.innerHTML = video.muted ? ICON.muted : ICON.loud;
-    muteBtn.setAttribute('aria-label', video.muted ? 'Unmute' : 'Mute');
-  });
-  fullBtn.addEventListener('click', () => {
-    if (document.fullscreenElement) document.exitFullscreen();
-    else film.requestFullscreen?.().catch(() => {});
-  });
-}
-
diff --git a/website/styles.css b/website/styles.css
deleted file mode 100644
index 0d3dd31c..00000000
--- a/website/styles.css
+++ /dev/null
@@ -1,1236 +0,0 @@
-/* Velocity marketing site, v2. "The console at altitude" per build-plan.md.
-   Base is the app's own space black; the one light band punctuates. */
-
-@font-face {
-  font-family: 'Archivo';
-  src: url('assets/fonts/Archivo-var.woff2') format('woff2');
-  font-weight: 100 900;
-  font-stretch: 62% 125%;
-  font-display: swap;
-}
-@font-face {
-  font-family: 'Geist Mono';
-  src: url('assets/fonts/GeistMono-var.woff2') format('woff2');
-  font-weight: 100 900;
-  font-display: swap;
-}
-
-:root {
-  /* Light base. Measured against the reference set: palantir runs 9 of 10
-     luminance bands light with dark imagery as punctuation. This page ran 0 of
-     10. Dark is the easy choice and it reads as the category default; a light
-     page is harder because every flaw shows, which is why it reads premium. */
-  --void: #ffffff;          /* page base */
-  --surface: #f4f3f0;       /* alternating band */
-  --raise: #e9e7e2;         /* raised chip / tile */
-  --line: #d7d4cd;
-  --line-soft: #e5e2dc;
-  --txt: #14161a;
-  --txt-2: #474d55;
-  --txt-3: #5f666e;   /* 5.1:1 on white; carries body copy */
-  --paper: #101317;         /* the punctuation band inverts: now dark */
-  --paper-raise: #171b20;
-  --ink: #f4f3f0;
-  --ink-2: #b4b8be;
-  --bone: #14161a;          /* dark CTA on a light page */
-  --bone-hi: #000000;
-  --on-bone: #ffffff;
-  --plate: #05070a;         /* the colour dark photographic bands sit on */
-  --r-ctrl: 4px;
-  --r-card: 8px;
-  --sans: 'Archivo', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --mono: 'Geist Mono', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
-  --w: 1240px;
-  --pad: 40px;
-  /* Spacing scale. Every vertical rhythm value comes from here. */
-  --s2: 16px;
-  --s3: 24px;
-  --s4: 32px;
-  --s5: 48px;
-  --s6: 64px;
-  --s7: 88px;
-  --s8: 120px;
-  /* 12 columns across the 1160px content measure, 24px gutters. */
-  --gutter: 24px;
-}
-
-* { margin: 0; padding: 0; box-sizing: border-box; }
-html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
-@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
-
-body {
-  background: var(--void);
-  color: var(--txt);
-  font-family: var(--sans);
-  font-size: 17px;
-  line-height: 1.62;
-  font-synthesis-weight: none;
-  -webkit-font-smoothing: antialiased;
-  overflow-x: hidden;
-}
-
-img { display: block; max-width: 100%; }
-a { color: inherit; }
-
-.wrap { width: 100%; max-width: var(--w); margin: 0 auto; padding: 0 var(--pad); }
-/* One grid for every multi-column block, so columns land on the same edges
-   section after section instead of each split inventing its own ratio. */
-.g12 { display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 var(--gutter); }
-.c-half { grid-column: span 6; }
-.c-third { grid-column: span 4; }
-.c-5 { grid-column: span 5; }
-.c-7 { grid-column: 7 / -1; }
-
-/* ---------- shared type ---------- */
-
-h1, h2, h3 { font-weight: 540; letter-spacing: -0.024em; line-height: 1.02; }
-
-h2 {
-  font-size: clamp(32px, 3.6vw, 50px);
-  letter-spacing: -0.032em;
-  line-height: 1.05;
-  font-weight: 400;
-  font-variation-settings: 'wdth' 100;
-}
-
-.lede {
-  color: var(--txt-2);
-  font-size: 18px;
-  line-height: 1.66;
-  max-width: 62ch;
-  margin-top: 20px;
-}
-
-.eyebrow {
-  font-family: var(--mono);
-  font-size: 11px;
-  font-weight: 500;
-  letter-spacing: 0.2em;
-  text-transform: uppercase;
-  color: var(--txt-3);
-  display: block;
-}
-
-/* Signature: the hairline data rule, lifted from the app's scrubber chrome. */
-.datarule {
-  display: flex;
-  align-items: center;
-  gap: 14px;
-  border-top: 1px solid var(--line);
-  padding-top: 12px;
-}
-.datarule::before {
-  content: '';
-  flex: 1;
-  height: 7px;
-  background-image: repeating-linear-gradient(90deg, var(--line) 0 1px, transparent 1px 34px);
-  align-self: flex-start;
-  margin-top: -12px;
-}
-.datarule span {
-  font-family: var(--mono);
-  font-size: 11px;
-  letter-spacing: 0.16em;
-  text-transform: uppercase;
-  color: var(--txt-3);
-  white-space: nowrap;
-}
-.datarule.on-light { border-color: #333940; }
-.datarule.on-light::before { background-image: repeating-linear-gradient(90deg, #333940 0 1px, transparent 1px 34px); }
-.datarule.on-light span { color: #8b939c; }
-
-/* ---------- buttons ---------- */
-
-.btn {
-  display: inline-flex;
-  align-items: center;
-  gap: 9px;
-  height: 46px;
-  padding: 0 22px;
-  border-radius: var(--r-ctrl);
-  font-size: 15px;
-  font-weight: 520;
-  letter-spacing: -0.01em;
-  text-decoration: none;
-  border: 1px solid transparent;
-  transition: background .18s ease, border-color .18s ease, transform .18s ease, color .18s ease;
-}
-.btn:active { transform: translateY(1px); }
-.btn-primary { background: var(--bone); color: var(--on-bone); border-color: var(--bone); }
-.btn-primary:hover { background: var(--bone-hi); border-color: var(--bone-hi); }
-/* Border carries the control boundary here, so it must clear 3:1 against the
-   darkest surface it sits on (#5b6673 vs #05070a measures 3.46:1). */
-.btn-line { background: rgba(0, 0, 0, .03); color: var(--txt); border-color: #9ca2aa; }
-.btn-line:hover { background: rgba(0, 0, 0, .07); border-color: #6d737b; }
-/* Over the dark hero the controls invert. */
-.hero .btn-primary { background: #ffffff; color: #14161a; border-color: #ffffff; }
-.hero .btn-primary:hover { background: #eeece7; border-color: #eeece7; }
-.hero .btn-line { background: rgba(255,255,255,.08); color: #ffffff; border-color: rgba(255,255,255,.44); }
-.hero .btn-line:hover { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.66); }
-.hero .datarule { border-color: rgba(255,255,255,.2); }
-.hero .datarule::before { background-image: repeating-linear-gradient(90deg, rgba(255,255,255,.2) 0 1px, transparent 1px 34px); }
-.hero .datarule span { color: #a9b4bf; }
-
-.btn-sm { height: 38px; padding: 0 15px; font-size: 14px; }
-.btn-big { height: 52px; padding: 0 28px; font-size: 16px; }
-:focus-visible { outline: 2px solid var(--bone); outline-offset: 3px; }
-/* --bone is near-black, so on the dark surfaces the ring measured 1.1:1 and the
-   first nine tab stops had no visible focus at all. */
-.hero :focus-visible,
-.overlay-band :focus-visible,
-.bleed :focus-visible,
-.light :focus-visible,
-.term :focus-visible,
-.nav:not(.scrolled) :focus-visible { outline-color: var(--ink); }
-
-/* ---------- announcement strip ---------- */
-/* Carries one real, dated, linked artifact. It scrolls away on first scroll and
-   the nav takes its place, so it costs nothing below the fold. */
-.topbar {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  z-index: 41;
-  height: 40px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  gap: 10px;
-  padding: 0 44px 0 20px;
-  background: transparent;
-  transition: transform .32s cubic-bezier(.16, 1, .3, 1);
-}
-body.bar-gone .topbar { transform: translateY(-100%); }
-.topbar-msg {
-  display: inline-flex;
-  align-items: center;
-  gap: 10px;
-  min-width: 0;
-  text-decoration: none;
-  color: #ccd4dc;
-  transition: color .16s ease;
-}
-.topbar-msg:hover { color: #ffffff; }
-.topbar-kicker {
-  flex: none;
-  font-family: var(--mono);
-  font-size: 10px;
-  font-weight: 500;
-  letter-spacing: 0.18em;
-  text-transform: uppercase;
-  color: #b9c2cc;
-  border: 1px solid rgba(255, 255, 255, .26);
-  border-radius: var(--r-ctrl);
-  padding: 3px 7px;
-}
-.topbar-text {
-  font-size: 13.5px;
-  letter-spacing: -0.008em;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-.topbar-msg svg { flex: none; opacity: .7; }
-.topbar-x {
-  position: absolute;
-  right: 12px;
-  width: 30px;
-  height: 30px;
-  display: grid;
-  place-items: center;
-  background: none;
-  border: 0;
-  border-radius: var(--r-ctrl);
-  color: #8e97a1;
-  cursor: pointer;
-  transition: color .16s ease, background .16s ease;
-}
-.topbar-x:hover { color: #ffffff; background: rgba(255,255,255,.1); }
-
-/* ---------- nav ---------- */
-
-.nav {
-  position: fixed;
-  top: 40px;
-  left: 0;
-  right: 0;
-  z-index: 40;
-  height: 64px;
-  display: flex;
-  align-items: center;
-  border-bottom: 1px solid transparent;
-  transition: top .32s cubic-bezier(.16, 1, .3, 1), background .28s ease,
-              border-color .28s ease, backdrop-filter .28s ease;
-}
-.nav .wrap { display: flex; align-items: center; gap: 34px; }
-.nav .brand { color: #ffffff; }
-.nav-links a { color: #ccd4dc; }
-.nav-links a:hover { color: #ffffff; }
-.nav.scrolled { background: rgba(255, 255, 255, .92); backdrop-filter: blur(14px); border-bottom-color: var(--line); }
-.nav.scrolled .brand { color: var(--txt); }
-.nav.scrolled .nav-links a { color: var(--txt-2); }
-.nav.scrolled .nav-links a:hover { color: var(--txt); }
-body.bar-gone .nav { top: 0; }
-.brand {
-  color: var(--txt);
-  display: flex;
-  align-items: center;
-  gap: 10px;
-  font-family: var(--mono);
-  font-size: 13px;
-  font-weight: 600;
-  letter-spacing: 0.22em;
-  text-decoration: none;
-}
-.nav-links { display: flex; gap: 26px; margin-left: auto; }
-/* Menu-panel footer: mobile only. Without this it renders inside the desktop
-   nav bar, because its positioning rules live in the breakpoint block. */
-.nav-foot { display: none; }
-/* No colour here. This rule sits after the transparent-nav colours above and had
-   identical specificity, so var(--txt-2) beat #ccd4dc and the five section links
-   rendered at 2.4:1 over the dark hero. Colour is owned by .nav / .nav.scrolled. */
-.nav-links a {
-  font-size: 14.5px;
-  text-decoration: none;
-  transition: color .16s ease;
-}
-
-/* The nav is transparent over the plate, so its button has no surface to sit
-   on and reads as an overlay. Keep it a text control up top; it earns its fill
-   once the nav gains a background on scroll. */
-.nav > .wrap > .btn {
-  background: transparent;
-  border-color: transparent;
-  color: #ccd4dc;
-  padding: 0 8px;
-}
-.nav > .wrap > .btn:hover { background: transparent; border-color: transparent; color: var(--txt); }
-.nav.scrolled > .wrap > .btn {
-  background: rgba(0, 0, 0, .04);
-  border-color: #9ca2aa;
-  color: var(--txt);
-  padding: 0 15px;
-}
-.nav.scrolled > .wrap > .btn:hover { background: rgba(0, 0, 0, .08); border-color: #6d737b; }
-
-/* Mobile menu trigger. Hidden on desktop; the three bars become a cross when
-   open. 44px square so it clears the minimum touch target. */
-.nav-toggle {
-  display: none;
-  width: 44px;
-  height: 44px;
-  margin-right: -10px;
-  background: none;
-  border: 0;
-  cursor: pointer;
-  position: relative;
-}
-.nav-toggle span {
-  position: absolute;
-  left: 11px;
-  width: 22px;
-  height: 1.5px;
-  /* Light while the nav is transparent over the dark hero; dark once the bar or
-     the menu panel puts a light surface behind it. */
-  background: var(--ink);
-  transition: transform .26s cubic-bezier(.16,1,.3,1), opacity .18s ease, background .18s ease;
-}
-.nav.scrolled .nav-toggle span, .nav.menu-open .nav-toggle span { background: var(--txt); }
-.nav-toggle span:nth-child(1) { top: 16px; }
-.nav-toggle span:nth-child(2) { top: 21.5px; }
-.nav-toggle span:nth-child(3) { top: 27px; }
-.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
-.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
-.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }
-
-/* ---------- 2. hero: full bleed, type bottom left ---------- */
-
-.hero {
-  background: var(--plate);
-  color: #ffffff;
-  position: relative;
-  min-height: 100dvh;
-  display: flex;
-  align-items: flex-end;
-  overflow: hidden;
-  isolation: isolate;
-}
-.hero-media { position: absolute; inset: 0; z-index: -2; background: #05070a; }
-.hero-media video {
-  width: 100%;
-  height: 100%;
-  object-fit: cover;
-  object-position: 50% 46%;
-}
-/* The video is decoration over a poster of the same frame, so reduced motion
-   simply freezes it; no content is lost. */
-@media (prefers-reduced-motion: reduce) { .hero-media video { display: none; }
-  .hero-media { background: #05070a url('assets/hero-orbit.jpg') center 46% / cover no-repeat; } }
-.hero-media::after {
-  content: '';
-  position: absolute;
-  inset: 0;
-  /* Enough scrim to hold AA contrast on the headline, not enough to erase the
-     tracks. Measured: headline sits over the 0.62-0.70 band. */
-  background:
-    radial-gradient(74% 62% at 6% 76%, rgba(5, 7, 10, .74) 0%, rgba(5, 7, 10, .44) 42%, transparent 72%),
-    linear-gradient(to top,
-      rgba(5, 7, 10, .92) 0%, rgba(5, 7, 10, .5) 18%, rgba(5, 7, 10, .04) 46%,
-      rgba(5, 7, 10, .14) 64%, rgba(5, 7, 10, .42) 82%, rgba(5, 7, 10, .7) 100%),
-    linear-gradient(to right, rgba(5, 7, 10, .46) 0%, rgba(5, 7, 10, .10) 46%, transparent 78%);
-}
-.hero-inner { padding-bottom: var(--s6); padding-top: var(--s8); position: relative; }
-/* Micro-labels over photography need far more weight than they do on a flat
-   surface; --txt-3 measured 1.91:1 here. */
-.hero .eyebrow { color: #ccd6e0; display: inline-block; }
-.hero h1 {
-  text-shadow: 0 2px 34px rgba(5, 7, 10, .72), 0 1px 5px rgba(5, 7, 10, .5);
-  font-size: clamp(44px, 7vw, 98px);
-  letter-spacing: -0.038em;
-  font-weight: 400;
-  font-variation-settings: 'wdth' 100;
-  line-height: 0.96;
-  max-width: 15ch;
-  margin: 18px 0 0;
-  text-wrap: balance;
-}
-.hero p {
-  color: #d3dae1;
-  text-shadow: 0 1px 16px rgba(5, 7, 10, .85);
-  margin-top: 22px;
-  max-width: 54ch;
-  font-size: 19px;
-  line-height: 1.55;
-  color: #c3ccd6;
-}
-.hero-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin: 32px 0 46px; }
-.hero .datarule { border-color: rgba(255, 255, 255, .17); }
-.hero .datarule::before { background-image: repeating-linear-gradient(90deg, rgba(255, 255, 255, .17) 0 1px, transparent 1px 34px); }
-.hero .datarule span { color: #9aa6b3; }
-
-/* ---------- 3. big image carrying the claim ---------- */
-/* The reference set puts a large photograph immediately below the fold with the
-   text sitting on it. This replaced a 204px strip of numbers on a flat band,
-   which was the weakest moment on the page. */
-.overlay-band { position: relative; overflow: hidden; isolation: isolate; display: flex; align-items: center; min-height: 760px; background: var(--plate); color: #f2f1ee; }
-.overlay-bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 50% 56%; }
-.overlay-band::before {
-  content: '';
-  position: absolute; inset: 0; z-index: -1;
-  background: linear-gradient(to right, rgba(5,7,10,.94) 0%, rgba(5,7,10,.86) 38%, rgba(5,7,10,.34) 74%, rgba(5,7,10,.5) 100%);
-}
-.overlay-band .wrap { padding-top: var(--s7); padding-bottom: var(--s7); }
-.overlay-panel { max-width: 62ch; }
-.overlay-panel h2 {
-  font-size: clamp(30px, 3.5vw, 48px);
-  line-height: 1.14;
-  letter-spacing: -0.032em;
-  font-weight: 400;
-  color: #93a0ad;
-  text-wrap: balance;
-}
-.overlay-panel h2 strong { color: #fff; font-weight: 400; display: inline-block; margin-top: 2px; }
-.overlay-panel .scale-grid { margin-top: var(--s6); }
-.overlay-panel .datarule { margin-top: var(--s5); border-color: rgba(255,255,255,.2); }
-.overlay-panel .datarule::before { background-image: repeating-linear-gradient(90deg, rgba(255,255,255,.2) 0 1px, transparent 1px 34px); }
-.overlay-panel .datarule span { color: #93a0ad; }
-
-/* ---------- 3b. stat row ---------- */
-
-.scale-grid {
-  display: grid;
-  grid-template-columns: repeat(3, minmax(0, 1fr));
-  gap: var(--s5) var(--s4);
-}
-.stat { padding: 0; }
-.overlay-band .stat b { color: #fff; }
-.stat b {
-  display: block;
-  /* Archivo, not Geist Mono. Mono gives the comma a full monospace advance, so
-     the flagship numbers rendered as "21 , 186". Mono stays on provenance
-     labels; display numerals belong in the sans, tabular for column alignment. */
-  font-family: var(--sans);
-  font-size: clamp(24px, 2.3vw, 32px);
-  font-weight: 500;
-  letter-spacing: -0.03em;
-  font-variant-numeric: tabular-nums;
-}
-.stat span { display: block; margin-top: 6px; font-size: 12.5px; line-height: 1.4; color: #93a0ad; }
-
-/* ---------- 4. statement ---------- */
-
-.statement { text-align: center; }
-.statement .wrap { padding-top: 104px; padding-bottom: 104px; }
-.statement p {
-  font-size: clamp(27px, 3.3vw, 46px);
-  line-height: 1.2;
-  letter-spacing: -0.03em;
-  font-weight: 400;
-  font-variation-settings: 'wdth' 100;
-  color: #5c6672;
-  max-width: 20ch;
-  margin: 0 auto;
-  text-wrap: balance;
-}
-.statement strong { color: var(--txt); font-weight: 560; }
-.statement.tight .wrap { padding-top: 84px; padding-bottom: 84px; }
-
-/* ---------- 5. full-bleed console band ---------- */
-
-.bleed { position: relative; overflow: hidden; background: var(--plate); }
-.bleed img, .bleed-video { width: 100%; height: clamp(420px, 52vw, 720px); object-fit: cover; display: block; }
-/* The film band waits for a click, so reduced-motion keeps the player: nothing
-   moves until the visitor asks it to. Only the autoplaying bleeds fall back. */
-@media (prefers-reduced-motion: reduce) {
-  .bleed-video:not(#film-video) { display: none; }
-}
-
-/* ---------- launch film player ----------
-   No native chrome: a single centred affordance, then a hairline bar that only
-   exists while the pointer is in the frame. Controls are light-on-dark
-   regardless of the page theme, because this band is always dark. */
-.film { --film-ease: cubic-bezier(.16, 1, .3, 1); }
-.film #film-video { cursor: pointer; }
-.film-poster {
-  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
-  z-index: 2; pointer-events: none;
-  transition: opacity .34s var(--film-ease);
-}
-.film.is-playing .film-poster { opacity: 0; }
-.film-play {
-  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
-  z-index: 3; width: 88px; height: 88px; padding: 0 0 0 5px;
-  display: grid; place-items: center; cursor: pointer;
-  color: #fff; border-radius: 50%;
-  border: 1px solid rgba(255, 255, 255, .45);
-  background: rgba(10, 16, 24, .34);
-  -webkit-backdrop-filter: blur(9px); backdrop-filter: blur(9px);
-  box-shadow: 0 18px 50px rgba(0, 0, 0, .45);
-  transition: transform .32s var(--film-ease), opacity .3s var(--film-ease),
-              border-color .2s ease, background-color .2s ease;
-}
-.film-play:hover { border-color: #fff; background: rgba(10, 16, 24, .5); transform: translate(-50%, -50%) scale(1.045); }
-.film.is-playing .film-play { opacity: 0; pointer-events: none; transform: translate(-50%, -50%) scale(.92); }
-.film-label {
-  position: absolute; left: 30px; bottom: 34px; z-index: 3; max-width: 46ch;
-  transition: opacity .3s var(--film-ease), transform .34s var(--film-ease);
-}
-.film-kicker {
-  display: block; font-family: var(--mono); font-size: 12px; letter-spacing: .28em;
-  text-transform: uppercase; color: #63cdff;
-}
-.film-label h3 {
-  margin: 12px 0 0; font-size: clamp(30px, 3.1vw, 46px); font-weight: 500;
-  letter-spacing: -.022em; line-height: 1.06; color: #fff;
-  text-shadow: 0 2px 26px rgba(0, 0, 0, .6);
-}
-.film-label p {
-  margin: 12px 0 0; font-size: 16.5px; line-height: 1.5; color: rgba(240, 246, 250, .82);
-  text-shadow: 0 1px 18px rgba(0, 0, 0, .65);
-}
-.film.is-playing .film-label { opacity: 0; transform: translateY(6px); pointer-events: none; }
-/* The label owns the lower left, so the scrim has to reach further up than a
-   bare control bar would need. */
-.film .film-bar { padding-top: 84px; }
-@media (max-width: 700px) {
-  .film-label { left: 18px; bottom: 26px; max-width: none; right: 18px; }
-  .film-label p { font-size: 15px; }
-}
-
-.film-bar {
-  position: absolute; left: 0; right: 0; bottom: 0; z-index: 4;
-  padding: 60px 30px 22px;
-  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(2, 6, 12, .62) 62%, rgba(2, 6, 12, .82) 100%);
-  opacity: 0; transform: translateY(8px); pointer-events: none;
-  transition: opacity .26s var(--film-ease), transform .26s var(--film-ease);
-}
-.film.is-live .film-bar { opacity: 1; transform: none; pointer-events: auto; }
-.film-track { position: relative; height: 14px; display: flex; align-items: center; cursor: pointer; }
-.film-track::before {
-  content: ''; position: absolute; left: 0; right: 0; height: 2px;
-  background: rgba(255, 255, 255, .24); transition: height .18s ease;
-}
-.film-track:hover::before, .film-track:focus-visible::before { height: 4px; }
-.film-fill {
-  position: absolute; left: 0; height: 2px; width: 0; background: #fff;
-  box-shadow: 0 0 12px rgba(255, 255, 255, .5); transition: height .18s ease;
-}
-.film-track:hover .film-fill, .film-track:focus-visible .film-fill { height: 4px; }
-.film-track:focus-visible { outline: none; }
-.film-row { display: flex; align-items: center; gap: 16px; margin-top: 14px; }
-.film-spacer { flex: 1; }
-.film-btn {
-  width: 32px; height: 32px; display: grid; place-items: center; cursor: pointer;
-  color: rgba(255, 255, 255, .82); background: transparent; border: 0; border-radius: 4px;
-  transition: color .18s ease, background-color .18s ease;
-}
-.film-btn:hover { color: #fff; background: rgba(255, 255, 255, .10); }
-.film-time {
-  font-family: var(--mono); font-size: 12px; letter-spacing: .10em;
-  font-variant-numeric: tabular-nums; color: rgba(255, 255, 255, .72);
-}
-.film :focus-visible { outline: 2px solid rgba(255, 255, 255, .85); outline-offset: 3px; }
-@media (max-width: 700px) {
-  .film-play { width: 66px; height: 66px; }
-  .film-bar { padding: 44px 18px 16px; }
-}
-/* The console recording is 2.5:1. Letting the generic band height force 2:1
-   cover-cropped the layer rail and the selection panel, slicing their labels.
-   Drive the height from the source aspect so the whole console is visible. */
-.bleed-console { line-height: 0; }
-.bleed-console .bleed-video {
-  aspect-ratio: 1500 / 790;
-  height: auto;
-  min-height: 260px;
-  object-position: 52% 50%;
-}
-/* No blend veil on the bleed bands. The white top stop washed out the top 121px
-   of the console recording and the dark bottom stop sliced its scrubber: 288px
-   of 758px, and the two zones the app puts its live status bar and timeline in.
-   The chip carries its own scrim, so the gradient bought nothing. Bands butt. */
-.chip {
-  position: absolute;
-  left: 50%;
-  bottom: 26px;
-  transform: translateX(-50%);
-  z-index: 2;
-  display: inline-flex;
-  align-items: center;
-  gap: 10px;
-  padding: 9px 15px;
-  border-radius: var(--r-ctrl);
-  background: rgba(9, 12, 16, .74);
-  backdrop-filter: blur(9px);
-  font-family: var(--mono);
-  font-size: 11.5px;
-  letter-spacing: 0.13em;
-  text-transform: uppercase;
-  color: #c8d1db;
-  max-width: calc(100% - 32px);
-}
-.chip i { width: 6px; height: 6px; border-radius: 50%; background: #3fb996; flex: none; }
-
-/* World plates: real-register photographs of the domains Velocity tracks, used
-   as the ground for existing sections rather than as standalone bands, so they
-   add atmosphere and tonal contrast without adding filler height. The scrim is
-   heavy because these carry body copy, not just a headline. */
-.onworld { position: relative; isolation: isolate; overflow: hidden; }
-.onworld-bg {
-  position: absolute;
-  inset: 0;
-  z-index: -2;
-  width: 100%;
-  height: 100%;
-  object-fit: cover;
-  opacity: .62;
-}
-.onworld::before {
-  content: '';
-  position: absolute;
-  inset: 0;
-  z-index: -1;
-  background: linear-gradient(to bottom, var(--void), rgba(5, 7, 10, .80) 26%, rgba(5, 7, 10, .82) 74%, var(--void));
-}
-.close.onworld { background: transparent; }
-/* The port plate's upper half is bright overcast sky, which dropped body copy
-   in the evidence section to 3.59:1. Frame its dark water and quay instead and
-   carry a heavier scrim, since this section is the most text-dense of the three. */
-#evidence .onworld-bg { object-position: 50% 86%; opacity: .55; }
-#evidence.onworld::before {
-  background: linear-gradient(to bottom, var(--void), rgba(5, 7, 10, .87) 24%, rgba(5, 7, 10, .89) 76%, var(--void));
-}
-
-/* Alternating light band, the way a light page separates sections. */
-.section-alt { background: var(--surface); }
-
-/* A photograph with one line on it, no body copy: the only way an image and
-   text share a band without the scrim destroying the image. */
-.bleed-line { display: flex; align-items: center; min-height: 520px; }
-.bleed-line img { position: absolute; inset: 0; height: 100%; }
-.bleed-line::after { background: linear-gradient(to right, rgba(5,7,10,.9) 0%, rgba(5,7,10,.62) 46%, rgba(5,7,10,.3) 100%); }
-.bleed-line .wrap { position: relative; z-index: 2; }
-.bleed-claim {
-  font-size: clamp(26px, 3.2vw, 44px);
-  line-height: 1.2;
-  letter-spacing: -0.03em;
-  font-weight: 400;
-  color: #93a0ad;
-  max-width: 24ch;
-  text-wrap: balance;
-}
-.bleed-claim strong { color: #fff; font-weight: 400; }
-
-/* ---------- 6. capabilities: 3x2 card grid ---------- */
-
-.section .wrap { padding-top: var(--s7); padding-bottom: var(--s7); }
-.sec-head { max-width: 66ch; }
-/* Section heads that sit above a full-width artifact run the whole measure, so
-   the band below does not open under an empty right column. */
-.sec-head-wide { max-width: none; display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 var(--gutter); align-items: end; }
-.sec-head-wide h2 { grid-column: span 6; }
-.sec-head-wide .lede { grid-column: 7 / -1; }
-.sec-head-wide .lede { margin-top: 0; max-width: 54ch; }
-
-/* Domain index. Number-led hairline rows carrying a live thumbnail, which is
-   denser per pixel than a card grid and removes the last boxed surface. */
-.dom-index { margin-top: 4px; }
-.dom {
-  display: grid;
-  grid-template-columns: repeat(12, 1fr);
-  gap: 0 var(--gutter);
-  align-items: center;
-  padding: var(--s3) 20px;
-  margin: 0 -20px;
-  border-radius: var(--r-card);
-  transition: background .22s ease;
-}
-.dom:hover { background: var(--surface); }
-.dom-n {
-  font-family: var(--sans);
-  font-size: clamp(26px, 2.5vw, 34px);
-  font-weight: 400;
-  letter-spacing: -0.03em;
-  line-height: .95;
-  font-variant-numeric: tabular-nums;
-  color: var(--txt);
-}
-.dom-n { grid-column: span 2; }
-.dom-body { grid-column: span 6; }
-.dom-thumb { grid-column: 9 / -1; }
-.dom-body h3 {
-  font-size: 21px;
-  font-weight: 440;
-  letter-spacing: -0.022em;
-  font-variation-settings: 'wdth' 104;
-}
-.dom-q {
-  display: block;
-  margin-top: 6px;
-  font-family: var(--mono);
-  font-size: 11.5px;
-  letter-spacing: 0.04em;
-  color: #7a5e12;
-}
-.dom-body p { margin-top: 10px; font-size: 14.5px; line-height: 1.58; color: var(--txt-3); max-width: 56ch; }
-.dom-thumb { overflow: hidden; border-radius: var(--r-card); }
-.dom-thumb img {
-  width: 100%;
-  aspect-ratio: 2 / 1;
-  object-fit: cover;
-  transition: transform .5s cubic-bezier(.16, 1, .3, 1), opacity .3s ease;
-  opacity: .8;
-}
-.dom:hover .dom-thumb img { transform: scale(1.04); opacity: 1; }
-
-.section-head-only .wrap { padding-bottom: var(--s5); }
-.section-head-only .sec-head { max-width: none; display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 var(--gutter); align-items: end; }
-.section-head-only .sec-head h2 { grid-column: span 6; }
-.section-head-only .sec-head .lede { grid-column: 7 / -1; margin-top: 0; max-width: 46ch; }
-.section-tight .wrap { padding-top: var(--s6); }
-.bleed-band img { height: clamp(340px, 40vw, 560px); object-position: 50% 58%; }
-
-/* ---------- 7. archive: the one light band ---------- */
-
-.light { background: var(--paper); color: var(--ink); }
-.light .eyebrow { color: #8b939c; }
-.light .wrap { padding-top: var(--s7); padding-bottom: var(--s7); }
-.light h2 { color: var(--ink); }
-.light .lede { color: var(--ink-2); }
-.light .eyebrow { color: #85817a; }
-.archive-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 var(--gutter); align-items: start; margin-top: var(--s5); }
-.archive-grid > *:first-child { grid-column: span 6; }
-.archive-grid > *:last-child { grid-column: 7 / -1; align-self: start; }
-
-.compare { width: 100%; border-collapse: collapse; font-size: 15px; table-layout: fixed; }
-.compare th {
-  text-align: left;
-  font-family: var(--mono);
-  font-size: 10.5px;
-  font-weight: 500;
-  letter-spacing: 0.16em;
-  text-transform: uppercase;
-  color: #8b939c;
-  padding: 0 14px 14px 0;
-  vertical-align: bottom;
-}
-.compare td { padding: 16px 14px 16px 12px; vertical-align: top; border-bottom: 1px solid #262b31; }
-.compare tbody tr:last-child td { border-bottom: 0; }
-.compare th:first-child, .compare td:first-child { width: 25%; white-space: nowrap; }
-.compare th:nth-child(2), .compare td:nth-child(2) { width: 48%; }
-.compare th:last-child, .compare td:last-child { width: 27%; }
-
-.compare tr.you td { background: #1d2126; font-weight: 520; }
-.compare tr.you td:first-child { box-shadow: inset 3px 0 0 var(--ink); }
-.compare .muted { color: #969ba2; }
-.compare-note { margin-top: 18px; font-size: 13.5px; line-height: 1.55; color: #969ba2; max-width: 56ch; }
-/* Taller crop so the shot column ends level with the table column instead of
-   leaving a void; biased low because the scrubber lives at the bottom. */
-
-.light .shot img { aspect-ratio: 4 / 3; object-position: 50% 64%; }
-/* The archive artifact is a recording of the replay actually running, so the
-   claim is demonstrated rather than asserted. preload none; poster fallback
-   under reduced motion. */
-.shot-video { width: 100%; display: block; aspect-ratio: 1400 / 690; object-fit: cover; }
-/* position:relative or the absolutely-positioned figcaption chip escapes to the
-   initial containing block. The .reveal transform masked it: translateY(20px)
-   made the figure a containing block, so the chip only broke loose once .in set
-   transform:none, landing it on the hero 5,000px up. */
-.shot { position: relative; }
-.light .shot { border-radius: var(--r-card); box-shadow: 0 0 0 1px rgba(255,255,255,.08); }
-@media (prefers-reduced-motion: reduce) {
-  .shot-video { display: none; }
-  .light .shot { background: #0e1116 url('assets/replay-live.jpg') center / cover no-repeat; min-height: 300px; }
-}
-
-/* ---------- 8. second statement over a plate ---------- */
-
-.overband {
-  position: relative;
-  display: grid;
-  place-items: center;
-  text-align: center;
-  min-height: 460px;
-  overflow: hidden;
-  isolation: isolate;
-}
-.overband img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 50% 44%; }
-.overband::before {
-  content: '';
-  position: absolute;
-  inset: 0;
-  z-index: -1;
-  background: linear-gradient(to bottom, var(--void), rgba(5, 7, 10, .68) 30%, rgba(5, 7, 10, .72) 70%, var(--void));
-}
-.overband p {
-  font-size: clamp(26px, 3.2vw, 44px);
-  line-height: 1.2;
-  letter-spacing: -0.03em;
-  font-weight: 400;
-  font-variation-settings: 'wdth' 100;
-  color: #7e8894;
-  max-width: 19ch;
-  text-wrap: balance;
-}
-.overband strong { color: #fff; font-weight: 560; }
-
-/* ---------- 9. evidence chain ---------- */
-
-.chain { display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 var(--gutter); margin-top: var(--s5); }
-.chain-step { grid-column: span 4; }
-.chain-step { padding: var(--s3) 0 var(--s4); position: relative; }
-
-.chain { position: relative; padding-top: var(--s3); }
-.chain::after {
-  content: '';
-  position: absolute;
-  top: 3px;
-  left: 0;
-  right: 0;
-  height: 1px;
-  background: var(--line);
-}
-.chain-step::before {
-  content: '';
-  position: absolute;
-  top: -1px;
-  left: 0;
-  width: 7px;
-  height: 7px;
-  background: var(--txt);
-  z-index: 1;
-}
-
-.chain-k { font-family: var(--mono); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--txt); }
-.chain-step p { margin-top: 12px; font-size: 14.5px; line-height: 1.56; color: var(--txt-3); max-width: 34ch; }
-.chain-step code {
-  display: inline-block;
-  margin-top: 16px;
-  font-family: var(--mono);
-  font-size: 11.5px;
-  letter-spacing: 0.03em;
-  color: var(--txt-2);
-  background: var(--raise);
-  border-radius: var(--r-ctrl);
-  padding: 6px 10px;
-}
-
-/* The custody chain and the agent split now share one inverted band, so both
-   need the dark-ground colours. --term is exactly --paper, so on this band the
-   terminal would have merged into the background; raise it one step. */
-.light .chain::after { background: rgba(255, 255, 255, .16); }
-.light .chain-k { color: var(--ink); }
-.light .chain-step p { color: var(--ink-2); }
-.light .chain-step code { color: var(--ink-2); background: var(--paper-raise); }
-.light .term { background: var(--paper-raise); }
-/* Second argument in the same band: separated by space and a rule, not by a
-   section boundary. */
-.band-next { margin-top: var(--s7); padding-top: var(--s6); border-top: 1px solid rgba(255, 255, 255, .12); }
-
-/* ---------- 10. agent split ---------- */
-
-.split { display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 var(--gutter); align-items: center; }
-.split > *:first-child { grid-column: span 5; }
-.split > *:last-child { grid-column: 7 / -1; }
-.term {
-  background: #101317;
-  border-radius: var(--r-card);
-  padding: 24px 26px;
-  overflow-x: auto;
-  position: relative;
-}
-.term pre {
-  color: #d5dae0;
-  font-family: var(--mono);
-  font-size: 13.5px;
-  line-height: 1.92;
-  letter-spacing: -0.01em;
-  color: #cfd8e2;
-}
-.term .c { color: #8b95a2; }
-.term .p { color: #7d8fa1; }
-.term .hl { color: #7fd6a8; }
-.copy-btn {
-  color: #aeb5bd;
-  position: absolute;
-  top: 14px;
-  right: 14px;
-  height: 28px;
-  padding: 0 11px;
-  font-family: var(--mono);
-  font-size: 11px;
-  letter-spacing: 0.1em;
-  text-transform: uppercase;
-  background: #21262c;
-  border: 0;
-  border-radius: var(--r-ctrl);
-  cursor: pointer;
-  transition: color .16s ease, background .16s ease;
-}
-.copy-btn:hover { color: #ffffff; background: #2b3138; }
-
-/* ---------- 11. workspace bento, edge to edge ---------- */
-
-.has-bleed-grid .wrap { padding-bottom: var(--s5); }
-.bento {
-  display: grid;
-  grid-template-columns: repeat(4, 1fr);
-  grid-auto-rows: 208px;
-  gap: 2px;
-}
-.tile { position: relative; overflow: hidden; background: var(--surface); }
-.tile:nth-child(1) { grid-column: span 2; grid-row: span 2; }
-.tile:nth-child(2) { grid-column: span 2; }
-.tile:nth-child(3), .tile:nth-child(4) { grid-column: span 1; }
-.tile:nth-child(5) { grid-column: span 3; }
-.tile:nth-child(6) { grid-column: span 1; }
-.tile img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s cubic-bezier(.16, 1, .3, 1); }
-.tile:hover img { transform: scale(1.035); }
-.tile figcaption {
-  position: absolute;
-  inset: auto 0 0;
-  padding: 44px 20px 18px;
-  /* The ramp has to still be opaque where the app NAME sits, not just where the
-     subtitle does. It faded out by the top of the padding box, which left six
-     near-black titles on dark screenshots at 1.0:1 while their lighter
-     subtitles read fine. */
-  background: linear-gradient(to top, rgba(5, 7, 10, .96) 38%, rgba(5, 7, 10, .78) 72%, transparent);
-}
-.tile b {
-  display: block;
-  font-size: clamp(20px, 1.9vw, 26px);
-  font-weight: 440;
-  letter-spacing: -0.026em;
-  font-variation-settings: 'wdth' 104;
-  line-height: 1.05;
-  /* Never inherit --txt here: this text always sits on a photograph. */
-  color: var(--ink);
-}
-.tile figcaption span { display: block; margin-top: 7px; font-size: 13px; line-height: 1.45; color: #9aa6b3; max-width: 34ch; }
-
-/* ---------- 12. honesty ---------- */
-
-.truths { display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--s2) var(--gutter); margin-top: var(--s5); }
-.truth { grid-column: span 6; }
-.truth:nth-child(even) { grid-column: 7 / -1; }
-.truth { padding: var(--s3) 0 var(--s4); }
-.truth h3 { font-size: 17.5px; letter-spacing: -0.016em; font-variation-settings: 'wdth' 104; }
-.truth p { margin-top: 10px; font-size: 14.5px; line-height: 1.58; color: var(--txt-3); }
-
-/* ---------- 13. faq ---------- */
-
-.faq-list { margin-top: 34px; }
-details { border-bottom: 1px solid var(--line-soft); }
-summary {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 24px;
-  padding: 22px 0;
-  cursor: pointer;
-  list-style: none;
-  font-size: 17.5px;
-  font-weight: 520;
-  letter-spacing: -0.02em;
-  transition: color .16s ease;
-}
-summary::-webkit-details-marker { display: none; }
-/* Was #fff. The FAQ sits on the white page, so hovering a question erased it. */
-summary:hover { color: var(--bone-hi); }
-.x {
-  flex: none;
-  width: 30px;
-  height: 30px;
-  border-radius: var(--r-ctrl);
-  background: var(--raise);
-  display: grid;
-  place-items: center;
-  transition: transform .22s ease, border-color .22s ease;
-}
-.x svg { stroke: var(--txt-2); }
-/* The chip inverts when open. It used to keep --txt-2 on #202730 (1.76:1), so
-   the one element carrying open/closed state had no visible state. */
-details[open] .x { transform: rotate(45deg); background: #202730; color: var(--ink); }
-details p { padding: 0 60px 24px 0; font-size: 15.5px; line-height: 1.66; color: var(--txt-2); max-width: 78ch; }
-details a { color: var(--bone); text-underline-offset: 3px; }
-
-/* ---------- 14. close ---------- */
-
-.close { background: var(--surface); }
-.close .wrap { padding-top: var(--s7); padding-bottom: var(--s7); }
-.close-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 var(--gutter); align-items: center; }
-.close-grid > *:first-child { grid-column: span 5; }
-.close-grid > *:last-child { grid-column: 7 / -1; }
-.close .term { background: rgba(8, 10, 14, .88); backdrop-filter: blur(6px); }
-.onworld .term { background: rgba(8, 10, 14, .88); backdrop-filter: blur(6px); }
-
-/* ---------- 15. footer ---------- */
-
-.footer { background: var(--void); }
-.footer .wrap { padding-top: var(--s6); padding-bottom: var(--s5); }
-.footer-grid { display: grid; grid-template-columns: 1.5fr repeat(4, 1fr); gap: 40px 32px; }
-.foot-brand .datarule { margin-top: 20px; max-width: 200px; }
-.sign { font-size: 15px; color: var(--txt-2); max-width: 26ch; }
-.footer h4 { font-family: var(--mono); font-size: 10.5px; font-weight: 500; letter-spacing: 0.2em; text-transform: uppercase; color: var(--txt-3); }
-.footer ul { list-style: none; margin-top: 14px; display: grid; gap: 9px; }
-.footer a { font-size: 14px; color: var(--txt-2); text-decoration: none; transition: color .16s ease; }
-.footer a:hover { color: var(--txt); }
-.footer-base {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 14px 32px;
-  justify-content: space-between;
-  margin-top: 44px;
-  padding-top: 22px;
-  font-family: var(--mono);
-  font-size: 11px;
-  letter-spacing: 0.09em;
-  color: var(--txt-3);
-}
-
-/* ---------- motion ---------- */
-/* Vocabulary measured off the reference set: they run clip-path wipes (8
-   elements on both palantir and shield.ai), transform hovers in the hundreds,
-   and scroll-linked drift. Everything here animates transform, opacity or
-   clip-path only, so it stays on the compositor, and every rule is gated on
-   prefers-reduced-motion. */
-
-/* Visible by DEFAULT. The hidden state is gated on .js, which an inline head
-   script sets, so a visitor with JS blocked gets the whole page unanimated
-   rather than 43 invisible blocks and three background images. */
-.js .reveal { opacity: 0; transform: translateY(20px); transition: opacity .68s cubic-bezier(.16, 1, .3, 1), transform .68s cubic-bezier(.16, 1, .3, 1); }
-.js .reveal.in { opacity: 1; transform: none; }
-
-/* Stagger: sequence within a group reads as narrative rather than a single
-   block arriving. Index-driven so it needs no per-element markup. */
-.dom-index .reveal:nth-child(1)  { transition-delay: .00s }
-.dom-index .reveal:nth-child(2)  { transition-delay: .06s }
-.dom-index .reveal:nth-child(3)  { transition-delay: .12s }
-.dom-index .reveal:nth-child(4)  { transition-delay: .18s }
-.dom-index .reveal:nth-child(5)  { transition-delay: .24s }
-.dom-index .reveal:nth-child(6)  { transition-delay: .30s }
-.scale-grid .reveal:nth-child(2) { transition-delay: .05s }
-.scale-grid .reveal:nth-child(3) { transition-delay: .10s }
-.scale-grid .reveal:nth-child(4) { transition-delay: .15s }
-.scale-grid .reveal:nth-child(5) { transition-delay: .20s }
-.scale-grid .reveal:nth-child(6) { transition-delay: .25s }
-.truths .reveal:nth-child(2) { transition-delay: .07s }
-.truths .reveal:nth-child(3) { transition-delay: .14s }
-.truths .reveal:nth-child(4) { transition-delay: .21s }
-.chain .reveal:nth-child(2) { transition-delay: .09s }
-.chain .reveal:nth-child(3) { transition-delay: .18s }
-
-/* Clip-path wipe. Used on the artifacts that carry the argument, so the
-   reveal is an event rather than a fade. */
-.js .wipe { clip-path: inset(0 0 100% 0); transition: clip-path .95s cubic-bezier(.16, 1, .3, 1); }
-.js .wipe.in { clip-path: inset(0 0 0 0); }
-.js .wipe-r { clip-path: inset(0 100% 0 0); transition: clip-path .9s cubic-bezier(.16, 1, .3, 1); }
-.js .wipe-r.in { clip-path: inset(0 0 0 0); }
-
-/* Hover vocabulary. Anduril carries transform transitions on 114 elements;
-   ours were on a handful. */
-.footer a, .compare tbody tr, .chain-step, .stat { transition: transform .28s cubic-bezier(.16, 1, .3, 1), color .2s ease, background .2s ease; }
-.footer a:hover { transform: translateX(3px); }
-.chain-step:hover { transform: translateY(-2px); }
-.light .compare tbody tr:hover td { background: #23282e; }
-
-/* Scroll-linked drift on the full-bleed plates. No scroll listener: this is a
-   view timeline, so it never touches the main thread. Chromium only today and
-   it simply does not run elsewhere, which is the correct degradation. */
-@media (prefers-reduced-motion: no-preference) {
-  @supports (animation-timeline: view()) {
-    /* The bands clip, which makes them scroll containers that never scroll, so
-       a bare view() inside one resolves against the band and never advances.
-       Name the timeline on the band, whose own scrollport is the document, and
-       reference it from the child. */
-    .bleed-band, .onworld { view-timeline-name: --plate; view-timeline-axis: block; }
-    .hero { view-timeline-name: --hero; view-timeline-axis: block; }
-    /* The headline recedes as the hero leaves rather than cutting away, which
-       is the one place a scroll-linked effect earns its keep. */
-    .hero-inner {
-      animation: heroSettle linear both;
-      animation-timeline: --hero;
-      /* Started at exit 28%, which put the block at opacity .22 by scrollY 700 of
-         a 900px hero: the primary CTA dimmed out while it was still on screen
-         and still being read. Recede only once the hero is genuinely leaving. */
-      animation-range: exit 62% exit 100%;
-    }
-    @keyframes heroSettle {
-      from { opacity: 1; transform: none; }
-      to   { opacity: .22; transform: translate3d(0, -26px, 0); }
-    }
-    .bleed-band img, .onworld-bg {
-      animation: plateDrift linear both;
-      animation-timeline: --plate;
-      animation-range: entry 0% exit 100%;
-      will-change: transform;
-    }
-    @keyframes plateDrift {
-      from { transform: scale(1.07) translate3d(0, -1.6%, 0); }
-      to   { transform: scale(1.07) translate3d(0, 1.6%, 0); }
-    }
-  }
-}
-
-/* ---------- responsive ---------- */
-
-@media (max-width: 1080px) {
-  :root { --pad: 28px; }
-  .dom { grid-template-columns: 104px minmax(0, 1fr); gap: 0 28px; }
-  .dom-thumb { grid-column: 1 / -1; margin-top: 16px; max-width: 420px; }
-  .archive-grid, .split, .close-grid { grid-template-columns: 1fr; gap: 40px; }
-
-  .bento { grid-auto-rows: 190px; }
-}
-
-@media (max-width: 760px) {
-  :root { --pad: 20px; }
-  body { font-size: 16px; }
-  .nav-toggle { display: block; }
-  .nav .wrap { gap: 12px; }
-  .nav .btn { margin-left: auto; }
-  /* Full-screen takeover, which is what the reference set does on mobile. The
-     bar stays above it so the wordmark and the close control never move. */
-  .nav-links {
-    position: fixed;
-    inset: 0;
-    z-index: 42;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    gap: 0;
-    margin: 0;
-    padding: 84px var(--pad) calc(var(--pad) + 96px);
-    background: var(--void);
-    opacity: 0;
-    visibility: hidden;
-    transition: opacity .3s ease, visibility .3s;
-  }
-  .nav-links[data-open] { opacity: 1; visibility: visible; }
-  .nav-links a {
-    display: block;
-    padding: 20px 0;
-    font-size: clamp(28px, 8.4vw, 40px);
-    font-weight: 440;
-    letter-spacing: -0.032em;
-    font-variation-settings: 'wdth' 100;
-    line-height: 1.05;
-    color: var(--txt);
-    border-bottom: 1px solid var(--line-soft);
-    transform: translateY(14px);
-    opacity: 0;
-    transition: transform .5s cubic-bezier(.16,1,.3,1), opacity .4s ease;
-  }
-  .nav-links[data-open] a { transform: none; opacity: 1; }
-  .nav-links[data-open] a:nth-child(1) { transition-delay: .05s; }
-  .nav-links[data-open] a:nth-child(2) { transition-delay: .10s; }
-  .nav-links[data-open] a:nth-child(3) { transition-delay: .15s; }
-  .nav-links[data-open] a:nth-child(4) { transition-delay: .20s; }
-  .nav-links[data-open] a:nth-child(5) { transition-delay: .25s; }
-  .nav-links a:last-child { border-bottom: 0; }
-  /* The panel's own footer: primary action plus the same data rule the hero
-     carries, so the menu is not a bare list. */
-  /* Fixed to the viewport, not to the 64px bar. As an absolute child of .nav it
-     resolved against the bar and sat off-screen. */
-  .nav-foot {
-    position: fixed;
-    /* Was 43 then re-declared 39, and .nav-links is 42 with an opaque white
-       background, so the panel's only CTA was painted behind the panel:
-       elementFromPoint at its centre returned .nav-links. Keyboard could reach
-       it, a thumb could not. */
-    z-index: 44;
-    left: var(--pad);
-    right: var(--pad);
-    bottom: calc(var(--pad) + 4px);
-    display: grid;
-    gap: 18px;
-    opacity: 0;
-    visibility: hidden;
-    transform: translateY(10px);
-    transition: opacity .3s ease .18s, transform .45s cubic-bezier(.16,1,.3,1) .18s, visibility .3s;
-  }
-  .nav.menu-open ~ * .nav-foot, .nav.menu-open .nav-foot {
-    opacity: 1; visibility: visible; transform: none;
-  }
-  .nav-foot .btn { width: 100%; justify-content: center; margin: 0; height: 52px; font-size: 16px; }
-  /* Toggle and brand ride above the overlay. */
-  .nav .brand, .nav-toggle { position: relative; z-index: 43; }
-  .nav.menu-open ~ .topbar, body.menu-locked .topbar { display: none; }
-  .topbar-text { font-size: 12.5px; }
-  .topbar { padding-left: 16px; }
-  .nav.menu-open { background: var(--void); border-bottom-color: transparent; }
-  /* The wordmark is #fff for the transparent nav over the hero; the open panel
-     is --void, so it went white-on-white. */
-  .nav.menu-open .brand { color: var(--txt); }
-  .nav.menu-open > .wrap > .btn { opacity: 0; pointer-events: none; }
-  body.menu-locked { overflow: hidden; }
-  .hero { min-height: 92dvh; }
-  .hero-inner { padding-bottom: 40px; }
-  .hero h1 { max-width: 100%; }
-  .hero p { font-size: 17px; }
-  .hero-ctas { gap: 10px; margin-bottom: 34px; }
-  .hero-ctas .btn { flex: 1 1 auto; justify-content: center; }
-  .section .wrap, .light .wrap, .close .wrap { padding-top: 68px; padding-bottom: 68px; }
-  .statement .wrap { padding-top: 80px; padding-bottom: 80px; }
-  .statement p, .overband p { max-width: 100%; }
-  .scale-grid { grid-template-columns: repeat(2, 1fr); }
-  .overlay-band { min-height: 0; }
-  .overlay-panel { max-width: none; }
-  .truths { grid-template-columns: 1fr; }
-  .dom { grid-template-columns: 1fr; gap: 16px; padding: 26px 0; }
-  .dom-thumb { max-width: 100%; }
-  .truths { gap: 0; }
-  .chain { grid-template-columns: 1fr; border-top: 0; }
-  .chain-step { border-right: 0; border-top: 1px solid rgba(255, 255, 255, .12); padding: 24px 0 26px !important; }
-  .chain-step::before { left: 0 !important; }
-  .bento { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 168px; }
-  .tile:nth-child(n) { grid-column: span 1; grid-row: span 1; }
-  .tile:nth-child(1) { grid-column: span 2; }
-  .tile:nth-child(5) { grid-column: span 2; }
-  .sec-head-wide { grid-template-columns: 1fr; gap: 18px; }
-  .footer-grid { grid-template-columns: 1fr 1fr; gap: 30px 24px; }
-  .foot-brand { grid-column: span 2; }
-  details p { padding-right: 0; }
-  .datarule::before { display: none; }
-  .datarule { flex-wrap: wrap; gap: 8px 14px; }
-}