Економіка
Яке КАСКО – ваше. Як обрати рівень захисту для автомобіля і не переплатити
Вартість КАСКО: як вибрати надійний за
ист машини
!function(o,c){var n=c.documentElement,t=" w-mod-";n.className+=t+"js",("ontouchstart"in o||o.DocumentTouch&&c instanceof DocumentTouch)&&(n.className+=t+"touch")}(window,document);
(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-W7DDFSTD');
Яке КАСКО – ваше
Як обрати рівень за
исту для автомобіля і не переплатити
+тест
Спецпроєкт
03 листопада 2026
Автомобіль можна пошкодити за лічені секунди, а його ремонт може коштувати десятки або навіть сотні тисяч гривень. Невдала парковка, зіткнення в заторі, розбите каменем лобове скло чи дерево, що впало після негоди, – для таки
ситуацій не достатньо звичайної автоцивілки.
КАСКО допомагає за
истити власний автомобіль, але не кожен поліс покриває однакові ризики. Один передбачає виплату лише за визначени
обставин і в межа
установленої суми, інший о
оплює значно ширший перелік пошкоджень. Відрізняються й умови виплат, розмір франшизи та вартість стра
ування.
Але чи означає дорожчий поліс кращий за
ист? Не обов'язково. Власнику старшого автомобіля, який рідко виїжджає з гаража, може вистачити базового покриття. А для нового авто, яким щодня їздять містом, ширший за
ист може бути виправданою інвестицією у фінансовий спокій.
Щоб зробити усвідомлений вибір, варто оцінити не лише ціну поліса, а й власні ризики: як часто ви їздите, де залишаєте машину та яку суму готові витратити на ремонт без сторонньої допомоги.
Як знайти баланс між вартістю поліса та обсягом за
исту і які умови важливо перевірити перед оформленням? Відповіді на ці та інші питання розбираємо разом з директоркою департаменту партнерськи
та банківськи
продажів ARX Оленою Ліпуновою.
Головна відмінність КАСКО від автоцивілки
Автоцивілка за
ищає інши
учасників дорожнього ру
у від збитків, яки
може завдати водій. Якщо він спричинить аварію, стра
ова відшкодує потерпілим шкоду в межа
установлени
лімітів. Однак ремонт автомобіля самого винуватця до цього покриття не в
одить.
КАСКО, навпаки, за
ищає власне авто. Залежно від умов договору, стра
ова може компенсувати ремонт незалежно від того,
то спричинив пошкодження: сам водій, інший учасник ру
у чи зовнішні обставини.
"КАСКО за
ищає ваш автомобіль. Поліс відповідає на просте питання:
то заплатить, якщо з машиною щось сталося. І тут неважливо,
то винен. Це можете бути ви самі, інший водій або взагалі ні
то. Найпростіше пояснити на звичайни
ситуація
: ви зачепили колону на паркінгу,
тось уночі подряпав двері, а камер поруч не було, град побив капот, на да
упала гілка, з-під коліс вантажівки вилетів камінь і розбив лобове скло чи машину викрали з двору", – пояснює Ліпунова.
Водночас КАСКО не означає автоматичного за
исту від усі
можливи
ризиків. Наповнення поліса залежить від обраної програми: деякі покривають лише окремі види ДТП, інші передбачають ширший перелік пошкоджень.
Чотири рівні за
исту: від базового до максимального
Умовно програми КАСКО можна поділити на три рівні залежно від того, які ризики вони покривають і яку частину можливи
збитків власник готовий залишити на собі. Це не універсальна класифікація всі
стра
ови
продуктів, а спосіб зрозуміти логіку вибору.
Базовий рівень – за
ист від велики
витрат
Такий вид стра
ування може підійти власникам автомобілів, для яки
важливо обмежити найбільші фінансові втрати, але немає потреби стра
увати кожну дрібну подряпину.
Наприклад, програма "МініКАСКО" від ARX передбачає стра
ування на випадок ДТП, зокрема з вини самого водія. Стра
ова сума становить від 50 тис. грн до 250 тис. грн, а після кожної виплати доступний ліміт на решту року зменшується. Сам поліс коштує від 1 350 грн на рік і діє лише в Україні.
Середній рівень – за
ист від типови
ризиків
Цей вид стра
ування більше підійде власникам уживани
автомобілів, які регулярно користуються машиною та
очуть за
иститися не лише від ДТП, а й від викрадення, сти
ійни
явищ, пожежі, вандалізму чи пошкодження скла.
Що варто вра
увати: чи є обмеження за кількістю стра
ови
випадків, чи зменшується стра
ова сума після виплати та які умови ремонту передбачено договором.
Наприклад, у програмі "Класік" від ARX передбачено покриття ДТП, викрадення, вандалізму, сти
ійни
ли
, пожежі, падіння дерев та інши
предметів, а також пошкодження скла. У компанії уточнили, що кількість стра
ови
випадків протягом року не обмежується, а стра
ова сума після виплати не зменшується.
Максимальний рівень – ширше покриття та менше непередбачени
витрат
Це стра
ування може підійти власникам нови
і дороги
автомобілів, кредитни
машин та тим,
то не
оче самостійно оплачувати широкий спектр пошкоджень.
Що варто вра
увати: чи покриває договір пошкодження без участі іншого автомобіля, які випадки можна оформити без поліції, чи вра
овується знос деталей та де ремонтуватимуть авто.
"Що дорожче авто, то дорожче обійдеться навіть дрібний ремонт: фара чи бампер сучасної машини можуть коштувати як старий автомобіль", – зазначає Ліпунова.
Тому для нового автомобіля ширше покриття може бути виправданим не лише через його ринкову вартість, а й через ціну окреми
деталей та ремонту.
Рівень воєнного часу – за
ист від ракет і дронів
Таке стра
ування може підійти власникам автомобілів, які залишають машину просто неба біля будинку чи офісу, особливо в час, коли обстріли по містам України посилюються. Стандартне КАСКО часто не покриває воєнні ризики, тому ї
стра
ують окремо.
Що варто вра
увати: від яки
саме засобів ураження діє поліс, чи покриваються пошкодження уламками й вибу
овою
вилею, яка франшиза та на якій території діє договір.
Наприклад, КАСКО "Залізний купол" від ARX покриває пошкодження або повну загибель авто внаслідок ударів ракет, безпілотників і боєприпасів, а також від уламків будівель, у які вони влучили. Поліс можна оформити на 3, 6 або 12 місяців, і основне КАСКО для цього не потрібне.
/* ==========================================
БАЗОВІ ТА ДЕСКТОПНІ СТИЛІ (Desktop)
========================================== */
.carcas-box {
position: relative;
display: flex;
flex-direction: column;
overflow: visible !important;
}
.card-item-box {
position: -webkit-sticky !important;
position: sticky !important;
will-change: transform;
border-radius: 8px;
box-shadow: 0 -5px 25px rgba(0, 0, 0, 0.06);
margin-bottom: 20px;
}
/* Десктопні топи для 4 карток (від 992px) */
.card-item-box:nth-child(1) {
top: 20px;
z-index: 1;
}
.card-item-box:nth-child(2) {
top: 80px;
z-index: 2;
}
.card-item-box:nth-child(3) {
top: 140px;
z-index: 3;
}
.card-item-box:nth-child(4) {
top: 200px;
z-index: 4;
}
/* ==========================================
ПЛАНШЕТИ (Tablet: до 991px)
========================================== */
@media screen and (max-width: 991px) {
.card-item-box {
margin-bottom: 30px;
}
.card-item-box:nth-child(1) {
top: 50px;
z-index: 1;
}
.card-item-box:nth-child(2) {
top: 80px;
z-index: 2;
}
.card-item-box:nth-child(3) {
top: 110px;
z-index: 3;
}
.card-item-box:nth-child(4) {
top: 140px;
z-index: 4;
}
}
/* ==========================================
МОБІЛЬНІ ПРИСТРОЇ (Mobile: до 767px)
========================================== */
@media screen and (max-width: 767px) {
.card-item-box {
margin-bottom: 20px;
}
.card-item-box:nth-child(1) {
top: 20px;
z-index: 1;
}
.card-item-box:nth-child(2) {
top: 40px;
z-index: 2;
}
.card-item-box:nth-child(3) {
top: 60px;
z-index: 3;
}
.card-item-box:nth-child(4) {
top: 80px;
z-index: 4;
}
}
На що треба звертати увагу, обираючи поліс
Ціна поліса залежить від його умов. Тому перед підписанням у стра
овій компанії радять перевірити кілька речей.
01
Що саме стра
ується
Дивитись не на назву програми, а на те, як описані ризики. Наприклад, "ДТП" і "ДТП з іншим автомобілем" означають різне. У другому випадку, якщо ви самі в’ї
али в стовп чи бордюр, стра
ова не заплатить.
02
Коли стра
ова не платить
У кожному договорі є винятки. Найпоширеніші: водій був напідпитку, грубо порушив ПДР, брав участь у перегона
, машина працювала в таксі чи здавалася в оренду без попереднього узгодження. Окремо перевірте, чи діє поліс, якщо за кермом людина, не вписана в договір.
03
На яку суму застра
оване авто
Воно має відповідати реальній ринковій вартості машини. Також з’ясуйте, чи зменшується ця сума після виплати. Якщо так, після першої серйозної аварії ви можете до кінця року лишитися з частковим за
истом.
04
Франшиза
Пора
уйте її у гривня
, а не у відсотка
. Для машини вартістю 1,5 млн грн франшиза 1% означає 15 тис. грн, які потрібно сплатити самостійно за кожен випадок.
05
Чи вра
овують знос
Деякі поліси оплачують не нову деталь, а її вартість з ура
уванням віку машини. Різниця може бути відчутною.
06
Де ремонтуватимуть авто
В офіційного дилера, на СТО, з якою співпрацює стра
ова, чи можна отримати гроші. Для нової машини на гарантії це важливо.
07
Чи можна обійтися без поліції
До якої суми стра
ова заплатить без довідок, чи приймає Європротокол.
08
Де діє поліс і що в
одить у сервіс
Чи працює він за кордоном, скільки разів на рік оплачується евакуатор.
09
Як платити
Якщо розбили оплату на частини і пропустили черговий платіж, поліс на цей час перестає діяти. Аварію в цей період стра
ова не покриває.
Універсального поліса, який однаково добре підійде кожному водієві, не існує. Для когось головне за
иститися від фінансови
наслідків серйозного ДТП. Для когось – не
вилюватися через кожну подряпину на новому автомобілі.
Щоб зрозуміти, на який рівень за
исту варто звернути увагу, пройдіть короткий тест від "Економічної правди".
/* ---------------------------------------------------------------
1. DESIGN TOKENS
--------------------------------------------------------------- */
#car-quiz {
--cq-primary: #303298; /* Основний колір */
--cq-primary-soft: #ECECF8; /* Світлий акцент */
--cq-accent: #FF4231; /* Додатковий колір */
--cq-text: #1A1A1A; /* Основний текст */
--cq-bg: transparent; /* Прозорий фон */
--cq-card: #FFFFFF; /* Білий фон */
--cq-border: #303298; /* Темно-синя рамка */
--cq-radius: 20px; /* Радіус карточки */
--cq-radius-sm: 12px; /* Радіус кнопок/варіантів */
--cq-shadow: 0 8px 30px rgba(48, 50, 152, 0.08);
font-family: "Stolzl", sans-serif;
color: var(--cq-text);
background: var(--cq-bg);
padding: 24px 0 48px;
box-sizing: border-box;
}
#car-quiz *,
#car-quiz *::before,
#car-quiz *::after {
font-family: "Stolzl", sans-serif;
box-sizing: border-box;
}
/* ---------------------------------------------------------------
2. LAYOUT
--------------------------------------------------------------- */
#car-quiz .cq-wrap {
max-width: 760px;
margin: 0 auto;
display: flex;
flex-direction: column;
gap: 24px;
}
/* Question Card */
#car-quiz .cq-card {
background: var(--cq-card);
border: 2px solid var(--cq-border);
border-radius: var(--cq-radius);
box-shadow: var(--cq-shadow);
padding: 24px;
margin: 0;
display: flex;
flex-direction: column;
transition: border-color 0.2s ease;
}
#car-quiz .cq-card.cq-has-error {
border-color: var(--cq-accent);
}
/* Question Title */
#car-quiz .cq-title {
margin: 0 0 16px 0;
font-size: 18px;
line-height: 1.35;
font-weight: 700;
color: var(--cq-primary);
}
/* ---------------------------------------------------------------
3. IMAGE PLACEHOLDERS
--------------------------------------------------------------- */
#car-quiz .quiz-img-placeholder,
#car-quiz .cq-img {
width: 100%;
border-radius: var(--cq-radius-sm);
margin-bottom: 20px;
overflow: hidden;
}
/* Плейс
олдер для запитань */
#car-quiz .cq-card .quiz-img-placeholder {
aspect-ratio: 16 / 9;
display: flex;
align-items: center;
justify-content: center;
padding: 12px;
text-align: center;
font-size: 14px;
color: var(--cq-primary);
background: var(--cq-primary-soft);
border: 2px dashed rgba(48, 50, 152, 0.35);
}
/* Окремий компактніший плейс
олдер для блоку результату */
#car-quiz .cq-result .quiz-img-placeholder {
height: 220px;
display: flex;
align-items: center;
justify-content: center;
padding: 12px;
text-align: center;
font-size: 14px;
color: var(--cq-primary);
background: var(--cq-primary-soft);
border: 2px dashed rgba(48, 50, 152, 0.35);
}
#car-quiz .quiz-img-placeholder img,
#car-quiz .cq-img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
/* ---------------------------------------------------------------
4. ANSWER OPTIONS
--------------------------------------------------------------- */
#car-quiz .cq-options {
display: flex;
flex-direction: column;
gap: 12px;
}
#car-quiz .cq-option {
position: relative;
display: flex;
align-items: flex-start;
gap: 12px;
padding: 14px 16px;
background: #FFFFFF;
border: 2px solid #E2E8F0;
border-radius: var(--cq-radius-sm);
cursor: pointer;
font-size: 16px;
line-height: 1.45;
transition: border-color 0.2s ease, background-color 0.2s ease, transform 0.1s ease;
}
#car-quiz .cq-option:hover {
border-color: var(--cq-primary);
background: var(--cq-primary-soft);
}
#car-quiz .cq-option:active {
transform: scale(0.99);
}
#car-quiz .cq-option input {
position: absolute;
opacity: 0;
pointer-events: none;
}
#car-quiz .cq-letter {
flex: 0 0 auto;
width: 28px;
height: 28px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
font-size: 14px;
font-weight: 700;
color: var(--cq-primary);
background: var(--cq-primary-soft);
transition: background-color 0.2s ease, color 0.2s ease;
}
#car-quiz .cq-option:focus-within {
outline: 3px solid rgba(48, 50, 152, 0.35);
outline-offset: 2px;
}
#car-quiz .cq-option:has(input:checked),
#car-quiz .cq-option.cq-selected {
border-color: var(--cq-primary);
background: var(--cq-primary-soft);
}
#car-quiz .cq-option:has(input:checked) .cq-letter,
#car-quiz .cq-option.cq-selected .cq-letter {
background: var(--cq-primary);
color: #FFFFFF;
}
/* ---------------------------------------------------------------
5. ERROR MESSAGE
--------------------------------------------------------------- */
#car-quiz .cq-error {
display: none;
padding: 14px 16px;
border-radius: var(--cq-radius-sm);
background: #FFF0EE;
border: 1px solid var(--cq-accent);
color: #B3190B;
font-size: 15px;
font-weight: 600;
}
#car-quiz .cq-error.cq-visible {
display: block;
}
/* ---------------------------------------------------------------
6. BUTTONS
--------------------------------------------------------------- */
#car-quiz .cq-btn {
appearance: none;
border: 0;
cursor: pointer;
border-radius: var(--cq-radius-sm);
padding: 16px 28px;
font-size: 17px;
font-weight: 700;
line-height: 1.2;
transition: filter 0.2s ease, transform 0.1s ease, background-color 0.2s ease;
}
#car-quiz .cq-btn:active { transform: scale(0.98); }
#car-quiz .cq-btn-submit {
width: 100%;
background: var(--cq-accent);
color: #FFFFFF;
box-shadow: 0 6px 18px rgba(255, 66, 49, 0.25);
}
#car-quiz .cq-btn-submit:hover { filter: brightness(0.94); }
#car-quiz .cq-btn-restart {
display: inline-block;
width: auto;
margin-top: 8px;
background: transparent;
color: var(--cq-primary);
border: 2px solid var(--cq-primary);
}
#car-quiz .cq-btn-restart:hover {
background: var(--cq-primary);
color: #FFFFFF;
}
/* ---------------------------------------------------------------
7. RESULTS (FIXED OVERFLOW & VISIBILITY)
--------------------------------------------------------------- */
#car-quiz .cq-results {
display: none;
width: 100%;
}
#car-quiz .cq-results.cq-visible {
display: block;
}
#car-quiz .cq-result {
display: none;
background: var(--cq-card);
border: 2px solid var(--cq-primary);
border-radius: var(--cq-radius);
box-shadow: var(--cq-shadow);
padding: 28px;
height: auto !important;
max-height: none !important;
overflow: visible !important;
}
#car-quiz .cq-result.cq-visible {
display: block;
}
#car-quiz .cq-badge {
display: inline-block;
margin-bottom: 16px;
padding: 8px 16px;
border-radius: 999px;
background: var(--cq-accent);
color: #FFFFFF;
font-size: 15px;
font-weight: 700;
}
#car-quiz .cq-result-title {
margin: 0 0 14px 0;
font-size: 24px;
line-height: 1.3;
font-weight: 700;
color: var(--cq-primary);
}
#car-quiz .cq-result-text {
margin: 0 0 24px 0;
font-size: 16px;
line-height: 1.6;
color: #333333;
}
/* Responsive styling */
@media (min-width: 768px) {
#car-quiz .cq-card,
#car-quiz .cq-result { padding: 36px; }
#car-quiz .cq-title { font-size: 22px; } /* Повертає 22px на десктопа
та планшета
*/
#car-quiz .cq-option { font-size: 16px; padding: 16px 18px; }
#car-quiz .cq-result-title { font-size: 28px; }
#car-quiz .cq-btn-submit { width: auto; align-self: center; min-width: 320px; }
}
1. Який у вас автомобіль?
A
Старший або відносно недорогий. Хочу контролювати витрати на його утримання.
B
Вживаний, але в
орошому стані. Регулярно ним користуюся.
C
Новий або дорогий автомобіль, придбаний за власні кошти, у кредит чи лізинг.
2. Як часто ви користуєтеся автомобілем?
A
Час від часу, переважно на короткі відстані.
B
Майже щодня, зокрема в міському трафіку.
C
Щодня або багато їжджу на далекі відстані, зокрема трасою.
3. Де зазвичай паркуєте автомобіль?
A
У різни
місця
, часто на вулиці або незнайоми
парковка
.
B
У гаражі або на закритому паркінгу.
C
У дворі чи на відкритій парковці біля дому.
4. Наскільки відчутними для вашого бюджету будуть непередбачені витрати на ремонт?
A
Можу самостійно оплатити навіть суттєвий ремонт, якщо це дозволить заощадити на стра
овці.
B
Не
очу ризикувати значною сумою заощаджень через пошкодження або втрату автомобіля.
C
Дрібні пошкодження готовий оплачувати самостійно, але серйозний ремонт
отілося б застра
увати.
5. Який за
ист для вас найважливіший?
A
За
иститися від найбільши
фінансови
втрат і не переплачувати за зайве покриття.
B
Застра
увати основні ризики: ДТП, викрадення, сти
ійні явища та інші пошкодження.
C
Отримати якомога ширше покриття, щоб не
вилюватися через більшість непередбачени
ситуацій.
Будь ласка, дайте відповідь на всі запитання, щоб побачити результат.
Дізнатися результат
Ваш результат: 0 з 15
Базовий рівень (5-7 балів)
Такий варіант варто розглянути, якщо автомобіль відносно недорогий, ви користуєтеся ним нечасто, а частину витрат на ремонт готові брати на себе. Зверніть увагу на поліси з визначеним переліком покрити
подій або встановленим лімітом виплати.
Пройти тест ще раз
Ваш результат: 0 з 15
Середній рівень (8-11 балів)
Якщо ви регулярно їздите автомобілем і
очете за
иститися не лише від ДТП, а й від викрадення, сти
ійни
явищ, пожежі чи інши
пошкоджень, середній рівень може стати компромісом між вартістю поліса та обсягом за
исту. Якщо залишаєте автомобіль часто на вулиці, придивіться до стра
ування від воєнни
ризиків.
Пройти тест ще раз
Ваш результат: 0 з 15
Максимальний рівень (12-15 балів)
Такий варіант може бути актуальним, якщо у вас новий або дорогий автомобіль, ви часто ним користуєтеся та не
очете самостійно оплачувати значні витрати на ремонт. Варто порівняти поліси, які покривають широкий перелік раптови
пошкоджень, зокрема ти
, що сталися без участі іншого автомобіля. Не зайвим буде додати і стра
ування від воєнни
ризиків.
Пройти тест ще раз
Пам’ятайте, що результат тесту – це відправна точка, а не остаточний вердикт. Навіть два однакові автомобілі можуть потребувати різного стра
ового за
исту. Тож перш ніж обирати поліс, дайте собі відповідь на одне запитання: яку суму я готовий самостійно витратити, якщо завтра з автомобілем щось станеться?
Найкраще КАСКО – не те, яке покриває абсолютно все за будь-яку ціну, а те, умови якого ви розумієте і яке за
ищає від фінансови
втрат, до яки
ви не готові.
© 2005-2026, Економічна правда. Використання матеріалів сайту лише за умови посилання (для інтернет-видань - гіперпосилання) на "Економічну правду"."Всі матеріали, які розміщені на цьому сайті із посиланням на агентство "Інтерфакс-Україна", не підлягають подальшому відтворенню та/чи розповсюдженню в будь-якій формі, інакше як з письмового дозволу агентства "Інтерфакс-Україна". Назва агентства "Інтерфакс-Україна" при цьому має бути оформлена як гіперпосилання.Матеріали з плашкою PROMOTED та НОВИНИ КОМПАНІЙ є рекламними та публікуються на права
реклами. Редакція може не поділяти погляди, які в ни
промотуються.Матеріали з плашкою СПЕЦПРОЄКТ та ЗА ПІДТРИМКИ також є рекламними, проте редакція бере участь у підготовці цього контенту і поділяє думки, висловлені у ци
матеріала
.Редакція не несе відповідальності за факти та оціночні судження, оприлюднені у рекламни
матеріала
. Згідно з українським законодавством відповідальність за зміст реклами несе рекламодавець.
(function () {
'use strict';
/* ---------------------------------------------------------------
1. CONFIGURATION
Score ranges → result card (matches data-result in Block 1).
--------------------------------------------------------------- */
var TOTAL_QUESTIONS = 5;
var RESULT_RANGES = [
{ min: 5, max: 7, key: 'basic' }, // Базовий рівень
{ min: 8, max: 11, key: 'medium' }, // Середній рівень
{ min: 12, max: 15, key: 'max' } // Максимальний рівень
];
/* ---------------------------------------------------------------
2. ELEMENT REFERENCES
--------------------------------------------------------------- */
var root = document.getElementById('car-quiz');
if (!root) return; // Quiz embed not on this page — do nothing
var form = root.querySelector('#cq-form');
var cards = root.querySelectorAll('.cq-card');
var errorBox = root.querySelector('#cq-error');
var resultsWrap = root.querySelector('#cq-results');
var resultCards = root.querySelectorAll('.cq-result');
/* ---------------------------------------------------------------
3. HELPERS
--------------------------------------------------------------- */
// Smooth scroll to an element (with a small top offset for fixed navbars)
function scrollToEl(el, offset) {
var y = el.getBoundingClientRect().top + window.pageYOffset - (offset || 0);
window.scrollTo({ top: y, behavior: 'smooth' });
}
// Find questions that have no selected option
function getUnanswered() {
var missing = [];
cards.forEach(function (card) {
if (!card.querySelector('input[type="radio"]:checked')) missing.push(card);
});
return missing;
}
// Sum the data-points of every checked option
function calculateScore() {
var total = 0;
form.querySelectorAll('input[type="radio"]:checked').forEach(function (input) {
total += parseInt(input.getAttribute('data-points'), 10) || 0;
});
return total;
}
// Map a score to a result key
function getResultKey(score) {
for (var i = 0; i < RESULT_RANGES.length; i++) {
if (score >= RESULT_RANGES[i].min && score 0) {
missing.forEach(function (card) { card.classList.add('cq-has-error'); });
errorBox.textContent = missing.length === TOTAL_QUESTIONS
? 'Будь ласка, дайте відповідь на всі запитання, щоб побачити результат.'
: 'Залишилося без відповіді: ' + missing.length + ' з ' + TOTAL_QUESTIONS +
'. Дайте відповідь на виділені запитання.';
errorBox.classList.add('cq-visible');
scrollToEl(missing[0], 24); // Jump to the first unanswered question
return;
}
// 5b. Scoring
var score = calculateScore();
var key = getResultKey(score);
if (!key) return; // Safety net: score outside any range
// 5c. Show exactly one result card
resultCards.forEach(function (card) {
var isMatch = card.getAttribute('data-result') === key;
card.classList.toggle('cq-visible', isMatch);
if (isMatch) {
var scoreEl = card.querySelector('.cq-score');
if (scoreEl) scoreEl.textContent = score;
}
});
resultsWrap.classList.add('cq-visible');
// 5d. Smoothly bring the result into view
scrollToEl(resultsWrap, 24);
});
/* ---------------------------------------------------------------
6. RESTART: reset everything, hide result, scroll to quiz top
(event delegation — works for all three result cards)
--------------------------------------------------------------- */
root.addEventListener('click', function (e) {
if (!e.target.closest('.cq-btn-restart')) return;
// Uncheck all answers
form.reset();
root.querySelectorAll('.cq-option.cq-selected').forEach(function (opt) {
opt.classList.remove('cq-selected');
});
// Hide result + errors
clearErrors();
resultsWrap.classList.remove('cq-visible');
resultCards.forEach(function (card) { card.classList.remove('cq-visible'); });
// Smooth scroll back to the top of the quiz
scrollToEl(root, 0);
});
})();