@font-face{font-family:'Barlow Semi Condensed';src:url('assets/barlow-semi-condensed-light.ttf') format('truetype');font-style:normal;font-weight:300;font-display:swap}
@font-face{font-family:'Outfit';src:url('assets/outfit.ttf') format('truetype');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:'Manrope';src:url('assets/manrope-light.ttf') format('truetype');font-style:normal;font-weight:300;font-display:swap}
@font-face{font-family:'Inter';src:url('assets/inter-light.ttf') format('truetype');font-style:normal;font-weight:300;font-display:swap}

:root{color-scheme:dark;--paper:#000;--ink:#fff;--muted:#aaa;--text:18px;--wordmark:'Outfit', Helvetica, Arial, sans-serif;--type:'Barlow Semi Condensed', Helvetica, Arial, sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:25px}body{margin:0;background:var(--paper);color:var(--muted);font:300 var(--text)/1.65 var(--type)}a{color:var(--ink);text-decoration:none}button{font:inherit;color:var(--ink);cursor:pointer}a[href]:hover,button:enabled:hover,select:enabled:hover{color:#b3b3b3}a:focus-visible,button:focus-visible,select:focus-visible{outline:1px solid #ddd;outline-offset:5px}::selection{background:#eee;color:#080808}.skip{position:fixed;left:20px;top:-100px;z-index:100;background:#000;padding:10px}.skip:focus{top:10px}
.compact-header{--header-height:100px;margin:0 4.5%;padding:36px 0 32px;display:grid;grid-template-columns:minmax(0,1fr) var(--header-height);align-items:center;gap:30px}.header-identity h1{margin:0;color:var(--ink);font:225 calc(var(--header-height) / 2.16)/1.04 var(--wordmark);letter-spacing:.015em;font-kerning:normal}.header-identity h1 span{color:#777}.brand{display:block;width:var(--header-height);height:var(--header-height);justify-self:end}.ak-logo{display:block;width:100%;height:100%;object-fit:contain;filter:invert(1) brightness(.6) contrast(10);mix-blend-mode:screen}.brand:hover{opacity:.8}
.single-project{margin:28px 4.5% 65px;scroll-margin-top:25px}.project-picker{display:flex;align-items:center;gap:24px;padding:10px 0 18px;margin-bottom:18px}.project-picker>label,.project-count{font:300 var(--text)/1.5 var(--type);color:var(--muted)}.select-wrap{position:relative;flex:1;max-width:570px}.project-picker select{appearance:none;-webkit-appearance:none;border:0;border-radius:0;background:var(--paper);color:var(--ink);font:300 var(--text)/1.5 var(--type);padding:12px 35px 12px 0;width:100%;cursor:pointer}.project-picker option{background:#000;color:var(--ink)}.select-chevron{position:absolute;right:8px;top:9px;pointer-events:none;font:300 var(--text) var(--type);color:#aaa}.project-count{margin-left:auto;white-space:nowrap}
.image-button{display:block;position:relative;width:100%;padding:0;border:0;background:#000;text-align:left;overflow:hidden}.selected-preview{height:clamp(240px,calc(min(91vw, 1638px) / 1.8),min(66vh,700px))}.selected-preview img{display:block;position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain;background:#000;padding:24px;filter:grayscale(1)}.selected-preview img.inverted-cover{filter:grayscale(1) invert(1);background:#fff}.selected-preview img.raster-plan{object-fit:scale-down}.image-label{position:absolute;bottom:0;left:0;width:100%;display:flex;justify-content:space-between;padding:18px 22px;background:linear-gradient(transparent,#000c);font:300 var(--text)/1.5 var(--type);color:var(--muted)}.selected-caption{display:flex;justify-content:space-between;gap:24px;padding-top:15px;color:var(--muted);font-size:var(--text)}.selected-caption p{margin:0}.selected-caption>span,.project-est{font:300 var(--text)/1.5 var(--type)}.selected-caption>span{padding-top:2px}.project-est{margin:20px 0 0;color:#888}
.atelier{padding:32px 4.5%}.original-bio>p{margin:0;font-size:var(--text);line-height:1.65;color:var(--muted)}.profile-trigger{padding:0;border:0;background:none;font:inherit;color:var(--ink)}.outline-triangle{width:.7em;height:.7em;vertical-align:-.02em}.profile-trigger .outline-triangle{margin-left:.25em}
.contact{margin-inline:4.5%;padding:45px 0 55px}.contact-bottom{display:grid;grid-template-columns:1fr auto;gap:40px;font-size:var(--text);line-height:1.65}.contact-bottom p{margin:0}.contact-identity p{margin-bottom:18px}.contact-identity address{font-style:normal;color:var(--muted)}.contact-links{display:flex;flex-direction:column;align-items:flex-start;gap:6px}.contact-context{max-width:360px;color:var(--muted)}footer{display:flex;justify-content:space-between;margin:0 4.5%;padding:20px 0 28px;font:300 var(--text)/1.5 var(--type);color:var(--muted);gap:20px}
dialog{padding:0;border:0;background:var(--paper);color:var(--muted);max-width:1180px;width:94vw;max-height:92dvh;overflow:auto}dialog::backdrop{background:#000;backdrop-filter:blur(6px)}.close,.media-close,.profile-close{position:sticky;top:14px;z-index:2;border:0;background:#000;padding:10px 14px;font:300 var(--text)/1.5 var(--type)}.close{float:right;margin:14px 14px -50px 0}.media-close,.profile-close{display:block;margin:14px 14px 0 auto}.dialog-content{padding:25px 36px 42px}.eyebrow{font:300 var(--text)/1.5 var(--type);color:var(--muted)}.dialog-content h2,.profile-content h2{font-size:var(--text);line-height:1.2;font-weight:300;letter-spacing:-.025em;margin:24px 0}.dialog-content>p,.profile-biography p{font-size:var(--text);line-height:1.75;color:var(--muted)}#dialog-description{white-space:pre-line;margin-top:32px;max-width:800px}#dialog-description:empty{display:none}dl{display:grid;grid-template-columns:160px 1fr;font-size:var(--text);line-height:1.65;padding:23px 0;gap:14px}dt{color:var(--muted)}dd{margin:0;white-space:pre-line}
.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 16px;margin-top:30px;padding-bottom:20px}.gallery button{display:block;min-width:0;padding:0;border:0;background:#000;text-align:left}.gallery button:hover{background:#000}.gallery button:hover>span{color:inherit}.gallery img{display:block;width:100%;height:100%;object-fit:contain;background:#000;filter:grayscale(1);padding:10px}.gallery .plan-thumb img{filter:grayscale(1) invert(1);background:#fff}.gallery button>span{display:block;padding:10px 12px;color:var(--ink);font:300 var(--text)/1.5 var(--type)}
#media-dialog{max-width:1450px}#media-caption{margin:12px 22px 20px;font:300 var(--text)/1.5 var(--type);color:var(--muted)}.media-frame>img{display:block;width:100%;height:100%;object-fit:contain;background:#000;padding:20px;filter:grayscale(1)}.media-frame>img.is-plan{filter:grayscale(1) invert(1);background:#fff}.media-frame>img.raster-plan{object-fit:scale-down}
#profile-dialog{max-width:1120px}.profile-layout{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1fr);gap:42px;padding:24px 36px 42px}.profile-portrait{margin:0;align-self:start;position:sticky;top:24px}.profile-portrait img{display:block;width:100%;height:auto;filter:grayscale(1)}.profile-content h2{margin:0 0 24px}.profile-content h3{font:300 var(--text)/1.5 var(--type);font-weight:300;margin:36px 0 18px;color:var(--muted)}.profile-biography p{margin:0 0 22px}.curriculum{grid-template-columns:90px 1fr;margin:0;gap:20px 18px}
.selected-preview,.tile-media,.media-frame{container-type:size;position:relative;overflow:hidden}.tile-media{height:220px;background:#000}.media-frame{height:min(72vh,700px);max-height:78dvh;background:#000}.selected-preview img.rotated-plan,.tile-media img.rotated-plan,.media-frame img.rotated-plan{position:absolute;left:50%;top:50%;width:100cqh;height:100cqw;transform:translate(-50%,-50%) rotate(-90deg);max-height:none;object-fit:scale-down}
@media(min-width:1600px){body{max-width:1800px;margin:auto}}
@media(max-width:800px){.compact-header{--header-height:84px;padding:24px 0}.single-project{margin-top:20px;margin-bottom:40px}.project-picker{gap:16px}.selected-preview{height:clamp(220px,calc(min(91vw, 1638px) / 1.8),60vh)}.contact-bottom{gap:30px}.contact-context{grid-column:1/3;max-width:600px}.dialog-content{padding:22px}.gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.tile-media{height:190px}.profile-layout{gap:26px;padding:24px}.curriculum{grid-template-columns:78px 1fr}}
@media(max-width:600px){.compact-header{--header-height:min(76px, calc((91vw - 20px) / 4.9));gap:20px;padding:25px 0}.project-picker{gap:12px;padding-bottom:12px;margin-bottom:12px}.project-picker>label{display:block}.select-wrap{min-width:0}.project-picker select{padding-right:23px}.select-chevron{right:0}.selected-preview{height:clamp(190px,calc(min(91vw, 1638px) / 1.8),52vh)}.selected-preview img{padding:12px}.selected-caption{gap:12px}.image-label{padding:12px}.atelier{padding:28px 4.5%}.contact{padding:30px 0 40px}.contact-bottom{grid-template-columns:1fr;gap:24px}.contact-context{grid-column:auto;max-width:100%}footer{flex-wrap:wrap}.dialog-content{padding:60px 18px 24px}.gallery{gap:14px 10px}.tile-media{height:145px}.gallery button>span{padding:8px}.media-frame{height:64dvh}.media-frame>img{padding:12px}dl{grid-template-columns:100px 1fr}.profile-layout{grid-template-columns:1fr;gap:28px;padding:22px}.profile-portrait{position:static;max-width:380px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Lesetext in beiden Dokumentationen */
#dialog-description, .profile-biography p {
  font:300 var(--text)/1.7 var(--type);
  color: var(--muted);
  max-width: 66ch;
}
.image-label { width: auto; background: #000; }
@media (max-width: 600px) {
  .profile-portrait { width: 48%; max-width: 170px; }
  .project-picker { flex-wrap: wrap; gap: 0 12px; }
  .project-picker > label { flex-basis: 100%; }
}
/* Linien der Museums- und Kaiserhofpläne auf Schwarz anheben. */
:is(.selected-preview, .plan-thumb, .media-frame) img:is([src*="bkar-56_"], [src*="bkar-8_"]) {
  filter: grayscale(1) invert(1) brightness(1.65);
  padding: 2px;
}

.contact-bottom address { font-style: normal; }


.selected-caption { flex-wrap: wrap; row-gap: 4px; }
.selected-caption > span:empty { display: none; }
@media (max-width: 600px) { .selected-caption { flex-direction: column; } }

.selected-caption { flex-flow: row wrap; justify-content: flex-end; text-align: right; align-items: baseline; gap: .5em 1.5em; }
.selected-caption p:empty { display: none; }
.selected-caption > span { padding: 0; }
.documentation-link { padding: 0; border: 0; background: transparent; color: var(--ink); font:300 var(--text)/1.5 var(--type); cursor: pointer; }

@media (min-width: 1000px) {

  .contact-links { justify-self: end; }
}

.profile-portrait { position: static; display: grid; gap: 16px; }
@media (max-width: 640px) {
  .profile-portrait { width: 100%; max-width: none; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
}

.contact-identity .atelier { padding:0; }

.contact-identity .original-bio p { margin: 0; }

@media (min-width: 801px) {
  body { min-height: 100dvh; display: flex; flex-direction: column; }
  .compact-header { --header-height: 84px; padding: 20px 0 12px; }
  main { flex: 1; display: flex; flex-direction: column; }
  .single-project { flex: 1; display: flex; flex-direction: column; margin-block: 0 12px; }
  .project-picker { padding: 0; margin: 4px 0 0; }
  .selected-preview { flex: 1; min-height: 180px; height: auto; }
  .selected-preview img { padding: 8px; }
  .contact { padding: 8px 0 16px; }
  .contact-identity > p { margin-bottom: 6px; }
  .contact-links { gap: 2px; }
}

.project-actions { display:flex; align-items:center; gap:clamp(8px, 2vw, 24px); margin-left:auto; }
.project-picker .select-wrap { min-width:0; }

@media (any-pointer: fine) {
  :root {
    --cursor-ring: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='84' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='8.45' fill='none' stroke='white' stroke-width='.75'/%3E%3C/svg%3E");
    --cursor-crosshair: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='84' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='.75'%3E%3Ccircle cx='12' cy='12' r='8.45'/%3E%3Cpath d='M3.55 12h16.9M12 3.55v16.9'/%3E%3C/svg%3E");
    cursor: var(--cursor-ring) 42 42, auto;
  }
  a[href], button:enabled, select:enabled {
    cursor: var(--cursor-crosshair) 42 42, pointer;
  }
}

@media (any-pointer: fine) and (max-width: 600px) {
  :root {
    --cursor-ring: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='76' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='8.45' fill='none' stroke='white' stroke-width='.75'/%3E%3C/svg%3E");
    --cursor-crosshair: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='76' height='76' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='.75'%3E%3Ccircle cx='12' cy='12' r='8.45'/%3E%3Cpath d='M3.55 12h16.9M12 3.55v16.9'/%3E%3C/svg%3E");
    cursor: var(--cursor-ring) 38 38, auto;
  }
  a[href], button:enabled, select:enabled {
    cursor: var(--cursor-crosshair) 38 38, pointer;
  }
}

.contact-bottom {
  grid-template-columns: minmax(0, 1fr) minmax(0, 36%) minmax(0, 1fr);
  gap: 16px;
}
.contact-bottom .project-picker {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  text-align: center;
  justify-items: center;
  align-content: start;
  line-height: 1.65;
}
.project-picker .select-wrap { width: 100%; }
.project-picker select {
  padding: 0 18px;
  text-align: center;
  text-align-last: center;
  line-height: 1.65;
}
.project-picker .select-chevron { top: 0; right: 0; }
.project-actions { flex-direction: column; gap: 0; margin: 0; }
.project-actions .documentation-link, .project-actions .project-count { line-height: 1.65; }
.project-actions .project-count { margin: 0; }
.contact-bottom .contact-links { justify-self: end; }

@media (max-width: 700px) {
  .contact-bottom { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .contact-bottom .project-picker {
    grid-column: 1 / -1;
    grid-row: 1;
    width: min(100%, 360px);
    justify-self: center;
  }
}

#profile-dialog .profile-close,
#project-dialog .close {
  display: grid;
  place-items: center;
  float: none;
  margin: 12px 0 0 12px;
  padding: 8px;
}
#project-dialog .dialog-content { padding-top: 8px; }
#profile-dialog .profile-close svg,
#project-dialog .close svg {
  width: 66px;
  height: 66px;
}
@media (max-width: 600px) {
  #profile-dialog .profile-close svg,
  #project-dialog .close svg {
    width: 60px;
    height: 60px;
  }
}
#dialog-title { margin: 0; }

.media-close {
  display: flex;
  align-items: center;
  gap: 8px;
}

#media-dialog { width: 100%; max-width: 1800px; height: 100dvh; max-height: none; margin: 0 auto; }
.media-toolbar {
  --logo-size: 84px;
  min-height: calc(var(--logo-size) + 32px);
  position: sticky;
  top: 0;
  z-index: 3;
  display: flex;
  justify-content: flex-end;
  margin-inline: 4.5%;
  padding: 20px 0 12px;
  background: var(--paper);
}
.media-controls {
  position: absolute;
  left: var(--close-x);
  top: var(--close-y);
  transform: translate(-50%, -50%);
  display: grid;
  grid-template-columns: 30px 48px 30px;
  column-gap: var(--media-control-gap);
  place-items: center;
}
.media-controls button, .media-home {
  position: static;
  display: grid;
  place-items: center;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}
.media-close { width: 48px; height: 66px; }
.media-close svg { width: 66px; height: 66px; }
.media-controls svg { justify-self: center; }
#media-dialog #media-caption { margin-bottom: 2px; }
#media-project-name { margin: 0 22px 20px; color: var(--muted); }
#media-dialog { --media-control-gap: 7px; --media-x-half-width: 19.8px; }
#media-dialog #media-caption,
#media-dialog #media-project-name {
  margin-left: max(0px, calc(4.5% + var(--close-x, 60px) - var(--media-x-half-width)));
}
#media-dialog #media-caption { margin-top: 1.65em; }
.media-step { width: 30px; height: 60px; }
.media-step svg { width: 46px; height: 46px; }
.media-home { width: var(--logo-size); height: var(--logo-size); }
.view-home {
  position: fixed;
  z-index: 4;
  top: 20px;
  right: max(4.5%, calc((100% - 1800px) / 2 + 81px));
  width: 84px;
  height: 84px;
  padding: 0;
  border: 0;
  background: var(--paper);
}
@media (max-width: 800px) {
  .view-home { top: 24px; }
  .media-toolbar { min-height: calc(var(--logo-size) + 48px); }
}
@media (max-width: 600px) {
  .view-home {
    top: 25px;
    width: min(76px, calc((91vw - 20px) / 4.9));
    height: min(76px, calc((91vw - 20px) / 4.9));
  }
  .media-toolbar { min-height: calc(var(--logo-size) + 50px); }
}
@media (max-width: 800px) { .media-toolbar { padding: 24px 0; } }
@media (max-width: 600px) {
  #media-dialog { --media-control-gap: 4px; --media-x-half-width: 18px; }
  .media-toolbar { --logo-size: min(76px, calc((91vw - 20px) / 4.9)); padding: 25px 0; }
  .media-close, .media-close svg { height: 60px; }
  .media-close svg { width: 60px; }
  .media-step svg { width: 42px; height: 42px; }
}

:root {
  --view-header-top: 20px;
  --view-logo-size: 84px;
  --view-header-center: calc(var(--view-header-top) + var(--view-logo-size) / 2);
}
.view-home {
  top: var(--view-header-top);
  width: var(--view-logo-size);
  height: var(--view-logo-size);
}
#project-dialog { --view-dialog-width: 1180px; }
#profile-dialog { --view-dialog-width: 1120px; }
#project-dialog::before, #profile-dialog::before {
  content: "";
  display: block;
  height: calc(var(--view-header-top) + var(--view-logo-size) + 12px);
}
#project-dialog .close, #profile-dialog .profile-close {
  position: fixed;
  top: var(--view-header-center);
  left: calc(max(3vw, (100vw - var(--view-dialog-width)) / 2) + 12px);
  transform: translateY(-50%);
  margin: 0;
  z-index: 4;
}
.media-controls { top: var(--view-header-center); }
@media (max-width: 800px) {
  :root { --view-header-top: 24px; }
}
@media (max-width: 600px) {
  :root {
    --view-header-top: 25px;
    --view-logo-size: min(76px, calc((91vw - 20px) / 4.9));
  }
}