/* 6단계 미디어 허브 — 영상 · 쇼츠 · 팟캐스트 */
.mh { padding: 32px var(--gutter) 80px; display: grid; gap: 24px; }
.mh__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; border-bottom: 3px solid var(--brand-navy); padding-bottom: 12px; }
.mh__head h1 { margin: 0; }
.mh__nav { display: flex; gap: 16px; font-weight: 500; }
.mh__nav a[aria-current] { color: var(--text-accent); text-decoration: underline; text-underline-offset: 6px; }
.mh__empty { padding: 48px; text-align: center; background: var(--bg-sunken); border-radius: var(--radius); color: var(--text-secondary); margin: 0; }
.mh__sub { margin: 16px 0 0; }
.vthumb { position: relative; display: block; aspect-ratio: 16 / 9; background: #1b2230 center / cover no-repeat; border-radius: var(--radius); overflow: hidden; }
.vthumb__dur { position: absolute; left: 8px; bottom: 8px; background: rgb(0 0 0 / .7); color: #fff; font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 4px; }
[data-preview] { position: relative; }
.card-preview { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.vfeature { display: grid; grid-template-columns: 2fr 1fr; gap: 24px; align-items: center; }
.vfeature:hover, .vcard:hover, .pcard-s:hover { text-decoration: none; }
.vfeature__text { display: grid; gap: 8px; }
.vgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px 16px; }
.vcard { display: grid; gap: 6px; align-content: start; }
.sfeed { height: calc(100vh - 200px); min-height: 520px; overflow-y: auto; scroll-snap-type: y mandatory; display: grid; gap: 16px; justify-content: center; }
.sitem { position: relative; height: calc(100vh - 220px); min-height: 500px; aspect-ratio: 9 / 16; scroll-snap-align: center; border-radius: 12px; overflow: hidden; background: #000; }
.sitem video { width: 100%; height: 100%; object-fit: cover; }
.sitem__text { position: absolute; left: 0; right: 0; bottom: 0; padding: 48px 16px 20px; display: grid; gap: 6px; background: linear-gradient(transparent, rgb(0 0 0 / .75)); color: #fff; }
.sitem__text a { color: #fff; }
.pgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 16px; }
.pcard-s { display: grid; gap: 6px; }
.pcover { display: block; aspect-ratio: 1; border-radius: var(--radius); background: var(--brand-navy) center / cover no-repeat; }
.pshow { display: grid; grid-template-columns: 220px 1fr; gap: 24px; align-items: start; }
.pshow p { margin: 6px 0 0; }
.pshow__subs { display: flex; gap: 12px; align-items: center; }
.eplist { list-style: none; margin: 0; padding: 0; }
.eplist li { display: grid; gap: 4px; padding: 16px 0; border-bottom: 1px solid var(--border-default); }
.eplist p { margin: 0; }
@media (max-width: 1023px) { .vgrid { grid-template-columns: repeat(2, 1fr); } .vfeature { grid-template-columns: 1fr; } }
@media (max-width: 767px) { .vgrid { grid-template-columns: 1fr; } .pshow { grid-template-columns: 1fr; } .sitem { height: 70vh; } }
