/* Master classes page (builds on listing-ui.css): the week's live sessions, a day filter, a moving strip of technologies, how it works and FAQ. */
.mc .lx-hero__grid {
    align-items: center;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
}

.mc .lx-hero--solo .lx-hero__grid {
    grid-template-columns: minmax(0, 1fr);
}

/* hero: headline, one call to action, plain numbers (as on the home page) */
.mc-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px 24px;
    margin-top: 26px;
}

.mc-cta {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    min-height: 52px;
    padding: 0 28px 0 7px;
    border-radius: 999px;
    background: linear-gradient(135deg, #06b6d4, #3b82f6);
    color: #fff !important;
    font-size: .9375rem;
    font-weight: 700;
    box-shadow: 0 16px 28px -14px rgba(8, 145, 178, .85);
    transition: transform .25s cubic-bezier(.2, .7, .2, 1), box-shadow .25s;
}

    .mc-cta:hover {
        transform: translateY(-2px);
        box-shadow: 0 22px 34px -14px rgba(37, 99, 235, .85);
    }

.mc-cta__ic {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .22);
    font-size: 1.05rem;
    transition: transform .3s;
}

.mc-cta:hover .mc-cta__ic {
    transform: rotate(45deg);
}

.mc-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--lx-ink);
    font-weight: 700;
}

    .mc-link i {
        transition: transform .25s;
    }

    .mc-link:hover {
        color: var(--lx-a);
    }

        .mc-link:hover i {
            transform: translateX(4px);
        }

.mc-nums {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px 18px;
    margin: 30px 0 0;
    padding: 22px 0 0;
    border-top: 1px solid var(--lx-line);
}

    .mc-nums li {
        display: grid;
        gap: 2px;
    }

    .mc-nums i {
        color: var(--lx-a);
        font-size: 1.05rem;
    }

    .mc-nums b {
        font-size: 1.45rem;
        line-height: 1.15;
        font-weight: 800;
        letter-spacing: -.02em;
        color: var(--lx-ink);
        font-variant-numeric: tabular-nums;
    }

    .mc-nums span {
        font-size: .8125rem;
        line-height: 1.35;
        color: var(--lx-muted);
    }

/* the people who teach: three portraits on stage, the others wait and swap in */
.mc-faces {
    position: relative;
    width: min(100%, 540px);
    height: clamp(340px, 33vw, 420px);
    margin-inline: auto;
}

.mc-face {
    --x: 0%;
    --r: 0deg;
    --s: 1;
    --o: 0;
    position: absolute;
    top: 10px;
    left: 50%;
    width: min(44%, 230px);
    aspect-ratio: 4 / 5;
    overflow: hidden;
    border: 1px solid var(--lx-line);
    border-radius: 24px;
    background: var(--lx-card);
    box-shadow: 0 30px 50px -30px rgba(8, 145, 178, .55), var(--lx-shadow);
    color: #fff;
    opacity: var(--o);
    transform: translateX(calc(-50% + var(--x))) rotate(var(--r)) scale(var(--s));
    transition: transform .8s cubic-bezier(.2, .7, .2, 1), opacity .6s ease, box-shadow .4s;
    pointer-events: none;
}

.mc-face[data-p="0"] { --o: 1; --s: 1.05; z-index: 3; pointer-events: auto; box-shadow: 0 40px 60px -28px rgba(8, 145, 178, .7), var(--lx-shadow-hover); }
.mc-face[data-p="-1"] { --x: -80%; --r: -6deg; --s: .93; --o: 1; z-index: 2; pointer-events: auto; }
.mc-face[data-p="1"] { --x: 80%; --r: 6deg; --s: .93; --o: 1; z-index: 2; pointer-events: auto; }
.mc-face[data-p="-2"] { --x: -134%; --r: -11deg; --s: .8; }
.mc-face[data-p="2"] { --x: 134%; --r: 11deg; --s: .8; }

.mc-face:hover { box-shadow: var(--lx-shadow-hover); }

.mc-face img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
}

