:root {
  --clr-neutral-900: rgba(0, 0, 0, 1);
  --clr-neutral-600: rgba(135, 135, 135, 1);
  --clr-neutral-500: rgba(153, 153, 153, 1);
  --clr-neutral-100: rgba(255, 255, 255, 1);
  --clr-brown-500: rgba(206, 192, 179, 1);
  --clr-blue-500: rgba(0, 135, 255, 1);
  --clr-orange-500: rgba(255, 78, 0, 1);
  --ff-big-font: "neue-haas-grotesk-text", sans-serif;
  --ff-small-font: "neue-haas-grotesk-text", sans-serif;
  --root-font-size: 100%;
  --txt-xs: clamp(0.75rem, calc(-0.1858782904vw + 0.7918226153rem), 0.6331290249rem);
  --txt-s: clamp(0.8125rem, calc(0.0500373602vw + 0.8012415939rem), 0.8439609902rem);
  --txt-m: clamp(1rem, calc(0.1988071571vw + 0.9552683897rem), 1.125rem);
  --txt-l: clamp(1.2rem, calc(0.4765407555vw + 1.09277833rem), 1.499625rem);
  --txt-xl: clamp(1.44rem, calc(0.8890658052vw + 1.2399601938rem), 1.999000125rem);
  --txt-xxl: clamp(1.728rem, calc(1.489729092vw + 1.3928109543rem), 2.6646671666rem);
  --h6: clamp(0.75rem, calc(-0.073993329vw + 0.766648499rem), 0.7034766944rem);
  --h5: clamp(0.8125rem, calc(0.1991800137vw + 0.7676844969rem), 0.9377344336rem);
  --h4: clamp(1.125rem, calc(0.1988071571vw + 1.0802683897rem), 1.25rem);
  --h3: clamp(1.35rem, calc(0.5029821074vw + 1.2368290258rem), 1.66625rem);
  --h2: clamp(1.62rem, calc(0.9560417495vw + 1.4048906064rem), 2.22111125rem);
  --h1: clamp(1.944rem, calc(1.6170835726vw + 1.5801561962rem), 2.9607412963rem);
  --heading-line-height: calc(4px + 2ex);
  --txt-line-height: calc(6px + 2ex);
  --space-xs: clamp(0.8441720333rem, calc(-0.0172384889vw + 0.8480506933rem), 0.8333333333rem);
  --space-s: clamp(1.1252813203rem, calc(0.1983597291vw + 1.0806503813rem), 1.25rem);
  --space-m: clamp(1.5rem, calc(0.5964214712vw + 1.365805169rem), 1.875rem);
  --space-l: clamp(1.9995rem, calc(1.2930417495vw + 1.7085656064rem), 2.8125rem);
  --space-xl: clamp(2.6653335rem, calc(2.4706425447vw + 2.1094389274rem), 4.21875rem);
  --space-xxl: clamp(3.5528895555rem, calc(4.4138933511vw + 2.5597635515rem), 6.328125rem);
  --section-space-xs: clamp(1.6883440665rem, calc(1.2909040692vw + 1.3978906509rem), 2.5rem);
  --section-space-s: clamp(2.2505626407rem, calc(2.3847910288vw + 1.7139846592rem), 3.75rem);
  --section-space-m: clamp(3rem, calc(4.1749502982vw + 2.0606361829rem), 5.625rem);
  --section-space-l: clamp(3.999rem, calc(7.0592445328vw + 2.4106699801rem), 8.4375rem);
  --section-space-xl: clamp(5.330667rem, calc(11.6510266402vw + 2.709186006rem), 12.65625rem);
  --section-space-xxl: clamp(7.105779111rem, calc(18.8923990282vw + 2.8549893296rem), 18.984375rem);
  --section-padding-x: clamp(1.25rem, calc(3.9761431412vw + 0.3553677932rem), 3.75rem);
  --paragraph-spacing: 1em;
  --heading-spacing: 1.2em;
  --list-spacing: var(--paragraph-spacing);
  --list-indent-spacing: 2em;
  --list-item-spacing: 0.5em;
  --nested-list-indent-spacing: 1em;
  --flow-spacing: var(--paragraph-spacing);
  --figure-spacing: var(--paragraph-spacing);
  --figcaption-spacing: 0.5em;
  --blockquote-spacing: var(--paragraph-spacing);
  --mapped-column-gap: var(--space-m); /* Fallback falls nichts anderes definiert ist */
  --grid-height: auto;
}

