.hero-background{z-index:-1;--mouse-x:.5;--mouse-y:.5;width:100%;height:100%;transform-style:preserve-3d;perspective:1000px;will-change:transform;transform:rotateX(calc((var(--mouse-y) - .5) * -3deg)) rotateY(calc((var(--mouse-x) - .5) * 3deg));backface-visibility:hidden;position:absolute;inset:0;overflow:hidden}.gradient-bg{background:radial-gradient(circle at calc(var(--mouse-x) * 100%) calc(var(--mouse-y) * 100%), #00f0ff26, #ff2a6d1a, #0a0a0a00);opacity:.7;z-index:-1;width:100%;height:100%;position:absolute}[data-theme=light] .gradient-bg{background:radial-gradient(circle at calc(var(--mouse-x) * 100%) calc(var(--mouse-y) * 100%), #0095a826, #d1045d1a, #e8e9ed00)}.grid-container{z-index:-1;width:100%;height:100%;position:absolute}.grid-line{background-color:#00f0ff12;transition:opacity .3s;position:absolute}.grid-line.horizontal{width:100%;height:1px}.grid-line.vertical{width:1px;height:100%}[data-theme=light] .grid-line{background-color:#d1045d12}.particle{background-color:var(--cyber-blue);box-shadow:0 0 5px var(--cyber-blue), 0 0 10px var(--cyber-blue);opacity:.6;pointer-events:none;border-radius:50%;position:absolute}[data-theme=light] .particle{background-color:var(--cyber-pink);box-shadow:0 0 5px var(--cyber-pink), 0 0 10px var(--cyber-pink)}.circuit-lines{z-index:-1;width:100%;height:100%;position:absolute}.circuit-lines path{stroke:var(--cyber-blue);stroke-width:.3px;stroke-dasharray:5 3;opacity:.3}[data-theme=light] .circuit-lines path{stroke:var(--cyber-pink)}@media (max-width:768px){.hero-background{transform:none}.grid-line:nth-child(odd){opacity:.3}.grid-line:nth-child(2n){opacity:.15}}
.mobile-menu-toggle{z-index:1500;cursor:pointer;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#0a0a0fcc;border:none;border-radius:5px;width:48px;height:48px;padding:12px;display:none;position:fixed;top:20px;left:20px}[data-theme=light] .mobile-menu-toggle{background:#dcdce6cc}.hamburger-container{width:100%;height:100%;position:relative}.hamburger-lines{flex-direction:column;justify-content:space-between;width:100%;height:100%;display:flex;position:relative}.line{background:var(--cyber-blue);border-radius:10px;width:100%;height:2px;transition:transform .3s,opacity .2s;display:block;position:relative}[data-theme=light] .line{background:var(--cyber-pink)}.hamburger-lines.active .line1{transform:translateY(9px)rotate(45deg)}.hamburger-lines.active .line2{opacity:0}.hamburger-lines.active .line3{transform:translateY(-9px)rotate(-45deg)}.mobile-menu-toggle:hover .line{box-shadow:0 0 5px var(--cyber-blue), 0 0 10px var(--cyber-blue)}[data-theme=light] .mobile-menu-toggle:hover .line{box-shadow:0 0 5px var(--cyber-pink), 0 0 8px var(--cyber-pink)}.circuit-decoration{pointer-events:none;height:100%;position:absolute;top:0;right:0}.circuit-line{background:var(--cyber-blue);opacity:.5;height:2px;position:absolute}[data-theme=light] .circuit-line{background:var(--cyber-pink)}.mobile-nav-menu{z-index:1400;pointer-events:none;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100vh;display:flex;position:fixed;top:0;left:0}.mobile-nav-backdrop{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:auto;background-color:#00000a99;width:100%;height:100%;position:absolute;top:0;left:0}[data-theme=light] .mobile-nav-backdrop{background-color:#dcdce699}.mobile-nav-content{pointer-events:auto;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;padding:40px 20px;display:flex;position:relative}[data-theme=light] .mobile-nav-content{box-shadow:0 0 15px #f2056f26}.mobile-nav-content:before,.mobile-nav-content:after{content:"";background:linear-gradient(to right, transparent 0%, var(--cyber-blue) 25%, var(--cyber-pink) 50%, var(--cyber-blue) 75%, transparent 100%);opacity:.7;width:60%;height:1px;position:absolute}.mobile-nav-content:before{top:15%;left:20%}.mobile-nav-content:after{bottom:15%;right:20%}[data-theme=light] .mobile-nav-content:after{background:linear-gradient(to bottom, transparent 0%, var(--cyber-pink) 20%, var(--cyber-blue) 50%, var(--cyber-pink) 80%, transparent 100%)}.mobile-nav-links{flex-direction:column;align-items:center;gap:2rem;width:100%;max-width:400px;padding:0 20px;display:flex}.mobile-nav-link{color:var(--foreground);font-family:var(--font-orbitron);letter-spacing:2px;text-transform:uppercase;text-align:center;flex-direction:column;align-items:center;width:100%;padding:15px 0;font-size:22px;text-decoration:none;transition:all .3s;display:flex;position:relative}.mobile-nav-link:hover,.mobile-nav-link:focus,.mobile-nav-link.active{color:var(--cyber-blue)}[data-theme=light] .mobile-nav-link:hover,[data-theme=light] .mobile-nav-link:focus,[data-theme=light] .mobile-nav-link.active{color:var(--cyber-pink)}.nav-line{background:var(--cyber-blue);width:0;height:2px;box-shadow:0 0 5px var(--cyber-blue);margin-top:8px;transition:width .5s}[data-theme=light] .nav-line{background:var(--cyber-pink)}.mobile-nav-link:hover .nav-line,.mobile-nav-link:focus .nav-line,.mobile-nav-link.active .nav-line{width:100%;box-shadow:0 0 5px var(--cyber-blue)}[data-theme=light] .mobile-nav-link:hover .nav-line,[data-theme=light] .mobile-nav-link:focus .nav-line,[data-theme=light] .mobile-nav-link.active .nav-line{box-shadow:0 0 5px var(--cyber-pink)}@media (max-width:768px){.vertical-nav{display:none}.mobile-menu-toggle{justify-content:center;align-items:center;display:flex}.main-content{width:100%;margin-left:0}}
.project-card{grid-template-columns:1fr 1fr;gap:2rem;min-height:400px;margin-bottom:6rem;display:grid;position:relative}.project-card:nth-child(2n){direction:rtl;grid-template-columns:1fr 1fr}.project-card:nth-child(2n) .project-content,.project-card:nth-child(2n) .project-image{direction:ltr}.project-number{font-family:var(--font-orbitron);color:var(--cyber-blue);align-items:center;margin-bottom:1rem;font-size:.9rem;display:flex}.project-number:before{content:"";background:var(--cyber-blue);width:3rem;height:1px;margin-right:1rem;display:inline-block}[data-theme=light] .project-number{color:var(--cyber-pink)}[data-theme=light] .project-number:before{background:var(--cyber-pink)}.project-content{z-index:10;flex-direction:column;justify-content:center;display:flex}.project-title{font-family:var(--font-orbitron);margin-bottom:1.5rem;font-size:2.5rem;line-height:1.2}.project-description{color:var(--secondary);max-width:90%;margin-bottom:2rem}.project-image{justify-content:center;align-items:center;height:100%;display:flex;position:relative;overflow:visible}.project-screenshot-container{width:100%;height:100%;position:relative;overflow:hidden}.project-screenshot{border-radius:2px;overflow:hidden;object-fit:cover!important;object-position:center top!important}.device-mockup{transform-style:preserve-3d;perspective:1000px;z-index:10;will-change:transform;width:90%;transition:transform .3s;position:relative;overflow:hidden}.device-mockup:hover{transform:translateY(-10px)rotateX(5deg)}.device-mockup.laptop{aspect-ratio:16/10;background:#2a2a2e;border-radius:12px 12px 2px 2px;width:90%;padding:10px 10px 40px;box-shadow:0 10px 30px #0006,inset 0 0 0 1px #ffffff1a}.device-mockup.laptop:after{content:"";background:#222;border-radius:0 0 10px 10px;width:120%;height:20px;position:absolute;bottom:-20px;left:-10%;transform:perspective(500px)rotateX(5deg);box-shadow:0 5px 15px #0000004d}.device-mockup.phone{aspect-ratio:9/16;background:#2a2a2e;border-radius:30px;width:60%;padding:15px 8px;box-shadow:0 10px 30px #0006,inset 0 0 0 1px #ffffff1a}.device-mockup.phone:before{content:"";z-index:20;background:#000;border-radius:10px;width:50px;height:5px;position:absolute;top:15px;left:50%;transform:translate(-50%)}.device-mockup.tablet{aspect-ratio:4/3;background:#2a2a2e;border-radius:15px;width:75%;padding:15px;box-shadow:0 10px 30px #0006,inset 0 0 0 1px #ffffff1a}.device-screen{background:#0a0a0a;border-radius:3px;width:100%;height:100%;position:relative;overflow:hidden}.device-mockup.phone .device-screen{border-radius:20px}.project-screenshot{border-radius:3px;transition:transform .5s}.device-mockup:hover .project-screenshot{transform:scale(1.05)}.device-reflection{pointer-events:none;z-index:10;background:linear-gradient(135deg,#ffffff1a 0%,#fff0 40%);position:absolute;inset:0}[data-theme=light] .device-mockup{background:#3a3a3e}[data-theme=light] .device-mockup.laptop:after{background:#333}[data-theme=light] .device-mockup .device-screen{background:#1a1a1a}.view-project-btn{font-family:var(--font-orbitron);color:var(--cyber-blue);border:1px solid var(--cyber-blue);cursor:pointer;background:0 0;border-radius:4px;align-items:center;padding:.75rem 1.5rem;transition:all .3s;display:inline-flex;position:relative;overflow:hidden}.view-project-btn span{z-index:10;align-items:center;gap:.5rem;display:flex;position:relative}.view-project-btn svg{transition:transform .3s}.view-project-btn:hover svg{transform:translate(5px)}.view-project-btn:before{content:"";background:var(--cyber-blue);z-index:1;width:100%;height:100%;transition:all .3s;position:absolute;top:0;left:-100%}.view-project-btn:hover{color:var(--background)}.view-project-btn:hover:before{left:0}[data-theme=light] .view-project-btn{color:var(--cyber-pink);border-color:var(--cyber-pink)}[data-theme=light] .view-project-btn:before{background:var(--cyber-pink)}.chinese-symbol{opacity:.15;pointer-events:none;font-family:serif;position:absolute}@media (max-width:1024px){.project-card,.project-card:nth-child(2n){direction:ltr;grid-template-columns:1fr}.project-image{height:300px}.project-title{font-size:2rem}}