*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{color:#fff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#0a0a0f;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}ul{list-style:none}:root{--color-bg:#0a0a0f;--color-primary:#00f0ff;--color-secondary:#7c3aed;--color-accent:#ff6b9d;--color-gold:gold;--color-text:#fff;--color-text-muted:#fff9;--color-text-dim:#ffffff4d;--glass-bg:#ffffff08;--glass-bg-hover:#ffffff0f;--glass-border:#ffffff14;--glass-border-hover:#ffffff26;--glass-blur:blur(20px);--shadow-glow:0 0 30px #00f0ff26;--radius-sm:8px;--radius-md:16px;--radius-lg:24px;--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;--max-width:1200px;--nav-height:70px}.app{min-height:100vh;position:relative}.canvas-wrapper{z-index:0;pointer-events:none;width:100vw;height:100vh;position:fixed;top:0;left:0}.content{z-index:1;position:relative}.section{flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:100px 24px;display:flex;position:relative}.section-glass{-webkit-backdrop-filter:var(--glass-blur);border-top:1px solid var(--glass-border);border-bottom:1px solid var(--glass-border);background:#0a0a0f99}.section-inner{width:100%;max-width:var(--max-width)}.section-title{background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:16px;font-size:clamp(2rem,5vw,3.5rem);font-weight:700}.section-subtitle{color:var(--color-text-muted);text-align:center;max-width:600px;margin-bottom:60px;font-size:clamp(1rem,2vw,1.2rem);line-height:1.6}.navbar{z-index:100;height:var(--nav-height);justify-content:space-between;align-items:center;padding:0 24px;transition:background .3s,-webkit-backdrop-filter .3s,backdrop-filter .3s;display:flex;position:fixed;top:0;left:0;right:0}.navbar.scrolled{-webkit-backdrop-filter:var(--glass-blur);border-bottom:1px solid var(--glass-border);background:#0a0a0fcc}.navbar-logo{background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.3rem;font-weight:700}.navbar-links{align-items:center;gap:32px;display:flex}.navbar-link{color:var(--color-text-muted);cursor:pointer;font-size:.9rem;font-family:var(--font-sans);background:0 0;border:none;transition:color .3s}.navbar-link:hover,.navbar-link.active{color:var(--color-primary)}.navbar-hamburger{cursor:pointer;background:0 0;border:none;flex-direction:column;gap:5px;padding:4px;display:none}.navbar-hamburger span{background:var(--color-text);border-radius:2px;width:24px;height:2px;transition:transform .3s,opacity .3s}.navbar-hamburger.open span:first-child{transform:rotate(45deg)translate(5px,5px)}.navbar-hamburger.open span:nth-child(2){opacity:0}.navbar-hamburger.open span:nth-child(3){transform:rotate(-45deg)translate(5px,-5px)}.navbar-mobile-menu{top:var(--nav-height);-webkit-backdrop-filter:var(--glass-blur);border-bottom:1px solid var(--glass-border);z-index:99;background:#0a0a0ff2;flex-direction:column;gap:16px;padding:20px 24px;display:flex;position:fixed;left:0;right:0}.navbar-mobile-link{color:var(--color-text-muted);cursor:pointer;font-size:1.1rem;font-family:var(--font-sans);text-align:left;background:0 0;border:none;padding:8px 0;transition:color .3s}.navbar-mobile-link:hover,.navbar-mobile-link.active{color:var(--color-primary)}.hero{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:0 24px;display:flex;position:relative}.hero-title{background:linear-gradient(135deg, var(--color-primary) 0%, var(--color-secondary) 50%, var(--color-accent) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:24px;font-size:clamp(2.5rem,10vw,7rem);font-weight:800;line-height:1.1}.hero-subtitle{color:var(--color-text-muted);max-width:600px;margin-bottom:40px;font-size:clamp(1rem,2.5vw,1.4rem);line-height:1.6}.hero-cta{font-size:1rem;font-weight:600;font-family:var(--font-sans);color:#fff;background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));cursor:pointer;border:none;border-radius:50px;align-items:center;gap:8px;padding:16px 40px;transition:transform .3s,box-shadow .3s;display:inline-flex}.hero-cta:hover{transform:translateY(-2px);box-shadow:0 0 40px #00f0ff4d}.hero-scroll-indicator{color:var(--color-text-dim);flex-direction:column;align-items:center;gap:8px;font-size:.8rem;display:flex;position:absolute;bottom:40px;left:50%;transform:translate(-50%)}.hero-scroll-indicator .scroll-arrow{border-right:2px solid var(--color-text-dim);border-bottom:2px solid var(--color-text-dim);width:24px;height:24px;animation:2s ease-in-out infinite scrollBounce;transform:rotate(45deg)}@keyframes scrollBounce{0%,to{opacity:.4;transform:rotate(45deg)translate(0)}50%{opacity:1;transform:rotate(45deg)translate(4px,4px)}}.about-grid{grid-template-columns:1fr 1fr;align-items:center;gap:60px;display:grid}.about-text h3{margin-bottom:20px;font-size:clamp(1.5rem,3vw,2rem);font-weight:700}.about-text p{color:var(--color-text-muted);margin-bottom:32px;font-size:1.05rem;line-height:1.8}.about-stats{gap:40px;display:flex}.about-stat{text-align:center}.about-stat-number{background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:2.5rem;font-weight:800}.about-stat-label{color:var(--color-text-muted);margin-top:4px;font-size:.85rem}.about-visual{justify-content:center;align-items:center;min-height:300px;display:flex}.about-3d-box{border-radius:var(--radius-lg);background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));opacity:.15;width:200px;height:200px;animation:3s ease-in-out infinite boxPulse}@keyframes boxPulse{0%,to{opacity:.15;transform:scale(1)rotate(0)}50%{opacity:.25;transform:scale(1.1)rotate(5deg)}}.works-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:24px;display:grid}.project-card{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-md);cursor:default;transform-style:preserve-3d;will-change:transform;padding:32px;transition:border-color .3s,background .3s}.project-card:hover{border-color:var(--glass-border-hover);background:var(--glass-bg-hover)}.project-card-preview{border-radius:var(--radius-sm);justify-content:center;align-items:center;width:100%;height:180px;margin-bottom:20px;font-size:3rem;display:flex}.project-card h4{margin-bottom:8px;font-size:1.2rem;font-weight:600}.project-card p{color:var(--color-text-muted);margin-bottom:16px;font-size:.9rem;line-height:1.5}.project-tags{flex-wrap:wrap;gap:8px;display:flex}.project-tag{color:var(--color-primary);background:#00f0ff1a;border:1px solid #00f0ff33;border-radius:20px;padding:4px 12px;font-size:.8rem}.skills-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:20px;display:grid}.skill-item{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-md);flex-direction:column;align-items:center;gap:12px;padding:24px 16px;transition:transform .3s,border-color .3s;display:flex}.skill-item:hover{border-color:var(--color-primary);transform:translateY(-4px)}.skill-icon{font-size:2.2rem;line-height:1}.skill-name{color:var(--color-text-muted);font-size:.85rem;font-weight:500}.skill-bar{background:#ffffff1a;border-radius:2px;width:100%;height:4px;overflow:hidden}.skill-bar-fill{background:linear-gradient(90deg, var(--color-primary), var(--color-secondary));border-radius:2px;height:100%;transition:width .8s}.contact-content{text-align:center;max-width:600px;margin:0 auto}.contact-content h2{background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:20px;font-size:clamp(2rem,5vw,3.5rem);font-weight:700}.contact-content p{color:var(--color-text-muted);margin-bottom:40px;font-size:1.1rem;line-height:1.6}.contact-links{flex-wrap:wrap;justify-content:center;gap:24px;display:flex}.contact-link{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-sm);color:var(--color-text-muted);align-items:center;gap:8px;padding:12px 24px;font-size:.95rem;transition:all .3s;display:flex}.contact-link:hover{color:var(--color-primary);border-color:var(--color-primary);transform:translateY(-2px)}.footer{text-align:center;border-top:1px solid var(--glass-border);background:#0a0a0fcc;padding:40px 24px}.footer p{color:var(--color-text-dim);font-size:.85rem}.footer-tech{color:var(--color-text-dim);margin-top:8px;font-size:.8rem}@media (width<=768px){.navbar-links{display:none}.navbar-hamburger{display:flex}.about-grid{grid-template-columns:1fr;gap:40px}.about-stats{gap:24px}.about-stat-number{font-size:1.8rem}.works-grid{grid-template-columns:1fr}.skills-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:12px}.contact-links{flex-direction:column;align-items:center}.section{padding:60px 16px}}@media (width<=480px){.skills-grid{grid-template-columns:repeat(2,1fr)}}