.workbuddy-course {
  font-family: var(--sans, system-ui), sans-serif;
  font-synthesis: none;
}

.workbuddy-course h1,
.workbuddy-course h2 {
  font-family: var(--serif, Georgia), serif;
}

.course-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: clamp(28px, 7vw, 100px);
}

.course-icon {
  width: clamp(150px, 20vw, 260px);
  height: auto;
  margin-inline: clamp(0px, 5vw, 70px);
}

.course-label {
  margin-bottom: 12px;
  color: #0b7465;
  font-size: 14px;
  font-weight: 600;
}

.course-syllabus {
  display: grid;
  grid-template-columns: minmax(175px, 1fr) minmax(0, 3.25fr);
  gap: clamp(32px, 6vw, 80px);
  align-items: start;
}

.course-outline {
  position: sticky;
  top: 115px;
  display: grid;
  border-bottom: 1px solid #d5d9d5;
}

.course-outline a {
  display: block;
  padding: 13px 0;
  border-top: 1px solid #d5d9d5;
  font-size: 15px;
  font-weight: 600;
}

.course-outline small {
  display: block;
  color: #0b7465;
  font-size: 12px;
}

.course-day {
  padding: 26px 0 34px;
  border-top: 1px solid #d5d9d5;
}

.training-page .course-day h3 {
  margin-bottom: 14px;
  font-size: clamp(22px, 2.4vw, 34px);
  font-weight: 750;
}

.course-day > p:not(.course-label),
.course-topics dd {
  color: #44534f;
}

.course-topics {
  margin: 20px 0;
}

.course-topics > div {
  padding: 13px 0;
}

.course-topics dt {
  margin-bottom: 4px;
  font-weight: 700;
}

.course-topics dd {
  margin: 0;
  max-width: 68ch;
}

.course-topics a {
  display: block;
  margin-top: 5px;
  text-decoration: underline;
}

.course-output {
  padding: 15px 18px;
  background: #e5ece7;
  border-inline-start: 3px solid #0b7465;
}

.course-output strong {
  display: block;
  color: #0b7465;
}

@media (max-width: 700px) {
  .training-page .workbuddy-course .training-hero {
    padding: 28px 0;
  }

  .course-intro {
    display: block;
  }

  .course-icon {
    width: 108px;
    margin: 24px 0 0;
  }

  .course-syllabus {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .course-outline {
    position: static;
  }
}
