/* Нативные формы заявок вместо CRM-форм Bitrix24 */
.kf { --kf-primary: #1975d2; --kf-primary-text: #fcfcfc; --kf-text: #333;
  --kf-field-bg: rgba(0,0,0,.1); --kf-field-focus: #fff; --kf-field-border: rgba(0,0,0,.1);
  font-family: var(--landing-font-family, inter, -apple-system, "Segoe UI", Roboto, Arial, sans-serif);
  color: var(--kf-text); text-align: left; }
.kf * { box-sizing: border-box; }
.kf-title { font-size: 20px; font-weight: 700; margin: 0 0 8px; }
.kf-desc { font-size: 15px; line-height: 1.5; margin: 0 0 16px; opacity: .85; }
/* Внутренние отступы формы сняты с CRM-формы Bitrix24; в модальном окне
   свои поля задаёт само окно, поэтому там отступы формы обнуляются. */
.kf-form { padding: 32px 31px; }
.kf-modal .kf-form { padding: 0; }
/* Поля с плавающей подписью — повторяют раскладку CRM-форм Bitrix24:
   подпись лежит поверх поля и поднимается, когда поле в фокусе или заполнено. */
.kf-row { position: relative; margin-bottom: 15px; }
.kf-label { position: absolute; left: 0; top: 26px; transform: translateY(-8.5px);
  padding: 0 35px 0 11px; font-size: 15px; line-height: 17px; opacity: .5; pointer-events: none;
  transition: top .15s, font-size .15s, transform .15s; }
.kf-label i { color: #d33; font-style: normal; }
.kf input[type="text"], .kf input[type="tel"], .kf input[type="email"], .kf textarea {
  width: 100%; height: 52px; padding: 17px 35px 0 10px; font-size: 16px; font-family: inherit;
  color: var(--kf-text); background: var(--kf-field-bg); border: 1px solid var(--kf-field-border);
  border-radius: 4px; transition: background .15s, border-color .15s; }
.kf textarea { height: auto; padding-bottom: 10px; }
.kf input:focus, .kf textarea:focus { background: var(--kf-field-focus); border-color: var(--kf-primary);
  outline: none; }
.kf input:focus + .kf-label, .kf textarea:focus + .kf-label,
.kf input:not(:placeholder-shown) + .kf-label, .kf textarea:not(:placeholder-shown) + .kf-label {
  top: 8px; transform: none; font-size: 13px; }
.kf-row.kf-err input, .kf-row.kf-err textarea { border-color: #d33; }
.kf-err-msg { display: none; color: #d33; font-size: 13px; margin-top: 5px; }
.kf-row.kf-err .kf-err-msg { display: block; }
.kf-btn { display: inline-block; width: 100%; padding: 15px 20px; font-size: 15px; font-weight: 700;
  font-family: inherit; color: var(--kf-primary-text); background: var(--kf-primary); border: 0;
  border-radius: 4px; cursor: pointer; transition: filter .15s; }
.kf-btn:hover { filter: brightness(1.08); }
.kf-btn[disabled] { opacity: .6; cursor: progress; }
.kf-agree { font-size: 11px; line-height: 1.5; opacity: .7; margin-top: 12px; }
.kf-agree a { color: inherit; text-decoration: underline; }
.kf-hp { position: absolute !important; left: -9999px !important; }
.kf-done { text-align: center; padding: 24px 12px; }
.kf-done .kf-done-ico { font-size: 48px; line-height: 1; margin-bottom: 10px; }
.kf-done-head { font-size: 20px; font-weight: 700; margin-bottom: 6px; }
.kf-done-text { font-size: 15px; line-height: 1.5; opacity: .8; }

/* модальное окно для форм по клику */
.kf-overlay { position: fixed; inset: 0; z-index: 100001; display: none; background: rgba(0,0,0,.55);
  padding: 16px; overflow-y: auto; }
.kf-overlay.kf-open { display: flex; align-items: flex-start; justify-content: center; }
.kf-overlay .kf-modal { margin: auto; position: relative; width: 100%; max-width: 460px;
  background: #fff; border-radius: 10px; padding: 32px 28px 26px;
  box-shadow: 0 20px 60px rgba(0,0,0,.35); animation: kf-in .22s ease; }
@keyframes kf-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.kf-modal-close { position: absolute; top: 8px; right: 10px; width: 34px; height: 34px; border: 0;
  background: transparent; font-size: 28px; line-height: 1; cursor: pointer; opacity: .5; }
.kf-modal-close:hover { opacity: 1; }