<Card title="Introduction to Web Development" subtitle="Instructor: Sarah Chen">
<Columns>
<Stat label="Overall Progress" value="62%" icon="chart-line" />
<Stat label="Average Rating" value="4.8 ★" note="from 342 learners" icon="star" />
</Columns>

<Progress value="62" max="100" label="Course completion" tone="info" />
</Card>

<Card title="Modules">
<Steps>
<Step title="1. HTML Fundamentals" status="done" subtitle="Completed 3 weeks ago">
<Badge tone="success">Complete</Badge>
</Step>
<Step title="2. CSS Styling" status="done" subtitle="Completed 2 weeks ago">
<Badge tone="success">Complete</Badge>
</Step>
<Step title="3. JavaScript Basics" status="current" subtitle="3 of 8 lessons done">
<Badge tone="info">In Progress</Badge>
<Callout tone="info" title="Next lesson: Variables & Data Types">
Continue where you left off — Lesson 3.4
</Callout>
</Step>
<Step title="4. Responsive Design" status="todo" subtitle="Not started">
<Badge tone="neutral">Locked</Badge>
</Step>
<Step title="5. Final Project" status="todo" subtitle="Requires all prior modules">
<Badge tone="neutral">Locked</Badge>
</Step>
</Steps>
</Card>

<Card title="Continue Learning">
<Callout tone="success" title="Jump back in">
You're on <strong>Lesson 3.4: Variables & Data Types</strong> in the JavaScript Basics module.
</Callout>
<Button variant="primary" size="large" ask="Resume lesson 3.4: Variables & Data Types">Resume Lesson</Button>
<Button variant="secondary" ask="Show me all lessons in JavaScript Basics">View Module Details</Button>
</Card>

<FollowUps>
- What topics are covered in the next lesson?
- How long is the JavaScript Basics module?
- Show my quiz scores so far
- Recommend a study schedule to finish the course
</FollowUps>