/* Study section: course index and per-course lecture notes. */
.study-hero { padding: 96px 0 62px; border-bottom: 1px solid var(--line); }
.study-hero h1 { font: 500 clamp(3.4rem, 7vw, 6.4rem)/.94 var(--serif); letter-spacing: -.05em; margin: 20px 0 28px; max-width: 1000px; }
.study-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; padding: 70px 0 60px; }
.study-card { border: 1px solid var(--ink); padding: 28px; min-height: 340px; display: flex; flex-direction: column; color: inherit; text-decoration: none; background: var(--tone, #fff); transition: transform .18s ease, box-shadow .18s ease; }
.study-card:hover { transform: translateY(-4px); box-shadow: 7px 7px 0 var(--ink); }
.study-card span { font-size: .68rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.study-card h2 { font: 500 2.2rem/1.02 var(--serif); letter-spacing: -.03em; margin: 40px 0 16px; }
.study-card p { color: var(--muted); margin: 0; }
.study-card b { margin-top: auto; padding-top: 24px; font-size: .82rem; }
.study-about { padding: 0 0 110px; color: var(--muted); font-size: .9rem; max-width: 780px; }
.study-about a { color: inherit; }

.study-page { padding-bottom: 110px; }
.study-hero-tinted { background: var(--tone, transparent); }
.study-layout { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 70px; padding: 64px 0 0; align-items: start; }
.study-side { position: sticky; top: 24px; font-size: .84rem; }
.study-facts { margin: 0 0 32px; padding: 0 0 24px; border-bottom: 1px solid var(--line); }
.study-facts dt { font-size: .68rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-top: 14px; }
.study-facts dd { margin: 4px 0 0; }
.study-facts a { color: inherit; font-weight: 700; }
.study-jump ol { list-style: none; padding: 0; margin: 12px 0 0; max-height: calc(100vh - 360px); overflow: auto; }
.study-jump li { border-top: 1px solid var(--line); }
.study-jump li:last-child { border-bottom: 1px solid var(--line); }
.study-jump a { display: block; padding: 8px 0; color: inherit; text-decoration: none; line-height: 1.35; }
.study-jump a:hover { text-decoration: underline; }

.study-body { max-width: 780px; margin: 0; }
.study-body .study-disclaimer { border-left: 5px solid var(--ink); background: #fff; padding: 16px 20px; margin: 0 0 40px; font-size: .88rem; color: var(--muted); }
.study-body h2 { font: 500 2.6rem/1.05 var(--serif); letter-spacing: -.03em; margin: 2.2em 0 .55em; }
.study-body h2:first-of-type { margin-top: 0; }
.study-body h3 { font: 500 1.7rem/1.15 var(--serif); letter-spacing: -.02em; margin: 2.4em 0 .5em; padding-top: 1.2em; border-top: 1px solid var(--line); scroll-margin-top: 24px; }
.study-body h3 + p { margin-top: 0; }
.study-body p, .study-body li { font-size: 1.03rem; }
.study-body ul, .study-body ol { padding-left: 1.4em; }
.study-body li { margin: .35em 0; }
.study-body code { font-size: .88em; background: #e9e6de; padding: .1em .35em; border-radius: 3px; }
.study-body pre { overflow: auto; padding: 20px; background: #1c1d1b; color: #eef0e9; font-size: .83rem; line-height: 1.5; }
.study-body pre code { background: none; padding: 0; color: inherit; font-size: inherit; }
.study-body table { width: 100%; border-collapse: collapse; margin: 28px 0; font-size: .9rem; display: block; overflow-x: auto; }
.study-body th, .study-body td { border: 1px solid var(--line); padding: 10px 12px; text-align: left; vertical-align: top; }
.study-body th { background: #e7e4dc; }
.study-body .math-display { overflow-x: auto; overflow-y: hidden; margin: 18px 0; padding: 4px 0; }
.study-body .katex { font-size: 1.05em; }
.study-body .katex-display { margin: 0; }
.study-body a { color: inherit; }
.study-body .back { margin-top: 56px; }

@media (max-width: 900px) {
  .study-layout { grid-template-columns: 1fr; gap: 28px; }
  .study-side { position: static; }
  .study-jump ol { max-height: none; columns: 2; column-gap: 24px; }
  .study-jump li { break-inside: avoid; }
}
@media (max-width: 760px) {
  .study-grid { grid-template-columns: 1fr; }
  .study-card { min-height: 260px; }
  .study-hero { padding-top: 64px; }
  .study-jump ol { columns: 1; }
  .study-body h2 { font-size: 2.1rem; }
}