.video-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:36px 24px}
.video-card{min-width:0}
.video-thumbnail{position:relative;display:block;color:#fff;overflow:hidden;transition:transform .22s ease}
.video-thumbnail:hover,.video-thumbnail:focus-visible{transform:scale(1.04);z-index:1}
.video-thumbnail img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;transition:filter .2s ease}
.video-thumbnail:hover img,.video-thumbnail:focus-visible img{filter:brightness(.9) contrast(1.1) saturate(1.25)}
.video-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:rgba(20,35,49,.83);border:1px solid rgba(255,255,255,.6);pointer-events:none}
.video-play svg{width:22px;height:22px;margin-left:3px;fill:currentColor}
.video-card h2{margin:14px 0 0;font-size:1rem;line-height:1.65;font-weight:400;word-break:keep-all}
.video-player-dialog{width:min(1100px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);padding:0;border:1px solid rgba(169,201,195,.35);background:#142331;color:#fff;overflow:auto;font-family:Inter,'HCR Dotum',sans-serif}
.video-player-dialog::backdrop{background:rgba(5,12,18,.88)}
.video-dialog-header{display:flex;align-items:center;gap:20px;padding:16px 20px}
.video-dialog-header h2{flex:1;margin:0;font-size:1rem;line-height:1.5;font-weight:400}
.video-dialog-close{flex:none;width:40px;height:40px;padding:0;background:none;border:1px solid rgba(255,255,255,.4);color:#fff;font:inherit;font-size:1.5rem;cursor:pointer}
.video-dialog-close:hover{background:rgba(169,201,195,.12)}
.video-dialog-close:focus-visible{outline:2px solid #a9c9c3;outline-offset:3px}
.video-player-frame{position:relative;aspect-ratio:16/9;min-height:200px;background:#000}
.video-player-frame iframe{position:absolute;inset:0;display:block;width:100%;height:100%;min-height:200px;border:0}
.video-dialog-footer{margin:0;padding:16px 20px;text-align:right;font-size:.875rem}
.video-dialog-footer a{color:#a9c9c3;text-decoration:underline;text-underline-offset:4px}
body.video-modal-open{overflow:hidden}
@media(max-width:760px){.video-grid{gap:28px}.video-dialog-header{padding:12px}.video-dialog-footer{padding:12px}}
@media(prefers-reduced-motion:reduce){.video-thumbnail,.video-thumbnail img{transition:none}}

@media(max-width:900px){.video-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.video-grid{grid-template-columns:minmax(0,1fr)}}
