/* Thư viện ảnh / chi tiết album — tinh thần Cổng Tỉnh uỷ, theo tông PublicTheme */
.gallery-page__intro-inner {
  position: relative;
  padding-left: 1rem;
  border-left: 4px solid var(--site-accent, #2563eb);
}
.gallery-page__eyebrow { letter-spacing: .12em; color: var(--site-title, #0c4a6e); opacity: .75; }
.gallery-page__title { letter-spacing: -.02em; color: var(--site-title, #0c4a6e); }
.gallery-page__lead { font-size: .95rem; line-height: 1.55; color: #64748b; }
.gallery-page__rule {
  display: block; width: 4rem; height: 3px; margin-top: 1.25rem; border-radius: 2px;
  background: linear-gradient(90deg, var(--site-accent, #2563eb), var(--site-section-to, #1d4ed8));
}

.gallery-grid-3d [class*="col-"],
.album-gallery-3d [class*="col-"] { perspective: 1180px; }
.gallery-album-scene, .album-tile-scene { transform-style: preserve-3d; }

.gallery-album-card {
  --tilt-x: 0deg; --tilt-y: 0deg; --lift: 0px; --push-z: 0px;
  border-radius: 1rem; background: transparent; border: none;
  transform-style: preserve-3d;
  transform: perspective(940px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) translateZ(var(--push-z)) translateY(var(--lift));
  transition: transform .45s cubic-bezier(.22,1,.36,1), box-shadow .45s ease;
}
.gallery-album-scene:hover .gallery-album-card,
.gallery-album-scene:focus-within .gallery-album-card {
  --lift: -10px; --push-z: 20px;
  filter: drop-shadow(0 1.1rem 2rem var(--site-section-glow, rgba(37,99,235,.14)));
}
.gallery-album-card__link { color: inherit; display: block; height: 100%; }
.gallery-album-card__shell {
  transform-style: preserve-3d; isolation: isolate; background: #fff;
  border: 1px solid var(--site-section-border-soft, rgba(37,99,235,.12));
  box-shadow: 0 4px 24px rgba(15,23,42,.06);
}
.gallery-album-card__media {
  position: relative; aspect-ratio: 5 / 4; overflow: hidden;
  background: var(--site-section-tint, #eff6ff);
}
.gallery-album-card__img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .6s cubic-bezier(.22,1,.36,1);
}
.gallery-album-scene:hover .gallery-album-card__img,
.gallery-album-scene:focus-within .gallery-album-card__img { transform: scale(1.08); }
.gallery-album-card__veil {
  position: absolute; inset: 0; pointer-events: none; opacity: 0;
  background: linear-gradient(to top, rgba(15,23,42,.5) 0%, transparent 70%);
  transition: opacity .4s ease;
}
.gallery-album-scene:hover .gallery-album-card__veil,
.gallery-album-scene:focus-within .gallery-album-card__veil { opacity: 1; }
.gallery-album-card__glare {
  --glare-x: 50%; --glare-y: 40%;
  position: absolute; inset: -32%; pointer-events: none; opacity: 0; z-index: 3;
  background: radial-gradient(ellipse 52% 44% at var(--glare-x) var(--glare-y), rgba(255,255,255,.48) 0%, transparent 60%);
  mix-blend-mode: soft-light;
}
.gallery-album-scene:hover .gallery-album-card__glare { opacity: .7; }
.gallery-album-card__cta {
  position: absolute; left: 50%; top: 50%; z-index: 2; white-space: nowrap;
  padding: .5rem 1rem; font-size: .8rem; font-weight: 600; color: #fff;
  background: rgba(255,255,255,.22); border: 1px solid rgba(255,255,255,.45); border-radius: 2rem;
  opacity: 0; pointer-events: none;
  transform: translate(-50%,-50%) scale(.9);
  transition: opacity .35s ease, transform .4s ease;
}
.gallery-album-scene:hover .gallery-album-card__cta,
.gallery-album-scene:focus-within .gallery-album-card__cta { opacity: 1; transform: translate(-50%,-50%) scale(1); }
.gallery-album-card__body {
  padding: 1rem 1rem 1.15rem; text-align: center;
  background: linear-gradient(180deg, #fff 0%, #fafcfe 100%);
  border-top: 1px solid var(--site-section-border-soft, rgba(37,99,235,.08));
}
.gallery-album-card__title {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  line-height: 1.4; color: var(--site-title, #0c4a6e);
}
.gallery-album-card__hint { display: block; margin-top: .35rem; color: #7b8fa8; }

.album-tile {
  --tilt-x: 0deg; --tilt-y: 0deg; --lift: 0px; --push-z: 0px;
  cursor: pointer; background: #fff;
  border: 1px solid var(--site-section-border-soft, rgba(37,99,235,.14)) !important;
  transform-style: preserve-3d;
  transform: perspective(960px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) translateZ(var(--push-z)) translateY(var(--lift));
  transition: transform .45s cubic-bezier(.22,1,.36,1), box-shadow .45s ease;
}
.album-tile-scene:hover .album-tile,
.album-tile-scene:focus-within .album-tile {
  --lift: -10px; --push-z: 22px;
  box-shadow: 0 1.1rem 2.2rem rgba(15,23,42,.12);
}
.album-tile__ratio { aspect-ratio: 4 / 3; position: relative; overflow: hidden; }
.album-tile__img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s ease; }
.album-tile-scene:hover .album-tile__img { transform: scale(1.07); }
.album-tile__gradient {
  position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(to top, rgba(15,23,42,.78) 0%, transparent 68%);
}
.album-tile__glare {
  --glare-x: 50%; --glare-y: 42%;
  position: absolute; inset: -35%; pointer-events: none; opacity: 0; z-index: 3;
  background: radial-gradient(ellipse 55% 45% at var(--glare-x) var(--glare-y), rgba(255,255,255,.5) 0%, transparent 62%);
  mix-blend-mode: soft-light;
}
.album-tile-scene:hover .album-tile__glare { opacity: .75; }
.album-tile__zoom {
  position: absolute; top: .75rem; right: .75rem; z-index: 4; opacity: 0;
  transition: opacity .3s ease;
}
.album-tile-scene:hover .album-tile__zoom { opacity: 1; }
.album-tile__zoom-inner {
  display: flex; align-items: center; justify-content: center;
  width: 2.5rem; height: 2.5rem; border-radius: 50%;
  background: rgba(255,255,255,.88); color: var(--site-accent, #2563eb);
  box-shadow: 0 4px 14px rgba(15,23,42,.2);
}
.album-tile__label {
  position: absolute; left: 0; right: 0; bottom: 0; padding: .65rem .85rem .75rem; z-index: 2; pointer-events: none;
}
.album-tile__label-text {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  font-size: .8rem; font-weight: 500; line-height: 1.35; color: #fff;
  text-shadow: 0 1px 6px rgba(15,23,42,.55);
}

.album-lightbox-content { background: linear-gradient(165deg, #f7fafc 0%, #eef4fb 100%) !important; }
.album-lightbox-dialog { max-width: min(1140px, 96vw); }
.album-lightbox-stage { min-height: min(52vh, 420px); }
.album-lightbox-img {
  max-height: min(72vh, 820px); width: auto; max-width: 100%; object-fit: contain;
  box-shadow: 0 12px 40px rgba(15,23,42,.16);
  transition: opacity .45s ease;
}
.album-lightbox-img.is-switching { opacity: .35; }
.album-lightbox-caption { max-width: 42rem; line-height: 1.45; }
.album-lightbox-nav {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 5;
  width: 2.75rem; height: 2.75rem; border: 1px solid var(--site-section-border-soft, rgba(37,99,235,.22));
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  color: var(--site-accent, #2563eb); background: rgba(255,255,255,.92);
}
.album-lightbox-nav--prev { left: .35rem; }
.album-lightbox-nav--next { right: .35rem; }
.album-thumb-strip {
  display: flex; gap: .5rem; overflow-x: auto; padding: .35rem .25rem .5rem;
}
.album-thumb-strip img {
  flex: 0 0 auto; width: 88px; height: 66px; object-fit: cover; border-radius: .35rem;
  cursor: pointer; border: 2px solid transparent; opacity: .72;
}
.album-thumb-strip img.active {
  opacity: 1; border-color: var(--site-accent, #2563eb);
}

@media (prefers-reduced-motion: reduce) {
  .gallery-album-card, .album-tile, .gallery-album-card__img, .album-tile__img {
    transition: none !important; transform: none !important;
  }
}