.m-t-xxs {
  margin-top: calc(calc(var(--space-xs) / 2) * 2);
}

.m-t-xs {
  margin-top: calc(var(--space-xs) * 2);
}

.m-t-s {
  margin-top: calc(var(--space-s) * 2);
}

.m-t-m {
  margin-top: calc(var(--space-m) * 2);
}

.m-t-l {
  margin-top: calc(var(--space-l) * 2);
}

.m-t-xl {
  margin-top: calc(var(--space-xl) * 2);
}

.m-t-xxl {
  margin-top: calc(var(--space-xxl) * 2);
}

@media (max-width: 768px) {
  .m-sm-t-xxs {
    margin-top: calc(calc(var(--space-xs) / 2) * 2);
  }
  .m-sm-t-xs {
    margin-top: calc(var(--space-xs) * 2);
  }
  .m-sm-t-s {
    margin-top: calc(var(--space-s) * 2);
  }
  .m-sm-t-m {
    margin-top: calc(var(--space-m) * 2);
  }
  .m-sm-t-l {
    margin-top: calc(var(--space-l) * 2);
  }
  .m-sm-t-xl {
    margin-top: calc(var(--space-xl) * 2);
  }
  .m-sm-t-xxl {
    margin-top: calc(var(--space-xxl) * 2);
  }
}
@media (min-width: 768px) {
  .m-mb-t-xxs {
    margin-top: calc(calc(var(--space-xs) / 2) * 2);
  }
  .m-mb-t-xs {
    margin-top: calc(var(--space-xs) * 2);
  }
  .m-mb-t-s {
    margin-top: calc(var(--space-s) * 2);
  }
  .m-mb-t-m {
    margin-top: calc(var(--space-m) * 2);
  }
  .m-mb-t-l {
    margin-top: calc(var(--space-l) * 2);
  }
  .m-mb-t-xl {
    margin-top: calc(var(--space-xl) * 2);
  }
  .m-mb-t-xxl {
    margin-top: calc(var(--space-xxl) * 2);
  }
}
.m-b-xxs {
  margin-bottom: calc(calc(var(--space-xs) / 2) * 2);
}

.m-b-xs {
  margin-bottom: calc(var(--space-xs) * 2);
}

.m-b-s {
  margin-bottom: calc(var(--space-s) * 2);
}

.m-b-m {
  margin-bottom: calc(var(--space-m) * 2);
}

.m-b-l {
  margin-bottom: calc(var(--space-l) * 2);
}

.m-b-xl {
  margin-bottom: calc(var(--space-xl) * 2);
}

.m-b-xxl {
  margin-bottom: calc(var(--space-xxl) * 2);
}

@media (max-width: 768px) {
  .m-sm-b-xxs {
    margin-bottom: calc(calc(var(--space-xs) / 2) * 2);
  }
  .m-sm-b-xs {
    margin-bottom: calc(var(--space-xs) * 2);
  }
  .m-sm-b-s {
    margin-bottom: calc(var(--space-s) * 2);
  }
  .m-sm-b-m {
    margin-bottom: calc(var(--space-m) * 2);
  }
  .m-sm-b-l {
    margin-bottom: calc(var(--space-l) * 2);
  }
  .m-sm-b-xl {
    margin-bottom: calc(var(--space-xl) * 2);
  }
  .m-sm-b-xxl {
    margin-bottom: calc(var(--space-xxl) * 2);
  }
}
@media (min-width: 768px) {
  .m-mb-b-xxs {
    margin-bottom: calc(calc(var(--space-xs) / 2) * 2);
  }
  .m-mb-b-xs {
    margin-bottom: calc(var(--space-xs) * 2);
  }
  .m-mb-b-s {
    margin-bottom: calc(var(--space-s) * 2);
  }
  .m-mb-b-m {
    margin-bottom: calc(var(--space-m) * 2);
  }
  .m-mb-b-l {
    margin-bottom: calc(var(--space-l) * 2);
  }
  .m-mb-b-xl {
    margin-bottom: calc(var(--space-xl) * 2);
  }
  .m-mb-b-xxl {
    margin-bottom: calc(var(--space-xxl) * 2);
  }
}
.m-l-xxs {
  margin-left: calc(calc(var(--space-xs) / 2) * 2);
}

