:root{--color-env:#ebd851;--color-env2:#e4d03c;--color-flap:#d3bc11;--env-border-radius:.375rem;--env-width:14rem;--env-height:8rem}.invite h2{color:#ebd851;margin-bottom:.25rem;font-size:1.5rem;font-weight:700}.invite h3{color:#fff;margin-bottom:1rem;font-size:1.125rem;font-weight:500}.envelope{width:var(--env-width);height:var(--env-height);border-bottom-left-radius:var(--env-border-radius);border-bottom-right-radius:var(--env-border-radius);background-color:var(--color-flap);cursor:pointer;margin-left:auto;margin-right:auto;transition:all .3s;position:relative;top:2.5rem;box-shadow:0 8px 30px #0006}.envelope.open .flap{z-index:1;transition:transform .4s,z-index .6s;transform:rotateX(180deg)}.envelope.close .flap{z-index:5;transition:transform .4s .6s,z-index 1s;transform:rotateX(0)}.envelope.close .letter{z-index:1;transition:transform .4s,z-index 1s;transform:translateY(0)}.envelope.open .letter{transform:translateY(calc(var(--env-height) / -2.5));z-index:2;transition:transform .5s .5s,z-index .6s}.envelope .front{z-index:3;width:0;height:0;position:absolute}.envelope .front.flap{border-left:calc(var(--env-width) / 2) solid transparent;border-right:calc(var(--env-width) / 2) solid transparent;border-bottom:calc(var(--env-height) / 2 - 8px) solid transparent;border-top:calc(var(--env-height) / 2 + 8px) solid var(--color-flap);transform-origin:top;pointer-events:none}.envelope .front.pocket{border-left:calc(var(--env-width) / 2) solid var(--color-env);border-right:calc(var(--env-width) / 2) solid var(--color-env);border-bottom:calc(var(--env-height) / 2) solid var(--color-env2);border-top:calc(var(--env-height) / 2) solid transparent;border-bottom-left-radius:var(--env-border-radius);border-bottom-right-radius:var(--env-border-radius)}.envelope .letter{border-radius:var(--env-border-radius);background-color:#fff;width:90%;height:90%;margin-left:auto;margin-right:auto;position:relative;top:5%;box-shadow:0 2px 26px #0000001f}.envelope .letter:after{content:"";background-image:linear-gradient(#fff0 25%,#d7e3efb3 55%,#d7e3ef 100%);position:absolute;inset:0}.envelope .letter .words{background-color:#eeeff0;border-radius:2px;width:80%;height:14%;position:absolute;left:10%}.envelope .letter .words.line1{background-color:#7209b7;width:30%;height:8%;top:15%}.envelope .letter .words.line2{top:32%}.envelope .letter .words.line3{top:52%}.envelope .letter .words.line4{top:72%}