.contact-send-button{display:inline-flex;align-items:center;justify-content:center;gap:12px}.contact-send-button svg{width:20px;height:20px}.contact-animation[hidden]{display:none}.contact-animation{position:fixed;inset:0;z-index:10000;background:#14203388;display:grid;place-items:center;padding:16px;overflow:hidden}.contact-animation-card{width:min(510px,100%);max-height:95dvh;overflow:hidden;border-radius:24px;background:#f7f8fe;box-shadow:0 24px 80px #14203344}.contact-animation-status{text-align:center;padding:0 20px 28px;margin:0;color:#26304b;font-weight:700}.contact-animation .stage{min-height:420px;overflow:hidden}.contact-animation .stage-caption{display:none}
.contact-animation .stage{position:relative;min-height:520px;display:flex;align-items:center;justify-content:center;overflow:visible}.contact-animation .halo{position:absolute;width:390px;height:390px;border-radius:50%;background:radial-gradient(circle,#dcdfff 0,#ebeaff 49%,#f3f3ff 67%,transparent 70%)}.contact-animation .orbit{position:absolute;border-radius:50%;border:1px dashed #cbccef}.contact-animation .orbit-one{width:435px;height:300px;transform:rotate(-24deg)}.contact-animation .orbit-two{width:320px;height:445px;transform:rotate(33deg)}.contact-animation .spark{position:absolute;color:#a9a3f5;font-size:30px;animation:contact-twinkle 3s ease-in-out infinite}.contact-animation .spark-one{top:18%;left:15%}.contact-animation .spark-two{top:35%;right:9%;font-size:18px;animation-delay:1s}.contact-animation .spark-three{bottom:22%;left:14%;font-size:18px;animation-delay:1.9s}.contact-animation .envelope-wrap{position:relative;width:280px;height:205px;filter:drop-shadow(0 22px 14px #767bd338);transform:rotate(-7deg);z-index:2}.contact-animation .envelope{position:absolute;inset:0;transform-style:preserve-3d}.contact-animation .envelope-back{position:absolute;inset:0;background:#7774e3;border-radius:11px}.contact-animation .letter{position:absolute;left:32px;right:32px;top:14px;height:175px;background:#fff;border-radius:9px;z-index:1;box-shadow:0 3px 16px #38346c20;display:flex;flex-direction:column;align-items:center;padding-top:29px;gap:12px;transform:translateY(-58px);transition:transform .8s cubic-bezier(.55,0,.15,1)}.contact-animation .letter-heart{color:#e69cbb;font-size:31px;line-height:24px}.contact-animation .letter i{display:block;width:68%;height:7px;border-radius:10px;background:#e7e6fc}.contact-animation .letter i:last-child{width:43%}.contact-animation .envelope-front{position:absolute;inset:0;z-index:3;background:#8d89f4;clip-path:polygon(0 0,50% 55%,100% 0,100% 100%,0 100%);border-radius:0 0 11px 11px}.contact-animation .envelope-front::after{content:"";position:absolute;inset:0;background:#9a95fa;clip-path:polygon(0 100%,50% 50%,100% 100%)}.contact-animation .envelope-flap{position:absolute;inset:0;z-index:4;background:#6c68dc;clip-path:polygon(0 0,100% 0,50% 56%);transform-origin:top center;transition:transform .7s;backface-visibility:hidden}.contact-animation .seal{position:absolute;z-index:6;left:calc(50% - 19px);top:calc(55% - 19px);width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:#f8c4d9;color:#fff;opacity:0;transition:opacity .3s;font-size:22px}.contact-animation .stage-caption{position:absolute;bottom:22px;color:#9a9db4;font-size:13px;letter-spacing:.2px}.contact-animation .stage-caption span{color:#a49bed}.contact-animation .flight-contact-trail{position:absolute;top:51%;left:10%;display:flex;gap:13px;opacity:0;transform:rotate(-25deg)}.contact-animation .flight-contact-trail i{width:8px;height:8px;background:#aea6ff;border-radius:50%}.contact-animation .flight-contact-trail i:nth-child(2){width:6px;height:6px;opacity:.7}.contact-animation .flight-contact-trail i:nth-child(3){width:5px;height:5px;opacity:.55}.contact-animation .flight-contact-trail i:nth-child(4){width:4px;height:4px;opacity:.4}.contact-animation .flight-contact-trail i:nth-child(5){width:3px;height:3px;opacity:.3}.contact-animation.sending .letter{transform:translateY(34px)}.contact-animation.sealing .envelope-flap{transform:rotateX(180deg);z-index:2}.contact-animation.sealing .seal{opacity:1}.contact-animation.flying .envelope-wrap{animation:contact-flyAway 1.6s cubic-bezier(.42,0,.72,.27) forwards}.contact-animation.flying .flight-contact-trail{animation:contact-trail .9s ease-out forwards}.contact-animation.flying .spark{animation-duration:.5s}@keyframes contact-flyAway{0%{transform:rotate(-7deg) translate(0,0) scale(1);opacity:1}20%{transform:rotate(8deg) translate(-42px,18px) scale(.94)}45%{transform:rotate(-12deg) translate(40px,-52px) scale(.84)}100%{transform:rotate(18deg) translate(700px,-470px) scale(.3);opacity:0}}@keyframes contact-trail{0%{opacity:0;transform:translateX(0) rotate(-25deg)}35%{opacity:1}100%{opacity:0;transform:translateX(150px) rotate(-25deg)}}@keyframes contact-twinkle{50%{opacity:.35;transform:scale(.65)}}
@media(max-width:600px){.contact-animation .stage{min-height:330px}.contact-animation .halo{width:270px;height:270px}.contact-animation .orbit-one{width:300px;height:230px}.contact-animation .orbit-two{width:230px;height:310px}.contact-animation .envelope-wrap{scale:.73}}@media(prefers-reduced-motion:reduce){.contact-animation *{animation:none!important;transition:none!important}.contact-animation.flying .envelope-wrap{opacity:0}}
