:root{--navy: #0a192f;--light-navy: #112240;--lightest-navy: #233554;--slate: #8892b0;--light-slate: #a8b2d8;--lightest-slate: #ccd6f6;--white: #e6f1ff;--green: #64ffda;--green-tint: rgba(100, 255, 218, .08);--green-tint-hover: rgba(100, 255, 218, .15);--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "Fira Code", "Courier New", monospace;--transition: all .25s cubic-bezier(.645, .045, .355, 1);--nav-height: 70px}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;font-size:16px}body{background-color:var(--navy);color:var(--slate);font-family:var(--font-sans);font-size:1.0625rem;line-height:1.7;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background:radial-gradient(700px circle at var(--mouse-x, 50%) var(--mouse-y, 50%),rgba(100,255,218,.04),transparent 60%);z-index:0;pointer-events:none;transition:background .1s}a{color:var(--green);text-decoration:none;transition:var(--transition)}a:hover{color:var(--green)}button{cursor:pointer;border:none;background:none;font-family:var(--font-sans)}ul{list-style:none}img{max-width:100%;display:block}.section{max-width:1000px;margin:0 auto;padding:100px 40px}@media (max-width: 768px){.section{padding:80px 24px}}.section-heading{display:flex;align-items:center;gap:16px;font-size:clamp(1.5rem,3vw,1.875rem);font-weight:700;color:var(--lightest-slate);white-space:nowrap;margin-bottom:60px}.section-heading:before{content:attr(data-number);font-family:var(--font-mono);font-size:clamp(.875rem,2vw,1rem);color:var(--green);font-weight:400;position:relative;top:2px}.section-heading:after{content:"";display:block;height:1px;width:100%;background:var(--lightest-navy);flex:1;min-width:40px}.reveal{opacity:0;transform:translateY(30px);transition:opacity .6s cubic-bezier(.645,.045,.355,1),transform .6s cubic-bezier(.645,.045,.355,1)}.reveal.revealed{opacity:1;transform:translateY(0)}.reveal-delay-1{transition-delay:.1s}.reveal-delay-2{transition-delay:.2s}.reveal-delay-3{transition-delay:.3s}.reveal-delay-4{transition-delay:.4s}.reveal-delay-5{transition-delay:.5s}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--navy)}::-webkit-scrollbar-thumb{background:var(--lightest-navy);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--slate)}::selection{background:var(--green);color:var(--navy)}.navbar{position:fixed;top:0;left:0;right:0;z-index:100;height:var(--nav-height);display:flex;align-items:center;padding:0 40px;transition:all .35s cubic-bezier(.645,.045,.355,1)}.navbar.scrolled{background:#0a192fe6;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 10px 30px -10px #020c1bb3}.navbar.hidden{transform:translateY(-100%)}@media (max-width: 768px){.navbar{padding:0 24px}}.nav-inner{max-width:1200px;width:100%;margin:0 auto;display:flex;align-items:center;justify-content:space-between}.nav-logo{display:flex;align-items:center;transition:var(--transition)}.nav-logo:hover svg rect{fill:var(--green-tint)}.nav-links{display:flex;align-items:center;gap:8px}@media (max-width: 768px){.nav-links{display:none}}.nav-link{color:var(--lightest-slate);font-family:var(--font-mono);font-size:.8125rem;padding:10px 14px;border-radius:4px;transition:var(--transition)}.nav-link:hover{color:var(--green);background:var(--green-tint)}.nav-btn{color:var(--green);font-family:var(--font-mono);font-size:.8125rem;padding:10px 20px;border:1px solid var(--green);border-radius:4px;margin-left:8px;transition:var(--transition);background:transparent}.nav-btn:hover{background:var(--green-tint);color:var(--green)}.hamburger{display:none;flex-direction:column;justify-content:space-between;width:28px;height:20px;cursor:pointer;padding:0;background:none;border:none;z-index:200}.hamburger span{display:block;width:100%;height:2px;background:var(--green);border-radius:2px;transition:all .3s ease;transform-origin:center}.hamburger.open span:nth-child(1){transform:translateY(9px) rotate(45deg)}.hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0)}.hamburger.open span:nth-child(3){transform:translateY(-9px) rotate(-45deg)}@media (max-width: 768px){.hamburger{display:flex}}.mobile-menu{display:none;position:fixed;top:0;right:0;bottom:0;width:min(75vw,400px);background:var(--light-navy);flex-direction:column;align-items:center;justify-content:center;z-index:150;transform:translate(100%);transition:transform .35s cubic-bezier(.645,.045,.355,1);box-shadow:-20px 0 60px -10px #020c1b80}.mobile-menu.open{transform:translate(0)}.mobile-menu ul{display:flex;flex-direction:column;align-items:center;gap:32px;width:100%;padding:40px}@media (max-width: 768px){.mobile-menu{display:flex}}.mobile-nav-link{color:var(--lightest-slate);font-family:var(--font-mono);font-size:1rem;display:flex;align-items:center;transition:var(--transition)}.mobile-nav-link:hover{color:var(--green)}.mobile-hire{margin-top:8px;padding:16px 40px!important;font-size:.9375rem!important}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:140;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}@keyframes scrollPulse{0%,to{opacity:.3}50%{opacity:1}}@keyframes float{0%,to{transform:translate(0) scale(1)}33%{transform:translate(20px,-20px) scale(1.05)}66%{transform:translate(-10px,15px) scale(.98)}}.hero{position:relative;min-height:100vh;display:flex;align-items:center;padding:0 40px;overflow:hidden}@media (max-width: 768px){.hero{padding:0 24px}}.hero-content{max-width:900px;margin:0 auto;width:100%;padding-top:var(--nav-height)}.reveal-hero{opacity:0;transform:translateY(20px)}.mounted .reveal-hero{animation:fadeUp .6s cubic-bezier(.645,.045,.355,1) forwards}.hero-greeting{font-family:var(--font-mono);font-size:clamp(.875rem,2vw,1rem);color:var(--green);margin-bottom:20px;letter-spacing:.05em}.hero-name{font-size:clamp(2.8rem,8vw,5.5rem);font-weight:800;color:var(--lightest-slate);line-height:1.08;letter-spacing:-.02em;margin-bottom:12px;background:linear-gradient(135deg,var(--white) 0%,var(--lightest-slate) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-tagline{font-size:clamp(1.5rem,5vw,3.5rem);font-weight:700;color:var(--slate);line-height:1.2;margin-bottom:28px;min-height:1.2em;display:flex;align-items:center;gap:2px}.typed-text{color:var(--green)}.cursor{display:inline-block;width:3px;height:.85em;background:var(--green);border-radius:2px;animation:blink 1s step-end infinite;margin-left:2px;vertical-align:middle;flex-shrink:0}.hero-description{max-width:560px;font-size:1.0625rem;line-height:1.8;color:var(--slate);margin-bottom:40px}.highlight{color:var(--green);font-weight:500}.hero-cta{display:flex;gap:20px;flex-wrap:wrap;margin-bottom:60px}@media (max-width: 768px){.hero-cta{flex-direction:column;align-items:flex-start}}.btn-primary{display:inline-flex;align-items:center;padding:14px 32px;background:var(--green);color:var(--navy);font-weight:600;font-size:.9375rem;border-radius:4px;transition:var(--transition);letter-spacing:.02em;position:relative;overflow:hidden}.btn-primary:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#fff3;transform:translate(-100%);transition:transform .3s ease}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 25px #64ffda59;color:var(--navy)}.btn-primary:hover:before{transform:translate(0)}@media (max-width: 768px){.btn-primary{width:100%;justify-content:center;max-width:280px}}.btn-outline{display:inline-flex;align-items:center;padding:14px 32px;border:1px solid var(--green);color:var(--green);font-weight:600;font-size:.9375rem;border-radius:4px;transition:var(--transition);background:transparent;letter-spacing:.02em}.btn-outline:hover{background:var(--green-tint);transform:translateY(-2px);box-shadow:0 8px 25px #64ffda1f;color:var(--green)}@media (max-width: 768px){.btn-outline{width:100%;justify-content:center;max-width:280px}}.hero-scroll-hint{display:flex;align-items:center;gap:12px;font-family:var(--font-mono);font-size:.75rem;color:var(--slate);letter-spacing:.1em;text-transform:uppercase}.scroll-line{width:60px;height:1px;background:linear-gradient(to right,transparent,var(--slate));animation:scrollPulse 2s ease-in-out infinite}.hero-bg-shapes{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:-1;overflow:hidden}.shape{position:absolute;border-radius:50%;filter:blur(80px);opacity:.07}.shape.shape-1{width:600px;height:600px;background:var(--green);top:-200px;right:-200px;animation:float 8s ease-in-out infinite}.shape.shape-2{width:400px;height:400px;background:#57cbff;bottom:-100px;left:-100px;animation:float 10s ease-in-out infinite reverse}.shape.shape-3{width:300px;height:300px;background:#f57dff;top:40%;left:50%;animation:float 6s ease-in-out infinite 2s}.about-section{position:relative}.about-grid{display:grid;grid-template-columns:3fr 2fr;gap:60px;align-items:start}.about-text p{margin-bottom:18px;line-height:1.8;color:var(--slate);font-size:1.0625rem}.about-highlight{color:var(--green);font-weight:500}.tech-list{display:grid;grid-template-columns:repeat(2,1fr);gap:8px 20px;margin:20px 0 30px}.tech-list li{display:flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:.8125rem;color:var(--light-slate)}.tech-arrow{color:var(--green);font-size:.75rem}.about-links{display:flex;gap:16px;flex-wrap:wrap}.about-link-btn{display:inline-flex;align-items:center;gap:8px;color:var(--green);font-family:var(--font-mono);font-size:.8125rem;padding:10px 20px;border:1px solid var(--green);border-radius:4px;transition:var(--transition)}.about-link-btn:hover{background:var(--green-tint);transform:translateY(-2px);color:var(--green)}.about-code-card{position:relative;background:var(--light-navy);border:1px solid var(--lightest-navy);border-radius:12px;overflow:hidden;font-family:var(--font-mono);font-size:.8125rem;transition:transform .3s ease,box-shadow .3s ease}.about-code-card:hover{transform:translateY(-4px);box-shadow:0 20px 60px -10px #64ffda1a;border-color:var(--green)}.code-card-header{display:flex;align-items:center;gap:8px;padding:12px 16px;background:#0003;border-bottom:1px solid var(--lightest-navy)}.code-dot{width:12px;height:12px;border-radius:50%}.code-dot.red{background:#ff5f57}.code-dot.yellow{background:#febc2e}.code-dot.green{background:#28c840}.code-card-filename{margin-left:8px;color:var(--slate);font-size:.75rem}.code-card-body{padding:24px;line-height:1.9;overflow-x:auto}.code-card-body code{display:block;white-space:pre}.code-keyword{color:#c792ea}.code-variable{color:#82aaff}.code-operator{color:var(--light-slate)}.code-punctuation{color:var(--slate)}.code-property{color:#f07178}.code-string{color:var(--green)}.code-boolean{color:#f78c6c}.code-card-glow{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(ellipse at top right,rgba(100,255,218,.05),transparent 60%)}@media (max-width: 900px){.about-grid{grid-template-columns:1fr;gap:40px}.about-code-card{max-width:480px}}@media (max-width: 480px){.tech-list{grid-template-columns:1fr}}.skills-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.skill-card{background:var(--light-navy);border:1px solid var(--lightest-navy);border-radius:12px;padding:28px;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;position:relative;overflow:hidden}.skill-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,transparent,var(--green),transparent);opacity:0;transition:opacity .3s ease}.skill-card:hover{transform:translateY(-6px);box-shadow:0 20px 50px -15px #020c1bb3;border-color:var(--green)}.skill-card:hover:before{opacity:1}.skill-card-header{display:flex;align-items:center;gap:12px;margin-bottom:24px}.skill-card-icon{font-size:1.5rem;line-height:1}.skill-card-title{font-size:1rem;font-weight:600;letter-spacing:.02em}.skill-bars{display:flex;flex-direction:column;gap:16px}.skill-item{display:flex;flex-direction:column;gap:6px}.skill-label{display:flex;justify-content:space-between;align-items:center}.skill-name{font-size:.8125rem;color:var(--light-slate);font-family:var(--font-mono)}.skill-percent{font-size:.75rem;font-family:var(--font-mono);font-weight:500}.skill-track{height:4px;background:var(--lightest-navy);border-radius:4px;overflow:hidden}.skill-fill{height:100%;width:0;background:var(--bar-color, var(--green));border-radius:4px;transition:width 1s cubic-bezier(.645,.045,.355,1) .2s;opacity:.2}.skill-fill.revealed{width:var(--bar-width);opacity:1;transform:translateY(0)!important}@media (max-width: 1024px){.skills-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 640px){.skills-grid{grid-template-columns:1fr}}.featured-projects{display:flex;flex-direction:column;gap:100px;margin-bottom:80px}.featured-project{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:center;position:relative}.featured-project--reverse{direction:rtl}.featured-project--reverse .featured-project-content{direction:ltr;text-align:right}.featured-project--reverse .featured-tech,.featured-project--reverse .featured-links{justify-content:flex-end}.featured-project--reverse .featured-desc-card{margin-left:auto;margin-right:0}.featured-label{font-family:var(--font-mono);font-size:.8125rem;color:var(--green);margin-bottom:10px;letter-spacing:.05em}.featured-title{font-size:clamp(1.375rem,3vw,1.75rem);font-weight:700;color:var(--lightest-slate);margin-bottom:24px;line-height:1.2}.featured-desc-card{background:var(--light-navy);border:1px solid var(--lightest-navy);border-radius:8px;padding:24px;margin-bottom:24px;position:relative;z-index:2;box-shadow:0 10px 30px -10px #020c1b80;max-width:420px}.featured-desc-card p{color:var(--light-slate);font-size:.9375rem;line-height:1.7}.featured-tech{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:24px}.featured-tech li{font-family:var(--font-mono);font-size:.75rem;color:var(--slate);letter-spacing:.02em}.featured-links{display:flex;gap:16px}.icon-link{color:var(--light-slate);display:flex;align-items:center;padding:4px;transition:var(--transition)}.icon-link:hover{color:var(--green);transform:translateY(-3px)}.featured-project-visual{position:relative}.featured-visual-link{display:block;position:relative;border-radius:12px;overflow:hidden}.featured-mockup{background:var(--light-navy);border:1px solid var(--lightest-navy);border-radius:12px;overflow:hidden;transition:transform .4s ease,box-shadow .4s ease}.featured-visual-link:hover .featured-mockup{transform:translateY(-6px);box-shadow:0 25px 50px -15px #020c1bcc;border-color:var(--green)}.mockup-bar{background:#00000040;padding:10px 16px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--lightest-navy)}.mockup-dots{display:flex;gap:6px}.mockup-dots span{width:10px;height:10px;border-radius:50%;background:var(--lightest-navy)}.mockup-dots span:nth-child(1){background:#ff5f57}.mockup-dots span:nth-child(2){background:#febc2e}.mockup-dots span:nth-child(3){background:#28c840}.mockup-url{font-family:var(--font-mono);font-size:.6875rem;color:var(--slate);flex:1;background:var(--lightest-navy);padding:4px 10px;border-radius:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mockup-screen{padding:40px 32px;display:flex;flex-direction:column;align-items:center;gap:16px;min-height:220px;justify-content:center;background:linear-gradient(135deg,var(--light-navy),var(--navy))}.mockup-icon{font-size:3rem;line-height:1;filter:drop-shadow(0 0 20px rgba(100,255,218,.3))}.mockup-project-name{font-size:1rem;font-weight:600;color:var(--lightest-slate);text-align:center}.mockup-client-badge{font-family:var(--font-mono);font-size:.6875rem;color:var(--green);background:var(--green-tint);border:1px solid rgba(100,255,218,.2);padding:3px 10px;border-radius:20px}.mockup-lines{display:flex;flex-direction:column;gap:8px;width:60%}.mockup-lines div{height:3px;background:var(--lightest-navy);border-radius:2px}.mockup-lines div:nth-child(2){width:80%}.mockup-lines div:nth-child(3){width:60%}.featured-visual-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom right,rgba(100,255,218,.05),transparent);border-radius:12px;pointer-events:none}.other-projects-header{text-align:center;margin-bottom:40px}.other-projects-header h3{font-size:1.5rem;font-weight:700;color:var(--lightest-slate);margin-bottom:8px}.other-projects-header p{font-family:var(--font-mono);font-size:.875rem;color:var(--slate)}.pro-cards-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.pro-card{background:var(--light-navy);border:1px solid var(--lightest-navy);border-radius:12px;padding:28px;display:flex;flex-direction:column;gap:12px;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;position:relative;overflow:hidden}.pro-card:before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:linear-gradient(to bottom,var(--green),transparent);opacity:0;transition:opacity .3s ease}.pro-card:hover{transform:translateY(-6px);box-shadow:0 20px 50px -15px #020c1bb3;border-color:var(--green)}.pro-card:hover:before{opacity:1}.pro-card-top{display:flex;align-items:center;justify-content:space-between}.pro-card-icon{font-size:2rem;line-height:1}.pro-card-client{font-family:var(--font-mono);font-size:.75rem;color:var(--green);background:var(--green-tint);padding:4px 10px;border-radius:20px;border:1px solid rgba(100,255,218,.2)}.pro-card-title{font-size:1.0625rem;font-weight:600;color:var(--lightest-slate);line-height:1.3}.pro-card-desc{font-size:.875rem;color:var(--slate);line-height:1.7;flex:1}.pro-card-tech{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}.pro-card-tech li{font-family:var(--font-mono);font-size:.6875rem;color:var(--green);background:var(--green-tint);padding:3px 10px;border-radius:3px;border:1px solid rgba(100,255,218,.15)}.pro-card-badge{margin-top:auto;padding-top:16px;border-top:1px solid var(--lightest-navy)}.pro-card-badge span{font-family:var(--font-mono);font-size:.6875rem;color:var(--slate);text-transform:uppercase;letter-spacing:.08em}@media (max-width: 900px){.featured-project{grid-template-columns:1fr;gap:30px}.featured-project--reverse{direction:ltr}.featured-project--reverse .featured-project-content{text-align:left}.featured-project--reverse .featured-tech,.featured-project--reverse .featured-links{justify-content:flex-start}.featured-project--reverse .featured-desc-card{margin-left:0;max-width:100%}.featured-desc-card{max-width:100%}.featured-projects{gap:60px}}@media (max-width: 640px){.pro-cards-grid{grid-template-columns:1fr}}.contact-section{text-align:center;padding-bottom:140px}.contact-content{max-width:600px;margin:0 auto}.contact-overline{font-family:var(--font-mono);font-size:.875rem;color:var(--green);margin-bottom:16px;letter-spacing:.05em}.contact-title{font-size:clamp(2rem,5vw,3rem);font-weight:800;color:var(--lightest-slate);margin-bottom:24px;line-height:1.1;background:linear-gradient(135deg,var(--white),var(--lightest-slate));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.contact-desc{font-size:1.0625rem;line-height:1.8;color:var(--slate);margin-bottom:48px}.contact-btn{display:inline-flex;align-items:center;gap:10px;padding:18px 40px;border:1px solid var(--green);color:var(--green);font-family:var(--font-mono);font-size:.9375rem;border-radius:4px;transition:var(--transition);background:transparent;margin-bottom:56px}.contact-btn:hover{background:var(--green-tint);transform:translateY(-3px);box-shadow:0 10px 30px #64ffda26;color:var(--green)}.contact-socials{display:flex;justify-content:center;gap:24px;flex-wrap:wrap}.social-link{display:inline-flex;align-items:center;gap:8px;color:var(--slate);font-family:var(--font-mono);font-size:.8125rem;padding:10px 16px;border-radius:4px;transition:var(--transition);border:1px solid transparent}.social-link:hover{color:var(--green);border-color:var(--green);background:var(--green-tint);transform:translateY(-2px)}.footer{padding:24px 40px;border-top:1px solid var(--lightest-navy);position:relative;z-index:1}.footer-inner{max-width:1000px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px}.footer-credit{display:flex;flex-direction:column;gap:2px;color:var(--slate);font-family:var(--font-mono);font-size:.75rem;transition:var(--transition)}.footer-credit span{font-size:.6875rem;color:var(--slate);opacity:.7}.footer-credit strong{color:var(--light-slate);font-weight:500}.footer-credit:hover strong{color:var(--green)}.footer-stack{font-family:var(--font-mono);font-size:.75rem;color:var(--slate);opacity:.7}.footer-tech{color:var(--green);opacity:1}@media (max-width: 480px){.footer{padding:24px;text-align:center}.footer-inner{justify-content:center}}.scroll-to-top{position:fixed;bottom:36px;right:36px;z-index:90;width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:var(--light-navy);border:1px solid var(--green);border-radius:8px;color:var(--green);cursor:pointer;opacity:0;transform:translateY(16px);pointer-events:none;transition:opacity .3s cubic-bezier(.645,.045,.355,1),transform .3s cubic-bezier(.645,.045,.355,1),background .25s cubic-bezier(.645,.045,.355,1),box-shadow .25s cubic-bezier(.645,.045,.355,1)}.scroll-to-top.visible{opacity:1;transform:translateY(0);pointer-events:auto}.scroll-to-top:hover{background:var(--green-tint);box-shadow:0 0 20px #64ffda33}.scroll-to-top:hover svg{transform:translateY(-2px)}.scroll-to-top svg{transition:transform .25s cubic-bezier(.645,.045,.355,1)}@media (max-width: 768px){.scroll-to-top{bottom:24px;right:24px;width:40px;height:40px}}.app{position:relative;z-index:1}main{position:relative;z-index:1}
