@keyframes loading{0%{opacity:1}100%{opacity:.5}}.envelope__container{--envelope-width: 40vw;--envelope-height: calc(var(--envelope-width) * 0.6);background-color:var(--BDAY-background)}@media screen and (min-width: 991px){.envelope__container{--envelope-width: 60vw;--envelope-height: calc(var(--envelope-width) * 0.6)}}.envelope__intro{max-width:740px;margin-left:auto;margin-right:auto;text-align:center}.envelope__intro-description{max-width:450px;margin-left:auto;margin-right:auto}.envelope__wrapper{position:relative;display:flex;align-items:center;justify-content:center;padding:46px}.envelope__content{position:relative;perspective:600px}.envelope__content::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.1);z-index:0;animation:loading 1s ease-in-out infinite alternate}.envelope__content>*{opacity:0;pointer-events:none;transition:opacity .5s ease}.envelope__content .envelope__letter{transition:opacity .5s ease .5s}.envelope--ready .envelope__content::before{display:none}.envelope--ready .envelope__content>*{opacity:1;pointer-events:initial}.envelope__letter{position:absolute;top:50%;left:50%;width:90vw;height:60vh;transform:translate3d(-50%, -50%, 0) scale(0.6);display:flex;align-items:flex-start;justify-content:center;z-index:15;border-radius:2px;background-color:var(--BDAY-background);padding:calc(var(--size-16)*2);box-shadow:0 0 100px rgba(0,0,0,.05);overflow:hidden;z-index:1}.envelope__letter::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;border:15px solid var(--BDAY-foreground);z-index:0;pointer-events:none}@media screen and (min-width: 991px){.envelope__letter{width:80vw}}@media screen and (min-width: 1601px){.envelope__letter{width:60vw}}.envelope__letter-body{position:relative;width:100%;height:100%;font-size:inherit;display:flex;align-items:center;justify-content:center;gap:var(--size-24);color:var(--BDAY-foreground)}@media screen and (min-width: 991px){.envelope__letter-body{align-items:center}}.envelope__letter-image{display:none;position:relative;max-width:50%;width:100%;height:100%}@media screen and (min-width: 751px){.envelope__letter-image{display:block}}.envelope__letter-image img{position:absolute;top:0;left:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center}.envelope__letter-message{width:100%;text-align:center;padding-top:2rem;padding-bottom:2rem;margin-top:auto;margin-bottom:auto}@media screen and (min-width: 991px){.envelope__letter-message{padding-top:9rem;padding-bottom:9rem}}@media screen and (min-width: 751px){.envelope__letter-message{max-width:50%}}.envelope__letter-title{margin-bottom:8px;text-align:center;font-weight:600;max-width:259px;font-size:2rem;margin-left:auto;margin-right:auto;margin-bottom:2.5rem}@media screen and (min-width: 991px){.envelope__letter-title{font-size:2.4rem;max-width:320px}}@media screen and (min-width: 991px){.envelope__letter-title{font-size:3.2rem;margin-bottom:5rem}}.envelope__letter-close{position:absolute;top:calc(var(--size-16)*-1);right:calc(var(--size-16)*-1);padding:var(--size-16);opacity:.3;cursor:pointer;transition:opacity .35s ease}.envelope__letter-close:hover{opacity:1}.envelope__letter-close svg{width:16px;height:auto}@media screen and (min-width: 991px){.envelope__letter-close svg{width:100%}}.envelope__list{padding:0 46px}@media screen and (min-width: 991px){.envelope__list{margin:0 auto;max-width:70vw;padding:0}}.envelope__list .grid__item{padding:var(--size-32) var(--size-16);border-radius:var(--text-boxes-radius)}.envelope__list .grid__item>*{padding-left:1.5rem;padding-right:1.5rem}.envelope__top-fold,.envelope__top-fold-backface{display:block !important;position:absolute;top:0;left:0;width:80vw;border-top:calc(80vw*38.33333333/100) solid var(--BDAY-foreground);border-left:calc(80vw*50/100) solid rgba(0,0,0,0);border-right:calc(80vw*50/100) solid rgba(0,0,0,0);box-sizing:border-box;z-index:30;transform-origin:top}@media screen and (min-width: 991px){.envelope__top-fold,.envelope__top-fold-backface{width:var(--envelope-width);border-top:calc(var(--envelope-width)*38.33333333/100) solid var(--BDAY-foreground);border-left:calc(var(--envelope-width)*50/100) solid rgba(0,0,0,0);border-right:calc(var(--envelope-width)*50/100) solid rgba(0,0,0,0)}}.envelope__top-fold-shadow,.envelope__top-fold-backface-shadow{display:block !important;position:absolute;top:0;left:0;width:80vw;border-top:calc(80vw*39/100) solid var(--grey-950);border-left:calc(80vw*50/100) solid rgba(0,0,0,0);border-right:calc(80vw*50/100) solid rgba(0,0,0,0);box-sizing:border-box;z-index:30;transform-origin:top;opacity:.2}@media screen and (min-width: 991px){.envelope__top-fold-shadow,.envelope__top-fold-backface-shadow{width:var(--envelope-width);border-top:calc(var(--envelope-width)*39/100) solid var(--grey-950);border-left:calc(var(--envelope-width)*50/100) solid rgba(0,0,0,0);border-right:calc(var(--envelope-width)*50/100) solid rgba(0,0,0,0)}}.envelope__top-fold{backface-visibility:hidden}.envelope__bottom-fold{display:block !important;position:absolute;top:0;width:80vw;height:calc(80vw*.6);z-index:25;background:linear-gradient(30deg, var(--BDAY-foreground) 49%, var(--BDAY-foreground-shadow) 50%, var(--BDAY-foreground) 50%) calc(80vw*.5) calc(calc(80vw * 0.6) * 0.5)/calc(80vw * 0.5) calc(calc(80vw * 0.6)*.5) no-repeat,linear-gradient(31deg, var(--BDAY-foreground) 49%, transparent 50%) 0px 1px/calc(80vw * 50.6666666667 / 100) calc(calc(80vw * 0.6)*.5) no-repeat,linear-gradient(150deg, var(--BDAY-foreground) 50%, var(--BDAY-foreground-shadow) 50%, var(--BDAY-foreground) 51%) 0px calc(calc(80vw * 0.6) * 0.5)/calc(80vw * 50.3333333333 / 100) calc(calc(80vw * 0.6)*.5) no-repeat,linear-gradient(148.7deg, transparent 50%, var(--BDAY-foreground-shadow) 50%, var(--BDAY-foreground) 50%) calc(80vw*.5) 0px/calc(80vw * 0.5) calc(calc(80vw * 0.6)*.5 + 1px) no-repeat}@media screen and (min-width: 991px){.envelope__bottom-fold{width:var(--envelope-width);height:calc(var(--envelope-width)*.6);background:linear-gradient(30deg, var(--BDAY-foreground) 49%, var(--BDAY-foreground-shadow) 50%, var(--BDAY-foreground) 50%) calc(var(--envelope-width)*.5) calc(var(--envelope-height) * 0.5)/calc(var(--envelope-width) * 0.5) calc(var(--envelope-height)*.5) no-repeat,linear-gradient(31deg, var(--BDAY-foreground) 49%, transparent 50%) 0px 1px/calc(var(--envelope-width) * 50.6666666667 / 100) calc(var(--envelope-height)*.5) no-repeat,linear-gradient(150deg, var(--BDAY-foreground) 50%, var(--BDAY-foreground-shadow) 50%, var(--BDAY-foreground) 51%) 0px calc(var(--envelope-height) * 0.5)/calc(var(--envelope-width) * 50.3333333333 / 100) calc(var(--envelope-height)*.5) no-repeat,linear-gradient(148.7deg, transparent 50%, var(--BDAY-foreground-shadow) 50%, var(--BDAY-foreground) 50%) calc(var(--envelope-width)*.5) 0px/calc(var(--envelope-width) * 0.5) calc(var(--envelope-height)*.5 + 1px) no-repeat}}.envelope__envelope{display:block !important;position:relative;width:80vw;height:calc(80vw * 0.6);background:linear-gradient(var(--BDAY-foreground) 0, var(--BDAY-foreground-shadow) 100%);cursor:pointer}@media screen and (min-width: 991px){.envelope__envelope{width:var(--envelope-width);height:var(--envelope-height)}}.envelope__envelope::after{content:"";display:block;position:absolute;top:100%;left:0;width:100%;height:46px;background-color:var(--BDAY-background);z-index:2}.envelope__sticker{position:absolute;top:60%;left:50%;transform:translate(-50%, -50%);width:5rem;height:5rem;font-size:1.2rem;font-weight:600;color:#000;line-height:1.35;border-radius:50%;display:flex;align-items:center;justify-content:center;background-color:var(--BDAY-background);z-index:30}@media screen and (min-width: 751px){.envelope__sticker{width:8rem;height:8rem;font-size:1.8rem}}@media screen and (min-width: 991px){.envelope__sticker{width:10rem;height:10rem}}.envelope__logo{position:absolute;top:0;left:0;transform:translate3d(-50%, calc(var(--envelope-height) * -1), 0);width:6rem;backface-visibility:hidden;-webkit-backface-visibility:hidden}@media screen and (min-width: 751px){.envelope__logo{width:9rem}}@media screen and (min-width: 991px){.envelope__logo{width:10rem;transform:translate3d(-50%, calc(var(--envelope-height) / 2 * -1), 0)}}.envelope__logo::before{content:"";display:block;position:absolute;top:0;left:0;width:100%;height:100%;backface-visibility:hidden;-webkit-backface-visibility:hidden}.envelope__logo img{position:relative;width:100%;height:auto;z-index:1;backface-visibility:hidden;-webkit-backface-visibility:hidden;filter:invert(1)}