@media (min-width: 641px) {
  .hero-courses__aside {
    margin-top: 0;
  }
}

/* Course WYSIWYG prose (overview, parents & carers) in the design-system voice:
   display headings, muted body, lime-dot lists. */
.course-prose > :first-child { margin-top: 0; }
.course-prose h2,
.course-prose h3,
.course-prose h4 {
  font-family: var(--font-display);
  font-weight: var(--display-weight);
  color: var(--text-heading);
  letter-spacing: -0.012em;
  line-height: 1.2;
  margin: 1.6rem 0 0.6rem;
}
.course-prose h2 { font-size: 1.8rem; }
.course-prose h3 { font-size: 1.5rem; }
.course-prose h4 { font-size: 1.3rem; }
.course-prose p {
  font-size: var(--fs-min);
  color: var(--ink);
  line-height: 1.7;
  margin-bottom: 1rem;
}
.course-prose ul {
  list-style: none;
  margin: 1rem 0;
  padding: 0;
}
.course-prose ul li {
  position: relative;
  padding-left: 1.6rem;
  margin-bottom: 0.4rem;
  font-size: 1.1rem;
  color: var(--text-muted);
  line-height: 1.55;
}
.course-prose ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55rem;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--lime);
}
.course-prose a { color: var(--blue-text); font-weight: 600; }

/* Legacy WYSIWYG prose in the shared sections (default courses): a readable,
   designed panel rather than raw full-width text. The v2 structured cards are
   unaffected (they are not .course-prose). */
.learn-section > .container > .course-prose,
.entry-section > .container > .course-prose {
  max-width: 900px;
  margin: 0 auto;
  background: var(--light-grey);
  border-radius: var(--radius-xl);
  padding: 2.4rem 2.75rem;
  border-left: 4px solid var(--lime);
}
.learn-section > .container > .course-prose > :first-child,
.entry-section > .container > .course-prose > :first-child {
  margin-top: 0;
}
/* Overview + additional-info prose: readable measure, with a lead-in first line. */
#overview .course-prose,
.course-info__block .course-prose {
  max-width: 72ch;
}
#overview .course-prose > p:first-child {
  font-size: 1.45rem;
  line-height: 1.5;
  color: var(--ink);
}

/* --------------------------------------------------------------------------
 * Financial Support box — Stage 5c: moved from inline style="" in
 * parts/courses/course-fees.php. The blue background and near-white text now
 * resolve through --surface-blue and --neutral-50. Pure-white sub-elements ->
 * --text-on-dark.
 * -------------------------------------------------------------------------- */
/* Fees as a split panel: fee detail beside a distinct financial-support panel
   (on-brand navy-deep card, lime accent, matching the hero Key Info card). */
.course-fees {
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  gap: 2.5rem;
  align-items: start;
}
.course-fees__main > :first-child {
  margin-top: 0;
}
.course-fees__region {
  margin-top: 1.5rem;
}
.course-fees__support {
  background: var(--surface-dark-alt);
  color: var(--text-on-dark);
  border-top: 5px solid var(--lime);
  border-radius: var(--radius);
  padding: 1.8rem 1.6rem;
}
.course-fees__support h3 {
  color: var(--white);
  margin-top: 0;
  margin-bottom: 0.8rem;
}
.course-fees__support a {
  color: var(--accent-on-dark);
}
@media (max-width: 768px) {
  .course-fees {
    grid-template-columns: 1fr;
  }
}

/* Additional course info: legacy WYSIWYG prose blocks (course-info part). */
.course-info__block + .course-info__block {
  margin-top: 3rem;
  padding-top: 3rem;
  border-top: 1px solid rgba(var(--shadow-rgb), 0.1);
}
.course-info__block > :last-child {
  margin-bottom: 0;
}

/* Overview + Entry Requirements as a split panel (default template): overview
   content on the left, the entry-requirements card as the aside on the right. */
.course-overview {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 2.8rem;
  align-items: start;
}
.course-overview__main > :first-child { margin-top: 0; }
.course-overview__aside .entry-card { margin: 0; }
@media (max-width: 860px) {
  .course-overview { grid-template-columns: 1fr; }
}