.kontakt-page {
  overflow: clip;
}

.kontakt-page .section {
  position: relative;
}

.kontakt-hero__grid,
.kontakt-editorial__grid {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
  gap: var(--space-6);
  align-items: center;
}

.kontakt-hero__copy,
.kontakt-editorial__copy,
.kontakt-hero__visual,
.kontakt-editorial__figure {
  min-width: 0;
}

.kontakt-hero__copy {
  max-width: 44rem;
}

.kontakt-hero__copy .lead {
  max-width: 41rem;
}

.kontakt-hero__copy > .button {
  margin-top: var(--space-2);
}

.kontakt-hero__visual {
  position: relative;
  width: 100%;
  padding-bottom: var(--space-7);
}

.kontakt-hero__visual > img {
  width: 100%;
  min-width: 0;
  height: clamp(28.75rem, 42vw, 36rem);
  border-radius: var(--radius-xl);
  object-position: 62% center;
}

.kontakt-hero__module {
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: calc(var(--space-5) * -1);
  width: min(17.5rem, calc(100% - var(--space-3)));
  border-color: var(--color-border-aqua);
}

.kontakt-hero__module h2 {
  font-size: var(--text-28);
}

.kontakt-hero__module p:last-child {
  margin-bottom: 0;
  font-size: var(--text-14);
  line-height: 1.5;
}

.kontakt-basis {
  border-top: 1px solid var(--color-border);
}

.kontakt-basis__head,
.kontakt-eventarten__head,
.kontakt-briefing__head {
  width: min(100%, 42rem);
}

.kontakt-basis__modules {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
  margin-top: var(--space-7);
}

.kontakt-basis__module {
  position: relative;
  min-width: 0;
  padding-top: var(--space-7);
}

.kontakt-basis__module::before {
  position: absolute;
  top: var(--space-4);
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--color-border-aqua);
  content: "";
}

.kontakt-basis__number {
  position: absolute;
  top: calc(var(--space-4) * -1);
  right: 0;
  color: rgba(23, 33, 38, 0.08);
  font-family: var(--font-heading);
  font-size: 6rem;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 1;
}

.kontakt-basis__module h3 {
  position: relative;
  max-width: 16rem;
  font-size: var(--text-28);
}

.kontakt-basis__module > p:not(.kontakt-basis__tag) {
  position: relative;
  max-width: 29rem;
}

.kontakt-basis__tag {
  margin-bottom: 0;
  color: #087d88;
  font-size: var(--text-12);
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.4;
}

.kontakt-form-section {
  background: linear-gradient(180deg, rgba(220, 227, 227, 0.44), transparent 16rem);
}

.kontakt-form-shell {
  width: min(100%, 66rem);
  margin-inline: auto;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-frost-000);
  padding: clamp(var(--space-5), 4vw, var(--space-7));
  box-shadow: var(--shadow-card);
}

.kontakt-form__head {
  width: min(100%, 43rem);
}

.kontakt-form__required {
  font-size: var(--text-14);
}

.kontakt-form {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: var(--space-6);
  margin-top: var(--space-6);
}

.kontakt-form__group {
  min-width: 0;
  margin: 0;
  border-top: 1px solid var(--color-border-aqua);
  padding-top: var(--space-4);
}

.kontakt-form__group legend {
  color: #087d88;
  font-size: var(--text-12);
  letter-spacing: 0.12em;
}

.kontakt-form__group-help {
  width: min(100%, 38rem);
  font-size: var(--text-14);
}

.kontakt-form__grid {
  display: grid;
  min-width: 0;
  gap: var(--space-4) var(--space-5);
}

.kontakt-form__grid--two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.kontakt-form__grid--three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.kontakt-form__grid > .field {
  min-width: 0;
  margin-bottom: 0;
}

.kontakt-form input,
.kontakt-form select,
.kontakt-form textarea {
  min-height: 3rem;
}

.kontakt-form textarea {
  min-height: 10rem;
}

.kontakt-form .field-error[hidden],
.kontakt-form__casino-note[hidden] {
  display: none;
}

