:root{--navy:#102c3b;--deep:#071d28;--teal:#00536c;--blue:#22768e;--aqua:#67bed2;--pale-blue:#e4edf3;--pale-teal:#d9efed;--surface-cool:#f3f7f8;--mineral:#d6e2e3;--mineral-accent:#476e73;--gold:#ad8a4e;--gold-dark:#765a2d;--paper:#fbfaf7;--ink:#182931;--muted:#5d6c72;--line:rgba(16,44,59,.17);--max:1180px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.68 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif}
a{color:inherit}
img{max-width:100%;display:block}
:focus-visible{outline:3px solid var(--aqua);outline-offset:4px}
.skip{position:fixed;top:-5rem;left:1rem;z-index:99;padding:.7rem 1rem;background:var(--deep);color:#fff}
.skip:focus{top:1rem}
.container{width:min(calc(100% - 3rem),var(--max));margin:auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(251,250,247,.95);border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}
.header-inner{height:78px;display:flex;align-items:center;justify-content:space-between;gap:2rem}
.brand{display:flex;flex-direction:column;text-decoration:none;color:var(--navy);line-height:1}
.brand strong{letter-spacing:.17em}
.brand span{margin-top:.4rem;color:var(--muted);font-size:.64rem;letter-spacing:.11em}
.site-nav{display:flex;align-items:center;gap:1.45rem}
.site-nav a{text-decoration:none;color:var(--navy);font-size:.89rem;font-weight:700}
.site-nav a:hover,.site-nav a[aria-current=page]{color:var(--teal)}
.nav-contact{padding:.6rem .9rem;border:1px solid var(--teal)}
.nav-toggle{display:none;border:0;background:none;color:var(--navy);font:700 1rem inherit;padding:.5rem}
.hero{position:relative;isolation:isolate;min-height:min(790px,calc(100vh - 78px));display:grid;align-items:center;overflow:hidden;background:#e8e2d7}
.hero:before{content:"";position:absolute;inset:0;z-index:-2;background:url("hero-ki-verwaltung.webp") center/cover no-repeat}
.hero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(247,243,236,.99) 0%,rgba(247,243,236,.94) 25%,rgba(247,243,236,.65) 39%,rgba(247,243,236,.08) 61%)}
.hero-copy{width:min(54%,48rem);padding:6rem 0}
.eyebrow{margin:0 0 1.2rem;color:var(--teal);font-size:.78rem;font-weight:700;letter-spacing:.11em;line-height:1.5;text-transform:uppercase}
h1,h2,h3{margin:0;color:var(--deep);line-height:1.12;text-wrap:balance}
h1,.section-head h2,.page-intro h1,.band h2{font-family:Georgia,"Times New Roman",serif;font-weight:600;letter-spacing:-.03em}
h1{max-width:12ch;font-size:clamp(2.7rem,5vw,5.2rem)}
.hero-lead{max-width:43rem;margin:1.7rem 0 0;font-size:clamp(1.03rem,1.4vw,1.2rem)}
.hero-note{font-weight:700;color:var(--navy)}
.button{display:inline-flex;align-items:center;min-height:48px;margin-top:1.2rem;padding:.75rem 1.15rem;background:var(--teal);border:1px solid var(--teal);color:#fff;text-decoration:none;font-weight:700}
.button:after,.text-link:after{content:" →"}
.button.secondary{background:transparent;color:var(--navy);border-color:var(--navy)}
section{padding:clamp(4.5rem,8vw,8rem) 0}
.soft{background:var(--surface-cool)}
.dark{background:var(--navy);color:rgba(255,255,255,.84)}
.dark h2,.dark h3{color:#fff}
.dark .eyebrow{color:var(--aqua)}
.section-head{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,6vw,6rem);align-items:start;margin-bottom:3.4rem}
.section-head h2,.page-intro h1,.band h2{font-size:clamp(2.25rem,4.4vw,4.35rem)}
.section-head h2{text-wrap:wrap}
.section-head p{margin:0;max-width:44rem;font-size:1.08rem}
.grid{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.two{grid-template-columns:repeat(2,1fr)}
.three{grid-template-columns:repeat(3,1fr)}
.four{grid-template-columns:repeat(4,1fr)}
.card{padding:clamp(1.5rem,3vw,2.5rem);background:var(--paper)}
.card h3{margin-bottom:.9rem;font-size:1.35rem}
.card p{margin:0;color:var(--muted)}
.number{display:block;margin-bottom:2rem;color:var(--teal);font:2.3rem Georgia,serif}
.phase{display:flex;min-height:26rem;flex-direction:column}
.meta{margin-top:auto;padding-top:1.5rem;border-top:1px solid var(--line)}
.meta p+p{margin-top:.7rem}
.meta strong{color:var(--navy)}
.status{display:block;margin-bottom:.8rem;color:var(--teal);font-size:.76rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.band{display:grid;grid-template-columns:1.15fr .85fr;gap:4rem;align-items:center}
.band h2{margin-bottom:1rem}
.text-link{display:inline-block;margin-top:1rem;color:var(--blue);font-weight:700;text-underline-offset:.25rem}
.contact-pair{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.contact-tile{display:block;padding:1.35rem;border:1px solid rgba(255,255,255,.28);color:#fff;text-decoration:none}
.contact-tile small{display:block;color:var(--aqua);font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.page-intro{padding:clamp(4.8rem,9vw,8rem) 0;background:var(--surface-cool);border-bottom:1px solid var(--line)}
.page-intro h1{max-width:18ch}
.page-intro .lead{max-width:54rem;font-size:1.18rem}
.services{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
.service{padding:2.2rem;background:var(--paper)}
.service h2{font-size:1.5rem;margin-bottom:.7rem}
.projects{display:grid;gap:1rem}
.project{display:grid;grid-template-columns:4rem 1fr auto;gap:1.4rem;padding:2rem;background:#fff;border:1px solid var(--line)}
.project .idx{color:var(--teal);font:2rem Georgia,serif}
.project h2{font-size:1.42rem;margin-bottom:.5rem}
.project p{margin:0;color:var(--muted)}
.duration{align-self:start;white-space:nowrap;padding:.3rem .6rem;border:1px solid var(--line);font-size:.82rem;font-weight:700}
.profile{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2.5rem,7vw,7rem)}
.profile aside{padding:2rem;background:var(--navy);color:#fff}
.profile aside h2{color:#fff}
.quote{margin:2rem 0 0;padding-left:1.3rem;border-left:3px solid var(--teal);font:1.3rem/1.5 Georgia,serif}
.prose{max-width:800px}
.prose h2{margin:2.5rem 0 .7rem;font-size:1.55rem}
.prose address{font-style:normal}
.note{margin-top:2rem;padding:1.1rem;background:var(--pale-blue);border-left:3px solid var(--teal)}
footer{padding:3rem 0;background:var(--deep);color:rgba(255,255,255,.75)}
.footer-grid{display:grid;grid-template-columns:1fr auto;gap:2rem}
.footer-brand{color:#fff;font-weight:700;letter-spacing:.08em}
.footer-links{display:flex;gap:1.2rem;align-items:end}
.footer-grid a{color:#fff}
@media(max-width:1080px){.site-nav{gap:.8rem}
.site-nav a{font-size:.8rem}
.four{grid-template-columns:1fr 1fr}
}
@media(max-width:820px){.container{width:min(calc(100% - 2rem),var(--max))}
.nav-toggle{display:block}
.site-nav{position:fixed;display:none;top:78px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;padding:1rem;background:var(--paper);border-bottom:1px solid var(--line)}
.site-nav.open{display:flex}
.site-nav a{padding:.8rem;font-size:1rem}
.hero{display:block;min-height:0;background:var(--paper)}
.hero:before{position:relative;display:block;height:54vw;min-height:290px;background-position:68% center}
.hero:after{display:none}
.hero-copy{width:auto;padding:3.6rem 0}
.section-head,.band,.profile{grid-template-columns:1fr;gap:1.7rem}
.three,.two,.services{grid-template-columns:1fr}
.project{grid-template-columns:3rem 1fr}
.duration{grid-column:2;justify-self:start}
}
@media(max-width:560px){.brand span{display:none}
.four{grid-template-columns:1fr}
.phase{min-height:0}
.contact-pair{grid-template-columns:1fr}
.project{grid-template-columns:1fr;padding:1.4rem}
.duration{grid-column:1}
.footer-grid{grid-template-columns:1fr}
.footer-links{align-items:start}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
}


/* Accessibility and responsive refinements: BITV 2.0 / WCAG 2.1 AA baseline */
:root{--focus-dark:#00536c;--header-height:82px}

html{font-size:112.5%;scroll-padding-top:calc(var(--header-height) + 1rem);-webkit-text-size-adjust:100%;text-size-adjust:100%}

body{min-width:0}

:focus-visible{outline:3px solid var(--focus-dark);outline-offset:4px}

.dark :focus-visible,footer :focus-visible,.profile aside :focus-visible,.hero-rail :focus-visible{outline-color:var(--aqua)}

.skip{font-weight:700}

.header-inner{min-height:var(--header-height);height:auto;padding-block:.65rem}

.brand span{font-size:.78rem;line-height:1.35}

.site-nav a{display:inline-flex;min-height:44px;align-items:center;font-size:.9rem;line-height:1.35}

.site-nav a:hover,.site-nav a:focus-visible,.site-nav a[aria-current=page]{text-decoration:underline;text-decoration-thickness:.12em;text-underline-offset:.32em}

.nav-contact[aria-current=page]{box-shadow:inset 0 -3px 0 var(--teal)}

.nav-toggle{min-width:48px;min-height:48px;align-items:center;justify-content:center;border:1px solid var(--teal);font:700 1rem/1.2 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;cursor:pointer}

.eyebrow,.status{font-size:.8rem}

.duration{font-size:.84rem}

.hero:after{background:linear-gradient(90deg,rgba(247,243,236,.99) 0%,rgba(247,243,236,.97) 42%,rgba(247,243,236,.94) 58%,rgba(247,243,236,.2) 76%,rgba(247,243,236,.04) 100%)}

.hero-copy{width:min(56%,48rem)}

.dark .text-link{color:var(--aqua)}

.button,.contact-tile,.text-link,.footer-grid a{overflow-wrap:anywhere}

.button{max-width:100%;justify-content:center;text-align:center;white-space:normal}

.contact-tile{min-height:48px}

.card,.service,.project,.profile>*,.band>*{min-width:0}

@media(max-width:1120px){.nav-toggle{display:inline-flex}
.site-nav{position:fixed;display:none;top:var(--header-height);right:0;left:0;max-height:calc(100vh - var(--header-height));max-height:calc(100dvh - var(--header-height));overflow-y:auto;flex-direction:column;align-items:stretch;gap:0;padding:1rem;background:var(--paper);border-bottom:2px solid var(--teal);box-shadow:0 1rem 2rem rgba(7,29,40,.16)}
.site-nav.open{display:flex}
.site-nav a{min-height:48px;padding:.75rem 1rem;font-size:1rem}
.four{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:820px){.hero-copy{width:auto}
.hero-lead,.page-intro .lead,.section-head p{font-size:1rem}
}

@media(max-width:560px){:root{--header-height:76px}
html{font-size:100%}
.header-inner{gap:.75rem}
.brand strong{font-size:.95rem}
.eyebrow,.status,.duration{font-size:.875rem}
h1{font-size:clamp(2.25rem,12vw,3.1rem)}
.section-head h2,.page-intro h1,.band h2{font-size:clamp(2rem,10vw,2.8rem)}
.button{width:100%}
.four{grid-template-columns:1fr}
footer{overflow-wrap:anywhere}
}

@media(forced-colors:active){.button,.nav-contact,.contact-tile,.card,.service,.project{border:2px solid ButtonText}
.site-nav a[aria-current=page]{outline:2px solid LinkText;outline-offset:2px}
}

@media print{.nav-toggle,.hero-rail{display:none!important}
.site-header{position:static}
}


.skip:focus-visible{outline-color:var(--aqua)}

.contact-tile{border-color:rgba(255,255,255,.6)}


.card h2{margin-bottom:.9rem;font-size:1.35rem}

.ki-intro p+p{margin-top:1rem}
.ki-principle{color:var(--navy);font-weight:700}