/* Both invitation designs share the same official homepage and remain visible after arrival. */
.invitation-comparison{position:relative;display:grid;grid-template-columns:minmax(260px,.7fr) minmax(0,1.6fr);gap:clamp(35px,4vw,72px);align-items:center;max-width:1500px;margin:0 auto 130px}
.full-comparison .invitation-copy{display:block;max-width:440px;margin:0}
.invitation-copy h2{font-size:clamp(36px,3.5vw,57px);line-height:1.1;margin:0 0 26px}
.invitation-copy .eyebrow{margin:0 0 23px}.invitation-copy>p:not(.eyebrow){font-size:15px;line-height:1.8;margin:0 0 24px}
.invitation-actions{display:flex;align-items:center;gap:18px}.invitation-actions .quiet-motion-control{margin:0}
.invitation-stage{position:relative;min-width:0;width:100%}.invitation-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:center}
.full-comparison .invitation-machine{position:relative;width:100%;min-width:0;margin:0;transform:none!important}
.full-comparison .invitation-machine>figcaption{display:block;text-align:center;font:400 12px/1.5 var(--serif);letter-spacing:.1em;text-transform:uppercase;margin:0 0 14px;padding:0;color:#003366;min-height:0}
/* One scroll value reveals both overlays together; no playback or time-based motion.
   The complete static comparison is the no-JS and reduced-motion baseline. */
.invitation-pair[data-invitation-scrub] .demo-popup,
.invitation-pair[data-invitation-scrub] .demo-popup-shade{opacity:var(--invitation-progress,1);animation:none;transition:none}
@media(max-width:1100px){.invitation-comparison{grid-template-columns:minmax(235px,.8fr) minmax(0,1.4fr);gap:30px}.invitation-pair{grid-template-columns:1fr;gap:24px}.full-comparison .invitation-machine{max-width:570px;margin:auto}}
@media(max-width:800px){.invitation-comparison{grid-template-columns:1fr;gap:32px;margin-bottom:76px}.full-comparison .invitation-copy{max-width:680px}.invitation-copy h2{font-size:clamp(36px,7vw,50px)}.invitation-pair{gap:30px}.full-comparison .invitation-machine{max-width:650px}}
@media(prefers-reduced-motion:reduce){
 .invitation-pair[data-invitation-scrub] .demo-popup,
 .invitation-pair[data-invitation-scrub] .demo-popup-shade{opacity:1;animation:none;transition:none}
}

/* A bounded local dwell lets guests see the homepage before either invitation.
   Desktop copy and laptops share a sticky top, keeping the explanation in view. */
.invitation-comparison.has-invitation-dwell{align-items:start}
.has-invitation-dwell .invitation-stage{height:var(--invitation-stage-height);align-self:start}
.has-invitation-dwell .invitation-pair{position:sticky;top:var(--invitation-stick-top)}
@media(prefers-reduced-motion:reduce){
 .has-invitation-dwell .invitation-stage{height:auto}
 .has-invitation-dwell .invitation-pair{position:static}
}

@media(min-width:801px){
 .has-invitation-dwell .invitation-copy{position:sticky;top:var(--invitation-stick-top);align-self:start}
}
@media(prefers-reduced-motion:reduce){
 .has-invitation-dwell .invitation-copy{position:static}
}
