.courses-page { --courses-muted: #526475; --courses-line: #dce4e9; --courses-accent: #006b67; background: #f4f7f9; overflow-wrap: anywhere; }
.courses-page .page-header { background: #edf3f6; padding: var(--space-6) 0 var(--space-8); border-bottom: 1px solid var(--courses-line); }
.courses-page .page-header h1 { color: var(--navy); font-size: clamp(1.75rem, 4vw, 2.5rem); line-height: 1.25; max-width: 24ch; margin-bottom: var(--space-4); }
.courses-page .breadcrumb, .courses-page .breadcrumb .active, .courses-page .breadcrumb li + li::before { color: var(--courses-muted); }
.courses-page .breadcrumb a { color: var(--courses-accent); }
.courses-page .breadcrumb a:hover { color: var(--navy); }
.courses-page .page-header p { max-width: 62ch; color: var(--courses-muted); font-size: .9375rem; }
.courses-page .courses-enquiry-link { display: inline-flex; align-items: center; gap: var(--space-2); min-height: 44px; color: var(--courses-accent); font-size: .875rem; font-weight: 600; }
.courses-page > section { padding: var(--space-6) 0 var(--space-10); }
.courses-services { display: flex; flex-wrap: wrap; gap: var(--space-2); padding-bottom: var(--space-5); border-bottom: 1px solid var(--courses-line); margin-bottom: var(--space-5); }
.courses-services .filter-chip { min-height: 44px; display: inline-flex; align-items: center; border-radius: var(--radius); font-size: .8125rem; background: transparent; border-color: transparent; color: var(--courses-muted); }
.courses-services .filter-chip.active { color: var(--white); background: var(--navy); border-color: var(--navy); }
.courses-services .filter-chip:hover { border-color: var(--courses-accent); }
.courses-provider-note { display: flex; gap: var(--space-3); align-items: flex-start; color: var(--courses-muted); font-size: .8125rem; margin-bottom: var(--space-8); max-width: 85ch; }
.courses-provider-note svg { color: var(--courses-accent); margin-top: 2px; }
.courses-page h2 { font-size: clamp(1.25rem, 2.5vw, 1.5rem); line-height: 1.4; }
.courses-catalogue-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-5); margin-bottom: var(--space-5); }
.courses-catalogue-heading p { color: var(--courses-muted); font-size: .875rem; max-width: 70ch; margin: var(--space-2) 0 0; }
.courses-count { color: var(--courses-muted); font-size: .8125rem; white-space: nowrap; font-variant-numeric: tabular-nums; padding-top: var(--space-2); }
.courses-search { margin-bottom: var(--space-6); max-width: 640px; }
.courses-search label { display: block; font-size: .8125rem; font-weight: 600; margin-bottom: var(--space-2); }
.courses-search > div { display: flex; gap: var(--space-3); align-items: center; }
.courses-search input { min-width: 0; font-size: .875rem; min-height: 44px; background: var(--white); border-color: #b8c8d0; }
.courses-search a { font-size: .8125rem; min-height: 44px; display: inline-flex; align-items: center; }
.courses-page .courses-button { background: var(--navy); border: 1px solid var(--navy); color: var(--white); min-height: 44px; border-radius: var(--radius); font-size: .8125rem; }
.courses-page .courses-button:hover { background: var(--navy-light); border-color: var(--navy-light); }
.courses-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); margin-bottom: var(--space-8); }
.catalogue-course { min-width: 0; display: flex; flex-direction: column; border: 1px solid var(--courses-line); border-radius: var(--radius-lg); background: var(--white); overflow: hidden; }
.catalogue-course-media { position: relative; aspect-ratio: 16/9; background: #e2eeed; display: grid; place-items: center; color: var(--courses-accent); }
.catalogue-course-media svg { width: 40px; height: 40px; }
.catalogue-course-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.catalogue-course-media img[hidden] { display: none; }
.catalogue-course-body { padding: var(--space-5); display: flex; flex-direction: column; flex: 1; }
.catalogue-course h3 { font-size: 1rem; line-height: 1.5; font-weight: 600; margin-bottom: var(--space-3); }
.courses-page .catalogue-course-details { font-size: .8125rem; color: var(--courses-accent); display: inline-flex; align-items: center; gap: var(--space-2); min-height: 44px; margin-top: auto; }
.catalogue-course-action { padding-top: var(--space-4); margin-top: var(--space-3); border-top: 1px solid var(--courses-line); }
.catalogue-course-action .btn { width: 100%; white-space: normal; }
.courses-page .courses-button-secondary { background: var(--white); color: var(--navy); border: 1px solid #b8c8d0; border-radius: var(--radius); min-height: 44px; font-size: .8125rem; }
.courses-page .courses-button-secondary:hover { background: #edf4f4; border-color: var(--courses-accent); }
.courses-empty { padding: var(--space-6); border: 1px solid var(--courses-line); border-radius: var(--radius-lg); background: var(--white); margin-bottom: var(--space-6); }
.courses-empty h3 { font-size: 1rem; margin-bottom: var(--space-2); }
.courses-empty p { color: var(--courses-muted); font-size: .875rem; }
.courses-enquiry-layout { border-top: 1px solid var(--courses-line); padding-top: var(--space-8); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); gap: var(--space-10); align-items: start; scroll-margin-top: 120px; }
.courses-enquiry-intro { max-width: 40ch; }
.courses-enquiry-intro h2 { margin-bottom: var(--space-4); }
.courses-enquiry-intro p { color: var(--courses-muted); font-size: .875rem; }
.courses-enquiry-intro a { font-size: .875rem; font-weight: 600; display: inline-flex; align-items: center; min-height: 44px; }
.courses-enquiry-form { min-width: 0; }
.courses-enquiry-form .form-section { background: var(--white); border: 1px solid var(--courses-line); border-radius: var(--radius-lg); padding: var(--space-6); box-shadow: none; margin: 0; }
.courses-enquiry-form h3 { font-size: 1.125rem; margin-bottom: var(--space-2); }
.courses-form-note { color: var(--courses-muted); font-size: .8125rem; margin-bottom: var(--space-5); }
.courses-enquiry-form .form-label { font-size: .8125rem; }
.courses-enquiry-form .form-control, .courses-enquiry-form .form-select { min-height: 44px; font-size: .875rem; border-color: #b8c8d0; }
.courses-enquiry-form .btn-primary { background: var(--navy); border-color: var(--navy); color: var(--white); min-height: 48px; font-size: .875rem; border-radius: var(--radius); }
.courses-enquiry-form .btn-primary:hover { background: var(--navy-light); }
.courses-page :focus-visible { outline: 3px solid var(--teal-dark); outline-offset: 4px; }
@media (max-width: 1000px) { .courses-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .courses-enquiry-layout { gap: var(--space-6); } }
@media (max-width: 650px) {
  .courses-page .container { padding-inline: var(--space-4); }
  .courses-grid, .courses-enquiry-layout { grid-template-columns: minmax(0, 1fr); }
  .courses-catalogue-heading { flex-direction: column; gap: var(--space-2); }
  .courses-enquiry-form .form-section { padding: var(--space-5); }
  .courses-provider-note { margin-bottom: var(--space-6); }
  .courses-search > div { gap: var(--space-2); }
}