/* GRID SCAN / flight, scanning and spatial intelligence */
:root{--accent:#22ddf2;--bg:#060e14}
body{background:#060e14}.header{background:#060e14dc;border-color:#9acfe51a;height:94px}
.brand{display:flex;align-items:center}.brand-logo{width:245px;height:65px;object-fit:contain}.brand:has(.brand-logo){font-size:0;gap:0}
.hero{position:relative;isolation:isolate;height:calc(100svh - 94px);min-height:740px;max-height:1080px;background:radial-gradient(ellipse at 75% 30%,#10344855,transparent 52%),#060e14;overflow:hidden;padding:0}
.hero:before{content:'';position:absolute;inset:0;background-image:linear-gradient(#bce8ff04 1px,transparent 1px),linear-gradient(90deg,#bce8ff04 1px,transparent 1px);background-size:100px 100px;pointer-events:none;mask-image:linear-gradient(0deg,transparent,#000)}
.hero-heading{position:absolute;z-index:3;left:6vw;top:11%;pointer-events:none}
.hero-heading .eyebrow{color:#95b8c6;font:11px/1.7 var(--mono);letter-spacing:.12em}
.hero h1{font-size:clamp(4.6rem,7.8vw,8.3rem);letter-spacing:-.068em;line-height:.99;margin:30px 0 0;font-weight:500}
.hero h1 em{font-style:normal;color:var(--accent)}
.hero-message{position:absolute;left:6vw;top:57%;z-index:4;width:350px;max-width:32%}
.hero-message p{font-size:17px;line-height:1.7;color:#aac0cd;max-width:345px}
.hero .button{margin-top:27px;background:var(--accent);color:#04131a;border-radius:2px;gap:35px;box-shadow:0 0 30px #22ddf20c;min-height:54px}
.hero .button:hover{box-shadow:0 0 30px #22ddf22b;background:#87effa}
.hero-secondary{display:flex;gap:22px;font-size:13px;color:#a4c0ce;margin:20px 0 0;width:max-content}.hero-secondary:hover{color:#f2fcff}
.flight-scene{position:absolute;inset:-3% -6% 3% 30%;z-index:1;pointer-events:none;--pointer-x:0px;--pointer-y:0px}
.scene-aura{position:absolute;inset:4% 8% 16%;background:radial-gradient(ellipse at 50% 45%,#187f972e,transparent 64%);animation:aura-breathe 8s ease-in-out infinite}
#scan{position:absolute;inset:0;width:100%;height:100%;opacity:1;mix-blend-mode:screen;mask-image:linear-gradient(0deg,transparent,#000 17%,#000 85%,transparent)}
.drone-position{position:absolute;z-index:4;top:12%;left:9%;width:83%;transform:translate(var(--pointer-x),var(--pointer-y));will-change:transform}
.drone-lift{animation:drone-flight 18s cubic-bezier(.42,0,.28,1) infinite;transform-origin:50% 60%;will-change:transform}
.survey-drone{display:block;width:100%;height:auto;filter:drop-shadow(0 18px 28px #0007);user-select:none}
.scan-volume{position:absolute;z-index:2;top:42%;left:27%;width:46%;height:35%;transform-origin:50% 0;animation:scan-reveal 18s ease infinite;mix-blend-mode:screen}
.scan-volume svg{width:100%;height:100%}
.scene-coordinate{position:absolute;font:10px/1.7 var(--mono);letter-spacing:.09em;color:#7ba7b9;z-index:5}
.coord-left{left:14%;bottom:20%}.coord-left i{display:inline-block;width:5px;height:5px;background:var(--accent);margin-right:10px;box-shadow:0 0 12px var(--accent)}
.coord-right{right:15%;top:24%;color:#22ddf2;font-size:13px;writing-mode:vertical-rl}.coord-right span{font-size:9px;color:#648999;margin-top:15px}
.scene-caption{position:absolute;bottom:12%;right:16%;font:9px var(--mono);letter-spacing:.14em;color:#547784}
.hero-sequence{position:absolute;z-index:5;bottom:0;left:6vw;right:6vw;display:flex;align-items:center;justify-content:space-between;gap:25px;min-height:84px;border-top:1px solid #84c7e226;font:11px var(--mono)}
.sequence-label{font-size:10px;letter-spacing:.1em;color:#7898a8}.sequence-stages{display:flex;gap:38px}.sequence-step{position:relative;color:#648391;padding:25px 0;transition:color .8s}.sequence-step:before{content:'';position:absolute;top:0;left:0;width:0;height:1px;background:#22ddf2;transition:width 1s}.sequence-step.active{color:#e9f8fb}.sequence-step.active:before{width:100%}.sequence-step b{font-weight:400;color:#22ddf2;margin-right:9px}
#motion-toggle{font:11px var(--mono);display:flex;align-items:center;gap:7px;min-height:44px;padding:10px 0 10px 15px;border:0;background:none;color:#a9c6d1;cursor:pointer}
.scene-offscreen *{animation-play-state:paused!important}
@keyframes drone-flight{0%{transform:translate3d(0,55px,0) scale(.9) rotate(-4deg)}22%{transform:translate3d(-8px,-18px,0) scale(1) rotate(0deg)}52%{transform:translate3d(7px,-30px,0) scale(1.02) rotate(2deg)}77%{transform:translate3d(-5px,-18px,0) scale(.99) rotate(-1deg)}100%{transform:translate3d(0,55px,0) scale(.9) rotate(-4deg)}}
@keyframes scan-reveal{0%,10%,100%{opacity:0;transform:scaleX(.4)}25%,70%{opacity:.8;transform:scaleX(1)}88%{opacity:.25;transform:scaleX(1.15)}}
@keyframes aura-breathe{50%{opacity:.5;transform:scale(.9)}}
.hero-heading,.hero-message{animation:copy-enter 1.2s ease both}.hero-message{animation-delay:.2s}@keyframes copy-enter{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.stats{background:#09151d;border-top:1px solid #84c7e21a}.audience-card{transition:background .3s,transform .3s}.audience-card:hover{background:#0e2632}.applications{background:linear-gradient(135deg,#071219,#0a1c28)}.cap-visual{box-shadow:0 20px 65px #0003}.roadmap{background:radial-gradient(ellipse at 15% 50%,#12344677,transparent 65%),#08151d}
@media(min-width:1600px){.hero-message{top:58%;width:400px;max-width:30%}.hero-message p{max-width:400px}.drone-position{top:10%;width:79%}}
@media(max-width:1100px) and (min-width:761px){.hero{min-height:730px}.hero-heading{left:5vw;top:10%}.hero h1{font-size:8vw}.hero-message{left:5vw;top:48%;max-width:35%}.hero-message p{font-size:16px}.flight-scene{inset:5% -12% 5% 28%}.drone-position{top:14%}.sequence-label{display:none}.sequence-stages{gap:24px}.brand-logo{width:210px;height:60px}.header nav{font-size:12px;gap:14px}.header{padding:0 4vw;gap:18px}}
@media(max-width:760px){
.header{height:76px;padding:0 18px;gap:12px}.brand-logo{width:174px;height:56px}.nav-cta{display:none}.menu-toggle{margin-left:auto}.header nav{top:76px}
.hero{height:auto;min-height:0;max-height:none;display:flex;flex-direction:column;padding:28px 22px 0}
.hero-heading{position:relative;inset:auto;order:0;text-align:center;z-index:3}.hero-heading .eyebrow{font-size:9px;letter-spacing:.08em}.hero h1{font-size:clamp(3.6rem,15vw,5.3rem);line-height:1;letter-spacing:-.065em;margin:22px 0 0}
.flight-scene{position:relative;inset:auto;order:1;width:calc(100% + 44px);margin:-2px -22px -20px;height:355px;flex-shrink:0}
.drone-position{top:2%;left:3%;width:94%}.scene-aura{inset:0}.scan-volume{top:39%;left:26%;width:48%;height:34%}.coord-left{left:8%;bottom:17%;font-size:8px}.coord-right{right:7%;top:17%;font-size:10px}.coord-right span{font-size:8px}.scene-caption{bottom:8%;right:8%;font-size:7px}.hero-message{position:relative;inset:auto;order:2;max-width:none;width:100%;text-align:center;margin:0 0 24px}.hero-message p{max-width:450px;margin:0 auto;font-size:15px;line-height:1.65}.hero .button{margin-top:20px;width:100%;max-width:360px;min-height:52px}.hero-secondary{margin:17px auto 0;font-size:12px}.hero-sequence{position:relative;inset:auto;order:3;min-height:100px;display:grid;grid-template-columns:1fr;width:100%;gap:0;padding:0 0 8px}.sequence-label{display:none}.sequence-stages{display:flex;justify-content:space-between;gap:12px}.sequence-step{font-size:9px;line-height:1.6;padding:18px 0 8px}.sequence-step b{display:block;font-size:10px;margin:0 0 3px}#motion-toggle{justify-self:center;font-size:10px;min-height:36px;padding:8px}
}
@media(max-width:360px){.hero{padding:25px 18px 0}.hero h1{font-size:3.4rem}.hero-heading .eyebrow{font-size:8px}.flight-scene{width:calc(100% + 36px);margin-left:-18px;margin-right:-18px;height:310px}.brand-logo{width:162px}.hero-message p{font-size:15px}.sequence-stages{gap:8px}.sequence-step{font-size:8px}}
@media(prefers-reduced-motion:reduce){.hero-heading,.hero-message,.drone-lift,.scene-aura,.scan-volume{animation:none!important}.drone-lift{transform:translateY(-5px)}.scan-volume{opacity:.35}.drone-position{transform:none}.sequence-step{transition:none}}
