Technologies & Skills

Frontend Development

  • HTML5
  • CSS3 & Animations
  • JavaScript (ES6+)
  • TypeScript
  • React

Backend Development

  • Node.js
  • Express.js
  • Serverless Functions (Vercel)
  • REST APIs

Tools & Deployment

  • Git & GitHub
  • Vercel
  • Visual Studio Code
  • npm
margin-bottom: 2rem; text-align: center; font-size: 1.8rem; } .progress-grid { display: grid; gap: 1.5rem; max-width: 600px; margin: 0 auto; } .progress-item { background: rgba(10, 15, 28, 0.6); padding: 1.5rem; border-radius: 10px; border: 1px solid rgba(0, 207, 255, 0.1); } .progress-header { display: flex; justify-content: space-between; margin-bottom: 0.8rem; font-weight: 600; } .progress-header span:first-child { color: #00ff99; } .progress-header span:last-child { color: #00cfff; } .progress-bar { height: 8px; background: rgba(0, 207, 255, 0.2); border-radius: 4px; overflow: hidden; } .progress-fill { height: 100%; background: linear-gradient(90deg, #00cfff, #00ff99); border-radius: 4px; transition: width 2s ease-in-out; animation: progressAnimation 2s ease-in-out; } @keyframes progressAnimation { from { width: 0%; } } .stat-card.full-width { grid-column: 1 / -1; text-align: center; } .goal-item { text-align: center; } .goal-icon { font-size: 2.5rem; color: #00cfff; margin-bottom: 1rem; } .goal-item ul { list-style: none; padding: 0; margin-top: 1rem; } .goal-item li { padding: 0.3rem 0; color: #a0aec0; font-size: 0.9rem; } .goal-item li:before { content: "▶ "; color: #00ff99; margin-right: 0.5rem; } @media (max-width: 768px) { .skills-title { font-size: 2.5rem; } .progress-grid { margin: 0 1rem; } .goal-item ul { text-align: left; } }