/* The successful submission owns its height; contact and question screens keep their layout. */
.quiz .quiz__form-last.is-submitted { height: auto; min-height: 0; }
.quiz .quiz__form-thank { position: relative; inset: auto; transform: none; background: #fff; border-radius: 20px; overflow: hidden; container-type: inline-size; container-name: on-quiz-success; }
.quiz .quiz__thank { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); height: auto; align-items: stretch; font-family: "DIN Pro", sans-serif; text-align: left; }
.quiz .quiz__thank * { box-sizing: border-box; }
.quiz .quiz__thank :where(p, h2, h3) { margin: 0; }
.quiz .quiz__thank-hero { position: relative; isolation: isolate; overflow: hidden; padding: 44px 42px; background: #092f57; color: #fff; }
.quiz .quiz__thank-hero::before, .quiz .quiz__thank-hero::after { content: ""; position: absolute; z-index: -1; width: 164px; height: 164px; border-radius: 50%; pointer-events: none; }
.quiz .quiz__thank-hero::before { top: -20px; right: -12px; background: #0b416f; }
.quiz .quiz__thank-hero::after { top: 4px; right: 12px; width: 116px; height: 116px; border: 1px solid #276190; }
.quiz .quiz__thank-mark { display: grid; place-items: center; width: 70px; height: 70px; margin-bottom: 28px; border-radius: 50%; background: #ffdc68; color: #092f57; }
.quiz .quiz__thank-mark svg { width: 44px; height: 44px; }
.quiz .quiz__thank-eyebrow { color: #b7d7f5; font-size: 13px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; }
.quiz .quiz__thank-title { font-family: "DIN Pro", sans-serif; font-size: clamp(32px, 3.8vw, 50px); line-height: 1.12; font-weight: 700; color: #fff; margin: 22px 0 24px !important; overflow-wrap: anywhere; }
.quiz .quiz__thank-title span { color: #ffdc68; }
.quiz .quiz__thank-title:focus { outline: none; }
.quiz .quiz__thank-choice { font-size: 21px; line-height: 1.3; font-weight: 700; color: #fff; }
.quiz .quiz__thank-subtitle { margin-top: 12px; font-size: 17px; line-height: 1.55; color: #cee0f1; overflow-wrap: anywhere; }
.quiz .quiz__thank-subtitle p + p { margin-top: 12px; }
.quiz .quiz__thank-subtitle a { color: #ffdc68; text-decoration: underline; }
.quiz .quiz__thank-subtitle a:focus-visible { outline: 3px solid #ffdc68; outline-offset: 3px; }
.quiz .quiz__thank-brand { display: flex; gap: 14px; align-items: center; margin-top: 32px; padding: 20px; border: 1px solid #365a7c; border-radius: 12px; background: #143e65; }
.quiz .quiz__thank-brand > svg { flex: 0 0 36px; width: 36px; height: 36px; color: #ffdc68; }
.quiz .quiz__thank-brand p { color: #cee0f1; font-size: 17px; line-height: 1.4; }
.quiz .quiz__thank-brand strong { color: #ffdc68; font-weight: 700; }
.quiz .quiz__thank-next { padding: 48px 34px 36px; color: #123355; background: #fff; }
.quiz .quiz__thank-next h3 { font-family: "DIN Pro", sans-serif; font-size: 27px; font-weight: 700; line-height: 1.2; color: #123355; }
.quiz .quiz__thank-intro { margin-top: 14px; color: #5f6f82; font-size: 16px; line-height: 1.5; }
.quiz .quiz__thank-steps { list-style: none; margin: 32px 0; padding: 0; counter-reset: thank-step; }
.quiz .quiz__thank-steps li { position: relative; margin: 0; padding: 0 0 24px 47px; counter-increment: thank-step; }
.quiz .quiz__thank-steps li:last-child { padding-bottom: 0; }
.quiz .quiz__thank-steps li::before { content: counter(thank-step); position: absolute; left: 0; top: -3px; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: #e9f2fd; color: #0b5caf; font-size: 16px; font-weight: 700; z-index: 1; }
.quiz .quiz__thank-steps li:not(:last-child)::after { content: ""; position: absolute; top: 27px; bottom: 0; left: 15px; width: 2px; background: #dce5ee; }
.quiz .quiz__thank-steps strong { display: block; font-size: 20px; line-height: 1.3; color: #123355; font-weight: 700; }
.quiz .quiz__thank-steps p { margin-top: 8px; font-size: 16px; line-height: 1.45; color: #5f6f82; }
.quiz .quiz__thank-home { display: flex; gap: 12px; align-items: center; justify-content: center; min-height: 48px; padding: 12px 16px; border: 2px solid transparent; border-radius: 9px; background: #0b5caf; color: #fff; font-size: 17px; font-weight: 700; line-height: 1.35; text-decoration: none; transition: background .15s ease; }
.quiz .quiz__thank-home:hover { background: #084785; color: #fff; text-decoration: none; }
.quiz .quiz__thank-home:focus-visible { outline: 3px solid #0b5caf; outline-offset: 4px; }
.quiz .quiz__thank-contact { margin-top: 25px; color: #5f6f82; font-size: 14px; line-height: 1.5; }
.quiz .quiz__thank-contact a { display: block; width: fit-content; padding: 7px 0; color: #0b5caf; font-size: 23px; font-weight: 700; text-decoration: none; }
.quiz .quiz__thank-contact a:focus-visible { outline: 3px solid #0b5caf; outline-offset: 3px; }
@media (max-width: 800px) {
  .quiz .quiz__thank { grid-template-columns: minmax(0, 1fr); }
  .quiz .quiz__thank-hero { padding: 28px; }
  .quiz .quiz__thank-mark { width: 48px; height: 48px; margin-bottom: 20px; }
  .quiz .quiz__thank-mark svg { width: 32px; height: 32px; }
  .quiz .quiz__thank-title { margin-top: 18px !important; font-size: 36px; }
  .quiz .quiz__thank-choice { font-size: 20px; }
  .quiz .quiz__thank-brand { margin-top: 24px; padding: 16px; }
  .quiz .quiz__thank-brand p { font-size: 16px; }
  .quiz .quiz__thank-next { padding: 28px; }
  .quiz .quiz__thank-intro { display: none; }
  .quiz .quiz__thank-steps { margin: 28px 0; }
  .quiz .quiz__thank-steps li { padding-left: 43px; padding-bottom: 23px; }
  .quiz .quiz__thank-steps strong { font-size: 19px; }
  .quiz .quiz__thank-steps p { margin-top: 6px; font-size: 15px; }
}
@media (max-width: 359px) {
  .quiz .quiz__thank-hero, .quiz .quiz__thank-next { padding: 24px 20px; }
  .quiz .quiz__thank-title { font-size: 32px; }
}
@container on-quiz-success (max-width: 740px) {
  .quiz .quiz__thank { grid-template-columns: minmax(0, 1fr); }
  .quiz .quiz__thank-hero, .quiz .quiz__thank-next { padding: 28px; }
  .quiz .quiz__thank-title { font-size: clamp(32px, 7cqw, 46px); }
}
@container on-quiz-success (max-width: 359px) {
  .quiz .quiz__thank-hero, .quiz .quiz__thank-next { padding: 24px 20px; }
  .quiz .quiz__thank-title { font-size: 32px; }
}
@media (prefers-reduced-motion: reduce) { .quiz .quiz__thank-home { transition: none; } }