.skills-container{background-color:#081b29;min-height:100vh;padding:100px 10%}.skills-title{text-align:center;color:#ededed;margin-bottom:60px;font-size:40px}.skills-list{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:40px;max-width:1200px;margin:0 auto;display:grid}.skill-item{opacity:0;flex-direction:column;align-items:center;gap:20px;animation:.5s forwards skillFadeIn;display:flex;transform:scale(.8)}@keyframes skillFadeIn{to{opacity:1;transform:scale(1)}}.skill-item:first-child{animation-delay:.1s}.skill-item:nth-child(2){animation-delay:.2s}.skill-item:nth-child(3){animation-delay:.3s}.skill-item:nth-child(4){animation-delay:.4s}.skill-item:nth-child(5){animation-delay:.5s}.skill-item:nth-child(6){animation-delay:.6s}.skill-item:nth-child(7){animation-delay:.7s}.skill-item:nth-child(8){animation-delay:.8s}.circular-progress{width:120px;height:120px}.circular-progress svg{width:100%;height:100%;transform:rotate(-90deg)}.bg-circle{fill:none;stroke:#00abf01a;stroke-width:8px}.progress-circle{fill:none;stroke:#00abf0;stroke-width:8px;stroke-linecap:round;filter:drop-shadow(0 0 10px #00abf0)}.skill-icon-container{justify-content:center;align-items:center;width:50px;height:50px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.skill-icon{color:#00abf0;filter:drop-shadow(0 0 5px #00abf080);font-size:32px}.percentage-badge{color:#00abf0;z-index:2;background:#081b29e6;border:1px solid #00abf080;border-radius:20px;padding:1px 6px;font-size:11px;font-weight:700;position:absolute;bottom:10px;left:50%;transform:translate(-50%);box-shadow:0 0 8px #00abf04d}.circular-progress{width:120px;height:120px;position:relative}.skill-name{color:#ededed;text-align:center;font-size:18px;font-weight:500}.skills-loading,.skills-error{color:#ededed;flex-direction:column;justify-content:center;align-items:center;min-height:50vh;display:flex}.loading-spinner{border:5px solid #00abf01a;border-top-color:#00abf0;border-radius:50%;width:50px;height:50px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width:768px){.skills-container{padding:80px 5%}.skills-title{font-size:32px}.skills-list{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:30px}.circular-progress{width:100px;height:100px}.percentage-text,.skill-name{font-size:16px}}@media (max-width:480px){.skills-list{grid-template-columns:repeat(2,1fr);gap:20px}.circular-progress{width:90px;height:90px}}@media (max-width:1024px) and (min-width:769px){.skills-container{padding:90px 7%}.skills-title{font-size:36px}}
