/* Grid */
.sgallery{
  display: grid;
  grid-template-columns: repeat(var(--sg-columns,3), 1fr);
  gap: var(--sg-gap,12px);
}
.sgallery__cell{ margin:0; }
.sgallery__link{
  display:block;
  position:relative;
  overflow:hidden;
  border-radius: .5rem;
  box-shadow: 0 1px 3px rgba(0,0,0,.08);
}
.sgallery__img{
  display:block;
  width:100%;
  height:auto;
  transition: transform .2s ease;
}
.sgallery__link:hover .sgallery__img,
.sgallery__link:focus .sgallery__img{
  transform: scale(1.02);
}
.sgallery__cap{
  font-size:.9rem;
  color:#555;
  margin-top:.25rem;
}

/* Responsive columns */
@media (max-width: 900px){
  .sgallery{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px){
  .sgallery{ grid-template-columns: repeat(1, 1fr); }
}

/* Lightbox overlay */
.sgallery-overlay{
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 4vmin;
  background: rgba(0,0,0,.9);
  z-index: 9999;
}
.sgallery-overlay.is-open{ display:flex; }
.sgallery-overlay__img{
  max-width: 100%;
  max-height: 80vh;
  display:block;
}
.sgallery-overlay__cap{
  position:absolute;
  left:0; right:0; bottom:1rem;
  text-align:center;
  color:#fff;
  font-size:1rem;
  opacity:.9;
  padding:0 1rem;
}
.sgallery-overlay__close,
.sgallery-overlay__prev,
.sgallery-overlay__next{
  position:absolute;
  top:1rem;
  border:none;
  background:transparent;
  color:#fff;
  font-size:2rem;
  line-height:1;
  cursor:pointer;
  padding:.25rem .5rem;
}
.sgallery-overlay__close{ right:1rem; }
.sgallery-overlay__prev,
.sgallery-overlay__next{
  top:50%;
  transform: translateY(-50%);
  font-size:3rem;
}
.sgallery-overlay__prev{ left:1rem; }
.sgallery-overlay__next{ right:1rem; }
.sgallery-overlay__close:focus,
.sgallery-overlay__prev:focus,
.sgallery-overlay__next:focus{
  outline:2px solid #fff; outline-offset:2px;
}

/* Small notice */
.sgallery__notice{
  padding:.75rem 1rem;
  background:#fff7e6;
  border:1px solid #ffd591;
  border-radius:.5rem;
  color:#7c5300;
}