.skeleton-card{background:#2a2a2a;border-radius:12px;padding:20px;margin-bottom:20px;overflow:hidden;position:relative}.skeleton-image{width:100%;height:200px;background:#3a3a3a;border-radius:8px;margin-bottom:15px;overflow:hidden;position:relative}.skeleton-content{padding:0 5px}.skeleton-title{width:70%;height:24px;background:#3a3a3a;border-radius:4px;margin-bottom:10px;overflow:hidden;position:relative}.skeleton-text{width:100%;height:16px;background:#3a3a3a;border-radius:4px;margin-bottom:8px;overflow:hidden;position:relative}.skeleton-text.short{width:60%}.skeleton-tags{display:flex;gap:8px;margin-top:15px}.skeleton-tag{width:60px;height:24px;background:#3a3a3a;border-radius:12px;overflow:hidden;position:relative}.skeleton-avatar{width:50px;height:50px;background:#3a3a3a;border-radius:50%;overflow:hidden;position:relative}.skeleton-button{width:120px;height:40px;background:#3a3a3a;border-radius:20px;overflow:hidden;position:relative}.skeleton-shimmer{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);transform:translate(-100%)}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px}.loading-spinner{width:40px;height:40px;border:3px solid #3a3a3a;border-top:3px solid var(--primary_color);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-text{margin-top:15px;color:#999;font-size:14px}.fade-in{animation:fadeIn .5s ease-in}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#1f1f1f;border-radius:4px}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--primary_color) 0%,rgba(228,175,18,.7) 100%);border-radius:4px;border:1px solid rgba(228,175,18,.2);transition:all .3s ease}::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#f5c842 0%,var(--primary_color) 100%);border-color:#e4af1266;box-shadow:0 0 10px #e4af124d}::-webkit-scrollbar-thumb:active{background:var(--primary_color);box-shadow:0 0 15px #e4af1280}::-webkit-scrollbar-corner{background:#1f1f1f}*{scrollbar-width:thin;scrollbar-color:var(--primary_color) #1f1f1f}.notification{position:fixed;top:30px;right:30px;z-index:10000;max-width:400px;min-width:320px;background:linear-gradient(135deg,#1a1a1a 0%,#2d2d2d 100%);border:1px solid rgba(228,175,18,.3);border-radius:16px;box-shadow:0 20px 40px #0006,0 0 0 1px #ffffff0d,inset 0 1px #ffffff1a;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);overflow:hidden;font-family:inherit}.notification-success{border-color:#e4af1299;box-shadow:0 20px 40px #0006,0 0 0 1px #e4af124d,0 0 20px #e4af1233,inset 0 1px #ffffff1a}.notification-error{border-color:#ef444466;box-shadow:0 20px 40px #0006,0 0 0 1px #ef444433,inset 0 1px #ffffff1a}.notification-content{display:flex;align-items:flex-start;gap:16px;padding:20px;position:relative}.notification-icon{flex-shrink:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.notification-icon.success{color:var(--primary_color)}.notification-icon.error{color:#ef4444}.notification-icon svg{width:100%;height:100%}.notification-text{flex:1;min-width:0}.notification-title{margin:0 0 4px;font-size:16px;font-weight:600;color:#fff;line-height:1.4}.notification-message{margin:0;font-size:14px;color:#a1a1aa;line-height:1.5}.notification-close{flex-shrink:0;width:24px;height:24px;background:none;border:none;color:#71717a;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:6px;transition:all .2s ease}.notification-close:hover{color:#fff;background:rgba(255,255,255,.1)}.notification-close svg{width:16px;height:16px}.notification-progress{position:absolute;bottom:0;left:0;height:3px;background:linear-gradient(90deg,var(--primary_color) 0%,rgba(228,175,18,.8) 100%);transform-origin:left;border-radius:0 0 16px 16px}.notification-error .notification-progress{background:linear-gradient(90deg,#ef4444 0%,#dc2626 100%)}@media (max-width: 768px){.notification{top:20px;right:20px;left:20px;max-width:none;min-width:auto}.notification-content{padding:16px;gap:12px}.notification-title{font-size:15px}.notification-message{font-size:13px}}.services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px;margin-top:60px}.service-card{background:linear-gradient(135deg,#1a1a1a 0%,#2d2d2d 100%);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:40px 35px;position:relative;overflow:hidden;transition:all .4s cubic-bezier(.4,0,.2,1);cursor:pointer}.service-card:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(228,175,18,.05) 0%,rgba(228,175,18,.02) 100%);opacity:0;transition:opacity .4s ease;z-index:1}.service-card:hover:before{opacity:1}.service-card:hover{border-color:#e4af1266;box-shadow:0 20px 40px #0000004d,0 0 0 1px #e4af1233,0 0 30px #e4af121a;transform:translateY(-8px)}.service-icon-wrapper{width:80px;height:80px;background:linear-gradient(135deg,rgba(228,175,18,.1) 0%,rgba(228,175,18,.05) 100%);border:2px solid rgba(228,175,18,.2);border-radius:20px;display:flex;align-items:center;justify-content:center;margin-bottom:25px;position:relative;z-index:2;transition:all .4s ease}.service-card:hover .service-icon-wrapper{background:linear-gradient(135deg,rgba(228,175,18,.2) 0%,rgba(228,175,18,.1) 100%);border-color:#e4af1266;box-shadow:0 10px 20px #e4af1233}.service-icon-wrapper i{font-size:32px;color:var(--primary_color);transition:all .3s ease}.service-content{position:relative;z-index:2}.service-title{font-size:22px;font-weight:600;color:#fff;margin-bottom:15px;line-height:1.3;transition:all .3s ease}.service-description{font-size:15px;color:#a1a1aa;line-height:1.6;margin-bottom:25px;transition:all .3s ease}.service-cta{display:flex;align-items:center;gap:8px;color:var(--primary_color);font-size:14px;font-weight:500;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;transition:all .3s ease}.service-cta:hover{color:#fff}.service-cta i{font-size:12px;transition:all .3s ease}@media (max-width: 768px){.services-grid{grid-template-columns:1fr;gap:20px;margin-top:40px}.service-card{padding:30px 25px}.service-icon-wrapper{width:70px;height:70px;margin-bottom:20px}.service-icon-wrapper i{font-size:28px}.service-title{font-size:20px;margin-bottom:12px}.service-description{font-size:14px;margin-bottom:20px}}@media (max-width: 480px){.service-card{padding:25px 20px}.service-icon-wrapper{width:60px;height:60px}.service-icon-wrapper i{font-size:24px}.service-title{font-size:18px}.service-description{font-size:13px}}.experience-timeline{position:relative;margin-top:60px}.experience-timeline:before{content:"";position:absolute;left:30px;top:0;bottom:0;width:2px;background:linear-gradient(180deg,var(--primary_color) 0%,rgba(228,175,18,.3) 50%,var(--primary_color) 100%);border-radius:2px}.experience-card{position:relative;background:linear-gradient(135deg,#1a1a1a 0%,#2d2d2d 100%);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:30px 35px 30px 80px;margin-bottom:30px;margin-left:60px;transition:all .4s cubic-bezier(.4,0,.2,1);cursor:pointer;overflow:hidden}.experience-card:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(228,175,18,.05) 0%,rgba(228,175,18,.02) 100%);opacity:0;transition:opacity .4s ease;z-index:1}.experience-card:hover:before{opacity:1}.experience-card:hover{border-color:#e4af1266;box-shadow:0 20px 40px #0000004d,0 0 0 1px #e4af1233,0 0 30px #e4af121a;transform:translateY(-8px)}.experience-icon{position:absolute;left:-45px;top:30px;width:60px;height:60px;background:linear-gradient(135deg,rgba(228,175,18,.2) 0%,rgba(228,175,18,.1) 100%);border:2px solid rgba(228,175,18,.3);border-radius:50%;display:flex;align-items:center;justify-content:center;z-index:3;transition:all .4s ease}.experience-card:hover .experience-icon{background:linear-gradient(135deg,rgba(228,175,18,.3) 0%,rgba(228,175,18,.2) 100%);border-color:#e4af1280;box-shadow:0 10px 20px #e4af124d}.experience-icon i{font-size:24px;color:var(--primary_color);transition:all .3s ease}.experience-content{position:relative;z-index:2}.experience-period{font-size:14px;font-weight:600;color:var(--primary_color);margin-bottom:8px;text-transform:uppercase;letter-spacing:1px;transition:all .3s ease}.experience-title{font-size:22px;font-weight:600;color:#fff;margin-bottom:12px;line-height:1.3;transition:all .3s ease}.experience-companies{display:flex;flex-direction:column;gap:12px}.company-item{display:flex;align-items:center;gap:15px}.company-info{display:flex;align-items:center;gap:15px;flex-wrap:wrap}.company-separator{display:flex;align-items:center;justify-content:center;width:30px;height:30px;background:linear-gradient(135deg,rgba(228,175,18,.2) 0%,rgba(228,175,18,.1) 100%);border:1px solid rgba(228,175,18,.3);border-radius:50%;color:var(--primary_color);font-weight:600;font-size:14px;transition:all .3s ease}.company-separator:hover{background:linear-gradient(135deg,rgba(228,175,18,.3) 0%,rgba(228,175,18,.2) 100%);border-color:#e4af1280;transform:scale(1.1)}.company-link{display:flex;align-items:center;gap:8px;color:#a1a1aa;text-decoration:none;font-size:16px;font-weight:500;transition:all .3s ease}.company-link:hover{color:var(--primary_color)}.company-link i{font-size:12px;transition:all .3s ease}.company-name{color:#a1a1aa;font-size:16px;font-weight:500;transition:all .3s ease}.experience-location{display:flex;align-items:center;gap:6px;color:#71717a;font-size:14px;transition:all .3s ease}.experience-location i{font-size:12px;color:var(--primary_color)}.experience-connector{position:absolute;left:-45px;top:90px;width:2px;height:30px;background:linear-gradient(180deg,var(--primary_color) 0%,rgba(228,175,18,.3) 100%);transform-origin:top;border-radius:2px}.experience-card:last-child .experience-connector{display:none}@media (max-width: 768px){.experience-timeline:before{left:20px}.experience-card{margin-left:40px;padding:25px 25px 25px 60px}.experience-icon{left:-35px;width:50px;height:50px}.experience-icon i,.experience-title{font-size:20px}.experience-companies{gap:10px}.company-item,.company-info{flex-direction:column;align-items:flex-start;gap:8px}.company-separator{width:25px;height:25px;font-size:12px}.experience-connector{left:-35px}}@media (max-width: 480px){.experience-timeline:before{left:15px}.experience-card{margin-left:30px;padding:20px 20px 20px 50px}.experience-icon{left:-30px;width:45px;height:45px}.experience-icon i,.experience-title{font-size:18px}.experience-period{font-size:12px}.company-separator{width:20px;height:20px;font-size:10px}}body{scroll-behavior:smooth!important;overflow-x:hidden!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch}.menu.scroll-nav{position:fixed!important;right:20px!important;top:50%!important;transform:translateY(-50%)!important;z-index:20!important}#root{position:relative;z-index:1}#smooth-content{padding-right:20px!important}.hassan-main{position:relative}.page-section{position:relative;z-index:1}.project-modal{z-index:9999!important;position:fixed!important;top:0!important;left:0!important;width:100vw!important;height:100vh!important;overflow:hidden!important}.motion-div{will-change:transform,opacity}.scroll-animation{opacity:1!important}#smooth-wrapper{position:relative;z-index:1}.left-sidebar{display:block!important;visibility:visible!important;opacity:1!important}.icon-menu{right:20px!important}#smooth-content{position:relative;z-index:2}.testimonial-nav button{background:transparent;border:2px solid var(--primary_color);color:var(--primary_color);width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease}.testimonial-nav button:hover{background:var(--primary_color);color:#000}.testimonial-nav button i{font-size:18px}body.modal-open .left-sidebar,body.modal-open .menu.scroll-nav{opacity:.1!important;transition:opacity .3s ease!important;pointer-events:none!important}.project-modal .modal-overlay{position:fixed!important;top:0!important;left:0!important;width:100vw!important;height:100vh!important;background:rgba(0,0,0,.8)!important;z-index:1!important;-webkit-backdrop-filter:blur(2px)!important;backdrop-filter:blur(2px)!important}body.modal-open{overflow:hidden!important}body{overflow-x:hidden!important}html{scroll-behavior:smooth!important}html,body{overflow-x:hidden!important}.project-modal.active{overflow:hidden!important}body.modal-open #smooth-content{margin-left:0!important;transition:margin-left .3s ease!important}.modal-body{display:flex!important;gap:30px!important;padding:30px!important;overflow:hidden!important}.modal-media{flex:0 0 40%!important;max-width:40%!important}.modal-details{flex:0 0 60%!important;max-width:60%!important}.modal-skills{display:flex!important;flex-wrap:wrap!important;gap:8px!important;margin-bottom:20px!important}.modal-skills span,.tech-tag{background:var(--primary_color)!important;color:#000!important;padding:6px 12px!important;border-radius:20px!important;font-size:12px!important;font-weight:500!important;white-space:nowrap!important;display:inline-block!important;margin:2px!important}.modal-technologies{margin-bottom:15px}.modal-skills div{display:flex!important;flex-wrap:wrap!important;gap:8px!important;margin-bottom:10px}.modal-close{background:transparent;border:none;color:#fff;font-size:24px;cursor:pointer;padding:5px;border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.modal-close:hover{background:var(--primary_color);color:#000}.modal-content{scrollbar-width:thin;scrollbar-color:var(--primary_color) #2a2a2a}.modal-content::-webkit-scrollbar{width:6px}.modal-content::-webkit-scrollbar-track{background:#2a2a2a;border-radius:3px}.modal-content::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--primary_color) 0%,rgba(228,175,18,.8) 100%);border-radius:3px;border:1px solid rgba(228,175,18,.3)}.modal-content::-webkit-scrollbar-thumb:hover{background:var(--primary_color);box-shadow:0 0 8px #e4af1266}.testimonial-slider{scrollbar-width:thin;scrollbar-color:var(--primary_color) transparent}.testimonial-slider::-webkit-scrollbar{height:4px}.testimonial-slider::-webkit-scrollbar-track{background:transparent}.testimonial-slider::-webkit-scrollbar-thumb{background:var(--primary_color);border-radius:2px;opacity:.7}.testimonial-slider::-webkit-scrollbar-thumb:hover{opacity:1;box-shadow:0 0 6px #e4af1280}.portfolio-items,#smooth-content{scrollbar-width:thin;scrollbar-color:var(--primary_color) #1f1f1f}@media (max-width: 768px){.modal-body{flex-direction:column!important;gap:20px!important;padding:20px!important}.modal-media,.modal-details{flex:1!important;max-width:100%!important}}.portfolio-subtitle{font-size:18px;color:#a1a1aa;text-align:center;max-width:600px;margin:30px auto 60px;line-height:1.6;font-weight:400}