/* Upcoming workshop and course details. Uses the shared Emotiv course styles. */
.course-priorizar .course-detail-hero .display { max-width: 21ch; }
.course-event-note { max-width: 720px; margin: 1.25rem auto 0; color: #78677f; font-size: .9rem; line-height: 1.6; text-align: center; }
.course-event-section { padding-top: 0; }
.course-event-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: center; gap: clamp(2rem, 5vw, 4rem); }
.course-event-poster { margin: 0; }
.course-event-poster img, .course-upcoming-poster img { display: block; width: 100%; height: auto; border-radius: var(--radius); }
.course-event-grid .course-detail-copy h2 { margin-top: .75rem; }
.course-event-grid .course-detail-copy a { color: var(--brand); text-underline-offset: .2em; }
.course-tool-preview { text-align: center; border: 1px solid var(--line-strong); border-radius: var(--radius-lg); padding: clamp(1.6rem, 4vw, 3rem); background: var(--tint); }
.course-tool-preview .eyebrow { margin-top: 1.25rem; }
.course-tool-preview h2 { font-size: clamp(1.8rem, 3.5vw, 2.7rem); }
.course-tool-preview p:not(.eyebrow) { color: #4e3c56; line-height: 1.7; max-width: 660px; margin: 1.1rem auto 0; }
.course-status { display: inline-block; border-radius: 999px; padding: .45em .9em; background: var(--brand); color: #fff; font-size: .8rem; font-weight: 700; }
.course-tool-outcomes { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: .65rem; margin-top: 1.5rem; padding: 0; }
.course-tool-outcomes li { padding: .65rem .9rem; border: 1px solid var(--line-strong); border-radius: var(--radius); background: #fff; color: var(--brand); font-size: .9rem; }
.course-upcoming-card { display: grid; grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr); gap: clamp(1.8rem, 4vw, 3.5rem); align-items: center; border: 1px solid var(--line-strong); border-radius: var(--radius-lg); background: var(--tint); padding: clamp(1.25rem, 3vw, 2.5rem); }
.course-upcoming-copy h2 { margin-top: .65rem; font-size: clamp(1.8rem, 3.3vw, 2.7rem); line-height: 1.12; }
.course-upcoming-copy p:not(.eyebrow) { margin-top: 1rem; color: #4e3c56; line-height: 1.6; }
.course-upcoming-copy .course-upcoming-subtitle { color: var(--mauve); font-size: 1.2rem; font-weight: 700; }
.course-upcoming-copy .course-upcoming-date { color: var(--brand); font-weight: 700; }
.course-upcoming-copy .btn { margin-top: 1.4rem; }
#contenidos, #herramienta { scroll-margin-top: 100px; }
@media (max-width: 720px) {
  .course-event-grid, .course-upcoming-card { grid-template-columns: 1fr; }
  .course-event-poster { max-width: 500px; margin-inline: auto; }
  .course-upcoming-poster { max-width: 360px; margin-inline: auto; }
  .course-upcoming-copy .btn { width: 100%; justify-content: center; }
  .course-tool-preview { width: calc(100% - 2.5rem); }
}

/* Keep both workshop actions centered and equally sized. */
.course-tool-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; max-width: 760px; margin: 24px auto 0; }
.course-tool-actions .btn { width: 100%; min-width: 0; justify-content: center; white-space: normal; text-align: center; }
@media (max-width: 720px) {
  .course-tool-actions { grid-template-columns: minmax(0, 1fr); max-width: 420px; }
}