/* Contact page only */

.contact-hero{
  margin-top: 10px;
}

/* left column text */
.contact-text{
  margin-bottom: 12px;
}

/* Make the form box visually strong */
.contact-card{
  padding: 20px;
  background: linear-gradient(
    180deg,
    rgba(255,255,255,.14),
    rgba(255,255,255,.06)
  );
  border: 1px solid rgba(255,255,255,.28);
  box-shadow:
    0 24px 70px rgba(0,0,0,.45),
    inset 0 1px 0 rgba(255,255,255,.10);
  backdrop-filter: blur(14px);
}

/* Inputs stronger contrast */
.contact-card .field input,
.contact-card .field textarea,
.contact-card select{
  border: 1px solid rgba(255,255,255,.35);
  background: rgba(0,0,0,.28);
  box-shadow: inset 0 1px 2px rgba(0,0,0,.45);
}

/* Labels clearer */
.contact-card .field label{
  color: var(--text);
  font-weight: 650;
}

/* Focus state */
.contact-card .field input:focus,
.contact-card .field textarea:focus,
.contact-card select:focus{
  border-color: rgba(124,92,255,.85);
  box-shadow:
    0 0 0 4px rgba(124,92,255,.22),
    inset 0 1px 2px rgba(0,0,0,.35);
}