:root{--hot-rod-red: #DC2626;--hot-rod-red-hover: #B91C1C;--hot-rod-red-light: #FEF2F2;--hot-rod-red-dark: #991B1B;--gray-50: #FAFAFA;--gray-100: #F4F4F5;--gray-200: #E4E4E7;--gray-300: #D4D4D8;--gray-400: #A1A1AA;--gray-500: #71717A;--gray-600: #52525B;--gray-700: #3F3F46;--gray-800: #27272A;--gray-900: #18181B;--white: #FFFFFF;--black: #000000;--cream: #FAFAFA}*{margin:0;padding:0;box-sizing:border-box}main{flex:1;display:flex;margin-left:240px}@media(max-width:768px){main{margin-left:0}}html{font-size:16px}body{font-family:Fira Code,monospace;line-height:1.6;color:var(--gray-800);background-color:var(--cream);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex;flex-direction:column;min-height:100vh}::selection{background-color:var(--hot-rod-red-light);color:var(--hot-rod-red)}::-moz-selection{background-color:var(--hot-rod-red-light);color:var(--gray-900)}h1,h2,h3,h4{font-family:Fira Code,monospace;font-weight:600;line-height:1.2;color:var(--gray-900)}h1{font-size:2.5rem;font-weight:700}h2{font-size:2rem;margin-bottom:1rem}h3{font-size:1.5rem;margin-bottom:.75rem}p{font-size:1rem;color:var(--gray-600);line-height:1.7;margin-bottom:1rem}a{text-decoration:none}.page-container{max-width:1200px;margin:0 auto;padding:2rem;width:100%}.navbar{position:fixed;left:0;top:0;height:100vh;width:240px;background:var(--white);border-right:1px solid var(--gray-200);display:flex;flex-direction:column;z-index:1000;overflow-y:auto}.navbar-content{display:flex;flex-direction:column;gap:1rem;padding:2rem 1rem;height:100%}.mobile-menu-toggle{display:none;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;background:transparent;border:none;cursor:pointer;padding:0;z-index:1001;position:absolute;top:1rem;right:1rem}.mobile-menu-toggle svg{width:1.5rem;height:1.5rem;color:var(--gray-800);stroke-width:2}.mobile-menu-toggle .close-icon,.navbar.open .mobile-menu-toggle .menu-icon{display:none}.navbar.open .mobile-menu-toggle .close-icon{display:block}.navbar .contact-info{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:1rem;width:100%;height:auto;padding:.5rem 0}.contact-info-item{display:flex;flex:1;align-items:center;justify-content:center;border:1px solid var(--gray-300);border-radius:6px;padding:.5rem;transition:all .2s ease}.contact-info-item:hover{border-color:var(--hot-rod-red);background:var(--gray-50);cursor:pointer}.contact-info-item img{width:20px;height:20px;filter:grayscale(100%);opacity:.5;transition:all .2s ease;object-fit:contain}.menu-links{display:flex;flex-direction:column;gap:.5rem;width:100%}.menu-link{padding:.75rem 1rem;border:1px solid var(--gray-300);border-radius:6px;text-align:center;font-weight:500;color:var(--gray-700);transition:all .2s ease;font-size:.95rem}.menu-link:hover{border-color:var(--hot-rod-red);color:var(--hot-rod-red);background:var(--gray-50)}.interactive-menu{display:flex;flex-direction:column;gap:.5rem;width:100%;align-items:flex-start}.interactive-menu span{padding:.5rem 1rem;border-radius:0;cursor:pointer;transition:all .2s ease;font-weight:500;color:var(--gray-600);border:none;border-bottom:2px solid transparent;background:transparent;font-family:Fira Code,monospace;position:relative}.interactive-menu span:hover{color:var(--hot-rod-red);background:transparent;border-bottom-color:var(--gray-300)}.interactive-menu span.active{color:var(--hot-rod-red);background:transparent;border-bottom-color:var(--hot-rod-red);font-weight:600}.tech-stack{display:flex;flex-direction:column;gap:1rem;width:100%;align-items:flex-start;background:var(--gray-50);border-radius:12px;padding:1.5rem;border:1px solid var(--gray-200);transition:all .3s ease}.tech-stack:hover{border-color:var(--hot-rod-red);background:var(--white)}.tech-stack-header{display:flex;width:100%;justify-content:center;align-items:center;gap:.75rem;margin-bottom:.5rem}.tech-stack-symbol{font-size:1.25rem;color:var(--hot-rod-red);animation:sparkle 2s ease-in-out infinite}.tech-stack-title{font-size:1rem;font-weight:600;color:var(--gray-700);margin:0;position:relative;cursor:default}.tech-stack-title:after{content:"";position:absolute;bottom:-2px;left:0;width:0;height:1px;background:var(--hot-rod-red);transition:width .3s ease}.tech-stack:hover .tech-stack-title:after{width:100%}.tech-list{display:flex;flex-direction:column;width:100%}.tech-item{display:flex;align-items:center;gap:.75rem;padding:.75rem;border-radius:8px;border:1px solid transparent;transition:all .3s ease;cursor:default;position:relative;background:transparent}.tech-icon{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:6px;background:var(--white);border:1px solid var(--gray-200);transition:all .3s ease}.tech-icon img{width:1.25rem;height:1.25rem;object-fit:contain;transition:all .3s ease}.tech-name{font-size:.9rem;font-weight:500;color:var(--gray-600);transition:all .3s ease}.tech-tag{display:flex;justify-content:center;align-items:center;background:var(--gray-100);color:var(--gray-700);padding:.25rem .75rem;border-radius:20px;font-weight:500;border:1px solid var(--gray-200);filter:grayscale(100%);opacity:.5;transition:all .2s ease;text-decoration:none}.tech-tag span{font-size:.75rem}.tech-tag img{width:1.25rem;height:1.25rem;margin-right:.5rem}.tech-tag:hover{filter:grayscale(0%);opacity:1;cursor:pointer}.content{width:100%;display:flex;flex-direction:column;gap:1rem}.hero-section{display:flex;flex-direction:column;gap:2rem;margin-bottom:3rem}.greeting{display:flex;align-items:baseline;gap:1rem}.greeting-prefix{font-size:2rem;color:var(--hot-rod-red);font-weight:700;line-height:1;opacity:.8}.greeting-text{display:flex;flex-direction:column;gap:.25rem}.greeting-hello{font-size:1.5rem;font-weight:400;color:var(--gray-600);line-height:1}.greeting-name{font-size:3.5rem;font-weight:700;color:var(--gray-900);line-height:1;position:relative}.greeting-name:after{content:"";position:absolute;bottom:0;left:0;width:0;height:3px;background:var(--hot-rod-red);animation:underlineExpand 2s ease-out .5s forwards}.hero-description{display:flex;flex-direction:column;gap:.5rem;margin-left:3rem}.hero-line{display:flex;align-items:center;gap:1rem;margin-bottom:.25rem;opacity:0;animation:fadeInLeft .8s ease-out forwards}.hero-line:nth-child(1){animation-delay:1s}.hero-line:nth-child(2){animation-delay:1.3s}.typing-cursor{color:var(--hot-rod-red);font-weight:600;font-size:1rem;opacity:.7}.hero-text{font-size:1.25rem;color:var(--gray-700);font-weight:400}.content-section{display:flex;width:100%;flex-direction:column;gap:1rem}.content-section.active{display:block}.projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:2rem;width:100%;max-width:900px}.projects-list{display:flex;flex-direction:column;gap:2rem;width:100%;max-width:900px}.project-entry{background:var(--white);padding:2rem;border-radius:12px;border:1px solid var(--gray-200);transition:all .3s ease;position:relative;max-width:100%;box-sizing:border-box}.project-entry.featured{border-left:4px solid var(--hot-rod-red)}.project-entry.placeholder{border-style:dashed;opacity:.7}.project-entry:hover{transform:translateY(-2px);box-shadow:0 10px 30px #0000001a;border-color:var(--hot-rod-red)}.project-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.project-date{color:var(--gray-500);font-size:.875rem;font-weight:500}.project-status-container{display:flex;align-items:center;gap:.5rem}.project-status{background:var(--hot-rod-red);color:var(--white);padding:.25rem .75rem;border-radius:20px;font-size:.75rem;font-weight:600}.project-github-link{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:1px solid var(--gray-300);border-radius:6px;background:var(--white);transition:all .2s ease;filter:grayscale(100%);opacity:.7}.project-github-link:hover{border-color:var(--hot-rod-red);background:var(--gray-50);filter:grayscale(0%);opacity:1;transform:translateY(-1px);cursor:pointer}.project-github-link img{width:16px;height:16px;object-fit:contain}.project-entry.placeholder .project-status{background:var(--gray-400)}.project-title{font-size:1.5rem;margin-bottom:.5rem;color:var(--gray-900)}.project-tagline{color:var(--hot-rod-red);font-weight:500;margin-bottom:1rem}.project-description{margin-bottom:1.5rem;color:var(--gray-600)}.project-tech{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}.project-links{display:flex;gap:1rem}.project-link{color:var(--hot-rod-red);text-decoration:none;font-weight:500;font-size:.9rem;padding:.5rem 1rem;border:1px solid var(--hot-rod-red);border-radius:6px;transition:all .2s ease}.project-link:hover{background:var(--hot-rod-red);color:var(--white)}.footer{width:100%;background:var(--gray-50);border-top:1px solid var(--gray-200);padding:2rem 0;margin-top:auto}.footer-content{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem}.footer-note{font-size:.8rem;color:var(--gray-500)}.footer-content p{margin:0;padding:0}@media(max-width:768px){.navbar{position:fixed;top:0;left:-100%;width:80%;max-width:300px;height:100vh;background:var(--white);border-right:1px solid var(--gray-200);transition:left .3s ease;box-shadow:2px 0 8px #0000001a}.navbar.open{left:0}.mobile-menu-toggle{display:flex;position:fixed;top:1rem;left:1rem;background:var(--white);border:1px solid var(--gray-300);border-radius:6px;padding:.5rem;width:2.5rem;height:2.5rem;z-index:1002;box-shadow:0 2px 4px #0000001a}.navbar.open .mobile-menu-toggle{left:calc(80vw - 3.5rem)}@media(min-width:375px){.navbar.open .mobile-menu-toggle{left:calc(min(80vw,300px) - 3.5rem)}}.page-container{padding:4.5rem 1rem 1rem}.interactive-menu{flex-direction:row;justify-content:center;gap:1rem}.interactive-menu span{padding:.75rem 1.5rem;font-size:.9rem}.contact-info{justify-content:center;gap:1rem}.work-grid{grid-template-columns:1fr;max-width:none}.hero-description{margin-left:0}.greeting{flex-direction:column;align-items:flex-start;gap:.5rem}.greeting-name{font-size:2.5rem}.greeting-hello{font-size:1.25rem}}@keyframes underlineExpand{0%{width:0}to{width:100%}}@keyframes fadeInLeft{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes sparkle{0%,to{opacity:.7;transform:scale(1)}50%{opacity:1;transform:scale(1.1)}}.contact-info-item:hover img{filter:grayscale(0%);opacity:1;transform:scale(1.1)}.tech-item:nth-child(1){animation-delay:.1s}.tech-item:nth-child(2){animation-delay:.2s}.tech-item:nth-child(3){animation-delay:.3s}.tech-item:nth-child(4){animation-delay:.4s}
