/* ================= GALLERY ================= */

.filter-bar{
  position:sticky; top:82px; z-index:40;
  background:rgba(247,244,238,.92); backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
  padding:20px 0;
}
.filter-row{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.filter-btn{
  font-family:var(--font-mono); font-size:12px; letter-spacing:.05em;
  padding:10px 18px; border-radius:100px; border:1px solid var(--line);
  background:var(--paper); color:var(--ink-soft); transition:all .18s ease;
}
.filter-btn:hover{ border-color:var(--brand-blue-deep); color:var(--brand-blue-deep); }
.filter-btn.active{ background:var(--brand-blue-deep); border-color:var(--brand-blue-deep); color:#fff; }

.event-block{ padding:64px 0 8px; border-bottom:1px solid var(--line); }
.event-block:last-of-type{ border-bottom:0; }
.event-head{
  display:flex; justify-content:space-between; align-items:flex-end; gap:24px;
  margin-bottom:30px; flex-wrap:wrap;
}
.event-head h3{ font-size:clamp(22px,2.8vw,30px); margin-top:10px; max-width:640px; }
.event-date{
  font-family:var(--font-mono); font-size:12.5px; letter-spacing:.08em;
  color:var(--brand-red); text-transform:uppercase; white-space:nowrap;
  border:1px dashed rgba(224,39,44,.4); padding:8px 14px; border-radius:100px;
}
.event-loc{ margin-top:8px; color:var(--ink-soft); font-size:14.5px; }

.photo-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:16px; padding-bottom:56px;
}
.photo-grid .ph{
  border-radius:var(--radius-md); overflow:hidden; cursor:zoom-in; position:relative;
  aspect-ratio:4/3; background:#d8d8ce;
}
.photo-grid .ph.wide{ grid-column:span 2; }
.photo-grid .ph img{ width:100%; height:100%; object-fit:cover; transition:transform .45s ease; }
.photo-grid .ph:hover img{ transform:scale(1.07); }
.photo-grid .ph::after{
  content:""; position:absolute; inset:0; background:rgba(10,41,66,0); transition:background .2s ease;
}
.photo-grid .ph:hover::after{ background:rgba(10,41,66,.08); }

@media (max-width:800px){
  .photo-grid{ grid-template-columns:repeat(2,1fr); }
  .photo-grid .ph.wide{ grid-column:span 2; }
}
@media (max-width:520px){
  .photo-grid{ grid-template-columns:1fr 1fr; gap:10px; }
}

/* lightbox */
.lightbox{
  position:fixed; inset:0; z-index:200; background:rgba(6,20,32,.94);
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transition:opacity .22s ease, visibility .22s;
  padding:40px;
}
.lightbox.open{ opacity:1; visibility:visible; }
.lightbox img{ max-width:min(1000px,90vw); max-height:82vh; border-radius:10px; box-shadow:0 30px 80px rgba(0,0,0,.5); }
.lightbox-close, .lightbox-prev, .lightbox-next{
  position:absolute; background:rgba(10,20,32,.55); border:1px solid rgba(255,255,255,.3);
  color:#fff; border-radius:50%; width:46px; height:46px; display:flex; align-items:center; justify-content:center;
  transition:background .18s; box-shadow:0 4px 16px rgba(0,0,0,.35); backdrop-filter:blur(4px);
}
.lightbox-close:hover, .lightbox-prev:hover, .lightbox-next:hover{ background:rgba(10,20,32,.8); }
.lightbox-close{ top:24px; right:24px; }
.lightbox-prev{ left:24px; top:50%; transform:translateY(-50%); }
.lightbox-next{ right:24px; top:50%; transform:translateY(-50%); }
.lightbox-caption{
  position:absolute; left:0; right:0; bottom:26px; text-align:center;
  color:rgba(255,255,255,.75); font-family:var(--font-mono); font-size:12px; letter-spacing:.06em;
}
@media (max-width:640px){
  .lightbox-prev, .lightbox-next{ width:40px; height:40px; }
  .lightbox-close{ width:38px; height:38px; top:14px; right:14px; }
}