/* assets/gallery.css */

/* Base */
.dg-gallery{
  column-gap: 16px;
  width: 100%;
  max-width: 1400px;
  margin: 20px auto;
}
.dg-item{ break-inside: avoid; margin-bottom: 16px; overflow: hidden; border-radius: 10px; background:#fff; box-shadow:0 6px 18px rgba(0,0,0,0.06); transition:transform .25s;}
.dg-item img{ width:100%; display:block; transition:transform .35s ease; filter: blur(10px); transform: scale(1); }
.dg-item img.dg-loaded{ filter: blur(0px); transition: filter .5s ease, transform .5s ease; }

/* Hover */
.dg-item:hover{ transform: translateY(-6px); }
.dg-item img:hover{ transform: scale(1.03); }

/* Layout modes */
.dg-layout-grid .dg-item{ display:inline-block; width:100%; }
.dg-layout-justified{ display:flex; flex-wrap:wrap; gap:8px; }
.dg-layout-justified .dg-item{ flex: 1 1 auto; width:auto; }

/* Modal */
.dg-modal{ display:none; position:fixed; inset:0; background:rgba(0,0,0,0.85); z-index:99999; align-items:center; justify-content:center; padding:20px; }
.dg-modal[aria-hidden="false"]{ display:flex; }
.dg-modal-inner{ position:relative; max-width:1100px; width:100%; text-align:center; }
.dg-modal img{ max-width:100%; max-height:80vh; border-radius:8px; }
.dg-close{ position:absolute; top:12px; right:18px; background:transparent; border:0; color:#fff; font-size:34px; cursor:pointer; }
.dg-modal-caption{ color:#fff; margin-top:10px; font-size:18px; }
.dg-nav{ position:absolute; top:50%; transform:translateY(-50%); background:transparent; border:0; color:#fff; font-size:36px; cursor:pointer; padding:8px; }
.dg-prev{ left:6px; }
.dg-next{ right:6px; }

/* Responsive */
@media (max-width:1200px){ .dg-gallery{ column-gap:12px; } }
@media (max-width:768px){ .dg-gallery{ column-gap:10px; } }
@media (max-width:480px){ .dg-gallery{ column-count:1 !important; } }

/* Small utility */
.dg-lazy{ display:block; width:100%; height:auto; object-fit:cover; }