.mc-face__cap {
    position: absolute;
    inset: auto 0 0 0;
    padding: 38px 14px 14px;
    background: linear-gradient(180deg, transparent, rgba(2, 11, 22, .85));
}

    .mc-face__cap b {
        display: block;
        font-size: .9375rem;
        font-weight: 800;
    }

    .mc-face__cap small {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        margin-top: 2px;
        font-size: .75rem;
        line-height: 1.3;
        color: rgba(255, 255, 255, .8);
    }

.mc-badge {
    position: absolute;
    right: 8%;
    bottom: -14px;
    z-index: 4;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border: 1px solid var(--lx-line);
    border-radius: 16px;
    background: var(--lx-card);
    box-shadow: var(--lx-shadow-hover);
}

    .mc-badge i {
        display: grid;
        place-items: center;
        width: 40px;
        height: 40px;
        border-radius: 12px;
        background: var(--lx-soft);
        color: var(--lx-a);
        font-size: 1.15rem;
    }

    .mc-badge b {
        display: block;
        font-size: .9375rem;
        font-weight: 800;
        color: var(--lx-ink);
    }

    .mc-badge small {
        display: block;
        font-size: .75rem;
        color: var(--lx-muted);
    }

/* tools and tech: reuses the alumni strip (home-alumni.css); only the logo + name pairing and the longer title are ours */
/*.mc-tech {
    padding-top: clamp(26px, 4vw, 44px);
}*/

    .mc-tech .al-title {
        max-width: 300px;
        white-space: normal;
        line-height: 1.35;
    }

    .mc-tech .al-set li {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        color: var(--al-ink);
        font-size: .9rem;
        font-weight: 700;
    }

[data-bs-theme="dark"] .mc-tech .al-set li {
    background: none;
    box-shadow: none;
}

.mc-tech .al-set li img {
    width: 28px;
    height: 28px;
    object-fit: contain;
}

/* day filter and session cards */
.mc-days {
    margin-bottom: 26px;
    overflow: visible;
    flex-wrap: wrap;
    mask-image: none;
    -webkit-mask-image: none;
    padding-right: 0;
}

    .mc-days .lx-pill {
        height: 52px;
        border-radius: 14px;
    }

.mc-day {
    display: grid;
    text-align: left;
    line-height: 1.15;
}

    .mc-day b {
        font-size: .6875rem;
        letter-spacing: .06em;
        text-transform: uppercase;
        color: var(--lx-muted);
    }

.mc-days .lx-pill.on .mc-day b {
    color: rgba(255, 255, 255, .85);
}

.mc-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
}

    .mc-grid[data-n="1"] {
        grid-template-columns: minmax(0, 420px);
    }

    .mc-grid[data-n="2"] {
        grid-template-columns: repeat(2, minmax(0, 420px));
    }

.mc-grid {
    gap: 28px;
}

.mc-card {
    padding: 12px;
    border-radius: 22px;
    transition: transform .35s cubic-bezier(.2, .7, .2, 1), box-shadow .35s, border-color .35s;
}

    .mc-card:hover {
        transform: translateY(-5px);
        border-color: rgba(var(--lx-glow), .45);
        box-shadow: var(--lx-shadow-hover);
    }

    .mc-card .lx-ev__img {
        overflow: hidden;
        border-radius: 14px;
    }

        .mc-card .lx-ev__img img {
            transition: transform .6s cubic-bezier(.2, .7, .2, 1);
        }

    .mc-card:hover .lx-ev__img img {
        transform: scale(1.04);
    }

    .mc-card .lx-card__body {
        gap: 16px;
        padding: 18px 8px 8px;
    }

    .mc-card .lx-name {
        font-size: 1.05rem;
    }

        .mc-card .lx-name a {
            display: -webkit-box;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }

.mc-when {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    font-size: .8125rem;
    font-weight: 700;
    color: var(--lx-body);
}

    .mc-when span:not(.mc-done) {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 5px 11px;
        border-radius: 999px;
        background: var(--lx-soft);
    }

    .mc-when i {
        color: var(--lx-a);
    }

