.hz52-albums {
  display: grid;
  column-gap: clamp(24px, 4vw, 62px);
  row-gap: clamp(28px, 5vw, 66px);
  grid-template-columns: repeat(var(--hz52-album-columns, 3), minmax(0, 1fr));
  width: 100%;
}
.hz52-album-card { margin: 0; }
.hz52-album-open {
  aspect-ratio: 3 / 2;
  background: #253b49;
  border: 0;
  box-shadow: none;
  color: #fff;
  cursor: pointer;
  display: block;
  font: inherit;
  overflow: hidden;
  padding: 0;
  position: relative;
  text-align: left;
  transition: transform .2s ease, box-shadow .2s ease;
  width: 100%;
}
.hz52-album-open:hover, .hz52-album-open:focus-visible {
  box-shadow: 0 10px 26px rgba(7, 52, 81, .22);
  transform: translateY(-3px);
}
.hz52-album-open::after {
  background: linear-gradient(to bottom, rgba(2, 16, 24, 0) 25%, rgba(2, 16, 24, .15) 48%, rgba(2, 16, 24, .94) 100%);
  content: '';
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 1;
}
.hz52-album-image { background: #e8e4dc; display: block; height: 100%; overflow: hidden; width: 100%; }
.hz52-album-cover { height: 100%; object-fit: cover; transition: transform .35s ease; width: 100%; }
.hz52-album-open:hover .hz52-album-cover { transform: scale(1.025); }
.hz52-album-placeholder { display: block; height: 100%; }
.hz52-album-overlay {
  bottom: clamp(14px, 2vw, 25px);
  display: flex;
  flex-direction: column;
  left: clamp(14px, 2vw, 24px);
  position: absolute;
  right: clamp(14px, 2vw, 24px);
  z-index: 2;
}
.hz52-album-title,
.hz52-album-year {
  color: #fff;
  display: block;
  font-size: clamp(1rem, 1.5vw, 1.28rem);
  font-weight: 700;
  line-height: 1.15;
  text-transform: uppercase;
}
.hz52-album-year { margin-top: 3px; }
.hz52-album-visit {
  align-items: center;
  color: #9cbd79;
  display: inline-flex;
  font-size: clamp(.86rem, 1.15vw, 1rem);
  font-weight: 500;
  gap: 8px;
  margin-top: 15px;
}
.hz52-album-visit span { font-size: 1.35em; line-height: .8; transition: transform .2s ease; }
.hz52-album-open:hover .hz52-album-visit span { transform: translateX(4px); }
.hz52-album-dialog[hidden], .hz52-lightbox[hidden] { display: none; }
.hz52-album-dialog {
  align-items: flex-start;
  background: rgba(4, 28, 44, .78);
  display: flex;
  inset: 0;
  justify-content: center;
  overflow-y: auto;
  padding: clamp(12px, 4vw, 50px);
  position: fixed;
  z-index: 999999;
}
.hz52-dialog-panel { background: #fff; max-width: 1250px; min-height: 200px; padding: clamp(18px, 4vw, 40px); width: 100%; }
.hz52-dialog-header { align-items: flex-start; display: flex; gap: 20px; justify-content: space-between; }
.hz52-dialog-header h2 { color: #073451; font-size: clamp(1.6rem, 4vw, 2.6rem); margin: 0; }
.hz52-dialog-header p { color: #66804e; margin: 7px 0 0; }
.hz52-dialog-description { font-size: 1.05rem; line-height: 1.6; max-width: 850px; }
.hz52-dialog-close, .hz52-lightbox-close {
  background: #073451;
  border: 0;
  border-radius: 50%;
  color: #fff;
  cursor: pointer;
  flex: 0 0 auto;
  font-size: 32px;
  height: 48px;
  line-height: 1;
  width: 48px;
}
.hz52-photo-grid { columns: 3 260px; column-gap: 14px; margin-top: 24px; }
.hz52-photo-link { break-inside: avoid; display: block; margin: 0 0 14px; }
.hz52-photo-link img { display: block; height: auto; width: 100%; }
.hz52-modal-open { overflow: hidden; }
.hz52-lightbox {
  align-items: center;
  background: rgba(0, 0, 0, .94);
  display: flex;
  inset: 0;
  justify-content: center;
  padding: 60px 70px;
  position: fixed;
  z-index: 1000000;
}
.hz52-lightbox img { max-height: calc(100vh - 90px); max-width: 100%; object-fit: contain; }
.hz52-lightbox-close { position: absolute; right: 16px; top: 16px; }
.hz52-lightbox-prev, .hz52-lightbox-next {
  background: #fff;
  border: 0;
  border-radius: 50%;
  color: #073451;
  cursor: pointer;
  font-size: 42px;
  height: 52px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 52px;
}
.hz52-lightbox-prev { left: 12px; }
.hz52-lightbox-next { right: 12px; }
@media (max-width: 900px) { .hz52-albums { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 580px) {
  .hz52-albums { grid-template-columns: 1fr; }
  .hz52-album-open { aspect-ratio: 3 / 2; }
  .hz52-album-dialog { padding: 0; }
  .hz52-dialog-panel { min-height: 100vh; }
  .hz52-lightbox { padding: 60px 45px; }
  .hz52-lightbox-prev, .hz52-lightbox-next { height: 42px; width: 42px; }
}
@media (prefers-reduced-motion: reduce) {
  .hz52-album-open, .hz52-album-cover, .hz52-album-visit span { transition: none; }
}
