.learn-page { background: var(--canvas); }
.learn-hero { background: var(--paper); border-bottom: 1px solid var(--line); }
.learn-hero-layout { display: grid; grid-template-columns: 1.1fr 1fr; gap: var(--s16); align-items: end; }
.learn-hero h1 { max-width: 11ch; }
.learn-hook { margin-bottom: var(--s3); color: var(--ink); font-size: var(--text-xl); line-height: 1.35; }
.learn-index { display: flex; flex-wrap: wrap; gap: var(--s2); padding-block: var(--s8); border-bottom: 1px solid var(--line); }
.learn-index a { display: inline-flex; min-height: 44px; align-items: center; padding: var(--s2) var(--s4); border: 1px solid var(--line); border-radius: var(--pill); text-decoration: none; font-size: var(--text-sm); }
.learn-index a:hover { background: var(--paper); }
.learn-library { padding-top: var(--s8); }
.learn-topics { max-width: 980px; }
.learn-topic { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: var(--s8); padding-block: var(--s16); border-top: 1px solid var(--line); scroll-margin-top: 0; }
.learn-topic:last-child { border-bottom: 1px solid var(--line); }
.topic-number { color: var(--muted); font-size: var(--text-xs); letter-spacing: .12em; }
.learn-topic h2 { max-width: 14ch; margin-bottom: var(--s6); }
.learn-topic h3 { margin-top: var(--s8); margin-bottom: var(--s3); font-size: var(--text-2xl); }
.learn-topic p:not(.topic-number):not(.learn-hook) { max-width: 66ch; margin-top: var(--s4); color: var(--muted); font-size: var(--text-lg); line-height: 1.7; }
@media (max-width: 760px) {
  .learn-hero-layout { grid-template-columns: 1fr; gap: var(--s6); }
  .learn-hero h1 { font-size: var(--text-5xl); }
  .learn-index { gap: var(--s2); padding-block: var(--s6); }
  .learn-topic { grid-template-columns: 32px minmax(0, 1fr); gap: var(--s4); padding-block: var(--s12); }
  .learn-topic h2 { font-size: var(--text-4xl); }
  .learn-topic p:not(.topic-number):not(.learn-hook) { font-size: var(--text-base); }
}
