

.contact-form {
  margin-top: 1.75rem;
}

.contact-form form {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
}

.contact-form label {
  flex: 0 0 100%;
  margin-bottom: 0.4rem;
  color: #e9dfc8;
  font-size: 1rem;
}

.contact-form input,
.contact-form textarea {
  flex: 0 0 100%;
  width: 100%;
  margin: 0 0 1rem;
  padding: 0.8rem 0.9rem;
  box-sizing: border-box;
  border: 1px solid rgba(235, 198, 116, 0.45);
  border-radius: 7px;
  outline: none;
  background: rgba(244, 239, 230, 0.06);
  color: #f4efe6;
  font: inherit;
  line-height: 1.45;
}

.contact-form textarea {
  min-height: 10rem;
  resize: vertical;
}

.contact-form input::placeholder,
.contact-form textarea::placeholder {
  color: #aaa18f;
  opacity: 1;
}

.contact-form input:focus,
.contact-form textarea:focus {
  border-color: #e8c878;
  box-shadow: 0 0 0 3px rgba(232, 200, 120, 0.12);
}

.contact-form button {
  display: block;
  width: 100%;
  margin: 0.25rem 0 0;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(235, 198, 116, 0.7);
  border-radius: 7px;
  background: rgba(232, 200, 120, 0.14);
  color: #fff1b8;
  font: inherit;
  text-align: center;
  cursor: pointer;
  transition: background 160ms ease, border-color 160ms ease;
}

.contact-form button:hover,
.contact-form button:focus-visible {
  border-color: #fff1b8;
  background: rgba(232, 200, 120, 0.23);
}

.form-status {
  min-height: 1.7em;
  margin-top: 1rem;
  color: #d9c99c;
  font-size: 1rem;
  text-align: center;
}