.kontakt-form__casino-note {
  margin-bottom: 0;
  border-left: 2px solid var(--color-aqua-500);
  padding-left: var(--space-3);
  color: var(--color-ink-700);
  font-size: var(--text-12);
  line-height: 1.5;
}

.kontakt-form__group--submit {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
}

.kontakt-form__group--submit > * {
  min-width: 0;
}

.kontakt-form__consent {
  display: flex;
  width: min(100%, 44rem);
  min-width: 0;
  align-items: flex-start;
  gap: var(--space-3);
}

.kontakt-form__consent label {
  margin: 0;
  font-weight: 500;
}

.kontakt-form__submit-note {
  width: min(100%, 44rem);
  margin: 0;
  font-size: var(--text-14);
}

.kontakt-form__status {
  width: min(100%, 44rem);
  min-height: 1.5rem;
  margin: 0;
  color: var(--color-ink-700);
  font-size: var(--text-14);
  font-weight: 700;
}

.kontakt-form__status.is-success {
  color: #376409;
}

.kontakt-form__status.is-error {
  color: #9c1f3d;
}

.kontakt-eventarten__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-5);
  margin-top: var(--space-7);
}

.kontakt-eventarten__card,
.kontakt-eventarten__notice {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
  margin: 0;
}

.kontakt-eventarten__card h3,
.kontakt-eventarten__card p {
  margin: 0;
}

.kontakt-eventarten__card .button {
  margin-top: auto;
}

.kontakt-eventarten__card--business {
  grid-column: span 6;
}

.kontakt-eventarten__card--private {
  grid-column: span 3;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-sand-100);
  padding: var(--space-5);
}

.kontakt-eventarten__card--casino {
  grid-column: span 3;
  border-radius: var(--radius-lg);
  background: var(--color-glass-dark);
  padding: var(--space-5);
}

.kontakt-eventarten__card--casino :is(h3, p) {
  color: var(--color-frost-000);
}

.kontakt-eventarten__card--casino .eyebrow {
  color: var(--color-lime-500);
}

.kontakt-eventarten__card--concept {
  grid-column: span 5;
}

.kontakt-eventarten__notice {
  grid-column: span 7;
  justify-content: center;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-5);
  background: var(--color-frost-000);
}

.kontakt-eventarten__notice span {
  width: 0.75rem;
  min-width: 0.75rem;
  height: 0.75rem;
  border-radius: 50%;
  background: var(--color-lime-500);
}

.kontakt-eventarten__notice p {
  margin: 0;
  color: var(--color-ink-950);
}

.kontakt-prozess {
  overflow: hidden;
}

.kontakt-prozess__head {
  width: min(100%, 35rem);
}

.kontakt-prozess__head .eyebrow {
  color: var(--color-aqua-500);
}

.kontakt-prozess__steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-5);
  margin-top: var(--space-7);
}

.kontakt-prozess__step {
  position: relative;
  min-width: 0;
  border-top: 1px solid rgba(18, 185, 199, 0.72);
  padding-top: var(--space-5);
}

.kontakt-prozess__step > span {
  display: block;
  margin-bottom: var(--space-3);
  color: rgba(255, 255, 255, 0.16);
  font-family: var(--font-heading);
  font-size: 4rem;
  line-height: 0.8;
}

.kontakt-prozess__step h3 {
  color: var(--color-frost-000);
  font-size: var(--text-28);
}

.kontakt-prozess__step p {
  color: rgba(255, 255, 255, 0.78);
}

.kontakt-prozess__fact {
  border-left: 2px solid var(--color-aqua-500);
  padding-left: var(--space-3);
  font-size: var(--text-12);
  font-weight: 700;
  line-height: 1.5;
}

.kontakt-prozess__step a {
  color: var(--color-lime-500);
  font-weight: 700;
}

[data-reveal] {
  opacity: 0;
  transform: translateY(1rem);
  transition: opacity var(--transition-fast), transform var(--transition-fast);
}

[data-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
}

.kontakt-briefing__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-5);
  margin-top: var(--space-7);
}

.kontakt-briefing__card {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
  margin: 0;
}

.kontakt-briefing__card h3,
.kontakt-briefing__card p {
  margin: 0;
}

