*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0a0a0a;--surface: #111111;--border: #222222;--text: #DADFF7;--muted: #A0C1D1;--accent: #74214A;--accent2: #A0C1D1;--accent3: #74214A;--nav-h: 64px;--foot-h: 52px;--font-display: "Georgia", "Times New Roman", serif;--font-body: "Courier New", "Courier", monospace;--font-ui: "Trebuchet MS", "Helvetica Neue", sans-serif;--ease: cubic-bezier(.25, .8, .25, 1)}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:14px;line-height:1.7;overflow-x:hidden;min-height:100vh}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}header{position:fixed;top:0;left:0;right:0;z-index:1000;height:var(--nav-h);background:var(--bg);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 2rem;justify-content:space-between}.nav-brand{font-family:var(--font-display);font-size:1.35rem;letter-spacing:.02em;cursor:pointer;color:var(--text);text-decoration:none;transition:color .2s;white-space:nowrap}.nav-brand:hover,.nav-brand span{color:var(--accent)}nav.nav-links{display:flex;align-items:center;gap:.15rem}nav.nav-links a{font-family:var(--font-ui);font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);text-decoration:none;padding:.45rem .75rem;border-radius:2px;transition:color .18s,background .18s;cursor:pointer;border:none;background:none}nav.nav-links a:hover,nav.nav-links a.active{color:var(--text);background:var(--border)}.burger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;padding:6px}.burger span{display:block;width:24px;height:2px;background:var(--text);transition:transform .3s var(--ease),opacity .3s}.burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}.burger.open span:nth-child(2){opacity:0}.burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}.mobile-menu{display:none;position:fixed;top:var(--nav-h);left:0;right:0;background:var(--surface);border-bottom:1px solid var(--border);z-index:999;flex-direction:column;padding:1rem 2rem 1.5rem;gap:.25rem}.mobile-menu.open{display:flex}.mobile-menu a{font-family:var(--font-ui);font-size:.9rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);text-decoration:none;padding:.6rem 0;border-bottom:1px solid var(--border);transition:color .18s;cursor:pointer}.mobile-menu a:last-child{border-bottom:none}.mobile-menu a:hover{color:var(--accent)}@media (max-width: 720px){nav.nav-links{display:none}.burger{display:flex}}main{position:fixed;top:var(--nav-h);bottom:var(--foot-h);left:0;right:0;overflow:hidden}.page{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .35s var(--ease);overflow-y:auto}.page.active{opacity:1;pointer-events:all}#page-home{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2rem;padding:2rem}.home-subtitle{font-family:var(--font-display);font-size:clamp(.9rem,2vw,1.1rem);color:var(--muted);letter-spacing:.08em;text-transform:uppercase;margin-bottom:1rem}.home-buttons{display:flex;gap:1.5rem;flex-wrap:wrap;justify-content:center}.home-btn{font-family:var(--font-display);font-size:clamp(2rem,5vw,4rem);letter-spacing:-.01em;color:var(--text);background:none;border:1px solid var(--border);padding:clamp(1.5rem,4vw,3rem) clamp(2rem,5vw,4.5rem);cursor:pointer;transition:background .22s,color .22s,border-color .22s,transform .22s var(--ease);position:relative;overflow:hidden}.home-btn:after{content:"";position:absolute;bottom:0;left:0;width:0;height:3px;transition:width .3s var(--ease)}.home-btn:hover{transform:translateY(-4px)}.home-btn.btn-it:after{background:var(--accent)}.home-btn.btn-it:hover{border-color:var(--accent);color:var(--accent)}.home-btn.btn-design:after{background:var(--accent2)}.home-btn.btn-design:hover{border-color:var(--accent2);color:var(--accent2)}.home-btn.btn-photo:after{background:var(--accent3)}.home-btn.btn-photo:hover{border-color:var(--accent3);color:var(--accent3)}.home-btn:hover:after{width:100%}#page-it{padding:3rem 2rem}.page-heading{font-family:var(--font-display);font-size:clamp(2rem,5vw,3.5rem);letter-spacing:-.02em;color:var(--text);margin-bottom:.4rem}.page-heading span{color:var(--accent)}.page-rule{width:60px;height:3px;background:var(--accent);margin-bottom:3rem}.it-articles{display:flex;flex-direction:column;gap:4rem;max-width:900px;margin:0 auto}.it-article{display:grid;grid-template-columns:1fr 1fr;gap:2rem;border-top:1px solid var(--border);padding-top:2.5rem}@media (max-width: 640px){.it-article{grid-template-columns:1fr}}.it-article-text{display:flex;flex-direction:column;gap:.75rem}.it-article h2{font-family:var(--font-display);font-size:1.5rem;font-weight:400;color:var(--text)}.tech-tags{display:flex;flex-wrap:wrap;gap:.4rem}.tech-tag{font-family:var(--font-ui);font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;color:var(--accent);border:1px solid var(--accent);padding:.15rem .55rem;border-radius:1px}.it-article p{color:var(--muted);font-size:.9rem;line-height:1.8}.it-article-img{aspect-ratio:4/3;overflow:hidden;position:relative}.it-article-img img{width:100%;height:100%;object-fit:cover;filter:grayscale(40%) contrast(1.1);transition:filter .4s,transform .4s var(--ease)}.it-article-img:hover img{filter:grayscale(0%) contrast(1);transform:scale(1.03)}#page-design{overflow:hidden!important;display:flex;flex-direction:row;position:relative}.design-scroll-track{display:flex;flex-direction:row;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;width:100%;height:100%}.design-scroll-track::-webkit-scrollbar{display:none}.design-article{flex-shrink:0;width:100vw;height:100%;scroll-snap-align:start;display:grid;grid-template-columns:1fr 1.6fr;overflow:hidden}@media (max-width: 700px){.design-article{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow-y:auto}}.design-article-meta{display:flex;flex-direction:column;justify-content:center;gap:1.4rem;padding:3rem 2.5rem;border-right:1px solid var(--border);background:var(--surface);overflow-y:auto;scrollbar-width:none}.design-article-meta::-webkit-scrollbar{display:none}.design-slide-num{font-family:var(--font-ui);font-size:.7rem;text-transform:uppercase;letter-spacing:.18em;color:var(--muted)}.design-article h2{font-family:var(--font-display);font-size:clamp(1.6rem,2.5vw,2.6rem);font-weight:400;color:var(--text);line-height:1.2}.design-article-desc{color:var(--muted);font-size:.88rem;line-height:1.8}.design-article-images{display:grid;grid-template-columns:repeat(2,1fr);grid-auto-rows:1fr;gap:3px;overflow:hidden;background:var(--bg)}.design-article-images.layout-1{grid-template-columns:1fr}.design-article-images.layout-3>:first-child{grid-column:1 / -1}.design-img-wrap{overflow:hidden;position:relative;background:var(--border)}.design-img-wrap img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}.design-img-wrap:hover img{transform:scale(1.04)}.design-article .tech-tag{border-color:var(--accent2);color:var(--accent2)}.design-dots{position:absolute;bottom:1.25rem;left:50%;transform:translate(-50%);display:flex;gap:.5rem;z-index:10;pointer-events:none}.design-dot{width:6px;height:6px;border-radius:50%;background:var(--border);transition:background .3s,transform .3s}.design-dot.active{background:var(--accent2);transform:scale(1.4)}#page-photo{padding:3rem 2rem 5rem;overflow-y:auto;overflow-x:visible}#page-photo .page-heading span{color:var(--accent3)}#page-photo .page-rule{background:var(--accent3)}.photo-grid{display:flex;flex-wrap:wrap;gap:.6rem;max-width:1100px;margin:0 auto;align-items:flex-start;overflow:visible}.photo-item{flex:1 1 220px;cursor:pointer;position:relative;aspect-ratio:4/3}.photo-item-inner{position:absolute;inset:0;overflow:hidden;transform-origin:center center;transition:transform .4s var(--ease),box-shadow .4s var(--ease);z-index:1}.photo-item:hover .photo-item-inner{transform:scale(1.5);z-index:20;box-shadow:0 0 0 1px #00000026,0 8px 24px #0000008c,0 20px 60px #0006;overflow:visible}.photo-item img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(100%) brightness(.8);transition:filter .4s var(--ease)}.photo-item:hover .photo-item-inner img{filter:grayscale(0%) brightness(1)}.photo-lightbox{position:fixed;inset:0;z-index:3000;background:#000000eb;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.25rem;opacity:0;pointer-events:none;transition:opacity .3s;backdrop-filter:blur(6px);padding:2rem}.photo-lightbox.open{opacity:1;pointer-events:all}.lightbox-img-wrap{max-width:min(90vw,1000px);max-height:75vh;position:relative}.lightbox-img-wrap img{max-width:100%;max-height:75vh;object-fit:contain;display:block;box-shadow:0 20px 80px #000c}.lightbox-caption{text-align:center;max-width:600px}.lightbox-caption h3{font-family:var(--font-display);font-size:1.2rem;font-weight:400;margin-bottom:.35rem}.lightbox-caption p{font-size:.82rem;color:var(--muted);line-height:1.7}.lightbox-close{position:absolute;top:1.25rem;right:1.25rem;background:none;border:none;color:var(--muted);font-size:1.8rem;cursor:pointer;line-height:1;transition:color .18s;z-index:1}.lightbox-close:hover{color:var(--text)}.lightbox-nav{display:flex;gap:1rem}.lightbox-nav button{background:var(--surface);border:1px solid var(--border);color:var(--text);font-family:var(--font-ui);font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;padding:.5rem 1.25rem;cursor:pointer;transition:border-color .2s,color .2s}.lightbox-nav button:hover{border-color:var(--accent3);color:var(--accent3)}#page-about{padding:3rem 2rem 4rem}.about-inner{max-width:820px;margin:0 auto;display:grid;grid-template-columns:260px 1fr;gap:3rem}@media (max-width: 640px){.about-inner{grid-template-columns:1fr}}.about-portrait{position:sticky;top:1rem;display:flex;flex-direction:column;gap:1.25rem;height:fit-content}.about-portrait img{width:100%;aspect-ratio:3/4;object-fit:cover;filter:grayscale(20%) contrast(1.1)}.about-portrait h3{font-family:var(--font-display);font-size:1.5rem;font-weight:400}.about-portrait .subtitle{font-family:var(--font-ui);font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}.about-content{display:flex;flex-direction:column;gap:2rem}.about-content h2{font-family:var(--font-display);font-size:clamp(1.8rem,4vw,2.8rem);font-weight:400;line-height:1.2}.about-content h2 span{color:var(--accent)}.about-content p{color:var(--muted);line-height:1.9;font-size:.9rem}.skills-section h4{font-family:var(--font-ui);font-size:.72rem;text-transform:uppercase;letter-spacing:.14em;color:var(--muted);margin-bottom:1rem}.skills-list{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}.skill-item{font-family:var(--font-body);font-size:.8rem;color:var(--text);background:var(--surface);border:1px solid var(--border);padding:.3rem .75rem;transition:border-color .2s,color .2s}.skill-item:hover{border-color:var(--accent);color:var(--accent)}footer{position:fixed;bottom:0;left:0;right:0;z-index:1000;height:var(--foot-h);background:var(--bg);border-top:1px solid var(--border);display:flex;align-items:center;justify-content:center;padding:0 2rem;gap:1.5rem}.footer-sep{width:1px;height:12px;background:var(--border);flex-shrink:0}.footer-copy{font-family:var(--font-ui);font-size:.68rem;color:var(--muted);letter-spacing:.06em;white-space:nowrap}.footer-links{font-family:var(--font-ui);font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);text-decoration:none;transition:color .18s;cursor:pointer}.footer-links:hover{color:var(--accent)}.footer-social{color:var(--muted);text-decoration:none;font-family:var(--font-ui);font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;transition:color .18s;display:flex;align-items:center;gap:.35rem}.footer-social:hover{color:var(--accent)}.icon-svg{width:14px;height:14px;fill:currentColor}.modal-overlay{position:fixed;inset:0;z-index:2000;background:#000c;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .3s;backdrop-filter:blur(4px)}.modal-overlay.open{opacity:1;pointer-events:all}.modal{background:var(--surface);border:1px solid var(--border);width:min(520px,90vw);padding:2.5rem;position:relative;transform:translateY(20px);transition:transform .35s var(--ease)}.modal-overlay.open .modal{transform:translateY(0)}.modal-close{position:absolute;top:1rem;right:1rem;background:none;border:none;color:var(--muted);font-size:1.4rem;cursor:pointer;line-height:1;transition:color .18s}.modal-close:hover{color:var(--text)}.modal h2{font-family:var(--font-display);font-size:1.8rem;font-weight:400;margin-bottom:.25rem}.modal-sub{font-size:.75rem;color:var(--muted);font-family:var(--font-ui);text-transform:uppercase;letter-spacing:.1em;margin-bottom:2rem}.form-group{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1.25rem}.form-group label{font-family:var(--font-ui);font-size:.68rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}.form-group input,.form-group textarea{background:var(--bg);border:1px solid var(--border);color:var(--text);font-family:var(--font-body);font-size:.9rem;padding:.65rem .85rem;outline:none;transition:border-color .2s;resize:vertical}.form-group input:focus,.form-group textarea:focus{border-color:var(--accent)}.form-group textarea{min-height:110px}.btn-submit{font-family:var(--font-ui);font-size:.78rem;text-transform:uppercase;letter-spacing:.14em;color:var(--bg);background:var(--accent);border:none;padding:.75rem 2rem;cursor:pointer;width:100%;transition:background .2s,transform .15s}.btn-submit:hover{background:#d8ff70;transform:translateY(-1px)}.btn-submit:active{transform:translateY(0)}.form-success{display:none;text-align:center;padding:1rem 0;font-family:var(--font-display);font-size:1.2rem;color:var(--accent)}#page-impressum{padding:3rem 2rem 4rem}.impressum-inner{max-width:600px;margin:0 auto}.impressum-inner h2{font-family:var(--font-display);font-size:1.2rem;font-weight:400;color:var(--muted);margin:1.5rem 0 .5rem}.impressum-inner p{color:var(--muted);font-size:.88rem;line-height:1.8}@keyframes scrollHintPulse{0%,to{opacity:.3}50%{opacity:.7}}.design-scroll-hint{animation:scrollHintPulse 2.5s ease-in-out infinite}