:root{scrollbar-gutter:stable}
.course-previews{padding:84px 0}
.preview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:52px 36px}
.preview-link{display:block;text-decoration:none;color:var(--ink)}
.preview-link:hover{color:var(--ink)}
.preview-image{display:block;position:relative;aspect-ratio:16/9;background:#202123;overflow:hidden;border-radius:10px;box-shadow:0 12px 30px #0003}
.preview-image img{display:block;width:100%;height:100%;object-fit:contain;transition:transform .25s}
.preview-play{position:absolute;display:grid;place-items:center;left:50%;top:50%;transform:translate(-50%,-50%);width:64px;height:64px;border-radius:50%;background:#ffffff26;color:#fff;box-shadow:inset 0 0 0 1px #ffffff4d,0 6px 25px #0003;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:background .2s}
.preview-play svg{width:26px;height:26px;fill:currentColor;margin-left:4px}
.preview-link:hover .preview-play{background:#ffffff45}
.preview-link:hover .preview-image img{transform:scale(1.015)}
.preview-duration{position:absolute;right:14px;bottom:12px;padding:3px 8px;border-radius:5px;background:#161616b3;font:600 12px/1.5 var(--sans);color:#fff}
.preview-copy{display:block;padding-top:22px}
.preview-label{display:block;text-transform:uppercase;letter-spacing:.11em;font:600 11px/1.5 var(--sans);color:var(--muted);margin-bottom:10px}
.preview-copy h3{font:600 clamp(22px,2vw,28px)/1.25 var(--sans);letter-spacing:-.02em;margin:0 0 14px;max-width:560px}
.preview-description{display:block;font:17px/1.65 var(--serif);color:var(--muted);max-width:580px}
.preview-watch{display:inline-flex;gap:20px;align-items:center;margin-top:20px;font:600 14px/1.5 var(--sans);color:#d496ff}
.preview-watch>span{font-size:21px}
.preview-intro{grid-column:1/-1;padding-bottom:44px;border-bottom:1px solid var(--line)}
.preview-intro .preview-link{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center}
.preview-intro .preview-copy{padding-top:0}
.preview-package-note{font:14px/1.6 var(--sans);color:var(--muted);margin-top:40px;max-width:740px}
.preview-link:focus-visible,.preview-close:focus-visible{outline:2px solid #d496ff;outline-offset:6px;border-radius:10px}
body.preview-open{overflow:hidden}
.preview-modal{color:var(--ink);background:#242424;border:1px solid #ffffff20;border-radius:18px;padding:24px;width:min(1120px,calc(100% - 48px));max-width:none;max-height:calc(100dvh - 48px);overflow:auto;box-shadow:0 30px 120px #0008}
.preview-modal::backdrop{background:#111d;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.preview-modal-heading{display:flex;gap:28px;align-items:start;justify-content:space-between;margin-bottom:22px}
.preview-modal-heading .eyebrow{margin-bottom:8px}
.preview-modal h2{font:600 clamp(22px,2.4vw,32px)/1.2 var(--sans);letter-spacing:-.02em;max-width:880px}
.preview-close{flex-shrink:0;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:#ffffff0d;color:#ccc;cursor:pointer;padding:10px}
.preview-close:hover{color:#fff;background:#ffffff24}
.preview-close svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}
.preview-modal .preview-film{width:100%;max-width:none}
.preview-modal .film-player{border-radius:10px;box-shadow:none}
.preview-modal video{border-radius:10px;aspect-ratio:16/9;width:100%;max-height:calc(100dvh - 240px);object-fit:contain;background:#181818}
.preview-modal-note{font:12px/1.5 var(--sans);color:var(--muted);margin-top:16px}
@media(max-width:780px){.course-previews{padding:54px 0}.preview-grid{gap:40px 24px}.preview-intro .preview-link{grid-template-columns:1fr;gap:0}.preview-intro .preview-copy{padding-top:22px}.preview-copy h3{font-size:23px}.preview-description{font-size:16px}.preview-modal{width:calc(100% - 24px);max-height:calc(100dvh - 24px);padding:18px;border-radius:14px}.preview-modal-heading{gap:16px;margin-bottom:18px}.preview-modal h2{font-size:23px}.preview-modal video{max-height:calc(100dvh - 220px)}.preview-modal-note{font-size:11px}.preview-close{width:44px;height:44px}}
@media(max-width:560px){.preview-grid{grid-template-columns:1fr}.preview-intro{padding-bottom:34px}.preview-copy{padding-top:18px}.preview-copy h3{font-size:24px}.preview-play{width:56px;height:56px}.preview-package-note{font-size:12px}.preview-modal{padding:14px}.preview-modal h2{font-size:20px}.preview-modal-heading .eyebrow{font-size:10px}.preview-modal .film-toggle{width:60px;height:60px}.preview-modal .film-toggle svg{width:24px;height:24px}}
@media(max-height:500px) and (orientation:landscape){.preview-modal{max-height:calc(100dvh - 12px);padding:12px;width:min(800px,calc(100% - 24px))}.preview-modal h2{font-size:18px}.preview-modal-heading{margin-bottom:10px}.preview-modal-heading .eyebrow{margin-bottom:3px;font-size:10px}.preview-modal video{max-height:calc(100dvh - 105px)}.preview-modal-note{display:none}}
@media(prefers-reduced-motion:reduce){.preview-image img,.preview-play{transition:none}}
