.lesson-shell { max-width: 1120px; width: calc(100% - 48px); margin: 0 auto; padding: 30px 0 72px; }
.lesson-breadcrumb { margin-bottom: 24px; color: var(--muted); font-size: 13px; }
.lesson-breadcrumb a { text-decoration: none; }
.lesson-intro { margin-bottom: 30px; }
.lesson-intro h1 span, .lesson-card h2 span, .lesson-grid a > span { font-family: var(--hindi); }
.lesson-intro p { color: var(--muted); max-width: 680px; }
.lesson-group { margin: 35px 0; }
.lesson-grid { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; }
.lesson-grid a, .lesson-card, .lesson-image { display: block; border: 1px solid var(--line); background: var(--paper); border-radius: var(--radius); box-shadow: var(--shadow); }
.lesson-grid a { min-height: 145px; padding: 18px; text-decoration: none; color: var(--ink); }
.lesson-grid a:hover { border-color: var(--blue); }
.lesson-grid a > span { display: block; color: var(--blue); font-size: 34px; line-height: 1.3; }
.lesson-grid strong, .lesson-grid small { display: block; }
.lesson-grid small { margin-top: 5px; color: var(--muted); }
.lesson-content { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: start; }
.lesson-image { margin: 0; padding: 20px; }
.lesson-image img { width: 100%; height: auto; border-radius: 10px; }
.lesson-image figcaption { margin-top: 12px; color: var(--muted); font-size: 13px; }
.lesson-card { padding: 28px; }
.lesson-card h2 span { color: var(--blue); }
.lesson-card dl { display: grid; gap: 10px; margin: 24px 0; }
.lesson-card dl div { display: grid; grid-template-columns: 130px 1fr; border-bottom: 1px solid var(--line); padding-bottom: 8px; }
.lesson-card dt { color: var(--muted); }
.lesson-card dd { margin: 0; font-weight: 600; }
.lesson-card h3 { margin-bottom: 5px; }
.lesson-card .primary-button { margin-top: 12px; }
.lesson-pagination { display: flex; justify-content: space-between; gap: 12px; margin-top: 24px; flex-wrap: wrap; }
.lesson-pagination a { padding: 10px 16px; border: 1px solid var(--line); background: var(--paper); border-radius: 8px; text-decoration: none; }
.lesson-directory-link { margin-top: 14px; font-weight: 600; }
@media (max-width: 750px) { .lesson-content { grid-template-columns: 1fr; } .lesson-shell { width: calc(100% - 32px); } }
