.quiz-page { padding: 0 0 72px; color: #24333c; background: linear-gradient(180deg, #f6fafb 0, #fff 360px); }
.quiz-page * { box-sizing: border-box; }
.quiz-breadcrumbs { display: flex; gap: 10px; align-items: center; min-height: 58px; color: #71808b; font-size: 13px; }
.quiz-app { padding: clamp(24px, 4vw, 46px); background: #fff; border: 1px solid #d9e5ea; border-radius: 24px; box-shadow: 0 24px 64px rgba(32, 58, 71, .11); }
.quiz-app__header { display: flex; gap: 28px; align-items: flex-start; justify-content: space-between; }
.quiz-app h1 { max-width: 800px; margin: 0 0 14px; color: #24333c; font-size: clamp(36px, 5vw, 58px); line-height: 1.02; letter-spacing: -.045em; }
.quiz-app h2 { margin: 0 0 22px; color: #24333c; font-size: clamp(28px, 3.4vw, 40px); line-height: 1.08; }
.quiz-kicker { margin: 0 0 10px; color: #4d93b4; font-size: 12px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.quiz-sub, .quiz-subject { max-width: 760px; color: #637680; font-size: 17px; line-height: 1.6; }
.quiz-subject { display: none; color: #2e718f; font-weight: 900; }
.quiz-subject.is-active { display: block; }
.quiz-back-link { flex: 0 0 auto; color: #2e718f; font-weight: 900; }
.quiz-steps { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; margin: 30px 0; }
.quiz-step { padding: 10px 8px; color: #71808b; font-size: 12px; font-weight: 800; text-align: center; background: #eef3f5; border: 1px solid transparent; border-radius: 10px; }
.quiz-step.is-active { color: #fff; background: #4d93b4; }
.quiz-panel { display: none; }
.quiz-panel.is-active { display: block; animation: quizEnter .35s ease both; }
.quiz-cards, .quiz-form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; }
.quiz-card { padding: 22px; text-align: left; cursor: pointer; background: #fff; border: 2px solid #dbe5e9; border-radius: 16px; transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease; }
.quiz-card__icon { font-size: 34px; }
.quiz-card h3 { margin: 10px 0 6px; font-size: 20px; }
.quiz-card p { margin: 0; color: #687984; line-height: 1.45; }
.quiz-card.is-selected { background: #f5fafc; border-color: #4d93b4; box-shadow: 0 12px 28px rgba(77, 147, 180, .15); }
.quiz-field { display: flex; flex-direction: column; gap: 7px; }
.quiz-field__head { display: flex; gap: 10px; align-items: flex-end; justify-content: space-between; }
.quiz-field label { font-weight: 800; }
.quiz-field__hint { color: #2e718f; font-size: 12px; font-weight: 800; white-space: nowrap; }
.quiz-field input { width: 100%; min-height: 50px; padding: 12px 13px; color: #24333c; font: inherit; font-weight: 800; background: #f6fafb; border: 2px solid #aac9d6; border-radius: 10px; }
.quiz-field input:focus { outline: 3px solid rgba(77, 147, 180, .25); outline-offset: 1px; border-color: #4d93b4; }
.quiz-tip { margin: 18px 0; padding: 15px 17px; color: #5d6d76; background: #fff8df; border-left: 4px solid #e8af37; border-radius: 0 9px 9px 0; }
.quiz-actions { display: flex; gap: 12px; justify-content: space-between; margin-top: 25px; }
.quiz-actions button, .quiz-registration button, .quiz-call { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 12px 20px; color: #fff; font: inherit; font-weight: 900; text-decoration: none; cursor: pointer; background: #4d93b4; border: 1px solid #4d93b4; border-radius: 10px; transition: transform .2s ease, background .2s ease, box-shadow .2s ease; }
.quiz-actions button.is-secondary { color: #465862; background: #fff; border-color: #bdcfd7; }
.quiz-actions button:hover, .quiz-actions button:focus-visible, .quiz-registration button:hover, .quiz-registration button:focus-visible, .quiz-call:hover, .quiz-call:focus-visible { color: #fff; text-decoration: none; background: #2e718f; transform: translateY(-2px); box-shadow: 0 12px 26px rgba(46, 113, 143, .2); }
.quiz-ready { padding: 20px; color: #fff; background: linear-gradient(120deg, #2e718f, #4d93b4); border-radius: 15px; }
.quiz-ready h2 { margin-bottom: 6px; color: #fff; }
.quiz-ready p { margin: 0; }
.quiz-report { display: grid; gap: 15px; margin-top: 18px; }
.quiz-report__box { overflow: auto; padding: 18px; border: 1px solid #dbe5e9; border-radius: 14px; }
.quiz-report__box h3 { margin: 0 0 12px; }
.quiz-report table { width: 100%; min-width: 620px; border-collapse: collapse; }
.quiz-report th, .quiz-report td { padding: 9px; text-align: left; border-bottom: 1px solid #e4ebee; }
.quiz-report th { background: #eaf4f7; }
.quiz-report .is-number { text-align: right; }
.quiz-report .is-total { font-weight: 900; }
.quiz-registration { margin-top: 20px; padding: 22px; background: #f3f7f8; border-radius: 15px; }
.quiz-registration h3 { margin-top: 0; }
.quiz-registration button, .quiz-call { margin: 18px 8px 0 0; }
.quiz-consent { display: flex; gap: 10px; align-items: flex-start; margin-top: 18px; color: #5f7079; font-size: 14px; line-height: 1.5; cursor: pointer; }
.quiz-consent input { flex: 0 0 auto; width: 20px; height: 20px; margin-top: 1px; accent-color: #4d93b4; }
#quiz-website { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.quiz-save-status { margin: 12px 0 0; color: #2e718f; font-weight: 800; }
.quiz-disclaimer { margin: 24px 0 0; color: #71808b; font-size: 13px; line-height: 1.55; }
@keyframes quizEnter { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@media (hover: hover) { .quiz-card:hover { transform: translateY(-3px); border-color: #83b3c8; box-shadow: 0 14px 30px rgba(38, 83, 103, .12); } }
@media (max-width: 760px) {
    .quiz-page { padding-bottom: 46px; }
    .quiz-breadcrumbs { min-height: 48px; overflow-x: auto; white-space: nowrap; }
    .quiz-app { padding: 20px 14px; border-right: 0; border-left: 0; border-radius: 0; box-shadow: none; }
    .quiz-app__header { display: block; }
    .quiz-back-link { display: inline-block; margin-top: 8px; }
    .quiz-steps { display: flex; gap: 5px; overflow-x: auto; margin: 20px 0; scrollbar-width: thin; }
    .quiz-step { flex: 0 0 86px; padding: 8px 5px; font-size: 10px; }
    .quiz-cards, .quiz-form-grid { grid-template-columns: 1fr; gap: 11px; }
    .quiz-card { padding: 16px; }
    .quiz-actions { flex-wrap: wrap; }
    .quiz-actions button { flex: 1 1 130px; }
    .quiz-report__box { padding: 10px; }
    .quiz-report table { min-width: 0; table-layout: fixed; font-size: 10px; }
    .quiz-report th, .quiz-report td { padding: 5px 3px; overflow-wrap: anywhere; }
    .quiz-report th:first-child, .quiz-report td:first-child { width: 42%; }
    .quiz-registration { padding: 16px 13px; }
    .quiz-registration button, .quiz-call { width: 100%; margin-right: 0; }
}
@media (prefers-reduced-motion: reduce) { .quiz-panel.is-active { animation: none; } .quiz-card, .quiz-actions button, .quiz-registration button, .quiz-call { transition: none; } }