.container{width:100%;min-height:100vh;background:#fff;color:#333;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:50px 20px}
.about-container{max-width:1100px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;padding:40px 0}
.about-left{width:48%}
.about-left h1{font-size:2.2rem;color:#007acc;margin-bottom:10px}
.about-left p{font-size:1rem;line-height:1.6;color:#555}
.about-right{width:48%}
.skills{text-align:left}
.skills .skill{margin-bottom:15px}
.skills .skill-name{font-size:.95rem;margin-bottom:5px;color:#007acc}
.skills .skill-bar{width:100%;height:8px;background:#ddd;border-radius:4px;overflow:hidden}
.skills .skill-fill{height:100%;background:#007acc;width:0%;transition:width 1.5s ease-out}
.tech-stack-container{margin-top:40px;width:100%;overflow:hidden;position:relative;display:flex;justify-content:center}
.tech-stack-wrapper{display:flex;align-items:center;gap:20px;white-space:nowrap;animation:none;will-change:transform}
.tech-stack-wrapper img{width:50px;height:50px;transition:all .3s ease-out}
.tech-stack-wrapper img:hover{transform:scale(1.1)}
.separator{font-size:2rem;color:#007acc;font-weight:700}
@keyframes techScroll{
from{transform:translateX(0)}
to{transform:translateX(-50%)}
}
@media (max-width:768px){
.about-container{flex-direction:column;text-align:center}
.about-left,.about-right{width:100%}
.skills{text-align:center}
}