/* Photographs arrive like prints being placed on a table. */
.wedding-gallery{perspective:1200px}
.wedding-gallery .gallery-item{--print-angle:-1.5deg;transform:rotate(var(--print-angle));transition:transform .45s cubic-bezier(.2,.75,.2,1),box-shadow .45s,opacity .7s;position:relative}
.wedding-gallery .gallery-item:nth-child(even){--print-angle:1.5deg;transform:rotate(var(--print-angle))}
.wedding-gallery .gallery-item:nth-child(3n){--print-angle:-.6deg}
.wedding-gallery .gallery-item:nth-child(5n){--print-angle:1deg}
.wedding-gallery.motion-ready .gallery-item{transition-delay:0s}
.wedding-gallery.motion-ready .gallery-item:not(.is-visible){opacity:0;transform:translateY(55px) rotate(calc(var(--print-angle) * 3)) scale(.94)}
.wedding-gallery.motion-ready .gallery-item.is-visible{opacity:1;transition-delay:var(--reveal-delay,0ms)}
.wedding-gallery .gallery-item .photo{position:relative;cursor:zoom-in;isolation:isolate}
.wedding-gallery .gallery-item img{transition:transform .8s cubic-bezier(.2,.65,.2,1);transform:scale(1);transform-origin:center}
.wedding-gallery .gallery-item .photo:after{content:'↗';display:grid;place-items:center;position:absolute;right:12px;bottom:12px;width:34px;height:34px;border-radius:50%;background:#fffefaf2;box-shadow:0 2px 10px #583a2915;font:21px Georgia,serif;opacity:.85;transform:translateY(0);transition:transform .3s,opacity .3s;pointer-events:none}
.wedding-gallery .gallery-item:after{content:attr(data-print);position:absolute;left:20px;top:20px;z-index:1;background:#fffffff0;padding:4px 9px;font:12px/1.5 'Noto Sans Thai',sans-serif;letter-spacing:.08em;pointer-events:none}
.wedding-gallery .gallery-item:focus-within{transform:translateY(-8px) rotate(0deg);box-shadow:0 18px 32px #583a2922;transition-delay:0s}
.wedding-gallery .gallery-item:focus-within img{transform:scale(1.035)}
@media(hover:hover) and (pointer:fine){
 .wedding-gallery .gallery-item:hover{z-index:2;transform:translateY(-10px) rotate(0deg) scale(1.025);box-shadow:0 24px 40px #583a2928;transition-delay:0s}
 .wedding-gallery .gallery-item:hover img{transform:scale(1.045)}
 .wedding-gallery .gallery-item:hover .photo:after{opacity:1;transform:translateY(-3px)}
}
.wedding-gallery .gallery-item:active{transform:scale(.98) rotate(0deg);transition-duration:.15s;transition-delay:0s}
#lightbox[open]{animation:gallery-open .25s ease-out}
#lightbox button{transition:transform .2s,box-shadow .2s}
#lightbox button:active{scale:.92}
#lightbox img{border:6px solid white;box-shadow:0 20px 70px #0005}
@keyframes gallery-open{from{opacity:0}to{opacity:1}}
@media(max-width:700px){
 .wedding-gallery .gallery-item:after{top:13px;left:13px;font-size:10px;padding:3px 6px}
 .wedding-gallery .gallery-item .photo:after{right:8px;bottom:8px;width:28px;height:28px;font-size:18px}
 .wedding-gallery.motion-ready .gallery-item:not(.is-visible){transform:translateY(36px) rotate(calc(var(--print-angle) * 2)) scale(.96)}
 #lightbox img{border-width:4px}
}
@media(prefers-reduced-motion:reduce){
 .wedding-gallery .gallery-item,.wedding-gallery .gallery-item img,.wedding-gallery .gallery-item .photo:after,#lightbox[open],#lightbox button{animation:none!important;transition:none!important}
 .wedding-gallery.motion-ready .gallery-item:not(.is-visible){opacity:1;transform:rotate(var(--print-angle))}
 .wedding-gallery .gallery-item:hover,.wedding-gallery .gallery-item:focus-within,.wedding-gallery .gallery-item:active{transform:rotate(var(--print-angle))}
 .wedding-gallery .gallery-item:hover img,.wedding-gallery .gallery-item:focus-within img{transform:none}
}