/* ── Page Hero ── */
.page-hero {
  position: relative;
  height: 55vh; min-height: 380px;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 3rem 2.5rem; overflow: hidden;
}
@keyframes kenBurns {
  from { transform: scale(1); }
  to   { transform: scale(1.08); }
}
.page-hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center; background-repeat: no-repeat; animation: kenBurns 12s ease-out forwards; }
.page-hero-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,.85) 30%, rgba(0,0,0,.2) 100%); }
.page-hero-content { position: relative; z-index: 1; }
.hero-eyebrow { font-size: .65rem; letter-spacing: .25em; text-transform: uppercase; color: var(--accent); margin-bottom: .5rem; }
.hero-title { font-size: clamp(2.5rem, 6vw, 5rem); font-weight: 800; letter-spacing: -.02em; line-height: 1; }

/* ── Category Nav ── */
.cat-nav { display: flex; gap: 0; border-bottom: 1px solid var(--mid); background: var(--off-black); padding: 0 2.5rem; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.cat-nav a { font-size: .65rem; letter-spacing: .2em; text-transform: uppercase; color: var(--light); padding: 1rem 1.5rem; border-bottom: 2px solid transparent; transition: color .2s, border-color .2s; white-space: nowrap; }
.cat-nav a:hover { color: var(--white); }
.cat-nav a.active { color: var(--white); border-bottom-color: var(--accent); }
.cat-nav-section { font-size: .55rem; letter-spacing: .15em; text-transform: uppercase; color: var(--mid); padding: 1rem .5rem; white-space: nowrap; }

/* ── Gallery / Masonry ── */
.gallery-section { padding: 3rem 2.5rem; }
.gallery-count { font-size: .65rem; letter-spacing: .2em; text-transform: uppercase; color: var(--light); margin-bottom: 1.5rem; }
.gallery-count span { color: var(--accent); }
.masonry { columns: 3; column-gap: .5rem; }
.masonry-item { break-inside: avoid; margin-bottom: .5rem; position: relative; overflow: hidden; cursor: pointer; }
.masonry-item img { display: block; width: 100%; height: auto; transition: transform .5s ease; }
.masonry-item:hover img { transform: scale(1.04); }
.masonry-overlay { position: absolute; inset: 0; background: rgba(0,0,0,.5); display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity .3s; }
.masonry-item:hover .masonry-overlay { opacity: 1; }
.overlay-icon { font-size: 1.5rem; color: #fff; }

/* ── Lightbox ── */
.lightbox { position: fixed; inset: 0; z-index: 200; background: rgba(0,0,0,.95); display: none; align-items: center; justify-content: center; }
.lightbox.open { display: flex; }
.lightbox-img { max-width: 90vw; max-height: 90vh; object-fit: contain; display: block; }
.lightbox-close { position: absolute; top: 1.5rem; right: 2rem; font-size: 2rem; color: var(--light); cursor: pointer; line-height: 1; transition: color .2s; }
.lightbox-close:hover { color: #fff; }
.lightbox-prev, .lightbox-next { position: absolute; top: 50%; transform: translateY(-50%); font-size: 2rem; color: var(--light); cursor: pointer; padding: 1rem; transition: color .2s; user-select: none; }
.lightbox-prev { left: 1rem; }
.lightbox-next { right: 1rem; }
.lightbox-prev:hover, .lightbox-next:hover { color: #fff; }
.lightbox-counter { position: absolute; bottom: 1.5rem; left: 50%; transform: translateX(-50%); font-size: .65rem; letter-spacing: .2em; text-transform: uppercase; color: var(--light); }

/* ── Gallery CTA ── */
.gallery-cta { text-align: center; padding: 4rem 2.5rem; border-top: 1px solid var(--mid); background: var(--off-black); }
.gallery-cta p { color: var(--light); font-size: .9rem; margin-bottom: 1.5rem; }

/* ── Gallery Responsive ── */
@media (max-width: 900px) {
  .page-hero { padding: 2rem 1.25rem; }
  .cat-nav { padding: 0 1.25rem; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .cat-nav a, .cat-nav-section { white-space: nowrap; }
  .gallery-section { padding: 2rem 1.25rem; }
  .masonry { columns: 2; }
}
@media (max-width: 540px) { .masonry { columns: 1; } }
