/* Photo Gallery — landing preview + full gallery page */

/* ---------- Landing preview (3 photos) ---------- */
.pg-preview { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
@media (max-width: 640px) { .pg-preview { grid-template-columns: 1fr; } }
.pg-preview a { display: block; overflow: hidden; border-radius: 1.5rem; box-shadow: 0 1px 3px rgba(0,0,0,.1); background: #e9e2d6; }
.pg-preview img { width: 100%; height: 16rem; object-fit: cover; display: block; transition: transform .4s ease; }
.pg-preview a:hover img, .pg-preview a:focus-visible img { transform: scale(1.05); }

/* ---------- Gallery page: justified tiles ---------- */
.pg-grid { width: 100%; }           /* width is measured by JS; tiles never exceed it */
.pg-row { display: flex; justify-content: center; gap: var(--pg-gap, 12px); margin-bottom: var(--pg-gap, 12px); }
.pg-tile { flex: 0 0 auto; overflow: hidden; border-radius: 1rem; background: #e9e2d6; padding: 0; border: 0; cursor: zoom-in; }
.pg-tile img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease, opacity .4s ease; }
.pg-tile:hover img, .pg-tile:focus-visible img { transform: scale(1.04); }

/* ---------- Lightbox ---------- */
.pg-lightbox { position: fixed; inset: 0; z-index: 2000; background: rgba(20,15,13,.92); display: none; align-items: center; justify-content: center; padding: 3rem 4rem; }
.pg-lightbox.open { display: flex; }
.pg-lightbox img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: .5rem; }
.pg-lightbox button { position: absolute; background: rgba(255,255,255,.15); color: #fff; border: 0; width: 2.75rem; height: 2.75rem; border-radius: 9999px; font-size: 1.25rem; cursor: pointer; }
.pg-lightbox button:hover { background: rgba(255,255,255,.3); }
.pg-lightbox .pg-close { top: 1rem; right: 1rem; }
.pg-lightbox .pg-prev  { left: 1rem; top: 50%; transform: translateY(-50%); }
.pg-lightbox .pg-next  { right: 1rem; top: 50%; transform: translateY(-50%); }
@media (max-width: 640px) { .pg-lightbox { padding: 3.5rem 1rem; } }