/* Форма «Написать нам» (kontakty.html, en/contact.html). Раскладка и карточка — от страницы поддержки (support.css). */
.cf-form { display: grid; gap: 18px; }
.cf-f { display: grid; gap: 8px; }
.cf-f > span { font-weight: 700; font-size: 15px; color: var(--ink-2); }
.cf-f i { font-style: normal; color: var(--sg); }
.cf-f input, .cf-f select, .cf-f textarea {
  width: 100%; font: inherit; font-size: 16px; color: var(--ink); background: var(--cream);
  border: 1.5px solid var(--sg-soft2); border-radius: 14px; padding: 13px 16px;
  transition: border-color .2s, box-shadow .2s, background-color .2s;
}
.cf-f select { appearance: none; -webkit-appearance: none; padding-right: 44px; cursor: pointer;
  background: var(--cream) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C8202A' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") right 16px center/16px no-repeat; }
.cf-f textarea { resize: vertical; min-height: 150px; line-height: 1.5; }
.cf-f input::placeholder, .cf-f textarea::placeholder { color: #9A8A80; }
.cf-f input:hover, .cf-f select:hover, .cf-f textarea:hover { border-color: var(--sg-hi); }
.cf-f input:focus, .cf-f select:focus, .cf-f textarea:focus { outline: none; border-color: var(--sg); box-shadow: 0 0 0 3px var(--sg-soft); background-color: var(--white); }
.cf-hp { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.cf-check { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 12px; align-items: start; font-size: 14.5px; line-height: 1.5; color: var(--ink-2); cursor: pointer; }
.cf-check input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--sg); cursor: pointer; }
.cf-check a { color: var(--sg-deep); text-underline-offset: 3px; }
.cf-submit { justify-self: start; display: inline-flex; align-items: center; gap: 10px; }
.cf-submit svg { width: 20px; height: 20px; }
.cf-submit[disabled] { opacity: .6; cursor: progress; }
.cf-status { margin: 0; font-size: 15px; color: var(--ink-2); }
.cf-status:empty { display: none; }
.cf-status.bad { color: var(--sg-deep); font-weight: 600; }
.cf-done { display: grid; gap: 12px; justify-items: start; }
.cf-done h2 { font-size: clamp(24px, 2.4vw, 32px); }
.cf-done p { margin: 0 0 6px; color: var(--ink-2); font-size: 17px; }
.cf-done .sp-heart { margin-bottom: 6px; }
.cf-page .sp-intro a { color: var(--sg-deep); font-weight: 600; text-underline-offset: 3px; }