.skills{background:var(--bg-surface)}
.skills-container{display:flex;flex-direction:column;gap:3rem}
.skill-category h3{font-family:'Syne',sans-serif;font-size:1.3rem;font-weight:700;margin-bottom:1.25rem;display:flex;align-items:center;gap:.75rem}
.skill-category h3 .cat-dot{width:8px;height:8px;border-radius:50%;display:inline-block}
.skill-pills{display:flex;flex-wrap:wrap;gap:.75rem}
.skill-pill{padding:.6rem 1.25rem;border-radius:100px;font-size:.85rem;font-weight:500;border:1px solid var(--glass-border);background:var(--glass-bg);backdrop-filter:blur(8px);transition:all .3s ease;cursor:default;position:relative;overflow:hidden}
.skill-pill::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,var(--accent-violet),var(--accent-cyan));opacity:0;transition:opacity .3s ease;z-index:0}
.skill-pill span{position:relative;z-index:1}
.skill-pill:hover{transform:translateY(-3px);border-color:var(--accent-violet);box-shadow:var(--glow-violet)}
.skill-pill:hover::before{opacity:.06}
.skill-pill.active{border-color:var(--accent-cyan);background:rgba(5,150,105,0.06);color:var(--accent-cyan)}
.skill-pill.active::after{content:'';position:absolute;top:50%;right:8px;width:5px;height:5px;background:var(--accent-cyan);border-radius:50%;transform:translateY(-50%);z-index:1}