:root, [data-bs-theme="light"] {
  --bs-blue: #00c0ff;
  --bs-primary: #00c0ff;
  --bs-primary-rgb: 0, 192, 255;
  --bs-secondary: #666666;
  --bs-secondary-rgb: 102, 102, 102;
  --bs-light: #fafafa;
  --bs-light-rgb: 250, 250, 250;
  --bs-dark: #111111;
  --bs-dark-rgb: 17, 17, 17;
  --bs-body-font-family: Monitor, "Helvetica Neue", Arial, sans-serif;
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 300;
  --bs-body-line-height: 1.42;
  --bs-body-color: #666666;
  --bs-body-color-rgb: 102, 102, 102;
  --bs-body-bg: #ffffff;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-heading-color: #666666;
  --bs-link-color: #666666;
  --bs-link-color-rgb: 102, 102, 102;
  --bs-link-hover-color: #00c0ff;
  --bs-link-hover-color-rgb: 0, 192, 255;
  --bs-link-decoration: none;
  --bs-border-color: #d8d8d8;
  --bs-border-color-translucent: rgba(102, 102, 102, 0.2);
  --bs-border-radius: 0;
  --bs-border-radius-sm: 0;
  --bs-border-radius-lg: 0;
  --bs-focus-ring-color: rgba(0, 192, 255, 0.25);
  --lab-grau: #666666;
  --lab-blau: #00c0ff;
  --lab-weiss: #ffffff;
  --lab-schwarz: #111111;
  --lab-hellgrau: #fafafa;
  --lab-linie: #d8d8d8;
  --lab-font-family: Monitor, "Helvetica Neue", Arial, sans-serif;
  --lab-weight-light: 300;
  --lab-weight-regular: 400;
  --lab-weight-medium: 500;
  --lab-weight-semibold: 600;
  --lab-weight-bold: 700;
  --lab-page-x: 1.5rem;
  --lab-gap: 2rem;
  --lab-space-block: clamp(1.25rem, 2vw, 2rem);
  --lab-space-heading: clamp(1.5rem, 3vw, 3rem);
  --lab-space-media-text: clamp(2.5rem, 5vw, 5rem);
  --lab-space-section: clamp(5rem, 9vw, 9rem);
  --lab-section-y: var(--lab-space-section);
  --lab-grid-max: 109.5rem;
  --lab-auszeichnung-size: 1rem;
  --lab-auszeichnung-line-height: 1;
  --lab-ueberschrift-size: 3rem;
  --lab-ueberschrift-line-height: 1.02;
  --lab-ueberschrift-letter-spacing: clamp(0.04rem, 0.18vw, 0.18rem);
  --lab-zwischenueberschrift-size: 2rem;
  --lab-zwischenueberschrift-line-height: 1.05;
  --lab-fliesstext-size: 1.175rem;
  --lab-fliesstext-line-height: 1.42;
  --lab-info-head-size: 1.25rem;
  --lab-info-head-line-height: 1.16;
  --lab-info-size: 1.25rem;
  --lab-info-line-height: 1.26;
  --lab-logo-size: 6rem;
  --lab-logo-line-height: 0.708333;
  --lab-bildunterschrift-size: 1rem;
  --lab-bildunterschrift-line-height: 1.25;
}

@media (min-width: 160rem) {
  :root, [data-bs-theme="light"] {
    --lab-gap: 3rem;
    --lab-space-section: 9rem;
  }
}

@media (max-width: 1199px) {
  :root, [data-bs-theme="light"] {
    --lab-page-x: 1.25rem;
  }
}

@media (max-width: 899px) {
  :root, [data-bs-theme="light"] {
    --lab-gap: 2rem;
    --lab-space-block: 1.25rem;
    --lab-space-heading: 1.75rem;
    --lab-space-media-text: 3rem;
    --lab-space-section: clamp(4rem, 12vw, 5rem);
    --lab-ueberschrift-size: clamp(1.9rem, 8.5vw, 2.5rem);
    --lab-zwischenueberschrift-size: clamp(1.35rem, 6vw, 1.75rem);
    --lab-fliesstext-size: clamp(1rem, 4vw, 1.125rem);
    --lab-info-head-size: clamp(1.05rem, 4vw, 1.125rem);
    --lab-info-size: clamp(1.05rem, 4vw, 1.125rem);
    --lab-logo-size: clamp(3.25rem, 17vw, 4.5rem);
    --lab-bildunterschrift-size: 0.875rem;
  }
}

@media (max-width: 480px) {
  :root, [data-bs-theme="light"] {
    --lab-ueberschrift-size: clamp(1.65rem, 8vw, 2.1rem);
    --lab-zwischenueberschrift-size: clamp(1.2rem, 5.8vw, 1.5rem);
    --lab-fliesstext-size: 1rem;
    --lab-info-head-size: 1rem;
    --lab-info-size: 1rem;
  }
}

*, *::before, *::after {
  box-sizing: border-box;
}

/* Keep custom controls stable when a page is re-imported without Bootstrap's reset. */

button, input, optgroup, select, textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  margin: 0;
}

button, select {
  text-transform: none;
}

button {
  border-radius: 0;
}

.lab-tuple-option {
  -webkit-appearance: none;
  appearance: none;
}

html {
  scroll-behavior: smooth;
}

body {
  background: var(--bs-body-bg);
  color: var(--bs-body-color);
  font-family: var(--bs-body-font-family);
  font-size: var(--bs-body-font-size);
  font-weight: var(--bs-body-font-weight);
  line-height: var(--bs-body-line-height);
  margin: 0;
  text-rendering: geometricPrecision;
}

img, svg, video {
  display: block;
  max-width: 100%;
}

a {
  color: inherit;
  text-decoration: none;
}

a:hover {
  color: var(--lab-blau);
}

h1, .h1 {
  color: var(--lab-blau);
  font-size: var(--lab-ueberschrift-size);
  font-weight: var(--lab-weight-bold);
  letter-spacing: var(--lab-ueberschrift-letter-spacing);
  line-height: var(--lab-ueberschrift-line-height);
  text-transform: uppercase;
  text-wrap: balance;
}

h2, .h2 {
  color: var(--lab-grau);
  font-size: var(--lab-zwischenueberschrift-size);
  font-weight: var(--lab-weight-bold);
  letter-spacing: 0;
  line-height: var(--lab-zwischenueberschrift-line-height);
  text-transform: uppercase;
  text-wrap: balance;
}

h3, .h3 {
  color: var(--lab-grau);
  font-size: var(--lab-info-head-size);
  font-weight: var(--lab-weight-bold);
  letter-spacing: 0;
  line-height: var(--lab-info-head-line-height);
}

p {
  margin-top: 0;
}

.navbar {
  --bs-navbar-color: var(--lab-grau);
  --bs-navbar-hover-color: var(--lab-blau);
  --bs-navbar-active-color: var(--lab-blau);
  --bs-navbar-brand-color: var(--lab-schwarz);
  --bs-navbar-brand-hover-color: var(--lab-schwarz);
  --bs-navbar-padding-x: var(--lab-page-x);
  --bs-navbar-padding-y: 1rem;
}

.btn-primary {
  --bs-btn-color: var(--lab-weiss);
  --bs-btn-bg: var(--lab-blau);
  --bs-btn-border-color: var(--lab-blau);
  --bs-btn-hover-color: var(--lab-weiss);
  --bs-btn-hover-bg: color-mix(in srgb, var(--lab-blau) 86%, var(--lab-schwarz) 14%);
  --bs-btn-hover-border-color: color-mix(in srgb, var(--lab-blau) 86%, var(--lab-schwarz) 14%);
  --bs-btn-focus-shadow-rgb: 0, 192, 255;
  --bs-btn-active-color: var(--lab-weiss);
  --bs-btn-active-bg: var(--lab-blau);
  --bs-btn-active-border-color: var(--lab-blau);
}

