:root{--bg:#f5f8ff;--surface:#ffffff;--text:#122033;--muted:#5f6f89;--line:#dbe5f5;--brand:#0d5bd7;--brand2:#0b3f99;--accent:#0fbf9f;--dark:#081a3a}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:Inter,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.55}a{text-decoration:none;color:var(--brand)}.wrap{max-width:1200px;margin:0 auto;padding:0 24px}.topbar{background:#0a1d44;color:#d8e6ff;font-size:13px}.topbar .wrap{display:flex;justify-content:space-between;padding:8px 24px}.nav{background:#eceff4;border-bottom:1px solid #cfd9eb;position:sticky;top:0;z-index:40}.nav .wrap{display:flex;align-items:center;justify-content:space-between;padding:16px 24px}.logo{display:flex;align-items:center;gap:14px;font-weight:800}.logo-box{width:82px;height:auto;max-height:82px;display:block;object-fit:contain;border-radius:6px;border:1px solid #d7deea;background:#fff;padding:4px;box-shadow:0 6px 18px rgba(19,37,68,.16)}.brand-word{color:#101625;font-weight:900;letter-spacing:.2px;font-size:24px;line-height:1}.menu a{margin-left:22px;color:#274064;font-weight:600}.nav-cta{display:flex;gap:22px;align-items:center;margin-left:22px}.btn{display:inline-block;padding:12px 18px;border-radius:10px;font-weight:700;cursor:pointer;box-shadow:0 4px 12px rgba(13,31,63,.14);transition:transform .16s ease,box-shadow .16s ease}.btn:hover{transform:translateY(-1px);box-shadow:0 8px 16px rgba(13,31,63,.18)}.btn.primary{background:var(--brand);color:#fff}.btn.ghost{border:1px solid #b8cae9;color:#21406b;background:#fff}.btn.red{background:#e1062c;color:#fff}.btn.remote{background:#e1062c;color:#fff;box-shadow:0 8px 16px rgba(225,6,44,.25)}.hero{position:relative;overflow:hidden;background:linear-gradient(120deg,#0d4fb8,#0b3f99);color:#fff;padding:78px 0}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(6,20,56,.70),rgba(6,20,56,.78)),url('https://images.unsplash.com/photo-1510511459019-5dda7724fd87?auto=format&fit=crop&w=1800&q=80') center/cover no-repeat;filter:saturate(1.02) contrast(1.05);transform:scale(1.02);animation:bgDrift 24s ease-in-out infinite;pointer-events:none}.hero:after{content:"";position:absolute;inset:-20% -10%;background:repeating-linear-gradient(90deg,rgba(255,255,255,.06) 0 2px,transparent 2px 48px),repeating-linear-gradient(0deg,rgba(255,255,255,.04) 0 2px,transparent 2px 40px);transform-origin:center;animation:serverFlow 9s linear infinite;opacity:.28;pointer-events:none}.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.15fr .85fr;gap:26px;align-items:center}.eyebrow{display:inline-block;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.25);padding:6px 10px;border-radius:999px;font-size:12px}.hero h1{font-size:50px;line-height:1.08;margin:14px 0}.hero p{max-width:62ch;color:#d9e6ff;font-size:18px}.cta{display:flex;gap:12px;margin-top:20px;flex-wrap:wrap}.hero-card{background:rgba(4,19,52,.55);border:1px solid rgba(255,255,255,.25);border-radius:16px;padding:18px}.hero-card h3{margin:0 0 8px}.hero-list{margin:0;padding-left:18px;color:#d8e6ff}@keyframes serverFlow{0%{transform:perspective(500px) translateZ(0) scale(1) translateY(0)}50%{transform:perspective(500px) translateZ(40px) scale(1.08) translateY(6px)}100%{transform:perspective(500px) translateZ(0) scale(1) translateY(0)}}@keyframes bgDrift{0%,100%{transform:scale(1.03) translateX(0)}50%{transform:scale(1.08) translateX(-1.2%)}}.section{padding:64px 0}.h2{font-size:36px;margin:0 0 8px}.lead{color:var(--muted);margin:0 0 24px}.kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:-34px}.kpi .card{padding:18px}.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:20px;box-shadow:0 8px 22px rgba(13,31,63,.05)}.knum{font-size:31px;font-weight:850;color:#0b3f99}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.list{padding-left:18px;color:var(--muted)}.action-btn{margin-top:10px}.chip{display:inline-block;background:#eef4ff;border:1px solid #c8daf7;color:#174078;border-radius:999px;padding:5px 10px;font-size:12px;margin:4px 6px 0 0}.band{background:linear-gradient(120deg,#0b2c73,#103b96);color:#fff;border-radius:16px;padding:24px;display:flex;justify-content:space-between;align-items:center;gap:20px}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:11px;border-bottom:1px solid var(--line);text-align:left}.table th{color:#45608a}.process{counter-reset:p;list-style:none;padding:0}.process li{counter-increment:p;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 12px 12px 44px;position:relative;margin-bottom:9px}.process li:before{content:counter(p);position:absolute;left:12px;top:11px;width:23px;height:23px;border-radius:50%;display:grid;place-items:center;background:#e2ecff;color:#0a3f9d;font-weight:700}.footer{background:#091d46;color:#bcd0f5;padding:34px 0;margin-top:50px}.footer a{color:#dbe9ff;margin-right:12px}input,textarea,select{width:100%;padding:11px;border-radius:10px;border:1px solid #c6d7f3;font:inherit;background:#fff}label{display:block;margin-bottom:10px}.warn{font-size:12px;color:#6b7a93}.hero.subpage{padding:52px 0 40px}
.hero.subpage .hero-grid{grid-template-columns:1fr}
.hero.subpage h1{font-size:38px;margin:10px 0 6px}
.hero.subpage p{max-width:80ch}
@media(max-width:980px){.hero-grid,.grid3,.grid2,.kpi{grid-template-columns:1fr}.menu{display:none}.nav-cta .btn.remote{display:none}.hero h1{font-size:38px}.logo-box{width:68px;max-height:68px;height:auto}.brand-word{font-size:20px}}
.server-tunnel{position:absolute;inset:0;pointer-events:none;overflow:hidden;opacity:.92}
.server-tunnel .lane{position:absolute;left:50%;top:58%;width:130%;height:150%;transform:translate(-50%,-50%) perspective(700px) rotateX(60deg);background:repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 2px,transparent 2px 52px),repeating-linear-gradient(0deg,rgba(255,255,255,.04) 0 2px,transparent 2px 48px);animation:tunnelRush 2.6s linear infinite}
.server-tunnel .rack{position:absolute;top:7%;bottom:-1%;width:29%;border:1px solid rgba(173,203,255,.55);background:linear-gradient(180deg,rgba(10,24,61,.96),rgba(7,17,46,.95));box-shadow:inset 0 0 38px rgba(70,128,255,.18),0 0 22px rgba(6,16,44,.45)}
.server-tunnel .rack.left{left:0;transform:perspective(820px) rotateY(24deg) translateX(-20px);transform-origin:left center}
.server-tunnel .rack.right{right:0;transform:perspective(820px) rotateY(-24deg) translateX(20px);transform-origin:right center}
.server-tunnel .rack:before{content:'';position:absolute;left:10%;right:10%;top:5%;bottom:5%;background:repeating-linear-gradient(180deg,#0c1d4a 0 20px,#09173f 20px 44px);border:1px solid rgba(155,188,250,.35)}
.server-tunnel .rack:after{content:'';position:absolute;left:13%;right:13%;top:7%;bottom:7%;background:
radial-gradient(circle at 12px 10px,rgba(73,212,255,.95) 0 2px,transparent 3px),
radial-gradient(circle at calc(100% - 12px) 10px,rgba(124,247,212,.95) 0 2px,transparent 3px),
repeating-linear-gradient(180deg,transparent 0 20px,rgba(35,58,120,.95) 20px 22px,transparent 22px 44px);
background-size:100% 44px;
animation:ledScan 1.2s linear infinite}
.server-tunnel .laser{position:absolute;height:2px;background:linear-gradient(90deg,transparent,#ff2b55 20%,#ff9aa9 50%,#ff2b55 80%,transparent);opacity:.98;filter:drop-shadow(0 0 10px rgba(255,43,85,.95));transform-origin:left center;animation:laserSweep 2.1s cubic-bezier(.55,.08,.35,.95) infinite}
.server-tunnel .laser.l1{top:22%;left:10%;width:58%;transform:rotate(-16deg);animation-delay:0s}
.server-tunnel .laser.l2{top:40%;left:18%;width:52%;transform:rotate(8deg);animation-delay:.55s}
.server-tunnel .laser.l3{top:62%;left:12%;width:62%;transform:rotate(-10deg);animation-delay:1.1s}
@keyframes ledScan{0%{background-position:0 0}100%{background-position:0 44px}}
@keyframes laserSweep{0%{opacity:0;transform:translate(-160px,-35px) rotate(-18deg) scaleX(.55)}20%{opacity:1}50%{transform:translate(30px,0) rotate(0deg) scaleX(1.15)}80%{opacity:1}100%{opacity:0;transform:translate(180px,35px) rotate(18deg) scaleX(.6)}}
}
.server-tunnel .laser.v{width:2px;height:72%;left:50%;top:14%;background:linear-gradient(180deg,transparent,#ff3d63,#ff98aa,#ff3d63,transparent);animation:laserDrop 2.8s ease-in-out infinite;opacity:.85}
@keyframes laserDrop{0%,100%{transform:translateY(-18%) scaleY(.6);opacity:.2}50%{transform:translateY(10%) scaleY(1.05);opacity:.95}}


/* Enhanced bidirectional surveillance lasers */
.server-tunnel .laser{mix-blend-mode:screen}
.server-tunnel .laser.l1{animation:laserSweepA 2.2s cubic-bezier(.55,.08,.35,.95) infinite}
.server-tunnel .laser.l2{animation:laserSweepB 2.5s cubic-bezier(.55,.08,.35,.95) infinite}
.server-tunnel .laser.l3{animation:laserSweepC 2.0s cubic-bezier(.55,.08,.35,.95) infinite}
.server-tunnel .laser.v{animation:laserPingPong 2.7s ease-in-out infinite}
.server-tunnel .laser.rev{position:absolute;height:2px;background:linear-gradient(90deg,transparent,#ff2b55 20%,#ffd0d8 50%,#ff2b55 80%,transparent);opacity:.98;filter:drop-shadow(0 0 12px rgba(255,43,85,.95));transform-origin:right center;mix-blend-mode:screen}
.server-tunnel .laser.rev.r1{top:30%;right:10%;width:56%;transform:rotate(14deg);animation:laserSweepRevA 2.3s cubic-bezier(.55,.08,.35,.95) infinite .25s}
.server-tunnel .laser.rev.r2{top:54%;right:16%;width:48%;transform:rotate(-9deg);animation:laserSweepRevB 2.6s cubic-bezier(.55,.08,.35,.95) infinite .7s}
.server-tunnel .impact{position:absolute;width:12px;height:12px;border-radius:50%;background:radial-gradient(circle,#ffd7de 0 20%,#ff4f72 30%,transparent 72%);filter:blur(.2px) drop-shadow(0 0 10px #ff2b55);opacity:0;pointer-events:none;mix-blend-mode:screen}
.server-tunnel .impact.i1{left:62%;top:33%;animation:impactPulse 2.2s ease-in-out infinite}
.server-tunnel .impact.i2{left:54%;top:57%;animation:impactPulse 2.6s ease-in-out infinite .6s}
.server-tunnel .impact.i3{left:68%;top:45%;animation:impactPulse 2.0s ease-in-out infinite 1.1s}
@keyframes laserSweepA{0%{opacity:0;transform:translate(-180px,-45px) rotate(-20deg) scaleX(.5)}20%{opacity:1}50%{transform:translate(20px,0) rotate(-2deg) scaleX(1.2)}80%{opacity:1}100%{opacity:0;transform:translate(200px,42px) rotate(18deg) scaleX(.6)}}
@keyframes laserSweepB{0%{opacity:0;transform:translate(-160px,30px) rotate(12deg) scaleX(.55)}25%{opacity:1}50%{transform:translate(30px,0) rotate(0deg) scaleX(1.1)}75%{opacity:1}100%{opacity:0;transform:translate(170px,-28px) rotate(-12deg) scaleX(.65)}}
@keyframes laserSweepC{0%{opacity:0;transform:translate(-170px,-25px) rotate(-12deg) scaleX(.5)}22%{opacity:1}50%{transform:translate(40px,0) rotate(4deg) scaleX(1.25)}78%{opacity:1}100%{opacity:0;transform:translate(190px,20px) rotate(14deg) scaleX(.62)}}
@keyframes laserSweepRevA{0%{opacity:0;transform:translate(180px,40px) rotate(20deg) scaleX(.55)}20%{opacity:1}50%{transform:translate(-20px,0) rotate(2deg) scaleX(1.2)}80%{opacity:1}100%{opacity:0;transform:translate(-210px,-44px) rotate(-18deg) scaleX(.6)}}
@keyframes laserSweepRevB{0%{opacity:0;transform:translate(150px,-26px) rotate(-14deg) scaleX(.55)}20%{opacity:1}50%{transform:translate(-26px,0) rotate(0deg) scaleX(1.12)}80%{opacity:1}100%{opacity:0;transform:translate(-185px,24px) rotate(12deg) scaleX(.64)}}
@keyframes laserPingPong{0%{transform:translateY(-18%) scaleY(.55)}25%{transform:translateY(12%) scaleY(1)}50%{transform:translateY(26%) scaleY(1.12)}75%{transform:translateY(6%) scaleY(.88)}100%{transform:translateY(-18%) scaleY(.55)}}
@keyframes impactPulse{0%,100%{opacity:0;transform:scale(.4)}35%{opacity:.95;transform:scale(1.25)}55%{opacity:.55;transform:scale(.9)}}
/* Hover alarm boost */
.hero:hover .laser{animation-duration:1.15s !important;filter:drop-shadow(0 0 16px rgba(255,43,85,1))}
.hero:hover .laser.v{animation-duration:1.35s !important}
.hero:hover .impact{opacity:1}
.hero:hover .server-tunnel{opacity:1}

.server-tunnel .rack{display:none !important}

.server-tunnel .laser.l1{animation-duration:4.8s !important}
.server-tunnel .laser.l2{animation-duration:5.4s !important}
.server-tunnel .laser.l3{animation-duration:4.4s !important}
.server-tunnel .laser.rev.r1{animation-duration:5.0s !important}
.server-tunnel .laser.rev.r2{animation-duration:5.6s !important}
.server-tunnel .laser.v{animation-duration:6.2s !important}

@keyframes laserSweepA{0%{opacity:0;transform:translate(-260px,-60px) rotate(-22deg) scaleX(.45)}20%{opacity:1}50%{transform:translate(80px,0) rotate(-2deg) scaleX(1.25)}80%{opacity:1}100%{opacity:0;transform:translate(320px,62px) rotate(20deg) scaleX(.58)}}
@keyframes laserSweepB{0%{opacity:0;transform:translate(-240px,44px) rotate(14deg) scaleX(.48)}25%{opacity:1}50%{transform:translate(76px,0) rotate(0deg) scaleX(1.2)}75%{opacity:1}100%{opacity:0;transform:translate(300px,-46px) rotate(-14deg) scaleX(.62)}}
@keyframes laserSweepC{0%{opacity:0;transform:translate(-250px,-40px) rotate(-14deg) scaleX(.45)}22%{opacity:1}50%{transform:translate(90px,0) rotate(4deg) scaleX(1.3)}78%{opacity:1}100%{opacity:0;transform:translate(330px,38px) rotate(16deg) scaleX(.6)}}
@keyframes laserSweepRevA{0%{opacity:0;transform:translate(260px,58px) rotate(22deg) scaleX(.5)}20%{opacity:1}50%{transform:translate(-70px,0) rotate(2deg) scaleX(1.24)}80%{opacity:1}100%{opacity:0;transform:translate(-320px,-60px) rotate(-20deg) scaleX(.58)}}
@keyframes laserSweepRevB{0%{opacity:0;transform:translate(230px,-38px) rotate(-15deg) scaleX(.48)}20%{opacity:1}50%{transform:translate(-72px,0) rotate(0deg) scaleX(1.2)}80%{opacity:1}100%{opacity:0;transform:translate(-295px,40px) rotate(13deg) scaleX(.6)}}

/* thinner, slower, wider-depth laser tuning */
.server-tunnel .laser,.server-tunnel .laser.rev{height:1px !important;opacity:.82 !important;filter:drop-shadow(0 0 6px rgba(255,43,85,.8)) !important}
.server-tunnel .laser.v{width:1px !important;opacity:.72 !important}
.server-tunnel .laser.l1{animation-duration:6.4s !important}
.server-tunnel .laser.l2{animation-duration:7.0s !important}
.server-tunnel .laser.l3{animation-duration:6.0s !important}
.server-tunnel .laser.rev.r1{animation-duration:6.6s !important}
.server-tunnel .laser.rev.r2{animation-duration:7.3s !important}
.server-tunnel .laser.v{animation-duration:8.0s !important}
.server-tunnel .impact{opacity:.45 !important;filter:blur(.6px) drop-shadow(0 0 6px #ff2b55) !important}
@keyframes laserSweepA{0%{opacity:0;transform:translate(-340px,-84px) rotate(-24deg) scaleX(.4)}20%{opacity:.85}50%{transform:translate(120px,0) rotate(-2deg) scaleX(1.18)}80%{opacity:.85}100%{opacity:0;transform:translate(430px,86px) rotate(22deg) scaleX(.5)}}
@keyframes laserSweepB{0%{opacity:0;transform:translate(-320px,62px) rotate(16deg) scaleX(.42)}25%{opacity:.84}50%{transform:translate(118px,0) rotate(0deg) scaleX(1.14)}75%{opacity:.84}100%{opacity:0;transform:translate(410px,-66px) rotate(-16deg) scaleX(.52)}}
@keyframes laserSweepC{0%{opacity:0;transform:translate(-330px,-58px) rotate(-16deg) scaleX(.4)}22%{opacity:.85}50%{transform:translate(130px,0) rotate(4deg) scaleX(1.2)}78%{opacity:.85}100%{opacity:0;transform:translate(440px,58px) rotate(18deg) scaleX(.5)}}
@keyframes laserSweepRevA{0%{opacity:0;transform:translate(340px,80px) rotate(24deg) scaleX(.42)}20%{opacity:.85}50%{transform:translate(-110px,0) rotate(2deg) scaleX(1.16)}80%{opacity:.85}100%{opacity:0;transform:translate(-430px,-82px) rotate(-22deg) scaleX(.5)}}
@keyframes laserSweepRevB{0%{opacity:0;transform:translate(310px,-56px) rotate(-16deg) scaleX(.42)}20%{opacity:.84}50%{transform:translate(-114px,0) rotate(0deg) scaleX(1.14)}80%{opacity:.84}100%{opacity:0;transform:translate(-400px,60px) rotate(15deg) scaleX(.52)}}
@keyframes laserPingPong{0%{transform:translateY(-32%) scaleY(.48)}20%{transform:translateY(-8%) scaleY(.7)}50%{transform:translateY(28%) scaleY(1.08)}80%{transform:translateY(6%) scaleY(.78)}100%{transform:translateY(-32%) scaleY(.48)}}

.server-tunnel .laser,.server-tunnel .laser.rev{height:.8px !important}
.server-tunnel .laser.v{width:.8px !important}

.server-tunnel .laser.l1{left:-8% !important;width:72% !important;top:20% !important}
.server-tunnel .laser.l2{left:-10% !important;width:76% !important;top:42% !important}
.server-tunnel .laser.l3{left:-6% !important;width:78% !important;top:66% !important}
.server-tunnel .laser.rev.r1{right:-8% !important;width:74% !important;top:28% !important}
.server-tunnel .laser.rev.r2{right:-10% !important;width:78% !important;top:56% !important}

@keyframes laserSweepA{0%{opacity:0;transform:translate(-420px,-110px) rotate(-25deg) scaleX(.36)}20%{opacity:.86}50%{transform:translate(180px,0) rotate(-2deg) scaleX(1.2)}80%{opacity:.86}100%{opacity:0;transform:translate(560px,110px) rotate(24deg) scaleX(.46)}}
@keyframes laserSweepB{0%{opacity:0;transform:translate(-410px,86px) rotate(18deg) scaleX(.38)}25%{opacity:.85}50%{transform:translate(170px,0) rotate(0deg) scaleX(1.16)}75%{opacity:.85}100%{opacity:0;transform:translate(540px,-90px) rotate(-18deg) scaleX(.48)}}
@keyframes laserSweepC{0%{opacity:0;transform:translate(-430px,-80px) rotate(-18deg) scaleX(.36)}22%{opacity:.86}50%{transform:translate(190px,0) rotate(4deg) scaleX(1.22)}78%{opacity:.86}100%{opacity:0;transform:translate(570px,84px) rotate(19deg) scaleX(.46)}}
@keyframes laserSweepRevA{0%{opacity:0;transform:translate(420px,104px) rotate(25deg) scaleX(.38)}20%{opacity:.86}50%{transform:translate(-170px,0) rotate(2deg) scaleX(1.18)}80%{opacity:.86}100%{opacity:0;transform:translate(-560px,-108px) rotate(-24deg) scaleX(.46)}}
@keyframes laserSweepRevB{0%{opacity:0;transform:translate(400px,-82px) rotate(-18deg) scaleX(.38)}20%{opacity:.85}50%{transform:translate(-165px,0) rotate(0deg) scaleX(1.16)}80%{opacity:.85}100%{opacity:0;transform:translate(-530px,86px) rotate(17deg) scaleX(.48)}}

.server-tunnel .impact{opacity:.75 !important;width:14px !important;height:14px !important;filter:blur(.1px) drop-shadow(0 0 12px #ff2b55) !important}
.server-tunnel .impact.i1{left:22%;top:24%;animation:impactPulse 2.7s ease-in-out infinite,impactDriftA 5.8s ease-in-out infinite}
.server-tunnel .impact.i2{left:74%;top:48%;animation:impactPulse 3.1s ease-in-out infinite .4s,impactDriftB 6.2s ease-in-out infinite}
.server-tunnel .impact.i3{left:46%;top:68%;animation:impactPulse 2.4s ease-in-out infinite .8s,impactDriftC 5.2s ease-in-out infinite}
@keyframes impactDriftA{0%,100%{transform:translate(0,0)}50%{transform:translate(46px,24px)}}
@keyframes impactDriftB{0%,100%{transform:translate(0,0)}50%{transform:translate(-60px,-28px)}}
@keyframes impactDriftC{0%,100%{transform:translate(0,0)}50%{transform:translate(58px,-34px)}}


/* Futuristic server corridor enhancements */
.hero:before{background-position:center 42% !important}
.server-tunnel .lane{background:repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 2px,transparent 2px 52px),repeating-linear-gradient(0deg,rgba(255,255,255,.04) 0 2px,transparent 2px 48px),radial-gradient(circle at 50% 78%,rgba(30,124,255,.24),transparent 42%) !important}
.server-tunnel .rack{display:block !important;opacity:.55}
.server-tunnel .rack:before{background:repeating-linear-gradient(180deg,#0a1a43 0 24px,#08153a 24px 46px),linear-gradient(90deg,rgba(113,163,255,.2),transparent 12%,transparent 88%,rgba(113,163,255,.2)) !important}
.server-tunnel .rack:after{opacity:.55 !important}

.robot-ghost{position:absolute;right:10%;bottom:8%;width:180px;height:220px;opacity:.45;filter:drop-shadow(0 0 14px rgba(124,247,212,.45));
background:
radial-gradient(circle at 50% 17%,rgba(124,247,212,.95) 0 7px,transparent 8px),
radial-gradient(circle at 42% 17%,rgba(124,247,212,.95) 0 4px,transparent 5px),
radial-gradient(circle at 58% 17%,rgba(124,247,212,.95) 0 4px,transparent 5px),
linear-gradient(180deg,rgba(124,247,212,.9),rgba(124,247,212,.2));
clip-path:polygon(35% 8%,65% 8%,72% 20%,72% 44%,84% 56%,84% 86%,16% 86%,16% 56%,28% 44%,28% 20%);
animation:robotFloat 5.8s ease-in-out infinite}
.drone{position:absolute;width:48px;height:48px;border-radius:50%;border:1px solid rgba(124,247,212,.55);box-shadow:0 0 16px rgba(124,247,212,.35), inset 0 0 12px rgba(40,80,180,.4)}
.drone:before,.drone:after{content:'';position:absolute;background:rgba(124,247,212,.8)}
.drone:before{left:6px;right:6px;top:22px;height:2px}
.drone:after{top:6px;bottom:6px;left:22px;width:2px}
.drone.d1{left:22%;top:14%;animation:dronePatrolA 8.4s ease-in-out infinite}
.drone.d2{right:26%;top:20%;animation:dronePatrolB 9.2s ease-in-out infinite}

@keyframes robotFloat{0%,100%{transform:translateY(0) translateX(0)}50%{transform:translateY(-16px) translateX(8px)}}
@keyframes dronePatrolA{0%,100%{transform:translate(0,0)}25%{transform:translate(70px,28px)}50%{transform:translate(24px,66px)}75%{transform:translate(-32px,22px)}}
@keyframes dronePatrolB{0%,100%{transform:translate(0,0)}25%{transform:translate(-66px,34px)}50%{transform:translate(-14px,82px)}75%{transform:translate(28px,28px)}}


/* v4 cleanup: remove side shutters, keep cinematic server corridor + elegant robots */
.hero:before{background:linear-gradient(rgba(6,20,56,.62),rgba(6,20,56,.78)),url('https://images.unsplash.com/photo-1558494949-ef010cbdcc31?auto=format&fit=crop&w=2000&q=80') center/cover no-repeat !important;animation:bgDrift 30s ease-in-out infinite !important}
.server-tunnel .rack{display:none !important}
.server-tunnel .lane{opacity:.35}
.server-tunnel .drone{display:none !important}

.robot-ghost{right:7%;bottom:3%;width:220px;height:270px;opacity:.5;background:none;filter:drop-shadow(0 0 16px rgba(161,247,255,.5));animation:robotFloatNeo 8s ease-in-out infinite}
.robot-ghost:before{content:'';position:absolute;left:78px;top:18px;width:64px;height:64px;border:2px solid rgba(161,247,255,.95);border-radius:14px;box-shadow:0 0 12px rgba(161,247,255,.55), inset 0 0 10px rgba(50,110,220,.35);background:
radial-gradient(circle at 38% 45%,rgba(161,247,255,.95) 0 3px,transparent 4px),
radial-gradient(circle at 62% 45%,rgba(161,247,255,.95) 0 3px,transparent 4px),
linear-gradient(180deg,rgba(255,65,95,.9),rgba(255,65,95,.2));background-size:auto,auto,28px 2px;background-repeat:no-repeat;background-position:center 28px,center 28px,center 40px}
.robot-ghost:after{content:'';position:absolute;left:60px;top:92px;width:100px;height:150px;border:2px solid rgba(161,247,255,.88);border-radius:18px;box-shadow:0 0 14px rgba(161,247,255,.45), inset 0 0 20px rgba(40,88,200,.25);background:
linear-gradient(90deg,transparent 0 8px,rgba(161,247,255,.55) 8px 10px,transparent 10px 90px,rgba(161,247,255,.55) 90px 92px,transparent 92px),
linear-gradient(180deg,transparent 0 18px,rgba(161,247,255,.35) 18px 20px,transparent 20px 54px,rgba(161,247,255,.35) 54px 56px,transparent 56px 100%);
}

@keyframes robotFloatNeo{0%,100%{transform:translateY(0) translateX(0)}50%{transform:translateY(-10px) translateX(4px)}}


/* Humanoid experiment disabled (kept clean/professional) */
.robot-ghost,.drone,.humanoid{display:none !important}


/* Premium single humanoid walker with clipboard */
.robot-pro{position:absolute;left:-220px;bottom:2%;width:180px;height:320px;opacity:.72;filter:drop-shadow(0 0 14px rgba(163,247,255,.45));animation:robotWalkAcross 22s linear infinite, robotBob 1.4s ease-in-out infinite;pointer-events:none}
.robot-pro svg{width:100%;height:100%}
@keyframes robotWalkAcross{0%{transform:translateX(0)}100%{transform:translateX(calc(100vw + 440px))}}
@keyframes robotBob{0%,100%{margin-top:0}50%{margin-top:-4px}}


/* Video-based hero layer (human-like movement) */
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.34;filter:saturate(1.05) contrast(1.08);pointer-events:none;z-index:0}
.hero:before{z-index:0 !important}
.server-tunnel{z-index:1}
.hero-grid{z-index:2 !important}
.robot-pro{display:none !important}


/* Laser end-point hit indicators */
.server-tunnel .impact{display:none !important}
.server-tunnel .laser::after,.server-tunnel .laser.rev::after{content:'';position:absolute;top:50%;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle,#ffd6df 0 35%,#ff4b6f 45%,transparent 75%);transform:translateY(-50%);filter:drop-shadow(0 0 8px rgba(255,75,111,.95));}
.server-tunnel .laser::after{right:-2px}
.server-tunnel .laser.rev::after{left:-2px}
.server-tunnel .laser.v::after{content:'';position:absolute;left:50%;bottom:-2px;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle,#ffd6df 0 35%,#ff4b6f 45%,transparent 75%);transform:translateX(-50%);filter:drop-shadow(0 0 8px rgba(255,75,111,.95));}


/* Fine tune: lasers 10% thinner + slower */
.server-tunnel .laser,.server-tunnel .laser.rev{height:.72px !important}
.server-tunnel .laser.v{width:.72px !important}
.server-tunnel .laser.l1{animation-duration:7.0s !important}
.server-tunnel .laser.l2{animation-duration:7.7s !important}
.server-tunnel .laser.l3{animation-duration:6.6s !important}
.server-tunnel .laser.rev.r1{animation-duration:7.3s !important}
.server-tunnel .laser.rev.r2{animation-duration:8.0s !important}
.server-tunnel .laser.v{animation-duration:8.8s !important}


/* Dedicated humanoid robot overlay video (local asset) */
.robot-video{position:absolute;left:0;bottom:0;height:78%;max-height:460px;width:auto;opacity:.0;pointer-events:none;z-index:1;mix-blend-mode:screen;filter:drop-shadow(0 0 10px rgba(160,240,255,.45));animation:robotEntry 26s linear infinite}
@keyframes robotEntry{0%{opacity:0;transform:translateX(-22vw) scale(.88)}8%{opacity:.75}48%{opacity:.75;transform:translateX(28vw) scale(1)}70%{opacity:.58;transform:translateX(46vw) scale(1.03)}100%{opacity:0;transform:translateX(70vw) scale(1.05)}}

.live-threat-note{margin-top:6px;font-size:.88rem;color:#9fb5d9}