@import "https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&family=Fira+Code:wght@400;500&display=swap";
:root{--bg:#0a0a0a;--bg2:#111;--bg3:#1a1a1a;--green1:#0f8;--green2:#0c6;--green3:#094;--text:#f0f0f0;--muted:#888;--border:#222;--radius:12px}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text);font-family:Space Grotesk,sans-serif;line-height:1.6;overflow-x:hidden}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--green3);border-radius:4px}a{color:inherit}nav.navbar{z-index:100;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);background:#0a0a0ae0;justify-content:space-between;align-items:center;padding:18px 5%;display:flex;position:fixed;top:0;left:0;right:0}.nav-logo{color:var(--green1);font-family:Fira Code,monospace;font-size:1.1rem;text-decoration:none}.nav-logo span{color:var(--text)}.nav-links{gap:28px;list-style:none;display:flex}.nav-links a{color:var(--muted);letter-spacing:.3px;font-size:.9rem;font-weight:500;text-decoration:none;transition:color .25s}.nav-links a.active,.nav-links a:hover{color:var(--green1)}.nav-cta{background:linear-gradient(135deg,var(--green1),var(--green2));color:#000;cursor:pointer;border:none;border-radius:8px;padding:8px 22px;font-family:Space Grotesk,sans-serif;font-size:.88rem;font-weight:700;text-decoration:none;transition:opacity .25s}.nav-cta:hover{opacity:.85}.hamburger{cursor:pointer;background:0 0;border:none;flex-direction:column;gap:5px;display:none}.hamburger span{background:var(--text);width:24px;height:2px;transition:all .3s;display:block}.mobile-menu{background:var(--bg2);border-bottom:1px solid var(--border);z-index:99;padding:1.5rem 5%;display:none;position:fixed;top:68px;left:0;right:0}.mobile-menu.open{display:block}.mobile-menu a{color:var(--muted);border-bottom:1px solid var(--border);padding:12px 0;font-size:1rem;text-decoration:none;display:block}.mobile-menu a:hover{color:var(--green1)}#hero{align-items:center;min-height:100vh;padding:140px 5% 60px;display:flex;position:relative;overflow:hidden}.hero-bg{pointer-events:none;background:radial-gradient(at 20%,#00ff880f 0%,#0000 60%),radial-gradient(at 80% 20%,#00cc660a 0%,#0000 50%);position:absolute;inset:0}.hero-grid{pointer-events:none;background-image:linear-gradient(#00ff8808 1px,#0000 1px),linear-gradient(90deg,#00ff8808 1px,#0000 1px);background-size:60px 60px;position:absolute;inset:0}.hero-content{z-index:1;max-width:700px;position:relative}.hero-eyebrow{color:var(--green1);opacity:0;margin-bottom:1.2rem;font-family:Fira Code,monospace;font-size:.85rem;animation:.6s .2s forwards fadeUp}.hero-eyebrow span{color:var(--muted)}.hero-title{opacity:0;margin-bottom:1.4rem;font-size:clamp(2.4rem,6vw,4.2rem);font-weight:700;line-height:1.1;animation:.6s .4s forwards fadeUp}.hero-title .name{color:var(--text)}.hero-title .role{background:linear-gradient(135deg,var(--green1),var(--green2));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;min-height:1.15em;display:block}.cursor{background:var(--green1);vertical-align:middle;width:3px;height:.9em;margin-left:2px;animation:1s infinite blink;display:inline-block}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.hero-desc{color:var(--muted);opacity:0;max-width:520px;margin-bottom:2.4rem;font-size:1.05rem;line-height:1.75;animation:.6s .6s forwards fadeUp}.hero-btns{opacity:0;flex-wrap:wrap;gap:14px;animation:.6s .8s forwards fadeUp;display:flex}.btn-primary{background:linear-gradient(135deg,var(--green1),var(--green2));color:#000;cursor:pointer;border:none;border-radius:10px;padding:13px 30px;font-family:Space Grotesk,sans-serif;font-size:.95rem;font-weight:700;text-decoration:none;transition:transform .2s,box-shadow .2s;display:inline-block}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 28px #00ff8840}.btn-outline{border:1.5px solid var(--border);color:var(--text);border-radius:10px;padding:13px 30px;font-size:.95rem;text-decoration:none;transition:all .2s;display:inline-block}.btn-outline:hover{border-color:var(--green1);color:var(--green1)}.hero-stats{opacity:0;flex-wrap:wrap;gap:40px;margin-top:3.5rem;animation:.6s 1s forwards fadeUp;display:flex}.stat-item .stat-num{color:var(--green1);font-family:Fira Code,monospace;font-size:2rem;font-weight:700}.stat-item .stat-label{color:var(--muted);margin-top:2px;font-size:.8rem}.page-header{text-align:left;padding:160px 5% 60px;position:relative;overflow:hidden}.page-header .hero-bg{opacity:.7}section{padding:100px 5%}.section-label{color:var(--green1);letter-spacing:2px;text-transform:uppercase;margin-bottom:.8rem;font-family:Fira Code,monospace;font-size:.8rem}.section-title{margin-bottom:1rem;font-size:clamp(1.8rem,4vw,2.6rem);font-weight:700}.section-sub{color:var(--muted);max-width:520px;margin-bottom:3.5rem;line-height:1.7}.divider{background:linear-gradient(90deg,var(--green1),var(--green2));border-radius:3px;width:48px;height:3px;margin-bottom:3rem}.about-section{background:var(--bg2)}.about-grid{grid-template-columns:1fr 1fr;align-items:center;gap:60px;display:grid}.about-img-wrap{position:relative}.about-avatar{aspect-ratio:1;background:var(--bg3);border:1px solid var(--border);border-radius:20px;justify-content:center;align-items:center;width:100%;max-width:340px;font-size:6rem;display:flex;position:relative;overflow:hidden}.about-avatar:before{content:"";pointer-events:none;background:linear-gradient(135deg,#00ff8814,#0000);position:absolute;inset:0}.about-badge{background:linear-gradient(135deg,var(--green1),var(--green2));color:#000;border-radius:12px;padding:12px 20px;font-family:Fira Code,monospace;font-size:.85rem;font-weight:700;position:absolute;bottom:-16px;right:-16px}.about-text h3{margin-bottom:1rem;font-size:1.5rem;font-weight:700}.about-text p{color:var(--muted);margin-bottom:1.2rem;line-height:1.8}.edu-card{background:var(--bg3);border:1px solid var(--border);border-left:3px solid var(--green1);border-radius:12px;margin-top:1.5rem;padding:1.2rem 1.4rem}.edu-card h4{margin-bottom:.3rem;font-size:.95rem;font-weight:600}.edu-card p{color:var(--muted);margin:0;font-size:.85rem}.skills-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:14px;display:grid}.skill-card{background:var(--bg2);border:1px solid var(--border);text-align:center;cursor:default;border-radius:12px;padding:1.4rem 1rem;transition:all .3s}.skill-card:hover{border-color:var(--green1);transform:translateY(-4px);box-shadow:0 8px 24px #00ff881a}.skill-icon{margin-bottom:.7rem;font-size:2rem}.skill-name{color:var(--text);font-size:.88rem;font-weight:600}.skill-level{color:var(--green1);margin-top:.2rem;font-family:Fira Code,monospace;font-size:.75rem}.projects-section{background:var(--bg2)}.projects-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:22px;display:grid}.project-card{background:var(--bg3);border:1px solid var(--border);border-radius:16px;padding:1.8rem;transition:all .3s;position:relative;overflow:hidden}.project-card:before{content:"";background:linear-gradient(90deg,var(--green1),var(--green2));transform-origin:0;height:3px;transition:transform .3s;position:absolute;top:0;left:0;right:0;transform:scaleX(0)}.project-card:hover:before{transform:scaleX(1)}.project-card:hover{border-color:#0f83;transform:translateY(-4px);box-shadow:0 12px 32px #0006}.project-badge{color:var(--green1);background:#00ff881a;border:1px solid #0f83;border-radius:20px;margin-bottom:1rem;padding:3px 10px;font-family:Fira Code,monospace;font-size:.72rem;font-weight:600;display:inline-block}.project-card h3{margin-bottom:.7rem;font-size:1.15rem;font-weight:700}.project-card p{color:var(--muted);margin-bottom:1.2rem;font-size:.9rem;line-height:1.7}.project-tags{flex-wrap:wrap;gap:6px;margin-bottom:1.4rem;display:flex}.tag{background:var(--bg2);border:1px solid var(--border);color:var(--muted);border-radius:6px;padding:3px 10px;font-family:Fira Code,monospace;font-size:.75rem}.project-links{gap:10px;display:flex}.proj-link{color:var(--green1);align-items:center;gap:4px;font-size:.82rem;font-weight:600;text-decoration:none;transition:opacity .2s;display:flex}.proj-link:hover{opacity:.7}.resume-grid{grid-template-columns:1fr 1fr;gap:40px;display:grid}.resume-col h3{color:var(--green1);align-items:center;gap:8px;margin-bottom:1.4rem;font-family:Fira Code,monospace;font-size:1.1rem;font-weight:600;display:flex}.timeline{padding-left:20px;position:relative}.timeline:before{content:"";background:var(--border);width:1px;position:absolute;top:8px;bottom:8px;left:0}.timeline-item{margin-bottom:1.8rem;position:relative}.timeline-item:before{content:"";background:var(--green1);border-radius:50%;width:8px;height:8px;position:absolute;top:6px;left:-24px}.timeline-item h4{margin-bottom:.2rem;font-size:.95rem;font-weight:600}.timeline-item .tl-date{color:var(--green1);margin-bottom:.4rem;font-family:Fira Code,monospace;font-size:.78rem}.timeline-item p{color:var(--muted);font-size:.85rem;line-height:1.7}.resume-download{text-align:center;margin-top:2.5rem}.contact-section{background:var(--bg2)}.contact-inner{max-width:680px}.contact-cards{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;margin-bottom:3rem;display:grid}.contact-card{background:var(--bg3);border:1px solid var(--border);text-align:center;border-radius:12px;padding:1.4rem;text-decoration:none;transition:all .3s;display:block}.contact-card:hover{border-color:var(--green1);transform:translateY(-3px)}.contact-card .cc-icon{margin-bottom:.6rem;font-size:1.8rem}.contact-card .cc-label{color:var(--muted);margin-bottom:.3rem;font-family:Fira Code,monospace;font-size:.78rem}.contact-card .cc-value{color:var(--text);font-size:.88rem;font-weight:500}.contact-form{flex-direction:column;gap:14px;display:flex}.form-row{grid-template-columns:1fr 1fr;gap:14px;display:grid}.form-group{flex-direction:column;gap:6px;display:flex}.form-group label{color:var(--muted);font-family:Fira Code,monospace;font-size:.82rem}.form-group input,.form-group textarea{background:var(--bg3);border:1px solid var(--border);color:var(--text);border-radius:10px;outline:none;width:100%;padding:12px 14px;font-family:Space Grotesk,sans-serif;font-size:.92rem;transition:border-color .2s}.form-group input:focus,.form-group textarea:focus{border-color:var(--green1)}.form-group textarea{resize:vertical;min-height:110px}.form-submit{background:linear-gradient(135deg,var(--green1),var(--green2));color:#000;cursor:pointer;border:none;border-radius:10px;width:100%;padding:13px;font-family:Space Grotesk,sans-serif;font-size:.95rem;font-weight:700;transition:all .2s}.form-submit:hover{transform:translateY(-2px);box-shadow:0 8px 24px #00ff8840}footer{background:var(--bg);border-top:1px solid var(--border);text-align:center;padding:2.5rem 5%}footer p{color:var(--muted);font-size:.85rem}footer .footer-green{color:var(--green1)}.footer-links{flex-wrap:wrap;justify-content:center;gap:20px;margin-bottom:1rem;display:flex}.footer-links a{color:var(--muted);font-size:.85rem;text-decoration:none;transition:color .2s}.footer-links a:hover{color:var(--green1)}@keyframes fadeUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}.reveal{opacity:0;transition:all .65s;transform:translateY(30px)}.reveal.visible{opacity:1;transform:translateY(0)}@media (max-width:768px){.nav-links,.nav-cta{display:none}.hamburger{display:flex}.about-grid,.resume-grid{grid-template-columns:1fr}.about-avatar{max-width:200px}.form-row{grid-template-columns:1fr}.hero-stats{gap:24px}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