.mc-done {
    margin-left: auto;
    padding: 2px 10px;
    border-radius: 999px;
    background: rgba(5, 150, 105, .12);
    color: var(--lx-ok);
    font-size: .75rem;
}

.mc-by {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-top: 14px;
    border-top: 1px dashed var(--lx-line);
    font-size: .875rem;
    font-weight: 600;
    color: var(--lx-body);
}

    .mc-by img, .mc-by .lx-speaker__i {
        flex: none;
        width: 28px;
        height: 28px;
        border-radius: 50%;
        object-fit: cover;
        font-size: .8125rem;
        border: 0;
    }

.mc-start {
    margin-left: auto;
    font-style: normal;
    font-size: .8125rem;
    font-weight: 800;
    color: var(--lx-warm);
}

    .mc-start.is-live {
        color: #ef4444;
    }

.mc-learn {
    position: relative;
    z-index: 3;
}

    .mc-learn summary {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        cursor: pointer;
        list-style: none;
        color: var(--lx-a);
        font-size: .875rem;
        font-weight: 800;
    }

        .mc-learn summary::-webkit-details-marker {
            display: none;
        }

        .mc-learn summary::after {
            content: "\F282";
            font-family: "bootstrap-icons";
            font-size: .75rem;
            transition: transform .25s;
        }

    .mc-learn[open] summary::after {
        transform: rotate(180deg);
    }

    .mc-learn ul {
        display: grid;
        gap: 8px;
        margin: 12px 0 2px;
        padding: 0;
        list-style: none;
        animation: mc-pop .35s cubic-bezier(.2, .7, .2, 1) both;
    }

    .mc-learn li {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        font-size: .84rem;
        line-height: 1.5;
        color: var(--lx-body);
    }

        .mc-learn li i {
            flex: none;
            margin-top: 2px;
            color: var(--lx-ok);
        }@keyframes mc-pop {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
}

.mc-card .lx-ev__act {
    padding-top: 4px;
}

    .mc-card .lx-ev__act .lx-btn:first-child {
        flex: 1 1 auto;
    }

.mc-card--past .lx-card__foot {
    padding-top: 2px;
}

.mc-none {
    padding: 56px 16px;
}

    .mc-none > i {
        display: grid;
        place-items: center;
        width: 64px;
        height: 64px;
        border-radius: 16px;
        background: linear-gradient(135deg, rgba(6, 182, 212, .16), rgba(59, 130, 246, .16));
        color: var(--lx-a);
        font-size: 1.9rem;
    }

    .mc-none p {
        max-width: 46ch;
    }

