:root{--white: #ffffff;--soft-white: #f5f5f5;--bg-black: #000000;--glass-bg-light: rgba(255,255,255,.03);--glass-bg-medium: rgba(255,255,255,.05);--glass-bg-strong: rgba(255,255,255,.08);--glass-border-light: rgba(255,255,255,.08);--glass-border-medium: rgba(255,255,255,.15);--glass-border-strong: rgba(255,255,255,.3);--blur-sm: blur(6px);--blur-md: blur(12px);--transition: all .3s ease}body{margin:0;padding:0;background-color:var(--bg-black);color:var(--white);font-family:Inter,sans-serif;min-height:100vh;display:flex;flex-direction:column;overflow:hidden}canvas{pointer-events:none}.glass{background:var(--glass-bg-medium);border:1px solid var(--glass-border-light);-webkit-backdrop-filter:var(--blur-md);backdrop-filter:var(--blur-md)}.hover-scale{transition:var(--transition)}.hover-scale:hover{transform:scale(1.05)}.center-flex{display:flex;justify-content:center;align-items:center}.hero-text{position:absolute;top:50%;left:50%;transform:translate(-50%,calc(-50% + 40px));opacity:0;text-align:center;transition:opacity .8s ease-out,transform .8s ease-out;z-index:10}.hero-text.show{transform:translate(-50%,-50%);opacity:1}.hero-text h1{font-size:4.5rem;margin:0;text-shadow:0 0 10px rgba(255,255,255,.3)}.hero-text p{font-size:1rem;opacity:.8}.hero-text p:first-of-type{font-size:1.1rem;font-weight:600;margin-bottom:0;opacity:1}.buttons{margin-top:2rem;display:flex;justify-content:center;gap:.5rem}.buttons--left{justify-content:flex-start}.hire-button,.email-button{font-size:1rem;padding:.7rem 1.3rem;border-radius:.7rem;font-weight:500;cursor:pointer;transition:var(--transition);text-decoration:none}.hire-button{background-color:var(--soft-white);color:#000;border:none}.email-button{background:transparent;color:var(--white);border:1.3px solid var(--white);display:inline-block}.hire-button:hover,.email-button:hover{transform:scale(1.05);box-shadow:0 0 15px #fff6}.nav{position:fixed;bottom:15px;left:50%;transform:translate(-50%);z-index:10}.nav ul{display:flex;gap:2rem;list-style:none;padding:1rem 2rem;border-radius:1rem;background:var(--glass-bg-strong);border:1px solid var(--glass-border-strong);-webkit-backdrop-filter:var(--blur-sm);backdrop-filter:var(--blur-sm)}.nav ul li{opacity:.7;font-size:.8rem;text-align:center;cursor:pointer;transition:var(--transition)}.nav ul li:hover{opacity:1;transform:scale(1.1)}.nav ul li a{text-decoration:none;color:var(--soft-white);display:flex;flex-direction:column;align-items:center}.nav ul li a i{font-size:1.2rem;margin-bottom:.4rem}.hero-skills{position:absolute;width:100%;display:flex;background:transparent}.left{width:50%;height:100vh;display:flex;align-items:center}.left-details{margin-left:8rem}.left-details h1{font-size:3rem;margin-bottom:0;text-shadow:0 0 10px rgba(255,255,255,.3)}.left-details p{font-size:.9rem;margin-top:.5rem;opacity:.5}.left-details h2{opacity:.6}.left-tools{margin-top:2.5rem}.left-tools h2{font-size:1.3rem;display:flex;align-items:center;gap:5px;width:fit-content;cursor:pointer;transition:var(--transition)}.left-tools h2:before{content:"➤";font-size:.7rem}.left-tools h2:hover{opacity:1}.left-tools h2.active{opacity:1;transform:scale(1.1)}.right-details{width:50%;height:100vh;display:flex;flex-direction:column;align-items:center;overflow-y:auto;justify-content:flex-start;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none}.right-details::-webkit-scrollbar{display:none}.right-details>*:first-child{margin-top:4rem}.right-box{width:360px;margin:1rem;border-radius:1.2rem;background:var(--glass-bg-light);border:1px solid var(--glass-border-medium);-webkit-backdrop-filter:var(--blur-md);backdrop-filter:var(--blur-md);transition:var(--transition)}.right-box h1{text-align:center;font-size:1.4rem;font-weight:500;margin-bottom:1.5rem;opacity:.9}.right-box.active{border:1px solid #00f5c4;box-shadow:0 0 5px #00f5c480;transform:scale(1.02)}.right-tools{margin:1rem;display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;width:fit-content}.tool{width:4.9rem;padding:1.2rem .5rem;border-radius:.9rem;background:var(--glass-bg-medium);border:1px solid var(--glass-border-light);display:flex;flex-direction:column;align-items:center;cursor:pointer;transition:var(--transition)}.tool:hover{transform:translateY(-5px);background:#ffffff17;border-color:#ffffff40}.tool i,.tool svg{margin-bottom:.6rem}.tool i{font-size:2.3rem}.tool svg{width:2.4rem;height:2.4rem;transform:translate(-2px)}.tool h2{font-size:.85rem;font-weight:400;opacity:.7;margin:0;text-align:center;white-space:nowrap}.about{position:absolute;top:0;left:50%;transform:translate(-50%);width:100%;max-width:900px;padding:7rem 2rem 10rem;z-index:2}h1{font-size:3.5rem;font-weight:800;letter-spacing:-1px;margin-bottom:1rem}.terminal-line{font-size:.95rem;opacity:.6;margin-top:.5rem}.terminal-line:before{content:"> ";opacity:.4}.section{background:var(--glass-bg-light);border:1px solid var(--glass-border-light);-webkit-backdrop-filter:var(--blur-sm);backdrop-filter:var(--blur-sm);padding:2rem;margin-bottom:2rem;transition:var(--transition);border-radius:1rem;width:46%}.section:hover{background:var(--glass-bg-medium);border:1px solid var(--glass-border-medium);transform:translateY(-4px)}.section.active{border:1px solid #00f5c4;box-shadow:0 0 5px #00f5c480;transform:scale(1.02)}.section h2{font-size:.85rem;text-transform:uppercase;letter-spacing:1px;margin-bottom:1rem;opacity:.5}.section p{font-size:1rem;line-height:1.8;color:var(--soft-white)}.highlight{font-weight:600;color:var(--white)}.footer-note{margin-top:4rem;font-family:JetBrains Mono,monospace;font-size:.85rem;opacity:.4}.left,.right-details{opacity:0;transition:all .9s cubic-bezier(.22,1,.36,1)}.left{transform:translate(-80px)}.right-details{transform:translate(80px)}.hero-skills.show .left{opacity:1;transform:translate(0);transition-delay:.1s}.hero-skills.show .right-details{opacity:1;transform:translate(0);transition-delay:.5s}@media(max-width:768px){body{overflow:scroll}.left-tools{display:none}.hero-skills{flex-direction:column;position:relative}.left{width:100%;height:auto;justify-content:center;padding-top:6rem;transform:none!important;opacity:1!important}.left-details{margin-left:0;text-align:center;padding:0 1.5rem}.right-details{width:100%;height:auto;overflow:visible;align-items:center;transform:none!important;opacity:1!important;margin-bottom:7rem}.section{width:75%;margin:1rem auto}.right-details>*:first-child{margin-top:2rem}.hero-text h1{font-size:3.5rem}.hero-text p{font-size:.8rem}.nav ul{background:#ffffff14;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}}
