:root{--bg-color: #0a0a0a;--bg-secondary: #111111;--text-primary: #ffffff;--text-secondary: #a0a0a0;--accent-primary: #00ff88;--accent-secondary: #00d2ff;--gradient-main: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));--card-bg: rgba(255, 255, 255, .05);--border-color: rgba(255, 255, 255, .1);--font-main: "Inter", sans-serif;--font-code: "Fira Code", monospace;--nav-height: 80px;--transition: all .3s cubic-bezier(.4, 0, .2, 1)}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;font-size:16px}body{background-color:var(--bg-color);color:var(--text-primary);font-family:var(--font-main);line-height:1.6;overflow-x:hidden}#bg-canvas{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;opacity:.6}h1,h2,h3,h4,h5,h6{line-height:1.2;font-weight:700}a{text-decoration:none;color:inherit;transition:var(--transition)}ul{list-style:none}.container{max-width:1200px;margin:0 auto;padding:0 20px}.section{padding:100px 0}.section-title{font-size:2.5rem;margin-bottom:60px;text-align:center;background:var(--gradient-main);-webkit-background-clip:text;-webkit-text-fill-color:transparent;position:relative;display:block;width:fit-content;margin-left:auto;margin-right:auto}.section-title:after{content:"";position:absolute;bottom:-10px;left:50%;transform:translate(-50%);width:60px;height:4px;background:var(--gradient-main);border-radius:2px}.bg-darker{background-color:var(--bg-secondary)}.btn{padding:12px 30px;border-radius:30px;font-weight:600;cursor:pointer;display:inline-block;transition:var(--transition)}.btn-primary{background:var(--gradient-main);color:var(--bg-color)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 5px 15px #00ff884d}.btn-outline{border:2px solid var(--accent-primary);color:var(--accent-primary);margin-right:15px}.btn-outline:hover{background:#00ff881a}.btn-filled{background:var(--accent-primary);color:var(--bg-color);border:2px solid var(--accent-primary)}.btn-filled:hover{background:transparent;color:var(--accent-primary)}.navbar{height:var(--nav-height);display:flex;align-items:center;position:fixed;top:0;width:100%;z-index:1000;background:#0a0a0acc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border-color)}.navbar .container{display:flex;justify-content:space-between;align-items:center;width:100%}.logo{font-family:var(--font-code);font-size:1.5rem;font-weight:700;color:var(--accent-primary)}.nav-links{display:flex;align-items:center;gap:30px}.nav-links a{font-size:.95rem;color:var(--text-secondary)}.nav-links a:hover,.nav-links a.active{color:var(--accent-primary)}.menu-toggle{display:none;font-size:1.5rem;cursor:pointer}.hero{height:100vh;display:flex;align-items:center;justify-content:center;position:relative;padding-top:var(--nav-height)}.hero-content{text-align:center;z-index:1}.hero h1{font-size:5rem;margin-bottom:20px;letter-spacing:-2px}.hero .subtitle{font-size:2rem;color:var(--text-secondary);margin-bottom:30px;font-weight:300}.hero .highlight{color:var(--accent-primary);font-weight:600}.hero-desc{font-size:1.2rem;color:var(--text-secondary);margin-bottom:40px;max-width:600px;margin-left:auto;margin-right:auto}.scroll-down{position:absolute;bottom:30px;left:50%;transform:translate(-50%);animation:bounce 2s infinite;color:var(--text-secondary);font-size:1.5rem}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0) translate(-50%)}40%{transform:translateY(-10px) translate(-50%)}60%{transform:translateY(-5px) translate(-50%)}}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.about-text p{margin-bottom:20px;color:var(--text-secondary);font-size:1.1rem}.about-text strong{color:var(--text-primary)}.stats{display:flex;gap:40px;margin-top:40px}.stat-item{display:flex;flex-direction:column}.stat-num{font-size:2.5rem;font-weight:700;color:var(--accent-secondary)}.stat-label{font-size:.9rem;color:var(--text-secondary)}.code-card{background:#1e1e1e;border-radius:10px;padding:20px;box-shadow:0 20px 50px #00000080;border:1px solid var(--border-color)}.card-header{display:flex;gap:8px;margin-bottom:15px}.dot{width:12px;height:12px;border-radius:50%}.dot.red{background:#ff5f56}.dot.yellow{background:#ffbd2e}.dot.green{background:#27c93f}.code-card pre{margin:0;overflow-x:auto}.code-card code{font-family:var(--font-code);font-size:.9rem;color:#d4d4d4}.skills-wrapper{display:grid;grid-template-columns:1fr 1fr;gap:60px}.skill-category h3{margin-bottom:30px;font-size:1.5rem;display:flex;align-items:center;gap:10px}.skill-bar{margin-bottom:25px}.skill-bar .info{display:flex;justify-content:space-between;margin-bottom:8px;font-weight:500}.progress-bar{height:8px;background:var(--bg-secondary);border-radius:4px;overflow:hidden;background:#ffffff1a}.progress{height:100%;border-radius:4px;background:var(--gradient-main);width:0;transition:width 1.5s ease-out}.tags{display:flex;flex-wrap:wrap;gap:15px}.tag{background:#ffffff0d;padding:8px 16px;border-radius:20px;font-size:.9rem;color:var(--text-secondary);border:1px solid var(--border-color);transition:var(--transition)}.tag:hover{border-color:var(--accent-primary);color:var(--accent-primary);transform:translateY(-2px)}.project-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px}.project-card{background:var(--card-bg);border-radius:15px;overflow:hidden;border:1px solid var(--border-color);transition:var(--transition);position:relative;group:hover}.project-card:hover{transform:translateY(-10px);box-shadow:0 20px 40px #0006;border-color:var(--accent-primary)}.project-image{height:200px;display:flex;align-items:center;justify-content:center;color:#fff3}.project-content{padding:25px}.project-content h3{margin-bottom:10px;color:var(--text-primary)}.project-content p{color:var(--text-secondary);font-size:.95rem;margin-bottom:20px}.tech-stack{display:flex;gap:10px;margin-bottom:20px;font-size:.85rem}.tech-stack span{color:var(--accent-secondary)}.project-links a{margin-right:15px;color:var(--text-primary)}.project-links a:hover{color:var(--accent-primary)}.code-window{background:#1e1e1e;border-radius:8px;box-shadow:0 20px 60px #00000080;border:1px solid #333;max-width:900px;margin:0 auto}.window-bar{background:#252526;padding:10px 15px;display:flex;align-items:center;border-bottom:1px solid #333;border-radius:8px 8px 0 0}.window-bar .buttons{display:flex;gap:8px}.window-bar .buttons div{width:12px;height:12px;border-radius:50%}.window-bar .buttons .close{background:#ff5f56}.window-bar .buttons .minimize{background:#ffbd2e}.window-bar .buttons .maximize{background:#27c93f}.window-bar .title{margin-left:20px;color:#858585;font-size:.9rem;font-family:var(--font-main)}.window-content{padding:20px;overflow-x:auto}.keyword{color:#569cd6}.function{color:#dcdcaa}.string{color:#ce9178}.comment{color:#6a9955}.class-name,.builtin{color:#4ec9b0}.boolean{color:#569cd6}.contact-container{text-align:center;max-width:800px}.contact-desc{color:var(--text-secondary);margin-bottom:50px}.contact-content{background:var(--card-bg);padding:50px;border-radius:20px;border:1px solid var(--border-color)}.contact-form{display:flex;flex-direction:column;gap:20px;margin-bottom:40px}.form-group input,.form-group textarea{width:100%;padding:15px;background:#ffffff0d;border:1px solid var(--border-color);border-radius:8px;color:var(--text-primary);font-family:var(--font-main);transition:var(--transition)}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--accent-primary);background:#ffffff1a}.social-links{display:flex;justify-content:center;gap:30px}.social-icon{font-size:1.5rem;color:var(--text-secondary);transition:var(--transition)}.social-icon:hover{color:var(--accent-primary);transform:translateY(-3px)}footer{padding:40px 0;text-align:center;border-top:1px solid var(--border-color);color:var(--text-secondary);font-size:.9rem}.tech-credit i{color:#ff5f56}.disclaimer{margin-top:12px;font-size:.85rem;color:#ffffffa6;line-height:1.5}@media (max-width: 768px){.section-title{font-size:2rem}.hero h1{font-size:3rem}.hero .subtitle{font-size:1.5rem}.about-grid,.skills-wrapper{grid-template-columns:1fr}.nav-links{display:none;position:absolute;top:var(--nav-height);left:0;width:100%;background:var(--bg-secondary);flex-direction:column;padding:20px 0;border-bottom:1px solid var(--border-color)}.nav-links.active{display:flex}.menu-toggle{display:block}}
