/* Conversation-only layer. Never targets the header, intro, app descriptions or prices. */
#beratung { background:#eef1eb; color:var(--ink); padding:44px 0 28px; border-block:1px solid #d5ddd2; isolation:isolate; }
#beratung .quiz-overline { display:flex; justify-content:space-between; align-items:center; gap:20px; padding-bottom:28px; }
#beratung #advisor-title { max-width:520px; font-size:clamp(22px,2.4vw,32px); line-height:1.12; letter-spacing:-.035em; font-weight:650; color:var(--pine); }
#beratung .quiz-progress { display:flex; gap:15px; align-items:center; color:var(--secondary); font-size:11px; }
#beratung .quiz-steps { display:flex; gap:6px; list-style:none; margin:0; padding:0; }
#beratung .quiz-steps li { width:20px; height:4px; background:#c9d4c7; border-radius:2px; }
#beratung .quiz-steps li.is-current { background:var(--cta); }
#beratung .quiz-steps li.is-done { background:#6e9a7d; }
#beratung .quiz-conversation { display:grid; grid-template-columns:minmax(270px,.9fr) minmax(0,1.6fr); grid-template-rows:auto 1fr; column-gap:35px; row-gap:27px; align-items:start; }
#beratung .quiz-host { width:100%; max-width:430px; aspect-ratio:1; grid-column:1; grid-row:1 / 3; align-self:center; background-image:url('assets/vulstrix-quiz-expressions-v1.png'); background-size:300% 200%; background-repeat:no-repeat; background-position:0 0; mix-blend-mode:multiply; }
/* Single atlas: expression changes never require a new image request. */
#beratung .quiz-host[data-expression="1"] { background-position:50% 0; }
#beratung .quiz-host[data-expression="2"] { background-position:100% 0; }
#beratung .quiz-host[data-expression="3"] { background-position:0 100%; }
#beratung .quiz-host[data-expression="4"] { width:90%; aspect-ratio:460/512; justify-self:center; background-size:333.9% 200%; background-position:47.9% 100%; }
#beratung .quiz-host[data-expression="5"] { width:145%; max-width:620px; aspect-ratio:566/512; justify-self:start; margin-top:35px; margin-left:-22%; align-self:start; background-size:271.4% 200%; background-position:100% 100%; }
#beratung .quiz-speech,#beratung .quiz-answers { position:relative; z-index:2; }
#beratung .quiz-speech { grid-column:2; grid-row:1; position:relative; background:#fffefa; border:2px solid var(--pine); border-radius:22px 24px 21px 5px; padding:26px 30px; box-shadow:3px 4px 0 #123f3c12; }
#beratung .quiz-speech::before { content:''; position:absolute; left:-19px; bottom:24px; width:28px; height:23px; background:var(--pine); clip-path:polygon(100% 0,0 100%,100% 80%); }
#beratung .quiz-speech::after { content:''; position:absolute; left:-14px; bottom:27px; width:24px; height:19px; background:#fffefa; clip-path:polygon(100% 0,0 100%,100% 80%); }
#beratung #quiz-spoken-question { font-size:clamp(28px,2.7vw,38px); font-weight:650; line-height:1.16; letter-spacing:-.035em; color:var(--pine); max-width:620px; outline:none; }
#beratung .quiz-answers { grid-column:2; grid-row:2; min-width:0; }
#beratung .quiz-fieldset { border:0; padding:0; margin:0; min-width:0; }
#beratung .quiz-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
#beratung .quiz-options[data-count="2"] { grid-template-columns:repeat(2,minmax(0,1fr)); }
#beratung .quiz-option { display:flex; flex-direction:column; align-items:stretch; gap:0; position:relative; min-height:248px; padding:17px 16px 21px; border:1.5px solid #c9d4c7; border-radius:12px; background:#f8faf6; transition:background .16s,border-color .16s,transform .16s; box-shadow:none; }
#beratung .quiz-option:hover { border-color:#638b70; background:#fffefa; transform:translateY(-3px); }
#beratung .quiz-option:has(input:checked) { border-color:var(--cta); background:#e0ecdf; box-shadow:inset 0 0 0 1px var(--cta); }
#beratung .quiz-option:focus-within { outline:none; }
#beratung .quiz-option:has(input:focus-visible) { outline:3px solid var(--cta); outline-offset:4px; }
#beratung .quiz-option input { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip-path:inset(50%); }
#beratung .quiz-choice-mark { position:absolute; right:12px; top:10px; color:var(--cta); font-size:18px; font-weight:700; opacity:0; }
#beratung .quiz-option:has(input:checked) .quiz-choice-mark { opacity:1; }
#beratung .quiz-choice-art { display:flex; justify-content:center; align-items:center; height:119px; margin-bottom:10px; color:var(--pine); }
#beratung .quiz-choice-art svg { display:block; width:110px; max-width:100%; height:100px; overflow:visible; }
#beratung .quiz-choice-art img { display:block; width:100%; height:134px; object-fit:contain; }
#beratung .quiz-choice-art .quiz-team-art { max-width:230px; }
#beratung .quiz-options[data-count="2"] .quiz-choice-art { height:139px; }
#beratung .quiz-options[data-count="2"] .quiz-choice-art img { height:149px; }
#beratung .quiz-option strong { font-size:17px; line-height:1.22; font-weight:650; letter-spacing:-.015em; }
#beratung .quiz-option small { margin-top:7px; font-size:12px; line-height:1.45; color:#506456; }
#beratung .quiz-controls { margin-top:16px; min-height:42px; }
#beratung .quiz-back { padding:13px 0; }
#beratung .quiz-bypass { display:block; width:fit-content; margin:24px 0 0 auto; color:var(--secondary); font-size:11px; text-underline-offset:4px; }
#beratung .quiz-result { background:#fffefa; border:1px solid #c9d4c7; border-radius:12px; padding:28px; }
#beratung .quiz-result .home-eyebrow { margin-bottom:20px; color:var(--pine); font-size:clamp(22px,2.2vw,29px); line-height:1.15; letter-spacing:-.035em; text-transform:none; }
#beratung .quiz-result h3 { margin:12px 0 0; font-size:25px; line-height:1.15; }
#beratung .quiz-result-grid,#beratung .quiz-combination-grid { display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--line); border-radius:9px; overflow:hidden; background:#fffefa; }
#beratung .quiz-combination-card { border:2px solid var(--pine); border-radius:11px; padding:5px; background:#eef3eb; }
#beratung .quiz-combination-grid { border:0; }
#beratung .quiz-result-app { min-width:0; padding:23px; }
#beratung .quiz-result-app + .quiz-result-app { border-left:1px solid var(--line); }
#beratung .quiz-result-app.is-primary { background:#f5f8f2; }
#beratung .quiz-result-app-top { display:flex; justify-content:space-between; align-items:center; gap:12px; }
#beratung .quiz-result-label { color:var(--secondary); font-size:10px; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }
#beratung .quiz-benefits { list-style:none; display:grid; grid-template-columns:1fr; gap:8px; padding:16px 0 0; margin:17px 0 0; border-top:1px solid var(--line); }
#beratung .quiz-benefits li { position:relative; padding-left:23px; font-size:14px; line-height:1.45; }
#beratung .quiz-benefits li::before { content:'✓'; position:absolute; left:0; top:0; color:var(--cta); font-weight:800; }
#beratung .quiz-result-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:19px; }
#beratung .quiz-result-actions .home-button { margin-top:0; padding:11px 13px; min-height:43px; font-size:12px; }
#beratung .quiz-result > .quiz-controls { margin-top:14px; }
@media (max-width:1000px) {
 #beratung .quiz-conversation { grid-template-columns:minmax(210px,.72fr) minmax(0,1.6fr); column-gap:22px; }
 #beratung .quiz-speech { padding:22px; }
 #beratung .quiz-option { padding:16px 12px; min-height:250px; }
 #beratung .quiz-option strong { font-size:15px; }
 #beratung .quiz-choice-art { height:96px; }
}
@media (max-width:760px) {
 #beratung { padding:30px 0 25px; }
 #beratung .quiz-overline { padding-bottom:22px; }
 #beratung .quiz-conversation { grid-template-columns:minmax(120px,.65fr) minmax(0,1fr); column-gap:17px; row-gap:19px; }
 #beratung .quiz-host { grid-row:1; align-self:end; max-width:260px; justify-self:center; }
 #beratung .quiz-host[data-expression="5"] { width:100%; max-width:285px; margin:0; align-self:end; justify-self:center; }
 #beratung .quiz-speech { align-self:center; padding:21px 20px; border-radius:18px 20px 18px 4px; }
 #beratung #quiz-spoken-question { font-size:clamp(23px,4.3vw,31px); }
 #beratung .quiz-answers { grid-column:1 / -1; }
 #beratung .quiz-options { gap:11px; }
 #beratung .quiz-option { min-height:214px; }
 #beratung .quiz-option strong { font-size:16px; }
 #beratung .quiz-choice-art { height:95px; margin-bottom:8px; }
 #beratung .quiz-options[data-count="2"] .quiz-choice-art { height:123px; }
 #beratung .quiz-options[data-count="2"] .quiz-choice-art img { height:133px; }
 #beratung .quiz-bypass { margin-top:22px; }
}
@media (max-width:480px) {
 #beratung .quiz-overline { align-items:flex-start; gap:12px; }
 #beratung #advisor-title { max-width:230px; font-size:20px; line-height:1.16; }
 #beratung .quiz-progress { align-items:flex-end; flex-direction:column; gap:7px; white-space:nowrap; font-size:10px; }
 #beratung .quiz-steps li { width:15px; height:3px; }
 #beratung .quiz-conversation { grid-template-columns:124px minmax(0,1fr); gap:18px 10px; }
 #beratung .quiz-speech { padding:15px 13px; border-radius:14px 16px 14px 3px; }
 #beratung .quiz-speech::before { bottom:21px; }
 #beratung .quiz-speech::after { bottom:24px; }
 #beratung #quiz-spoken-question { font-size:23px; }
 #beratung .quiz-options { grid-template-columns:1fr; gap:9px; }
 #beratung .quiz-options:not([data-count="2"]) .quiz-option { display:grid; grid-template-columns:68px 1fr; column-gap:12px; align-items:center; min-height:98px; padding:10px 23px 10px 12px; }
 #beratung .quiz-choice-art { width:68px; height:72px; margin:0; }
 #beratung .quiz-choice-art svg { width:68px; height:65px; }
 #beratung .quiz-option small { font-size:11px; margin-top:5px; }
 #beratung .quiz-options[data-count="2"] .quiz-option { min-height:219px; padding:16px 12px; }
 #beratung .quiz-options[data-count="2"] .quiz-choice-art { width:100%; height:116px; margin-bottom:12px; }
 #beratung .quiz-options[data-count="2"] .quiz-choice-art img { height:126px; }
 #beratung .quiz-options[data-count="2"] .quiz-option strong { font-size:16px; }
 #beratung .quiz-result { padding:21px 18px; }
 #beratung .quiz-result h3 { font-size:25px; }
 #beratung .quiz-result-grid,#beratung .quiz-combination-grid { grid-template-columns:1fr; }
 #beratung .quiz-result-app + .quiz-result-app { border-left:0; border-top:1px solid var(--line); }
 #beratung .quiz-result-actions { gap:8px; }
 #beratung .quiz-result .home-button { width:100%; margin-top:8px; }
}
@media (prefers-reduced-motion:reduce) {
 #beratung .quiz-option { transition:none; }
 #beratung .quiz-option:hover { transform:none; }
 #beratung .quiz-fieldset { animation:none; }
}