/* Shorts incrustados (short-video.js) */
.short-video { display: grid; grid-template-columns: minmax(0, 260px) minmax(0, 1fr); gap: 18px; align-items: center; margin: 26px 0; border: 1px solid var(--line-strong); border-radius: var(--radius); background: var(--surface); padding: 16px; }
.short-video-play, .short-video-frame { position: relative; display: block; width: 100%; aspect-ratio: 9 / 16; border: 0; border-radius: 6px; background: #000; padding: 0; overflow: hidden; cursor: pointer; }
.short-video-play img { width: 100%; height: 100%; object-fit: cover; }
.short-video-play:focus-visible { outline: 3px solid var(--brand-accent); outline-offset: 3px; }
.short-video-icon { position: absolute; top: 50%; left: 50%; display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: rgba(3, 7, 18, 0.78); color: #fff; font-size: 1.6rem; transform: translate(-50%, -50%); }
.short-video-play:hover .short-video-icon { background: var(--amazon); color: var(--brand-ink); }
.short-video figcaption p { margin: 0 0 10px; }
.short-video figcaption small { display: block; color: var(--muted); }
@media (max-width: 640px) { .short-video { grid-template-columns: 1fr; } .short-video-play, .short-video-frame { max-width: 260px; margin: 0 auto; } }
.short-video figcaption p:not(.mini-label) { color: var(--text); }
