/* the contact form on the server: errors, the hidden field robots fill in, the sent state */
.form .err{display:block;font-style:normal;font-size:13px;color:var(--terra);margin-top:2px}
.form p.err{margin:0;padding:10px 12px;border:1px solid var(--terra);border-radius:10px}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.sent-card{align-content:start}
.sent-card .hh{font-size:clamp(24px,3vw,36px);margin:0}
/* the contact page: the promise and what happens next, beside the form */
.promise{margin:22px 0 0;max-width:48ch;font-size:15px;line-height:1.5;color:color-mix(in srgb,var(--paper) 78%,transparent)}
.promise b{display:block;font-family:var(--mono);font-weight:400;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);margin-bottom:6px}
.next-k{margin:26px 0 0}
.qlist.next{margin-top:10px;max-width:52ch}
.qlist.next b{display:block;font-weight:500;font-size:15px;margin-bottom:4px}
.qlist.next span{display:block;font-size:14px;line-height:1.5;color:color-mix(in srgb,var(--paper) 74%,transparent)}
.ph:has(.promise){align-items:start}