.v-empty{max-width:1400px;margin:0 auto;padding:20px 32px 60px;color:#7A7256;font-family:'Roboto',Arial,sans-serif;font-size:14px}

/* ============ Featured hero ============ */
.v-hero-wrap{max-width:1400px;margin:0 auto;padding:0 32px 28px}
.v-hero{position:relative;display:block;width:100%;border:none;padding:0;cursor:pointer;
  border-radius:16px;overflow:hidden;aspect-ratio:16/6.2;min-height:320px;
  background-size:cover;background-position:center;background-color:#0B2109;
  transition:transform .3s ease}
.v-hero:hover{transform:scale(1.004)}
.v-hero::after{content:"";position:absolute;inset:0;
  background:linear-gradient(0deg, rgba(7,21,5,.9) 0%, rgba(7,21,5,.35) 55%, rgba(7,21,5,.15) 100%)}
.v-hero-body{position:absolute;left:36px;right:36px;bottom:30px;z-index:2;text-align:left;display:flex;flex-direction:column;gap:8px}
.v-hero-body .tag{align-self:flex-start;background:#C9A24C;color:#16330F;font-size:11px;font-weight:700;
  text-transform:uppercase;letter-spacing:.04em;padding:5px 12px;border-radius:20px}
.v-hero-title{font-family:'Oswald',sans-serif;font-weight:700;font-size:28px;line-height:1.25;color:#fff;max-width:800px}
.v-hero-dur{font-size:13px;color:#D9CBA8}

/* ============ Play buttons ============ */
.v-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;
  width:44px;height:44px;border-radius:50%;background:rgba(7,21,5,.55);border:2px solid rgba(255,255,255,.85);
  display:flex;align-items:center;justify-content:center;transition:background .2s ease,transform .2s ease}
.v-hero:hover .v-play,.v-card:hover .v-play{transform:translate(-50%,-50%) scale(1.08);background:#C9A24C;border-color:#C9A24C}
.v-play-lg{width:76px;height:76px}

/* ============ Grid ============ */
.v-grid{max-width:1400px;margin:0 auto;padding:0 32px 70px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.v-card{position:relative;display:block;width:100%;border:none;padding:0;cursor:pointer;text-align:left;
  aspect-ratio:16/10;border-radius:12px;overflow:hidden;background-size:cover;background-position:center;
  background-color:#3A2010;transition:transform .25s ease}
.v-card:hover{transform:translateY(-3px)}
.v-card::after{content:"";position:absolute;inset:0;
  background:linear-gradient(0deg, rgba(7,21,5,.88) 0%, rgba(7,21,5,.15) 55%, rgba(7,21,5,.05) 100%)}
.v-dur{position:absolute;top:12px;right:12px;z-index:2;background:rgba(7,21,5,.75);color:#fff;
  font-size:11px;font-weight:600;padding:3px 8px;border-radius:5px}
.v-title{position:absolute;left:16px;right:16px;bottom:14px;z-index:2;
  font-family:'Oswald',sans-serif;font-weight:700;font-size:15px;line-height:1.3;color:#fff;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ============ Lightbox modal ============ */
.v-modal{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center}
.v-modal[hidden]{display:none}
.v-modal-backdrop{position:absolute;inset:0;background:rgba(5,12,4,.9)}
.v-modal-dialog{position:relative;z-index:2;width:92%;max-width:1000px}
.v-modal-frame{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:10px;overflow:hidden}
.v-modal-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.v-modal-close{position:absolute;top:-40px;right:0;z-index:3;background:none;border:none;color:#fff;
  font-size:32px;line-height:1;cursor:pointer;padding:4px 8px}
.v-modal-close:hover{color:#C9A24C}

@media (max-width:900px){
  .v-grid{grid-template-columns:1fr 1fr}
  .v-hero{aspect-ratio:16/10;min-height:220px}
  .v-hero-title{font-size:20px}
  .v-hero-body{left:20px;right:20px;bottom:20px}
}
@media (max-width:600px){
  .v-grid{grid-template-columns:1fr}
}