/* Anticipation, opening, reveal, then quieter motion through the story. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.atmosphere{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.intro{overflow:hidden;isolation:isolate;transition:opacity .7s,visibility .7s,transform .9s cubic-bezier(.76,0,.24,1);transform-origin:50% 50%}
.intro>p,.intro>button,.envelope{z-index:2}
.intro-halo{position:absolute;inset:8%;border:1px solid #d5b47826;border-radius:50%;transform:scale(.85);animation:halo-arrive 2s ease-out both}
.intro-halo:before,.intro-halo:after{content:'';position:absolute;inset:18px;border:1px solid #d5b47818;border-radius:50%}
.intro-halo:after{inset:38px}
.envelope{animation:envelope-float 5s ease-in-out infinite;transform-style:preserve-3d}
.seal{animation:seal-glow 2.7s ease-in-out infinite}
.intro .eyebrow{animation:soft-arrive 1.2s .1s both}
.intro-note{animation:soft-arrive 1.2s .45s both}
.intro .text-button{animation:soft-arrive 1.2s .65s both}
.intro.opening .envelope{animation:envelope-open 2.3s cubic-bezier(.22,1,.36,1) both}
.intro.opening .seal{animation:seal-release .5s ease-in forwards}
.intro.opening .flap{transition:transform .9s .2s cubic-bezier(.22,1,.36,1);transform:rotateX(180deg)}
.intro.opening .letter{transition:transform 1.2s .65s cubic-bezier(.22,1,.36,1);transform:translateY(-145px) rotate(-3deg);box-shadow:0 0 50px #ffefcc50}
.intro.opening .intro-halo{animation:halo-bloom 2.3s both}
.intro.opening .intro-note,.intro.opening .text-button{opacity:0;transition:opacity .3s}
.intro.departing{transform:scale(1.2);opacity:0;pointer-events:none}
.hero{isolation:isolate;background:radial-gradient(ellipse at 50% 30%,#783b45 0,#4b1728 50%,#2f1020 100%)}
.hero:after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse,transparent 35%,#19061360);z-index:-1}
.hero h1,.hero .prelude,.hero .eyebrow,.hero-bottom{transform:translateY(var(--hero-y,0px));opacity:var(--hero-opacity,1)}
.hero-border{transform:scale(.88);opacity:0}
.entered .hero-border{animation:arch-reveal 2.4s .1s cubic-bezier(.22,1,.36,1) forwards}
.name,.entered .name{opacity:1;filter:none;transform:none;transition:none;perspective:600px}
.glyph{display:inline-block;opacity:0;transform:translateY(60px) rotateX(-70deg) rotateZ(5deg);transform-origin:50% 100%;filter:blur(5px)}
.entered .glyph{animation:glyph-reveal 1.35s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(.2s + var(--i)*.09s)}
.entered .name:last-child .glyph{animation-delay:calc(.6s + var(--i)*.09s)}
.hero h1>em{opacity:0;transform:scale(.5) rotate(-25deg)}
.entered .hero h1>em{animation:ampersand-reveal 1.7s .7s cubic-bezier(.16,1,.3,1) both}
.js .hero .hero-reveal{opacity:0;transform:translateY(22px)}
.entered .hero .hero-reveal{animation:soft-arrive 1.5s 1.1s both}
.entered .hero .hero-bottom{animation-delay:1.6s}
.hero .scroll-cue{opacity:0}
.entered .scroll-cue{animation:soft-arrive 1s 2.2s both}
.hero-bottom .rule{transform:scaleX(0)}
.entered .rule{animation:line-unfold 1.1s 2s both}
.js .reveal{transition:opacity 1.1s,transform 1.3s cubic-bezier(.16,1,.3,1);transform:translateY(55px)}
.js .couple-frame{transform:translateY(80px) rotate(9deg) scale(.94);clip-path:inset(12% 0 0 0);transition:opacity 1s,transform 1.7s cubic-bezier(.16,1,.3,1),clip-path 1.6s cubic-bezier(.16,1,.3,1)}
.js .couple-frame.visible{transform:rotate(2deg);clip-path:inset(0)}
.couple-frame{overflow:hidden}
.couple-frame img,.blessing-image img{transform:translateY(var(--photo-y,0px)) scale(1.08);will-change:transform}
.blessing-image{overflow:hidden}
.js .blessing-image{transform:translateY(45px) scale(.93);transition:opacity 1.2s,transform 1.8s cubic-bezier(.16,1,.3,1)}
.js .blessing-image.visible{transform:none}
.blessing-copy{transition-delay:.15s!important}
.joining div{transform:scaleX(0);transform-origin:left}
.joining div:nth-last-child(2){transform:rotate(180deg) scaleX(0)}
.joining.visible div{animation:line-unfold 1.5s .3s forwards}
.joining.visible div:nth-last-child(2){animation:line-unfold-reverse 1.5s .3s forwards}
.joining b{opacity:0;transform:scale(.3)}
.joining.visible b{animation:ampersand-reveal 1.1s 1s forwards}
.chapters{overflow:hidden}
.story-progress{position:absolute;top:0;bottom:0;left:calc(50% - 1px);width:2px;background:linear-gradient(#d5b478,#995f3a,#d5b478);transform:scaleY(var(--story-progress,0));transform-origin:top;box-shadow:0 0 12px #d5b47850}
.js .chapter{transform:translate(-45px,40px)}
.js .chapter:nth-of-type(2){transform:translate(45px,40px)}
.js .chapter.visible{transform:none}
.chapter h2,.chapter p,.chapter-number{opacity:0;transform:translateY(25px)}
.chapter.visible h2{animation:soft-arrive 1.2s .2s both}
.chapter.visible p{animation:soft-arrive 1.2s .4s both}
.chapter.visible .chapter-number{display:block;animation:soft-arrive 1s .1s both}
.chapter .story-photo{clip-path:inset(0 0 100% 0);transition:clip-path 1.5s cubic-bezier(.16,1,.3,1)}
.chapter.visible .story-photo{clip-path:inset(0)}
.chapter:not(:nth-of-type(3)) .story-photo img{transform:translateY(var(--photo-y,0px)) scale(1.14)}
.chapter:nth-of-type(2) .story-photo img{object-position:center 38%;height:330px}
.promise{overflow:hidden}
.promise:before{content:'';position:absolute;width:min(80vw,700px);aspect-ratio:1;border:1px solid #d5b47825;border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}
.promise .star{animation:star-turn 18s linear infinite}
.details-card{position:relative;overflow:hidden}
.js .details-card{transform:perspective(1000px) rotateX(12deg) translateY(50px);transform-origin:50% 100%}
.js .details-card.visible{transform:perspective(1000px) rotateX(0) translateY(0)}
.card-shine{position:absolute;inset:-60%;background:linear-gradient(110deg,transparent 42%,#d5b47825 50%,transparent 58%);transform:translateX(-70%);pointer-events:none}
.details-card.visible .card-shine{animation:card-sweep 2s .45s both}
@keyframes envelope-float{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-12px) rotate(1deg)}}
@keyframes envelope-open{0%{transform:translateY(0) rotate(-2deg)}35%{transform:translateY(15px) rotate(0)}100%{transform:translateY(70px) scale(1.05)}}
@keyframes seal-glow{50%{box-shadow:0 0 0 10px #d5b4780b,0 0 35px #d5b47835,0 5px 15px #4b172850}}
@keyframes seal-release{to{transform:translate(-50%,-50%) scale(1.6) rotate(15deg);opacity:0}}
@keyframes halo-arrive{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}
@keyframes halo-bloom{to{transform:scale(1.7);opacity:0}}
@keyframes glyph-reveal{to{opacity:1;transform:translateY(0) rotateX(0) rotateZ(0);filter:blur(0)}}
@keyframes ampersand-reveal{to{opacity:1;transform:scale(1) rotate(0)}}
@keyframes arch-reveal{to{opacity:1;transform:scale(1)}}
@keyframes soft-arrive{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
@keyframes line-unfold{to{transform:scaleX(1)}}
@keyframes line-unfold-reverse{to{transform:rotate(180deg) scaleX(1)}}
@keyframes star-turn{to{transform:rotate(360deg)}}
@keyframes card-sweep{to{transform:translateX(70%)}}
@media(max-width:600px){.intro-halo{inset:12% -25%}.intro.opening .letter{transform:translateY(-125px) rotate(-3deg)}.story-progress{left:26px}.js .chapter,.js .chapter:nth-of-type(2){transform:translateY(45px)}.js .chapter.visible{transform:none}.couple-frame img,.blessing-image img{will-change:auto}.chapter:nth-of-type(2) .story-photo img{height:300px}.glyph{transform:translateY(45px) rotateX(-60deg)}}
@media(prefers-reduced-motion:reduce){.intro,.intro-halo,.envelope,.glyph,.hero h1>em,.hero-border,.hero .hero-reveal,.hero .scroll-cue,.hero-bottom .rule,.joining div,.joining div:nth-last-child(2),.joining b,.chapter h2,.chapter p,.chapter-number{animation:none!important;opacity:1;filter:none;transform:none}.js .reveal,.js .chapter,.js .chapter:nth-of-type(2),.js .couple-frame,.js .blessing-image,.js .details-card{opacity:1;transform:none;clip-path:none}.chapter .story-photo{clip-path:none}.card-shine{display:none}.couple-frame img,.blessing-image img{transform:none}.hero .scroll-cue{opacity:1}.hero h1,.hero .eyebrow,.hero .prelude,.hero-bottom{transform:none;opacity:1}}