*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.6;color:#333;background-color:#f8f9fa}.main-content{min-height:calc(100vh - 140px);padding:20px;max-width:1200px;margin:0 auto}.footer{background-color:#333;color:white;text-align:center;padding:20px;margin-top:auto}.navigation{background-color:#2c3e50;padding:1rem 0;box-shadow:0 2px 4px rgba(0,0,0,.1)}.nav-container{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;padding:0 20px}.nav-logo{color:white;font-size:1.5rem;font-weight:700;text-decoration:none}.nav-links{display:flex;list-style:none;gap:2rem}.nav-links a{color:white;text-decoration:none;transition:color .3s ease}.nav-links a:hover{color:#3498db}.page-container{padding:2rem 0}.page-title{font-size:2.5rem;margin-bottom:2rem;text-align:center;color:#2c3e50}.section{margin-bottom:3rem;background:white;padding:2rem;border-radius:8px;box-shadow:0 2px 10px rgba(0,0,0,.1)}.section-title{font-size:1.8rem;margin-bottom:1rem;color:#34495e;border-bottom:2px solid #3498db;padding-bottom:.5rem}.btn{display:inline-block;padding:10px 20px;background-color:#3498db;color:white;text-decoration:none;border-radius:5px;transition:background-color .3s ease;border:none;cursor:pointer}.btn:hover{background-color:#2980b9}.btn-secondary{background-color:#95a5a6}.btn-secondary:hover{background-color:#7f8c8d}.grid{display:grid;grid-gap:2rem;gap:2rem}.grid-2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.grid-3{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.card{background:white;border-radius:8px;padding:1.5rem;box-shadow:0 2px 10px rgba(0,0,0,.1);transition:transform .3s ease}.card:hover{transform:translateY(-5px)}.card-title{font-size:1.3rem;margin-bottom:1rem;color:#2c3e50}.card-description{color:#7f8c8d;margin-bottom:1rem}.hero-section{text-align:center;padding:4rem 0;background:linear-gradient(135deg,#667eea,#764ba2);color:white;border-radius:10px;margin-bottom:3rem}.hero-content{max-width:800px;margin:0 auto}.hero-description{font-size:1.2rem;margin:2rem 0;opacity:.9}.hero-buttons{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.features-section{margin:3rem 0}.projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));grid-gap:2rem;gap:2rem;margin-top:2rem}.project-card{border-left:4px solid #3498db}.project-technologies{margin:1rem 0}.tech-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}.tech-tag{background-color:#ecf0f1;color:#2c3e50;padding:.3rem .8rem;border-radius:15px;font-size:.9rem}.project-features{margin:1rem 0}.project-features ul{margin-left:1.5rem;margin-top:.5rem}.project-features li{margin-bottom:.3rem}.project-actions{display:flex;gap:1rem;margin-top:1.5rem;flex-wrap:wrap}.highlights-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));grid-gap:1rem;gap:1rem;margin-top:1rem}.highlight-item{display:flex;align-items:center;gap:.5rem;padding:1rem;background-color:#f8f9fa;border-radius:8px;border-left:4px solid #27ae60}.highlight-icon{color:#27ae60;font-weight:700;font-size:1.2rem}.timeline{position:relative;padding-left:2rem}.timeline:before{content:"";position:absolute;left:1rem;top:0;bottom:0;width:2px;background-color:#3498db}.timeline-item{position:relative;margin-bottom:2rem;padding-left:2rem}.timeline-marker{position:absolute;left:-2rem;top:.5rem;width:12px;height:12px;background-color:#3498db;border-radius:50%;border:3px solid white;box-shadow:0 0 0 3px #3498db}.timeline-content{background-color:#f8f9fa;padding:1.5rem;border-radius:8px;box-shadow:0 2px 5px rgba(0,0,0,.1)}.job-title{color:#2c3e50;margin-bottom:.5rem;font-size:1.3rem}.company-name{color:#3498db;margin-bottom:.5rem;font-size:1.1rem}.job-period{color:#7f8c8d;margin-bottom:1rem;font-style:italic}.responsibilities{margin-left:1.5rem}.responsibilities li{margin-bottom:.5rem}.skills-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));grid-gap:2rem;gap:2rem;margin-top:1rem}.skill-category h3{color:#2c3e50;margin-bottom:1rem;font-size:1.2rem}.skill-tags{display:flex;flex-wrap:wrap;gap:.5rem}.skill-tag{background-color:#3498db;color:white;padding:.4rem .8rem;border-radius:20px;font-size:.9rem;transition:background-color .3s ease}.skill-tag:hover{background-color:#2980b9}.education-content h3{color:#2c3e50;margin-bottom:.5rem;font-size:1.3rem}.education-content h4{color:#3498db;margin-bottom:.5rem;font-size:1.1rem}.education-period{color:#7f8c8d;margin-bottom:1rem;font-style:italic}.achievements{margin-left:1.5rem}.achievements li,.contact-info p{margin-bottom:.5rem}.contact-info p{font-size:1.1rem}.contact-info a{color:#3498db;text-decoration:none}.contact-info a:hover{text-decoration:underline}.category-filter{display:flex;justify-content:center;gap:1rem;margin:2rem 0;flex-wrap:wrap}.filter-btn{padding:.8rem 1.5rem;border:2px solid #3498db;background-color:transparent;color:#3498db;border-radius:25px;cursor:pointer;transition:all .3s ease;font-size:1rem}.filter-btn.active,.filter-btn:hover{background-color:#3498db;color:white}.photo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));grid-gap:2rem;gap:2rem;margin:2rem 0}.photo-item{cursor:pointer;border-radius:10px;overflow:hidden;box-shadow:0 4px 15px rgba(0,0,0,.1);transition:transform .3s ease,box-shadow .3s ease}.photo-item:hover{transform:translateY(-5px);box-shadow:0 8px 25px rgba(0,0,0,.2)}.photo-placeholder{height:250px;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;color:white;text-align:center;padding:2rem}.photo-content h3{font-size:1.3rem;margin-bottom:.5rem}.photo-content p{margin-bottom:1rem;opacity:.9}.photo-category{background-color:rgba(255,255,255,.2);padding:.3rem .8rem;border-radius:15px;font-size:.9rem}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.8);display:flex;align-items:center;justify-content:center;z-index:1000;padding:2rem}.modal-content{background:white;border-radius:10px;max-width:800px;width:100%;max-height:90vh;overflow:auto;position:relative}.modal-close{position:absolute;top:1rem;right:1rem;background:none;border:none;font-size:2rem;cursor:pointer;color:#666;z-index:1001}.modal-close:hover{color:#333}.modal-image-placeholder{height:400px;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;flex-direction:column;align-items:center;justify-content:center;color:white;text-align:center;padding:2rem}.modal-image-placeholder h2{font-size:2rem;margin-bottom:1rem}.modal-image-placeholder p{font-size:1.2rem;margin-bottom:1rem;opacity:.9}.modal-category{background-color:rgba(255,255,255,.2);padding:.5rem 1rem;border-radius:20px;font-size:1rem}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));grid-gap:2rem;gap:2rem;margin-top:1rem}.stat-item{text-align:center;padding:2rem;background-color:#f8f9fa;border-radius:10px;border-top:4px solid #3498db}.stat-item h3{font-size:2.5rem;color:#3498db;margin-bottom:.5rem}.stat-item p{color:#7f8c8d;font-size:1.1rem}.music-player-container{max-width:800px;margin:0 auto}.now-playing{background:linear-gradient(135deg,#667eea,#764ba2);color:white;border-radius:15px;padding:2rem;margin-bottom:2rem}.track-info{display:flex;align-items:center;gap:2rem;margin-bottom:2rem}.album-cover{flex-shrink:0}.cover-placeholder{width:120px;height:120px;background-color:rgba(255,255,255,.2);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:3rem}.track-details h2{font-size:2rem;margin-bottom:.5rem}.track-details p{margin-bottom:.3rem;opacity:.9}.track-details .album{opacity:.7;font-style:italic}.player-controls{display:flex;justify-content:center;align-items:center;gap:1rem;margin-bottom:2rem}.control-btn{background:none;border:none;color:white;font-size:1.5rem;cursor:pointer;padding:.5rem;border-radius:50%;transition:background-color .3s ease}.control-btn:hover{background-color:rgba(255,255,255,.2)}.play-btn{background-color:white;color:#667eea;width:60px;height:60px;border-radius:50%;border:none;font-size:1.8rem;cursor:pointer;transition:transform .3s ease}.play-btn:hover{transform:scale(1.1)}.progress-container{display:flex;align-items:center;gap:1rem}.progress-bar{flex:1 1;height:6px;background-color:rgba(255,255,255,.3);border-radius:3px;cursor:pointer;position:relative}.progress-fill{height:100%;background-color:white;border-radius:3px;transition:width .1s ease}.time{font-size:.9rem;opacity:.9;min-width:40px}.playlist-items{display:flex;flex-direction:column;gap:.5rem}.playlist-item{display:flex;align-items:center;gap:1rem;padding:1rem;background-color:#f8f9fa;border-radius:8px;cursor:pointer;transition:all .3s ease}.playlist-item:hover{background-color:#e9ecef;transform:translateX(5px)}.playlist-item.active{background-color:#3498db;color:white}.track-number{width:30px;text-align:center;font-weight:700}.track-info-list{flex:1 1}.track-info-list h4{margin-bottom:.3rem;font-size:1.1rem}.track-info-list p{color:#7f8c8d;font-size:.9rem}.playlist-item.active .track-info-list p{color:rgba(255,255,255,.8)}.track-duration{color:#7f8c8d;font-size:.9rem}.playlist-item.active .track-duration{color:rgba(255,255,255,.8)}@media (max-width:768px){.nav-container{flex-direction:column;gap:1rem}.nav-links{gap:1rem}.page-title{font-size:2rem}.main-content{padding:10px}.section{padding:1rem}.hero-section{padding:2rem 1rem}.hero-buttons{flex-direction:column;align-items:center}.projects-grid{grid-template-columns:1fr}.project-actions{flex-direction:column}.timeline,.timeline-item{padding-left:1rem}.photo-grid,.skills-grid{grid-template-columns:1fr}.category-filter{flex-direction:column;align-items:center}.track-info{flex-direction:column;text-align:center;gap:1rem}.track-details h2{font-size:1.5rem}.player-controls{gap:2rem}.progress-container{flex-direction:column;gap:.5rem}.progress-bar{order:1}.modal-overlay{padding:1rem}.modal-image-placeholder{height:300px;padding:1rem}.modal-image-placeholder h2{font-size:1.5rem}}