/* ============================================================
   BlockVideoGallery 公開側スタイル
   グリッド: PC3列 / タブレット2列 / スマホ1列
   ライトボックス: 自作モーダル（webroot/js/block.js が生成）
   ============================================================ */
.bk-videogallery{ margin:8px 0; }
.bk-vg-grid{ list-style:none; margin:0; padding:0; display:grid; gap:16px; grid-template-columns:1fr; }
@media (min-width:600px){ .bk-vg-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:992px){ .bk-vg-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.bk-vg-cell{ min-width:0; }

.bk-vg-item{ display:block; width:100%; padding:0; border:0; background:transparent; cursor:pointer; text-align:left; font-family:inherit; -webkit-tap-highlight-color:transparent; }
.bk-vg-thumb{ position:relative; display:block; aspect-ratio:16/9; overflow:hidden; border-radius:12px; background:#0d1117; box-shadow:0 2px 10px rgba(0,0,0,.14); }
.bk-vg-thumb img,.bk-vg-thumb video{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .3s ease; pointer-events:none; }
.bk-vg-item:hover .bk-vg-thumb img,.bk-vg-item:hover .bk-vg-thumb video{ transform:scale(1.04); }
.bk-vg-play{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:56px; height:56px; border-radius:50%; background:rgba(13,17,23,.72); color:#fff; display:flex; align-items:center; justify-content:center; transition:background .18s, transform .18s; }
.bk-vg-play svg{ margin-left:3px; }
.bk-vg-item:hover .bk-vg-play{ background:rgba(13,17,23,.92); transform:translate(-50%,-50%) scale(1.08); }
.bk-vg-item:focus-visible{ outline:3px solid #4fc4b0; outline-offset:3px; border-radius:12px; }
.bk-vg-title{ display:block; margin-top:8px; font-size:14.5px; font-weight:700; line-height:1.55; overflow-wrap:anywhere; }

/* ---- ライトボックス ---- */
.bk-vg-lightbox{ position:fixed; inset:0; z-index:3000; display:flex; align-items:center; justify-content:center; padding:20px; background:rgba(8,10,12,.86); opacity:0; transition:opacity .2s ease; }
.bk-vg-lightbox.is-open{ opacity:1; }
.bk-vg-dialog{ position:relative; width:min(1000px,100%); }
.bk-vg-stage{ position:relative; width:100%; aspect-ratio:16/9; background:#000; border-radius:10px; overflow:hidden; box-shadow:0 18px 60px rgba(0,0,0,.5); }
.bk-vg-stage iframe,.bk-vg-stage video{ position:absolute; inset:0; width:100%; height:100%; border:0; display:block; background:#000; }
.bk-vg-caption{ margin:12px 4px 0; color:#fff; font-size:15px; font-weight:700; line-height:1.6; overflow-wrap:anywhere; }
.bk-vg-close{ position:absolute; right:0; top:-52px; width:44px; height:44px; border:0; border-radius:50%; background:rgba(255,255,255,.14); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .15s; }
.bk-vg-close:hover{ background:rgba(255,255,255,.3); }
.bk-vg-close:focus-visible{ outline:3px solid #4fc4b0; outline-offset:2px; }
@media (max-width:600px){
  .bk-vg-lightbox{ padding:12px; }
  .bk-vg-close{ top:auto; bottom:-56px; right:calc(50% - 22px); }
}
@media (prefers-reduced-motion: reduce){
  .bk-vg-lightbox,.bk-vg-thumb img,.bk-vg-thumb video,.bk-vg-play{ transition:none; }
}