/* Наш квиз под страницу услуги — раздел «Узнайте стоимость и сроки» (задача 272, 26.09.2026).
   Вид — как у нашего встроенного квиза на «Ролике о компании» и «Съёмке мероприятий» (белая карточка, скругления,
   полоса прогресса, красные выбранные варианты), чтобы клиент видел один квиз на всём сайте.
   Шрифты не меньше 12px; в полях ввода 16px — иначе телефон увеличивает страницу при вводе.
   Свойства кнопок заданы явно: на страницах бывают общие правила для button, они не должны менять вид вариантов. */
.vg-kv{max-width:640px;margin:0 auto;box-sizing:border-box;position:relative;text-align:left;background:#fff;border:1px solid #e8e8e8;border-radius:12px;box-shadow:0 14px 34px rgba(20,24,31,.06);padding:18px 28px 22px}
.vg-kv *,.vg-kv *::before,.vg-kv *::after{box-sizing:border-box}
.vg-kv__bar{display:flex;gap:5px;margin:0 0 20px}
.vg-kv__bar>span{flex:1;height:3px;border-radius:2px;background:#e8e8e8;transition:background .2s}
.vg-kv__bar>span.is-on{background:#e81a2e}
.vg-kv__step{display:none}
.vg-kv__step.is-act{display:block;animation:vgKvIn .22s ease-out}
@keyframes vgKvIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.vg-kv__q{margin:0;font:700 17px/1.35 'Unbounded',sans-serif;color:#1a1a1a;letter-spacing:0;text-transform:none;text-align:center;outline:none}
.vg-kv__hint{margin:6px 0 0;font:400 13px/1.5 'Inter',sans-serif;color:#6f6f6f;text-align:center}
.vg-kv__opts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:16px 0 0}
.vg-kv__opt{display:flex;align-items:center;width:100%;min-width:0;min-height:48px;margin:0;padding:12px 14px;border:2px solid #e8e8e8;border-radius:8px;background:#fff;color:#1a1a1a;box-shadow:none;font:600 14px/1.35 'Inter',sans-serif;letter-spacing:0;text-transform:none;text-align:left;cursor:pointer;transition:border-color .15s,background .15s,color .15s;-webkit-appearance:none;appearance:none}
.vg-kv__opt:hover{border-color:#e81a2e;color:#e81a2e}
.vg-kv__opt:focus-visible{outline:2px solid #e81a2e;outline-offset:2px}
.vg-kv__opt.is-sel{border-color:#e81a2e;background:#fdf0f1;color:#e81a2e}
.vg-kv__row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:16px 0 0}
.vg-kv__in{display:block;width:100%;margin:0;padding:12px 14px;border:2px solid #e8e8e8;border-radius:8px;background:#fff;color:#1a1a1a;font:400 16px/1.4 'Inter',sans-serif;outline:none;box-shadow:none;-webkit-appearance:none;appearance:none}
.vg-kv__in::placeholder{color:#8a8f96}
.vg-kv__in:focus{border-color:#e81a2e}
.vg-kv__consent{display:flex;gap:10px;align-items:flex-start;margin:14px 0 0;font:400 12px/1.5 'Inter',sans-serif;color:#6f6f6f;cursor:pointer;text-align:left}
.vg-kv__consent input{flex:0 0 auto;width:18px;height:18px;margin:1px 0 0;accent-color:#e81a2e}
.vg-kv__consent a{color:#e81a2e}
.vg-kv__hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none}
.vg-kv__btn{display:block;width:100%;margin:16px 0 0;padding:15px 20px;border:0;border-radius:8px;background:#e81a2e;color:#fff;box-shadow:none;font:700 13px/1.2 'Inter',sans-serif;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:background .2s}
.vg-kv__btn:hover{background:#c41628}
.vg-kv__btn:disabled{opacity:.7;cursor:default}
.vg-kv__nav{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:18px 0 0;min-height:42px}
.vg-kv__back{margin:0;padding:9px 0;border:0;border-radius:0;background:none;color:#6f6f6f;box-shadow:none;font:500 13px/1.2 'Inter',sans-serif;letter-spacing:0;text-transform:none;cursor:pointer}
.vg-kv__back:hover{color:#1a1a1a}
.vg-kv__back[hidden],.vg-kv__next[hidden]{display:none}
.vg-kv__next{margin:0 0 0 auto;padding:12px 24px;border:0;border-radius:8px;background:#e81a2e;color:#fff;box-shadow:none;font:700 12px/1.2 'Inter',sans-serif;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:opacity .15s}
.vg-kv__next:disabled{opacity:.4;cursor:default}
.vg-kv__msg{display:none;margin:14px 0 0;font:500 15px/1.55 'Inter',sans-serif;color:#1a1a1a}
.vg-kv__msg.is-shown{display:block}
.vg-kv__msg.is-err{color:#b3261e}
.vg-kv__msg a{color:#e81a2e}
.vg-kv.is-sent .vg-kv__bar,.vg-kv.is-sent .vg-kv__step,.vg-kv.is-sent .vg-kv__nav{display:none}
.vg-kv.is-sent .vg-kv__msg{margin:0;padding:26px 0;text-align:center}
@media (max-width:640px){
  .vg-kv{padding:16px 16px 18px}
  .vg-kv__opts,.vg-kv__row{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.vg-kv__step.is-act{animation:none}}