.m-l-xs {
  margin-left: calc(var(--space-xs) * 2);
}

.m-l-s {
  margin-left: calc(var(--space-s) * 2);
}

.m-l-m {
  margin-left: calc(var(--space-m) * 2);
}

.m-l-l {
  margin-left: calc(var(--space-l) * 2);
}

.m-l-xl {
  margin-left: calc(var(--space-xl) * 2);
}

.m-l-xxl {
  margin-left: calc(var(--space-xxl) * 2);
}

@media (max-width: 768px) {
  .m-sm-l-xxs {
    margin-left: calc(calc(var(--space-xs) / 2) * 2);
  }
  .m-sm-l-xs {
    margin-left: calc(var(--space-xs) * 2);
  }
  .m-sm-l-s {
    margin-left: calc(var(--space-s) * 2);
  }
  .m-sm-l-m {
    margin-left: calc(var(--space-m) * 2);
  }
  .m-sm-l-l {
    margin-left: calc(var(--space-l) * 2);
  }
  .m-sm-l-xl {
    margin-left: calc(var(--space-xl) * 2);
  }
  .m-sm-l-xxl {
    margin-left: calc(var(--space-xxl) * 2);
  }
}
@media (min-width: 768px) {
  .m-mb-l-xxs {
    margin-left: calc(calc(var(--space-xs) / 2) * 2);
  }
  .m-mb-l-xs {
    margin-left: calc(var(--space-xs) * 2);
  }
  .m-mb-l-s {
    margin-left: calc(var(--space-s) * 2);
  }
  .m-mb-l-m {
    margin-left: calc(var(--space-m) * 2);
  }
  .m-mb-l-l {
    margin-left: calc(var(--space-l) * 2);
  }
  .m-mb-l-xl {
    margin-left: calc(var(--space-xl) * 2);
  }
  .m-mb-l-xxl {
    margin-left: calc(var(--space-xxl) * 2);
  }
}
.m-r-xxs {
  margin-right: calc(calc(var(--space-xs) / 2) * 2);
}

.m-r-xs {
  margin-right: calc(var(--space-xs) * 2);
}

.m-r-s {
  margin-right: calc(var(--space-s) * 2);
}

.m-r-m {
  margin-right: calc(var(--space-m) * 2);
}

.m-r-l {
  margin-right: calc(var(--space-l) * 2);
}

.m-r-xl {
  margin-right: calc(var(--space-xl) * 2);
}

.m-r-xxl {
  margin-right: calc(var(--space-xxl) * 2);
}

@media (max-width: 768px) {
  .m-sm-r-xxs {
    margin-right: calc(calc(var(--space-xs) / 2) * 2);
  }
  .m-sm-r-xs {
    margin-right: calc(var(--space-xs) * 2);
  }
  .m-sm-r-s {
    margin-right: calc(var(--space-s) * 2);
  }
  .m-sm-r-m {
    margin-right: calc(var(--space-m) * 2);
  }
  .m-sm-r-l {
    margin-right: calc(var(--space-l) * 2);
  }
  .m-sm-r-xl {
    margin-right: calc(var(--space-xl) * 2);
  }
  .m-sm-r-xxl {
    margin-right: calc(var(--space-xxl) * 2);
  }
}
@media (min-width: 768px) {
  .m-mb-r-xxs {
    margin-right: calc(calc(var(--space-xs) / 2) * 2);
  }
  .m-mb-r-xs {
    margin-right: calc(var(--space-xs) * 2);
  }
  .m-mb-r-s {
    margin-right: calc(var(--space-s) * 2);
  }
  .m-mb-r-m {
    margin-right: calc(var(--space-m) * 2);
  }
  .m-mb-r-l {
    margin-right: calc(var(--space-l) * 2);
  }
  .m-mb-r-xl {
    margin-right: calc(var(--space-xl) * 2);
  }
  .m-mb-r-xxl {
    margin-right: calc(var(--space-xxl) * 2);
  }
}
.p-t-xxs {
  padding-top: calc(calc(var(--space-xs) / 2) * 2);
}

.p-t-xs {
  padding-top: calc(var(--space-xs) * 2);
}

.p-t-s {
  padding-top: calc(var(--space-s) * 2);
}

