/* Remote-work hero illustration, scoped to this page. */
.remote-hero-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:42px}
.remote-infographic{isolation:isolate;width:100%;height:570px;padding:82px 24px 52px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:142px 152px 142px;gap:0 28px;position:relative;border:1px solid rgba(124,214,255,.24);border-radius:32px;background:radial-gradient(ellipse at 50% 49%,rgba(25,125,209,.19),transparent 60%),linear-gradient(145deg,rgba(15,39,62,.9),rgba(6,17,30,.96));box-shadow:0 28px 70px rgba(0,0,0,.22),inset 0 1px rgba(207,244,255,.08);transform:none;overflow:hidden}
.remote-infographic:before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(98,191,239,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(98,191,239,.035) 1px,transparent 1px);background-size:28px 28px;mask-image:radial-gradient(ellipse,black,transparent 85%)}
.remote-connections{position:absolute;inset:0;width:100%;height:100%;opacity:.65;pointer-events:none;z-index:0}
.remote-infographic .remote-core{grid-column:1/3;grid-row:2;align-self:center;justify-self:center;width:218px;height:124px;border-radius:24px;display:flex;flex-direction:column;justify-content:center;gap:5px;background:linear-gradient(135deg,#123a56,#10273e);border:1px solid rgba(95,221,255,.6);box-shadow:0 0 0 7px rgba(46,160,219,.055),0 0 45px rgba(33,212,255,.13);letter-spacing:0;font-weight:750;line-height:1.3;text-transform:none}
.remote-infographic .remote-core:before{display:none}
.remote-core svg{width:34px;height:34px;fill:none;stroke:#8ceaff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.remote-core>span{font-size:15px;color:#f0faff}
.remote-core small{font-size:10px;font-weight:500;color:#9fbbcf}
.remote-infographic .remote-orbit{position:relative;inset:auto;min-width:0;min-height:0;padding:9px 10px 12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border-radius:20px;border:1px solid rgba(117,204,247,.22);background:linear-gradient(145deg,rgba(20,48,71,.98),rgba(10,26,43,.98));box-shadow:0 12px 25px rgba(0,0,0,.16),inset 0 1px rgba(218,244,255,.04);transition:border-color .25s,box-shadow .25s,translate .25s;text-align:center}
.remote-infographic .remote-orbit:hover{border-color:rgba(119,228,255,.6);box-shadow:0 12px 30px rgba(0,0,0,.2),0 0 24px rgba(33,212,255,.1);translate:0 -3px}
.remote-infographic .remote-orbit img{width:83px;height:83px;max-width:83px;max-height:83px;object-fit:contain;margin:0;filter:drop-shadow(0 4px 12px rgba(33,212,255,.18))}
.remote-infographic .remote-orbit>span:not(.remote-node-index){font-size:13px;line-height:1.4;font-weight:650;margin:0;color:#dcedfa;max-width:145px}
.remote-o1{grid-column:1;grid-row:1}.remote-o2{grid-column:2;grid-row:1}.remote-o3{grid-column:1;grid-row:3}.remote-o4{grid-column:2;grid-row:3}
.remote-visual-footer{position:absolute;bottom:17px;left:12px;right:12px;display:flex;justify-content:center;align-items:center;gap:10px;font-size:10px;color:#8ca9bf;letter-spacing:.025em}
.remote-visual-footer i{width:3px;height:3px;border-radius:50%;background:#38c4e9}
@media(max-width:980px){.remote-hero-grid{grid-template-columns:1fr;gap:40px}.remote-infographic{max-width:540px;margin:0 auto}}
@media(max-width:620px){.remote-infographic{height:550px;padding:80px 16px 46px;grid-template-rows:138px 148px 138px;column-gap:18px;border-radius:25px;transform:none}.remote-visual-heading{left:18px;right:18px}.remote-visual-caption{font-size:16px}.remote-infographic .remote-orbit{padding:12px 7px 10px;border-radius:16px}.remote-infographic .remote-orbit img{width:76px;height:76px;max-width:76px;max-height:76px}.remote-infographic .remote-orbit>span:not(.remote-node-index){font-size:12px}.remote-infographic .remote-core{width:204px;height:120px}.remote-visual-footer{gap:8px;font-size:9px}}
@media(prefers-reduced-motion:reduce){.remote-infographic,.remote-infographic .remote-orbit{transition:none}.remote-infographic.reveal{opacity:1;transform:none}}

/* Larger, dimensional cards without an enclosing panel. */
.remote-infographic{height:550px;padding:8px;grid-template-rows:184px 150px 184px;gap:0 28px;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:visible}
.remote-infographic:before{display:none}
.remote-infographic .remote-orbit{padding:16px 14px 18px;gap:8px;border-radius:24px;border:1px solid rgba(117,214,255,.35);background:radial-gradient(ellipse at 50% 0%,rgba(53,154,210,.21),transparent 72%),linear-gradient(145deg,#163b55 0%,#0d263f 52%,#081b2e 100%);box-shadow:0 8px 0 #061421,0 9px 0 rgba(104,193,237,.17),0 24px 34px rgba(0,0,0,.35),0 0 26px rgba(33,212,255,.07),inset 0 2px 1px rgba(187,236,255,.13),inset 0 -4px 9px rgba(0,0,0,.2)}
.remote-infographic .remote-orbit img{width:112px;height:112px;max-width:112px;max-height:112px;filter:drop-shadow(0 8px 16px rgba(33,212,255,.24))}
.remote-infographic .remote-orbit>span:last-child{font-size:15px;line-height:1.35;font-weight:700;margin:0;color:#e4f4ff;max-width:190px}
.remote-infographic .remote-orbit:hover{border-color:rgba(119,228,255,.7);box-shadow:0 10px 0 #061421,0 11px 0 rgba(104,193,237,.23),0 28px 40px rgba(0,0,0,.4),0 0 32px rgba(33,212,255,.14),inset 0 2px 1px rgba(187,236,255,.17);translate:0 -3px}
@media(max-width:620px){.remote-infographic{height:516px;padding:6px;grid-template-rows:172px 148px 172px;column-gap:16px;border:0;border-radius:0;background:transparent;box-shadow:none;transform:none}.remote-infographic .remote-orbit{padding:13px 7px 15px;gap:6px;border-radius:20px}.remote-infographic .remote-orbit img{width:100px;height:100px;max-width:100px;max-height:100px}.remote-infographic .remote-orbit>span:last-child{font-size:13px;max-width:160px}}