.kontakt-briefing__card .button {
  margin-top: auto;
  min-height: var(--touch-target);
  text-align: left;
}

.kontakt-briefing__dot {
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 50%;
  background: var(--color-lime-500);
}

.kontakt-briefing__line {
  width: 3rem;
  height: 1px;
  background: var(--color-aqua-500);
}

.kontakt-briefing__card--casino {
  border-left: 3px solid var(--color-violet-600);
}

.kontakt-briefing__feedback {
  min-height: 1.5rem;
  margin-top: var(--space-4);
  margin-bottom: 0;
  color: var(--color-ink-950);
  font-size: var(--text-14);
  font-weight: 700;
}

.kontakt-editorial__grid {
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: var(--space-7);
}

.kontakt-editorial__copy {
  width: min(100%, 35rem);
}

.kontakt-editorial__copy .lead {
  max-width: 34rem;
}

.kontakt-editorial__facts {
  display: grid;
  min-width: 0;
  gap: var(--space-4);
  border-top: 1px solid var(--color-border);
  padding-top: var(--space-4);
}

.kontakt-editorial__facts p {
  width: min(100%, 22rem);
  margin: 0;
  font-size: var(--text-14);
}

.kontakt-editorial__image-button {
  width: 100%;
  min-width: 0;
  padding: 0;
  border-radius: var(--radius-lg);
  background: transparent;
  overflow: hidden;
}

.kontakt-editorial__image-button img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 10;
  object-position: center;
  transition: transform var(--transition-fast);
}

.kontakt-editorial__image-button:hover img {
  transform: scale(1.02);
}

.kontakt-editorial__figure {
  margin: 0;
}

.kontakt-abschluss {
  padding-top: 0;
}

.kontakt-abschluss__panel {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  min-width: 0;
  align-items: center;
  gap: var(--space-5);
  border-radius: var(--radius-lg);
  background: var(--color-lime-500);
  padding: var(--space-6);
}

.kontakt-abschluss__copy {
  min-width: 0;
  max-width: 33rem;
}

.kontakt-abschluss__copy h2,
.kontakt-abschluss__copy p {
  color: var(--color-ink-950);
}

.kontakt-abschluss__copy p {
  margin-bottom: 0;
}

.kontakt-abschluss__panel > .button {
  justify-self: end;
}

.kontakt-lightbox[hidden] {
  display: none;
}

.kontakt-lightbox {
  position: fixed;
  z-index: 1001;
  inset: 0;
  display: grid;
  place-items: center;
  padding: var(--space-4);
}

.kontakt-lightbox__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(23, 33, 38, 0.82);
}

.kontakt-lightbox__dialog {
  position: relative;
  z-index: 1;
  display: grid;
  width: min(100%, 68rem);
  min-width: 0;
  gap: var(--space-3);
  border-radius: var(--radius-lg);
  background: var(--color-frost-000);
  padding: var(--space-4);
  box-shadow: var(--shadow-card);
}

.kontakt-lightbox__dialog img {
  width: 100%;
  max-height: 75vh;
  border-radius: var(--radius-md);
  object-fit: contain;
}

.kontakt-lightbox__dialog p {
  margin: 0;
  font-size: var(--text-14);
}

.kontakt-lightbox__close {
  position: absolute;
  z-index: 2;
  top: var(--space-3);
  right: var(--space-3);
  display: grid;
  width: var(--touch-target);
  min-width: var(--touch-target);
  height: var(--touch-target);
  place-items: center;
  border-radius: var(--radius-md);
  background: var(--color-ink-950);
  color: var(--color-frost-000);
  font-size: 1.75rem;
  line-height: 1;
}