.p-t-m {
  padding-top: calc(var(--space-m) * 2);
}

.p-t-l {
  padding-top: calc(var(--space-l) * 2);
}

.p-t-xl {
  padding-top: calc(var(--space-xl) * 2);
}

.p-t-xxl {
  padding-top: calc(var(--space-xxl) * 2);
}

.p-b-xxs {
  padding-bottom: calc(calc(var(--space-xs) / 2) * 2);
}

.p-b-xs {
  padding-bottom: calc(var(--space-xs) * 2);
}

.p-b-s {
  padding-bottom: calc(var(--space-s) * 2);
}

.p-b-m {
  padding-bottom: calc(var(--space-m) * 2);
}

.p-b-l {
  padding-bottom: calc(var(--space-l) * 2);
}

.p-b-xl {
  padding-bottom: calc(var(--space-xl) * 2);
}

.p-b-xxl {
  padding-bottom: calc(var(--space-xxl) * 2);
}

.p-l-xxs {
  padding-left: calc(calc(var(--space-xs) / 2) * 2);
}

.p-l-xs {
  padding-left: calc(var(--space-xs) * 2);
}

.p-l-s {
  padding-left: calc(var(--space-s) * 2);
}

.p-l-m {
  padding-left: calc(var(--space-m) * 2);
}

.p-l-l {
  padding-left: calc(var(--space-l) * 2);
}

.p-l-xl {
  padding-left: calc(var(--space-xl) * 2);
}

.p-l-xxl {
  padding-left: calc(var(--space-xxl) * 2);
}

.p-r-xxs {
  padding-right: calc(calc(var(--space-xs) / 2) * 2);
}

.p-r-xs {
  padding-right: calc(var(--space-xs) * 2);
}

.p-r-s {
  padding-right: calc(var(--space-s) * 2);
}

.p-r-m {
  padding-right: calc(var(--space-m) * 2);
}

.p-r-l {
  padding-right: calc(var(--space-l) * 2);
}

.p-r-xl {
  padding-right: calc(var(--space-xl) * 2);
}

.p-r-xxl {
  padding-right: calc(var(--space-xxl) * 2);
}

@media (max-width: 768px) {
  .order-sm-1 {
    order: 1;
  }
  .order-sm-2 {
    order: 2;
  }
  .order-sm-3 {
    order: 3;
  }
  .order-sm-4 {
    order: 4;
  }
  .order-sm-5 {
    order: 5;
  }
  .order-sm-6 {
    order: 6;
  }
}
@media (max-width: 960px) {
  .order-md-1 {
    order: 1;
  }
  .order-md-2 {
    order: 2;
  }
  .order-md-3 {
    order: 3;
  }
  .order-md-4 {
    order: 4;
  }
  .order-md-5 {
    order: 5;
  }
  .order-md-6 {
    order: 6;
  }
}
.txt-s {
  font-size: var(--txt-s);
}

.txt-m {
  font-size: var(--txt-m);
}

.txt-l {
  font-size: var(--txt-l);
}

.txt-xl {
  font-size: var(--txt-xl);
}

.txt-xxl {
  font-size: var(--txt-xxl);
}

.cases:not(a) {
  margin-block-start: var(--section-space-m);
}
.cases:not(a) .grid {
  grid-template-columns: 1fr;
  grid-gap: var(--section-space-s) 0;
  padding-inline: var(--space-s);
}
.cases:not(a) .grid:first-of-type {
  margin-block-end: var(--section-space-l);
}
@media (min-width: 768px) {
  .cases:not(a) .grid:first-of-type .column {
    grid-column: 1/var(--span);
  }
}
@media (min-width: 768px) {
  .cases:not(a) .grid {
    grid-template-columns: repeat(12, 1fr);
    padding-inline: var(--space-xl);
    grid-gap: var(--section-space-l) 0;
    align-items: start;
  }
}

.case-link {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs) 0;
}
.case-link img {
  display: block;
  width: 100%;
  position: relative;
}
.case-link span {
  display: block;
}
.case-link:hover {
  border-bottom: none;
}
@media (min-width: 768px) {
  .case-link {
    grid-column: var(--span);
  }
  .case-link:hover {
    cursor: url(../../icons/punkt_braun_transparent.svg) 30 30, pointer;
  }
}