.btn-outline-primary {
  --bs-btn-color: var(--lab-blau);
  --bs-btn-border-color: var(--lab-blau);
  --bs-btn-hover-color: var(--lab-weiss);
  --bs-btn-hover-bg: var(--lab-blau);
  --bs-btn-hover-border-color: var(--lab-blau);
  --bs-btn-focus-shadow-rgb: 0, 192, 255;
}

.card {
  --bs-card-border-color: var(--lab-linie);
  --bs-card-border-radius: 0;
  --bs-card-bg: var(--lab-weiss);
  --bs-card-color: var(--lab-grau);
}

.form-control, .form-select {
  --bs-border-color: var(--lab-linie);
  border-radius: 0;
}

.form-control:focus, .form-select:focus {
  border-color: var(--lab-blau);
  box-shadow: 0 0 0 0.25rem rgba(0, 192, 255, 0.18);
}

.lab-shell {
  background: var(--lab-weiss);
  min-height: 100vh;
}

.lab-visually-hidden {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

.lab-sticky-header {
  background: var(--lab-weiss);
  isolation: isolate;
  position: sticky;
  top: 0;
  z-index: 40;
}

.lab-sticky-header.is-hidden {
  transform: none;
}

.lab-sticky-header.is-scrolled {
  background: var(--lab-weiss);
}

.lab-header, .lab-header-preview {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding: 1rem var(--lab-page-x);
}

.lab-logo, .lab-nav-logo {
  color: var(--lab-schwarz);
  display: block;
  flex: 0 0 2.5rem;
  height: 1.5rem;
  overflow: visible;
  position: relative;
  text-decoration: none;
  width: 2.5rem;
}

.lab-logo img, .lab-nav-logo img {
  display: block;
  height: auto;
  left: 0;
  max-width: none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 4.75rem;
}

.lab-nav, .lab-nav-links {
  align-items: center;
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
  justify-content: flex-end;
}

.lab-header .lab-nav, .lab-header .lab-nav-links, .lab-header-preview .lab-nav, .lab-header-preview .lab-nav-links {
  position: relative;
  top: 0.965rem;
}

.lab-nav a, .lab-nav-links a, .lab-nav-link {
  color: var(--lab-grau);
  font-size: var(--lab-auszeichnung-size);
  font-weight: var(--lab-weight-regular);
  line-height: var(--lab-auszeichnung-line-height);
  text-decoration: none;
  text-transform: uppercase;
  transition: color 180ms ease;
}

.lab-nav a.active, .lab-nav-links a.active, .lab-nav a:hover, .lab-nav-links a:hover, .lab-nav-link-active {
  color: var(--lab-blau) !important;
}

.lab-footer {
  background: var(--lab-hellgrau);
  color: var(--lab-grau);
  padding: 3.5rem var(--lab-page-x) 3rem;
}

.lab-footer-inner {
  margin-left: auto;
  margin-right: auto;
  max-width: var(--lab-grid-max);
  width: 100%;
}

.lab-footer-row, .lab-footer-legal {
  align-items: center;
  border-top: 1px solid var(--lab-linie);
  display: grid;
  gap: var(--lab-gap);
  grid-template-columns: 1fr;
  padding: 2.375rem 0;
  text-transform: uppercase;
  width: 100%;
}

.lab-footer-row strong, .lab-footer-row p, .lab-footer-legal {
  font-size: var(--lab-info-size);
  line-height: var(--lab-info-line-height);
  margin: 0;
}

.lab-footer-row strong {
  font-weight: var(--lab-weight-bold);
}

.lab-footer-row p, .lab-footer-legal span:last-child {
  text-align: left;
}

.lab-footer-legal span:last-child {
  justify-self: end;
  text-align: right;
}

.lab-footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1rem, 2.9vw, 3.125rem);
}

.lab-footer a {
  color: inherit;
  text-decoration: none;
}

.lab-text-grau, .text-lab-grau {
  color: var(--lab-grau) !important;
}

.lab-text-blau, .text-lab-blau {
  color: var(--lab-blau) !important;
}

.lab-text-weiss, .text-lab-weiss {
  color: var(--lab-weiss) !important;
}

.lab-text-schwarz, .text-lab-schwarz {
  color: var(--lab-schwarz) !important;
}

.lab-bg-grau, .bg-lab-grau {
  background-color: var(--lab-grau) !important;
}

.lab-bg-blau, .bg-lab-blau {
  background-color: var(--lab-blau) !important;
}

.lab-bg-weiss, .bg-lab-weiss {
  background-color: var(--lab-weiss) !important;
}

.lab-bg-hellgrau, .bg-lab-hellgrau {
  background-color: var(--lab-hellgrau) !important;
}

.lab-bg-schwarz, .bg-lab-schwarz {
  background-color: var(--lab-schwarz) !important;
}

.lab-border {
  border: 1px solid var(--lab-linie) !important;
}

.lab-border-top {
  border-top: 1px solid var(--lab-linie) !important;
}

.lab-border-bottom {
  border-bottom: 1px solid var(--lab-linie) !important;
}

.lab-weight-light {
  font-weight: var(--lab-weight-light) !important;
}

.lab-weight-regular {
  font-weight: var(--lab-weight-regular) !important;
}

.lab-weight-medium {
  font-weight: var(--lab-weight-medium) !important;
}

.lab-weight-bold {
  font-weight: var(--lab-weight-bold) !important;
}

.lab-type-auszeichnung, .type-auszeichnung {
  font-size: var(--lab-auszeichnung-size);
  font-weight: var(--lab-weight-regular);
  letter-spacing: 0;
  line-height: var(--lab-auszeichnung-line-height);
  text-transform: uppercase;
}

.lab-type-ueberschrift, .type-ueberschrift {
  color: var(--lab-blau);
  font-size: var(--lab-ueberschrift-size);
  font-weight: var(--lab-weight-bold);
  letter-spacing: var(--lab-ueberschrift-letter-spacing);
  line-height: var(--lab-ueberschrift-line-height);
  text-transform: uppercase;
  text-wrap: balance;
}

.lab-type-zwischenueberschrift, .type-zwischenueberschrift {
  font-size: var(--lab-zwischenueberschrift-size);
  font-weight: var(--lab-weight-bold);
  letter-spacing: 0;
  line-height: var(--lab-zwischenueberschrift-line-height);
  text-transform: uppercase;
  text-wrap: balance;
}

.lab-type-fliesstext, .type-fliesstext {
  font-size: var(--lab-fliesstext-size);
  font-weight: var(--lab-weight-light);
  letter-spacing: 0;
  line-height: var(--lab-fliesstext-line-height);
  text-wrap: pretty;
}

.lab-type-fliesstext-hervorhebung, .type-fliesstext-hervorhebung {
  font-size: var(--lab-fliesstext-size);
  font-weight: var(--lab-weight-light);
  letter-spacing: 0;
  line-height: var(--lab-fliesstext-line-height);
  text-wrap: pretty;
}

.lab-type-fliesstext-auszeichnung, .type-fliesstext-auszeichnung {
  font-size: var(--lab-fliesstext-size);
  font-weight: var(--lab-weight-semibold);
  letter-spacing: 0;
  line-height: var(--lab-fliesstext-line-height);
}

.lab-type-info-head, .type-info-head {
  color: var(--lab-grau);
  font-size: var(--lab-info-head-size);
  font-weight: var(--lab-weight-bold);
  letter-spacing: 0;
  line-height: var(--lab-info-head-line-height);
}

.lab-type-info, .type-info {
  font-size: var(--lab-info-size);
  font-weight: var(--lab-weight-regular);
  letter-spacing: 0;
  line-height: var(--lab-info-line-height);
  text-wrap: pretty;
}

.lab-type-logo, .type-logo-font {
  font-size: var(--lab-logo-size);
  font-weight: var(--lab-weight-bold);
  letter-spacing: 0;
  line-height: var(--lab-logo-line-height);
  text-transform: uppercase;
}

