.mobile-invitation[data-motion=fade] .reveal{opacity:1;transform:none;transition:none}
.mobile-invitation[data-motion=fade][data-motion-ready] .reveal:not(.visible){opacity:0;transform:translateY(20px)}
.mobile-invitation[data-motion=fade][data-motion-ready] .reveal{transition:opacity 1.1s cubic-bezier(.2,.65,.3,1),transform 1.1s cubic-bezier(.2,.65,.3,1)}
.mobile-invitation[data-motion=fade] .cover>.eyebrow{animation:letter-rise 1.2s .1s both}
.mobile-invitation[data-motion=fade] .cover>h1{animation:letter-rise 1.5s .25s both}
.mobile-invitation[data-motion=fade] .cover>.cover-photo{animation:photo-arrive 1.8s .15s both}
.mobile-invitation[data-motion=fade] .cover>.cover-names{animation:letter-rise 1.4s .55s both}
.mobile-invitation[data-motion=fade] .cover>.cover-date{animation:letter-rise 1.4s .7s both}
.mobile-invitation[data-motion=fade] .cover>.cover-venue{animation:letter-rise 1.4s .85s both}
.mobile-invitation[data-motion=fade] .cover[data-style=fullbleed]>.cover-photo{animation:photo-settle 5s cubic-bezier(.2,.65,.3,1) both}
.mobile-invitation[data-motion=fade][data-motion-ready] .reveal.visible>.section-label{animation:letter-rise .9s .1s both}
.mobile-invitation[data-motion=fade][data-motion-ready] .reveal.visible>h2{animation:letter-rise 1s .18s both}
.mobile-invitation[data-motion=fade][data-motion-ready] .reveal.visible>.gallery>button{animation:letter-rise 1.1s both;animation-delay:var(--photo-delay,0ms)}
.mobile-invitation[data-motion=fade][data-motion-ready] .invite-footer.visible>p{animation:letter-rise 1.2s .15s both}
@keyframes letter-rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes photo-arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes photo-settle{from{opacity:.4;transform:scale(1.035)}to{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){
  .mobile-invitation[data-motion=fade] .cover>*,.mobile-invitation[data-motion=fade] .reveal *,.mobile-invitation[data-motion=fade] .invite-footer>p{animation:none!important}
  .mobile-invitation[data-motion=fade][data-motion-ready] .reveal{opacity:1;transform:none;transition:none}
}
