/* A stable question area, with an illustrated personal note. */
.personal-quiz { --quiz-accent:#a38a55; background:linear-gradient(160deg,#f1f4ea,#edf2e5); padding:32px var(--gutter); }
.personal-quiz .quiz-eyebrow { color:var(--muted); font-size:10px; letter-spacing:.19em; margin:0 0 12px; }
.personal-quiz h2 { font-size:36px; line-height:1.05; letter-spacing:-.025em; margin-bottom:12px; }
.personal-quiz .journey-intro { max-width:32em; font-size:16px; line-height:1.5; margin-bottom:24px; }
.personal-quiz .journey-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:54px var(--quiz-stage-height,340px); gap:22px 0; margin:0; border:0; position:relative; }
.personal-quiz .journey-step { display:contents; }
.personal-quiz .journey-step-heading { grid-row:1; position:relative; }
.personal-quiz .journey-step:nth-child(1) .journey-step-heading { grid-column:1; }
.personal-quiz .journey-step:nth-child(2) .journey-step-heading { grid-column:2; }
.personal-quiz .journey-step:nth-child(3) .journey-step-heading { grid-column:3; }
.personal-quiz .step-toggle,.personal-quiz .is-active .step-toggle { min-height:54px; height:54px; padding:0 0 12px; gap:7px; align-items:center; border:0; border-bottom:1px solid #cdd6c7; position:relative; }
.personal-quiz .step-toggle::after { content:''; position:absolute; height:2px; bottom:-1px; left:0; right:14px; transform:scaleX(0); transform-origin:left; background:var(--ink); transition:transform 280ms cubic-bezier(.2,.7,.2,1); }
.personal-quiz .is-active .step-toggle::after { transform:scaleX(1); }
.personal-quiz .step-number { position:relative; left:auto; top:auto; width:23px; height:23px; flex:none; font:500 13px var(--serif); background:transparent; color:var(--muted); box-shadow:none; border:1px solid #bbc9b6; transition:background 220ms,color 220ms; }
.personal-quiz .is-active .step-number { background:var(--ink); color:var(--paper); border-color:var(--ink); }
.personal-quiz .has-answer:not(.is-active) .step-number { color:transparent; border-color:#87997c; background:#e0e8d7; }
.personal-quiz .has-answer:not(.is-active) .step-number::after { content:''; position:absolute; width:8px; height:4px; border:solid var(--ink); border-width:0 0 1.5px 1.5px; transform:translateY(-1px) rotate(-45deg); }
.personal-quiz .step-heading-copy { display:block; }
.personal-quiz .step-label { margin:0; font:500 12px/1.25 var(--sans); letter-spacing:0; text-transform:none; color:var(--muted); }
.personal-quiz .is-active .step-label { color:var(--ink); }
.personal-quiz .step-answer,.personal-quiz .step-edit,.personal-quiz .step-summary-art { display:none !important; }
.personal-quiz .step-panel { grid-column:1/-1; grid-row:2; align-self:start; min-width:0; }
.personal-quiz .step-panel[hidden] { display:none; }
.personal-quiz .step-panel legend { font:500 28px/1.12 var(--serif); margin:0 0 8px; letter-spacing:-.015em; outline:none; }
.personal-quiz .journey-help { font-size:14px; margin-bottom:18px; }
.personal-quiz .journey-navigation { display:none; }
.personal-quiz .journey-option { margin:0 0 6px; border-radius:9px; isolation:isolate; -webkit-tap-highlight-color:transparent; transition:background-color 180ms; }
.personal-quiz .journey-option:has(input:checked) { background:#e0e9d5; }
.personal-quiz .journey-choice { grid-template-columns:60px minmax(0,1fr); gap:14px; min-height:78px; padding:10px 34px 10px 8px; }
.personal-quiz .journey-choice img { width:60px; height:58px; object-fit:contain; mix-blend-mode:multiply; transition:transform 300ms cubic-bezier(.2,.7,.2,1); }
.personal-quiz .journey-option:has(input:checked) img { transform:translateY(-2px) scale(1.04); }
.personal-quiz .journey-choice-title { font-size:23px; line-height:1.1; }
.personal-quiz .journey-choice-desc { font-size:14px; line-height:1.4; margin-top:5px; }
.personal-quiz .journey-option input { appearance:none; -webkit-appearance:none; border:1px solid #9eae95; border-radius:50%; width:19px; height:19px; top:calc(50% - 9.5px); background:transparent; transition:background-color 150ms,border-color 150ms; }
.personal-quiz .journey-option input[type=checkbox] { border-radius:5px; }
.personal-quiz .journey-option input:checked { background:var(--ink); border-color:var(--ink); }
.personal-quiz .journey-option input:checked::after { content:''; position:absolute; width:8px; height:4px; left:4px; top:5px; border:solid var(--paper); border-width:0 0 1.5px 1.5px; transform:rotate(-45deg); }
.personal-quiz .quiz-footnote { min-height:42px; display:flex; align-items:center; gap:9px; margin-top:12px; }
.personal-quiz .quiz-footnote p { font:italic 500 18px/1.25 var(--serif); margin:0; color:var(--muted); }
.noted-mark { height:5px; width:5px; border-radius:50%; background:var(--quiz-accent); flex:none; transition:box-shadow 300ms; }
.personal-quiz.is-complete .noted-mark { background:var(--ink); box-shadow:0 0 0 4px #dae4ce; }
.story-heading { gap:10px; }
.journey-story { background:#edf2e5; border-radius:6px 6px 0 0; }
#journey-story-text { font-size:17px; line-height:1.25; }
.story-words strong { font-weight:600; }
.story-flight { position:fixed; z-index:100; pointer-events:none; object-fit:contain; mix-blend-mode:multiply; transform-origin:top left; will-change:transform,opacity; }
@media (hover:hover) { .personal-quiz .step-toggle:hover .step-label { color:var(--ink); } }
@media(min-width:1100px) {
 .dream-journey-pair .personal-quiz { padding:32px; }
 .dream-journey-pair .personal-quiz h2 { font-size:42px; }
 .personal-quiz .step-panel legend { font-size:32px; }
 .personal-quiz .journey-choice { min-height:86px; }
 .personal-quiz .journey-choice-title { font-size:26px; }
 .personal-quiz .journey-choice-desc { font-size:14px; }
 .personal-quiz .journey-help { font-size:14px; }
 .personal-quiz .journey-intro { min-height:48px; }
 .personal-quiz .quiz-footnote { margin-top:16px; }
}
@media(max-width:359px) {
 .personal-quiz { padding-inline:20px; }
 .personal-quiz h2 { font-size:32px; }
 .personal-quiz .journey-intro { font-size:13px; }
 .personal-quiz .step-label { font-size:11px; }
 .personal-quiz .step-toggle { gap:5px; }
 .personal-quiz .step-panel legend { font-size:26px; }
 .personal-quiz .journey-choice { grid-template-columns:44px minmax(0,1fr); gap:9px; min-height:76px; padding-left:4px; }
 .personal-quiz .journey-choice img { width:44px; height:52px; }
 .personal-quiz .journey-choice-title { font-size:21px; }
 .personal-quiz .journey-choice-desc { font-size:12px; }
 .story-heading { gap:6px; }
}
html[lang=ru] .personal-quiz .journey-choice-title { font-size:22px; }
@media(max-width:359px) { html[lang=ru] .personal-quiz .journey-choice-title { font-size:20px; } }
@media(prefers-reduced-motion:reduce) { .personal-quiz *, .personal-quiz *::after { transition:none !important; } }

/* Short phones retain every answer and the CTA; supporting prose is optional. */
@media(max-width:699px) and (max-height:700px) {
 .personal-quiz .journey-choice-desc { display:none; }
 .personal-quiz .journey-choice { min-height:66px; padding-block:6px; }
 .personal-quiz .journey-choice img { height:50px; }
 .personal-quiz .journey-help { margin-bottom:12px; }
 .personal-quiz .journey-steps { gap:16px 0; }
}
@media(max-width:1099px) {
 .personal-quiz { padding-top:32px; }
 .personal-quiz h2 { margin-bottom:16px; }
 .personal-quiz .journey-intro { margin-bottom:24px; }
 .personal-quiz .journey-steps { row-gap:16px; }
}
@media(min-width:1100px) {
 .personal-quiz .quiz-eyebrow { font-size:11px; margin-bottom:12px; }
}

/* An illustration stays attached to its answer, including every wellbeing wish. */
.story-art { display:inline-block; width:23px; height:23px; object-fit:contain; vertical-align:-5px; margin:0 5px 0 0; mix-blend-mode:multiply; }
.story-illustrated-word { white-space:nowrap; }
.story-previous .story-art { visibility:hidden; }
#journey-story-text { line-height:1.3; }
.story-line + .story-line { margin-top:2px; }
#journey-story-compact { line-height:1.4; }
@media(max-width:359px) {
 .story-art { width:22px; height:22px; vertical-align:-5px; margin-right:4px; }
}

/* The full Russian title still leaves all three answers accessible on short phones. */
@media(max-width:359px) and (max-height:650px) {
 .personal-quiz { padding-top:20px; }
 .personal-quiz .quiz-eyebrow { display:none; }
 .personal-quiz .journey-intro { margin-bottom:12px; }
 .personal-quiz .journey-steps { row-gap:12px; }
 .personal-quiz .journey-option { margin-bottom:4px; }
 .personal-quiz .journey-choice { min-height:58px; padding-block:4px; }
}
