/* ========================================================
   SCROLL REVEAL ANIMATIONS
   Duration: 5s — fade + slide trái↔phải rõ trên text
   ======================================================== */

:root {
  --reveal-duration: 5s;
  --reveal-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --reveal-slide-x: 120px;
}

/* Base: mọi .reveal-block ẩn cho đến khi có .visible */
.reveal-block,
.reveal-item {
  opacity: 0;
  transform: translateY(48px);
  transition:
    opacity var(--reveal-duration) var(--reveal-ease),
    transform var(--reveal-duration) var(--reveal-ease);
  will-change: opacity, transform;
}

.reveal-block.reveal-left,
.reveal-item.reveal-left {
  transform: translateX(calc(-1 * var(--reveal-slide-x)));
}

.reveal-block.reveal-right,
.reveal-item.reveal-right {
  transform: translateX(var(--reveal-slide-x));
}

.reveal-block.reveal-up,
.reveal-item.reveal-up {
  transform: translateY(48px);
}

.reveal-block.reveal-scale,
.reveal-item.reveal-scale {
  transform: translateY(36px) scale(0.92);
}

.reveal-block.visible,
.reveal-item.visible {
  opacity: 1;
  transform: none;
}

/* Inline text cần block/inline-block để transform L↔R hoạt động */
span.reveal-item,
.couple-side-family.reveal-item,
.couple-side-role.reveal-item,
.couple-side-name.reveal-item,
.brand-footer-text.reveal-item {
  display: inline-block;
}

/* Stagger children inside a visible block */
.reveal-block.visible .reveal-stagger > *:nth-child(1) { transition-delay: 0.1s; }
.reveal-block.visible .reveal-stagger > *:nth-child(2) { transition-delay: 0.25s; }
.reveal-block.visible .reveal-stagger > *:nth-child(3) { transition-delay: 0.4s; }
.reveal-block.visible .reveal-stagger > *:nth-child(4) { transition-delay: 0.55s; }
.reveal-block.visible .reveal-stagger > *:nth-child(5) { transition-delay: 0.7s; }
.reveal-block.visible .reveal-stagger > *:nth-child(6) { transition-delay: 0.85s; }

.reveal-stagger > * {
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity var(--reveal-duration) var(--reveal-ease),
    transform var(--reveal-duration) var(--reveal-ease);
}

.reveal-block.visible .reveal-stagger > *,
.reveal-stagger.visible > * {
  opacity: 1;
  transform: none;
}

/* Album thumbs: trái / phải xen kẽ */
.album-grid-2x2.reveal-block .album-thumb-item,
.album-grid-2x2 .album-thumb-item {
  opacity: 0;
  transition:
    opacity var(--reveal-duration) var(--reveal-ease),
    transform var(--reveal-duration) var(--reveal-ease);
}

.album-grid-2x2 .album-thumb-item:nth-child(odd) {
  transform: translateX(-70px) scale(0.94);
}

.album-grid-2x2 .album-thumb-item:nth-child(even) {
  transform: translateX(70px) scale(0.94);
}

.album-grid-2x2.visible .album-thumb-item:nth-child(1) {
  opacity: 1;
  transform: none;
  transition-delay: 0.15s;
}
.album-grid-2x2.visible .album-thumb-item:nth-child(2) {
  opacity: 1;
  transform: none;
  transition-delay: 0.35s;
}
.album-grid-2x2.visible .album-thumb-item:nth-child(3) {
  opacity: 1;
  transform: none;
  transition-delay: 0.55s;
}
.album-grid-2x2.visible .album-thumb-item:nth-child(4) {
  opacity: 1;
  transform: none;
  transition-delay: 0.75s;
}

/* Timeline: text (.tl-copy) trượt L↔R — không animate cả row/dot */
.timeline-wavy-container .tl-copy.reveal-item {
  --reveal-slide-x: 100px;
}
.timeline-wavy-container .timeline-row-c3:nth-child(1) .tl-copy.reveal-item,
.timeline-wavy-container .timeline-row-c3:nth-child(2) .tl-copy.reveal-item { transition-delay: 0.12s; }
.timeline-wavy-container .timeline-row-c3:nth-child(3) .tl-copy.reveal-item { transition-delay: 0.35s; }
.timeline-wavy-container .timeline-row-c3:nth-child(4) .tl-copy.reveal-item { transition-delay: 0.55s; }
.timeline-wavy-container .timeline-row-c3:nth-child(5) .tl-copy.reveal-item { transition-delay: 0.75s; }
.timeline-wavy-container .timeline-row-c3:nth-child(6) .tl-copy.reveal-item,
.timeline-wavy-container .timeline-row-c3:nth-child(n+7) .tl-copy.reveal-item { transition-delay: 0.95s; }

