@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Poppins:wght@300;400;500;600;700;800&display=swap";:root{--primary: #6366f1;--primary-dark: #4f46e5;--secondary: #8b5cf6;--accent: #06b6d4;--pink: #ec4899;--bg-hero: #0a0e1a;--bg-dark: #0d1120;--bg-section: #0f1628;--bg-section-alt: #111827;--bg-card: rgba(255, 255, 255, .04);--bg-card-hover: rgba(255, 255, 255, .08);--text-primary: #f1f5f9;--text-secondary: #94a3b8;--text-muted: #64748b;--border: rgba(255, 255, 255, .08);--border-hover: rgba(255, 255, 255, .16);--glass: rgba(255, 255, 255, .06);--glass-border: rgba(255, 255, 255, .12);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .4);--shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--shadow-lg: 0 10px 30px rgba(0, 0, 0, .5);--shadow-xl: 0 20px 50px rgba(0, 0, 0, .6);--shadow-glow: 0 0 40px rgba(99, 102, 241, .15);--gradient: linear-gradient(135deg, #667eea, #764ba2);--gradient-accent: linear-gradient(135deg, #4facfe, #00f2fe);--gradient-brand: linear-gradient(135deg, var(--primary), var(--secondary))}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;font-size:16px;scrollbar-width:none}html::-webkit-scrollbar,body::-webkit-scrollbar{display:none}body{font-family:Inter,sans-serif;line-height:1.6;color:var(--text-primary);background:var(--bg-hero);min-height:100vh;overflow-x:hidden;-ms-overflow-style:none;scrollbar-width:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}img{max-width:100%;height:auto;display:block}button,a{cursor:pointer}button:focus,a:focus{outline:2px solid var(--primary);outline-offset:2px}::selection{background:var(--primary);color:#fff}body.menu-open{overflow:hidden}#home{background:transparent}#about{background:var(--bg-section)}#skills{background:var(--bg-section-alt)}#projects{background:var(--bg-section)}#contact{background:var(--bg-section-alt)}#about:before,#skills:before,#projects:before,#contact:before{content:"";display:block;height:1px;background:linear-gradient(90deg,transparent,rgba(99,102,241,.3),rgba(6,182,212,.3),transparent)}.section-header{text-align:center;margin-bottom:3.5rem}.section-tag{display:inline-block;background:linear-gradient(135deg,#6366f133,#06b6d433);border:1px solid rgba(99,102,241,.3);color:var(--accent);font-size:.8rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:.4rem 1rem;border-radius:20px;margin-bottom:1rem}.section-title{font-size:2.6rem;font-weight:800;color:#fff;margin-bottom:.75rem;background:linear-gradient(135deg,#fff 40%,#cbd5e1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.section-subtitle{font-size:1.05rem;color:var(--text-secondary);max-width:500px;margin:0 auto;line-height:1.7}.animate-in{opacity:0;transform:translateY(28px);transition:opacity .6s ease,transform .6s ease}.particles{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0;overflow:hidden}.particle{position:absolute;border-radius:50%;background:#6366f11f;animation:floatParticle linear infinite}.particle-1{width:8px;height:8px;left:10%;animation-duration:25s;animation-delay:0s}.particle-2{width:12px;height:12px;left:20%;animation-duration:30s;animation-delay:2s;background:#8b5cf61f}.particle-3{width:6px;height:6px;left:35%;animation-duration:22s;animation-delay:4s;background:#06b6d41f}.particle-4{width:10px;height:10px;left:50%;animation-duration:28s;animation-delay:1s}.particle-5{width:14px;height:14px;left:65%;animation-duration:35s;animation-delay:3s;background:#ec48991a}.particle-6{width:7px;height:7px;left:75%;animation-duration:20s;animation-delay:5s}.particle-7{width:9px;height:9px;left:85%;animation-duration:27s;animation-delay:2s;background:#8b5cf61f}.particle-8{width:11px;height:11px;left:90%;animation-duration:32s;animation-delay:6s;background:#06b6d41a}.particle-9{width:5px;height:5px;left:5%;animation-duration:18s;animation-delay:7s;background:#6366f126}.particle-10{width:13px;height:13px;left:45%;animation-duration:40s;animation-delay:0s;background:#ec489914}.particle-11{width:7px;height:7px;left:15%;animation-duration:23s;animation-delay:8s}.particle-12{width:10px;height:10px;left:28%;animation-duration:29s;animation-delay:3s;background:#06b6d41f}.particle-13{width:8px;height:8px;left:55%;animation-duration:26s;animation-delay:1s;background:#8b5cf61a}.particle-14{width:15px;height:15px;left:70%;animation-duration:37s;animation-delay:4s;background:#6366f114}.particle-15{width:6px;height:6px;left:95%;animation-duration:21s;animation-delay:9s;background:#ec48991f}@keyframes floatParticle{0%{transform:translateY(100vh) rotate(0);opacity:0}10%{opacity:1}90%{opacity:1}to{transform:translateY(-100px) rotate(360deg);opacity:0}}.App{position:relative}.main-content{position:relative;z-index:1}.scroll-top-btn{position:fixed;bottom:2rem;right:2rem;width:48px;height:48px;background:linear-gradient(135deg,var(--primary),var(--secondary));border:none;border-radius:50%;color:#fff;font-size:1.1rem;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 20px #6366f166;opacity:0;transform:translateY(20px);z-index:1000;display:flex;align-items:center;justify-content:center}.scroll-top-btn.visible{opacity:1;transform:translateY(0)}.scroll-top-btn:hover{transform:translateY(-4px) scale(1.1);box-shadow:0 8px 25px #6366f18c}@media (max-width: 320px){html{font-size:14px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}.navbar{position:fixed;top:0;left:0;right:0;z-index:99999;background:#0f172ad9;-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);border-bottom:1px solid rgba(255,255,255,.08);transition:all .4s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 30px #0000004d}.navbar:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--primary),var(--secondary),var(--accent),transparent);background-size:200% 100%;animation:shimmer 3s linear infinite}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.navbar-scrolled{background:#0a0f1ef7;box-shadow:0 8px 40px #00000080}.nav-container{max-width:1200px;margin:0 auto;padding:0 2rem;display:flex;align-items:center;justify-content:space-between;height:70px}.nav-logo{display:flex;align-items:center;gap:.75rem;cursor:pointer;transition:transform .3s ease}.nav-logo:hover{transform:translateY(-2px)}.nav-profile-pic{width:42px;height:42px;border-radius:50%;border:2px solid rgba(99,102,241,.5);object-fit:cover;transition:all .3s ease;box-shadow:0 0 15px #6366f14d}.nav-logo:hover .nav-profile-pic{border-color:var(--accent);box-shadow:0 0 20px #06b6d480;transform:rotate(5deg) scale(1.05)}.nav-name{font-weight:700;font-size:1.1rem;background:linear-gradient(135deg,#fff,#cbd5e1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.nav-menu{display:flex;align-items:center;gap:.5rem}.nav-link{background:#ffffff0f;border:1px solid rgba(255,255,255,.1);color:#ffffffd9;padding:.6rem 1rem;border-radius:10px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;gap:.5rem;text-decoration:none;position:relative;overflow:hidden}.nav-link:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);transition:left .5s ease}.nav-link:hover:before{left:100%}.nav-link:hover{background:#ffffff24;color:#fff;transform:translateY(-2px);border-color:#fff3;box-shadow:0 4px 15px #0003}.nav-link.active{background:linear-gradient(135deg,#6366f159,#8b5cf659);border-color:#6366f180;color:#fff;transform:translateY(-1px);box-shadow:0 4px 15px #6366f140}.github-link{background:linear-gradient(135deg,#6366f133,#8b5cf633);border-color:#6366f14d}.github-link:hover{background:linear-gradient(135deg,#6366f166,#8b5cf666);box-shadow:0 4px 20px #6366f14d}.nav-toggle{display:none;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;font-size:1.3rem;cursor:pointer;padding:.6rem;border-radius:10px;transition:all .3s ease;min-height:44px;min-width:44px;align-items:center;justify-content:center}.nav-toggle:hover{background:#fff3;transform:scale(1.05)}@media (max-width: 768px){.nav-menu{position:fixed;top:70px;left:0;right:0;background:#0a0f1efa;-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);flex-direction:column;padding:1.5rem;transform:translateY(-100vh);opacity:0;visibility:hidden;transition:all .4s cubic-bezier(.4,0,.2,1);border-bottom:1px solid rgba(255,255,255,.1);z-index:9998;gap:.5rem}.nav-menu.nav-open{transform:translateY(0);opacity:1;visibility:visible}.nav-menu .nav-link{width:100%;justify-content:flex-start;padding:.875rem 1.25rem;font-size:1rem}.nav-toggle{display:flex!important}}.footer{background:var(--bg-dark);color:#fff;padding:3rem 2rem 2rem;text-align:center;position:relative;overflow:hidden}.footer:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--primary),var(--accent),transparent)}.footer-content{max-width:1200px;margin:0 auto}.footer-logo{display:flex;align-items:center;justify-content:center;gap:.75rem;margin-bottom:1.5rem}.footer-pic{width:36px;height:36px;border-radius:50%;border:2px solid rgba(99,102,241,.4);object-fit:cover}.footer-logo span{font-weight:700;font-size:1.1rem}.footer-links{display:flex;justify-content:center;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}.footer-link{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);color:#ffffffb3;padding:.4rem .9rem;border-radius:8px;cursor:pointer;font-size:.85rem;transition:all .3s}.footer-link:hover{background:#6366f133;color:#fff;transform:translateY(-2px)}.footer-copy{font-size:.85rem;color:#fff6}.hero-section{min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative;padding:2rem;padding-top:90px;z-index:1;background:transparent}.hero-container{max-width:1200px;width:100%;position:relative;z-index:2}.hero-content{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}.hero-text{animation:fadeInLeft .8s ease-out both}.hero-greeting{font-size:1.2rem;color:#ffffffb3;margin-bottom:.5rem;font-weight:500;animation:fadeInLeft .8s ease-out .1s both}.hero-name{font-size:3.8rem;font-weight:800;color:#fff;line-height:1.1;margin-bottom:.75rem;text-shadow:0 4px 20px rgba(0,0,0,.3);animation:fadeInLeft .8s ease-out .2s both}.hero-role-wrapper{font-size:1.6rem;font-weight:600;margin-bottom:1.5rem;min-height:2.5rem;animation:fadeInLeft .8s ease-out .3s both}.hero-role-static{color:#ffffffb3}.hero-role-dynamic{background:linear-gradient(135deg,#4facfe,#00f2fe,#6366f1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;background-size:200% 200%;animation:gradientMove 3s ease infinite}.cursor{display:inline-block;color:var(--accent);-webkit-text-fill-color:var(--accent);animation:blink .7s infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}@keyframes gradientMove{0%{background-position:0%50%}50%{background-position:100%50%}to{background-position:0%50%}}.hero-subtitle{font-size:1.1rem;color:#ffffffbf;margin-bottom:2rem;line-height:1.7;max-width:520px;animation:fadeInLeft .8s ease-out .4s both}.hero-stats{display:flex;align-items:center;gap:1.5rem;margin-bottom:2rem;animation:fadeInLeft .8s ease-out .5s both}.stat-item{text-align:center}.stat-number{display:block;font-size:1.6rem;font-weight:800;background:linear-gradient(135deg,var(--accent),var(--primary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.stat-label{font-size:.75rem;color:#ffffff80;font-weight:500;text-transform:uppercase;letter-spacing:.05em}.stat-divider{width:1px;height:40px;background:#ffffff26}.hero-buttons{display:flex;gap:1rem;flex-wrap:wrap;animation:fadeInLeft .8s ease-out .6s both}.btn-primary,.btn-secondary{padding:.875rem 1.75rem;border-radius:12px;font-weight:600;font-size:1rem;cursor:pointer;transition:all .3s ease;border:none;display:inline-flex;align-items:center;gap:.5rem;position:relative;overflow:hidden}.btn-primary{background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;box-shadow:0 4px 20px #6366f166}.btn-primary:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.btn-primary:hover:before{left:100%}.btn-primary:hover{transform:translateY(-3px);box-shadow:0 8px 30px #6366f180}.btn-secondary{background:#ffffff1a;color:#fff;border:1px solid rgba(255,255,255,.25);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.btn-secondary:hover{background:#fff3;transform:translateY(-3px);box-shadow:0 8px 25px #0003}.hero-image{display:flex;justify-content:center;animation:fadeInRight .8s ease-out .3s both}.profile-container{position:relative;width:340px;height:340px}.hero-profile-pic{width:300px;height:300px;border-radius:50%;object-fit:cover;border:4px solid rgba(99,102,241,.4);box-shadow:0 0 60px #6366f14d,var(--shadow-xl);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:3;animation:floatPic 6s ease-in-out infinite}.profile-ring{position:absolute;top:50%;left:50%;border-radius:50%;border:2px solid transparent;animation:spin linear infinite}.ring-1{width:330px;height:330px;margin:-165px 0 0 -165px;border-top-color:#6366f180;border-right-color:#6366f133;animation-duration:8s}.ring-2{width:360px;height:360px;margin:-180px 0 0 -180px;border-bottom-color:#06b6d466;border-left-color:#06b6d433;animation-duration:12s;animation-direction:reverse}@keyframes spin{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes floatPic{0%,to{transform:translate(-50%,-50%) translateY(0)}50%{transform:translate(-50%,-50%) translateY(-12px)}}.profile-glow{position:absolute;top:50%;left:50%;width:280px;height:280px;margin:-140px 0 0 -140px;background:radial-gradient(circle,rgba(99,102,241,.3),transparent 70%);border-radius:50%;filter:blur(30px);animation:glowPulse 4s ease-in-out infinite;z-index:1}@keyframes glowPulse{0%,to{opacity:.5;transform:translate(-50%,-50%) scale(1)}50%{opacity:.8;transform:translate(-50%,-50%) scale(1.1)}}.floating-badge{position:absolute;background:#0f172aeb;border:1px solid rgba(255,255,255,.15);color:#fff;font-size:.75rem;font-weight:600;padding:.45rem .85rem;border-radius:20px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 4px 20px #00000059;z-index:10;white-space:nowrap;display:flex;align-items:center;gap:.3rem}.badge-react{top:2%;right:-8%;border-color:#61dafb66;animation:badgeFloat 4s ease-in-out infinite}.badge-nextjs{top:10%;left:-12%;border-color:#ffffff40;animation:badgeFloat 4s ease-in-out 1s infinite}.badge-node{bottom:10%;right:-12%;border-color:#3936;animation:badgeFloat 4s ease-in-out 2s infinite}.badge-mongo{bottom:2%;left:-8%;border-color:#47a24866;animation:badgeFloat 4s ease-in-out 3s infinite}@keyframes badgeFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.scroll-indicator{position:absolute;bottom:2rem;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:.5rem;cursor:pointer;opacity:.7;transition:opacity .3s;animation:bounce 2s infinite}.scroll-indicator:hover{opacity:1}.scroll-mouse{width:26px;height:40px;border:2px solid rgba(255,255,255,.5);border-radius:13px;display:flex;justify-content:center;padding-top:6px}.scroll-wheel{width:4px;height:8px;background:#fff;border-radius:2px;animation:scrollWheel 2s infinite}.scroll-text{font-size:.7rem;color:#ffffff80;letter-spacing:.1em;text-transform:uppercase}@keyframes scrollWheel{0%,to{transform:translateY(0);opacity:1}60%{transform:translateY(10px);opacity:0}}@keyframes bounce{0%,to{transform:translate(-50%) translateY(0)}50%{transform:translate(-50%) translateY(-8px)}}@keyframes fadeInLeft{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes fadeInRight{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@media (max-width: 1024px){.hero-name{font-size:3rem}.hero-content{gap:2.5rem}.profile-container{width:290px;height:290px}.hero-profile-pic{width:260px;height:260px}.ring-1{width:285px;height:285px;margin:-142px 0 0 -142px}.ring-2{width:315px;height:315px;margin:-157px 0 0 -157px}}@media (max-width: 768px){.hero-content{grid-template-columns:1fr;gap:2rem;text-align:center}.hero-image{order:-1}.hero-name{font-size:2.8rem}.hero-subtitle{margin:0 auto 2rem}.hero-buttons,.hero-stats{justify-content:center}.badge-react{top:-8%;right:2%}.badge-nextjs{top:5%;left:-2%}.badge-node{bottom:5%;right:-2%}.badge-mongo{bottom:-8%;left:2%}}@media (max-width: 480px){.hero-name{font-size:2.2rem}.hero-profile-pic{width:210px;height:210px}.profile-container{width:240px;height:240px}.ring-1{width:240px;height:240px;margin:-120px 0 0 -120px}.ring-2{width:270px;height:270px;margin:-135px 0 0 -135px}.btn-primary,.btn-secondary{width:100%;justify-content:center}.hero-buttons{flex-direction:column}.floating-badge{font-size:.65rem;padding:.35rem .65rem}.hero-section{padding:1rem;padding-top:80px}}.about-section{padding:6rem 2rem;position:relative;z-index:1}.about-container{max-width:1200px;margin:0 auto}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}.about-description{background:var(--bg-card);border:1px solid var(--border);border-radius:20px;padding:2rem;margin-bottom:1.5rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.about-description p{color:var(--text-secondary);font-size:1rem;line-height:1.8;margin-bottom:1rem}.about-description p:last-of-type{margin-bottom:0}.about-description strong{color:#fff;font-weight:700}.about-location{display:flex;align-items:center;gap:.5rem;color:var(--accent);font-size:.9rem;font-weight:500;margin-top:1.25rem;padding-top:1.25rem;border-top:1px solid var(--border)}.about-highlights{display:flex;flex-direction:column;gap:.85rem;margin-bottom:1.75rem}.highlight-card{display:flex;align-items:center;gap:1rem;background:var(--bg-card);border:1px solid var(--border);border-left:3px solid var(--card-color, var(--primary));border-radius:14px;padding:1.1rem 1.25rem;transition:all .3s ease;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.highlight-card:hover{background:var(--bg-card-hover);border-color:var(--border-hover);transform:translate(5px);box-shadow:var(--shadow-md)}.highlight-icon{width:40px;height:40px;flex-shrink:0;background:linear-gradient(135deg,#ffffff14,#ffffff0a);border:1px solid var(--border);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:var(--card-color, var(--primary))}.highlight-content h3{font-size:.95rem;font-weight:700;color:#fff;margin-bottom:.2rem}.highlight-content p{font-size:.82rem;color:var(--text-secondary)}.btn-download{display:inline-flex;align-items:center;gap:.6rem;background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;text-decoration:none;padding:.85rem 1.75rem;border-radius:12px;font-weight:600;font-size:.95rem;transition:all .3s ease;box-shadow:0 4px 20px #6366f159;position:relative;overflow:hidden}.btn-download:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.btn-download:hover:before{left:100%}.btn-download:hover{transform:translateY(-3px);box-shadow:0 8px 30px #6366f180}.timeline{display:flex;flex-direction:column;gap:2rem}.timeline-item{display:flex;gap:1.25rem;position:relative}.timeline-item:not(:last-child):after{content:"";position:absolute;left:22px;top:50px;width:2px;height:calc(100% + 1.25rem);background:linear-gradient(to bottom,var(--tl-color, var(--primary)),transparent);opacity:.3}.timeline-icon{width:46px;height:46px;flex-shrink:0;background:linear-gradient(135deg,#6366f133,#8b5cf633);border:1px solid rgba(99,102,241,.3);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;color:var(--tl-color, var(--primary))}.timeline-content{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:1.5rem;flex:1;transition:all .3s ease;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.timeline-content:hover{background:var(--bg-card-hover);border-color:var(--border-hover);box-shadow:var(--shadow-md);transform:translateY(-2px)}.timeline-header{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:.5rem;margin-bottom:.4rem}.timeline-header h3{font-size:1rem;font-weight:700;color:#fff}.timeline-period{font-size:.75rem;font-weight:600;background:linear-gradient(135deg,#6366f133,#06b6d433);border:1px solid rgba(99,102,241,.3);color:var(--accent);padding:.25rem .75rem;border-radius:20px;white-space:nowrap}.timeline-company{font-size:.85rem;color:var(--primary);font-weight:600;margin-bottom:.75rem}.timeline-points{list-style:none;display:flex;flex-direction:column;gap:.45rem}.timeline-points li{font-size:.875rem;color:var(--text-secondary);padding-left:1.1rem;position:relative;line-height:1.6}.timeline-points li:before{content:"";position:absolute;left:0;top:.6rem;width:5px;height:5px;background:var(--tl-color, var(--accent));border-radius:50%}@media (max-width: 900px){.about-grid{grid-template-columns:1fr;gap:2rem}}@media (max-width: 480px){.about-section{padding:4rem 1rem}.timeline-header{flex-direction:column}}.skills-section{padding:6rem 2rem;background:linear-gradient(135deg,#0f0c29,#1a1a3e,#0f172a);position:relative;overflow:hidden}.skills-section:before{content:"";position:absolute;top:-50%;left:-20%;width:600px;height:600px;background:radial-gradient(circle,rgba(99,102,241,.08),transparent 70%);border-radius:50%;pointer-events:none}.skills-container{max-width:1200px;margin:0 auto}.section-header{text-align:center;margin-bottom:3rem}.tech-stack{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;margin-bottom:4rem}.tech-pill{display:flex;align-items:center;gap:.5rem;background:#ffffff0f;border:1px solid rgba(255,255,255,.12);color:#ffffffd9;padding:.5rem 1.1rem;border-radius:25px;font-size:.9rem;font-weight:500;transition:all .3s ease;cursor:default}.tech-pill:hover{background:#ffffff1f;border-color:var(--tech-color, rgba(255,255,255,.3));color:#fff;transform:translateY(-3px);box-shadow:0 6px 20px #0000004d}.tech-icon{font-size:1.1rem;color:var(--tech-color, white);display:flex}.skills-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem}.skill-card{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:1.75rem;transition:all .3s ease;position:relative;overflow:hidden}.skill-card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--cat-color, #6366f1),transparent);opacity:0;transition:opacity .3s}.skill-card:hover{background:#ffffff12;transform:translateY(-4px);box-shadow:0 12px 35px #0000004d}.skill-card:hover:before{opacity:1}.skill-card-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1.5rem}.cat-icon{width:40px;height:40px;background:linear-gradient(135deg,var(--cat-color, #6366f1),rgba(99,102,241,.4));border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1rem}.skill-card-header h3{font-size:1rem;font-weight:700;color:#fff}.skill-bars{display:flex;flex-direction:column;gap:1rem}.skill-bar-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.4rem}.skill-icon{color:var(--cat-color, #6366f1);font-size:.95rem;display:flex}.skill-name{flex:1;font-size:.875rem;color:#fffc;font-weight:500}.skill-percent{font-size:.8rem;color:var(--cat-color, #6366f1);font-weight:600}.skill-bar-track{height:6px;background:#ffffff14;border-radius:3px;overflow:hidden}.skill-bar-fill{height:100%;background:linear-gradient(90deg,var(--fill-color, #6366f1),rgba(99,102,241,.6));border-radius:3px;transition:width 1.2s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.skill-bar-fill:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);animation:barShine 2s ease-in-out infinite}@keyframes barShine{0%{left:-100%}to{left:200%}}@media (max-width: 768px){.skills-grid{grid-template-columns:1fr}.skills-section{padding:4rem 1rem}.section-title{font-size:2rem}}.projects-section{padding:6rem 2rem;background:#f8fafc;position:relative;overflow:hidden}.projects-section:after{content:"";position:absolute;bottom:-100px;left:-100px;width:400px;height:400px;background:radial-gradient(circle,rgba(6,182,212,.06),transparent 70%);border-radius:50%;pointer-events:none}.projects-container{max-width:1200px;margin:0 auto}.section-header{text-align:center;margin-bottom:2.5rem}.section-tag{display:inline-block;background:linear-gradient(135deg,#6366f11f,#8b5cf61f);border:1px solid rgba(99,102,241,.25);color:#6366f1;padding:.4rem 1.2rem;border-radius:20px;font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;margin-bottom:1rem}.section-title{font-size:2.5rem;font-weight:800;color:#1f2937;margin-bottom:.75rem}.section-subtitle{font-size:1.1rem;color:#6b7280}.filter-tabs{display:flex;justify-content:center;gap:.5rem;flex-wrap:wrap;margin-bottom:3rem}.filter-tab{background:#fff;border:1px solid #e5e7eb;color:#6b7280;padding:.5rem 1.25rem;border-radius:25px;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .3s ease;min-height:auto;min-width:auto}.filter-tab:hover{border-color:#6366f1;color:#6366f1}.filter-tab.active{background:linear-gradient(135deg,#6366f1,#8b5cf6);border-color:transparent;color:#fff;box-shadow:0 4px 15px #6366f14d}.projects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-bottom:3rem}.project-card{background:#fff;border-radius:16px;overflow:hidden;border:1px solid #e5e7eb;transition:all .3s ease;box-shadow:0 2px 10px #0000000a;display:flex;flex-direction:column}.project-card:hover{transform:translateY(-6px);box-shadow:0 20px 50px #0000001f;border-color:#6366f133}.project-banner{height:110px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.project-emoji{font-size:3rem;filter:drop-shadow(0 4px 8px rgba(0,0,0,.2))}.project-status{position:absolute;top:.75rem;right:.75rem;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:.25rem .7rem;border-radius:20px}.status-live,.status-production{background:#ffffff40;color:#fff;border:1px solid rgba(255,255,255,.4)}.status-completed{background:#fff3;color:#fff;border:1px solid rgba(255,255,255,.35)}.project-body{padding:1.25rem;flex:1;display:flex;flex-direction:column;gap:.75rem}.project-name{font-size:1.1rem;font-weight:800;color:#1f2937;margin-bottom:.15rem}.project-tagline{font-size:.8rem;color:#6366f1;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.project-desc{font-size:.85rem;color:#4b5563;line-height:1.6;flex:1}.project-features{display:flex;flex-wrap:wrap;gap:.4rem}.feature-tag{font-size:.72rem;background:#6366f114;border:1px solid rgba(99,102,241,.15);color:#6366f1;padding:.2rem .6rem;border-radius:10px;font-weight:500}.project-tech{display:flex;flex-wrap:wrap;gap:.4rem}.tech-badge{font-size:.72rem;background:#f3f4f6;border:1px solid #e5e7eb;color:#374151;padding:.2rem .6rem;border-radius:6px;font-weight:500}.project-actions{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:auto}.btn-live,.btn-github,.btn-private{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem .875rem;border-radius:8px;font-size:.8rem;font-weight:600;text-decoration:none;transition:all .3s ease;cursor:pointer;min-height:auto;min-width:auto;border:none}.btn-live{background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;box-shadow:0 3px 10px #6366f14d}.btn-live:hover{transform:translateY(-2px);box-shadow:0 6px 18px #6366f166}.btn-github{background:#1f2937;color:#fff}.btn-github:hover{background:#111827;transform:translateY(-2px)}.btn-private{background:#f3f4f6;color:#6b7280;font-style:italic}.github-cta{text-align:center;padding:2rem;background:linear-gradient(135deg,#6366f10d,#8b5cf60d);border:1px solid rgba(99,102,241,.15);border-radius:16px}.github-cta p{color:#6b7280;margin-bottom:1rem;font-size:.95rem}.btn-github-cta{display:inline-flex;align-items:center;gap:.6rem;background:#1f2937;color:#fff;padding:.75rem 1.5rem;border-radius:10px;text-decoration:none;font-weight:600;font-size:.9rem;transition:all .3s ease;min-height:auto;min-width:auto}.btn-github-cta:hover{background:#111827;transform:translateY(-3px);box-shadow:0 8px 25px #00000026}@media (max-width: 1024px){.projects-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 640px){.projects-grid{grid-template-columns:1fr}.projects-section{padding:4rem 1rem}.section-title{font-size:2rem}}.project-company{font-size:.75rem;color:#8b5cf6;font-weight:600;margin-top:.2rem;display:flex;align-items:center;gap:.3rem}.contact-section{padding:6rem 2rem;background:linear-gradient(135deg,#0f0c29,#1a1a3e,#0f172a);position:relative;overflow:hidden}.contact-section:before{content:"";position:absolute;top:-50%;right:-20%;width:500px;height:500px;background:radial-gradient(circle,rgba(139,92,246,.07),transparent 70%);border-radius:50%;pointer-events:none}.contact-container{max-width:1100px;margin:0 auto}.section-header{text-align:center;margin-bottom:4rem}.section-tag{display:inline-block;background:#6366f126;border:1px solid rgba(99,102,241,.3);color:#818cf8;padding:.4rem 1.2rem;border-radius:20px;font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;margin-bottom:1rem}.section-title{font-size:2.5rem;font-weight:800;color:#fff;margin-bottom:.75rem}.section-subtitle{font-size:1.1rem;color:#ffffff80}.animate-in{opacity:0;transform:translateY(25px);transition:opacity .6s ease,transform .6s ease}.animate-in.animated{opacity:1;transform:translateY(0)}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:start}.contact-cards{display:flex;flex-direction:column;gap:1rem}.contact-card{display:flex;align-items:center;gap:1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:1.1rem 1.25rem;text-decoration:none;transition:all .3s ease}.contact-card:hover{background:#ffffff17;transform:translate(6px);border-color:#ffffff26;box-shadow:0 8px 25px #00000040}.contact-card-icon{width:48px;height:48px;min-width:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.2rem;box-shadow:0 4px 15px #0000004d}.contact-card-info{flex:1}.contact-card-desc{font-size:.72rem;color:#fff6;text-transform:uppercase;letter-spacing:.08em}.contact-card-info h3{font-size:.95rem;font-weight:700;color:#fff;margin:.1rem 0}.contact-card-info p{font-size:.85rem;color:#fff9}.contact-card-arrow{color:#ffffff4d;font-size:.85rem;transition:transform .3s}.contact-card:hover .contact-card-arrow{color:#ffffffb3;transform:translate(4px)}.message-box{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:2rem;position:relative;overflow:hidden}.message-box:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,#6366f1,#8b5cf6,#06b6d4)}.message-icon{font-size:2.5rem;margin-bottom:1rem}.message-box h3{font-size:1.25rem;font-weight:800;color:#fff;margin-bottom:1rem}.message-box p{font-size:.9rem;color:#fff9;line-height:1.7;margin-bottom:1rem}.contact-badges{display:flex;flex-direction:column;gap:.6rem;margin-bottom:1.5rem}.contact-badge{display:flex;align-items:center;gap:.6rem;font-size:.85rem;color:#ffffff8c}.contact-badge.available{color:#34d399}.contact-badge svg{font-size:.8rem}.btn-contact-main{display:inline-flex;align-items:center;gap:.6rem;background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;padding:.875rem 1.75rem;border-radius:12px;text-decoration:none;font-weight:600;font-size:.95rem;transition:all .3s ease;box-shadow:0 4px 20px #6366f159;min-height:auto;min-width:auto}.btn-contact-main:hover{transform:translateY(-3px);box-shadow:0 8px 30px #6366f180}@media (max-width: 768px){.contact-grid{grid-template-columns:1fr}.contact-section{padding:4rem 1rem}.section-title{font-size:2rem}}
