.alq-kontakt-first {
  --alq-kontakt-head-top: clamp(8rem, 14vw, 13rem);
  --alq-kontakt-qr-size: clamp(128px, 13vw, 184px);
  --alq-kontakt-qr-inset-x: clamp(0px, 6vw, 6.5rem);

  border-top: 0 !important;
}

.alq-kontakt-first .alq-mc-section-wrap {
  padding-top: calc(var(--alq-kontakt-head-top) - var(--alq-mc-title-offset-y, 0rem));
}

.alq-kontakt-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: clamp(2.5rem, 7vw, 6rem);
  align-items: start;
  width: 100%;
  padding-right: var(--alq-kontakt-qr-inset-x);
}

.alq-kontakt-intro .alq-mc-body {
  max-width: 100%;
}

.alq-kontakt-qr-block {
  width: var(--alq-kontakt-qr-size);
}

.alq-kontakt-qr {
  display: block;
  width: 100%;
  line-height: 0;
}

.alq-kontakt-qr img {
  display: block;
  width: 100%;
  height: auto;
}

/* Same typography as the footer copyright line (.alq-site-footer__legal). */
.alq-kontakt-qr-caption {
  margin: 0.75rem 0 0;
  text-align: center;
  color: var(--alq-color-muted);
  font-family: var(--alq-type-mono-family);
  font-size: var(--alq-type-legal-size);
  font-weight: var(--alq-type-mono-weight);
  line-height: var(--alq-type-mono-line-height);
  letter-spacing: var(--alq-type-mono-letter-spacing);
}

/*
  From 1024px up the section head is two columns, so the H1 box sits at the
  wrap's padding-top plus the title offset — i.e. exactly --alq-kontakt-head-top.
  Lifting the QR block out of flow onto that line keeps its column reserved so
  the body copy keeps its width. Below 1024px the layout is left untouched.

  Two optical corrections put the *visible* edges flush rather than the boxes:
  the QR carries a 4-of-45-module quiet zone above its first dark row, and the
  H1's cap height starts 0.157em below its line box (Inter, line-height 1.05).
*/
@media (min-width: 1024px) {
  .alq-kontakt-intro {
    grid-template-columns: minmax(0, 1fr) var(--alq-kontakt-qr-size);
  }

  .alq-kontakt-qr-block {
    position: absolute;
    top: calc(
      var(--alq-kontakt-head-top)
      + var(--alq-mc-title-size) * 0.157
      - var(--alq-kontakt-qr-size) * 4 / 45
    );
    right: calc(var(--alq-mc-padding-x) + var(--alq-kontakt-qr-inset-x));
  }
}

.alq-kontakt-link,
.alq-kontakt-link:link,
.alq-kontakt-link:visited,
.alq-kontakt-link:hover,
.alq-kontakt-link:focus,
.alq-kontakt-link:active {
  max-width: 100%;
  color: var(--alq-mc-fg);
  text-decoration: none;
  overflow-wrap: break-word;
}

.alq-kontakt-links {
  display: flex;
  flex-direction: column;
  gap: clamp(1.75rem, 3.5vw, 3rem);
}

.alq-kontakt-outro {
  margin-top: clamp(2.5rem, 5vw, 4.5rem);
}

@media (max-width: 780px) {
  .alq-kontakt-br {
    display: none;
  }

  .alq-kontakt-intro {
    grid-template-columns: minmax(0, 1fr);
    gap: 2.5rem;
    padding-right: 0;
  }

  .alq-kontakt-first {
    --alq-kontakt-qr-size: clamp(132px, 38vw, 168px);
  }
}