.navbar-container{width:100%;position:fixed;top:0;left:0;background:#fff;z-index:1000;box-shadow:0 2px 8px #0000001a;background-color:var(--color-background)}.navbar{max-width:1200px;margin:0 auto;padding:1rem 20px;display:flex;justify-content:flex-end;align-items:center;position:relative}.desktop-nav{display:flex;gap:2.5rem}.desktop-nav a{font-size:20px;color:var(--color-primary);text-decoration:none;position:relative;padding:8px 0;transition:color .3s ease}.desktop-nav a:after{content:"";position:absolute;bottom:0;left:50%;width:0;height:2px;background-color:var(--color-accent);transform:translate(-50%);transition:width .3s ease}.desktop-nav a:hover,.desktop-nav a:focus{color:var(--color-accent);text-decoration:none}.desktop-nav a:focus-visible{box-shadow:0 0 0 3px var(--color-accent);outline:none}.desktop-nav a:hover:after,.desktop-nav a:focus:after{width:100%;outline:none}.hamburger{display:none;flex-direction:column;background:none;border:none;cursor:pointer;padding:5px;width:30px;height:30px;justify-content:space-between}.hamburger span{display:block;height:3px;width:100%;background-color:var(--color-primary);transition:all .3s ease;transform-origin:center}.hamburger-active span:nth-child(1){transform:rotate(45deg) translate(6px,6px)}.hamburger-active span:nth-child(2){opacity:0}.hamburger-active span:nth-child(3){transform:rotate(-45deg) translate(6px,-6px)}.mobile-nav{display:none;position:absolute;top:100%;right:0;background-color:var(--color-background);box-shadow:0 4px 12px #00000026;border-radius:8px;min-width:200px;overflow:hidden;opacity:0;transform:translateY(-10px);transition:all .3s ease;pointer-events:none}.mobile-nav-open{opacity:1;transform:translateY(0);pointer-events:auto}.mobile-nav a{display:block;padding:15px 20px;font-size:18px;color:var(--color-primary);text-decoration:none;border-bottom:1px solid rgba(0,0,0,.1);transition:background-color .2s ease}.mobile-nav a:last-child{border-bottom:none}.mobile-nav a:hover,.mobile-nav a:focus{background-color:#0000000d;color:var(--color-accent)}@media (max-width: 768px){.desktop-nav{display:none}.hamburger{display:flex}.mobile-nav{display:block}.navbar{padding:1rem 15px}}.main-container{display:flex;flex-direction:column;margin:0 auto;padding:80px 40px 0;max-width:1200px}*{box-sizing:border-box}:root{--color-background: #f0f0f0;--color-text: #1a1a1a;--color-primary: #777777;--color-accent: #008080}body{font-family:JetBrains Mono,monospace;margin:0;padding:0;line-height:1.6;background-color:var(--color-background);color:var(--color-text)}h1,h2,h3{color:var(--color-primary)}h1{font-size:clamp(30px,4vw,36px)}h1:hover{color:var(--color-accent);transition:color .75s ease-in-out}section{scroll-margin-top:80px}#hero-container{display:inline-block;padding:20vh 0 10vh;font-size:clamp(50px,8vw,85px);min-height:100vh}.hero-intro-text{font-weight:300}.my-name-container{display:inline-block}#my-name{font-weight:bolder;color:var(--color-accent);position:relative;border-right:5px solid;width:100%;white-space:nowrap;overflow:hidden;animation:typing 1s steps(9),cursor .8s ease-in-out infinite alternate}@keyframes cursor{50%{border-color:transparent}}@keyframes typing{0%{width:0}}.slide-in-section{opacity:0;transform:translate(-25%);transition:all .8s ease-out}.slide-in-section.is-visible{opacity:1;transform:translate(0)}@media (prefers-reduced-motion){.slide-in-section{transition:none}}.project-card{background:linear-gradient(145deg,#fff,#f8fafc);border-radius:16px;overflow:hidden;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;transition:all .5s cubic-bezier(.4,0,.2,1);position:relative;display:flex;flex-direction:row;height:220px;max-height:220px;border:1px solid rgba(226,232,240,.8)}.project-card:hover{transform:translateY(-4px) scale(1.01);box-shadow:0 12px 20px -5px #00000026,0 6px 8px -3px #0000001a}.image-container{position:relative;overflow:hidden;width:280px;min-width:280px;background:var(--color-accent)}.project-image{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.group:hover .project-image{transform:scale(1.08)}.overlay{position:absolute;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s ease}.group:hover .overlay{opacity:1}.view-btn{background:#ffffffe6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:none;padding:10px 20px;border-radius:10px;font-weight:600;color:#1f2937;display:flex;align-items:center;gap:6px;cursor:pointer;transition:all .2s ease;font-size:13px}.view-btn:hover{background:#fff;transform:scale(1.05)}.view-btn svg{width:16px;height:16px}.project-content{padding:20px;display:flex;flex-direction:column;flex:1;gap:12px}.project-header{display:flex;flex-direction:column;gap:8px}.project-title{font-size:18px;font-weight:700;color:#1f2937;margin:0;line-height:1.3;background:var(--color-text);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.tags-container{display:flex;flex-wrap:wrap;gap:6px}.tag{background:linear-gradient(135deg,#667eea20,#764ba240);color:var(--color-text);padding:3px 10px;border-radius:12px;font-size:11px;font-weight:500;border:1px solid rgba(102,126,234,.2)}.project-description{color:#6b7280;line-height:1.5;margin:0;font-size:13px;flex:1;overflow:auto;max-height:80px;padding-right:4px}.project-footer{display:flex;justify-content:flex-start;gap:20px}.github-link{display:inline-flex;align-items:center;gap:6px;color:var(--color-accent);font-size:13px;font-weight:600;text-decoration:none;transition:all .2s ease}.github-link:hover{gap:10px;font-size:13.5px}.github-link:hover .arrow-icon{transform:translate(3px)}.arrow-icon{height:20px;width:20px;transition:.2 all ease}@media (max-width: 768px){.project-card{flex-direction:column;height:auto;max-height:none}.image-container{width:100%;min-width:auto;aspect-ratio:16/9}.project-content{padding:16px}.project-title{font-size:16px}.project-description{font-size:12px;-webkit-line-clamp:2;line-clamp:2}}.contact-card{display:flex;flex-direction:column;justify-content:center;align-items:center;width:200px;height:200px;border:2px solid #000;border-radius:12px;background-color:#fff;text-decoration:none;overflow:hidden;transition:transform .4s,box-shadow .2s}.contact-card:hover{transform:translateY(-8px);box-shadow:0 10px 20px #0000001a}.contact-card:hover .contact-card_label{color:var(--color-accent);transition:color .5s ease-out}.contact-card_label{margin-top:12px;color:var(--color-primary);text-decoration:none;font-weight:600}#contact-section{min-height:50vh}.contact-cards-container{display:flex;flex-direction:row;justify-content:space-evenly}#blog-section,#about-section{min-height:min-content}.about-header{display:inline-block;margin:0 auto}