/* css/photo-gallery.css — photo galleries on show and band pages (mosaic preview) and /gallery.php (grid).
   Site palette: #161C1D bg, #2a3133 panels, #EDC78A accent. */

.pg-section { margin-top: 1.5rem; min-width: 0; }
.pg-head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: .5rem; }
.pg-head h2 { font-size: 1.1rem; margin: 0; display: flex; align-items: baseline; gap: .5rem; }
.pg-count { font-size: .75rem; font-weight: 400; opacity: .6; }
.pg-all { color: #EDC78A; font-size: .9rem; text-decoration: none; white-space: nowrap; }
.pg-all:hover, .pg-all:focus-visible { text-decoration: underline; }

/* tiles */
.pg-tile { position: relative; display: block; min-width: 0; min-height: 0; overflow: hidden; background: #2a3133; }
.pg-tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .25s ease; }
.pg-tile:hover img { transform: scale(1.03); }
.pg-tile:focus-visible { outline: 2px solid #EDC78A; outline-offset: -2px; z-index: 1; }
.pg-more { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(10, 14, 15, .6); color: #fff; font-size: 1.75rem; font-weight: 600; text-shadow: 0 1px 3px rgba(0, 0, 0, .6); }

/* preview mosaic: 1 wide; 2 side by side; 3 = one tall + two; 4 = one wide + three; 5 = two + three */
.pg-mosaic { display: grid; gap: 3px; border-radius: 8px; overflow: hidden; background: #0a0e0f; aspect-ratio: 4 / 3; }
.pg-mosaic--n1 { grid-template-columns: 1fr; }
.pg-mosaic--n2 { grid-template-columns: 1fr 1fr; aspect-ratio: 2 / 1; }
.pg-mosaic--n3 { grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; aspect-ratio: 3 / 2; }
.pg-mosaic--n3 .pg-tile:first-child { grid-row: 1 / 3; }
.pg-mosaic--n4 { grid-template-columns: repeat(3, 1fr); grid-template-rows: 2fr 1fr; }
.pg-mosaic--n4 .pg-tile:first-child { grid-column: 1 / 4; }
.pg-mosaic--n5 { grid-template-columns: repeat(6, 1fr); grid-template-rows: 3fr 2fr; aspect-ratio: 1 / 1; }
.pg-mosaic--n5 .pg-tile:nth-child(-n+2) { grid-column: span 3; }
.pg-mosaic--n5 .pg-tile:nth-child(n+3) { grid-column: span 2; }

/* /gallery.php */
.pg-page { padding-top: 1rem; padding-bottom: 2rem; }
.pg-page-head { margin-bottom: 1rem; }
.pg-back { color: #EDC78A; text-decoration: none; font-size: .9rem; }
.pg-back:hover, .pg-back:focus-visible { text-decoration: underline; }
.pg-page-head h1 { font-size: 1.5rem; margin: .25rem 0 0; }
.pg-page-head .pg-sub { opacity: .7; font-size: .9rem; margin: 0; }
.pg-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3px; }
.pg-grid .pg-tile { aspect-ratio: 1; }
@media (min-width: 576px) { .pg-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; } }
@media (min-width: 992px) { .pg-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (min-width: 1400px) { .pg-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.pg-foot { text-align: center; margin: 1.5rem 0 0; }
.pg-loadmore { min-height: 44px; padding: .5rem 1.5rem; border: 0; border-radius: 6px; background: #2a3133; color: #E8E8E8; cursor: pointer; }
.pg-loadmore:hover, .pg-loadmore:focus-visible { background: #EDC78A; color: #161C1D; }
.pg-loadmore[hidden] { display: none; }
.pg-status { margin: .75rem 0 0; opacity: .7; font-size: .9rem; min-height: 1.2em; }
.pg-empty { opacity: .7; }

@media (prefers-reduced-motion: reduce) { .pg-tile img { transition: none; } .pg-tile:hover img { transform: none; } }