/* Shared money-personality quiz styles (used by every quiz variant). Plain global CSS
   so it reaches the elements the engine injects into #quizStage. Colour vars come from
   the site's global CSS (site.css / content.css). */
.quiz-hero{text-align:center;padding:8px 0}
.quiz-hero h1{font-size:clamp(2rem,6vw,3rem);margin:12px 0 10px;line-height:1.1}
.quiz-sub{color:var(--ink-2,#5b6b82);font-size:1.08rem;line-height:1.6;max-width:640px;margin:0 auto}
.quiz-stage{margin:26px 0;background:#fff;border:1px solid var(--line,#e7ebf1);border-radius:20px;padding:clamp(20px,4vw,34px);box-shadow:0 10px 40px rgba(11,19,38,.06)}
.quiz-about{margin:56px 0 0;text-align:center}
.quiz-about h2{font-size:clamp(1.6rem,4vw,2.1rem);margin:0 0 10px}
.about-intro{color:var(--ink-2,#5b6b82);line-height:1.6;max-width:640px;margin:0 auto 26px}
.type-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;text-align:left}
.type-card{background:#fff;border:1px solid var(--line,#e7ebf1);border-radius:16px;padding:20px}
.type-card h3{margin:0 0 8px;font-size:1.12rem}
.type-card p{margin:0;color:var(--ink-2,#5b6b82);line-height:1.55;font-size:.96rem}
.quiz-cta{margin:56px 0 0;text-align:center;background:linear-gradient(135deg,#139DA0,#0891b2);color:#eafff5;border-radius:22px;padding:clamp(28px,5vw,44px)}
.quiz-cta h2{color:#fff;font-size:clamp(1.5rem,4vw,2rem);margin:0 0 10px}
.quiz-cta p{max-width:560px;margin:0 auto 22px;line-height:1.6;opacity:.94}
.cta-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.quiz-cta .btnp{display:inline-block;background:linear-gradient(120deg,#139DA0,#1DD3A8);color:#06231c;border:0;border-radius:12px;padding:13px 22px;font-weight:600;text-decoration:none;cursor:pointer}
.quiz-cta .btng{display:inline-block;background:rgba(255,255,255,.16);color:#fff;border-radius:12px;padding:13px 22px;font-weight:600;text-decoration:none}

#quizStage .q-progress{height:6px;border-radius:6px;background:#eef1f5;overflow:hidden;margin-bottom:14px}
#quizStage .q-progress span{display:block;height:100%;background:linear-gradient(90deg,#139DA0,#1DD3A8);transition:width .35s ease}
#quizStage .q-count{font-size:.82rem;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:#8a97a8;margin-bottom:8px}
#quizStage .q-title{font-size:clamp(1.3rem,3.5vw,1.7rem);line-height:1.3;margin:0 0 20px;color:var(--ink,#0b1326)}
#quizStage .q-opts{display:flex;flex-direction:column;gap:12px}
#quizStage .q-opt{text-align:left;background:#f7f9fb;border:2px solid #eef1f5;border-radius:14px;padding:16px 18px;font:inherit;font-size:1.02rem;font-weight:600;color:var(--ink,#0b1326);cursor:pointer;transition:border-color .15s,background .15s,transform .1s;animation:qIn .4s cubic-bezier(.2,.7,.2,1) both}
#quizStage .q-opt:hover{border-color:#1DD3A8;background:#f0fbf7}
#quizStage .q-opt:active{transform:scale(.99)}
#quizStage .q-opt.sel{border-color:#1DD3A8;background:#e9fbf4;transform:scale(1.01)}
#quizStage .q-opt:disabled{cursor:default}
#quizStage .q-back{margin-top:18px;background:none;border:none;color:#8a97a8;font:inherit;font-weight:700;cursor:pointer;padding:4px}
#quizStage .q-result{text-align:center}
#quizStage .q-badge{width:74px;height:74px;border-radius:50%;margin:0 auto 14px;display:flex;align-items:center;justify-content:center;background:var(--acc);animation:qPop .55s cubic-bezier(.2,.8,.3,1.3) both}
#quizStage .q-eyebrow{font-size:.8rem;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--acc)}
#quizStage .q-name{font-size:clamp(1.7rem,5vw,2.4rem);margin:6px 0 10px;color:var(--acc)}
#quizStage .q-tag{font-size:1.12rem;font-weight:600;color:var(--ink,#0b1326);margin:0 0 12px}
#quizStage .q-blurb{color:var(--ink-2,#5b6b82);line-height:1.6;max-width:520px;margin:0 auto 22px}
#quizStage .q-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:26px}
#quizStage .btn-primary{display:inline-block;background:linear-gradient(120deg,#139DA0,#1DD3A8);color:#06231c;border:0;border-radius:12px;padding:13px 22px;font:inherit;font-weight:600;text-decoration:none;cursor:pointer}
#quizStage .q-retake{background:none;border:2px solid var(--line,#e7ebf1);border-radius:999px;padding:12px 22px;font:inherit;font-weight:700;color:var(--ink-2,#5b6b82);cursor:pointer}
#quizStage .q-capture{border-top:1px solid #eef1f5;padding-top:22px}
#quizStage .q-cap-title{font-size:1rem;line-height:1.55;color:var(--ink,#0b1326);font-weight:600;max-width:520px;margin:0 auto 16px}
#quizStage .q-form{display:flex;gap:10px;max-width:460px;margin:0 auto;flex-wrap:wrap}
#quizStage .q-input{flex:1;min-width:200px;background:#fff;border:2px solid var(--line,#e7ebf1);border-radius:12px;padding:13px 15px;font:inherit;font-size:1rem;outline:none}
#quizStage .q-input:focus{border-color:#1DD3A8}
#quizStage .q-msg{min-height:20px;margin:12px 0 0;font-weight:600;color:#0f6e56}
#quizStage .q-msg.err{color:#c0392b}
#quizStage .q-anim{animation:qIn .42s cubic-bezier(.2,.7,.2,1) both}
#quizStage .q-loading{text-align:center;padding:34px 0}
#quizStage .q-dots{display:flex;gap:11px;justify-content:center;margin-bottom:16px}
#quizStage .q-dots span{width:14px;height:14px;border-radius:50%;background:#1DD3A8;animation:qPulse 1s ease-in-out infinite}
#quizStage .q-dots span:nth-child(2){animation-delay:.15s}
#quizStage .q-dots span:nth-child(3){animation-delay:.3s}
#quizStage .q-loading-text{color:var(--ink-2,#5b6b82);font-weight:600}
#quizStage .q-result .r1,#quizStage .q-result .r2,#quizStage .q-result .r3,#quizStage .q-result .r4,#quizStage .q-result .r5,#quizStage .q-result .r6{animation:qIn .5s ease both}
#quizStage .q-result .r1{animation-delay:.14s}#quizStage .q-result .r2{animation-delay:.22s}#quizStage .q-result .r3{animation-delay:.32s}#quizStage .q-result .r4{animation-delay:.42s}#quizStage .q-result .r5{animation-delay:.54s}#quizStage .q-result .r6{animation-delay:.66s}
@keyframes qIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes qPop{0%{opacity:0;transform:scale(.5)}60%{transform:scale(1.1)}100%{opacity:1;transform:scale(1)}}
@keyframes qPulse{0%,100%{opacity:.3;transform:scale(.7)}50%{opacity:1;transform:scale(1)}}
@media(max-width:520px){#quizStage .q-form{flex-direction:column}#quizStage .q-input,#quizStage .q-form .btn-primary{width:100%}}
@media(prefers-reduced-motion:reduce){#quizStage .q-anim,#quizStage .q-opt,#quizStage .q-badge,#quizStage .q-result [class*=r]{animation:none!important}}
