/* Learning & Development: course listing and course pages.
   From docs/learning-development-mockup/src/ld.css. Loaded only on those pages
   when the new course pages are switched on; everything is scoped to .ld. */

.ld-page #primary.content-area { width:100% !important; max-width:none !important; float:none !important; }
.ld-page article.page, .ld-page article.course { display:block; max-width:none; margin:0 0 4rem; }
.ld { --ld-green:#006043; --ld-green-dk:#004a33; --ld-green-soft:#e8f1ec; --ld-ink:#2b2d31; --ld-muted:#5d6166; --ld-rule:#dcdedb; --ld-panel:#f3f3ef; --ld-orange:#d9531e;
  --ld-head:"Alfa Slab One",Georgia,serif; --ld-body:"Source Sans Pro","Source Sans 3",system-ui,sans-serif;
  container-type:inline-size; container-name:ld; font-family:var(--ld-body); color:var(--ld-ink); font-size:17px; line-height:1.55; max-width:1132px; margin:0 auto; padding:0 16px 64px; }
.ld *, .ld *::before, .ld *::after { box-sizing:border-box; }
.ld [hidden] { display:none !important; }
.ld a { color:var(--ld-green); }
.ld h1, .ld h2 { font-family:var(--ld-head); font-weight:400; letter-spacing:0; color:var(--ld-ink); }
.ld h1 { font-size:clamp(30px,4.4vw,44px); line-height:1.1; margin:0 0 10px; }
.ld h2 { font-size:24px; line-height:1.2; margin:0 0 14px; }
.ld h3 { font-family:var(--ld-body); font-weight:700; }
.ld__crumbs { font-size:14px; color:var(--ld-muted); margin:0 0 26px; }
.ld__crumbs a { color:var(--ld-ink); }
.ld__eyebrow { font-size:13px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ld-green); margin:0 0 6px; }
.ld__btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; background:var(--ld-green); color:#fff !important; text-decoration:none; font-weight:700; font-size:16px; padding:11px 20px; border-radius:4px; border:2px solid var(--ld-green); white-space:nowrap; }
.ld__btn:hover { background:var(--ld-green-dk); border-color:var(--ld-green-dk); }
.ld__btn--ghost { background:transparent; color:var(--ld-green) !important; }
.ld__btn--ghost:hover { background:var(--ld-green-soft); }
.ld .ld__badge--sold { background:#e4e4e1; color:#4a4c4f; }
.ld__btn--off { background:#e4e4e1; border-color:#e4e4e1; color:#5d6166 !important; cursor:not-allowed; }
.ld__btn--off:hover { background:#e4e4e1; border-color:#e4e4e1; }
.ld__row--sold .ld__what h3 a, .ld__row--sold .ld__date span { color:var(--ld-muted); }
.ld__row--sold .ld__date { border-color:#b9bdb8; }
.ld__row--sold .ld__date b { color:var(--ld-muted); }
.ld__meta .ld__badge { margin-left:8px; vertical-align:1px; }
.ld__badge { display:inline-block; font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; padding:2px 8px; border-radius:3px; background:#fde9df; color:#8a2f0b; }

/* ---------- listing ---------- */
.ld__intro { display:grid; gap:24px; align-items:start; margin-bottom:34px; }
@container ld (min-width:760px) { .ld__intro { grid-template-columns:1fr 300px; gap:48px; } }
.ld__lede { font-size:19px; max-width:38em; margin:0 0 18px; }
.ld__catalog { display:flex; gap:16px; align-items:center; background:var(--ld-panel); padding:16px; border-radius:6px; text-decoration:none; color:var(--ld-ink) !important; }
.ld__catalog img { width:76px; height:auto; box-shadow:0 1px 4px rgba(0,0,0,.18); flex:0 0 auto; }
.ld__catalog strong { display:block; font-size:16px; line-height:1.3; }
.ld__catalog span { font-size:14px; color:var(--ld-green); font-weight:700; }
.ld__filters { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px 24px; border-bottom:2px solid var(--ld-ink); padding-bottom:12px; }
.ld .ld__listhead { margin:0; font-size:24px; }
.ld__pick { display:flex; align-items:center; gap:10px; font-size:15px; font-weight:600; flex:0 1 340px; }
.ld__select { font:inherit; font-size:15px; font-weight:400; padding:7px 10px; border:1px solid #8f948e; border-radius:0; background:#fff; color:var(--ld-ink); flex:1; min-width:0; }
@container ld (max-width:620px) { .ld__pick { flex-basis:100%; } }
.ld__count { font-size:15.5px; color:var(--ld-muted); margin:16px 0 0 !important; }
.ld__count b { color:var(--ld-ink); }
.ld__month { font-family:var(--ld-body) !important; font-size:14px !important; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ld-muted) !important; margin:30px 0 4px !important; }
.ld__list { list-style:none; margin:0; padding:0; }
.ld__row { display:grid; grid-template-columns:74px 1fr; gap:6px 18px; padding:18px 0; border-bottom:1px solid var(--ld-rule); align-items:center; }
@container ld (min-width:760px) { .ld__row { grid-template-columns:78px 1fr 190px 200px; gap:24px; } }
.ld__date { text-align:center; border:2px solid var(--ld-green); border-radius:6px; padding:6px 2px 7px; line-height:1.05; align-self:start; }
.ld__date b { display:block; font-size:12px; letter-spacing:.1em; color:var(--ld-green); }
.ld__date span { display:block; font-family:var(--ld-head); font-size:18px; margin-top:3px; white-space:nowrap; }
.ld__what h3 { font-size:21px; line-height:1.25; margin:1px 0 3px; }
.ld__what h3 a { color:var(--ld-ink); text-decoration:none; }
.ld__what h3 a:hover { color:var(--ld-green); text-decoration:underline; }
.ld__track { font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ld-green); }
.ld__meta { font-size:15.5px; color:var(--ld-muted); }
.ld__price { font-size:15px; color:var(--ld-muted); grid-column:2; }
.ld__price b { color:var(--ld-ink); font-size:17px; }
.ld__acts { display:flex; gap:10px; grid-column:2; flex-wrap:wrap; }
@container ld (min-width:760px) { .ld__price, .ld__acts { grid-column:auto; } .ld__acts { justify-content:flex-end; } }
.ld__acts .ld__btn { padding:8px 16px; font-size:15px; }
.ld__empty { padding:30px 0; color:var(--ld-muted); }
.ld__more { margin-top:46px; display:grid; gap:14px; }
@container ld (min-width:760px) { .ld__more { grid-template-columns:repeat(3,1fr); gap:24px; } }
.ld__more a { display:block; background:var(--ld-panel); border-top:3px solid var(--ld-green); padding:16px 18px; text-decoration:none; color:var(--ld-ink) !important; border-radius:0 0 6px 6px; }
.ld__more strong { display:block; font-size:18px; margin-bottom:2px; }
.ld__more span { font-size:15px; color:var(--ld-muted); }

/* ---------- course page ---------- */
.ld__hero { padding-bottom:22px; margin-bottom:30px; border-bottom:1px solid var(--ld-rule); }
.ld__hero-meta { font-size:19px; color:var(--ld-muted); margin:0; }
.ld__hero-meta b { color:var(--ld-ink); font-weight:600; }
.ld__layout { display:grid; gap:34px; }
@container ld (min-width:820px) { .ld__layout { grid-template-columns:minmax(0,1fr) 320px; gap:56px; } .ld__aside { order:2; } }
.ld__card { background:var(--ld-panel); border-radius:8px; padding:22px; position:sticky; top:16px; }
.ld__card dl { margin:0 0 18px; display:grid; gap:12px; }
.ld__card dt { font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ld-muted); }
.ld__card dd { margin:1px 0 0; font-size:16.5px; line-height:1.4; }
.ld__card .ld__btn { width:100%; font-size:17px; padding:13px 20px; }
.ld__card small { display:block; font-size:14px; color:var(--ld-muted); margin-top:12px; line-height:1.45; }
.ld__toc { display:flex; flex-wrap:wrap; gap:6px 18px; font-size:15px; font-weight:600; margin:0 0 30px; padding:0; list-style:none; }
.ld__sec { margin:0 0 38px; scroll-margin-top:16px; }
.ld__sec p { margin:0 0 12px; }
.ld__sec ul { margin:0 0 12px; padding-left:20px; }
.ld__sec li { margin:0 0 6px; }
.ld__sched { width:100%; border-collapse:collapse; font-size:16.5px; }
.ld__sched th, .ld__sched td { text-align:left; padding:10px 0; border-bottom:1px solid var(--ld-rule); vertical-align:top; }
.ld__sched th { font-weight:600; padding-right:18px; }
.ld .ld__sub { font-size:18px; margin:24px 0 8px; }
.ld__glance { font-size:15.5px; color:var(--ld-muted); border-left:3px solid var(--ld-green); padding-left:12px; }
.ld__glance b { color:var(--ld-ink); }
.ld__lede2 { font-size:19px; font-weight:700; color:var(--ld-green); margin:0 0 8px !important; }
.ld__level { border-top:3px solid var(--ld-green); padding-top:10px; margin-top:20px; }
.ld__level h3 { font-size:18px; margin:0 0 12px; line-height:1.3; }
.ld__sec ol { margin:0 0 12px; padding-left:22px; }
.ld__sec ol li { margin:0 0 8px; }
.ld__note { font-size:15.5px; color:var(--ld-muted); margin-top:10px !important; }
.ld__pair { display:grid; gap:18px; }
@container ld (min-width:620px) { .ld__pair { grid-template-columns:1fr 1fr; gap:28px; } }
.ld__place { border-left:3px solid var(--ld-green); padding:2px 0 2px 16px; }
.ld__place h3 { font-size:17px; margin:0 0 4px; }
.ld__place p { font-size:16px; margin:0 0 8px; }
.ld__label { font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ld-muted); margin:0 0 4px !important; }
.ld__callout { background:var(--ld-green-soft); border-radius:6px; padding:16px 18px; font-size:16px; margin-top:16px; }
.ld__callout h3 { font-size:17px; margin:0 0 6px; }
.ld__callout p { margin:0 0 8px; }
.ld__callout code { font-family:var(--ld-body); font-weight:700; background:#fff; padding:1px 6px; border-radius:3px; }
.ld details { border-top:1px solid var(--ld-rule); }
.ld details:last-of-type { border-bottom:1px solid var(--ld-rule); }
.ld summary { cursor:pointer; font-weight:700; font-size:17px; padding:13px 0; list-style:none; display:flex; justify-content:space-between; gap:12px; }
.ld summary::-webkit-details-marker { display:none; }
.ld summary::after { content:"+"; font-size:22px; line-height:1; color:var(--ld-green); }
.ld details[open] summary::after { content:"\2212"; }
.ld details > div { padding:0 0 14px; font-size:16px; }
.ld details > div p { margin:0 0 10px; }