@font-face{font-family:Inter;src:url('assets/Inter/Inter-Light.woff2') format('woff2');font-weight:300;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+2000-206F,U+20AC,U+2122,U+2190-21FF,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Inter;src:url('assets/Inter/Inter-Regular.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+2000-206F,U+20AC,U+2122,U+2190-21FF,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Inter;src:url('assets/Inter/Inter-SemiBold.woff2') format('woff2');font-weight:600;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+2000-206F,U+20AC,U+2122,U+2190-21FF,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--hero-size:42px;--medium-size:20px;--text-size:16px;--small-size:12px;--color:#aaa;--primary:#00c399;--secondary:#00c399;--warn:#fd742f;--background:#131418;--background-dark:#403c4c;--background-medium:#2a2f37;--background-light:#1b1e23;--soft-shadow:0 18px 36px -18px rgba(0,0,0,.2),0 30px 45px -30px rgb(65,49,94);--medium-shadow:0 4px 6px rgba(0,0,0,.1);--hard-shadow:0 4px 12px #0006}
*{box-sizing:border-box}html{scroll-behavior:smooth;width:100%;overflow-x:hidden}body{overflow-x:hidden;width:100%;margin:0;background:var(--background);color:var(--color);font-family:Inter,sans-serif;font-size:var(--text-size)}button,input,textarea{font:inherit}a{color:inherit}:focus-visible{outline:2px solid #fff;outline-offset:4px}#top-pixel{position:absolute;top:0;width:1px;height:1px}.container{position:relative;width:100%;max-width:1000px;margin:0 auto;padding:2rem}.highlight{color:var(--secondary)}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.button{display:inline-block;color:var(--primary);border:1px solid var(--primary);background:transparent;backdrop-filter:blur(2px);border-radius:10px;padding:.5rem 1rem;cursor:pointer;text-decoration:none;transition:box-shadow .2s ease-in-out,transform .2s ease-in-out}.button:hover:not(:disabled){box-shadow:var(--hard-shadow);transform:scale(1.05)}.button.primary{color:#fff;background:var(--primary);text-shadow:0 1px 2px rgba(0,0,0,.3)}.button:disabled{cursor:not-allowed;color:var(--color);border-color:var(--background-medium);background:var(--background-light);text-shadow:none}
.rays-container,.avatar-large{position:absolute;inset:0;width:100%;max-width:1000px;margin:0 auto;z-index:0;pointer-events:none}.rays-container{height:1065px}.light{position:absolute;top:-260px;right:-420px}.avatar-large img{position:absolute;top:140px;right:-100px;height:550px;width:auto}.title-bar{position:fixed;top:0;width:100%;z-index:10}.title-bar-container{display:flex;justify-content:space-between;align-items:center;width:100%;max-width:1000px;margin:0 auto;padding:2rem}.site-logo{height:30px;transition:opacity .3s ease-in-out}.site-nav{display:flex;justify-content:center;align-items:center;gap:2rem;padding:.75rem 1.5rem;border:1px solid transparent;border-radius:10px;transition:all .3s ease-in-out}.site-nav a{color:var(--color);text-decoration:none;transition:color .2s ease-in-out,transform .2s ease-in-out}.site-nav a:hover{color:#fff;transform:scale(1.05)}.not-top .site-nav{box-shadow:0 4px 30px rgba(0,0,0,.1);backdrop-filter:blur(6px);border-color:rgba(255,255,255,.1)}.not-top .site-logo{opacity:0}
main{position:relative;z-index:1}.hero{position:relative;margin-top:100px}.hero-container{padding-top:4rem;padding-bottom:4rem}.intro{color:var(--secondary);font-size:20px;margin:40px 0 7px}.hero h1{color:#fff;font-weight:600;font-size:40px;margin:0 0 36px;background:linear-gradient(180deg,#fff 0%,#636363 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.subtitle{width:380px;font-weight:300;font-size:20px;line-height:33px;margin:0 0 76px}.hero-actions{display:flex;align-items:center;gap:1rem;margin-bottom:120px}.social-icon{width:24px;height:24px}.social-icon img{display:block;width:100%;height:100%}.avatar-small{display:none}
.layered-section{position:relative;background:var(--background-light);scroll-margin-top:80px}.about::before,.site-footer::before{background:url('assets/structure/layer.svg') center bottom/1000px 80px no-repeat;content:"";height:80px;position:absolute;width:100%}.about::after,.site-footer::after{content:"";position:absolute;left:0;width:calc((100% - min(100%,1000px))/2);height:80px;background:var(--background-light);pointer-events:none}.about::before,.about::after{bottom:100%}.layered-section h2{color:var(--secondary);font-weight:400;font-size:20px;margin:0 0 2rem}.about h2{position:absolute;left:2rem;bottom:100%;margin:0}.about p,.experience article p{font-weight:300;line-height:30px}.about p{margin:0}
.experience .container,.skills .container{display:flex;flex-direction:column}.tab-layout{display:flex;gap:2rem}.experience-panels{flex:1}.experience article{min-height:315px}.experience article p{margin:0 0 1rem}.company-logo{height:45px;max-width:220px}.timeframe{font-size:var(--medium-size);padding:.5rem 0}.tabs{display:flex}.experience-tabs{flex-direction:column;gap:1rem}.tabs button{color:var(--color);font:inherit;cursor:pointer;user-select:none}.experience-tabs button{background:linear-gradient(var(--background-light),var(--background-light)) padding-box,linear-gradient(to right,var(--color),var(--background-light)) border-box;border:1px solid transparent;border-right:none;border-radius:10px 0 0 10px;padding:1rem;text-align:left;white-space:nowrap;min-width:200px}.experience-tabs button[aria-selected="true"]{background:linear-gradient(var(--background-light),var(--background-light)) padding-box,linear-gradient(to right,var(--secondary),var(--background-light)) border-box;color:var(--secondary)}.js [data-panel][hidden]{display:none}.js .no-js-heading{display:none}.no-js-heading{font-size:16px;font-weight:400;color:#fff;margin:1rem 0}
.skill-tabs{gap:1rem;width:100%;margin-bottom:1rem}.skill-tabs button{font-size:var(--small-size);box-shadow:var(--soft-shadow);padding:.5rem 1rem;border:0;border-radius:6px;background:var(--background-medium);white-space:nowrap}.skill-tabs button[aria-selected="true"]{color:var(--primary)}.skill-grid{width:100%;display:grid;grid-template-columns:repeat(5,1fr);gap:1rem;list-style:none;margin:0 0 1rem;padding:0}.skill-grid li{font-size:18px;box-shadow:var(--medium-shadow);padding:1.5rem;width:100%;border-radius:10px;background:var(--background);position:relative;overflow:hidden;min-width:0}.skill-grid li::after{content:"";position:absolute;bottom:-8px;right:2px;width:40px;height:40px;background:center/contain no-repeat;opacity:.5;transition:transform .2s ease-in-out}.skill-grid li:hover::after{transform:scale(1.05) translateY(-4px)}
.skill-grid li[data-logo="typescript.svg"]::after{background-image:url('assets/logos/typescript.svg')}.skill-grid li[data-logo="angular.svg"]::after{background-image:url('assets/logos/angular.svg')}.skill-grid li[data-logo="nestjs.svg"]::after{background-image:url('assets/logos/nestjs.svg')}.skill-grid li[data-logo="postgres.svg"]::after{background-image:url('assets/logos/postgres.svg')}.skill-grid li[data-logo="prisma.svg"]::after{background-image:url('assets/logos/prisma.svg')}.skill-grid li[data-logo="nx.svg"]::after{background-image:url('assets/logos/nx.svg')}.skill-grid li[data-logo="figma.svg"]::after{background-image:url('assets/logos/figma.svg')}.skill-grid li[data-logo="cloudflare.svg"]::after{background-image:url('assets/logos/cloudflare.svg')}.skill-grid li[data-logo="jest.svg"]::after{background-image:url('assets/logos/jest.svg')}.skill-grid li[data-logo="cypress.svg"]::after{background-image:url('assets/logos/cypress.svg')}.skill-grid li[data-logo="rxjs.svg"]::after{background-image:url('assets/logos/rxjs.svg')}.skill-grid li[data-logo="socketio.svg"]::after{background-image:url('assets/logos/socketio.svg')}.skill-grid li[data-logo="html.svg"]::after{background-image:url('assets/logos/html.svg')}.skill-grid li[data-logo="css.svg"]::after{background-image:url('assets/logos/css.svg')}.skill-grid li[data-logo="aggrid.svg"]::after{background-image:url('assets/logos/aggrid.svg')}.skill-grid li[data-logo="echarts.svg"]::after{background-image:url('assets/logos/echarts.svg')}.skill-grid li[data-logo="pdfmake.svg"]::after{background-image:url('assets/logos/pdfmake.svg')}.skill-grid li[data-logo="leaflet.svg"]::after{background-image:url('assets/logos/leaflet.svg')}.skill-grid li[data-logo="material.svg"]::after{background-image:url('assets/logos/material.svg')}.skill-grid li[data-logo="nodejs.svg"]::after{background-image:url('assets/logos/nodejs.svg')}.skill-grid li[data-logo="express.svg"]::after{background-image:url('assets/logos/express.svg')}.skill-grid li[data-logo="mysql.svg"]::after{background-image:url('assets/logos/mysql.svg')}.skill-grid li[data-logo="sqlite.svg"]::after{background-image:url('assets/logos/sqlite.svg')}.skill-grid li[data-logo="redis.svg"]::after{background-image:url('assets/logos/redis.svg')}.skill-grid li[data-logo="minio.svg"]::after{background-image:url('assets/logos/minio.svg')}.skill-grid li[data-logo="passport.svg"]::after{background-image:url('assets/logos/passport.svg')}.skill-grid li[data-logo="gcp.svg"]::after{background-image:url('assets/logos/gcp.svg')}.skill-grid li[data-logo="github.svg"]::after{background-image:url('assets/logos/github.svg')}.skill-grid li[data-logo="gitlab.svg"]::after{background-image:url('assets/logos/gitlab.svg')}.skill-grid li[data-logo="linode.svg"]::after{background-image:url('assets/logos/linode.svg')}.skill-grid li[data-logo="hetzner.svg"]::after{background-image:url('assets/logos/hetzner.svg')}.skill-grid li[data-logo="azure.svg"]::after{background-image:url('assets/logos/azure.svg')}.skill-grid li[data-logo="openai.svg"]::after{background-image:url('assets/logos/openai.svg')}.skill-grid li[data-logo="playwright.svg"]::after{background-image:url('assets/logos/playwright.svg')}.skill-grid li[data-logo="protractor.svg"]::after{background-image:url('assets/logos/protractor.svg')}.skill-grid li[data-logo="jasmine.svg"]::after{background-image:url('assets/logos/jasmine.svg')}.skill-grid li[data-logo="rive.svg"]::after{background-image:url('assets/logos/rive.svg')}.skill-grid li[data-logo="docker.svg"]::after{background-image:url('assets/logos/docker.svg')}.mobile-more{display:none}
.contact{position:relative;background:var(--background);scroll-margin-top:80px}.contact-columns{display:flex;gap:2rem}.contact-left,.contact-right{flex:1}.contact-heading{display:flex}.contact-heading h2{font-size:var(--hero-size);color:#fff;font-weight:600;line-height:50px;padding:50px 0;margin:0}.contact-heading img{margin-left:-40px;margin-top:30px;height:42px}.contact-links{display:flex;align-items:center;gap:4rem;padding:20px 0;margin:0;list-style:none}.contact-links a{display:flex;align-items:center;gap:1rem;text-decoration:none}.contact-right form{display:flex;flex-direction:column;gap:1rem}.contact-right form[hidden]{display:none}.field label{display:block}.field input,.field textarea{padding-top:1rem;padding-bottom:4px;width:100%;color:#fff;background-color:var(--background);border:0;border-bottom:1px solid;border-image:linear-gradient(to right,var(--background-dark),var(--secondary),var(--background-dark)) 1;border-radius:0}.field input:focus,.field textarea:focus{outline:0}.field textarea{resize:vertical;background-image:url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14 14L8 14L14 8L14 14Z' fill='%2300c399'/%3E%3C/svg%3E");background-position:right bottom;background-repeat:no-repeat}.validation{font-size:12px;color:var(--warn);visibility:hidden;margin:0;padding-top:.25rem;min-height:18px}.field.touched :invalid+.validation{visibility:visible}.form-actions{display:flex;justify-content:flex-end;padding-top:1rem}.form-status{padding:1rem;line-height:40px;margin:0}.form-status a{text-decoration:underline}
.site-footer{position:relative;width:100%;height:80px}.site-footer::before,.site-footer::after{bottom:0;z-index:-1}.site-footer .container{display:flex;align-items:center;height:80px;padding-top:0;padding-bottom:0}.footer-title{margin:0}.site-footer a{color:var(--color)}.imprint-page{background:var(--background-light)}.imprint h1{color:var(--secondary);font-weight:400;font-size:20px;margin:0}.imprint address{padding:20px 0;font-style:normal;font-weight:300;line-height:30px}.imprint address a{color:var(--color)}
@media(max-width:800px){.title-bar{display:none}.rays-container{max-width:100%;overflow:hidden}.hero{margin-top:10px}.hero-container{padding-top:2rem}.avatar-large img{top:100px;right:20px;width:200px;height:200px;object-fit:cover;border-radius:50%;background:linear-gradient(200deg,#e6e6e6,#b3b3b3);box-shadow:0 0 20px rgba(0,0,0,.3)}.intro{margin-top:0}.hero h1{font-size:30px}.subtitle{margin-bottom:36px;width:50%}.tab-layout{display:flex;flex-direction:column}.experience-tabs{flex-direction:row;flex-wrap:wrap;gap:.5rem;margin-bottom:2rem;order:-1}.experience-tabs button,.skill-tabs button{font-size:var(--small-size);box-shadow:var(--soft-shadow);padding:.5rem;border:0;border-radius:6px;background:var(--background-medium);min-width:0}.experience-tabs button[aria-selected="true"]{background:var(--background-medium);color:var(--primary)}.experience article{min-height:0}.skill-tabs{display:none}.skill-grid{grid-template-columns:1fr 1fr}.mobile-more{display:block;font-size:18px;box-shadow:var(--medium-shadow);padding:1.5rem;border-radius:10px;background:var(--background)}.contact-columns{flex-direction:column}}
@media(max-width:500px){.avatar-large{display:none}.avatar-small{display:block}.avatar-small img{display:block;border-radius:50%;width:200px;max-width:100%;aspect-ratio:1;object-fit:cover;background:linear-gradient(200deg,#e6e6e6,#b3b3b3);box-shadow:0 0 20px rgba(0,0,0,.3);margin:0 auto 36px}.subtitle{width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
