.masterclasses-intro { padding-block:clamp(2.8rem,5vw,5rem) clamp(3rem,6vw,5rem); }
.masterclasses-intro h1 { max-width:21ch; font-size:var(--type-title); }
.masterclasses-lead { max-width:75ch; font-size:clamp(1rem,1.5vw,1.2rem); line-height:1.75; margin:1.75rem 0; }
.class-library { padding-bottom:clamp(3.5rem,7vw,6.5rem); }
.class-library-heading { display:flex; gap:2rem; align-items:flex-start; justify-content:space-between; margin-bottom:1.5rem; }
.class-library-filters { display:flex; flex-wrap:wrap; align-items:end; gap:1rem; }
.class-library-filters[hidden], .class-card[hidden] { display:none; }
.class-library-filters label { display:block; font-size:.8rem; font-weight:600; margin-bottom:.55rem; }
.class-library-filters select { font:inherit; color:var(--ink); background:white; width:100%; min-width:160px; min-height:52px; border:1px solid #777970; border-radius:var(--radius-control); padding:.8rem 3rem .8rem 1rem; }
@media(max-width:800px) {
 .class-library-heading { flex-wrap:wrap; }
}
@media(max-width:700px) {
 .class-library-filters { display:grid; grid-template-columns:minmax(0,1fr) minmax(172px,1fr); width:100%; gap:.75rem; margin-top:1.5rem; }
 .class-library-filters select { min-width:0; font-size:.85rem; padding-inline:.65rem 3rem; }
}
@media(max-width:360px) { .class-library-filters { grid-template-columns:1fr; } }
.class-library-heading h2 { max-width:22ch; }
.class-library-heading > p { font-size:.875rem; color:#575751; }
.masterclass-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2rem 1.5rem; }
.class-card { background:white; border-radius:var(--radius-surface); overflow:hidden; display:flex; flex-direction:column; min-width:0; }
.class-open { display:block; color:inherit; text-decoration:none; }
.class-thumbnail { position:relative; background:var(--bone); aspect-ratio:16/9; overflow:hidden; }
.class-thumbnail img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .3s ease; }
.class-play { position:absolute; display:grid; place-items:center; width:48px; height:48px; border-radius:50%; background:var(--coral-action,#d62936); color:#fff; bottom:1rem; left:1rem; }
.class-play svg { width:24px; height:24px; }
.class-duration { position:absolute; bottom:1rem; right:1rem; border-radius:4px; color:white; background:#0a0a0a; padding:.3rem .45rem; font-size:.75rem; font-variant-numeric:tabular-nums; }
.class-card-heading { padding:1.5rem 1.5rem 0; }
.class-speaker { color:var(--coral-text); margin-bottom:.85rem; }
.class-card .class-card-heading h3 { font-size:clamp(1.2rem,1.65vw,1.5rem); line-height:1.35; letter-spacing:-.02em; font-weight:700; }
.class-open:hover h3 { color:var(--coral-text); }
.class-open:focus-visible { outline:3px solid var(--coral-text); outline-offset:-4px; border-radius:var(--radius-surface); }
.class-card-body { padding:1rem 1.5rem 1.5rem; flex:1; display:flex; flex-direction:column; align-items:flex-start; }
.class-card time { font-size:.75rem; color:#575751; }
.class-overview { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; margin:1rem 0 1.5rem; line-height:1.65; font-size:.9375rem; color:#484842; }
.class-overview p { margin:0; }
.class-card-body > .text-link { margin-top:auto; min-height:44px; }
.class-video-dialog { border:0; border-radius:var(--radius-surface); padding:clamp(1rem,3vw,2rem); width:min(1080px,calc(100vw - 2rem)); max-width:none; max-height:calc(100dvh - 2rem); margin:auto; background:var(--bone); color:var(--ink); overflow:auto; overscroll-behavior:contain; }
.class-video-dialog::backdrop { background:#0a0a0acc; }
.class-dialog-header { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1rem; }
.class-dialog-close { flex-shrink:0; display:grid; place-items:center; width:48px; height:48px; border:1px solid #777; border-radius:50%; background:white; color:var(--ink); cursor:pointer; }
.class-dialog-close span { position:relative; width:20px; height:20px; }
.class-dialog-close span::before,.class-dialog-close span::after { content:""; position:absolute; left:0; top:9px; width:20px; height:2px; background:currentColor; transform:rotate(45deg); }
.class-dialog-close span::after { transform:rotate(-45deg); }
.class-dialog-close:hover { background:var(--ink); color:white; }
.class-video-dialog #class-video-title { font-size:clamp(1.3rem,2.7vw,2rem); line-height:1.25; max-width:55ch; margin-bottom:1.25rem; }
.class-video-stage { width:100%; min-width:0; aspect-ratio:16/9; min-height:200px; background:#0a0a0a; border-radius:var(--radius-surface); overflow:hidden; }
.class-video-stage iframe,.class-video-stage > div { display:block; width:100%; height:100%; border:0; }
.class-video-status { margin-top:.75rem; font-size:.875rem; }
.class-video-status:empty { display:none; }
.class-dialog-details { margin-top:1.5rem; }
#class-video-overview { width:100%; max-width:none; line-height:1.7; margin-bottom:1rem; }
#class-video-overview p + p { margin-top:1rem; }
@media(hover:hover) { .class-open:hover .class-thumbnail img { transform:scale(1.025); } }
@media(max-width:1100px) { .masterclass-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) {
 .masterclass-grid { grid-template-columns:minmax(0,1fr); gap:1.5rem; }
 .class-library-heading { display:block; }
 .class-library-heading > p { margin-top:1rem; }
 .class-video-dialog { width:calc(100vw - 1rem); max-height:calc(100dvh - 1rem); padding:1rem; }
 .class-dialog-header .eyebrow { font-size:.625rem; }
 .class-dialog-details { font-size:.9375rem; }
}
@media(prefers-reduced-motion:reduce) { .class-thumbnail img { transition:none; } .class-open:hover .class-thumbnail img { transform:none; } }

/* Masterclass links keep their label and chevron together, without underlines. */
.masterclasses-page .class-card-body > .text-link,
.masterclasses-page #class-youtube-link { text-decoration:none; gap:.5rem; }
.masterclasses-page .class-link-chevron { width:16px; height:16px; flex:0 0 16px; }
.class-dialog-details .class-overview-title { font-size:1.125rem; line-height:1.4; font-weight:700; margin-bottom:.75rem; }
#class-video-overview p { width:100%; max-width:none; }

/* Match the Coalition overview's hero-to-section rhythm. */
.masterclasses-intro { padding-bottom:4.5rem; }
.masterclasses-lead { margin-bottom:0; }
@media(max-width:800px) { .masterclasses-intro { padding-bottom:3.5rem; } }

/* The archive uses the same unboxed view icons as Newsroom. */
.class-control-label { display:block; font-size:.8rem; font-weight:600; margin-bottom:.55rem; }
.class-view-toggle { display:flex; align-items:center; min-height:52px; gap:4px; }
.class-view-toggle button { display:grid; place-items:center; width:44px; height:44px; padding:0; border:0; border-radius:3px; color:var(--ink); background:transparent; cursor:pointer; }
.class-view-toggle button svg { width:22px; height:22px; }
.class-view-toggle button:hover { background:var(--bone); }
.class-view-toggle button[aria-pressed="true"] { color:white; background:var(--ink); }
.masterclass-grid[data-view="list"] { display:block; }
.masterclass-grid[data-view="list"] .class-card { --class-thumb-width:240px; --class-row-gap:2rem; position:relative; background:transparent; border-radius:0; border-top:1px solid var(--line); padding-block:1.75rem; min-height:calc(240px * 9 / 16 + 3.5rem); }
.masterclass-grid[data-view="list"] .class-card:last-child { border-bottom:1px solid var(--line); }
.masterclass-grid[data-view="list"] .class-open { padding-left:calc(var(--class-thumb-width) + var(--class-row-gap)); }
.masterclass-grid[data-view="list"] .class-thumbnail { position:absolute; left:0; top:1.75rem; width:var(--class-thumb-width); border-radius:var(--radius-surface); }
.masterclass-grid[data-view="list"] .class-card-heading { padding:0; }
.masterclass-grid[data-view="list"] .class-card-body { margin-left:calc(var(--class-thumb-width) + var(--class-row-gap)); padding:1rem 0 0; }
.masterclass-grid[data-view="list"] .class-overview { margin-block:.75rem; max-width:75ch; -webkit-line-clamp:2; }
@media(max-width:700px) {
 .masterclass-grid[data-view="list"] .class-card { --class-thumb-width:110px; --class-row-gap:1rem; min-height:0; }
 .masterclass-grid[data-view="list"] .class-play { width:32px; height:32px; left:.5rem; bottom:.5rem; }
 .masterclass-grid[data-view="list"] .class-play svg { width:18px; height:18px; }
 .masterclass-grid[data-view="list"] .class-duration { font-size:.6rem; right:.3rem; bottom:.3rem; padding:.15rem; }
 .masterclass-grid[data-view="list"] .class-speaker { font-size:.65rem; }
 .masterclass-grid[data-view="list"] .class-card-heading h3 { font-size:1.125rem; }
 .masterclass-grid[data-view="list"] .class-card-body { margin-left:0; }
 .masterclass-grid[data-view="list"] .class-card-body > time { margin-left:calc(var(--class-thumb-width) + var(--class-row-gap)); }
}