/* Gallery page — album grids + lightbox
   Loaded only on gallery.html, alongside the shared css/style.css */

.album-block{ margin-bottom:64px; }
.album-block:last-child{ margin-bottom:0; }
.album-head{ margin-bottom:18px; display:flex; align-items:baseline; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.album-head h2{ margin-bottom:2px; }
.album-count{ font-size:.82rem; color:var(--ink-soft); white-space:nowrap; }

.album-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
@media (max-width:880px){ .album-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:560px){ .album-grid{ grid-template-columns:repeat(2,1fr); gap:10px; } }

.album-thumb{
  position:relative; aspect-ratio:1/1; border-radius:4px; overflow:hidden;
  border:1px solid var(--line); background:var(--maroon-soft);
  cursor:pointer; padding:0; display:block; width:100%;
}
.album-thumb img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .35s ease; }
.album-thumb:hover img{ transform:scale(1.06); }
.album-thumb::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(0deg, rgba(20,7,10,.35), transparent 45%);
  opacity:0; transition:opacity .25s ease;
}
.album-thumb:hover::after{ opacity:1; }
.album-thumb:focus-visible{ outline:2px solid var(--sky); outline-offset:2px; }

/* Lightbox */
.lightbox-overlay{
  position:fixed; inset:0; z-index:300;
  background:rgba(20,7,10,.94);
  display:none; align-items:center; justify-content:center;
  padding:60px 24px;
}
.lightbox-overlay.open{ display:flex; }

.lightbox-content{
  position:relative; max-width:min(920px,92vw); max-height:86vh;
  display:flex; flex-direction:column; align-items:center;
}
.lightbox-content img{
  max-width:100%; max-height:74vh; width:auto; height:auto;
  border-radius:4px; box-shadow:0 24px 64px -12px rgba(0,0,0,.6);
  display:block;
}
.lightbox-caption{ color:var(--white); margin-top:16px; font-size:.92rem; text-align:center; max-width:60ch; }
.lightbox-count{ color:rgba(255,255,255,.55); font-size:.78rem; margin-top:6px; letter-spacing:.02em; }

.lightbox-close{
  position:fixed; top:20px; right:24px; z-index:301;
  width:42px; height:42px; border-radius:50%;
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.4);
  color:var(--white); font-size:1.3rem; line-height:1;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
}
.lightbox-close:hover{ background:rgba(255,255,255,.22); }

.lightbox-nav{
  position:fixed; top:50%; transform:translateY(-50%); z-index:301;
  width:46px; height:46px; border-radius:50%;
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.4);
  color:var(--white); font-size:1.4rem; line-height:1;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
}
.lightbox-nav:hover{ background:rgba(255,255,255,.22); }
.lightbox-prev{ left:20px; }
.lightbox-next{ right:20px; }
@media (max-width:640px){
  .lightbox-nav{ width:40px; height:40px; font-size:1.2rem; }
  .lightbox-prev{ left:8px; }
  .lightbox-next{ right:8px; }
  .lightbox-close{ top:12px; right:12px; }
  .lightbox-overlay{ padding:70px 16px 40px; }
}

/* Placeholder album (shown until you add your next event's photos) */
.album-thumb.is-placeholder{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px;
  text-align:center; padding:14px; cursor:default;
}
.album-thumb.is-placeholder::before{
  content:""; position:absolute; inset:8px; border:1.5px dashed rgba(42,20,24,.28); border-radius:4px;
}
.album-thumb.is-placeholder svg{ width:26px; height:26px; color:var(--maroon); opacity:.75; }
.album-thumb.is-placeholder span{ font-size:.74rem; font-weight:600; color:var(--ink-soft); }