/* ============================================================
   RHSS — gallery additions (loaded after style.css)
   Covers the dynamic photo grid, video cards and the lightbox.
   ============================================================ */

/* Photo tiles are buttons now, so reset button chrome. */
.gallery-item .gallery-open{
  display:block; width:100%; height:100%; padding:0; border:0;
  background:none; cursor:pointer; position:relative; font-family:inherit;
}
.gallery-item .gallery-open img{width:100%; height:100%; object-fit:cover}
.gallery-cap{
  position:absolute; left:0; right:0; bottom:0;
  padding:26px 14px 12px;
  background:linear-gradient(to top, rgba(36,26,16,.82), rgba(36,26,16,0));
  color:#F6EFE1; font-size:.86rem; font-weight:600; text-align:left;
  line-height:1.35;
  opacity:0; transform:translateY(6px);
  transition:opacity .2s ease, transform .2s ease;
}
.gallery-open:hover .gallery-cap,
.gallery-open:focus-visible .gallery-cap{opacity:1; transform:none}
.gallery-open:focus-visible{outline:3px solid var(--gold); outline-offset:2px}

.gallery-empty{
  grid-column:1 / -1; text-align:center; color:var(--text-muted);
  background:var(--cream-2); border:1px dashed var(--line-strong);
  border-radius:var(--radius); padding:36px 20px; margin:0;
}

/* ---------------- videos ---------------- */

.video-card{
  background:var(--white); border:1px solid var(--line);
  border-radius:var(--radius); overflow:hidden;
  box-shadow:0 10px 26px rgba(46,33,21,.07);
}
.video-frame{position:relative; aspect-ratio:16/9; background:#241A10}
.video-frame iframe,
.video-frame video{width:100%; height:100%; border:0; display:block; object-fit:cover}
.video-play{
  display:block; width:100%; height:100%; padding:0; border:0;
  background:none; cursor:pointer; position:relative;
}
.video-play img{width:100%; height:100%; object-fit:cover}
.play-badge{
  position:absolute; inset:0; margin:auto;
  width:60px; height:60px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(226,99,43,.92); color:#fff; font-size:1.4rem;
  padding-left:4px;
}
.video-play:hover .play-badge{background:var(--saffron)}
.video-play:focus-visible{outline:3px solid var(--gold); outline-offset:-3px}
.video-meta{padding:16px 20px}
.video-meta h3{font-size:1rem; margin:0 0 .3em}
.video-meta p{font-size:.86rem; margin:0}
.video-slot{aspect-ratio:16/9}

/* ---------------- lightbox ---------------- */

.lightbox{
  position:fixed; inset:0; z-index:1000;
  background:rgba(24,16,9,.965);
  display:flex; align-items:center; justify-content:center;
  padding:56px 20px;
}
.lightbox[hidden]{display:none}
.lb-stage{max-width:1100px; max-height:100%; display:flex; flex-direction:column; gap:14px}
.lb-stage img{
  max-width:100%; max-height:78vh; object-fit:contain;
  border-radius:10px; margin:0 auto;
}
.lb-cap{color:#EFE3CC; text-align:center; font-size:.92rem; line-height:1.6}
.lb-close, .lb-nav{
  position:absolute; border:0; cursor:pointer; color:#F6EFE1;
  background:rgba(246,239,225,.12); border-radius:50%;
  font-family:inherit; line-height:1;
}
.lb-close{top:18px; right:18px; width:44px; height:44px; font-size:1.1rem}
.lb-nav{top:50%; transform:translateY(-50%); width:50px; height:50px; font-size:2rem}
.lb-nav.prev{left:16px}
.lb-nav.next{right:16px}
.lb-close:hover, .lb-nav:hover{background:rgba(246,239,225,.26)}
.lb-close:focus-visible, .lb-nav:focus-visible{outline:2px solid var(--gold-light); outline-offset:2px}

@media (max-width:640px){
  .lightbox{padding:64px 10px}
  .lb-nav{width:42px; height:42px; font-size:1.6rem}
  .gallery-cap{opacity:1; transform:none; font-size:.78rem}
}

@media (prefers-reduced-motion:reduce){
  .gallery-cap{transition:none}
}