/* Animated service previews */
.project{isolation:isolate;cursor:default}
.video-open-trigger{cursor:pointer}
.video-open-trigger:after{content:"";position:absolute;z-index:3;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(3,19,28,.72));opacity:.88;transition:.25s}
.video-open-trigger:hover:after,.video-open-trigger:focus-visible:after{opacity:.68}
.video-open-trigger:focus-visible{outline:3px solid var(--mint);outline-offset:4px}
.open-video-button{position:absolute;z-index:5;right:22px;bottom:22px;display:grid!important;place-items:center;width:34px;height:34px;border:1px solid rgba(255,255,255,.34);border-radius:50%;background:rgba(3,22,34,.34);backdrop-filter:blur(8px);color:rgba(255,255,255,.82);font-size:10px;padding-left:2px;box-shadow:0 10px 26px rgba(0,0,0,.18);transition:.25s}
.video-open-trigger:hover .open-video-button,.video-open-trigger:focus-visible .open-video-button{background:rgba(39,226,194,.82);color:var(--deep);border-color:rgba(39,226,194,.82);transform:scale(1.05)}
.project:before{opacity:.42}
.project .motion-scene{position:absolute;z-index:1;inset:0;display:block;overflow:hidden}
.project-video{position:absolute!important;z-index:1!important;inset:0;width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.06) contrast(1.03)}
.project-image{position:absolute;z-index:1;inset:0;width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.03) contrast(1.04)}
.loop-badge{position:absolute!important;z-index:4!important;right:22px;top:22px;font:700 8px Manrope;letter-spacing:.15em;color:rgba(255,255,255,.78);display:flex!important;align-items:center;gap:6px}
.loop-badge i{width:6px;height:6px;border-radius:50%;background:#ff665c;box-shadow:0 0 10px #ff665c;animation:recPulse 1.3s ease-in-out infinite}
.project-tag,.project strong,.project small{z-index:4}
.scene-fpv{background:radial-gradient(circle at 50% 48%,#57aeb0 0 2%,#0b6770 17%,#041e2b 64%);perspective:500px;animation:fpvBank 7s ease-in-out infinite}
.tunnel{position:absolute;left:50%;top:50%;border:2px solid rgba(39,226,194,.58);transform:translate(-50%,-50%) rotate(45deg);animation:tunnelRush 3.2s linear infinite}
.t1{width:8%;height:8%}
.t2{width:8%;height:8%;animation-delay:-.8s}
.t3{width:8%;height:8%;animation-delay:-1.6s}
.t4{width:8%;height:8%;animation-delay:-2.4s}
.fpv-target{position:absolute;left:50%;top:48%;width:34px;height:34px;border:1px solid rgba(255,255,255,.75);border-radius:50%;transform:translate(-50%,-50%)}
.fpv-target:before,.fpv-target:after{content:"";position:absolute;background:rgba(255,255,255,.7)}
.fpv-target:before{width:48px;height:1px;left:-7px;top:16px}
.fpv-target:after{height:48px;width:1px;top:-7px;left:16px}
.speed-line{position:absolute;left:50%;top:50%;height:1px;width:38%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.6));transform-origin:left}
.sl1{transform:rotate(18deg)}
.sl2{transform:rotate(162deg)}
.sl3{transform:rotate(235deg)}
.scene-air{background:linear-gradient(#4c8fa5 0 48%,#126d72 49%);animation:airDrift 12s ease-in-out infinite}
.air-sun{position:absolute;right:17%;top:16%;width:43px;height:43px;border-radius:50%;background:#8ff3df;box-shadow:0 0 45px rgba(39,226,194,.58)}
.ridge{position:absolute;left:-15%;width:130%;bottom:0;display:block;clip-path:polygon(0 66%,13% 39%,26% 59%,42% 21%,57% 61%,72% 31%,100% 66%,100% 100%,0 100%)}
.ridge-back{height:72%;background:#17767a;animation:ridgeMove 12s ease-in-out infinite}
.ridge-front{height:54%;background:#07414d;transform:translateX(-3%);animation:ridgeMove 8s ease-in-out infinite reverse}
.drone-dot{position:absolute;left:18%;top:30%;width:17px;height:5px;border-radius:50%;background:#041d2a;box-shadow:-10px 1px 0 -1px #041d2a,10px 1px 0 -1px #041d2a;animation:droneFlight 8s ease-in-out infinite}
.scene-scan{background:linear-gradient(145deg,#0b5964,#041f2d)}
.roof-grid{position:absolute;inset:18% -15% -30%;display:block;transform:perspective(400px) rotateX(58deg) rotateZ(-12deg);background:repeating-linear-gradient(90deg,rgba(255,255,255,.14) 0 1px,transparent 1px 34px),repeating-linear-gradient(0deg,rgba(255,255,255,.14) 0 1px,transparent 1px 24px);border:1px solid rgba(255,255,255,.25)}
.scan-line{position:absolute;left:0;right:0;top:15%;height:2px;background:var(--mint);box-shadow:0 0 20px var(--mint),0 8px 24px rgba(39,226,194,.4);animation:scanRoof 4s ease-in-out infinite}
.scan-point{position:absolute;width:8px;height:8px;border:2px solid #ff665c;border-radius:50%;box-shadow:0 0 12px #ff665c;animation:pointPulse 1.8s ease-in-out infinite}
.sp1{left:38%;top:48%}
.sp2{right:25%;top:61%;animation-delay:-.9s}
.mini-drone{position:absolute;right:18%;top:22%;font-style:normal;color:#fff;font-size:18px;animation:miniHover 3s ease-in-out infinite}
.mini-drone:after{content:"";position:absolute;width:30px;height:1px;background:rgba(255,255,255,.65);left:-6px;top:10px}
.portrait-photo{width:330px;height:440px;border:0;background:#052f3d;box-shadow:0 28px 70px rgba(0,0,0,.28)}
.portrait-photo img{width:100%;height:100%;object-fit:cover;object-position:center 25%;display:block;filter:saturate(.86) contrast(1.04)}
.hero-video{position:absolute;z-index:0;inset:0;width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.35) contrast(1.08)}
.hero-youtube-preview{position:absolute;z-index:0;inset:0;width:100%;height:100%;border:0;pointer-events:none;transform:scale(1.14);filter:saturate(1.3) contrast(1.08)}
.hero-video-overlay{position:absolute;z-index:1;inset:0;background:linear-gradient(180deg,rgba(3,64,69,.10),rgba(2,30,42,.46)),radial-gradient(circle at 72% 18%,rgba(39,226,194,.34),transparent 32%),linear-gradient(135deg,rgba(39,226,194,.16),transparent 45%)}
.hero-ascent>*{position:absolute}
.sky-glow{inset:-20%;background:radial-gradient(circle at 56% 24%,rgba(255,248,202,.95),rgba(255,193,117,.35) 16%,transparent 34%),radial-gradient(circle at 42% 75%,rgba(39,226,194,.36),transparent 35%);animation:skyBreath 7s ease-in-out infinite}
.sun-rise{left:50%;top:28%;width:108px;height:108px;border-radius:50%;background:linear-gradient(135deg,#fff7b9,#27e2c2);box-shadow:0 0 55px rgba(255,245,180,.55),0 0 120px rgba(39,226,194,.36);transform:translate(-50%,-50%);animation:sunLift 8s ease-in-out infinite}
.cloud-layer{left:-18%;right:-18%;height:42%;display:block;filter:drop-shadow(0 18px 28px rgba(5,33,45,.12))}
.cloud-layer i{position:absolute;display:block;border-radius:999px;background:rgba(255,255,255,.9)}
.cloud-layer i:before,.cloud-layer i:after{content:"";position:absolute;border-radius:50%;background:inherit}
.cloud-layer i:before{width:48%;height:110%;left:18%;bottom:34%}
.cloud-layer i:after{width:68%;height:145%;right:14%;bottom:18%}
.cloud-layer-back{top:42%;opacity:.52;animation:cloudDriftBack 18s linear infinite}
.cloud-layer-mid{top:54%;opacity:.78;animation:cloudDriftMid 14s linear infinite}
.cloud-layer-front{top:69%;opacity:.95;animation:cloudDriftFront 10s linear infinite}
.cloud-layer-back i:nth-child(1){left:0;top:16%;width:220px;height:58px}
.cloud-layer-back i:nth-child(2){left:34%;top:5%;width:260px;height:70px}
.cloud-layer-back i:nth-child(3){right:0;top:18%;width:230px;height:62px}
.cloud-layer-mid i:nth-child(1){left:4%;top:20%;width:290px;height:76px}
.cloud-layer-mid i:nth-child(2){left:38%;top:2%;width:330px;height:84px}
.cloud-layer-mid i:nth-child(3){right:2%;top:23%;width:280px;height:78px}
.cloud-layer-front i:nth-child(1){left:-2%;top:18%;width:360px;height:92px}
.cloud-layer-front i:nth-child(2){left:34%;top:0;width:420px;height:106px}
.cloud-layer-front i:nth-child(3){right:-4%;top:20%;width:360px;height:96px}
.camera-climb{z-index:3;left:50%;top:66%;width:70px;height:70px;transform:translate(-50%,-50%);animation:cameraClimb 8s ease-in-out infinite}
.camera-body{position:absolute;inset:12px 8px;border-radius:18px;background:linear-gradient(145deg,rgba(4,31,45,.92),rgba(10,91,105,.88));box-shadow:0 18px 40px rgba(0,0,0,.22),inset 0 0 0 1px rgba(255,255,255,.18)}
.camera-body:before,.camera-body:after{content:"";position:absolute;top:50%;width:22px;height:4px;border-radius:999px;background:rgba(4,31,45,.86);box-shadow:0 0 0 5px rgba(255,255,255,.12)}
.camera-body:before{left:-18px;transform:translateY(-50%) rotate(-10deg)}
.camera-body:after{right:-18px;transform:translateY(-50%) rotate(10deg)}
.camera-lens{position:absolute;left:50%;top:50%;width:25px;height:25px;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,#27e2c2 0 24%,#08384a 26% 100%);box-shadow:0 0 20px rgba(39,226,194,.55)}
.camera-spark{position:absolute;width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 16px #fff;opacity:.75}
.spark-one{left:7px;top:0;animation:sparkFloat 2.8s ease-in-out infinite}
.spark-two{right:0;bottom:8px;animation:sparkFloat 3.4s ease-in-out infinite reverse}
.altitude-line{z-index:2;right:12%;top:28%;width:1px;height:45%;background:linear-gradient(transparent,rgba(255,255,255,.45),transparent)}
.altitude-line span{position:absolute;right:0;width:44px;height:1px;background:rgba(255,255,255,.36)}
.altitude-line span:nth-child(1){top:10%}
.altitude-line span:nth-child(2){top:48%;width:30px}
.altitude-line span:nth-child(3){bottom:8%;width:52px}
.video-lightbox{position:fixed;z-index:1000;inset:0;display:grid;place-items:center;padding:0;background:#000;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,visibility .18s ease}
.video-lightbox.open{opacity:1;visibility:visible;pointer-events:auto}
.video-lightbox-panel{position:relative;width:100vw;height:100vh;padding:0;background:#000;border:0;box-shadow:none;overflow:hidden;display:grid;place-items:center}
.video-lightbox-head{display:none}
.video-lightbox-head .eyebrow{margin:0 0 10px;color:rgba(255,255,255,.65)}
.video-lightbox-head h3{margin:0;font:800 clamp(26px,4vw,44px) Manrope;letter-spacing:-.045em}
.video-lightbox-head p{margin:0;color:rgba(255,255,255,.68)}
.video-sound-note{max-width:240px;font-size:13px;line-height:1.5;text-align:right}
.video-lightbox-player{display:block;width:100vw;height:100vh;max-height:none;background:#000;object-fit:contain}
.video-lightbox-youtube{border:0}
.video-lightbox-close{position:fixed;right:24px;top:20px;z-index:1001;width:48px;height:48px;border:1px solid rgba(255,255,255,.18);border-radius:50%;background:rgba(255,255,255,.96);color:var(--deep);font-size:34px;line-height:1;cursor:pointer;box-shadow:0 15px 40px rgba(0,0,0,.25)}
.video-lightbox-close:hover,.video-lightbox-close:focus-visible{background:var(--mint);outline:none}
body.lightbox-open{overflow:hidden}

@keyframes recPulse{50%{opacity:.25;transform:scale(.7)}
}
@keyframes fpvBank{0%,100%{transform:scale(1.04) rotate(0)}
35%{transform:scale(1.13) rotate(-2deg)}
70%{transform:scale(1.08) rotate(2deg)}
}
@keyframes tunnelRush{0%{width:8%;height:8%;opacity:0}
12%{opacity:1}
100%{width:130%;height:130%;opacity:0}
}
@keyframes airDrift{0%,100%{transform:scale(1.04) translateX(0)}
50%{transform:scale(1.11) translateX(-2%)}
}
@keyframes ridgeMove{50%{transform:translateX(4%)}
}
@keyframes droneFlight{0%,100%{transform:translate(0,0) rotate(-4deg)}
50%{transform:translate(150px,25px) rotate(5deg)}
}
@keyframes scanRoof{0%,100%{top:16%;opacity:.4}
50%{top:80%;opacity:1}
}
@keyframes pointPulse{50%{transform:scale(1.8);opacity:.35}
}
@keyframes miniHover{0%,100%{transform:translateY(0) rotate(-4deg)}
50%{transform:translateY(8px) rotate(4deg)}
}
@keyframes skyBreath{0%,100%{transform:scale(1);opacity:.92}50%{transform:scale(1.08);opacity:1}}
@keyframes sunLift{0%,100%{transform:translate(-50%,6%) scale(.82);opacity:.82}48%{transform:translate(-50%,-50%) scale(1);opacity:1}72%{transform:translate(-50%,-38%) scale(.96)}}
@keyframes cloudDriftBack{from{transform:translateX(0) translateY(0)}to{transform:translateX(-18%) translateY(-2%)}}
@keyframes cloudDriftMid{from{transform:translateX(-5%) translateY(0)}to{transform:translateX(12%) translateY(-5%)}}
@keyframes cloudDriftFront{from{transform:translateX(8%) translateY(0)}to{transform:translateX(-10%) translateY(-8%)}}
@keyframes cameraClimb{0%,100%{transform:translate(-50%,20%) scale(.9);opacity:.86}45%{transform:translate(-50%,-42%) scale(1.04);opacity:1}70%{transform:translate(-50%,-28%) scale(.98)}}
@keyframes sparkFloat{50%{transform:translateY(-12px) translateX(6px);opacity:.28}}

@media(max-width:620px){.loop-badge{right:14px;top:15px}
.sun-rise{width:82px;height:82px}
.camera-climb{width:56px;height:56px}
.cloud-layer-front i:nth-child(2){width:330px}
.open-video-button{display:none!important}
.video-lightbox{padding:0}
.video-lightbox-panel{height:100vh;padding:0}
.video-lightbox-head{display:none}
.video-sound-note{text-align:left;max-width:none;margin-top:10px!important}
.video-lightbox-close{right:14px;top:12px;width:42px;height:42px;font-size:30px}
.video-lightbox-player{width:100vw;height:100vh;max-height:none}
.portrait-photo{width:265px;height:360px}
}
@media(prefers-reduced-motion:reduce){.motion-scene,.motion-scene *,.loop-badge i,.hero-ascent *{animation:none!important}
}


