/* 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}
/* the Leading Cities sign-up: the tick box and its words */
.signup{align-items:start}
.signup .form textarea{min-height:84px}
.form label.consent{display:flex;gap:10px;align-items:flex-start;cursor:pointer}
.form label.consent input{flex:none;width:18px;height:18px;margin:1px 0 0;accent-color:var(--mint)}
.form label.consent b{font-weight:400;font-size:13.5px;line-height:1.45;color:color-mix(in srgb,var(--paper) 78%,transparent)}
.form label.consent a{color:var(--mint)}
/* on a phone the Sign up button should show without scrolling */
@media (max-width:600px){
  .signup{padding-top:8px;padding-bottom:32px;gap:16px}
  .signup h1{font-size:30px;margin-bottom:8px}
  .signup .lede{font-size:15px;line-height:1.4}
  .signup .form{gap:10px;padding:14px}
  .signup .form .two{gap:10px}
  .signup .form label{gap:4px}
  .signup .form input[type=text],.signup .form input[type=email]{padding:9px 12px}
  .signup .form textarea{min-height:44px;padding:9px 12px}
}
