
#kontakt .kontakt__grid { display: block; }
#kontakt .kontakt__nobr { white-space: nowrap; }

#kontakt .kontakt__body { min-width: 0; container-type: inline-size; }

#kontakt .kontakt__form .field { margin-bottom: 18px; }
#kontakt .kontakt__form .field-row2 { column-gap: 16px; }
#kontakt .kontakt__form textarea { min-height: 168px; }

#kontakt .kontakt__form .note { margin: 4px 0 18px; }

#kontakt .kontakt__send {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px 24px;
  margin-top: 8px;
}
#kontakt .kontakt__send .btn { flex: none; }
#kontakt .kontakt__fine { max-width: 26rem; color: color-mix(in srgb, var(--fg-2) 50%, var(--fg-3)); }
@container (min-width: 600px) {
  #kontakt .kontakt__send { flex-direction: row; align-items: center; }
  #kontakt .kontakt__fine { max-width: 22rem; }
}
#kontakt .kontakt__fine a {
  color: var(--accent-text);
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-thickness: 1px;
}

#kontakt .kontakt__done {
  display: grid;
  justify-items: start;
  gap: 12px;
  padding: clamp(28px, 1rem + 2.5vw, 48px);
  border-radius: var(--r-xl);
  background: var(--surface);
}
#kontakt .kontakt__done .checkic { margin-bottom: 8px; }
#kontakt .kontakt__done .body { max-width: 28rem; }

@media (max-width: 560px) {
  #kontakt .kontakt__send { flex-direction: column; align-items: stretch; }
  #kontakt .kontakt__send .btn { width: 100%; }
  #kontakt .kontakt__fine { max-width: none; text-align: center; }
}
