.msc-whats-on-private {
    --msc-whats-on-ink: var(--msc-navy, #071734);
    --msc-whats-on-muted: var(--msc-muted, #607086);
    --msc-whats-on-teal: var(--msc-teal, #21b8b0);
    --msc-whats-on-cyan: var(--msc-cyan, #33d8e8);
    color: var(--msc-whats-on-ink);
    box-sizing: border-box;
    margin: 0;
    overflow: hidden;
    width: 100%;
}

.msc-whats-on-private__intro { padding: .25rem 0; }

.msc-whats-on-private__notice { color: var(--msc-whats-on-muted); font-size: .78rem; margin: 0 0 1rem; }
.msc-whats-on-private__intro { align-items: baseline; display: flex; gap: 1rem; justify-content: space-between; margin-bottom: 1.25rem; }
.msc-whats-on-private__title { font-size: clamp(1.7rem, 3vw, 2.35rem); letter-spacing: -.04em; line-height: 1; margin: 0; }
.msc-whats-on-private__title span { color: var(--msc-whats-on-teal); font-size: .65em; }
.msc-whats-on-private__copy { color: var(--msc-whats-on-muted); margin: 0; max-width: 42rem; }
.msc-whats-on-private__view-all { align-items: center; color: var(--msc-whats-on-teal); display: inline-flex; font-size: .92rem; font-weight: 800; gap: .3rem; text-decoration: none; white-space: nowrap; }
.msc-whats-on-private__view-all span { margin-left: .1rem; }
.msc-whats-on-private__view-all:focus-visible, .msc-whats-on-private__callout-cta:focus-visible, .msc-whats-on-private__pill:focus-visible, .msc-whats-on-private__arrow:focus-visible, .msc-whats-on-card__cta:focus-visible { outline: 3px solid var(--msc-whats-on-cyan); outline-offset: 3px; }
.msc-whats-on-private__rows { display: grid; gap: 1.2rem; min-width: 0; overflow: hidden; }
.msc-whats-on-private__row { min-width: 0; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; scroll-snap-type: x mandatory; }
.msc-whats-on-private__row::-webkit-scrollbar { display: none; }
.msc-whats-on-private__row-track { display: flex; gap: 1rem; min-width: max-content; padding: 0 .1rem .5rem; }
.msc-whats-on-private__slide { align-self: flex-start; box-sizing: border-box; flex: 0 0 calc((100vw - 4rem) / 3); max-width: 21rem; min-width: 0; scroll-snap-align: start; }
.msc-whats-on-card { background: rgba(255,255,255,.9); border: 1px solid rgba(33,184,176,.18); border-radius: 1.15rem; box-sizing: border-box; display: flex; flex-direction: column; height: 100%; min-height: 25rem; min-width: 0; overflow: hidden; box-shadow: 0 12px 30px rgba(7,23,52,.1); }
.msc-whats-on-card__image-wrap { aspect-ratio: 16 / 8.5; background: #dceef2; overflow: hidden; }
.msc-whats-on-card__image { display: block; height: 100%; object-fit: cover; transition: filter .28s ease, transform .28s ease; width: 100%; }
.msc-whats-on-card:hover .msc-whats-on-card__image, .msc-whats-on-card:focus-within .msc-whats-on-card__image { filter: saturate(1.08) brightness(1.04); transform: scale(1.03); }
@media (prefers-reduced-motion: reduce) { .msc-whats-on-card__image { transition: none; } .msc-whats-on-card:hover .msc-whats-on-card__image, .msc-whats-on-card:focus-within .msc-whats-on-card__image { transform: none; } }
.msc-whats-on-card__body { display: flex; flex: 1; flex-direction: column; gap: .38rem; min-width: 0; padding: .85rem .9rem .9rem; }
.msc-whats-on-card__badges { align-items: center; display: flex; flex-wrap: wrap; gap: .35rem; }
.msc-whats-on-card__badge { align-self: flex-start; border-radius: 999px; color: #fff; font-size: .67rem; font-weight: 900; letter-spacing: .04em; margin: -.1rem 0 .1rem; padding: .35rem .55rem; text-transform: uppercase; }
.msc-whats-on-card__badge--status { background: #f97316; }.msc-whats-on-card__badge--type { background: var(--msc-whats-on-ink); }
.msc-whats-on-card__badge--closing-soon { background: #c2410c; }.msc-whats-on-card__badge--coming-soon { background: #2f6fd6; }
.msc-whats-on-card__badge--trials { background: #1769d1; }.msc-whats-on-card__badge--holiday-programs { background: #25a64a; }.msc-whats-on-card__badge--registrations { background: #7139c6; }.msc-whats-on-card__badge--camps-clinics { background: #008b9a; }.msc-whats-on-card__badge--competitions { background: #db7b16; }.msc-whats-on-card__badge--waitlists { background: #7139c6; }.msc-whats-on-card__badge--opportunities { background: var(--msc-whats-on-ink); }
.msc-whats-on-card__title { display: -webkit-box; font-size: 1.12rem; line-height: 1.2; margin: 0; max-height: 2.4em; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.msc-whats-on-card__organisation, .msc-whats-on-card__context, .msc-whats-on-card__fact, .msc-whats-on-card__summary, .msc-whats-on-card__verified { color: var(--msc-whats-on-muted); margin: 0; }
.msc-whats-on-card__organisation { display: block; font-size: .86rem; font-weight: 800; line-height: 1.25; max-height: 1.25em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.msc-whats-on-card__context { font-size: .78rem; font-weight: 700; line-height: 1.25; }
.msc-whats-on-card__facts { color: var(--msc-whats-on-ink); display: grid; gap: .28rem; list-style: none; margin: .2rem 0 0; padding: 0; }
.msc-whats-on-card__facts li { display: -webkit-box; font-size: .78rem; line-height: 1.3; max-height: 2.6em; overflow: hidden; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.msc-whats-on-card__facts li::before { color: var(--msc-whats-on-teal); content: '\2022'; font-weight: 900; margin-right: .35rem; }
.msc-whats-on-card__status { color: #168445; font-size: .78rem; font-weight: 800; margin: .25rem 0 0; }.msc-whats-on-card__status span { margin-right: .3rem; }
.msc-whats-on-card__verified { font-size: .75rem; }
.msc-whats-on-card__cta { align-items: center; align-self: flex-start; color: var(--msc-whats-on-teal); display: inline-flex; font-size: .82rem; font-weight: 800; gap: .3rem; margin-top: auto; padding-top: .35rem; text-decoration: none; }
.msc-whats-on-private__grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); }.msc-whats-on-private__heading { margin: 0 0 1rem; }.msc-whats-on-private__detail { margin: 2rem 0; }

@media (max-width: 900px) { .msc-whats-on-private__slide { flex-basis: min(42vw, 20rem); } }
@media (max-width: 620px) {
    .msc-whats-on-private__intro { align-items: baseline; }
    .msc-whats-on-private__copy { font-size: .86rem; }
    .msc-whats-on-private__slide { flex-basis: min(78vw, 19rem); }
    .msc-whats-on-card__body { padding: .75rem .78rem .8rem; }
}

/* UI-CONSISTENCY-01: semantic badge treatment shared with Find Programs. */
.msc-whats-on-card__badge { min-height: 24px; display: inline-flex; align-items: center; border-radius: 999px; padding: .25rem .55rem; font-weight: 900; }
.msc-whats-on-card__badge--coming-soon { background: #2f6fd6; color: #fff; }
.msc-whats-on-card__badge--open-now { background: #f97316; color: #fff; }

/* Opportunity UX V2: compact mobile presentation without changing the
 * shared opportunity data or ordering rules. */
@media (max-width: 620px) {
    .msc-whats-on-private__intro { gap: .55rem; margin-bottom: .7rem; }
    .msc-whats-on-private__title { font-size: 1.45rem; }
    .msc-whats-on-private__copy { display: -webkit-box; line-height: 1.35; margin-top: .25rem; max-width: none; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
    .msc-whats-on-private__slide { flex-basis: min(76vw, 18rem); }
    .msc-whats-on-card { height: 28rem; min-height: 28rem; }
    .msc-whats-on-card__image-wrap { flex: 0 0 9rem; height: 9rem; }
    .msc-whats-on-card__body { min-height: 0; }
    .msc-whats-on-card__organisation { min-height: 1.25em; }
    .msc-whats-on-card__facts { min-height: 3.9em; }
    .msc-whats-on-card__title { font-size: 1rem; }
    .msc-whats-on-card__facts { gap: .18rem; }
}
