/* The album follows the invitation's type, spacing and white content surface. */
.pw-section {
  --pw-green: #355640;
  --pw-ink: #383838;
  --pw-height: 480px;
  --pw-gutter: max(24px, calc((100% - 1392px) / 2));
  position: relative;
  z-index: 5;
  width: 100%;
  min-width: 0;
  padding: 96px 0;
  background: #fff;
  overflow: clip;
  color: var(--pw-ink);
  font-family: "Manrope", sans-serif;
}
.pw-section * { box-sizing: border-box; }
.pw-heading { padding: 0 24px; margin: 0 auto 48px; text-align: center; }
.pw-eyebrow {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin: 0 0 16px;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
}
.pw-eyebrow::before, .pw-eyebrow::after {
  content: "";
  width: 20px;
  height: 1px;
  background: currentColor;
  opacity: .7;
}
.pw-heading h2 {
  max-width: 720px;
  margin: 0 auto;
  font-family: "Cormorant Garamond", serif;
  font-size: 48px;
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1.4;
}
.pw-rail {
  position: relative;
  display: flex;
  align-items: center;
  gap: 24px;
  height: var(--pw-height);
  padding-inline: var(--pw-gutter);
  overflow: hidden;
  scroll-padding-inline: var(--pw-gutter);
  overscroll-behavior-x: contain;
  touch-action: pan-y pinch-zoom;
  cursor: grab;
}
.pw-rail.is-dragging { cursor: grabbing; }
.pw-photo {
  position: relative;
  display: block;
  flex: 0 0 auto;
  width: calc(var(--pw-height) * var(--pw-ratio));
  max-width: calc(100vw - 72px);
  aspect-ratio: var(--pw-ratio);
  border-radius: 4px;
  overflow: hidden;
  background: #edf0eb;
  cursor: inherit;
  -webkit-user-drag: none;
  user-select: none;
  -webkit-user-select: none;
}
.pw-photo > img, .pw-photo > noscript > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  -webkit-user-drag: none;
}
.pw-photo > img:not([src]) { visibility: hidden; }
.pw-photo:has(noscript > img) > img:not([src]) { display: none; }
.pw-photo.has-error::after {
  content: "Chưa tải được ảnh";
  position: absolute;
  inset: 0;
  display: grid;
  place-content: center;
  font-size: 13px;
  color: var(--pw-green);
}
.pw-photo:focus-visible, .pw-rail:focus-visible {
  outline: 2px solid var(--pw-green);
  outline-offset: -4px;
}
@media (min-width: 810px) and (max-width: 1199px) {
  .pw-section { padding: 72px 0; --pw-height: 420px; }
  .pw-heading h2 { font-size: 40px; }
}
@media (max-width: 809px) {
  .pw-section { padding: 64px 0; --pw-height: min(400px, 58svh); }
  .pw-heading h2 { font-size: 32px; max-width: 350px; }
  .pw-heading { margin-bottom: 32px; }
  .pw-rail { gap: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .pw-rail { scroll-behavior: auto; }
}