.cf-ok {
    display: flex; gap: 10px; align-items: flex-start;
    background: var(--green-lt); border: 1px solid var(--green); border-radius: var(--r);
    padding: 14px 16px; margin-bottom: 24px; font-size: 13.5px; color: var(--green-ink); font-weight: 600;
}
.cf-form {
    background: var(--bg2); border: 1px solid var(--bd); border-radius: var(--r);
    padding: 22px; margin: 6px 0 8px;
}
.cf-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.cf-field { margin-bottom: 16px; }
.cf-field label {
    display: block; font-size: 11px; font-weight: 800; text-transform: uppercase;
    letter-spacing: .5px; color: var(--tx); margin-bottom: 6px;
}
.cf-field input, .cf-field select, .cf-field textarea {
    width: 100%; font-family: inherit; font-size: 14px; color: var(--tx);
    background: var(--bg); border: 1px solid var(--bd); border-radius: 8px;
    padding: 10px 12px; transition: border-color .15s;
}
.cf-field input:focus, .cf-field select:focus, .cf-field textarea:focus {
    outline: none; border-color: var(--blue);
}
.cf-field textarea { min-height: 150px; resize: vertical; line-height: 1.6; }
.cf-hint { font-size: 11.5px; color: var(--tx3); margin-top: 5px; }
.cf-err { font-size: 11.5px; color: var(--red-ink); font-weight: 600; margin-top: 5px; }
.cf-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.cf-submit {
    background: var(--blue-fill); color: #fff; border: none; border-radius: 8px;
    font-family: inherit; font-size: 14px; font-weight: 700; padding: 12px 26px; cursor: pointer;
    transition: opacity .15s;
}
.cf-submit:hover { opacity: .88; }
.cf-note { font-size: 11.5px; color: var(--tx3); margin-top: 12px; line-height: 1.6; }
@media (max-width: 640px) { .cf-row { grid-template-columns: 1fr; } }