.nav[data-v-b59b2fbd]{align-items:center;display:flex;justify-content:space-between;left:0;padding:1rem 2rem;position:fixed;right:0;top:0;transition:background .3s,backdrop-filter .3s;z-index:100}.nav.scrolled[data-v-b59b2fbd]{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0f1a17e6;box-shadow:0 2px 20px #0000004d}.nav-logo[data-v-b59b2fbd]{color:var(--color-gold);font-family:var(--font-display);font-size:1.5rem;font-weight:900;letter-spacing:2px;text-decoration:none}.nav-links[data-v-b59b2fbd]{display:flex;gap:2rem}.nav-link[data-v-b59b2fbd]{color:var(--color-cream-dim);font-size:.85rem;font-weight:500;letter-spacing:1.5px;position:relative;text-decoration:none;text-transform:uppercase;transition:color .3s}.nav-link[data-v-b59b2fbd]:after{background:var(--color-gold);bottom:-4px;content:"";height:2px;left:0;position:absolute;transition:width .3s;width:0}.nav-link.active[data-v-b59b2fbd],.nav-link[data-v-b59b2fbd]:hover{color:var(--color-gold)}.nav-link.active[data-v-b59b2fbd]:after{width:100%}.nav-burger[data-v-b59b2fbd]{background:none;border:none;cursor:pointer;display:none;height:20px;position:relative;width:28px}.nav-burger span[data-v-b59b2fbd],.nav-burger span[data-v-b59b2fbd]:after,.nav-burger span[data-v-b59b2fbd]:before{background:var(--color-cream);display:block;height:2px;left:0;position:absolute;transition:all .3s;width:100%}.nav-burger span[data-v-b59b2fbd]{top:9px}.nav-burger span[data-v-b59b2fbd]:before{content:"";top:-7px}.nav-burger span[data-v-b59b2fbd]:after{content:"";top:7px}.nav-burger span.open[data-v-b59b2fbd]{background:transparent}.nav-burger span.open[data-v-b59b2fbd]:before{top:0;transform:rotate(45deg)}.nav-burger span.open[data-v-b59b2fbd]:after{top:0;transform:rotate(-45deg)}.nav-mobile[data-v-b59b2fbd]{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#0f1a17f7;display:flex;flex-direction:column;gap:1.5rem;left:0;padding:1.5rem 2rem;position:fixed;right:0;top:60px}.nav-mobile-link[data-v-b59b2fbd]{color:var(--color-cream-dim);font-size:1rem;font-weight:500;letter-spacing:2px;text-decoration:none;text-transform:uppercase;transition:color .3s}.nav-mobile-link.active[data-v-b59b2fbd]{color:var(--color-gold)}.slide-enter-active[data-v-b59b2fbd],.slide-leave-active[data-v-b59b2fbd]{transition:transform .3s ease,opacity .3s ease}.slide-enter-from[data-v-b59b2fbd],.slide-leave-to[data-v-b59b2fbd]{opacity:0;transform:translateY(-10px)}@media(max-width:768px){.nav-links[data-v-b59b2fbd]{display:none}.nav-burger[data-v-b59b2fbd]{display:block}}.dust-canvas[data-v-e4dc4e55]{inset:0;pointer-events:none;position:absolute;z-index:1}:root{--color-bg-dark:#0f1a17;--color-bg:#142320;--color-bg-card:#1a2f2a;--color-bg-card-hover:#213a34;--color-gold:#c8a45c;--color-gold-light:#dfc07a;--color-cream:#f5f0e8;--color-cream-dim:#c4bfb5;--color-teal:#3a7d6e;--color-teal-light:#4a9d8a;--color-text:#e8e2d8;--color-text-dim:#9a9488;--font-display:"Playfair Display",Georgia,serif;--font-body:"Inter",-apple-system,sans-serif}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--color-bg-dark);color:var(--color-text);font-family:var(--font-body);overflow:hidden}.portfolio{height:100vh;overflow:hidden}.snap-container{height:100vh;overflow-y:scroll;scroll-behavior:smooth;scroll-snap-type:y mandatory}.snap-section{justify-content:center;min-height:100vh;overflow:hidden;position:relative;scroll-snap-align:start;scroll-snap-stop:always}.nav,.snap-section{align-items:center;display:flex}.nav{justify-content:space-between;left:0;padding:1rem 2rem;position:fixed;right:0;top:0;transition:background .3s,backdrop-filter .3s;z-index:100}.nav.scrolled{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0f1a17d9}.hero-section{background:url(../images/zain.jpg) 50%/cover no-repeat;flex-direction:column}.hero-overlay{background:linear-gradient(135deg,#0f1a17b3,#0f1a1766 40%,#0f1a1799);inset:0;position:absolute;z-index:1}.hero-content{padding:2rem;position:relative;text-align:center;z-index:2}.hero-greeting{animation:heroFadeIn .8s ease-out .2s forwards;color:var(--color-gold);display:block;font-family:var(--font-body);font-size:1.1rem;font-weight:300;letter-spacing:4px;margin-bottom:.5rem;opacity:0;text-transform:uppercase}.hero-name{animation:heroSlideUp .9s cubic-bezier(.16,1,.3,1) .5s forwards;color:var(--color-cream);font-size:clamp(3rem,8vw,6rem);font-weight:900;line-height:1.1;text-shadow:0 4px 30px rgba(0,0,0,.5)}.hero-name,.hero-title{font-family:var(--font-display);margin-bottom:.5rem;opacity:0}.hero-title{animation:heroSlideUp .8s cubic-bezier(.16,1,.3,1) .9s forwards;color:var(--color-gold-light);font-size:clamp(1.2rem,3vw,1.8rem);font-weight:400}.hero-subtitle{animation:heroFadeIn .8s ease-out 1.2s forwards;color:var(--color-cream-dim);font-size:1rem;font-weight:300;margin-bottom:2rem;margin-left:auto;margin-right:auto;max-width:500px;opacity:0}.hero-cta{animation:heroSlideUp .8s cubic-bezier(.16,1,.3,1) 1.5s forwards;display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;opacity:0}.btn{align-items:center;border-radius:999px;cursor:pointer;display:inline-flex;font-family:var(--font-body);font-size:.9rem;font-weight:700;gap:.5rem;padding:.75rem 1.5rem;text-decoration:none;transition:transform .2s,box-shadow .2s}.btn svg{flex-shrink:0}.btn-gold{animation:gold-shift 4s ease infinite;background:linear-gradient(135deg,var(--color-gold),var(--color-gold-light),var(--color-gold));background-size:200% 100%;box-shadow:0 8px 30px #c8a45c4d;color:var(--color-bg-dark)}@keyframes gold-shift{0%,to{background-position:0 50%}50%{background-position:100% 50%}}.btn-gold:hover{box-shadow:0 12px 40px #c8a45c73;transform:translateY(-2px)}.btn-outline{background:transparent;border:2px solid hsla(0,0%,100%,.3);color:var(--color-cream)}.btn-outline:hover{background:#c8a45c1a;border-color:var(--color-gold);transform:translateY(-2px)}.scroll-indicator{border:2px solid var(--color-gold);border-radius:14px;bottom:2rem;cursor:pointer;height:44px;left:50%;opacity:.7;position:absolute;transform:translate(-50%);transition:opacity .3s;width:28px;z-index:2}.scroll-indicator:hover{opacity:1}.scroll-indicator span{animation:scrollBounce 2s infinite;background:var(--color-gold);border-radius:2px;display:block;height:8px;margin:8px auto 0;width:4px}@keyframes scrollBounce{0%,to{opacity:1;transform:translateY(0)}50%{opacity:.3;transform:translateY(12px)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes heroFadeIn{0%{opacity:0}to{opacity:1}}@keyframes heroSlideUp{0%{filter:blur(4px);opacity:0;transform:translateY(40px)}to{filter:blur(0);opacity:1;transform:translateY(0)}}.section-inner{margin:0 auto;max-width:1200px;padding:4rem 2rem;width:100%}.section-title{color:var(--color-cream);font-family:var(--font-display);font-size:clamp(2rem,5vw,3rem);font-weight:700;margin-bottom:3rem;position:relative;text-align:center}.section-title:after{background:var(--color-gold);border-radius:2px;content:"";display:block;height:3px;margin:.75rem auto 0;width:60px}.about-section{background:var(--color-bg)}.about-grid{align-items:start;display:grid;gap:3rem;grid-template-columns:300px 1fr}.about-image-wrap{position:relative}.about-image{border:3px solid var(--color-bg-card);border-radius:8px;box-shadow:0 20px 60px #0006;width:100%}.about-image-wrap:before{border:2px solid var(--color-gold);border-radius:8px;content:"";inset:-12px 12px 12px -12px;position:absolute;z-index:-1}.about-text p{color:var(--color-cream-dim);font-size:1rem;line-height:1.75;margin-bottom:1rem}.about-text strong{color:var(--color-gold-light);font-weight:600}.about-stats{border-top:1px solid var(--color-bg-card);display:flex;gap:2rem;margin-top:2rem;padding-top:2rem}.stat{text-align:center}.stat-number{color:var(--color-gold);display:block;font-family:var(--font-display);font-size:2.5rem;font-weight:700}.stat-label{color:var(--color-text-dim);font-size:.85rem;letter-spacing:1px;text-transform:uppercase}.experience-section{align-items:flex-start;background:var(--color-bg-dark);overflow-y:auto}.timeline{margin:0 auto;max-width:900px;padding-left:40px;position:relative}.timeline:before{background:linear-gradient(to bottom,var(--color-gold),var(--color-teal),transparent);bottom:0;content:"";left:8px;position:absolute;top:0;width:2px}.timeline-item{margin-bottom:2.5rem;position:relative}.timeline-dot{background:var(--color-gold);border:3px solid var(--color-bg-dark);border-radius:50%;height:14px;left:-36px;position:absolute;top:1.5rem;width:14px;z-index:1}.timeline-card{background:var(--color-bg-card);border:1px solid rgba(200,164,92,.1);border-radius:8px;padding:1.5rem;transition:transform .3s,border-color .3s}.timeline-card:hover{border-color:#c8a45c4d;transform:translate(4px)}.timeline-date{color:var(--color-gold);font-size:.8rem;font-weight:500;letter-spacing:1px;text-transform:uppercase}.timeline-role{color:var(--color-cream);font-family:var(--font-display);font-size:1.3rem;font-weight:700;margin:.25rem 0}.timeline-company{color:var(--color-teal-light);font-size:1rem;font-weight:600;margin-bottom:.5rem}.timeline-location{color:var(--color-text-dim);font-size:.9rem;font-weight:400}.timeline-desc{color:var(--color-cream-dim);font-size:.9rem;line-height:1.6;margin-bottom:.75rem}.timeline-tech{display:flex;flex-wrap:wrap;gap:.4rem}.tech-tag{background:#3a7d6e33;border:1px solid rgba(58,125,110,.3);border-radius:3px;color:var(--color-teal-light);font-size:.7rem;font-weight:500;letter-spacing:.5px;padding:.25rem .6rem}.skills-section{background:var(--color-bg)}.skills-grid{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.skill-card{background:var(--color-bg-card);border:1px solid rgba(200,164,92,.08);border-radius:8px;padding:1.5rem;transition:transform .3s,border-color .3s}.skill-card:hover{border-color:#c8a45c40;transform:translateY(-4px)}.skill-icon{color:var(--color-gold);font-size:1.5rem;font-weight:700;margin-bottom:.75rem}.skill-card h3{color:var(--color-cream);font-family:var(--font-display);font-size:1.2rem;margin-bottom:1rem}.skill-items{display:flex;flex-wrap:wrap;gap:.5rem}.skill-pill{background:#c8a45c1a;border:1px solid rgba(200,164,92,.15);border-radius:20px;color:var(--color-gold-light);font-size:.8rem;font-weight:400;padding:.3rem .75rem}.projects-section{align-items:flex-start;background:var(--color-bg-dark);overflow-y:auto}.projects-grid{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}.project-card{background:var(--color-bg-card);border:1px solid rgba(200,164,92,.08);border-radius:10px;display:flex;flex-direction:column;overflow:hidden;transition:transform .3s,border-color .3s,box-shadow .3s}.project-card:hover{border-color:#c8a45c4d;box-shadow:0 12px 40px #0000004d;transform:translateY(-6px)}.project-image-wrap{background:var(--color-bg-dark);height:200px;overflow:hidden;position:relative;width:100%}.project-image{height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:top left;object-position:top left;opacity:.85;transition:transform .5s ease,opacity .3s;width:100%}.project-card:hover .project-image{opacity:1;transform:scale(1.05)}.project-image-wrap:after{background:linear-gradient(to bottom,transparent,var(--color-bg-card));bottom:0;content:"";height:40px;left:0;pointer-events:none;position:absolute;right:0}.project-body{display:flex;flex:1;flex-direction:column;padding:1.25rem 1.5rem 1.5rem}.project-header{align-items:flex-start;display:flex;justify-content:space-between;margin-bottom:.25rem}.project-header h3{color:var(--color-cream);font-family:var(--font-display);font-size:1.2rem;font-weight:700}.project-date{color:var(--color-text-dim);font-size:.75rem;margin-left:1rem;white-space:nowrap}.project-subtitle{color:var(--color-teal-light);font-size:.85rem;font-weight:500;margin-bottom:.75rem}.project-desc{color:var(--color-cream-dim);font-size:.9rem;line-height:1.6;margin-bottom:.75rem}.project-highlights{list-style:none;margin:0 0 1rem;padding:0}.project-highlights li{color:var(--color-cream-dim);font-size:.82rem;line-height:1.5;margin-bottom:.4rem;padding-left:1.2rem;position:relative}.project-highlights li:before{background:var(--color-gold);border-radius:50%;content:"";height:6px;left:0;position:absolute;top:.45rem;width:6px}.project-tech{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1rem;margin-top:auto}.project-link{color:var(--color-gold);font-size:.85rem;font-weight:500;text-decoration:none;transition:color .3s,letter-spacing .3s}.project-link:hover{color:var(--color-gold-light);letter-spacing:.5px}.opensource-section{align-items:flex-start;background:var(--color-bg);overflow-y:auto}.opensource-grid{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(400px,1fr))}.opensource-card{background:var(--color-bg-card);border:1px solid rgba(200,164,92,.08);border-radius:10px;display:flex;flex-direction:column;padding:1.5rem;transition:transform .3s,border-color .3s,box-shadow .3s}.opensource-card:hover{border-color:#c8a45c40;box-shadow:0 8px 30px #00000040;transform:translateY(-4px)}.opensource-header{margin-bottom:.75rem}.opensource-title-row{align-items:center;display:flex;gap:.75rem;margin-bottom:.25rem}.opensource-title-row h3{color:var(--color-cream);font-family:var(--font-body);font-size:1.15rem;font-variant-ligatures:none;font-weight:700}.opensource-lang{background:#c8a45c26;border-radius:3px;color:var(--color-gold-light);font-size:.7rem;font-weight:600;letter-spacing:.5px;padding:.2rem .55rem;white-space:nowrap}.opensource-role{color:var(--color-teal-light);font-size:.8rem;font-weight:500}.opensource-desc{color:var(--color-cream-dim);font-size:.9rem;line-height:1.6;margin-bottom:.75rem}.opensource-highlights{list-style:none;margin:0 0 1rem;padding:0}.opensource-highlights li{color:var(--color-cream-dim);font-size:.82rem;line-height:1.5;margin-bottom:.4rem;padding-left:1.2rem;position:relative}.opensource-highlights li:before{background:var(--color-teal-light);border-radius:50%;content:"";height:6px;left:0;position:absolute;top:.45rem;width:6px}.opensource-tech{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1rem;margin-top:auto}.opensource-footer{align-items:center;border-top:1px solid rgba(200,164,92,.1);display:flex;justify-content:space-between;padding-top:.75rem}.opensource-link{color:var(--color-gold);font-size:.85rem;font-weight:500;text-decoration:none;transition:color .3s,letter-spacing .3s}.opensource-link:hover{color:var(--color-gold-light);letter-spacing:.5px}.opensource-install{background:#0000004d;border:1px solid rgba(200,164,92,.1);border-radius:4px;color:var(--color-text-dim);font-family:SF Mono,Fira Code,monospace;font-size:.75rem;padding:.3rem .6rem}.testimonials-section{align-items:flex-start;background:var(--color-bg-dark);overflow-y:auto}.testimonials-grid{display:grid;gap:1.5rem;grid-template-columns:1fr 1fr}.testimonial-card{background:var(--color-bg-card);border:1px solid rgba(200,164,92,.08);border-radius:12px;padding:2rem 1.75rem 1.5rem;position:relative;transition:transform .3s,border-color .3s,box-shadow .3s}.testimonial-card:hover{border-color:#c8a45c33;box-shadow:0 12px 40px #0000004d;transform:translateY(-4px)}.testimonial-quote-mark{color:#c8a45c33;font-family:var(--font-display);font-size:4rem;left:1.25rem;line-height:1;pointer-events:none;position:absolute;top:.75rem}.testimonial-text{color:var(--color-cream-dim);font-size:.9rem;font-style:italic;line-height:1.7;margin-bottom:1.25rem;padding-left:.5rem;position:relative}.testimonial-author{align-items:center;border-top:1px solid rgba(200,164,92,.1);display:flex;gap:.75rem;padding-top:1rem}.testimonial-avatar{align-items:center;background:linear-gradient(135deg,var(--color-teal),var(--color-gold));border-radius:50%;color:var(--color-bg-dark);display:flex;flex-shrink:0;font-size:.75rem;font-weight:700;height:40px;justify-content:center;letter-spacing:.5px;width:40px}.testimonial-info{display:flex;flex-direction:column;gap:.15rem}.testimonial-name{color:var(--color-gold);font-size:.9rem;font-weight:600}.testimonial-role{color:var(--color-text-dim);font-size:.75rem;font-weight:400}.contact-section{background:var(--color-bg)}.contact-inner{text-align:center}.contact-intro{color:var(--color-cream-dim);font-size:1.1rem;line-height:1.7;margin:0 auto 2.5rem;max-width:550px}.contact-links{display:flex;flex-wrap:wrap;gap:1.5rem;justify-content:center;margin-bottom:3rem}.contact-card{align-items:center;background:var(--color-bg-card);border:1px solid rgba(200,164,92,.1);border-radius:8px;display:flex;flex-direction:column;gap:.5rem;min-width:200px;padding:2rem 2.5rem;text-decoration:none;transition:transform .3s,border-color .3s}.contact-card:hover{border-color:var(--color-gold);transform:translateY(-4px)}.contact-icon{color:var(--color-gold);font-size:1.5rem;font-weight:700}.contact-label{color:var(--color-text-dim);font-size:.75rem;letter-spacing:2px;text-transform:uppercase}.contact-value{color:var(--color-cream);font-size:.9rem;font-weight:500}.contact-social{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:#1a2f2a99;border:1px solid rgba(200,164,92,.15);display:inline-flex;gap:0;justify-content:center;margin-bottom:2.5rem;padding:.35rem .5rem}.contact-social,.contact-social-link{align-items:center;border-radius:50px}.contact-social-link{color:var(--color-cream-dim);display:flex;font-size:.82rem;font-weight:500;gap:.45rem;letter-spacing:.3px;padding:.5rem 1.1rem;text-decoration:none;transition:all .3s ease}.contact-social-link:hover{background:#c8a45c1f;color:var(--color-cream)}.contact-social-link svg{flex-shrink:0;opacity:.7;transition:opacity .3s}.contact-social-link:hover svg{opacity:1}.contact-social-link:last-child{color:var(--color-gold)}.contact-social-link:last-child:hover{background:#c8a45c26;color:var(--color-gold-light)}.contact-social-divider{background:#c8a45c33;flex-shrink:0;height:16px;width:1px}.site-footer{border-top:1px solid var(--color-bg-card);padding-top:2rem}.site-footer p{color:var(--color-text-dim);font-size:.8rem}@media(max-width:768px){.about-grid{grid-template-columns:1fr;text-align:center}.about-image-wrap{margin:0 auto;max-width:250px}.about-stats{justify-content:center}.timeline{padding-left:30px}.timeline:before{left:4px}.timeline-dot{left:-30px}.opensource-grid,.projects-grid,.testimonials-grid{grid-template-columns:1fr}.nav-links{display:none}.contact-links{align-items:center;flex-direction:column}}