/* Services Components */
.hero-orb{
  position:absolute;right:-160px;top:90px;width:620px;height:620px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,102,0,.20),rgba(90,174,255,.10) 42%,transparent 70%);
  filter:blur(4px);
}
.command-panel{
  position:relative;border-radius:34px;padding:22px;background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.028));
  width:100%;max-width:600px;margin:0 auto;
  border:1px solid rgba(255,255,255,.11);box-shadow:0 30px 80px rgba(0,0,0,.32),0 0 55px rgba(255,102,0,.08);
  overflow:hidden;
}
.command-panel::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(circle at 20% 16%,rgba(255,102,0,.14),transparent 24%),
    radial-gradient(circle at 84% 20%,rgba(90,174,255,.12),transparent 24%);
}
.command-inner{position:relative;z-index:1;border-radius:26px;background:rgba(6,11,25,.65);border:1px solid rgba(255,255,255,.08);overflow:hidden}
.window-top{height:48px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;border-bottom:1px solid rgba(255,255,255,.08)}
.dots{display:flex;gap:8px}.dots span{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.18)}.dots span:first-child{background:var(--orange)}.dots span:nth-child(2){background:var(--blue)}.dots span:nth-child(3){background:var(--purple)}
.console{padding:20px;display:grid;gap:13px}
.console-row{
  display:grid;grid-template-columns:44px 1fr auto;gap:14px;align-items:center;padding:14px;border-radius:18px;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.065);
}
.row-icon{width:38px;height:38px;border-radius:14px;display:grid;place-items:center;background:rgba(255,102,0,.13);color:var(--orange)}
.console-row strong{display:block}.console-row span{display:block;color:var(--muted2);font-size:12px;margin-top:4px}
.status{font-size:11px;font-weight:900;border-radius:99px;padding:7px 10px;background:rgba(24,201,139,.10);color:#baffdf;border:1px solid rgba(24,201,139,.22)}

.service-icon{
  width:56px;height:56px;border-radius:20px;display:grid;place-items:center;margin-bottom:22px;
  background:linear-gradient(180deg,rgba(255,102,0,.22),rgba(90,174,255,.10));
  border:1px solid rgba(255,255,255,.11);box-shadow:0 0 28px rgba(255,102,0,.13);
}
.service-icon svg{width:29px;height:29px;stroke:var(--orange)}

.process{
  position:relative;border-radius:36px;padding:28px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.105);
  overflow:hidden;
}
.process::before{content:"";position:absolute;left:7%;right:7%;top:50%;height:1px;background:linear-gradient(90deg,transparent,rgba(255,102,0,.50),rgba(90,174,255,.45),transparent)}
.steps{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.step{text-align:center;padding:22px 12px;border-radius:24px;background:rgba(7,12,28,.70);border:1px solid rgba(255,255,255,.08)}
.step-num{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;margin:0 auto 14px;background:linear-gradient(180deg,var(--orange2),var(--orange));font-weight:900}
.step strong{display:block;margin-bottom:8px}.step span{color:var(--muted);font-size:13px;line-height:1.55}

.featured{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.big-card{min-height:430px;display:flex;flex-direction:column;justify-content:flex-end; position:relative; border-radius:30px; padding:38px; overflow:hidden;}
.big-card h3{font-size:38px;line-height:1;letter-spacing:-.06em; margin-bottom:12px;}
.big-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,9,22,.16),rgba(5,9,22,.88));z-index:0}
.big-card>*{z-index:1; position:relative;}
.big-card.wireless { background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.02)), url('../images/backgrounds/category-wireless.avif') center/cover; }
.big-card.software { background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.02)), url('../images/backgrounds/category-software.avif') center/cover; }

@media(max-width:1120px){
  .featured{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
  .process::before{display:none}
}
@media(max-width:880px){
  .steps{grid-template-columns:1fr}
}