/* Motion layer. The deployment section (.deploy) is intentionally left alone. */
html.js body{animation:pageIn .7s ease both}
@keyframes pageIn{from{opacity:0}to{opacity:1}}
body.leaving{opacity:0;transition:opacity .28s ease}

/* scroll progress */
.progress{position:fixed;left:0;top:0;height:2px;width:100%;background:var(--sand);transform-origin:0 50%;transform:scaleX(0);z-index:120;pointer-events:none}

/* load-in sequence for hero text */
.hero-in>*,.phero-in>*,.cm-hero-in>*,.contact-in>div:first-child>*{opacity:0;transform:translateY(26px);animation:rise 1s cubic-bezier(.2,.7,.2,1) forwards}
.hero-in>*:nth-child(1),.phero-in>*:nth-child(1),.cm-hero-in>*:nth-child(1){animation-delay:.15s}
.hero-in>*:nth-child(2),.phero-in>*:nth-child(2),.cm-hero-in>*:nth-child(2){animation-delay:.3s}
.hero-in>*:nth-child(3),.phero-in>*:nth-child(3),.cm-hero-in>*:nth-child(3){animation-delay:.45s}
.hero-in>*:nth-child(4),.phero-in>*:nth-child(4),.cm-hero-in>*:nth-child(4){animation-delay:.6s}
.cm-hero-in>*:nth-child(5){animation-delay:.75s}
.contact-in>div:first-child>*:nth-child(n){animation-delay:.25s}
@keyframes rise{to{opacity:1;transform:none}}
.nav{animation:navIn .9s .1s ease both}
@keyframes navIn{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:none}}
.hero-h .w,.phero .h1 .w{--wd:.2s}

/* word-by-word headline reveal */
.sw{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.12em;margin-bottom:-.12em}
.sw>span{display:inline-block;transform:translateY(112%);transition:transform .9s cubic-bezier(.2,.75,.15,1);transition-delay:calc(var(--i,0) * 45ms)}
.split.in .sw>span{transform:none}

/* section labels draw a line in */
.small-label{display:flex;align-items:center;gap:0}
.small-label::before{content:"";display:inline-block;width:0;height:1px;background:var(--sand);margin-right:0;transition:width .9s .1s cubic-bezier(.2,.7,.2,1),margin .9s .1s}
.small-label.in::before{width:40px;margin-right:16px}

/* stagger for grouped items */
.rv{transition-delay:var(--d,0ms)}

/* image wipes */
.wipe{clip-path:inset(0 0 100% 0);transition:clip-path 1.2s cubic-bezier(.7,0,.15,1);transition-delay:var(--d,0ms)}
.wipe.in{clip-path:inset(0 0 0 0)}
.wipe img{transform:scale(1.22);transition:transform 1.8s cubic-bezier(.2,.7,.15,1);transition-delay:var(--d,0ms)}
.wipe.in img{transform:scale(1)}
.wipe.in:hover img{transform:scale(1.04);transition-delay:0ms;transition-duration:1s}
.pcard:hover .wipe.in img,.tcard:hover .wipe.in img{transform:scale(1.06);transition-delay:0ms;transition-duration:1s}

/* formation: platforms spread from the centre */
.form-stage img{clip-path:inset(0 42% 0 42%);transition:clip-path 1.8s cubic-bezier(.65,0,.2,1)}
.form-stage.in img{clip-path:inset(0 0 0 0)}

/* crowd hero: vehicle rises, floor light breathes */
.cm-hero-stage img{animation:vehicle 1.6s .5s cubic-bezier(.2,.7,.15,1) both}
@keyframes vehicle{from{opacity:0;transform:translateY(70px) scale(.97)}to{opacity:1;transform:none}}
.floor{animation:glow 5s ease-in-out infinite}
@keyframes glow{0%,100%{opacity:.55}50%{opacity:1}}

/* carousel captions rise with each slide */
.slide-cap>*{opacity:0;transform:translateY(22px);transition:opacity .7s,transform .8s cubic-bezier(.2,.7,.15,1)}
.slide.on .slide-cap>*{opacity:1;transform:none}
.slide.on .slide-cap>*:nth-child(1){transition-delay:.35s}
.slide.on .slide-cap>*:nth-child(2){transition-delay:.45s}
.slide.on .slide-cap>*:nth-child(3){transition-delay:.55s}
.segs button.on{animation:seg 1s ease both}
@keyframes seg{from{transform:scaleX(.2);transform-origin:0 50%}to{transform:scaleX(1)}}

/* scroll-scrubbed statement text */
.scrub .wd{opacity:.2;transition:opacity .35s}
.scrub .wd.lit{opacity:1}

