@font-face{font-family:Manrope;src:url('assets/fonts/Manrope-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Manrope;src:url('assets/fonts/Manrope-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:Manrope;src:url('assets/fonts/Manrope-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
:root{--paper:#f5f7f3;--ink:#25282a;--forest:#1f4938;--soft:#e6ece3;--muted:#4e6157;--line:#dce5dc;--shell:min(1200px,calc(100% - 64px));color-scheme:light}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.6 Manrope,system-ui,sans-serif}
button,input,select,textarea{font:inherit}
a{color:inherit}
img{max-width:100%}
.shell{width:var(--shell);margin-inline:auto}
.skip-link{position:absolute;left:1rem;top:-5rem;z-index:20;padding:.65rem .9rem;background:var(--ink);color:#fff}
.skip-link:focus{top:1rem}
.site-header{position:relative;z-index:10;background:#fff}
.header-inner{min-height:80px;display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.brand{display:inline-flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none;white-space:nowrap}
.brand-mark{display:block;width:48px;height:29px;object-fit:contain;flex:none}
.brand-wordmark{color:var(--ink);font-size:1.2rem;font-weight:500;letter-spacing:-.025em}
.site-header nav{display:flex;align-items:center;gap:clamp(.8rem,2vw,1.7rem);font-size:.82rem}
.site-header nav a{text-decoration:none}
.site-header nav a:not(.header-cta):hover{text-decoration:underline;text-underline-offset:.3em}
.header-cta{display:inline-flex;min-height:44px;align-items:center;justify-content:center;padding:.6rem 1.1rem;border-radius:100px;background:var(--forest);color:#fff;font-weight:500}
.button{display:inline-flex;min-height:48px;align-items:center;justify-content:center;gap:.55rem;padding:.72rem 1.2rem;border:1px solid transparent;border-radius:100px;font-weight:600;text-decoration:none}
.button-dark{background:var(--forest);color:#fff}
.button-dark:hover,.header-cta:hover{background:#153e2d}
.quiet-link{display:inline-flex;min-height:44px;align-items:center;gap:.4rem;color:var(--forest);font-weight:600;text-decoration:none}
.quiet-link:hover{text-decoration:underline;text-underline-offset:.3em}
.eyebrow{margin:0 0 1rem;color:var(--forest);font-size:.75rem;font-weight:600;letter-spacing:.12em;line-height:1.3;text-transform:uppercase}
:focus-visible{outline:3px solid #446f58;outline-offset:3px}
@media(max-width:760px){:root{--shell:min(100% - 32px,1200px)}.header-inner{min-height:72px}.brand-mark{width:40px;height:25px}.brand-wordmark{font-size:1.05rem}.site-header nav{gap:.75rem}.site-header .header-inner nav>a:not(.header-cta){display:inline-flex}.header-cta{padding:.55rem .8rem}}
@media(max-width:520px){.site-header nav{gap:.62rem;font-size:.72rem}.site-header nav .header-cta{display:inline-flex;min-height:36px;padding:.43rem .65rem;font-size:0}.site-header nav .header-cta::before{content:'Projekt';font-size:.72rem;font-weight:600}.site-header nav>a[href="#kontakt"]:not(.header-cta){display:none}.brand{gap:6px}.brand-wordmark{font-size:.92rem}.brand-mark{width:33px;height:23px}}
@media(max-width:380px){.header-inner{height:auto;flex-wrap:wrap;justify-content:center;gap:.35rem;padding:.55rem 0}.site-header nav{width:100%;justify-content:center;gap:1.2rem}.site-header nav .header-cta{margin-left:.2rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Shared readable closing section across the catalogue and knowledge pages. */
body .site-footer{background:#173b2b;color:#f5f7f3;padding:2.6rem 0;border-top:1px solid #53705c}
body .site-footer .shell{display:grid;grid-template-columns:1fr auto;gap:1rem 2rem;align-items:start}
body .site-footer .brand,body .site-footer .brand .brand-wordmark{color:#f5f7f3}
body .site-footer .brand-mark{filter:brightness(0) invert(1)}
body .site-footer p{color:#d8e7d6;font-size:.9rem;line-height:1.65;margin:0}
body .site-footer strong{color:inherit}
body .site-footer nav{display:flex;gap:1.3rem;flex-wrap:wrap;grid-column:1/-1}
body .site-footer a{display:inline-flex;align-items:center;min-height:44px;color:#f5f7f3;font-size:1rem;text-underline-offset:.3em}
body .site-footer .footer-owner{grid-column:1/-1;font-size:.875rem;color:#d8e7d6}
@media(max-width:760px){body .site-footer .shell{grid-template-columns:1fr}body .site-footer nav{gap:.4rem 1.2rem}body .site-footer p{max-width:100%}}