.contact-form{max-width:560px;margin-top:var(--sp-4);margin-bottom:var(--sp-5)}
.contact-form > * + *{margin-top:var(--sp-3)}
.contact-form.is-sent{display:none}
.contact-form .field label{display:block;margin-bottom:6px;font-size:var(--fs-small);font-weight:500;color:var(--c-text)}
.contact-form .field .opt{font-weight:400;color:var(--c-text-dim)}
.contact-form .field input,
.contact-form .field textarea{display:block;width:100%;min-height:48px;padding:0 14px;border:1px solid var(--c-line-strong);border-radius:var(--radius);background:var(--c-bg);color:var(--c-text);font:inherit}
.contact-form .field textarea{min-height:190px;padding:12px 14px;line-height:var(--lh-body);resize:vertical}
.contact-form .field input:focus-visible,
.contact-form .field textarea:focus-visible{outline-offset:1px}
.contact-form .hint{margin:6px 0 0;font-size:var(--fs-small);color:var(--c-text-dim)}
.contact-form > .hint{margin-top:var(--sp-3)}
.contact-form .btn:disabled{opacity:.6;cursor:progress}
.contact-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.legal .contact-msg{display:none;max-width:560px;margin-top:var(--sp-4);margin-bottom:0;padding:var(--sp-3);border:1px solid var(--c-line);background:var(--c-surface);color:var(--c-text)}
.legal .contact-msg.show{display:block}
.legal .contact-msg.ok{border-color:var(--c-gain)}
.legal .contact-msg.error{border-color:var(--c-loss);color:var(--c-loss)}
@media (max-width:640px){
  .contact-form .btn{width:100%}
}