/* links and buttons */
.tlink{background:linear-gradient(var(--sand),var(--sand)) 0 100%/100% 1px no-repeat;border-bottom:0;padding-bottom:6px;transition:background-size .4s,color .2s}
.tlink:hover{background-size:0 1px;color:var(--sand)}
.btn{position:relative;overflow:hidden;transition:background .25s,color .25s,transform .25s}
.btn.mag{will-change:transform}
.chips a{transition:.25s}
.drop .ditems a{opacity:0;transform:translateY(10px);transition:opacity .4s,transform .4s}
.has-drop:hover .ditems a,.has-drop:focus-within .ditems a{opacity:1;transform:none}
.ditems a:nth-child(2){transition-delay:.05s}.ditems a:nth-child(3){transition-delay:.1s}.ditems a:nth-child(4){transition-delay:.15s}
.mgrid>div,.specgrid .spec,.ulist>div{transition:background .3s,transform .3s}
.mgrid>div:hover,.ulist>div:hover{background:#101215}
.pcard h3,.tcard h3{transition:color .3s,transform .4s}
.pcard:hover h3,.tcard:hover h3{color:var(--sand);transform:translateX(6px)}
.anat-fig .hot{animation:hotIn .6s both}
@keyframes hotIn{from{transform:scale(0)}to{transform:none}}

/* bands: slow light sweep */
.band{position:relative;overflow:hidden}
.band::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(201,173,128,.07) 50%,transparent 70%);transform:translateX(-100%);animation:sweep 9s ease-in-out infinite}
@keyframes sweep{0%,35%{transform:translateX(-100%)}75%,100%{transform:translateX(100%)}}
.band>*{position:relative}

@media(prefers-reduced-motion:reduce){
  .hero-in>*,.phero-in>*,.cm-hero-in>*,.contact-in>div:first-child>*,.nav{opacity:1;transform:none;animation:none}
  .sw>span,.wipe,.wipe img,.form-stage img{transform:none;clip-path:none}
  .scrub .wd{opacity:1}.progress{display:none}
}

/* preloader: tracked UGV */
.preloader{position:fixed;inset:0;z-index:300;background:linear-gradient(180deg,rgba(5,5,5,.78),rgba(5,5,5,.9)),url("img/hero.jpg") 62% 50%/cover #050505;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;transition:opacity .7s .1s,visibility .7s .1s,transform .9s cubic-bezier(.7,0,.2,1)}
.preloader.done{opacity:0;visibility:hidden;transform:translateY(-4%)}
.pl-wrap{position:relative;width:150px;padding:22px 26px 16px;background:rgba(5,5,5,.72);border:1px solid #2a2d30;backdrop-filter:blur(6px)}
.pl-ugv{width:100%;height:auto;display:block;overflow:visible}
.pl-ugv *{vector-effect:non-scaling-stroke}
.pl-body{animation:plBob .5s ease-in-out infinite alternate}
@keyframes plBob{from{transform:translateY(0)}to{transform:translateY(-1.2px)}}
.pl-tread{stroke-dasharray:7 5;animation:plTread .5s linear infinite}
@keyframes plTread{to{stroke-dashoffset:-12}}
.pl-tread.low{animation-direction:reverse}
.pl-wheel{transform-box:fill-box;transform-origin:center;animation:plSpin .9s linear infinite}
@keyframes plSpin{to{transform:rotate(360deg)}}
.pl-cam{transform-box:fill-box;transform-origin:50% 100%;animation:plScan 2.4s ease-in-out infinite alternate}
@keyframes plScan{from{transform:rotate(-14deg)}to{transform:rotate(14deg)}}
.pl-ground{stroke-dasharray:14 12;animation:plGround .6s linear infinite}
@keyframes plGround{to{stroke-dashoffset:26}}
.pl-bar{width:150px;height:1px;background:#202326;position:relative;overflow:hidden}
.pl-bar i{position:absolute;inset:0;background:var(--sand);transform:scaleX(0);transform-origin:0 50%;animation:plLoad 1.5s cubic-bezier(.5,0,.2,1) forwards}
@keyframes plLoad{to{transform:scaleX(1)}}
.pl-name{font-size:12px;letter-spacing:.34em;text-transform:uppercase;color:#8d9297;font-weight:600}
html.pre *:not(body):not(.preloader):not(.preloader *){animation-play-state:paused!important}

.pl-tread.rev{animation-direction:reverse}
.pl-rc{transform-box:fill-box;transform-origin:20% 50%;animation:plRc 1.8s ease-in-out infinite alternate}
@keyframes plRc{from{transform:rotate(-4deg)}to{transform:rotate(6deg)}}
.pl-wl{transform-box:fill-box;transform-origin:100% 50%;animation:plWl 2.2s ease-in-out infinite alternate}
.pl-wr{transform-box:fill-box;transform-origin:0 50%;animation:plWl 2.2s ease-in-out infinite alternate}
@keyframes plWl{from{transform:scaleX(.15)}to{transform:scaleX(1)}}