:root{
  --vs-primary:#2ba8c6;
  --vs-secondary:#8c72c3;
  --vs-text-dark:#111827;
  --vs-text-muted:#52525b;
  --vs-card-bg:#ffffff;
  --vs-border:#e4e4e7;
}

.vs-services-wrapper{
  width:100%;
  background:#f8fafc;
  font-family:'Outfit','Segoe UI',sans-serif;
  padding:80px 20px;
  box-sizing:border-box;
}

.vs-container{max-width:1350px;margin:0 auto;}

.vs-header{text-align:center;max-width:900px;margin:0 auto 40px;}
.vs-header h2{font-size:clamp(2.2rem,4vw,3rem);font-weight:700;color:var(--vs-text-dark);margin:0 0 15px;line-height:1.2;}
.vs-header p{font-size:1.1rem;color:var(--vs-text-muted);line-height:1.6;margin:0;}

.vs-filter-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:15px;margin:35px 0 50px;}
.vs-filter-tab{
  background:#fff;border:1px solid var(--vs-border);color:var(--vs-text-dark);
  padding:12px 28px;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;
  transition:all .3s ease;box-shadow:0 2px 4px rgba(0,0,0,.02);
}
.vs-filter-tab:hover{border-color:var(--vs-primary);color:#fff;background:linear-gradient(135deg,var(--vs-primary),var(--vs-secondary));}
.vs-filter-tab.active{
  background:linear-gradient(135deg,var(--vs-primary),var(--vs-secondary));
  color:#fff;border-color:transparent;box-shadow:0 8px 20px rgba(43,168,198,.25);
}

.vs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;}

.vs-card{
  position:relative;background:var(--vs-card-bg);border:1px solid var(--vs-border);
  border-radius:16px;overflow:hidden;opacity:0;display:none;flex-direction:column;
  box-shadow:0 4px 10px rgba(0,0,0,.02);
  transition:transform .5s cubic-bezier(.23,1,.32,1),box-shadow .5s cubic-bezier(.23,1,.32,1);
}
.vs-card.show{display:flex;animation:vsPopIn .5s cubic-bezier(.16,1,.3,1) forwards;}
@keyframes vsPopIn{0%{opacity:0;transform:scale(.95) translateY(20px);}100%{opacity:1;transform:scale(1) translateY(0);}}

.vs-card::after{
  content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);
  width:0;height:4px;background:linear-gradient(90deg,var(--vs-primary),var(--vs-secondary));
  transition:width .4s cubic-bezier(.23,1,.32,1);border-radius:0 0 16px 16px;
}
.vs-card:hover{transform:translateY(-8px);border-color:transparent;box-shadow:0 25px 50px -12px rgba(43,168,198,.18);}
.vs-card:hover::after{width:100%;}

.vs-card-image{position:relative;width:100%;aspect-ratio:16/10;overflow:hidden;background:#eef2f6;}
.vs-card-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.23,1,.32,1);}
.vs-card:hover .vs-card-image img{transform:scale(1.08);}
.vs-card-image-fallback{width:100%;height:100%;background:linear-gradient(135deg,var(--vs-primary),var(--vs-secondary));opacity:.15;}
.vs-card-image::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(17,24,39,0) 55%,rgba(17,24,39,.35) 100%);
  pointer-events:none;
}

.vs-badge{
  position:absolute;top:16px;left:16px;
  background:rgba(255,255,255,.92);backdrop-filter:blur(4px);
  color:var(--vs-primary);font-size:.75rem;font-weight:700;letter-spacing:.02em;
  padding:6px 14px;border-radius:999px;box-shadow:0 4px 12px rgba(0,0,0,.08);
}

.vs-card-body{padding:28px 26px 30px;display:flex;flex-direction:column;flex-grow:1;}
.vs-title{font-size:1.25rem;font-weight:600;color:var(--vs-text-dark);margin:0 0 12px;line-height:1.3;}
.vs-desc{font-size:.95rem;font-weight:400;color:var(--vs-text-muted);line-height:1.6;margin:0 0 22px;flex-grow:1;}

.vs-explore-btn{
  display:inline-flex;align-items:center;gap:8px;font-size:.95rem;font-weight:600;
  color:var(--vs-primary);text-decoration:none;transition:color .3s ease;margin-top:auto;
}
.vs-explore-btn svg{width:18px;height:18px;stroke:currentColor;transition:transform .3s ease;}
.vs-explore-btn:hover{color:var(--vs-secondary);}
.vs-explore-btn:hover svg{transform:translateX(5px);}

.vs-empty-msg{grid-column:1/-1;text-align:center;color:var(--vs-text-muted);padding:40px 0;}

@media (max-width:1024px){.vs-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:768px){.vs-grid{grid-template-columns:1fr;}}
