/* ============================================================
   BIM Forum Chile v14.4 — Banda multimedia "BFCh en video"
   Contenido real del canal de YouTube. Aporta dinamismo (motion
   en hover, botón play) y contenido nuevo alineado a marca.
   ============================================================ */
.vband{ background:var(--ink-25); }
.vband__head{ display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.vband__channel{
  display:inline-flex; align-items:center; gap:.55rem; flex-shrink:0;
  font-family:var(--f-d); font-weight:600; font-size:.9rem; color:var(--ink-700);
  padding:.6rem 1.1rem; border:1px solid var(--ink-200); border-radius:100px; transition:all .2s;
}
.vband__channel:hover{ border-color:var(--cta); color:var(--cta); }
.vband__yt{ width:26px; height:18px; border-radius:5px; background:#ff0000; color:#fff; display:grid; place-items:center; }

.vband__grid{ display:grid; grid-template-columns:1.35fr 1fr; gap:1.5rem; align-items:stretch; }

/* ── Destacado ─────────────────────────────────────────────── */
.vfeat{ display:flex; flex-direction:column; background:var(--navy-900); border-radius:20px; overflow:hidden; box-shadow:0 24px 54px -30px rgba(7,15,26,.6); transition:transform .35s var(--ease-out,ease), box-shadow .35s; }
.vfeat:hover{ transform:translateY(-5px); box-shadow:0 34px 74px -34px rgba(7,15,26,.8); }
.vfeat__media{ position:relative; aspect-ratio:16/9; overflow:hidden; }
.vfeat__media img{ width:100%; height:100%; object-fit:cover; transition:transform .7s var(--ease-out,ease); }
.vfeat:hover .vfeat__media img{ transform:scale(1.05); }
.vfeat__media::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(7,15,26,0) 55%,rgba(7,15,26,.55) 100%); }
.vfeat__badge{ position:absolute; top:1rem; left:1rem; z-index:2; display:inline-flex; align-items:center; gap:.5rem; background:var(--c1); color:var(--navy-900); font-family:var(--f-d); font-weight:900; font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; padding:.42rem .8rem; border-radius:8px; box-shadow:0 8px 20px -8px rgba(243,146,0,.7); }
.vfeat__hex{ width:10px; height:11px; background:var(--navy-900); clip-path:var(--hex-pointy); }
.vfeat__body{ padding:1.6rem 1.75rem 1.85rem; color:#fff; }
.vfeat__meta{ display:flex; align-items:center; gap:.65rem; margin-bottom:.85rem; }
.vfeat__title{ font-family:var(--f-d); font-weight:700; font-size:clamp(1.25rem,2vw,1.6rem); line-height:1.2; color:#fff; margin-bottom:.65rem; }
.vfeat__desc{ color:rgba(255,255,255,.75); line-height:1.65; font-size:.95rem; }

/* Botón play */
.vplay{ position:absolute; z-index:2; top:50%; left:50%; transform:translate(-50%,-50%); display:grid; place-items:center; width:46px; height:46px; border-radius:50%; background:rgba(255,255,255,.92); color:var(--cta); box-shadow:0 8px 24px -6px rgba(7,15,26,.5); transition:transform .25s, background .25s, color .25s; }
.vplay--lg{ width:74px; height:74px; }
.vfeat:hover .vplay--lg,.vitem:hover .vplay{ transform:translate(-50%,-50%) scale(1.08); background:var(--cta); color:#fff; }

/* Etiquetas */
.vtag{ font-family:var(--f-d); font-weight:700; font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; color:#fff; background:var(--cta); padding:.3rem .6rem; border-radius:6px; }
.vtag--sm{ font-size:.6rem; padding:.24rem .5rem; }
.vdate{ font-family:var(--f-d); font-weight:500; font-size:.78rem; color:rgba(255,255,255,.6); }
.vitem .vdate{ color:var(--ink-400); }

/* ── Playlist ──────────────────────────────────────────────── */
.vlist{ display:flex; flex-direction:column; gap:1rem; }
.vitem{ display:grid; grid-template-columns:132px 1fr; gap:1rem; background:#fff; border:1px solid var(--ink-100); border-radius:14px; padding:.7rem; align-items:center; transition:transform .25s, box-shadow .25s, border-color .25s; flex:1; }
.vitem:hover{ transform:translateX(4px); box-shadow:0 14px 32px -20px rgba(11,27,44,.4); border-color:transparent; }
.vitem__thumb{ position:relative; aspect-ratio:16/9; border-radius:9px; overflow:hidden; background:var(--navy-800); }
.vitem__thumb img{ width:100%; height:100%; object-fit:cover; }
.vitem__body{ min-width:0; }
.vitem__meta{ display:flex; align-items:center; gap:.5rem; margin-bottom:.4rem; }
.vitem__title{ font-family:var(--f-d); font-weight:700; font-size:.9rem; line-height:1.28; color:var(--ink-900); text-wrap:pretty; }

@media(max-width:860px){
  .vband__grid{ grid-template-columns:1fr; }
}
@media(max-width:480px){
  .vitem{ grid-template-columns:104px 1fr; gap:.75rem; }
  .vitem__title{ font-size:.82rem; }
}