.bnsp-gallery { --gallery-accent: #C0371B; --gallery-muted: #4b5563; --gallery-surface: #f9f9f9; color: #111827; }
.bnsp-gallery [hidden] { display: none !important; }
.bnsp-gallery a:focus-visible, .bnsp-gallery button:focus-visible, .bnsp-gallery input:focus-visible { outline: 3px solid var(--gallery-accent); outline-offset: 4px; }
.bnsp-gallery h1 { line-height: 1.15; }
.bnsp-gallery h3 { overflow-wrap: anywhere; }
.bnsp-gallery p { line-height: 1.7; overflow-wrap: anywhere; }
.gallery-eyebrow, .gallery-category { max-width: 100%; overflow-wrap: anywhere; color: var(--gallery-accent); font-size: .75rem; font-weight: 700; letter-spacing: .08em; }
.gallery-eyebrow { display: inline-flex; align-items: center; gap: .65rem; }
.gallery-eyebrow::before { content: ''; width: 1.5rem; height: 2px; background: currentColor; }
.gallery-search { display: flex; border-radius: 999px; background: white; box-shadow: 0 8px 10px -4px rgb(0 0 0 / .15); }
.gallery-search input { min-width: 0; width: 100%; height: 3.5rem; padding: 0 1.5rem; border: 0; border-radius: 999px 0 0 999px; background: white; color: #374151; }
.gallery-search button { min-width: 3.75rem; border: 0; border-radius: 0 999px 999px 0; background: linear-gradient(to right, #E25727, #E89135); color: white; display: grid; place-items: center; }
.gallery-search button:hover { background: var(--gallery-accent); }
.gallery-filter { display: inline-flex; align-items: center; max-width: 100%; overflow-wrap: anywhere; min-height: 2.75rem; padding: .5rem 1rem; border-radius: 999px; border: 1px solid #e5e7eb; color: var(--gallery-muted); font-size: .875rem; font-weight: 600; background: white; }
.gallery-filter:hover, .gallery-filter.is-active { color: var(--gallery-accent); border-color: var(--gallery-accent); background: #fff7ed; }
.gallery-album-grid, .gallery-photo-grid { display: grid; gap: 1.5rem; grid-template-columns: minmax(0, 1fr); }
.gallery-album { min-width: 0; display: flex; flex-direction: column; overflow: hidden; border: 1px solid #e5e7eb; border-radius: 1rem; background: white; transition: box-shadow .2s, transform .2s; }
.gallery-album:hover { box-shadow: 0 12px 28px rgb(0 0 0 / .08); transform: translateY(-3px); }
.gallery-album:hover h3 { color: var(--gallery-accent); }
.gallery-cover { position: relative; overflow: hidden; height: 17rem; background: var(--gallery-surface); }
.gallery-cover img, .gallery-photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s; }
.gallery-album:hover img, .gallery-photo:hover img { transform: scale(1.035); }
.gallery-count, .gallery-featured-label { position: absolute; top: 1rem; padding: .35rem .7rem; border-radius: .5rem; background: rgb(17 24 39 / .9); color: white; font-size: .75rem; font-weight: 600; }
.gallery-count { right: 1rem; }
.gallery-featured-label { left: 1rem; background: white; color: var(--gallery-accent); }
.gallery-album-content { display: flex; flex-direction: column; padding: 1.5rem; flex: 1; }
.gallery-category { letter-spacing: .04em; }
.gallery-empty { min-height: 18rem; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 3rem 1.5rem; border: 1px dashed #d1d5db; border-radius: 1rem; background: var(--gallery-surface); color: var(--gallery-muted); }
.gallery-image-fallback { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: .75rem; color: var(--gallery-muted); background: var(--gallery-surface); font-size: .875rem; }
.gallery-description { white-space: pre-line; overflow-wrap: anywhere; }
.gallery-photo { position: relative; min-width: 0; aspect-ratio: 4 / 3; border-radius: 1rem; overflow: hidden; background: var(--gallery-surface); }
.gallery-photo-label { position: absolute; inset: auto 0 0; display: flex; justify-content: space-between; padding: 2rem 1rem 1rem; background: linear-gradient(transparent, rgb(17 24 39 / .85)); color: white; font-size: .875rem; }
.gallery-viewer { width: min(94vw, 1440px); height: min(92dvh, 1000px); max-width: none; max-height: none; margin: auto; padding: 0; border: 1px solid #374151; border-radius: 1rem; background: #111827; color: white; }
.gallery-viewer::backdrop { background: rgb(0 0 0 / .85); }
.gallery-viewer-shell { display: flex; flex-direction: column; height: 100%; }
.gallery-viewer-header { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem 1.5rem; }
.gallery-viewer-header h2 { overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.4; }
.gallery-viewer-header p { margin: .25rem 0 0; }
.gallery-viewer button { min-width: 44px; min-height: 44px; border-radius: .5rem; background: #1f2937; color: white; padding: .5rem .75rem; border: 1px solid #4b5563; }
.gallery-viewer [data-gallery-close] { flex-shrink: 0; font-size: 1.75rem; }
.gallery-viewer button:hover:not(:disabled) { background: #374151; }
.gallery-viewer button:focus-visible { outline-color: #EEBE6A; }
.gallery-viewer button:disabled { opacity: .4; cursor: default; }
.gallery-viewer-stage { flex: 1; min-height: 0; display: grid; place-items: center; position: relative; padding: 0 1rem; }
.gallery-viewer-stage img { width: 100%; height: 100%; min-height: 0; object-fit: contain; }
.gallery-viewer-stage p { position: absolute; text-align: center; padding: 1.5rem; color: #d1d5db; }
.gallery-viewer-controls { display: flex; justify-content: space-between; align-items: center; gap: .75rem; padding: 1rem 1.5rem; }
.gallery-viewer-open { overflow: hidden; }
@media (min-width: 640px) {
    .gallery-album-grid, .gallery-photo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .gallery-album-featured { grid-column: span 2; }
    .gallery-cover { height: 20rem; }
}
@media (min-width: 1024px) {
    .gallery-album-grid, .gallery-photo-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .gallery-album-featured h3 { font-size: 1.5rem; }
    .gallery-cover { height: 22rem; }
}
@media (prefers-reduced-motion: reduce) {
    .bnsp-gallery *, .bnsp-gallery *::before { transition: none; }
    .bnsp-gallery .gallery-cover img, .bnsp-gallery .gallery-photo img { transition: none; }
    .gallery-album:hover, .gallery-album:hover img, .gallery-photo:hover img { transform: none; }
}