/* Ảnh nhà trai / nhà gái — trượt rõ khi scroll */
.couple-side-photo.reveal-item {
  --reveal-slide-x: 90px;
}
.couple-side-photo.reveal-item:not(.visible) {
  opacity: 0;
}
.couple-side-row--groom .couple-side-photo.reveal-item:not(.visible) {
  transform: translateX(calc(-1 * var(--reveal-slide-x)));
}
.couple-side-row--bride .couple-side-photo.reveal-item:not(.visible) {
  transform: translateX(var(--reveal-slide-x));
}

/* Countdown boxes */
.countdown-grid-c3 .countdown-box-c3 {
  opacity: 0;
  transform: translateY(30px) scale(0.88);
  transition:
    opacity var(--reveal-duration) var(--reveal-ease),
    transform var(--reveal-duration) var(--reveal-ease);
}

.countdown-block-c3.visible .countdown-box-c3:nth-child(1) { opacity: 1; transform: none; transition-delay: 0.15s; }
.countdown-block-c3.visible .countdown-box-c3:nth-child(2) { opacity: 1; transform: none; transition-delay: 0.3s; }
.countdown-block-c3.visible .countdown-box-c3:nth-child(3) { opacity: 1; transform: none; transition-delay: 0.45s; }
.countdown-block-c3.visible .countdown-box-c3:nth-child(4) { opacity: 1; transform: none; transition-delay: 0.6s; }

/* Parents L/R */
.parents-grid-c1.reveal-block .parents-col:first-child {
  opacity: 0;
  transform: translateX(-40px);
  transition:
    opacity var(--reveal-duration) var(--reveal-ease) 0.2s,
    transform var(--reveal-duration) var(--reveal-ease) 0.2s;
}
.parents-grid-c1.reveal-block .parents-col:last-child {
  opacity: 0;
  transform: translateX(40px);
  transition:
    opacity var(--reveal-duration) var(--reveal-ease) 0.35s,
    transform var(--reveal-duration) var(--reveal-ease) 0.35s;
}
.parents-grid-c1.reveal-block.visible .parents-col:first-child,
.parents-grid-c1.reveal-block.visible .parents-col:last-child,
.parents-grid-c1.visible .parents-col {
  opacity: 1;
  transform: none;
}

/* Couple names L/R — chỉ opacity để không phá layout transform sẵn có */
.couple-names-c1.reveal-block .couple-person:first-child .full-name,
.couple-names-c1.reveal-block .couple-person:last-child .full-name,
.couple-names-c1.reveal-block .amp-symbol {
  opacity: 0;
  transition: opacity var(--reveal-duration) var(--reveal-ease);
}
.couple-names-c1.reveal-block.visible .couple-person:first-child .full-name,
.couple-names-c1.visible .couple-person:first-child .full-name { opacity: 1; transition-delay: 0.2s; }
.couple-names-c1.reveal-block.visible .amp-symbol,
.couple-names-c1.visible .amp-symbol { opacity: 1; transition-delay: 0.35s; }
.couple-names-c1.reveal-block.visible .couple-person:last-child .full-name,
.couple-names-c1.visible .couple-person:last-child .full-name { opacity: 1; transition-delay: 0.5s; }

/* Intro names: fade cùng block cha — không ẩn riêng để tránh bị kẹt opacity:0 */

/* Wish items — từng thẻ lời chúc tự reveal */
.wishes-stream-c3 .wish-item-c3.reveal-item:nth-child(1) { transition-delay: 0.1s; }
.wishes-stream-c3 .wish-item-c3.reveal-item:nth-child(2) { transition-delay: 0.25s; }
.wishes-stream-c3 .wish-item-c3.reveal-item:nth-child(3) { transition-delay: 0.4s; }
.wishes-stream-c3 .wish-item-c3.reveal-item:nth-child(4) { transition-delay: 0.55s; }
.wishes-stream-c3 .wish-item-c3.reveal-item:nth-child(n+5) { transition-delay: 0.7s; }

/* Dresscode swatches — từng item tự reveal */
.dresscode-palette .dresscode-item.reveal-item:nth-child(1) { transition-delay: 0.1s; }
.dresscode-palette .dresscode-item.reveal-item:nth-child(2) { transition-delay: 0.25s; }
.dresscode-palette .dresscode-item.reveal-item:nth-child(3) { transition-delay: 0.4s; }
.dresscode-palette .dresscode-item.reveal-item:nth-child(4) { transition-delay: 0.55s; }

/* Couple sides — stagger nhẹ khi các text/ảnh cùng vào viewport */
.couple-side-row--groom .couple-side-photo.reveal-item { transition-delay: 0.05s; }
.couple-side-row--groom .couple-side-family.reveal-item { transition-delay: 0.15s; }
.couple-side-row--groom .groom-parents-name.reveal-item { transition-delay: 0.28s; }
.couple-side-row--groom .groom-parents-addr.reveal-item { transition-delay: 0.4s; }
.couple-side-row--groom .couple-side-role.reveal-item { transition-delay: 0.52s; }
.couple-side-row--groom .couple-side-name.reveal-item { transition-delay: 0.65s; }

