@layer reset,base,layout,components;:root{--color-deep: #0a0b12;--color-surface: #161822;--color-accent: #89b9c2;--color-bg: #26293a;--color-text: #c6c8d1;--color-border: color-mix(in srgb, var(--color-accent) 20%, transparent);--color-border-strong: color-mix(in srgb, var(--color-accent) 30%, transparent);--color-accent-tint: color-mix(in srgb, var(--color-accent) 10%, transparent);--font-body: "Noto Sans Mono", monospace;--font-heading: "Ubuntu Mono", monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1.125rem;--text-lg: 1.25rem;--text-xl: 1.5rem;--text-h3: 1.75rem;--text-h2: clamp(2rem, 3.5vw, 2.75rem);--text-h1: clamp(2.5rem, 5vw, 3.75rem);--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--space-20: 5rem;--space-24: 6rem;--radius-sm: 3px;--radius: 4px;--radius-lg: 6px;--max-width: 1400px;--content-width: min(88%, var(--max-width));--btn-pad-y: var(--space-2);--btn-pad-x: var(--space-4);--btn-font: var(--text-sm);--btn-pad-y-lg: var(--space-3);--btn-pad-x-lg: var(--space-5);--btn-font-lg: var(--text-base);--icon-sm: .85em;--icon-md: 1.1em}@layer reset{*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}img{display:block;max-width:100%;height:auto}button,input,textarea,select{font:inherit}}@layer base{html{background-color:var(--color-surface)}@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}body{font-family:var(--font-body);font-size:var(--text-base);line-height:1.7;color:var(--color-text);min-height:100vh;background:linear-gradient(to bottom,var(--color-deep),var(--color-bg));background-attachment:fixed}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:400;color:var(--color-accent);line-height:1.2}h1{font-size:var(--text-h1);margin-bottom:var(--space-4)}h2{font-size:var(--text-h2);margin-bottom:var(--space-6)}h3{font-size:var(--text-h3);margin-bottom:var(--space-4)}p{margin-bottom:1em}p:last-child{margin-bottom:0}a{color:var(--color-accent)}a:hover{opacity:.8}ul,ol{padding-left:var(--space-6);margin-bottom:1em}li{margin-bottom:var(--space-1)}blockquote{border-left:3px solid var(--color-accent);padding-left:var(--space-4);margin:var(--space-6) 0;opacity:.85;font-style:italic}code{font-family:var(--font-body);font-size:var(--text-sm);background:var(--color-surface);padding:.1em .35em;border-radius:var(--radius-sm)}pre{background:var(--color-surface);padding:var(--space-4);border-radius:var(--radius-lg);overflow-x:auto;margin-bottom:var(--space-4)}pre code{background:none;padding:0}}@layer layout{.page-wrapper{width:var(--content-width);margin-inline:auto}nav{position:sticky;top:0;z-index:100;background:var(--color-surface);border-bottom:1px solid var(--color-border)}.nav-inner{width:var(--content-width);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;padding:var(--space-4) 0;gap:var(--space-6)}.nav-logo img{height:var(--space-16);width:auto}.nav-links{display:flex;align-items:center;gap:var(--space-6);list-style:none;padding:0;margin:0}.nav-links a{color:var(--color-text);font-size:var(--text-sm);text-decoration:none;transition:color .2s}.nav-links a:hover{color:var(--color-accent);opacity:1}.nav-links .nav-accent{color:var(--color-accent)}.nav-mobile{display:none}.nav-mobile summary{list-style:none;cursor:pointer;user-select:none}.nav-mobile summary::-webkit-details-marker{display:none}.nav-mobile .nav-dropdown{position:absolute;top:100%;right:0;background:var(--color-surface);border:1px solid var(--color-border);border-top:none;min-width:180px;z-index:101}.nav-mobile .nav-dropdown a{display:block;padding:var(--space-3) var(--space-5);color:var(--color-text);font-size:var(--text-sm);text-decoration:none}.nav-mobile .nav-dropdown a:hover{background:var(--color-accent-tint);color:var(--color-accent)}@media(max-width:768px){.nav-links{display:none}.nav-mobile{display:block;position:relative}}main{padding-block:var(--space-12)}section{padding-block:var(--space-20)}footer{background:var(--color-surface);border-top:1px solid var(--color-border);padding-block:var(--space-8)}.footer-inner{width:var(--content-width);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);flex-wrap:wrap}.footer-inner img{height:var(--space-16);width:auto}.footer-imprint{font-size:var(--text-xs);color:var(--color-text);opacity:.7;text-align:right}.back-to-top{position:fixed;bottom:var(--space-6);right:var(--space-6);z-index:100;background:var(--color-accent);color:var(--color-surface);width:var(--space-10);height:var(--space-10);border-radius:50%;display:flex;align-items:center;justify-content:center;text-decoration:none;opacity:0;visibility:hidden;transition:opacity .2s,visibility 0s linear .2s}.back-to-top.visible{opacity:.85;visibility:visible;transition-delay:0s}.back-to-top:hover{opacity:1}.hero{min-height:70vh;display:flex;flex-direction:column;justify-content:center}.hero p{font-size:var(--text-lg)}.hero-actions{display:flex;gap:var(--space-4);flex-wrap:wrap;margin-top:var(--space-8)}.about-grid{display:grid;grid-template-columns:1fr auto;gap:var(--space-8) var(--space-12);align-items:start}.about-portrait img{width:280px;height:280px;object-fit:cover;border-radius:var(--radius);border:1px solid var(--color-border-strong)}@media(max-width:640px){.about-grid{grid-template-columns:1fr}.about-portrait img{width:200px;height:200px}}.case-study-content h1{margin-bottom:var(--space-8)}.case-study-content img{width:auto;max-height:480px;margin:var(--space-6) auto;border-radius:var(--radius)}.case-study-content p:has(>img+img){display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:var(--space-6);margin-block:var(--space-6)}.case-study-content p:has(>img+img)>img{flex:0 1 auto;min-width:0;margin:0}}@layer components{.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-1);padding:var(--btn-pad-y) var(--btn-pad-x);border-radius:var(--radius);font-family:var(--font-body);font-size:var(--btn-font);line-height:1.2;text-decoration:none;cursor:pointer;border:1px solid transparent;background:none;transition:opacity .2s ease-in-out,background .2s ease-in-out,color .2s ease-in-out}.btn-primary{background:var(--color-accent);color:var(--color-surface);font-weight:600}.btn-outline{background:transparent;color:var(--color-accent);border-color:var(--color-accent)}.btn-lg{padding:var(--btn-pad-y-lg) var(--btn-pad-x-lg);font-size:var(--btn-font-lg)}.btn-icon{padding:var(--btn-pad-y);aspect-ratio:1}.btn-icon.btn-lg{padding:var(--btn-pad-y-lg)}.btn svg{width:var(--icon-sm);height:var(--icon-sm);flex:none}.btn-icon svg{width:var(--icon-md);height:var(--icon-md)}.btn:hover{opacity:.85}#projects{container-type:inline-size;container-name:projects-section}.projects-grid{display:grid;grid-template-columns:1fr;gap:var(--space-6)}@container projects-section (min-width: 680px){.projects-grid{grid-template-columns:repeat(2,1fr)}}@container projects-section (min-width: 1140px){.projects-grid{grid-template-columns:repeat(4,1fr)}}.project-card{container-type:inline-size;container-name:project-card;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden;display:flex;flex-direction:column}.project-card a.card-image-link{display:block}.project-card img{width:100%;height:200px;object-fit:cover}.card-body{padding:var(--space-5);flex:1;display:flex;flex-direction:column}.card-body h3{font-size:var(--text-xl);margin-bottom:var(--space-3)}.card-body p{font-size:var(--text-base);flex:1;margin-bottom:var(--space-4)}.card-actions{display:flex;gap:var(--space-2)}.card-actions .btn{font-size:clamp(var(--text-xs),3.5cqi,var(--text-base));padding:var(--space-1) clamp(var(--space-1),2cqi,var(--space-3));text-transform:uppercase;letter-spacing:.06em;white-space:nowrap}.card-actions .btn:hover{background:var(--color-accent);color:var(--color-surface);opacity:1}.projects-cta{margin-top:var(--space-10);text-align:center}form{display:flex;flex-direction:column;gap:var(--space-4)}.form-group{display:flex;flex-direction:column;gap:var(--space-1)}.form-group label{font-size:var(--text-sm);color:var(--color-accent)}.form-group input,.form-group textarea{background:var(--color-surface);border:1px solid var(--color-border-strong);border-radius:var(--radius);padding:var(--space-3);color:var(--color-text);width:100%}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--color-accent)}.form-group textarea{resize:vertical;min-height:180px}#contact{container-type:inline-size;container-name:contact-section}.contact-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-8);align-items:start}@container contact-section (min-width: 768px){.contact-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-12)}.contact-grid form{max-width:540px}}}