/* Quiz-specific layout; shared fonts, containers and buttons come from the site. */
.quiz-page { background: radial-gradient(ellipse at 50% 0,#eee5d56b,transparent 65%); scroll-margin-top: 80px; }
.quiz-container { max-width: 920px; }
.quiz-intro { text-align: center; max-width: 760px; margin-inline: auto; }
.quiz-intro h1 { font-size: clamp(2rem,3.3vw,3rem); font-weight: 500; line-height: 1.2; letter-spacing: -.04em; text-wrap: balance; }
.quiz-intro>p { max-width: 650px; margin-inline: auto; }
.quiz-emblem { display: grid; place-items: center; width: 64px; height: 64px; border: 1px solid #b58a4c55; border-radius: 50%; color: var(--gold); font-size: 38px; margin: 0 auto 26px; }
.quiz-facts { display: flex; justify-content: center; gap: 28px; padding: 0; list-style: none; margin: 30px 0; font-size: 13px; }
.quiz-facts li { display: flex; flex-direction: column; gap: 3px; }
.quiz-facts strong { font-size: 20px; font-weight: 500; color: var(--ink); }
.quiz-note { font-size: 13px; line-height: 1.65; margin-top: 20px; }
.quiz-disclaimer { max-width: 700px; margin: 35px auto 0; font-size: 12px; text-align: center; line-height: 1.75; }
.quiz-panel { padding: 36px; border: 1px solid #e4ded4; border-radius: 24px; background: #fffdf9; box-shadow: 0 8px 30px #03172b03; min-width: 0; }
.quiz-progress-label { display: flex; justify-content: space-between; gap: 16px; font-size: 12px; font-weight: 600; color: #6e5736; }
#quiz-progress { display: block; appearance: none; width: 100%; height: 5px; border: 0; border-radius: 99px; overflow: hidden; margin: 14px 0 35px; background: #eee7dc; color: var(--gold); }
#quiz-progress::-webkit-progress-bar { background: #eee7dc; }
#quiz-progress::-webkit-progress-value { background: var(--gold); border-radius: 99px; transition: width .3s var(--ease-out); }
#quiz-progress::-moz-progress-bar { background: var(--gold); border-radius: 99px; }
#quiz-question { font-size: clamp(1.4rem,2.2vw,1.85rem); text-align: center; line-height: 1.35; margin-bottom: 16px; }
.quiz-hint { text-align: center; font-size: 13px; margin-bottom: 28px; }
#quiz-options { border: 0; padding: 0; margin: 0; min-width: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.quiz-option { position: relative; display: flex; align-items: center; gap: 15px; min-height: 102px; padding: 20px; border: 1px solid #ddd8ce; border-radius: 16px; cursor: pointer; font-size: 15px; line-height: 1.6; transition: border-color .2s,background .2s,box-shadow .2s; }
.quiz-option input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; padding: 0; }
.quiz-option-letter { flex: 0 0 32px; display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid #d7cec0; border-radius: 50%; font-size: 12px; font-weight: 600; transition: background .2s,color .2s; }
.quiz-option:has(input:checked) { background: #f6edde; border-color: #a87934; box-shadow: inset 0 0 0 1px #a87934; }
.quiz-option input:checked+.quiz-option-letter { background: var(--navy-900); border-color: var(--navy-900); color: var(--gold-light); }
.quiz-option:has(input:focus-visible) { outline: 3px solid var(--gold); outline-offset: 4px; }
.quiz-navigation { display: flex; justify-content: space-between; gap: 18px; margin-top: 30px; padding-top: 25px; border-top: 1px solid #e7e0d6; }
.quiz-page .btn { min-height: 50px; font-size: 13px; }
.quiz-page .btn:disabled { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }
.quiz-result-heading { text-align: center; max-width: 700px; margin: 0 auto 36px; }
.quiz-result-heading h2 { font-size: clamp(1.9rem,3.1vw,2.8rem); }
.quiz-profile-marker { display: inline-block; width: .65em; height: .65em; margin-inline-end: .4em; vertical-align: .02em; }
#quiz-affinity { color: var(--ink); font-weight: 500; }
.quiz-result-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.quiz-chart-panel { grid-column: 1 / -1; }
.quiz-result-grid h3 { font-size: 19px; line-height: 1.4; }
.quiz-list { padding-left: 19px; margin: 0; font-size: 15px; color: #526473; }
.quiz-list li { margin-top: 8px; padding-left: 4px; }
.quiz-list li::marker { color: var(--gold); }
.quiz-secondary { background: var(--navy-900); color: white; }
.quiz-secondary .eyebrow { color: var(--gold-light); font-size: 9px; }
.quiz-secondary h3 { font-size: 25px; font-weight: 500; }
.quiz-secondary p { color: #c2ced7; font-size: 15px; margin-bottom: 0; }
.quiz-combination { background: #f6edde; border-color: #d8c5a5; }
.quiz-lead > .eyebrow { display: block; text-align: center; }
.quiz-lead > h2 { text-align: center; font-size: clamp(1.6rem,2.6vw,2.2rem); margin-bottom: 32px; }
.quiz-fields { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.quiz-lead label:not(.quiz-radio):not(.quiz-consent) { display: block; margin-bottom: 8px; color: var(--ink); font-size: 13px; font-weight: 600; }
.quiz-lead input:not([type=radio]):not([type=checkbox]), .quiz-lead textarea, #quiz-share-text { width: 100%; border: 1px solid #d8d0c4; border-radius: 10px; background: white; padding: 12px 14px; color: var(--ink); font: inherit; }
.quiz-lead fieldset { border: 0; padding: 0; margin: 30px 0; }
.quiz-lead legend { margin-bottom: 14px; color: var(--ink); font-weight: 600; }
.quiz-radio { display: flex; align-items: center; gap: 12px; min-height: 46px; margin-bottom: 8px; padding: 10px 13px; border: 1px solid #ddd8ce; border-radius: 10px; background: #fff; cursor: pointer; line-height: 1.4; transition: border-color .18s,background .18s,box-shadow .18s; }
.quiz-radio:hover { border-color: #c4a77b; background: #fffaf2; }
.quiz-radio:has(input:checked) { border-color: #a87934; background: #f8efe1; box-shadow: inset 0 0 0 1px #a87934; }
.quiz-radio:has(input:focus-visible),.quiz-consent:has(input:focus-visible) { outline: 3px solid var(--gold); outline-offset: 3px; }
.quiz-radio input[type=radio],.quiz-consent input[type=checkbox] { display:block; flex:0 0 18px; width:18px; min-width:18px; height:18px; margin:0; padding:0; border:0; accent-color:var(--navy-900); }
.quiz-consent { display:flex; align-items:flex-start; gap:10px; margin-top:18px; color:#526473; font-size:13px; line-height:1.6; cursor:pointer; }
.quiz-consent input[type=checkbox] { margin-top:2px; }
.quiz-consent span { min-width:0; }
.quiz-chart { padding: 0; margin: 24px 0 0; list-style: none; }
.quiz-chart li { margin-bottom: 20px; }
.quiz-chart li>div:first-child { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; }
.quiz-chart-track { height: 7px; border-radius: 99px; overflow: hidden; background: #eee7dc; margin-top: 9px; }
.quiz-chart-track span { display: block; height: 100%; border-radius: inherit; background: var(--gold); transform-origin: left; }
.quiz-chart li:first-child .quiz-chart-track span { background: var(--navy-700); }
.quiz-recommendation { padding-block: 42px 30px; }
.quiz-recommendation>h2 { max-width: 620px; font-size: clamp(1.7rem,2.5vw,2.2rem); }
.quiz-course { display: flex; gap: 26px; padding: 30px; background: #efe8dc; border: 1px solid #dfd3c1; border-radius: 24px; }
.quiz-course h3 { font-size: 22px; line-height: 1.35; }
.quiz-course p { font-size: 15px; }
.quiz-course-icon { display: grid; place-items: center; flex-shrink: 0; width: 58px; height: 58px; border: 1px solid #cbb792; border-radius: 16px; font-size: 30px; color: #806031; }
.quiz-result-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 24px; }
.quiz-share { background: transparent; border: 0; border-bottom: 1px solid #c9b99d; font-family: inherit; padding-inline: 0; }
.quiz-teaser { padding-top: 0; }
.quiz-teaser-grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 65px; align-items: center; padding: 48px; background: var(--navy-900); border-radius: 30px; color: white; }
.quiz-teaser .eyebrow { color: var(--gold-light); }
.quiz-teaser h2 { font-size: clamp(1.65rem,2.5vw,2.35rem); }
.quiz-teaser p { color: #c2ced7; font-size: 15px; }
.quiz-teaser-details { padding-left: 36px; border-left: 1px solid #ffffff20; text-align: center; }
.quiz-teaser-details>p { font-family: 'DM Serif Display',Georgia,serif; font-size: 28px; line-height: 1.4; }
.quiz-teaser-details em { font-style: italic; color: var(--gold-light); }
.quiz-teaser .quiz-facts { gap: 23px; font-size: 11px; margin-bottom: 0; }
.quiz-teaser .quiz-facts strong { color: #f1c587; }
@media (hover:hover) { .quiz-option:hover { background: #f8f1e7; border-color: #b7996b; } }
@media (max-width:768px) {
  .quiz-panel { padding: 25px; }
  #quiz-options { grid-template-columns: 1fr; }
  .quiz-option { min-height: 78px; }
  .quiz-result-grid { grid-template-columns: 1fr; }
  .quiz-chart-panel { grid-column: auto; }
  .quiz-fields { grid-template-columns: 1fr; }
  .quiz-teaser-grid { grid-template-columns: 1fr; gap: 32px; padding: 32px; }
  .quiz-teaser-details { padding: 28px 0 0; border-left: 0; border-top: 1px solid #ffffff20; }
  .quiz-teaser-details .quiz-emblem { display: none; }
  .quiz-teaser-details>p { font-size: 25px; }
}
@media (max-width:480px) {
  .quiz-page { padding-block: 38px; scroll-margin-top: 66px; }
  .quiz-panel { padding: 22px 18px; border-radius: 20px; }
  .quiz-facts { gap: 18px; font-size: 11px; }
  .quiz-facts li { flex: 1; }
  .quiz-facts strong { font-size: 18px; }
  .quiz-option { padding: 16px 13px; font-size: 14px; gap: 12px; }
  .quiz-navigation { gap: 10px; }
  .quiz-navigation .btn { padding-inline: 16px; }
  .quiz-navigation .btn-primary { flex: 1; }
  .quiz-course { padding: 24px; flex-direction: column; gap: 20px; }
  .quiz-course h3 { font-size: 20px; }
  .quiz-course .btn { width: 100%; padding-inline: 16px; }
  .quiz-result-actions { flex-direction: column; align-items: stretch; text-align: center; }
  .quiz-teaser-grid { padding: 28px 23px; }
  .quiz-teaser .btn, #quiz-start { width: 100%; }
}
@media (prefers-reduced-motion:no-preference) {
  .quiz-chart-track span { animation: quiz-bar-in .6s var(--ease-out) both; }
  @keyframes quiz-bar-in { from { transform: scaleX(0); } to { transform: scaleX(1); } }
}
@media (prefers-reduced-motion:reduce) { #quiz-progress::-webkit-progress-value { transition: none; } }