@media (max-width: 67.5rem) {
  .kontakt-hero__grid,
  .kontakt-editorial__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-6);
  }

  .kontakt-hero__copy,
  .kontakt-editorial__copy {
    max-width: 44rem;
  }

  .kontakt-hero__visual {
    padding-bottom: 0;
  }

  .kontakt-hero__visual > img {
    height: auto;
    aspect-ratio: 16 / 10;
  }

  .kontakt-hero__module {
    position: static;
    width: 100%;
    margin-top: var(--space-4);
  }

  .kontakt-basis__modules {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .kontakt-basis__module:last-child {
    grid-column: span 2;
  }

  .kontakt-form__grid--three {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .kontakt-form__grid--three > .field:last-child {
    grid-column: span 2;
  }

  .kontakt-eventarten__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .kontakt-eventarten__card--business,
  .kontakt-eventarten__card--private,
  .kontakt-eventarten__card--casino,
  .kontakt-eventarten__card--concept,
  .kontakt-eventarten__notice {
    grid-column: span 1;
  }

  .kontakt-eventarten__notice {
    grid-column: span 2;
  }

  .kontakt-prozess__steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .kontakt-editorial__figure {
    width: 100%;
  }
}

@media (max-width: 47.9375rem) {
  .kontakt-hero__grid,
  .kontakt-editorial__grid,
  .kontakt-basis__modules,
  .kontakt-form__grid--two,
  .kontakt-form__grid--three,
  .kontakt-eventarten__grid,
  .kontakt-prozess__steps,
  .kontakt-briefing__grid,
  .kontakt-abschluss__panel {
    grid-template-columns: minmax(0, 1fr);
  }

  .kontakt-hero__copy .lead,
  .kontakt-editorial__copy .lead,
  .kontakt-basis__head,
  .kontakt-eventarten__head,
  .kontakt-briefing__head,
  .kontakt-prozess__head,
  .kontakt-form__head {
    width: 100%;
    max-width: none;
  }

  .kontakt-hero__visual > img {
    border-radius: var(--radius-lg);
  }

  .kontakt-basis__modules {
    gap: var(--space-6);
    margin-top: var(--space-6);
  }

  .kontakt-basis__module:last-child,
  .kontakt-form__grid--three > .field:last-child,
  .kontakt-eventarten__notice {
    grid-column: auto;
  }

  .kontakt-basis__module {
    padding-top: var(--space-6);
    padding-left: var(--space-5);
  }

  .kontakt-basis__module::before {
    top: 0;
    left: 0;
    width: 1px;
    height: 100%;
  }

  .kontakt-basis__number {
    top: 0;
    right: var(--space-2);
    font-size: 4.5rem;
  }

  .kontakt-form-shell {
    padding: var(--space-4);
  }

  .kontakt-form {
    gap: var(--space-5);
  }

  .kontakt-form__grid {
    gap: var(--space-4);
  }

  .kontakt-form__group--submit .button {
    width: 100%;
    min-height: 3rem;
  }

  .kontakt-eventarten__grid,
  .kontakt-briefing__grid {
    margin-top: var(--space-6);
  }

  .kontakt-eventarten__card--business,
  .kontakt-eventarten__card--private,
  .kontakt-eventarten__card--casino,
  .kontakt-eventarten__card--concept,
  .kontakt-eventarten__notice {
    grid-column: auto;
  }

  .kontakt-eventarten__card .button {
    width: 100%;
  }

  .kontakt-prozess__steps {
    gap: var(--space-6);
    margin-top: var(--space-6);
  }

  .kontakt-prozess__step {
    padding-top: 0;
    padding-left: var(--space-5);
    border-top: 0;
  }

  .kontakt-prozess__step::before {
    position: absolute;
    top: 0;
    bottom: calc(var(--space-6) * -1);
    left: 0;
    width: 1px;
    background: var(--color-aqua-500);
    content: "";
  }

  .kontakt-prozess__step:last-child::before {
    bottom: 0;
  }

  .kontakt-prozess__step > span {
    font-size: 3.5rem;
  }

  .kontakt-briefing__card {
    padding: var(--space-4);
  }

  .kontakt-editorial__grid {
    gap: var(--space-5);
  }

  .kontakt-editorial__facts p {
    width: 100%;
  }

  .kontakt-abschluss__panel {
    padding: var(--space-5);
  }

  .kontakt-abschluss__panel > .button {
    width: 100%;
    min-height: 3rem;
    justify-self: stretch;
  }
}

@media (prefers-reduced-motion: reduce) {
  [data-reveal],
  [data-reveal].is-visible,
  .kontakt-editorial__image-button img {
    opacity: 1;
    transform: none;
    transition: none;
  }
}
