.skills-section{padding:0 10px;color:var(--color2);position:relative;overflow:hidden}.skills-section:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;z-index:0}.skills-header{font-family:var(--font-base);font-size:35px;color:var(--color4);text-align:center;padding:10px;box-shadow:0 0 180px 1px var(--color1);border-radius:10px;width:-moz-fit-content;width:fit-content;margin:auto auto 20px}.container{margin:0 auto;position:relative}.section-title{font-size:2.5rem;margin-bottom:1rem;text-align:center;font-weight:700;position:relative;display:inline-block;width:100%}.category-filter{display:flex;justify-content:center;flex-wrap:wrap;gap:.75rem;margin-bottom:2.5rem}.filter-btn{padding:.5rem 1.25rem;border-radius:2rem;background:var(--color5-opacity-15);color:var(--color2);border:none;cursor:pointer;font-size:.9rem;transition:all .3s ease;border:1px solid var(--color5)}.filter-btn:hover{background:var(--color1)}.filter-btn.active,.filter-btn:hover{color:var(--color3);border:1px solid transparent}.filter-btn.active{background:linear-gradient(90deg,var(--color1),var(--color5))}.skills-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));grid-gap:1.5rem;gap:1.5rem}.skill-card{background:var(--color5-opacity-15);border-radius:.75rem;padding:1.5rem;text-align:center;transition:all .3s ease;cursor:pointer;border:1px solid var(--color5);display:flex;flex-direction:column;align-items:center;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.skill-card:hover{transform:translateY(-5px);background-color:var(--color1-opacity-15);box-shadow:0 10px 20px rgba(0,0,0,.2);border-color:var(--color1)}.skill-icon{width:60px;height:60px;display:flex;align-items:center;justify-content:center;margin-bottom:1rem;background:var(--color5-opacity-15);border-radius:50%;padding:.75rem}.skill-icon img{max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 0 10px var(--color2))}.skill-title{font-size:1.1rem;margin-bottom:1rem;font-weight:600}.skill-progress{width:100%;height:8px;background:var(--color1-opacity-15);margin-top:auto}.progress-bar,.skill-progress{border-radius:4px;position:relative}.progress-bar{height:100%;background:linear-gradient(90deg,var(--color5),var(--color1));transition:width 1s ease-in-out}.percentage{position:absolute;right:0;top:-20px;font-size:.8rem;color:#94a3b8}.skill-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;z-index:5;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background-color:var(--color5-opacity-15)}.skill-modal{background:var(--color3);border-radius:1rem;width:90%;max-width:500px;padding:2rem;position:relative;border:1px solid var(--color5);box-shadow:0 10px 30px rgba(0,0,0,.3)}.close-modal{position:absolute;top:1rem;right:1rem;background:none;border:none;color:var(--color2);font-size:1.5rem;cursor:pointer;transition:color .3s}.close-modal:hover{color:var(--color4)}.modal-header{display:flex;align-items:center;margin-bottom:1.5rem}.modal-header img{width:50px;height:50px;margin-right:1rem;object-fit:contain;filter:drop-shadow(0 0 5px rgba(255,255,255,.2))}.modal-header h3{font-size:1.5rem;margin:0}.modal-body p{color:var(--color4);line-height:1.6;margin-bottom:1.5rem}.modal-progress{margin-top:2rem}.progress-container{width:100%;height:8px;background:var(--color5-opacity-15);border-radius:4px;margin-bottom:.5rem}@media (max-width:768px){.skills-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem}.section-title{font-size:2rem}.section-subtitle{font-size:1rem}}@media (max-width:480px){.skills-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.skill-card{padding:1rem}.skill-icon{width:50px;height:50px;padding:.5rem}.skill-title{font-size:1rem}.category-filter{gap:.5rem}.filter-btn{padding:.4rem 1rem;font-size:.8rem}}