/* Contact page only. Shared site.css stays unchanged while the homepage is frozen. */
.contact-form .user-invalid-note {
  display: none;
  color: var(--bad);
  font-weight: 700;
  margin: 0 0 1rem;
}

.contact-form:has(:user-invalid) .user-invalid-note {
  display: block;
}

.contact-form :is(input, select, textarea):user-invalid {
  border-color: var(--bad);
  outline: 2px solid var(--bad);
  outline-offset: 2px;
}