.demo-modal .modal-content {
  border: 0;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 28px 80px rgba(16, 21, 40, .28);
}

.demo-modal .modal-header {
  align-items: flex-start;
  border: 0;
  padding: 24px 26px;
  color: #ffffff;
  background: linear-gradient(135deg, #4A3AFF, #7B61FF 55%, #FF2DB2);
}

.demo-modal .modal-title {
  margin: 0;
  font-size: 1.45rem;
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: 0;
}

.demo-modal .modal-header p {
  margin: 8px 0 0;
  color: rgba(255, 255, 255, .78);
  font-size: .95rem;
}

.demo-modal .close {
  color: #ffffff;
  opacity: .9;
  text-shadow: none;
}

.demo-modal .modal-body {
  padding: 26px;
  background: #ffffff;
}

.demo-form {
  display: grid;
  gap: 14px;
}

.demo-form label {
  display: grid;
  gap: 7px;
  margin: 0;
  color: #101528;
  font-size: .9rem;
  font-weight: 800;
}

.demo-form input,
.demo-form select,
.demo-form textarea {
  width: 100%;
  min-height: 46px;
  padding: 11px 12px;
  border: 1px solid rgba(16, 21, 40, .12);
  border-radius: 8px;
  color: #101528;
  background: #ffffff;
  font: inherit;
}

.demo-form textarea {
  min-height: 118px;
  resize: vertical;
}

.demo-form input:focus,
.demo-form select:focus,
.demo-form textarea:focus {
  outline: 0;
  border-color: #4A3AFF;
  box-shadow: 0 0 0 3px rgba(74, 58, 255, .14);
}

.demo-note {
  margin: 2px 0 0;
  color: #5E6680;
  font-size: .86rem;
}