/* =========================================================================
   Enquiry form. Same rules as the rest of the site: no boxes, no borders
   around groups. A field is a label, a line, and the space around it.
   ========================================================================= */

.form{max-width:40rem;margin-top:clamp(2rem,4vw,3rem)}

.f-row{margin-bottom:1.9rem}
.f-row label{
  display:block;font-family:var(--data);font-size:.6875rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--faint);
  margin-bottom:.6rem;
}
.req{color:var(--brass);margin-left:.5rem;letter-spacing:.14em}

.form input,.form select,.form textarea{
  width:100%;font-family:var(--text);font-size:1rem;color:var(--ink);
  background:transparent;border:0;border-bottom:1.5px solid var(--hair);
  padding:.55rem 0;border-radius:0;
  transition:border-color .35s var(--ease),background-color .35s var(--ease);
  -webkit-appearance:none;appearance:none;
}
.form textarea{resize:vertical;min-height:7rem;line-height:1.6}
.form select{
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%235E6B64' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right .2rem center;
  background-size:.7rem;padding-right:1.6rem;cursor:pointer;
}
.form input:focus,.form select:focus,.form textarea:focus{
  outline:none;border-bottom-color:var(--ledger);
}
.form input[aria-invalid="true"],.form textarea[aria-invalid="true"],
.form select[aria-invalid="true"]{border-bottom-color:#9B3B2A}

.f-phone{display:grid;grid-template-columns:9.5rem 1fr;gap:1rem}
@media(max-width:30rem){.f-phone{grid-template-columns:1fr}}

.f-hint{
  font-family:var(--data);font-size:.6875rem;color:var(--faint);
  margin:.5rem 0 0;letter-spacing:.06em;
}
.f-err{
  margin:.5rem 0 0;font-size:.8125rem;color:#9B3B2A;min-height:0;
}
.f-err:empty{display:none}
.f-err--form{margin-top:1.5rem;font-size:.9375rem}

/* honeypot — must stay reachable to a bot and invisible to a person */
.f-fax{position:absolute!important;left:-9999px;top:-9999px;
  width:1px;height:1px;overflow:hidden}

.f-actions{margin-top:2.6rem;display:grid;gap:1.2rem}
.btn{
  justify-self:start;font-family:var(--data);font-size:.8125rem;
  letter-spacing:.16em;text-transform:uppercase;font-weight:500;
  color:#F4F6F1;background:var(--ledger);border:0;border-radius:2px;
  padding:1.05rem 2.4rem;cursor:pointer;
  transition:background-color .4s var(--ease),transform .4s var(--ease);
}
.btn:hover{background:var(--ledger-deep);transform:translateY(-1px)}
.btn:active{transform:none}
.btn[disabled]{opacity:.55;cursor:progress}
.f-note{font-size:.8125rem;color:var(--faint);max-width:32rem;margin:0}