/* Бабочки и искры, которые вылетают из открытого конверта, и бабочка на печати в конце.
   Значения из макета; слой с бабочками создаёт js/butterflies.js. */
.flight{position:absolute;inset:0;z-index:7;pointer-events:none;overflow:hidden}
.bf{position:absolute;left:50%;top:34%;width:46px;height:30px;opacity:0;animation:fly var(--dur,4s) calc(var(--dl,.4s) + 1.45s) cubic-bezier(.3,.5,.35,1) forwards}
.perch{position:absolute;width:46px;height:30px}
.bfi{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;filter:drop-shadow(0 0 3px rgba(255,220,150,.7))}
.wl,.wr{display:block;flex:none;width:22px;height:28px}
.wl{transform-origin:100% 50%;animation:flapL var(--fl,.2s) ease-in-out infinite alternate;clip-path:path('M21.5 12.2C20.6 6.6 16.8 1.4 9.8 .5C4.8 -.1 .3 2 .7 5.7C1.1 8.9 4.4 10.3 8 11.1C12.4 12.3 17.4 13.1 21.2 13.6ZM21.2 14.6C16 14.2 9.4 15.6 7.3 19.2C5.5 22.4 7.5 26.4 11.1 26.9C14.1 27.3 15.5 25.1 16.5 23.3C17.9 20.7 19.9 17.7 21.4 15.9Z');background:radial-gradient(circle at 20% 13%,rgba(255,251,236,.95) 0 1.6px,transparent 2.3px),radial-gradient(circle at 34% 8%,rgba(255,251,236,.8) 0 1.1px,transparent 1.7px),radial-gradient(circle at 48% 74%,rgba(255,251,236,.85) 0 1.4px,transparent 2.1px),radial-gradient(110% 90% at 100% 45%,var(--w1) 0%,var(--w2) 55%,var(--w3) 100%)}
.wr{transform-origin:0 50%;animation:flapR var(--fl,.2s) ease-in-out infinite alternate;clip-path:path('M.5 12.2C1.4 6.6 5.2 1.4 12.2 .5C17.2 -.1 21.7 2 21.3 5.7C20.9 8.9 17.6 10.3 14 11.1C9.6 12.3 4.6 13.1 .8 13.6ZM.8 14.6C6 14.2 12.6 15.6 14.7 19.2C16.5 22.4 14.5 26.4 10.9 26.9C7.9 27.3 6.5 25.1 5.5 23.3C4.1 20.7 2.1 17.7 .6 15.9Z');background:radial-gradient(circle at 80% 13%,rgba(255,251,236,.95) 0 1.6px,transparent 2.3px),radial-gradient(circle at 66% 8%,rgba(255,251,236,.8) 0 1.1px,transparent 1.7px),radial-gradient(circle at 52% 74%,rgba(255,251,236,.85) 0 1.4px,transparent 2.1px),radial-gradient(110% 90% at 0% 45%,var(--w1) 0%,var(--w2) 55%,var(--w3) 100%)}
.bd{position:absolute;left:50%;top:50%;width:2.6px;height:16px;margin:-8px 0 0 -1.3px;border-radius:2px;background:linear-gradient(#7A5418,#3E2608)}
.bd::before,.bd::after{content:"";position:absolute;bottom:100%;left:.9px;width:.8px;height:7px;background:#6B4813;transform-origin:50% 100%}
.bd::before{transform:rotate(-24deg)}
.bd::after{transform:rotate(24deg)}
.g{--w1:#FFF1C4;--w2:#DDAE55;--w3:#8F6020}
.c{--w1:#FFFFFF;--w2:#F1DFB4;--w3:#BE9752}
.rz{--w1:#FFE4D2;--w2:#D9A07A;--w3:#8E5638}
.perch .wl{animation:restL 3.6s ease-in-out infinite}
.perch .wr{animation:restR 3.6s ease-in-out infinite}
.glint{position:absolute;border-radius:50%;background:radial-gradient(circle,#FFFFFF 0 10%,#FFF3CF 16%,rgba(255,214,120,.7) 30%,rgba(255,214,120,0) 68%)}
.glint::before,.glint::after{content:"";position:absolute;left:50%;top:-45%;width:1.8px;height:190%;margin-left:-.9px;border-radius:2px;background:linear-gradient(180deg,rgba(255,248,225,0),#FFFFFF 50%,rgba(255,248,225,0))}
.glint::after{transform:rotate(90deg)}
.bf .tr{left:-10px;top:60%;width:15px;height:15px;animation:twinkle .55s ease-in-out infinite alternate}
.spk{left:50%;top:34%;width:24px;height:24px;margin:-12px 0 0 -12px;opacity:0;animation:spark var(--dur,2s) calc(var(--dl,0s) + 1.5s) ease-out forwards}
@keyframes flapL{from{transform:perspective(120px) rotateY(0deg)}to{transform:perspective(120px) rotateY(72deg)}}
@keyframes flapR{from{transform:perspective(120px) rotateY(0deg)}to{transform:perspective(120px) rotateY(-72deg)}}
@keyframes restL{0%,66%,100%{transform:perspective(120px) rotateY(0deg)}72%,84%{transform:perspective(120px) rotateY(62deg)}78%,90%{transform:perspective(120px) rotateY(12deg)}}
@keyframes restR{0%,66%,100%{transform:perspective(120px) rotateY(0deg)}72%,84%{transform:perspective(120px) rotateY(-62deg)}78%,90%{transform:perspective(120px) rotateY(-12deg)}}
@keyframes twinkle{from{opacity:.2;transform:scale(.55) rotate(0deg)}to{opacity:1;transform:scale(1.1) rotate(45deg)}}
@keyframes fly{
0%{opacity:0;transform:translate(-50%,-50%) translate(var(--x0),0px) scale(.3) rotate(0deg)}
10%{opacity:1}
45%{transform:translate(-50%,-50%) translate(var(--x1),var(--y1)) scale(var(--s,1)) rotate(var(--r1,0deg))}
80%{opacity:1}
100%{opacity:0;transform:translate(-50%,-50%) translate(var(--x2),var(--y2)) scale(var(--s,1)) rotate(var(--r2,0deg))}
}
@keyframes spark{
0%{opacity:0;transform:translate(var(--x0),0px) scale(.2) rotate(0deg)}
20%{opacity:1;transform:translate(calc(var(--x0) + var(--x) * .25),calc(var(--y) * .25)) scale(var(--s,1)) rotate(30deg)}
40%{opacity:.45}
55%{opacity:1;transform:translate(calc(var(--x0) + var(--x) * .6),calc(var(--y) * .6)) scale(calc(var(--s,1) * .75)) rotate(60deg)}
100%{opacity:0;transform:translate(calc(var(--x0) + var(--x)),var(--y)) scale(.2) rotate(110deg)}
}
.bf1{--x0:18px;--x1:177px;--y1:-188px;--x2:357px;--y2:-334px;--r1:32deg;--r2:42deg;--s:.9;--dl:.81s;--dur:3.72s;--fl:.13s}
.bf2{--x0:0px;--x1:5px;--y1:-198px;--x2:72px;--y2:-338px;--r1:0deg;--r2:20deg;--s:1.35;--dl:.99s;--dur:3.27s;--fl:.16s}
.bf3{--x0:-49px;--x1:-237px;--y1:-126px;--x2:-443px;--y2:-324px;--r1:-51deg;--r2:-47deg;--s:1.5;--dl:.26s;--dur:4.8s;--fl:.17s}
.bf4{--x0:-42px;--x1:38px;--y1:-235px;--x2:172px;--y2:-403px;--r1:22deg;--r2:28deg;--s:.8;--dl:.2s;--dur:4.25s;--fl:.2s}
.bf5{--x0:-30px;--x1:223px;--y1:114px;--x2:459px;--y2:273px;--r1:99deg;--r2:113deg;--s:1.35;--dl:.43s;--dur:5.04s;--fl:.14s}
.bf6{--x0:60px;--x1:132px;--y1:-53px;--x2:306px;--y2:-126px;--r1:55deg;--r2:65deg;--s:.8;--dl:.29s;--dur:3.57s;--fl:.16s}
.bf7{--x0:-22px;--x1:122px;--y1:-223px;--x2:171px;--y2:-435px;--r1:11deg;--r2:17deg;--s:1.2;--dl:.26s;--dur:3.28s;--fl:.18s}
.bf8{--x0:-9px;--x1:-101px;--y1:-217px;--x2:-319px;--y2:-437px;--r1:-32deg;--r2:-36deg;--s:1;--dl:1.5s;--dur:3.74s;--fl:.18s}
.bf9{--x0:56px;--x1:-69px;--y1:-170px;--x2:-112px;--y2:-488px;--r1:-7deg;--r2:-20deg;--s:1;--dl:.27s;--dur:3.35s;--fl:.16s}
.bf10{--x0:-48px;--x1:-244px;--y1:115px;--x2:-464px;--y2:190px;--r1:-89deg;--r2:-109deg;--s:.7;--dl:1.52s;--dur:5.18s;--fl:.16s}
.bf11{--x0:64px;--x1:-26px;--y1:-229px;--x2:-160px;--y2:-482px;--r1:-22deg;--r2:-17deg;--s:.9;--dl:1.23s;--dur:3.22s;--fl:.19s}
.bf12{--x0:66px;--x1:168px;--y1:-89px;--x2:429px;--y2:-184px;--r1:58deg;--r2:68deg;--s:.9;--dl:.21s;--dur:3.41s;--fl:.14s}
.bf13{--x0:50px;--x1:-6px;--y1:-221px;--x2:-47px;--y2:-359px;--r1:-5deg;--r2:-10deg;--s:1.5;--dl:1.42s;--dur:4.57s;--fl:.15s}
.bf14{--x0:-9px;--x1:157px;--y1:-195px;--x2:334px;--y2:-374px;--r1:29deg;--r2:49deg;--s:.7;--dl:.62s;--dur:5.1s;--fl:.17s}
.bf15{--x0:10px;--x1:-146px;--y1:147px;--x2:-292px;--y2:249px;--r1:-109deg;--r2:-136deg;--s:1.1;--dl:1.31s;--dur:4.97s;--fl:.17s}
.bf16{--x0:-20px;--x1:-3px;--y1:-168px;--x2:38px;--y2:-342px;--r1:1deg;--r2:8deg;--s:1;--dl:.1s;--dur:4.99s;--fl:.22s}
.bf17{--x0:29px;--x1:-147px;--y1:-236px;--x2:-240px;--y2:-504px;--r1:-14deg;--r2:-21deg;--s:1.5;--dl:.81s;--dur:5.28s;--fl:.19s}
.bf18{--x0:-6px;--x1:-68px;--y1:-275px;--x2:-32px;--y2:-447px;--r1:0deg;--r2:-11deg;--s:1.1;--dl:1.13s;--dur:5s;--fl:.2s}
.bf19{--x0:7px;--x1:100px;--y1:-128px;--x2:251px;--y2:-335px;--r1:38deg;--r2:37deg;--s:1.5;--dl:.6s;--dur:4.53s;--fl:.15s}
.bf20{--x0:65px;--x1:-63px;--y1:243px;--x2:-150px;--y2:448px;--r1:-134deg;--r2:-162deg;--s:1.5;--dl:.62s;--dur:4.55s;--fl:.2s}
.bf21{--x0:34px;--x1:111px;--y1:-65px;--x2:308px;--y2:-122px;--r1:48deg;--r2:69deg;--s:.8;--dl:.84s;--dur:4.56s;--fl:.16s}
.bf22{--x0:-34px;--x1:203px;--y1:-79px;--x2:516px;--y2:-212px;--r1:52deg;--r2:69deg;--s:1;--dl:.42s;--dur:5.29s;--fl:.16s}
.bf23{--x0:-31px;--x1:99px;--y1:-118px;--x2:273px;--y2:-243px;--r1:34deg;--r2:46deg;--s:1.35;--dl:.75s;--dur:4.16s;--fl:.19s}
.bf24{--x0:-15px;--x1:165px;--y1:-98px;--x2:299px;--y2:-293px;--r1:46deg;--r2:41deg;--s:1.2;--dl:.03s;--dur:4.3s;--fl:.13s}
.sp1{--x0:41px;--x:268px;--y:58px;--s:.8;--dl:.33s;--dur:2s}
.sp2{--x0:29px;--x:-215px;--y:-95px;--s:1.8;--dl:.74s;--dur:1.72s}
.sp3{--x0:62px;--x:-97px;--y:54px;--s:.6;--dl:1.47s;--dur:1.62s}
.sp4{--x0:-24px;--x:236px;--y:124px;--s:.8;--dl:.08s;--dur:1.99s}
.sp5{--x0:-63px;--x:-104px;--y:-243px;--s:1;--dl:1.18s;--dur:1.89s}
.sp6{--x0:-67px;--x:-96px;--y:-310px;--s:.8;--dl:.47s;--dur:1.45s}
.sp7{--x0:-52px;--x:-131px;--y:99px;--s:1.8;--dl:.81s;--dur:1.97s}
.sp8{--x0:-35px;--x:129px;--y:-150px;--s:.6;--dl:.48s;--dur:2.33s}
.sp9{--x0:75px;--x:179px;--y:-234px;--s:1.2;--dl:.46s;--dur:1.96s}
.sp10{--x0:-52px;--x:-58px;--y:-278px;--s:1;--dl:1.34s;--dur:2.31s}
.sp11{--x0:6px;--x:-78px;--y:-214px;--s:1.2;--dl:.46s;--dur:2.6s}
.sp12{--x0:61px;--x:-260px;--y:-182px;--s:1;--dl:2s;--dur:1.69s}
.sp13{--x0:59px;--x:-142px;--y:-183px;--s:1.5;--dl:.29s;--dur:1.43s}
.sp14{--x0:26px;--x:-203px;--y:104px;--s:.8;--dl:1.63s;--dur:1.66s}
.sp15{--x0:-33px;--x:-175px;--y:-155px;--s:.8;--dl:.53s;--dur:1.91s}
.sp16{--x0:24px;--x:-174px;--y:-303px;--s:1;--dl:.41s;--dur:2.39s}
.sp17{--x0:57px;--x:35px;--y:197px;--s:.8;--dl:.08s;--dur:2.39s}
.sp18{--x0:37px;--x:-242px;--y:-234px;--s:.8;--dl:.83s;--dur:1.87s}
.sp19{--x0:12px;--x:249px;--y:-64px;--s:1.2;--dl:.43s;--dur:1.67s}
.sp20{--x0:-71px;--x:-28px;--y:-341px;--s:1;--dl:2.02s;--dur:1.56s}
.sp21{--x0:-8px;--x:-88px;--y:84px;--s:1.8;--dl:1.52s;--dur:2.44s}
.sp22{--x0:45px;--x:1px;--y:-210px;--s:.6;--dl:2.04s;--dur:1.64s}
.sp23{--x0:-31px;--x:175px;--y:-258px;--s:1.8;--dl:.29s;--dur:2.3s}
.sp24{--x0:23px;--x:106px;--y:-120px;--s:1.5;--dl:.46s;--dur:2s}
.sp25{--x0:-26px;--x:-33px;--y:-221px;--s:1.8;--dl:1.15s;--dur:1.41s}
.sp26{--x0:52px;--x:87px;--y:-163px;--s:.6;--dl:.27s;--dur:2.46s}
.sp27{--x0:15px;--x:-54px;--y:-166px;--s:1.2;--dl:1.07s;--dur:2.05s}
.sp28{--x0:72px;--x:-185px;--y:-61px;--s:.8;--dl:.76s;--dur:2.31s}
.sp29{--x0:-44px;--x:-131px;--y:-212px;--s:.8;--dl:.04s;--dur:2.17s}
.sp30{--x0:13px;--x:-137px;--y:-30px;--s:.6;--dl:.76s;--dur:1.59s}
.sp31{--x0:-32px;--x:155px;--y:-70px;--s:.6;--dl:1s;--dur:1.64s}
.sp32{--x0:8px;--x:128px;--y:-10px;--s:.8;--dl:1.18s;--dur:1.54s}
.sp33{--x0:32px;--x:-226px;--y:129px;--s:1.5;--dl:.04s;--dur:2.34s}
.sp34{--x0:-11px;--x:43px;--y:193px;--s:1.5;--dl:1.54s;--dur:2.38s}
.sp35{--x0:30px;--x:-259px;--y:92px;--s:1.2;--dl:.08s;--dur:2s}
.sp36{--x0:-51px;--x:214px;--y:-243px;--s:1.8;--dl:.18s;--dur:2.56s}
.perch--seal{top:-4px;right:-16px;transform:rotate(24deg)}

@media (prefers-reduced-motion: reduce){
.flight{display:none}
.perch .wl,.perch .wr{animation:none !important}
}