.couple-side-row--bride .couple-side-family.reveal-item { transition-delay: 0.15s; }
.couple-side-row--bride .bride-parents-name.reveal-item { transition-delay: 0.28s; }
.couple-side-row--bride .bride-parents-addr.reveal-item { transition-delay: 0.4s; }
.couple-side-row--bride .couple-side-role.reveal-item { transition-delay: 0.52s; }
.couple-side-row--bride .couple-side-name.reveal-item { transition-delay: 0.65s; }
.couple-side-row--bride .couple-side-photo.reveal-item { transition-delay: 0.05s; }

/* Ceremony / countdown / venue / gallery / gift text stagger */
.info-white-panel--ceremony > .reveal-item:nth-child(1) { transition-delay: 0.05s; }
.info-white-panel--ceremony > .reveal-item:nth-child(2) { transition-delay: 0.18s; }
.info-white-panel--ceremony > .reveal-item:nth-child(3) { transition-delay: 0.28s; }
.info-white-panel--ceremony > .reveal-item:nth-child(4) { transition-delay: 0.4s; }
.info-white-panel--ceremony > .reveal-item:nth-child(5) { transition-delay: 0.52s; }
.info-white-panel--ceremony > .reveal-item:nth-child(6) { transition-delay: 0.64s; }
.info-white-panel--ceremony > .reveal-item:nth-child(7) { transition-delay: 0.78s; }

.countdown-card-design4 > .reveal-item:nth-child(1) { transition-delay: 0.05s; }
.countdown-grid-design4 .cd-box-design4.reveal-item:nth-child(1) { transition-delay: 0.2s; }
.countdown-grid-design4 .cd-box-design4.reveal-item:nth-child(3) { transition-delay: 0.35s; }
.countdown-grid-design4 .cd-box-design4.reveal-item:nth-child(5) { transition-delay: 0.5s; }
.countdown-grid-design4 .cd-box-design4.reveal-item:nth-child(7) { transition-delay: 0.65s; }

.gallery-thumbs-row .gallery-thumb-item.reveal-item:nth-child(1) { transition-delay: 0.05s; }
.gallery-thumbs-row .gallery-thumb-item.reveal-item:nth-child(2) { transition-delay: 0.15s; }
.gallery-thumbs-row .gallery-thumb-item.reveal-item:nth-child(3) { transition-delay: 0.25s; }
.gallery-thumbs-row .gallery-thumb-item.reveal-item:nth-child(4) { transition-delay: 0.35s; }
.gallery-thumbs-row .gallery-thumb-item.reveal-item:nth-child(5) { transition-delay: 0.45s; }
.gallery-thumbs-row .gallery-thumb-item.reveal-item:nth-child(6) { transition-delay: 0.55s; }

/* Reception texts (nhà trai / nhà gái): reveal từng dòng, không animate cả card */
.info-white-panel--reception .reception-header-c2 > .reveal-item:nth-child(1) { transition-delay: 0.05s; }
.info-white-panel--reception .reception-header-c2 > .reveal-item:nth-child(2) { transition-delay: 0.2s; }
.info-white-panel--reception .reception-header-c2 > .reveal-item:nth-child(3) { transition-delay: 0.35s; }
.info-white-panel--reception .reception-header-c2 > .reveal-item:nth-child(4) { transition-delay: 0.5s; }
.info-white-panel--reception .reception-header-c2 > .reveal-item:nth-child(5) { transition-delay: 0.65s; }
.info-white-panel--reception .reception-venue-summary > .reveal-item:nth-child(1) { transition-delay: 0.8s; }
.info-white-panel--reception .reception-venue-summary > .reveal-item:nth-child(2) { transition-delay: 0.95s; }

#reception-bride .bride-reception-card > .reveal-item:nth-child(1) { transition-delay: 0.05s; }
#reception-bride .bride-reception-card > .reveal-item:nth-child(2) { transition-delay: 0.2s; }
#reception-bride .bride-reception-card > .reveal-item:nth-child(3) { transition-delay: 0.35s; }
#reception-bride .bride-reception-card > .reveal-item:nth-child(4) { transition-delay: 0.5s; }
#reception-bride .bride-reception-card > .reveal-item:nth-child(5) { transition-delay: 0.65s; }
#reception-bride .bride-reception-card > .reveal-item:nth-child(6) { transition-delay: 0.8s; }
#reception-bride .rb-venue > .reveal-item:nth-child(1) { transition-delay: 0.95s; }
#reception-bride .rb-venue > .reveal-item:nth-child(2) { transition-delay: 1.1s; }
#reception-bride .rb-venue > .reveal-item:nth-child(3) { transition-delay: 1.25s; }

/* Note: không tắt animation theo prefers-reduced-motion —
   thiệp cưới chủ đích dùng scroll reveal 5s làm hiệu ứng chính. */
