/* The two visual stories: scoped to the hero demo and learning journey. */
.hero-promises.hero-benefit-controls{gap:0;margin-top:25px;max-width:490px}
.hero-benefit-controls li{display:block;padding:0;max-width:none;border:0;border-radius:0;background:none;box-shadow:none;border-bottom:1px solid var(--line)}
.hero-benefit-controls li:last-child{border-bottom:0}
.hero-benefit-controls button{display:flex;align-items:center;gap:15px;width:100%;padding:14px 4px;border:0;background:transparent;text-align:left;border-radius:4px;transition:background .18s}
.hero-benefit-controls button:hover{background:#f4f3f2}
.hero-benefit-controls .promise-number{display:grid;place-items:center;width:28px;height:28px;border:1px solid #eae4e1;border-radius:50%;font-size:.7rem;margin:0;line-height:1;flex-shrink:0}
.hero-benefit-controls button[aria-pressed=true]{background:var(--accent-soft)}
.hero-benefit-controls button[aria-pressed=true] .promise-number{background:var(--accent);color:#fff;border-color:var(--accent)}
.hero-benefit-controls strong{font-size:1rem;line-height:1.45}
.hero-benefit-controls small{display:block;font-size:.8125rem;color:var(--muted);margin-top:2px;line-height:1.5}
.benefit-arrow{margin-left:auto;color:#90715f;font-size:1.2rem;padding-inline:7px}
.hero-benefit-controls button[aria-pressed=true] .benefit-arrow{color:var(--accent)}
#walkthrough .demo-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}
#walkthrough .demo-tabs button{min-height:51px;padding-block:7px 11px;font-size:.8125rem}
#walkthrough .demo-panel{min-height:450px;padding:19px 22px 20px}
#walkthrough .question-equation{font-size:1.55rem;line-height:1.5}
.walkthrough-content{animation:walkthrough-reveal .22s ease-out}
.walkthrough-paper{position:relative;margin-top:15px;padding:13px 16px 13px 23px;border:1px solid #f0eeed;border-radius:4px;background:repeating-linear-gradient(#f8f7f6 0,#f8f7f6 31px,#f2f0ef 32px);overflow:hidden}
.walkthrough-paper:before{content:'';position:absolute;inset:0 auto 0 14px;width:1px;background:#e5d8bf}
.walkthrough-paper .working-label{margin-bottom:7px;font-size:.6875rem;letter-spacing:.045em;color:#82756e}
.walkthrough-working{font-family:'Segoe Print','Bradley Hand',var(--serif);font-style:italic;font-size:1.2rem;line-height:1.65;color:var(--ink)}
.missing-step{display:flex;align-items:center;gap:12px;margin-top:6px;flex-wrap:wrap}
.missing-step .math{display:inline-block;border:1px dashed #977562;border-radius:45% 48% 46% 40%;padding:0 11px;background:#f4f2f1;font-size:1.125rem}
.missing-step small{font-size:.75rem;color:#715443;font-weight:500}
#walkthrough .feedback-note{margin-top:13px;padding:11px 12px}
#walkthrough .feedback-note p{font-size:.8125rem;line-height:1.55}
#walkthrough .feedback-note strong{font-size:.875rem}
.practice-origin{font-size:.75rem;color:#725c50;margin-bottom:11px;padding-left:10px;border-left:2px solid #bc9680}
.factor-fork{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;text-align:center;padding:10px 12px;margin-bottom:14px;border-radius:5px;background:#f5f4f3}
.factor-fork>span{grid-column:1/-1;font-size:.6875rem;letter-spacing:.08em;color:#7c6354}
.factor-fork>.math{grid-column:1/-1;font-size:1.2rem;margin:3px 0 9px}
.factor-branch{position:relative;font-family:var(--serif);font-style:italic;font-size:1.0625rem;color:var(--ink);padding-top:8px;border-top:1px solid #eae4e1}
.factor-branch:before{content:'';position:absolute;left:50%;top:-7px;height:7px;width:1px;background:#eae4e1}
.product-rule-visual{padding:11px 12px;margin-bottom:14px;background:#f5f4f3;text-align:center;border-radius:5px}
.product-rule-visual>span{font-size:.6875rem;letter-spacing:.06em;color:#7c6354}
.product-rule-visual .math{font-size:1.25rem;margin-top:4px}
.product-rule-visual mark{background:#edebea;color:var(--ink);padding:2px 6px;border-radius:3px}
#walkthrough .answer-options{margin-top:12px;gap:6px}
#walkthrough .answer-choice{padding:8px 11px;font-size:.8125rem}
#walkthrough .practice-result{font-size:.8125rem;line-height:1.55;margin-top:9px}
.walkthrough-progress-title{font-family:var(--serif);font-weight:400;font-size:1.55rem;letter-spacing:-.035em;line-height:1.3;margin:4px 0 8px}
.walkthrough-progress-intro{font-size:.8125rem;line-height:1.6;color:var(--muted)}
.practice-timeline{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:0}
.practice-timeline li{position:relative;display:grid;grid-template-columns:28px 1fr;gap:12px;padding-bottom:19px}
.practice-timeline li:not(:last-child):before{content:'';position:absolute;left:13px;top:28px;bottom:0;width:1px;background:#eae4e1}
.practice-timeline li:last-child{padding-bottom:0}
.progress-dot{display:grid;place-items:center;width:28px;height:28px;border:1px solid #eae4e1;background:#f3f2f1;border-radius:50%;font-size:.75rem;color:#6d4d3b;z-index:1}
.progress-dot.next{border-style:dashed;background:#fff}
.progress-dot.done{background:var(--ink);color:#fff;border-color:var(--ink)}
.practice-timeline strong{display:block;font-size:.875rem;line-height:1.5;font-weight:600}
.practice-timeline p{font-size:.75rem;line-height:1.6;color:var(--muted);margin-top:2px}
.practice-timeline .math{font-size:1rem;display:block;line-height:1.6;margin-top:4px}
.practice-timeline .progress-work{display:inline-block;font-size:1rem;line-height:1.4;padding:3px 9px;background:#f3f2f1;border-radius:4px;margin-top:4px}
.progress-guidance{font-size:.75rem;color:#705647;line-height:1.6;margin-top:18px;padding-top:13px;border-top:1px solid #f1efed}
@keyframes walkthrough-reveal{from{opacity:.6;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}

#experience .section-heading{margin-bottom:36px}
.learning-journey{position:relative;isolation:isolate}
.journey-stages{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px}
.journey-stage{min-width:0;position:relative}
.journey-art{width:100%;height:auto;max-width:270px;display:block;margin-inline:auto;overflow:visible}
.journey-art text{font-family:var(--sans);fill:var(--ink)}
.journey-art .paper-math{font-family:var(--serif);font-style:italic}
.journey-art .pencil-math{font-family:'Segoe Print','Bradley Hand',var(--serif);font-style:italic}
.journey-art .art-label{letter-spacing:.09em;fill:#786052}
.journey-art .paper-shadow{fill:#efedec;opacity:.55}
.journey-path{position:absolute;z-index:-1;width:100%;height:185px;top:17px;left:0;overflow:visible;color:#c1a697;pointer-events:none}
.journey-caption{position:relative;padding-top:18px;text-align:center}
.journey-number{width:28px;height:28px;display:grid;place-items:center;margin:0 auto 13px;border-radius:50%;background:var(--paper);border:1px solid #eae4e1;font-size:.7rem;color:#7c5b48}
.journey-caption h3{font-size:1.125rem;line-height:1.35}
.journey-caption p{max-width:300px;font-size:.875rem;line-height:1.65;margin:7px auto 0;color:var(--muted)}
.journey-example{font-size:.75rem;color:#837167;text-align:center;margin-top:26px}
.journey-reveal-ready .journey-art{opacity:0;transform:translateY(14px);transition:opacity .5s ease,transform .5s ease;transition-delay:var(--journey-delay,0ms)}
.journey-reveal-ready .journey-stage.is-visible .journey-art{opacity:1;transform:translateY(0)}
@media(max-width:1100px){.journey-stages{gap:24px}#walkthrough .demo-panel{padding-inline:17px}.hero-benefit-controls strong{font-size:.9375rem}}
@media(min-width:681px) and (max-width:900px){#walkthrough .demo-panel{min-height:477px;padding-inline:14px}#walkthrough .demo-caption{font-size:.6875rem}#walkthrough .question-equation{font-size:1.3rem}.walkthrough-working{font-size:1.0625rem}.walkthrough-paper{padding-right:10px}.missing-step{gap:6px}.missing-step small{font-size:.6875rem}.hero-benefit-controls button{gap:10px;padding-block:13px}.hero-benefit-controls .promise-number{width:24px;height:24px}.hero-benefit-controls small{font-size:.75rem}.benefit-arrow{padding-inline:0}#walkthrough .feedback-note p{font-size:.75rem}.practice-timeline li{gap:8px}}
@media(max-width:1000px){.journey-stages{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.journey-path{display:none}.journey-art{max-width:240px}.journey-caption{padding-top:3px}.journey-caption p{max-width:280px}}
@media(max-width:680px){.hero-promises.hero-benefit-controls{max-width:none;margin-top:24px}.hero-benefit-controls button{padding:13px 3px}.hero-benefit-controls strong{font-size:1rem}.hero-benefit-controls small{font-size:.8125rem}#walkthrough .demo-panel{min-height:450px;padding:18px 17px}#walkthrough .demo-tabs button{font-size:.875rem}#walkthrough .question-equation{font-size:1.5rem}.learning-journey{padding-left:17px}.learning-journey:before{content:'';position:absolute;left:13px;top:34px;bottom:70px;border-left:1px dashed #eae4e1}.journey-stages{grid-template-columns:1fr;gap:20px}.journey-stage{display:grid;grid-template-columns:minmax(150px,.9fr) minmax(0,1fr);gap:16px;align-items:center;padding-left:13px}.journey-path{display:none}.journey-art{max-width:220px}.journey-caption{text-align:left;padding-top:0;position:static}.journey-number{position:absolute;top:calc(50% - 14px);left:-17px;width:27px;height:27px;margin:0;font-size:.6875rem}.journey-caption h3{font-size:1.0625rem}.journey-caption p{font-size:.8125rem;line-height:1.65;margin:6px 0 0;max-width:none}.journey-example{margin-top:20px;padding-left:0;text-align:left}}
@media(max-width:390px){.journey-stage{grid-template-columns:145px minmax(0,1fr);gap:9px;padding-left:7px}.journey-caption h3{font-size:1rem}.journey-caption p{font-size:.75rem}.hero-benefit-controls strong{font-size:.9375rem}#walkthrough .demo-panel{padding-inline:13px}#walkthrough .demo-tabs{margin-inline:13px}#walkthrough .question-equation{font-size:1.375rem}}
@media(prefers-reduced-motion:reduce){.journey-reveal-ready .journey-art{opacity:1;transform:none;transition:none}.walkthrough-content{animation:none}}