@media (max-width: 1099.98px) {
    .mc-grid, .mc-grid[data-n="2"] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .mc .lx-hero__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .mc-nums {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .mc-tech {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 679.98px) {
    .mc-grid, .mc-grid[data-n="1"], .mc-grid[data-n="2"] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 575.98px) {
    .mc-days {
        flex-wrap: nowrap;
        overflow-x: auto;
        margin-inline: -16px;
        padding: 2px 16px;
        scrollbar-width: none;
    }

        .mc-days::-webkit-scrollbar {
            display: none;
        }

    .mc-card .lx-card__body {
        padding: 16px 6px 6px;
    }

    .mc-faces { height: 300px; }

    .mc-face {
        width: 46%;
        border-radius: 18px;
    }

    .mc-face[data-p="-1"] { --x: -68%; }
    .mc-face[data-p="1"] { --x: 68%; }

    .mc-badge {
        right: 4px;
        padding: 10px 12px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mc-learn ul {
        animation: none;
    }
}

/* depth: floating chips and a live dot */
.mc-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #ef4444;
    box-shadow: 0 0 0 0 rgba(239, 68, 68, .6);
    animation: mc-pulse 1.8s infinite;
}@keyframes mc-pulse {
    70% {
        box-shadow: 0 0 0 9px rgba(239, 68, 68, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(239, 68, 68, 0);
    }
}

.mc-chip {
    position: absolute;
    z-index: 4;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 14px;
    border: 1px solid var(--lx-line);
    border-radius: 999px;
    background: var(--lx-card);
    box-shadow: var(--lx-shadow-hover);
    font-size: .8125rem;
    font-weight: 800;
    color: var(--lx-ink);
    animation: mc-float 6s ease-in-out infinite;
}

    .mc-chip i {
        color: var(--lx-a);
    }

.mc-chip--a {
    top: 6px;
    right: 4%;
}

.mc-chip--b {
    top: 2px;
    left: 3%;
    animation-delay: -3s;
}@keyframes mc-float {
    50% {
        transform: translateY(-9px);
    }
}

@media (max-width: 575.98px) {
    .mc-chip--b {
        display: none;
    }

    .mc-chip--a {
        right: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mc-chip, .mc-dot {
        animation: none;
    }
}

/* the page keeps the site's own background: no tinted bands, no tinted hero */
.mc { background: transparent; }
.mc .lx-sec--tint { background: transparent; }

/* find your path: animated tabs on the left, the matching session details on the right */
.mc-trk { display: grid; grid-template-columns: minmax(0, 320px) minmax(0, 1fr); gap: 20px; }
.mc-trk__tabs { position: relative; display: grid; grid-auto-rows: 1fr; gap: 8px; padding: 8px; border: 1px solid var(--lx-line); border-radius: 18px; background: var(--lx-card); box-shadow: var(--lx-shadow); }
.mc-trk__bar { position: absolute; z-index: 0; left: 8px; right: 8px; top: 0; height: 0; border-radius: 12px; background: linear-gradient(135deg, #0891b2, #2563eb); box-shadow: 0 12px 22px -12px rgba(8, 145, 178, .8); transition: transform .4s cubic-bezier(.2, .7, .2, 1), height .4s cubic-bezier(.2, .7, .2, 1), width .4s; }
.mc-trk__tab { position: relative; z-index: 1; display: flex; align-items: center; gap: 14px; padding: 14px; border: 0; border-radius: 12px; background: none; color: var(--lx-ink); font: inherit; text-align: left; cursor: pointer; transition: color .3s, background-color .3s; }
.mc-trk__tab i { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 12px; background: var(--lx-soft); color: var(--lx-a); font-size: 1.2rem; transition: background-color .3s, color .3s; }
.mc-trk__tab b { display: block; font-size: .9375rem; font-weight: 800; }
.mc-trk__tab small { display: block; font-size: .75rem; font-weight: 600; color: var(--lx-muted); transition: color .3s; }
.mc-trk__tab:hover:not(.on) { background: var(--lx-soft); }
.mc-trk__tab.on { color: #fff; }
.mc-trk__tab.on i { background: rgba(255, 255, 255, .2); color: #fff; }
.mc-trk__tab.on small { color: rgba(255, 255, 255, .85); }
.mc-trk__tab:focus-visible { outline: 2px solid var(--lx-a); outline-offset: 2px; }
.mc-trk__panels { min-width: 0; }
.mc-trk__panel { height: 100%; padding: clamp(20px, 3vw, 32px); border: 1px solid var(--lx-line); border-radius: 18px; background: linear-gradient(160deg, rgba(var(--lx-glow), .08), transparent 55%), var(--lx-card); box-shadow: var(--lx-shadow); }
.mc-trk__panel:not([hidden]) { animation: mc-pop .45s cubic-bezier(.2, .7, .2, 1) both; }
.mc-trk__panel h3 { margin: 0 0 20px; font-size: clamp(1.2rem, 2.2vw, 1.6rem); font-weight: 800; letter-spacing: -.01em; color: var(--lx-ink); }
.mc-trk__h { margin: 0 0 10px; font-size: .75rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--lx-muted); }
.mc-trk__learn, .mc-trk__free ul { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.mc-trk__learn li { display: flex; gap: 10px; font-size: .9375rem; line-height: 1.5; color: var(--lx-body); }
.mc-trk__learn i { flex: none; margin-top: 2px; color: var(--lx-ok); }
.mc-trk__free { margin-top: 22px; padding-top: 20px; border-top: 1px dashed var(--lx-line); }
.mc-trk__free ul { grid-auto-flow: column; grid-auto-columns: max-content; justify-content: start; gap: 8px; }
.mc-trk__free li { display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px; border-radius: 999px; background: var(--lx-soft); font-size: .8125rem; font-weight: 700; color: var(--lx-ink); }
.mc-trk__free li i { color: var(--lx-a); }
.mc-trk__act { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 24px; }
.mc-trk__next { display: inline-flex; align-items: center; gap: 8px; font-size: .875rem; font-weight: 700; color: var(--lx-body); }
.mc-trk__next i { color: var(--lx-a); }

/* what every session gives you: a bento whose cells glow under the cursor (the glow comes from .lx-card) */
.mc-bento { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.mc-bx { display: grid; align-content: start; gap: 8px; min-height: 190px; padding: 24px; border-radius: 18px; }
.mc-bx > i, .mc-bx__txt > i { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 8px; border-radius: 12px; background: var(--lx-soft); color: var(--lx-a); font-size: 1.25rem; transition: transform .4s cubic-bezier(.2, .7, .2, 1); }
.mc-bx:hover > i, .mc-bx:hover .mc-bx__txt > i { transform: translateY(-3px) rotate(-6deg); }
.mc-bx h3 { margin: 0; font-size: 1.0625rem; font-weight: 800; color: var(--lx-ink); }
.mc-bx p { margin: 0; font-size: .875rem; line-height: 1.6; }
.mc-bx--wide { grid-column: span 2; grid-template-columns: minmax(0, 1fr) auto; align-items: center; align-content: center; gap: 20px; }
.mc-bx__txt { display: grid; gap: 6px; }
.mc-bx--hero { background: linear-gradient(135deg, #0891b2, #2563eb); border-color: transparent; }
.mc-bx--hero h3, .mc-bx--hero p { color: #fff; }
.mc-bx--hero .mc-bx__txt > i { background: rgba(255, 255, 255, .2); color: #fff; }
.mc-bx__faces { display: flex; padding-right: 14px; }
.mc-bx__faces img { width: 64px; height: 64px; margin-right: -14px; border: 3px solid #1d6fd0; border-radius: 50%; object-fit: cover; object-position: top; transition: transform .4s cubic-bezier(.2, .7, .2, 1); }
.mc-bx--hero:hover .mc-bx__faces img:nth-child(odd) { transform: translateY(-6px); }
.mc-bx--hero:hover .mc-bx__faces img:nth-child(even) { transform: translateY(6px); }
.mc-bx--tint { background: linear-gradient(135deg, rgba(6, 182, 212, .14), rgba(59, 130, 246, .08)), var(--lx-card); }

@media (max-width: 991.98px) {
    .mc-trk { grid-template-columns: minmax(0, 1fr); }
    .mc-trk__tabs { display: flex; grid-auto-rows: auto; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
    .mc-trk__tabs::-webkit-scrollbar { display: none; }
    .mc-trk__tab { flex: none; scroll-snap-align: start; }
    .mc-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 679.98px) {
    .mc-trk__free ul { grid-auto-flow: row; grid-auto-columns: auto; justify-content: stretch; }
    .mc-trk__free li { justify-self: start; }
    .mc-bento { grid-template-columns: minmax(0, 1fr); gap: 14px; }
    .mc-bx--wide { grid-column: auto; grid-template-columns: minmax(0, 1fr); }
    .mc-bx { min-height: 0; padding: 20px; }
}
@media (prefers-reduced-motion: reduce) { .mc-trk__panel:not([hidden]) { animation: none; } .mc-trk__bar { transition: none; } }

.mc-trk__free { margin-top: 24px; }
.mc-trk__free ul { grid-auto-flow: row; grid-auto-columns: auto; display: flex; flex-wrap: wrap; gap: 8px; }
.mc-trk__free li { padding: 7px 14px; border: 1px solid var(--lx-line); background: var(--lx-card); }

@media (prefers-reduced-motion: reduce) { .mc-face { transition: none; } }