/* Diamond Fence Corp - rebuilt contact form (static, worker-relay) */
.df-form {
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
}
.df-form .df-row {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}
.df-form .df-field {
  margin-bottom: 18px;
  flex: 1 1 100%;
  min-width: 0;
}
.df-form .df-row .df-field {
  flex: 1 1 calc(50% - 8px);
}
.df-form label {
  display: block;
  font-family: "Poppins", "Roboto", sans-serif;
  font-size: 15px;
  font-weight: 600;
  color: #112337;
  margin-bottom: 6px;
}
.df-form .df-required {
  color: #d4351c;
  margin-left: 2px;
}
.df-form input,
.df-form select,
.df-form textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 12px 14px;
  font-family: "Roboto", "Poppins", sans-serif;
  font-size: 16px;
  color: #112337;
  background: #fff;
  border: 1px solid #c4c9d1;
  border-radius: 4px;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.df-form input:focus,
.df-form select:focus,
.df-form textarea:focus {
  outline: none;
  border-color: #204ce5;
  box-shadow: 0 0 0 3px rgba(32, 76, 229, 0.15);
}
.df-form textarea {
  min-height: 130px;
  resize: vertical;
}
.df-form input.df-invalid,
.df-form textarea.df-invalid,
.df-form select.df-invalid {
  border-color: #d4351c;
  box-shadow: 0 0 0 3px rgba(212, 53, 28, 0.12);
}
.df-form .df-error {
  display: none;
  color: #d4351c;
  font-size: 13px;
  margin-top: 5px;
}
.df-form .df-field.df-has-error .df-error {
  display: block;
}
.df-form .df-submit {
  display: inline-block;
  width: 100%;
  padding: 14px 24px;
  font-family: "Poppins", sans-serif;
  font-size: 17px;
  font-weight: 600;
  color: #fff;
  background: #204ce5;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  transition: background .15s ease;
}
.df-form .df-submit:hover {
  background: #001ab3;
}
.df-form .df-submit:disabled {
  opacity: .65;
  cursor: default;
}
.df-form-message {
  display: none;
  margin-top: 16px;
  padding: 14px 16px;
  border-radius: 4px;
  font-family: "Roboto", sans-serif;
  font-size: 15px;
}
.df-form-message.df-show {
  display: block;
}
.df-form-message.df-success {
  background: #e6f4ea;
  color: #14642a;
  border: 1px solid #b7dfc3;
}
.df-form-message.df-failure {
  background: #fdecea;
  color: #8a1c11;
  border: 1px solid #f3c2bd;
}
@media (max-width: 600px) {
  .df-form .df-row .df-field {
    flex: 1 1 100%;
  }
}