.lab-type-bildunterschrift, .type-bildunterschrift {
  font-size: var(--lab-bildunterschrift-size);
  font-weight: var(--lab-weight-regular);
  letter-spacing: 0;
  line-height: var(--lab-bildunterschrift-line-height);
}

.lab-page-kicker {
  color: var(--lab-grau);
  margin: 0 0 var(--lab-space-block);
}

.lab-page-pad {
  padding-left: var(--lab-page-x) !important;
  padding-right: var(--lab-page-x) !important;
}

.lab-section, .lab-section-pad {
  padding-bottom: var(--lab-section-y) !important;
  padding-top: var(--lab-section-y) !important;
}

.lab-grid, .lab-grid-4 {
  display: grid;
  gap: var(--lab-gap);
  grid-template-columns: 1fr;
  margin-left: auto;
  margin-right: auto;
  max-width: var(--lab-grid-max);
  width: 100%;
}

.lab-col-1, .lab-col-2, .lab-col-3, .lab-col-4 {
  min-width: 0;
}

.lab-object-cover {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.lab-img-fluid {
  display: block;
  height: auto;
  max-width: 100%;
}

.lab-card-media, .lab-media {
  border: 1px solid var(--lab-linie);
  object-fit: cover;
  width: 100%;
}

.lab-media-frame {
  overflow: hidden;
  position: relative;
  width: 100%;
}

.lab-media-frame > .lab-media {
  height: 100%;
  width: 100%;
}

.lab-ratio-card, .lab-card-media {
  aspect-ratio: 738 / 406;
}

.lab-ratio-small, .lab-media-small {
  aspect-ratio: 738 / 410;
}

.lab-ratio-wide, .lab-media-wide {
  aspect-ratio: 19 / 10;
}

.lab-ratio-hero, .lab-media-hero {
  aspect-ratio: 1916 / 1054;
}

@media (prefers-reduced-motion: reduce) {
  .lab-sticky-header, .lab-nav a, .lab-nav-links a {
    transition: none;
  }
}

@media (min-width: 900px) {
  .lab-grid, .lab-grid-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 900px) {
  .lab-col-1 {
    grid-column: span 1;
  }
}

@media (min-width: 900px) {
  .lab-col-2 {
    grid-column: span 2;
  }
}

@media (min-width: 900px) {
  .lab-col-3 {
    grid-column: span 3;
  }
}

@media (min-width: 900px) {
  .lab-col-4 {
    grid-column: span 4;
  }
}

@media (min-width: 900px) {
  .lab-start-2 {
    grid-column-start: 2;
  }
}

@media (min-width: 900px) {
  .lab-start-3 {
    grid-column-start: 3;
  }
}

@media (min-width: 900px) {
  .lab-start-4 {
    grid-column-start: 4;
  }
}

@media (min-width: 900px) {
  .lab-footer-row, .lab-footer-legal {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 900px) {
  .lab-footer-row > :first-child, .lab-footer-legal > :first-child {
    grid-column: span 2;
  }
}

@media (min-width: 900px) {
  .lab-footer-row > :last-child, .lab-footer-legal > :last-child {
    grid-column: span 2;
    text-align: right;
  }
}

@media (min-width: 900px) {
  .lab-footer-links {
    justify-content: flex-end;
  }
}

@media (max-width: 899px) {
  .lab-header, .lab-header-preview {
    gap: 1rem;
  }
}

.lab-home-hero {
  background: var(--lab-schwarz);
  height: 100vh;
  height: 100svh;
  overflow: hidden;
  position: relative;
  width: 100%;
}

.lab-home-hero-video {
  border: 0;
  height: 100%;
  inset: 0;
  max-width: none;
  object-fit: cover;
  pointer-events: none;
  position: absolute;
  width: 100%;
}

.lab-home-hero-video-link {
  inset: 0;
  position: absolute;
  z-index: 1;
}

.lab-home-hero-logo {
  bottom: clamp(1.5rem, 4vw, 4rem);
  display: block;
  left: var(--lab-page-x);
  mix-blend-mode: difference;
  position: absolute;
  width: clamp(8rem, 17vw, 18rem);
  z-index: 2;
}

.lab-home-hero-logo img {
  display: block;
  filter: brightness(0) invert(1);
  height: auto;
  width: 100%;
}

.lab-home-hero-project {
  bottom: clamp(1.5rem, 4vw, 4rem);
  color: var(--lab-weiss);
  max-width: 45vw;
  mix-blend-mode: difference;
  position: absolute;
  right: calc(var(--lab-page-x) - var(--lab-hero-title-ink-right, 0px));
  text-align: right;
  text-transform: uppercase;
  z-index: 2;
}

.lab-home-hero-project-year, .lab-home-hero-project-title {
  color: inherit;
  display: block;
}

.lab-home-hero-project-title {
  line-height: 1;
  margin-bottom: -0.2em;
}

.lab-home-hero-project-year:empty {
  display: none;
}

.lab-home-hero-project-year {
  margin-bottom: 0.15em;
}

.lab-home-hero-project:has(.lab-home-hero-project-title:empty) {
  visibility: hidden;
}

.lab-home-hero-logo.is-transitioning {
  visibility: hidden;
}

.lab-sticky-header .lab-nav-logo {
  opacity: 1;
}

.lab-home-hero + .lab-sticky-header .lab-nav-logo {
  opacity: 0;
}

.lab-home-hero + .lab-sticky-header .lab-nav-logo.is-docked {
  opacity: 1;
}

.lab-home-logo-flight {
  filter: brightness(0) invert(1);
  object-fit: contain;
  pointer-events: none;
  position: fixed;
  transform-origin: left top;
  z-index: 60;
}

.lab-home-intro {
  padding-bottom: var(--lab-space-heading);
  padding-top: clamp(5rem, 11vw, 12rem);
}

.lab-home-wordmark {
  --lab-wordmark-letter-spacing: -0.045em;
  --lab-wordmark-line-height: 0.84;
  color: var(--lab-schwarz) !important;
  font-size: var(--lab-logo-size);
  letter-spacing: var(--lab-wordmark-letter-spacing);
  line-height: var(--lab-wordmark-line-height);
  margin: 0;
  height: 1.68em;
  min-height: 1.68em;
  text-transform: uppercase;
  text-wrap: nowrap;
}

.lab-home-wordmark span {
  display: block;
}

.lab-home-wordmark [data-binary-line] {
  height: 0.84em;
  overflow: visible;
  position: relative;
}

.lab-home-wordmark-text {
  height: 0.84em;
  left: var(--lab-wordmark-ink-offset, 0px);
  line-height: 0.84;
  position: absolute;
  top: 0;
  width: max-content;
}

.lab-home-wordmark.is-scrambling {
  color: var(--lab-schwarz);
}

.lab-home-intro-copy {
  margin: 0;
}

.lab-home-statement {
  padding-bottom: calc(var(--lab-section-y) * 0.75);
}

.lab-home-statement p {
  color: var(--lab-grau);
  margin: 0;
}

.lab-home-projects {
  padding-bottom: calc(var(--lab-section-y) * 1.5);
}

.lab-home-project-grid {
  display: grid;
  gap: calc(var(--lab-section-y) * 0.75) var(--lab-gap);
  grid-template-columns: 1fr;
  margin-left: auto;
  margin-right: auto;
  max-width: var(--lab-grid-max);
  width: 100%;
}

.lab-home-project-card {
  color: var(--lab-grau);
  display: block;
}

.lab-reveal-ready .lab-home-project-card {
  opacity: 0;
  transform: translateY(3rem);
  transition: transform var(--lab-card-reveal-duration, 500ms) cubic-bezier(0.25, 1, 0.5, 1), opacity 1600ms cubic-bezier(0.25, 1, 0.5, 1);
  will-change: opacity, transform;
}

.lab-reveal-ready .lab-home-project-card.is-visible {
  opacity: 1;
  transform: translateY(0);
  will-change: auto;
}

.lab-home-project-card .lab-media {
  transition: opacity 250ms ease-out;
}

.lab-home-project-meta {
  align-items: start;
  display: grid;
  gap: var(--lab-gap);
  grid-template-columns: minmax(0, 1fr) auto;
  padding-top: 0.625rem;
}

.lab-home-project-meta h2, .lab-home-project-meta p, .lab-home-project-meta time {
  margin: 0;
}

.lab-home-project-meta h2 {
  transition: color 220ms ease;
  text-transform: uppercase;
}

.lab-home-project-card:hover .lab-home-project-meta h2, .lab-home-project-card:focus-visible .lab-home-project-meta h2 {
  color: var(--lab-blau);
}

@media (min-width: 900px) {
  .lab-home-project-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 899px) {
  .lab-home-intro {
    padding-top: clamp(5rem, 11vw, 12rem);
  }
}

@media (max-width: 899px) {
  .lab-home-intro-copy {
    margin-top: var(--lab-section-y);
  }
}

@media (max-width: 899px) {
  .lab-home-project-grid {
    gap: var(--lab-section-y);
  }
}

@media (prefers-reduced-motion: reduce) {
  .lab-reveal-ready .lab-home-project-card {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* Native cross-document transition: only the changing page content animates. */

@view-transition {
  navigation: auto;
}

html:active-view-transition {
  pointer-events: none;
}

.lab-sticky-header {
  view-transition-name: lab-navigation;
}

.lab-footer {
  view-transition-name: lab-footer;
}

main {
  view-transition-name: lab-page-content;
}

::view-transition-old(root), ::view-transition-new(root) {
  animation: none;
}

::view-transition-old(lab-navigation), ::view-transition-new(lab-navigation), ::view-transition-old(lab-footer), ::view-transition-new(lab-footer) {
  animation: none;
}

::view-transition-old(lab-page-content) {
  animation: lab-content-out 180ms ease-out both;
}

::view-transition-new(lab-page-content) {
  animation: lab-content-in 260ms ease-out both;
}

@keyframes lab-content-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes lab-content-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(lab-page-content), ::view-transition-new(lab-page-content) {
    animation: none;
  }
}

.lab-projects-page {
  padding-top: clamp(5rem, 11vw, 12rem);
}

.lab-projects-container {
  margin-left: auto;
  margin-right: auto;
  max-width: var(--lab-grid-max);
  width: 100%;
}

.lab-projects-showreel h1 {
  margin: 0 0 var(--lab-space-heading);
}

.lab-projects-feature {
  margin: 0;
}

.lab-projects-feature img {
  object-fit: cover;
}

.lab-projects-feature figcaption {
  margin-top: 0.625rem;
  text-align: right;
}

.lab-projects-feature figcaption p {
  color: var(--lab-grau);
  margin: 0;
}

.lab-projects-listing {
  padding-bottom: calc(var(--lab-section-y) * 1.5);
  padding-top: var(--lab-space-media-text);
}

.lab-projects-filter-heading {
  color: var(--lab-grau);
  margin: 0 0 var(--lab-space-heading);
  max-width: calc((var(--lab-grid-max) - (3 * var(--lab-gap))) * 0.75);
}

.lab-tuple-filter {
  margin-bottom: var(--lab-space-media-text);
}

.lab-tuple-words {
  display: flex;
  flex-direction: column;
  margin-top: var(--lab-space-block);
  row-gap: clamp(0.2rem, 0.4vw, 0.4rem);
}

.lab-tuple-line {
  align-items: end;
  display: grid;
  gap: var(--lab-gap);
  grid-template-columns: minmax(0, 1fr) minmax(14rem, 1fr);
}

.lab-tuple-current {
  color: var(--lab-schwarz);
  display: block;
  font-family: inherit;
  height: 0.84em;
  overflow: visible;
  position: relative;
  font-size: clamp(3rem, 7vw, 7.25rem);
  font-weight: var(--lab-weight-bold);
  letter-spacing: -0.045em;
  line-height: 0.84;
  text-transform: uppercase;
  white-space: nowrap;
}

.lab-tuple-text {
  display: block;
  height: 0.72em;
  left: var(--lab-tuple-ink-offset, 0px);
  line-height: 0.72;
  position: absolute;
  top: 0.12em;
  width: max-content;
}

.lab-tuple-current img {
  display: block;
  height: 0.72em;
  left: 0;
  max-width: 100%;
  object-fit: contain;
  position: absolute;
  top: 0.05em;
  width: auto;
}

.lab-tuple-options {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.8rem;
  justify-content: flex-end;
  padding-bottom: 0.15rem;
}

.lab-tuple-option {
  background: transparent;
  border: 0;
  color: var(--lab-grau);
  cursor: pointer;
  font-family: inherit;
  font-size: var(--lab-auszeichnung-size);
  font-weight: var(--lab-weight-regular);
  line-height: var(--lab-auszeichnung-line-height);
  padding: 0;
  text-align: left;
  text-transform: uppercase;
  transition: color 180ms ease;
  white-space: nowrap;
}

.lab-tuple-option.is-active {
  color: var(--lab-blau);
}

.lab-tuple-option:hover {
  color: var(--lab-blau);
}

.lab-tuple-option:focus-visible {
  outline: 2px solid var(--lab-blau);
  outline-offset: 0.12em;
}

@media (max-width: 899px) {
  .lab-tuple-line {
    align-items: end;
    column-gap: clamp(0.9rem, 4vw, var(--lab-gap));
    grid-template-columns: max-content minmax(0, 1fr);
    row-gap: 0;
  }
}

@media (max-width: 899px) {
  .lab-tuple-options {
    min-width: 0;
  }
}

.lab-tuple-result {
  align-items: baseline;
  color: var(--lab-grau);
  display: flex;
  justify-content: space-between;
  margin-top: var(--lab-space-block) !important;
  text-transform: uppercase;
}

.lab-tuple-helper {
  color: var(--lab-grau);
  margin-left: auto;
  text-align: right;
}

.lab-home-project-card[hidden] {
  display: none;
}

.lab-project-filters {
  align-items: center;
  display: flex;
  gap: clamp(1.25rem, 4vw, 5rem);
  justify-content: space-between;
  margin-bottom: var(--lab-space-heading);
  overflow-x: auto;
  padding: 0.125rem;
  scrollbar-width: none;
}

.lab-project-filters::-webkit-scrollbar {
  display: none;
}

.lab-project-filter {
  background: transparent;
  border: 2px solid transparent;
  color: var(--lab-grau);
  flex: 0 0 auto;
  font-family: inherit;
  font-size: var(--lab-info-head-size);
  font-weight: var(--lab-weight-bold);
  line-height: 0.84;
  padding: 0.625rem 0.875rem;
  text-align: left;
  text-transform: uppercase;
}

.lab-project-filter.is-active {
  border-color: var(--lab-blau);
  color: var(--lab-blau);
}

.lab-projects-grid {
  display: grid;
  gap: calc(var(--lab-section-y) * 0.75) var(--lab-gap);
  grid-template-columns: 1fr;
}

@media (min-width: 900px) {
  .lab-projects-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 899px) {
  .lab-projects-page {
    padding-top: var(--lab-section-y);
  }
}

@media (max-width: 899px) {
  .lab-project-filters {
    justify-content: flex-start;
    margin-left: calc(var(--lab-page-x) * -1);
    margin-right: calc(var(--lab-page-x) * -1);
    padding-left: var(--lab-page-x);
    padding-right: var(--lab-page-x);
  }
}

@media (max-width: 899px) {
  .lab-projects-grid {
    gap: var(--lab-section-y);
  }
}

.lab-profile-page {
  padding-top: clamp(5rem, 11vw, 12rem);
}

.lab-profile-container {
  margin-left: auto;
  margin-right: auto;
  max-width: var(--lab-grid-max);
  width: 100%;
}

.lab-profile-hero h1 {
  margin: 0 0 var(--lab-space-heading);
}

.lab-profile-hero img {
  object-fit: cover;
}

.lab-profile-intro {
  padding-bottom: calc(var(--lab-section-y) * 1.5);
  padding-top: var(--lab-section-y);
}

.lab-profile-services {
  display: flex;
  flex-direction: column;
  gap: var(--lab-space-media-text);
  justify-content: space-between;
}

.lab-profile-service-list {
  color: var(--lab-grau);
  font-weight: var(--lab-weight-light);
  list-style: none;
  margin: 0;
  padding: 0;
}

.lab-profile-copy {
  color: var(--lab-grau);
  margin: 0;
  text-align: left;
}

.lab-profile-team {
  padding-bottom: calc(var(--lab-section-y) * 1.5);
}

.lab-profile-approach {
  padding-bottom: calc(var(--lab-section-y) * 1.5);
}

.lab-profile-approach > .lab-profile-container > h2 {
  color: var(--lab-grau);
  margin: 0 0 var(--lab-space-block);
}

.lab-profile-page .lab-approach-list, .lab-profile-page .lab-approach-item, .lab-profile-page .lab-approach-description ul {
  border-bottom: 0 !important;
  border-top: 0 !important;
}

.lab-approach-item {
  padding: var(--lab-space-media-text) 0;
}

.lab-approach-item:first-child {
  padding-top: 0;
}

.lab-approach-content {
  display: grid;
  gap: var(--lab-gap);
  grid-template-columns: 1fr;
}

.lab-approach-description > p {
  color: var(--lab-grau);
  margin: 0;
}

.lab-approach-description .lab-approach-kicker {
  color: var(--lab-grau);
  margin-bottom: var(--lab-space-block);
}

.lab-approach-media-placeholder {
  aspect-ratio: 16 / 9;
  background-color: var(--lab-weiss);
  background-image: radial-gradient(var(--lab-linie) 0.7px, transparent 0.7px);
  background-size: 0.5rem 0.5rem;
  border: 1px solid var(--lab-linie);
  width: 100%;
}

.lab-approach-media-placeholder > img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.lab-approach-media {
  margin: 0;
  min-width: 0;
  width: 100%;
}

.lab-approach-caption, .lab-profile-space-caption {
  color: var(--lab-grau);
  margin: 0.625rem 0 0;
}

.lab-approach-description ul {
  color: var(--lab-grau);
  font-weight: var(--lab-weight-light);
  list-style-position: outside;
  margin: var(--lab-space-heading) 0 0;
  padding-left: 1.1em;
  padding-top: var(--lab-space-block);
}

.lab-approach-description li + li {
  margin-top: 0.35rem;
}

.lab-approach-description .lab-approach-fields {
  list-style: none;
  margin: var(--lab-space-block) 0 0;
  padding: 0;
}

.lab-approach-description .lab-approach-fields li {
  display: block;
  font-size: var(--lab-fliesstext-size);
  font-weight: var(--lab-weight-light);
  line-height: var(--lab-fliesstext-line-height);
  padding-left: 0.8em;
  position: relative;
}

.lab-approach-description .lab-approach-fields li::before {
  color: var(--lab-blau);
  content: "_";
  left: 0;
  position: absolute;
  top: 0;
}

.lab-profile-team h2, .lab-profile-spaces h2 {
  color: var(--lab-grau);
  margin: 0 0 var(--lab-space-heading);
}

.lab-profile-team-grid {
  display: grid;
  gap: var(--lab-gap);
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lab-profile-placeholder {
  background-color: var(--lab-weiss);
  background-image: radial-gradient(var(--lab-linie) 0.7px, transparent 0.7px);
  background-size: 0.5rem 0.5rem;
  border: 1px solid var(--lab-linie);
  width: 100%;
}

.lab-profile-person .lab-profile-placeholder {
  aspect-ratio: 1 / 1;
  margin-bottom: 1rem;
}

.lab-team-media {
  isolation: isolate;
  overflow: hidden;
  position: relative;
}

.lab-team-portrait {
  height: 100%;
  inset: 0;
  object-fit: cover;
  position: absolute;
  width: 100%;
}

.lab-team-triangle-field {
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 1;
}

.lab-team-triangle {
  height: calc(100% / 12 + 0.5px);
  opacity: 0;
  position: absolute;
  transform: scale(0.35);
  transition: opacity 360ms ease, transform 980ms cubic-bezier(0.22, 1, 0.36, 1);
  transition-delay: var(--lab-triangle-reverse-delay, 0ms);
  width: calc(100% / 12 + 0.5px);
}

.lab-team-triangle-0 {
  clip-path: polygon(0 0, 100% 0, 100% 100%);
  transform-origin: 100% 0;
}

.lab-team-triangle-1 {
  clip-path: polygon(0 0, 0 100%, 100% 100%);
  transform-origin: 0 100%;
}

@media (hover: hover) and (pointer: fine) {
  .lab-profile-person:hover .lab-team-triangle, .lab-profile-person:focus-within .lab-team-triangle {
    opacity: 1;
    transform: scale(1);
    transition-delay: var(--lab-triangle-delay);
  }
}

@media (hover: hover) and (pointer: fine) {
  .lab-profile-person:hover .lab-team-triangle.is-accent, .lab-profile-person:focus-within .lab-team-triangle.is-accent {
    animation: lab-team-triangle-accent 1050ms ease var(--lab-triangle-delay) both;
  }
}

@keyframes lab-team-triangle-accent {
  0%, 48% {
    background-color: var(--lab-blau);
    background-blend-mode: screen;
  }
  100% {
    background-color: transparent;
    background-blend-mode: normal;
  }
}

@media (hover: none), (prefers-reduced-motion: reduce) {
  .lab-team-triangle-field {
    display: none;
  }
}

.lab-profile-person h3, .lab-profile-person p {
  color: var(--lab-grau);
  margin: 0;
}

.lab-profile-person p {
  margin-top: 0.35rem;
}

.lab-profile-spaces {
  padding-bottom: calc(var(--lab-section-y) * 1.5);
}

/* The LAB image groups are separate desktop rows; mobile stacks need the same grid gap between them. */

@media (max-width: 899px) {
  .lab-profile-spaces > .lab-grid-4 + .lab-grid-4 {
    margin-top: var(--lab-gap);
  }
}

.lab-profile-spaces-grid {
  display: grid;
  gap: calc(var(--lab-section-y) * 0.75) var(--lab-gap);
  grid-template-columns: 1fr;
}

.lab-profile-spaces figure {
  margin: 0;
}

.lab-profile-spaces figcaption {
  color: var(--lab-grau);
  margin-top: 0.625rem;
  text-transform: uppercase;
}

.lab-job-copy p {
  margin: 0;
}

.lab-job-copy p + p {
  margin-top: var(--lab-space-block);
}

.lab-job-copy a {
  color: var(--lab-blau);
}

.lab-vita-section {
  padding-bottom: 0;
  padding-top: var(--lab-space-media-text);
}

.lab-vita-page .lab-profile-hero h1 {
  margin-bottom: var(--lab-space-heading);
}

.lab-vita-page .lab-profile-hero + .lab-vita-section {
  padding-top: var(--lab-space-heading);
}

.lab-vita-section h2, .lab-vita-copy {
  margin: 0;
}

.lab-vita-section-heading {
  margin-bottom: var(--lab-space-heading);
}

.lab-vita-section .lab-type-info-head {
  margin: 0;
}

.lab-vita-timeline {
  margin: 0;
}

.lab-vita-entry {
  display: grid;
  gap: var(--lab-space-block);
  grid-template-columns: 1fr;
  padding: 0.5rem 0;
}

.lab-vita-entry:first-child {
  padding-top: 0;
}

.lab-vita-timeline {
  display: grid;
  row-gap: 0.35rem;
}

.lab-vita-entry p, .lab-vita-entry time {
  color: var(--lab-grau);
  margin: 0;
}

.lab-vita-entry a, .lab-vita-copy a, .lab-vita-list a, .lab-vita-block-copy a {
  color: inherit;
  text-decoration: none;
  transition: color 180ms ease;
}

.lab-vita-entry a:hover, .lab-vita-entry a:focus-visible, .lab-vita-copy a:hover, .lab-vita-copy a:focus-visible, .lab-vita-list a:hover, .lab-vita-list a:focus-visible, .lab-vita-block-copy a:hover, .lab-vita-block-copy a:focus-visible {
  color: var(--lab-blau);
}

.lab-vita-list {
  display: grid;
  font-size: var(--lab-fliesstext-size);
  font-weight: var(--lab-weight-light);
  gap: var(--lab-space-block) var(--lab-gap);
  line-height: var(--lab-fliesstext-line-height);
  list-style: none;
  margin: 0;
  padding: 0;
}

.lab-vita-section-last {
  padding-bottom: calc(var(--lab-section-y) * 1.5);
}

@media (min-width: 900px) {
  .lab-profile-wordmark-col {
    grid-column: 1 / span 2;
  }
}

@media (min-width: 900px) {
  .lab-vita-entry {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 900px) {
  .lab-vita-entry time {
    grid-column: span 1;
  }
}

@media (min-width: 900px) {
  .lab-vita-entry p {
    grid-column: span 3;
  }
}

@media (min-width: 900px) {
  .lab-vita-list-two-columns {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 900px) {
  .lab-profile-copy-col {
    grid-column: 3 / span 2;
  }
}

@media (min-width: 900px) {
  .lab-approach-content {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 900px) {
  .lab-approach-media, .lab-approach-media-placeholder {
    grid-column: 1 / span 2;
  }
}

@media (min-width: 900px) {
  .lab-approach-description {
    grid-column: 3 / span 2;
  }
}

@media (min-width: 900px) {
  .lab-approach-item-reversed .lab-approach-media, .lab-approach-item-reversed .lab-approach-media-placeholder {
    grid-column: 3 / span 2;
    grid-row: 1;
  }
}

@media (min-width: 900px) {
  .lab-approach-item-reversed .lab-approach-description {
    grid-column: 1 / span 2;
    grid-row: 1;
  }
}

@media (min-width: 900px) {
  .lab-approach-description ul {
    column-count: 2;
    column-gap: var(--lab-gap);
  }
}

@media (min-width: 900px) {
  .lab-approach-description li {
    break-inside: avoid;
  }
}

@media (min-width: 900px) {
  .lab-profile-team-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 900px) {
  .lab-profile-spaces-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 900px) {
  .lab-profile-space-wide {
    grid-column: 1 / -1;
  }
}

@media (max-width: 899px) {
  .lab-profile-page {
    padding-top: var(--lab-section-y);
  }
}

@media (max-width: 899px) {
  .lab-profile-copy {
    margin-top: var(--lab-section-y);
  }
}

@media (max-width: 899px) {
  .lab-profile-team-grid {
    gap: var(--lab-section-y) var(--lab-gap);
  }
}

.lab-project-main {
  padding-top: clamp(5rem, 11vw, 12rem);
}

.lab-project-hero .lab-project-kicker {
  color: var(--lab-grau);
  margin: 0 0 var(--lab-space-block);
}

.lab-project-hero-title {
  margin: 0;
  overflow-wrap: anywhere;
}

.lab-project-hero .lab-grid-4 {
  row-gap: var(--lab-space-heading);
}

.lab-project-meta {
  align-items: start;
  display: grid;
  gap: var(--lab-gap);
  grid-template-columns: 1fr;
  margin: var(--lab-space-heading) auto 0;
  max-width: var(--lab-grid-max);
  min-width: 0;
  padding-bottom: 0;
  padding-top: 0;
  width: 100%;
}

.lab-project-meta-title, .lab-project-meta-title h2, .lab-project-meta-year {
  min-width: 0;
}

.lab-project-meta-title h2, .lab-project-meta-year {
  margin: 0;
}

.lab-project-meta-title h2 {
  overflow-wrap: anywhere;
}

.lab-project-meta-year {
  align-items: baseline;
  display: flex;
  gap: 0.5rem;
  justify-content: flex-start;
  white-space: nowrap;
}

.lab-project-overview, .lab-project-copy, .lab-project-media-section, .lab-project-section, .lab-project-related {
  padding-bottom: 0;
  padding-top: var(--lab-space-media-text);
}

.lab-project-copy .lab-grid-4, .lab-project-overview .lab-grid-4, .lab-project-media-section .lab-grid-4, .lab-project-related .lab-grid-4 {
  row-gap: var(--lab-gap);
}

.lab-info-block {
  align-content: start;
  display: grid;
  gap: var(--lab-space-block);
}

.lab-info-item p, .lab-project-copy p, .lab-project-credits p, .lab-project-rule p {
  margin-bottom: 0;
  margin-top: 0;
}

.lab-info-item p + p {
  margin-top: 0.5rem;
}

.lab-info-item time {
  display: block;
  margin-top: 0.5rem;
}

.lab-info-item time + .lab-type-info-head {
  margin-top: var(--lab-space-block);
}

.lab-project-rule h2 {
  margin: 0;
}

.lab-info-item p:last-child, .lab-project-copy p:last-child, .lab-project-credits p:last-child, .lab-project-rule p:last-child {
  margin-bottom: 0;
}

.lab-project-copy .lab-type-fliesstext + .lab-type-fliesstext {
  margin-top: var(--lab-space-block);
}

.lab-project-related-back {
  margin-top: var(--lab-space-heading);
}

.lab-project-credits {
  border-top: 0 !important;
  padding-top: 0;
}

.lab-project-credits-section {
  padding-top: var(--lab-space-heading);
}

.lab-project-related {
  padding-bottom: calc(var(--lab-section-y) * 1.5);
}

.lab-project-rule {
  border-top: 0 !important;
  padding-top: var(--lab-space-heading);
}

@media (min-width: 900px) {
  .lab-project-meta {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 900px) {
  .lab-project-meta-title {
    grid-column: span 3;
  }
}

@media (min-width: 900px) {
  .lab-project-meta-year {
    grid-column: 4;
    justify-content: flex-end;
    text-align: right;
  }
}

@media (max-width: 899px) {
  .lab-project-main {
    padding-top: var(--lab-section-y);
  }
}

/* Feedback iteration: project-card metadata and Vita text blocks. */

.lab-home-project-meta time {
  font-size: var(--lab-info-head-size);
  font-weight: var(--lab-weight-bold);
  letter-spacing: 0;
  line-height: var(--lab-info-head-line-height);
  text-transform: uppercase;
}

.lab-home-recent-title {
  margin: 0;
}

.lab-vita-page .lab-vita-section .lab-profile-container {
  margin-left: auto;
  margin-right: auto;
  max-width: var(--lab-grid-max);
}

.lab-vita-page .lab-vita-section .lab-grid-4 {
  display: block;
}

.lab-vita-page .lab-vita-section-heading {
  margin-bottom: 0.5rem;
}

.lab-vita-page .lab-vita-list, .lab-vita-page .lab-vita-list-two-columns {
  display: block;
  font-size: var(--lab-fliesstext-size);
  font-weight: var(--lab-weight-light);
  line-height: var(--lab-fliesstext-line-height);
}

.lab-vita-page .lab-vita-list li {
  display: inline;
}

.lab-vita-page .lab-vita-list li:not(:last-child)::after {
  content: " . ";
}

.lab-vita-page .lab-vita-list time {
  font-weight: var(--lab-weight-regular);
}

.lab-privacy-content {
  padding-bottom: calc(var(--lab-section-y) * 1.5);
}

.lab-privacy-content .lab-profile-container {
  margin-left: auto;
  margin-right: auto;
  max-width: var(--lab-grid-max);
}

.lab-privacy-lead, .lab-privacy-block p {
  color: var(--lab-grau);
  margin: 0;
}

.lab-privacy-block {
  margin-top: var(--lab-space-media-text);
}

.lab-privacy-block h2 {
  margin: 0 0 var(--lab-space-block);
}

.lab-privacy-block h3 {
  color: var(--lab-grau);
  margin: var(--lab-space-heading) 0 0.5rem;
}

.lab-privacy-block p + p {
  margin-top: var(--lab-space-block);
}

.lab-privacy-media-settings {
  margin-top: var(--lab-space-block);
}

.lab-privacy-media-settings > p {
  margin: 0;
}

.lab-privacy-media-settings > div {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 0.75rem;
}

.lab-privacy-setting-button {
  background: var(--lab-weiss);
  border: 1px solid var(--lab-schwarz);
  color: var(--lab-schwarz);
  cursor: pointer;
  padding: 0.7rem 0.85rem 0.6rem;
}

.lab-privacy-setting-button:hover, .lab-privacy-setting-button:focus-visible {
  border-color: var(--lab-blau);
  color: var(--lab-blau);
}

[data-video-consent-status]:not(:empty) {
  color: var(--lab-grau);
  margin-top: 0.75rem !important;
}

.lab-privacy-block a {
  color: var(--lab-blau);
}

.lab-vita-block-copy {
  color: var(--lab-grau);
  margin: 0;
}

.lab-vita-block-copy strong {
  font-weight: var(--lab-weight-bold);
}

/* Imported project pages */

.lab-project-landscape {
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.lab-project-back {
  display: inline-flex;
  text-decoration: none;
}

.lab-project-back:hover, .lab-project-back:focus-visible {
  color: var(--lab-blau);
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

.lab-project-video {
  overflow: hidden;
  position: relative;
  width: 100%;
}

.lab-project-video iframe {
  border: 0;
  display: block;
  height: 100%;
  width: 100%;
}

.lab-video-consent {
  align-items: center;
  background: var(--lab-hellgrau);
  color: var(--lab-grau);
  display: flex;
  flex-direction: column;
  inset: 0;
  justify-content: center;
  padding: var(--lab-space-block);
  position: absolute;
  text-align: center;
}

.lab-video-consent p {
  font-size: var(--lab-fliesstext-size);
  font-weight: var(--lab-weight-light);
  line-height: var(--lab-fliesstext-line-height);
  margin: 0;
  max-width: 34rem;
}

.lab-video-consent-button {
  background: var(--lab-weiss);
  border: 1px solid var(--lab-schwarz);
  color: var(--lab-schwarz);
  cursor: pointer;
  margin-top: var(--lab-space-block);
  padding: 0.7rem 0.85rem 0.6rem;
}

.lab-video-consent-button:hover, .lab-video-consent-button:focus-visible {
  border-color: var(--lab-blau);
  color: var(--lab-blau);
}

.lab-video-consent a {
  color: var(--lab-grau);
  margin-top: 0.75rem;
  text-decoration-color: var(--lab-blau);
  text-decoration-line: underline;
  text-underline-offset: 0.16em;
}

.lab-project-copy a, .lab-job-copy a, .lab-vita-entry a, .lab-vita-copy a, .lab-vita-list a, .lab-vita-block-copy a, .lab-vita-page .main-text a, .lab-privacy-block a {
  color: var(--lab-grau);
  text-decoration-color: var(--lab-blau);
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.16em;
}

.lab-project-copy a:hover, .lab-project-copy a:focus-visible, .lab-job-copy a:hover, .lab-job-copy a:focus-visible, .lab-vita-entry a:hover, .lab-vita-entry a:focus-visible, .lab-vita-copy a:hover, .lab-vita-copy a:focus-visible, .lab-vita-list a:hover, .lab-vita-list a:focus-visible, .lab-vita-block-copy a:hover, .lab-vita-block-copy a:focus-visible, .lab-vita-page .main-text a:hover, .lab-vita-page .main-text a:focus-visible, .lab-privacy-block a:hover, .lab-privacy-block a:focus-visible {
  color: var(--lab-blau);
  text-decoration-thickness: 2px;
}

.lab-project-media-trigger {
  background: none;
  border: 0;
  cursor: zoom-in;
  display: block;
  padding: 0;
  width: 100%;
}

.lab-project-media-trigger:focus-visible {
  outline: 2px solid var(--lab-blau);
  outline-offset: 4px;
}

.lab-project-lightbox {
  --bs-modal-bg: var(--lab-weiss);
  --bs-modal-border-radius: 0;
}

.lab-project-lightbox-dialog {
  left: calc(var(--lab-lightbox-scrollbar-width, 0px) / -2);
  margin: var(--lab-page-x) auto;
  max-width: var(--lab-grid-max);
  width: calc(100% - (2 * var(--lab-page-x)));
}

.lab-project-lightbox .modal-content {
  background: transparent;
  border: 0;
  border-radius: 0;
}

.lab-project-lightbox .modal-header {
  align-items: flex-start;
  border-bottom: 0;
  left: var(--lab-lightbox-image-left, 0px);
  padding: var(--lab-gap);
  pointer-events: none;
  position: absolute;
  right: auto;
  top: 0;
  width: var(--lab-lightbox-image-width, 100%);
  z-index: 1;
}

.modal-backdrop.show {
  backdrop-filter: blur(18px) saturate(0.78);
  -webkit-backdrop-filter: blur(18px) saturate(0.78);
  background-color: rgba(255, 255, 255, 0.7);
  opacity: 1;
}

.lab-project-lightbox .modal-header .modal-title {
  display: none;
}

.lab-project-lightbox .modal-header .btn-close {
  align-items: center;
  background: var(--lab-weiss);
  background-image: none;
  border-radius: 0;
  display: inline-flex;
  filter: none;
  height: 2rem;
  justify-content: center;
  opacity: 1;
  padding: 0;
  pointer-events: auto;
  position: relative;
  width: 2rem;
}

.lab-project-lightbox .modal-header .btn-close::before, .lab-project-lightbox .modal-header .btn-close::after {
  background: var(--lab-blau);
  content: "";
  height: 2px;
  position: absolute;
  width: 0.85rem;
}

.lab-project-lightbox .modal-header .btn-close::before {
  transform: rotate(45deg);
}

.lab-project-lightbox .modal-header .btn-close::after {
  transform: rotate(-45deg);
}

.lab-project-lightbox .modal-body {
  padding: 0;
}

.lab-project-lightbox .modal-body img {
  display: block;
  height: auto;
  margin: 0 auto;
  max-height: calc(100vh - (2 * var(--lab-page-x)));
  max-width: 100%;
  object-fit: contain;
  width: auto;
}

/* Central project-card output */

.lab-project-related .lab-grid-4 > [data-project-list="related"] {
  display: contents !important;
}

.lab-home-project-meta h3 {
  margin: 0;
  text-transform: uppercase !important;
  transition: color 220ms ease;
}

.lab-home-project-card:hover .lab-home-project-meta h3, .lab-home-project-card:focus-visible .lab-home-project-meta h3 {
  color: var(--lab-blau);
}

@media (min-width: 900px) {
  .lab-projects-grid > .lab-home-project-card {
    grid-column: auto !important;
    min-width: 0;
  }
}

.lab-home-all-projects {
  margin-top: 100px;
}

.lab-tuple-mobile-selects {
  display: none;
}

@media (max-width: 899px) {
  .lab-tuple-words {
    display: none;
  }
}

@media (max-width: 899px) {
  .lab-tuple-mobile-selects {
    display: grid;
    gap: 0.6rem;
    grid-template-columns: minmax(0, 1fr);
    margin-top: var(--lab-space-block);
    max-width: 30rem;
  }
}

@media (max-width: 899px) {
  .lab-tuple-mobile-select {
    backdrop-filter: blur(18px) saturate(0.78);
    -webkit-backdrop-filter: blur(18px) saturate(0.78);
    background-color: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 0;
    color: var(--lab-schwarz);
    cursor: pointer;
    font-family: var(--lab-font-family);
    font-size: clamp(2rem, 9vw, 3rem);
    font-weight: var(--lab-weight-bold);
    letter-spacing: -0.045em;
    line-height: 0.84;
    min-height: 3.4rem;
    padding: 0.55rem 0.8rem;
    text-transform: uppercase;
    width: 100%;
  }
}

@media (max-width: 899px) {
  .lab-tuple-mobile-select option {
    font-family: var(--lab-font-family);
    font-size: var(--lab-auszeichnung-size);
    font-weight: var(--lab-weight-regular);
    letter-spacing: 0;
  }
}

@media (max-width: 899px) {
  .lab-tuple-mobile-select:focus-visible {
    outline: 2px solid var(--lab-blau);
    outline-offset: 0.16rem;
  }
}

@media (max-width: 899px) {
  .lab-home-wordmark {
    font-size: clamp(2.4rem, 12vw, 3.25rem);
  }
}

@media (max-width: 899px) {
  .lab-tuple-words {
    display: flex;
  }
}

@media (max-width: 899px) {
  .lab-tuple-line {
    align-items: start;
    grid-template-columns: minmax(0, 1fr);
    row-gap: 0.45rem;
  }
}

@media (max-width: 899px) {
  .lab-tuple-options, .lab-tuple-mobile-selects {
    display: none;
  }
}

@media (max-width: 899px) {
  .lab-tuple-mobile-select {
    backdrop-filter: blur(18px) saturate(0.78);
    -webkit-backdrop-filter: blur(18px) saturate(0.78);
    appearance: auto;
    background-color: rgba(255, 255, 255, 0.7);
    border: 0;
    color: var(--lab-blau);
    font-family: var(--lab-font-family);
    font-size: var(--lab-auszeichnung-size);
    font-weight: var(--lab-weight-regular);
    letter-spacing: 0;
    line-height: var(--lab-auszeichnung-line-height);
    min-height: 0;
    padding: 0;
    text-transform: uppercase;
    width: fit-content;
  }
}

.lab-tuple-mobile-select {
  display: none;
}

@media (max-width: 899px) {
  .lab-tuple-mobile-select {
    display: block;
  }
}

@media (max-width: 899px) {
  .lab-tuple-current {
    display: none;
  }
}

@media (max-width: 899px) {
  .lab-tuple-mobile-select {
    color: var(--lab-schwarz);
    font-size: clamp(2.25rem, 9vw, 3rem);
    font-weight: var(--lab-weight-bold);
    letter-spacing: -0.045em;
    line-height: 0.84;
    padding: 0;
    width: 100%;
  }
}

@media (max-width: 899px) {
  .lab-tuple-current {
    display: block;
  }
}

@media (max-width: 899px) {
  .lab-tuple-mobile-select {
    backdrop-filter: blur(18px) saturate(0.78);
    -webkit-backdrop-filter: blur(18px) saturate(0.78);
    background-color: rgba(255, 255, 255, 0.7);
    border: 0;
    color: var(--lab-grau);
    font-size: var(--lab-auszeichnung-size);
    font-weight: var(--lab-weight-regular);
    letter-spacing: 0;
    line-height: var(--lab-auszeichnung-line-height);
    margin-top: 0.45rem;
    padding: 0;
    width: 100%;
  }
}

@media (max-width: 899px) {
  .lab-tuple-line {
    position: relative;
  }
}

@media (max-width: 899px) {
  .lab-tuple-line::after {
    border-bottom: 0.12em solid var(--lab-blau);
    border-right: 0.12em solid var(--lab-blau);
    content: "";
    height: 0.45em;
    pointer-events: none;
    position: absolute;
    bottom: 0.08em;
    right: 0.12em;
    top: auto;
    transform: rotate(45deg);
    width: 0.45em;
  }
}

@media (max-width: 899px) {
  .lab-tuple-current {
    font-size: clamp(2.25rem, 9vw, 3rem);
  }
}

@media (max-width: 899px) {
  .lab-tuple-mobile-select {
    cursor: pointer;
    inset: 0;
    margin: 0;
    opacity: 0;
    padding: 0;
    position: absolute;
    z-index: 1;
  }
}

@media (max-width: 899px) {
  .lab-tuple-line:has(.lab-tuple-mobile-select:focus-visible) {
    outline: 2px solid var(--lab-blau);
    outline-offset: 0.2rem;
  }
}

@media (min-width: 900px) {
  .lab-tuple-line {
    padding-bottom: 0.65rem;
    position: relative;
  }
}

@media (min-width: 900px) {
  .lab-tuple-line::before {
    background: var(--lab-linie);
    bottom: 0;
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    right: 0;
  }
}

@media (min-width: 900px) {
  .lab-tuple-line::after {
    background: var(--lab-blau);
    bottom: 0;
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    right: 0;
    transform: scaleX(0);
    transform-origin: right center;
    transition: transform 720ms cubic-bezier(0.22, 1, 0.36, 1);
  }
}

@media (min-width: 900px) {
  .lab-tuple-line:has(.lab-tuple-option:hover)::after {
    transform: scaleX(1);
  }
}

@media (min-width: 900px) {
  .lab-tuple-line::before, .lab-tuple-line::after {
    right: auto;
    width: var(--lab-tuple-line-end, 100%);
  }
}

@media (min-width: 900px) {
  .lab-tuple-line::after {
    transition-duration: 1.35s;
  }
}

@media (min-width: 900px) {
  .lab-tuple-option.is-active {
    position: relative;
  }
}

@media (min-width: 900px) {
  .lab-tuple-option.is-active::after {
    background: var(--lab-blau);
    bottom: -0.65rem;
    content: "";
    height: calc(100% + 0.65rem);
    position: absolute;
    right: -0.42rem;
    width: 2px;
  }
}

@media (min-width: 900px) {
  .lab-tuple-line::before, .lab-tuple-line::after {
    bottom: 0.65rem;
  }
}

@media (min-width: 900px) {
  .lab-tuple-option.is-active::after {
    content: none;
  }
}

@media (min-width: 900px) {
  .lab-tuple-line::before, .lab-tuple-line::after {
    left: var(--lab-tuple-line-start, 0px);
    width: var(--lab-tuple-line-width, 0px);
  }
}

@media (min-width: 900px) {
  .lab-tuple-line::before, .lab-tuple-line::after {
    bottom: calc(0.65rem + 0.15em + 0.3rem);
    left: calc(var(--lab-tuple-line-start, 0px) + 0.65rem);
    width: max(0px, calc(var(--lab-tuple-line-width, 0px) - 0.65rem));
  }
}

@media (min-width: 900px) {
  .lab-tuple-options {
    transform: none;
  }
}

@media (min-width: 900px) {
  .lab-tuple-options {
    padding-bottom: 0.7rem;
  }
}

@media (min-width: 900px) {
  .lab-tuple-line::before {
    transition: width 680ms cubic-bezier(0.22, 1, 0.36, 1);
  }
}

@media (min-width: 900px) {
  .lab-tuple-line::after {
    transition: width 680ms cubic-bezier(0.22, 1, 0.36, 1), transform 1.6s cubic-bezier(0.22, 1, 0.36, 1);
  }
}

@media (max-width: 399px) {
  .lab-nav-links {
    gap: 0.55rem;
  }
}

@media (max-width: 399px) {
  .lab-nav-links a {
    font-size: 0.8rem;
  }
}

/* Content images open in the shared lightbox; project-card thumbnails stay excluded in JavaScript. */

.lab-image-zoomable {
  cursor: zoom-in;
}

.lab-image-zoomable:focus-visible {
  outline: 2px solid var(--lab-blau);
  outline-offset: 4px;
}

