/* KRU-552. Страница /opros/ — собственная форма опроса. Подключается из opros/index.php.
   Классы формы отзыва (reviewForm__field, reviewForm__honeypot) описаны в стилях главной страницы
   (layout/templates/.default/css/main.css), а на /opros/ тот файл не подключается — нужные правила повторены ниже. Цвета — переменные .survey (глобальные --dark и др. не трогаем). */
.survey{--dark:#164766;--main:#32739D;--field:#BFE0F4;--soft:#E2F1FB;--err:#B3261E;--focus:#174570;
 padding-bottom:48px;color:#164766;box-sizing:border-box}
.survey *,.survey *::before,.survey *::after{box-sizing:border-box}
.survey [hidden]{display:none!important}
.survey h1{margin:30px 0 12px;text-align:left;text-transform:uppercase;font-size:22px;line-height:28px;font-weight:600;letter-spacing:-.5px}
.survey__intro{margin:0 0 24px;max-width:720px;font-size:17px;line-height:26px}
.survey__form{max-width:760px}
/* строка об анонимности (KRU-552, 11.11.2026) */
.survey__anon{display:flex;gap:10px;align-items:flex-start;max-width:720px;margin:-8px 0 24px;padding:12px 16px;border-radius:10px;background:#E2F1FB;color:#164766;font-size:16px;line-height:24px}
.survey__anon b{font-weight:700}

/* сводка ошибок */
.survey__summary{margin:0 0 24px;padding:16px;border:2px solid var(--err);border-radius:10px;background:#FDECEA}
.survey__summary:focus{outline:3px solid var(--focus);outline-offset:2px}
.survey__summary h2{margin:0 0 8px;font-size:18px;line-height:24px;color:var(--err)}
.survey__summary p{margin:0 0 8px;color:var(--err);font-weight:600}
.survey__summary ul{margin:0;padding:0 0 0 20px}
.survey__summary a{display:inline-block;padding:10px 0;color:var(--err);font-weight:600;text-decoration:underline}

/* вопрос */
.q{min-width:0;margin:0 0 28px;padding:0;border:0}
.q__title{display:flex;gap:10px;align-items:flex-start;width:100%;margin:0 0 6px;padding:0;font-size:18px;line-height:26px;font-weight:600}
.q__num{flex:none;display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:32px;padding:0 6px;border-radius:16px;background:var(--dark);color:#fff;font-size:15px;line-height:1;font-weight:600}
.q__req{color:var(--err)}
.q__hint{margin:0 0 10px 42px;font-size:15px;line-height:22px}
.q__error{margin:8px 0 0;font-size:15px;line-height:22px;font-weight:600;color:var(--err)}
.q__error::before{content:"\26A0\00a0"}

/* вариант: вся строка = label, цель >= 48 px */
.choice{display:flex;align-items:center;gap:14px;min-height:52px;margin:0 0 8px;padding:10px 14px;border:2px solid var(--field);border-radius:12px;background:var(--soft);cursor:pointer;font-size:17px;line-height:24px}
.choice input{flex:none;width:26px;height:26px;margin:0;accent-color:var(--dark);cursor:pointer}
.choice:hover{border-color:var(--main)}
.choice:has(input:checked){border-color:var(--dark);background:var(--field)}
.choice:has(input:focus-visible){outline:3px solid var(--focus);outline-offset:2px}

/* поля внутри опроса */
.survey .reviewForm__field{margin:10px 0 0}
.survey .reviewForm__field > span:first-child{font-size:15px}
.survey .reviewForm__field input,.survey .reviewForm__field textarea{display:block;width:100%;margin:0;padding:12px 14px;border:2px solid transparent;border-radius:10px;background:var(--field);font-family:inherit;font-size:17px;line-height:24px;color:var(--dark)}
.survey .reviewForm__field input{min-height:52px}
.survey .reviewForm__field textarea{min-height:130px;resize:vertical}
.survey .reviewForm__field input:focus,.survey .reviewForm__field textarea:focus{outline:3px solid var(--focus);outline-offset:1px;background:#fff;border-color:var(--main)}
.survey [aria-invalid="true"]{border-color:var(--err)!important;background:#FDECEA!important}
.survey .reviewForm__field--first{margin-top:0}

/* шкала 1-10: на узком экране 2 ряда по 5, от 600 px - один ряд */
.scale{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:0;padding:0;border:0}
.scale label{position:relative;display:flex;align-items:center;justify-content:center;min-height:52px;border:2px solid var(--field);border-radius:12px;background:var(--soft);font-size:20px;font-weight:700;cursor:pointer}
.scale input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.scale label:has(input[aria-invalid="true"]){border-color:var(--err)}
.scale label:hover{border-color:var(--main)}
.scale label:has(input:checked){border-color:var(--dark);background:var(--dark);color:#fff}
.scale label:has(input:focus-visible){outline:3px solid var(--focus);outline-offset:2px}
.scale-ends{display:flex;justify-content:space-between;gap:12px;margin:8px 0 0;font-size:14px;line-height:20px}
.scale-ends span:last-child{text-align:right}
@media (min-width:600px){.scale{grid-template-columns:repeat(10,minmax(0,1fr))}}

/* блок контактов (показывается при «Да» в вопросе 10) */
.contacts{margin:12px 0 0;padding:16px;border-radius:12px;background:#f4f7fa}
.contacts p{margin:0 0 4px;font-size:15px;line-height:22px}
.contacts a,.final a{color:var(--main);text-decoration:underline}
.contacts__note{margin-top:6px!important;font-size:14px!important;line-height:20px!important}
.contacts .choice{margin-top:12px}
.other{margin:0 0 8px 0}

/* финал */
.final{margin:0 0 20px;padding:20px 16px;border-radius:12px;background:var(--soft)}
.final p{margin:0 0 12px}
.final .choice{background:#fff}
.final .choice small{display:block;font-size:14px;line-height:20px}
.final__bye{margin:12px 0 0;font-size:18px;font-weight:600}
/* Вид кнопки задан здесь целиком: базовый .bttnn описан в стилях главной страницы, на /opros/ они не подключены —
   без этого надпись «На главную» стояла мелко в левом верхнем углу (замечание заказчика 12.11.2026) */
.survey .bttnn{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;max-width:360px;min-height:54px;margin:0;padding:12px 24px;border:0;border-radius:27px;font:inherit;font-size:16px;line-height:20px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;text-align:center;text-decoration:none;cursor:pointer}
/* Оранжевый сайта #FF7537 с белым текстом — 2,8:1; здесь темнее (5,2:1), согласовано с Владимиром 10.11.2026 */
.survey .bttnn.bgorange{background:#C2410C;color:#fff}
.survey .bttnn.bgorange:hover,.survey .bttnn.bgorange:focus-visible{background:#9A3412;color:#fff}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* экраны «Спасибо» и «Недоступен» */
.survey__done{max-width:560px;padding:28px 20px;border-radius:12px;background:var(--soft)}
.survey__done h2{margin:0 0 12px;font-size:24px;line-height:30px}
.survey__done p{margin:0 0 16px;font-size:17px;line-height:26px}
.survey__done a:not(.bttnn){color:var(--main);text-decoration:underline;display:inline-block;padding:8px 0}

@media (min-width:768px){
 .survey h1{font-size:28px;line-height:34px}
 .q__title{font-size:20px}
}
@media (min-width:1153px){.survey h1{margin-top:70px;font-size:30px;line-height:36px}}

/* Поле-ловушка для ботов и поля формы: правила из стилей главной, которых на этой странице нет. Без первого правила
   ловушка была видна белой полосой над первым вопросом (замечание Владимира на testvoda, 12.11.2026). */
.reviewForm__honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}
.survey .reviewForm__field{display:block;width:100%;margin:0 0 15px;padding:0}
.survey .reviewForm__field input,.survey .reviewForm__field textarea{box-sizing:border-box;width:100%;margin-bottom:0}