*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0}
img{display:block;max-width:100%}

/* ---------- scroll reveal (variants via data-anim, delay via --d) ---------- */
.reveal{opacity:0;transform:translateY(30px);
  transition:opacity 1s ease var(--d,0s),transform 1.15s cubic-bezier(.2,.7,.2,1) var(--d,0s),filter 1.1s ease var(--d,0s),clip-path 1.9s cubic-bezier(.5,.05,.3,1) var(--d,0s)}
.reveal[data-anim=fade]{transform:none}
.reveal[data-anim=left]{transform:translateX(-48px)}
.reveal[data-anim=right]{transform:translateX(48px)}
.reveal[data-anim=zoom]{transform:scale(.85)}
.reveal[data-anim=blur]{transform:scale(1.06);filter:blur(10px)}
.reveal[data-anim=unfold]{transform:perspective(1100px) rotateX(-78deg);transform-origin:50% 0}
.reveal[data-anim=stamp]{transform:scale(2.4) rotate(-14deg);
  transition:opacity .35s ease var(--d,0s),transform .75s cubic-bezier(.34,1.56,.64,1) var(--d,0s)}
/* handwriting sweep for script titles */
.reveal[data-anim=write]{opacity:1;transform:none;clip-path:inset(-40% 100% -40% -10%)}
/* photo window opening from the bottom */
.reveal[data-anim=unveil]{opacity:1;transform:none;clip-path:circle(0% at 50% 100%)}
.reveal.in{opacity:1;transform:none;filter:none}
.reveal[data-anim=write].in{clip-path:inset(-40% -10% -40% -10%)}
.reveal[data-anim=unveil].in{clip-path:circle(150% at 50% 100%)}

/* svg line drawing: put pathLength="1" on paths */
.draw path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2.2s ease calc(var(--d,0s) + .2s)}
.draw.in path{stroke-dashoffset:0}

/* slow cinematic zoom, starts when body gets .go */
.kb{transform:scale(1.18);transition:transform 14s cubic-bezier(.2,.6,.3,1)}
body.go .kb{transform:scale(1)}

/* countdown digit change */
[data-countdown] .flip{animation:flip .55s cubic-bezier(.2,.7,.2,1)}
@keyframes flip{from{transform:translateY(-40%);opacity:0}}

/* particles canvas */
.fx{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:40}

@media (prefers-reduced-motion:reduce){
  .reveal,.reveal[data-anim]{opacity:1!important;transform:none!important;filter:none!important;clip-path:none!important;transition:none!important}
  .draw path{stroke-dashoffset:0;transition:none}
  .kb{transform:none;transition:none}
  html{scroll-behavior:auto}
}

/* ---------- lightbox ---------- */
[data-lb]{cursor:zoom-in}
.lb{position:fixed;inset:0;z-index:100;background:rgba(10,10,10,.94);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .4s ease,visibility .4s}
.lb.open{opacity:1;visibility:visible}
.lb img{max-width:94vw;max-height:88vh;object-fit:contain;transform:scale(.92);transition:transform .5s cubic-bezier(.2,.7,.2,1),opacity .25s ease}
.lb.open img{transform:none}
.lb img.swap{opacity:0}
.lb button{position:absolute;background:none;border:0;color:#fff;font-size:40px;line-height:1;padding:16px;cursor:pointer;opacity:.85}
.lb-x{top:8px;right:8px}.lb-p{left:4px;top:50%;transform:translateY(-50%)}.lb-n{right:4px;top:50%;transform:translateY(-50%)}

form[data-rsvp] .rsvp-ok{display:none}
form[data-rsvp].sent .rsvp-ok{display:block;animation:flip .8s ease}
form[data-rsvp].sent .rsvp-fields{display:none}
