@layer components{
.contact-form{background:#fff;border-radius:20px;padding:32px;box-shadow:var(--shadow);display:grid;gap:18px}
.contact-form .field{display:grid;gap:8px}
.contact-form label{font-weight:700;font-size:.92rem;color:var(--text)}
.contact-form input{border:2px solid #e4dff2;border-radius:12px;padding:14px 16px;font:inherit;color:var(--text);background:#fcfbff}
.contact-form input:focus{border-color:var(--violet);outline:none}
.contact-form .consent{display:flex;gap:10px;align-items:flex-start;font-size:.85rem;color:var(--text-soft)}
.contact-form .consent input{width:18px;height:18px;margin-top:3px}
.hp-field{position:absolute;left:-9999px;top:-9999px;width:1px;height:1px;overflow:hidden}
.contact-form .form-msg{font-size:.9rem;font-weight:700;display:none;padding:12px 14px;border-radius:10px}
.contact-form .form-msg.is-ok{display:block;background:#e4f9f2;color:#0a7a5f}
.contact-form .form-msg.is-err{display:block;background:#fdeceb;color:#c23b2f}
.contact-form button[type="submit"]{width:100%}
.contact-form button[disabled]{opacity:.6;cursor:not-allowed}
@media(min-width:640px){
  .contact-form{padding:44px}
  .contact-form .two-col{display:grid;grid-template-columns:1fr 1fr;gap:18px}
}
}