.contact-dialog {
  width: min(520px, calc(100% - 24px));
  padding: 0;
  border: 0;
  border-radius: 14px;
  color: #222;
  background: #fff;
  box-shadow: 0 24px 70px #10213c4d;
}
.contact-dialog::backdrop { background: #10213c99; }
.contact-form { padding: 34px 38px 24px; }
.contact-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.contact-head h2 { margin: 0; color: #222; font-size: 27px; line-height: 1.35; }
.contact-close { flex: none; width: 34px; height: 34px; padding: 0; border: 0; background: none;
  color: #6d7480; font-size: 28px; line-height: 1; }
.contact-close:hover { color: #222; }
.contact-intro { margin: 10px 0 26px; color: #596171; font-size: 15px; line-height: 1.65; }
.contact-label { display: block; margin: 0 0 9px; color: #303641; font-size: 15px; font-weight: 700; }
.contact-input, .contact-textarea { width: 100%; border: 1px solid #cfd5df; border-radius: 7px;
  background: #fff; color: #222; font: inherit; font-size: 16px; outline: none; }
.contact-input { height: 48px; padding: 0 14px; }
.contact-textarea { min-height: 128px; padding: 13px 14px; resize: vertical; line-height: 1.6; }
.contact-input:focus, .contact-textarea:focus { border-color: #3261cd; box-shadow: 0 0 0 3px #3261cd21; }
.contact-input::placeholder, .contact-textarea::placeholder { color: #9aa1ac; }
.contact-field-error { margin: 6px 0 14px; color: #b42318; font-size: 14px; line-height: 1.45; }
.contact-field-error:empty { display: none; }
.contact-input + .contact-field-error:empty { display: block; margin-bottom: 20px; }
.contact-turnstile { min-height: 4px; margin-top: 14px; }
.contact-submit { width: 100%; height: 52px; margin-top: 18px; border: 0; border-radius: 7px;
  background: #244d8e; color: #fff; font: inherit; font-size: 16px; font-weight: 700; }
.contact-submit:hover:not(:disabled) { background: #1c3f79; }
.contact-submit:disabled { cursor: wait; opacity: .58; }
.contact-status { margin: 0; color: #4a5160; font-size: 14px; line-height: 1.6; text-align: center; }
.contact-status:not(:empty) { margin-top: 10px; }
.contact-status.error { color: #b42318; }
.contact-status.success { color: #236b3d; }
@media (max-width: 560px) {
  .contact-form { padding: 27px 22px 24px; }
  .contact-head h2 { font-size: 24px; }
  .contact-intro { margin-bottom: 22px; }
}