.demo-journey-page { max-width: 1440px; container-type: inline-size; }
.demo-journey-hero { padding: clamp(1.5rem, 4vw, 4rem) 0 2.5rem; max-width: 800px; }
.demo-journey-hero h1 { font-size: clamp(2.3rem, 4vw, 4.2rem); line-height: 1.08; letter-spacing: -.04em; margin: 1rem 0; }
.demo-journey-hero > p:last-child { max-width: 650px; color: var(--muted); font-size: 1.12rem; line-height: 1.6; }
.demo-journey-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; margin-bottom: 1.5rem; }
.demo-journey-option { display: flex; flex-direction: column; align-items: flex-start; margin: 0; padding: 1.7rem; }
.demo-journey-option h2 { margin: 1.25rem 0 .4rem; line-height: 1.2; }
.demo-journey-option > p { line-height: 1.6; }
.demo-journey-option .button, .demo-journey-option form { margin-top: .5rem; width: 100%; max-width: 100%; }
.demo-journey-page .button { white-space: normal; overflow-wrap: anywhere; text-align: center; }
.demo-journey-number { color: var(--juniper); font-size: .9rem; font-weight: 700; letter-spacing: .12em; }
.demo-journey-option-featured { border-color: var(--sage); background: #edf0e7; }
.demo-journey-prompt { margin-top: 1.2rem; line-height: 1.5; }
.demo-journey-prompt summary { cursor: pointer; font-weight: 600; padding: .5rem 0; }
.demo-journey-live { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(300px, 1fr); gap: 3rem; padding: 2rem; scroll-margin-top: 2rem; }
.demo-journey-question { font-size: 1.15rem; line-height: 1.6; }
.demo-journey-steps { padding-left: 1.5rem; margin-top: 2rem; }
.demo-journey-steps li { padding-left: .65rem; margin-bottom: 1.3rem; }
.demo-journey-steps li::marker { color: var(--juniper); font-weight: 700; }
.demo-journey-steps li > div { display: flex; justify-content: space-between; gap: 1rem; }
.demo-journey-steps span { flex-shrink: 0; color: var(--muted); font-size: .85rem; }
.demo-journey-steps p { color: var(--muted); margin-top: .35rem; line-height: 1.5; }
.demo-journey-connect { padding: 1.5rem; background: var(--bg); border-radius: var(--radius-md); }
.demo-journey-connect h3 { margin: .5rem 0 1rem; }
.demo-journey-connect h3:not(:first-child) { margin-top: 2rem; }
.demo-journey-connect > p { line-height: 1.5; }
.demo-journey-qr { max-width: 225px; margin: 1rem auto; }
.demo-journey-qr svg { display: block; width: 100%; height: auto; border-radius: 8px; }
.demo-journey-readiness { border-top: 1px solid var(--border); padding-top: 1rem; }
.demo-journey-readiness > div { display: flex; justify-content: space-between; gap: 1rem; padding: .4rem 0; }
.demo-journey-readiness dt { color: var(--muted); font-size: .9rem; }
.demo-journey-readiness dd { font-weight: 700; }
.demo-journey-entry { text-align: left; margin-top: 1.5rem; padding: 1.5rem; background: #edf0e7; border-radius: var(--radius-md); }
body:has(.demo-journey-page, #session_report_editor_workspace, #session_setup_wizard, .wizard-shell) > .dev-account-switcher { position: static; width: min(700px, calc(100% - 40px)); margin: 1rem auto; }
@media (max-width: 1050px) {
  .demo-journey-options { grid-template-columns: 1fr; }
  .demo-journey-option { padding: 1.5rem; }
  .demo-journey-live { grid-template-columns: 1fr; gap: 1.5rem; }
}
@container (max-width: 900px) {
  .demo-journey-options { grid-template-columns: 1fr; }
  .demo-journey-live { grid-template-columns: 1fr; gap: 1.5rem; }
}
@media (max-width: 600px) {
  .demo-journey-live { padding: 1.25rem; }
  .demo-journey-connect { padding: 1rem; }
  .demo-journey-option .button, .demo-journey-option form { width: 100%; }
  .demo-journey-steps li > div { flex-wrap: wrap; gap: .3rem; }
}