.skills-container{color:#fff;background:var(--black);max-width:1400px;margin:0 auto;padding:3rem 2rem;font-family:Arial,sans-serif;overflow:hidden}.skills-title-container{text-align:center;opacity:0;margin:3rem 0;padding-top:60px;animation:.8s ease-out .2s forwards fadeInUp;transform:translateY(30px)}.skills-main-title{margin-bottom:1rem;font-size:clamp(3.5rem,10vw,8rem);line-height:1.1;display:inline-block;position:relative}.dollar-my{color:#fff}.skills-text{color:var(--purple);display:inline-block;position:relative}.skills-text:after{content:"";background-color:var(--purple);width:0;height:3px;animation:1.2s ease-out .8s forwards underlineGrow;position:absolute;bottom:-5px;left:0}.category-section h2{color:var(--purple);text-align:center;opacity:0;margin:3rem 0 2rem;padding-top:5rem;font-size:clamp(1.8rem,5vw,2.5rem);animation:.6s ease-out forwards fadeInUp;transform:translateY(20px)}.category-section h2 span{color:#fff}.skills-grid{opacity:0;flex-wrap:wrap;justify-content:center;gap:1.5rem;margin:3rem 0 5rem;padding:1rem 0;animation:.8s ease-out .4s forwards fadeIn;display:flex}.skill-card{border:2px solid var(--purple);text-align:center;opacity:0;background:#121212;border-radius:15px;flex-direction:column;justify-content:center;align-items:center;width:clamp(140px,30vw,220px);height:clamp(120px,25vw,160px);padding:1.5rem 0;transition:all .4s cubic-bezier(.175,.885,.32,1.275);animation:.6s ease-out forwards cardPopIn;display:flex;position:relative;transform:scale(.95)}.skill-card:first-child{animation-delay:.6s}.skill-card:nth-child(2){animation-delay:.7s}.skill-card:nth-child(3){animation-delay:.8s}.skill-card:nth-child(4){animation-delay:.9s}.skill-card:nth-child(5){animation-delay:1s}.skill-card:nth-child(6){animation-delay:1.1s}.skill-card:nth-child(7){animation-delay:1.2s}.skill-card:nth-child(8){animation-delay:1.3s}.skill-card:nth-child(9){animation-delay:1.4s}.skill-card:nth-child(10){animation-delay:1.5s}.skill-card:nth-child(11){animation-delay:1.6s}.skill-card:nth-child(12){animation-delay:1.7s}.skill-icon{color:#fff;margin-bottom:15px;font-size:clamp(3rem,12vw,6rem);transition:transform .3s}.skill-name{color:#fff;opacity:0;width:100%;padding:.5rem 0;font-size:clamp(1.2rem,3.5vw,2rem);transition:all .3s;display:none;position:absolute;bottom:20px;transform:translateY(10px)}.skill-card:hover{transform:scale(1.1)translateY(-5px);box-shadow:0 0 20px 7px #e6f7ffcc}.skill-card:hover .skill-icon{transform:scale(1.1)translateY(-5px)}.skill-card:hover .skill-name{opacity:1;display:block;transform:translateY(0)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes cardPopIn{0%{opacity:0;transform:scale(.8)}70%{opacity:1;transform:scale(1.05)}to{opacity:1;transform:scale(.95)}}@keyframes underlineGrow{0%{width:0}to{width:100%}}@media (hover:none){.skill-card{box-shadow:none!important;transform:scale(.95)!important}.skill-name{opacity:1!important;display:block!important;transform:translateY(0)!important}.skill-icon{transform:none!important}}@media (max-width:1300px){.skills-grid{max-width:1100px}}@media (max-width:1000px){.skills-grid{max-width:800px}}@media (max-width:750px){.skills-grid{max-width:500px}.skills-title-container{margin:2rem 0;padding-top:40px}}@media (max-width:500px){.skills-container{padding:2rem 1rem}.category-section h2{margin:2rem 0 1.5rem;padding-top:3rem}.skills-grid{gap:1rem;margin:2rem 0 3rem;padding:.5rem 0}.skill-icon{font-size:4rem}}@media (max-width:400px){.skill-card{width:120px;height:100px}.skill-icon{margin-bottom:10px;font-size:3rem}.skill-name{font-size:1rem;bottom:10px}}
