body.gallery-page { background: var(--bg); }

.gp-hero { background:var(--bg-soft); border-bottom:1px solid var(--border-s); padding:46px 64px 30px; text-align:center; }
.gp-hero .sec-eyebrow { margin-bottom:10px; }
.gp-hero h1 { font-size:34px; font-weight:800; letter-spacing:-.02em; }
.gp-hero p { font-size:14.5px; color:var(--text-2); margin-top:8px; }

/* Thanh pill: KHÔNG ép chia đều / KHÔNG bẻ dòng — mỗi pill giữ đúng bề ngang chữ; hẹp thì cuộn ngang. */
.gp-tabs { display:flex; flex-wrap:nowrap; gap:10px; justify-content:flex-start; overflow-x:auto; -webkit-overflow-scrolling:touch; padding:22px 64px 4px; max-width:1280px; margin:0 auto; }
.gp-tab { flex:0 0 auto; white-space:nowrap; font-size:13.5px; font-weight:700; color:var(--text-2); background:#fff; border:1px solid var(--border-s); padding:9px 18px; border-radius:99px; cursor:pointer; transition:.18s; }
.gp-tab:hover { border-color:var(--red-border); color:var(--red); }
.gp-tab.on { background:var(--red); color:#fff; border-color:var(--red); }
.gp-tab b { font-weight:700; opacity:.7; margin-left:4px; }

.gp-grid { max-width:1280px; margin:24px auto; padding:0 64px 64px; display:grid; grid-template-columns:repeat(5,1fr); gap:14px; }
.g { position:relative; aspect-ratio:1/1; border-radius:var(--r-m); overflow:hidden; box-shadow:var(--sh-xs); cursor:pointer; }
.g img { width:100%; height:100%; object-fit:cover; transition:transform .45s; }
.g:hover img { transform:scale(1.06); }
.g::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,0) 58%,rgba(0,0,0,.66)); opacity:0; transition:.2s; }
.g:hover::after { opacity:1; }
.g-cap { position:absolute; left:12px; right:12px; bottom:11px; z-index:2; color:#fff; font-size:11.5px; font-weight:600; opacity:0; transform:translateY(6px); transition:.2s; text-shadow:0 1px 5px rgba(0,0,0,.6); }
.g:hover .g-cap { opacity:1; transform:none; }
.g-cat { position:absolute; top:9px; left:9px; z-index:2; font-size:9.5px; font-weight:700; letter-spacing:.03em; text-transform:uppercase; color:#fff; background:rgba(0,0,0,.5); backdrop-filter:blur(4px); padding:3px 8px; border-radius:99px; }

.gp-pager { margin:-40px auto 56px; }

/* lightbox cũ (gp-lb) đã thay bằng album-viewer.css (av-grid + rs-lb) */

@media (max-width:980px){
  .gp-hero,.gp-tabs,.gp-grid { padding-left:20px; padding-right:20px; }
  .gp-grid { grid-template-columns:repeat(2,1fr); }
  .gp-hero h1 { font-size:26px; }
}