:root{--text-color: #1a1c20;--link-color: #4a76ee;--background-color: #eeeff1}@media (prefers-color-scheme: dark){:root{--text-color: #eeeff1;--background-color: #1a1c20;--link-color: #4c9aff}}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:Fira Code,serif;color:var(--text-color);background-color:var(--background-color);max-width:1400px;margin:0 auto}a{color:var(--link-color);text-decoration:none}nav{display:flex;justify-content:space-between;align-items:center;padding:0 40px;height:80px}nav .nav-left{display:flex;align-items:center;gap:32px}nav .nav-brand{color:var(--text-color);font-size:20px;font-weight:700}nav .nav-link{color:var(--text-color);font-size:16px;font-weight:500;transition:color .2s}nav .nav-link:hover{color:var(--link-color)}nav .nav-right{display:flex;align-items:center;gap:8px}nav .social-link{color:var(--text-color);font-size:22px;padding:8px;transition:color .2s}nav .social-link:hover{color:var(--link-color)}.hero-section{display:flex;justify-content:space-between;align-items:center;padding:0 40px;margin:40px 0 100px;gap:40px}.hero-section .text{flex:5}.hero-section .text h2{font-size:32px}.hero-section .text .links{margin-top:20px}.hero-section .text .links a{display:inline-block;padding:4px 8px;border:1px solid var(--link-color);border-radius:4px;margin-right:8px;margin-bottom:8px;transition:.1s}.hero-section .text .links a:hover{color:var(--text-color);border:1px solid var(--text-color)}.hero-section .headshot{flex:3;display:flex;justify-content:right}.hero-section .headshot img{width:320px;border-radius:50%}@media (max-width: 850px){.hero-section .text h2{font-size:24px}}.experience-section{padding:0 44px;margin-bottom:88px}.experience-section h2{font-size:32px;margin-bottom:32px}.experience-section .timeline{display:flex;flex-direction:column;gap:40px}.experience-section .experience-group{margin-bottom:20px}.experience-section .company-name{font-size:24px;font-weight:700;margin-bottom:16px;color:var(--text-color)}.experience-section .position{margin-bottom:24px;padding-bottom:24px}.experience-section .position:last-child{margin-bottom:0;padding-bottom:0}.experience-section .position-header{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:8px;margin-bottom:8px}.experience-section .position-title{font-size:18px;font-weight:600;color:var(--text-color);margin:0}.experience-section .position-period{font-size:14px;color:var(--link-color);font-weight:500}.experience-section .position-location{font-size:14px;color:var(--text-color);opacity:.7;margin:4px 0 12px}.experience-section .position-description{margin:12px 0;line-height:1.6}.contact-section{padding:0 44px;margin-bottom:88px}.contact-section h2{font-size:32px}.contact-section .group{display:flex;gap:48px}.contact-section .group .text{flex:4;margin-top:20px}.contact-section .group form{flex:4;display:flex;flex-direction:column}.contact-section .group form input,.contact-section .group form textarea{font-family:Fira Code,sans-serif;border:1px solid var(--link-color);background-color:transparent;padding:10px;margin-bottom:15px;outline:none;resize:none;border-radius:4px}.contact-section .group form button{font-family:Fira Code;font-size:16px;color:#fff;background-color:var(--link-color);border:none;border-radius:4px;height:32px;cursor:pointer;transition:.1s}.contact-section .group form button:hover{filter:brightness(.9)}footer{text-align:center;padding:10px;font-size:14px;color:var(--text-color)}@media (max-width: 740px){.hero-section{flex-direction:column-reverse}.hero-section .text h2{text-align:center}.hero-section .headshot img{width:300px}.contact-section .group{flex-direction:column}}@media (max-width: 600px){nav{padding:0 20px}nav .nav-left{gap:16px}nav .nav-brand{font-size:18px}nav .nav-link{font-size:14px}nav .nav-right{gap:4px}nav .social-link{padding:4px}.hero-section,.experience-section,.contact-section{padding:0 20px}}.blog-section{padding:40px 44px;margin-bottom:88px}.blog-section h1{font-size:32px;margin-bottom:16px}.blog-section .blog-intro{font-size:18px;margin-bottom:40px;opacity:.8}.blog-posts{display:flex;flex-direction:column;gap:24px}.blog-post-card{border:1px solid var(--link-color);border-radius:8px;padding:24px;transition:transform .2s,box-shadow .2s}.blog-post-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.blog-post-card a{text-decoration:none;color:var(--text-color)}.blog-post-card h2{font-size:24px;margin-bottom:8px;color:var(--link-color)}.blog-post-card .post-date{font-size:14px;opacity:.7;margin-bottom:12px}.blog-post-card .post-description{margin-bottom:16px;line-height:1.6}.blog-post-card .post-tags{display:flex;flex-wrap:wrap;gap:8px}.blog-post-card .tag{display:inline-block;padding:4px 12px;background-color:var(--link-color);color:var(--background-color);border-radius:12px;font-size:12px;font-weight:500}.blog-post{max-width:800px;margin:0 auto;padding:40px 44px}.post-header{margin-bottom:40px}.back-link{display:inline-block;margin-bottom:24px;color:var(--link-color);text-decoration:none;font-size:14px}.back-link:hover{text-decoration:underline}.back-link i{margin-right:4px}.blog-post h1{font-size:36px;margin-bottom:16px;line-height:1.2}.post-meta{font-size:14px;opacity:.7;margin-bottom:16px}.post-meta .updated{margin-left:8px}.post-header .post-tags{display:flex;flex-wrap:wrap;gap:8px}.post-header .tag{display:inline-block;padding:4px 12px;background-color:var(--link-color);color:var(--background-color);border-radius:12px;font-size:12px;font-weight:500}.post-content{line-height:1.8}.post-content h2{font-size:28px;margin-top:32px;margin-bottom:16px}.post-content h3{font-size:22px;margin-top:24px;margin-bottom:12px}.post-content p{margin-bottom:16px}.post-content ul,.post-content ol{margin-bottom:16px;padding-left:24px}.post-content li{margin-bottom:8px}.post-content code{background-color:var(--text-color);color:var(--background-color);padding:2px 6px;border-radius:4px;font-family:Fira Code,monospace;font-size:14px}.post-content pre{background-color:var(--text-color);color:var(--background-color);padding:16px;border-radius:8px;overflow-x:auto;margin-bottom:16px}.post-content pre code{background-color:transparent;padding:0}.post-content blockquote{border-left:4px solid var(--link-color);padding-left:16px;margin:16px 0;opacity:.8}@media (max-width: 600px){.blog-section,.blog-post{padding:40px 20px}.blog-post h1{font-size:28px}.post-content h2{font-size:24px}.post-content h3{font-size:20px}}
