.envelope-container{width:100%;min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;position:relative;z-index:10}#evnelope{position:relative;width:min(86.4vw,540px);height:calc(min(86.4vw, 540px) * .643);border-bottom-left-radius:6px;border-bottom-right-radius:6px;background-color:transparent;box-shadow:0 4px 20px rgba(0,0,0,.2);cursor:pointer;margin:0 auto}#evnelope.expanded{cursor:default}#evnelope:before{content:"";position:absolute;top:0;left:1px;right:1px;bottom:3px;background-color:#fffaeb;border-bottom-left-radius:6px;border-bottom-right-radius:6px;z-index:0;pointer-events:none}@media (max-width:767px){#evnelope{margin-top:10vh}}@media (min-width:768px){.envelope-container{padding-top:20vh}#evnelope{width:min(57.6vw,504px);height:calc(min(57.6vw, 504px) * .643)}}:root{--envelope-width:min(86.4vw,540px);--envelope-height:calc(var(--envelope-width) * 0.643)}@media (min-width:768px){:root{--envelope-width:min(57.6vw,504px);--envelope-height:calc(var(--envelope-width) * 0.643)}}.envelope-body-img{height:100%;object-fit:fill;object-position:center;z-index:5}.envelope-body-img,.envelope-flap-img{position:absolute;width:calc(100% + 6px);top:0;left:-3px}.envelope-flap-img{height:70%;object-fit:contain;object-position:center top;z-index:6;transform-origin:top center}.wax-seal-img{position:absolute;width:calc(var(--envelope-width) * .15);height:calc(var(--envelope-width) * .15);object-fit:contain;z-index:12;top:55%;left:50%;transform:translateX(-50%);transform-origin:center calc(var(--envelope-height) * -.55);pointer-events:none}.letter{position:relative;background-color:#fff;width:90%;margin-left:auto;margin-right:auto;height:90%;top:5%;border-radius:0;box-shadow:0 2px 26px rgba(0,0,0,.12);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;z-index:2}.letter:after{content:"";position:absolute;top:0;bottom:0;left:0;right:0;background-image:linear-gradient(180deg,rgba(255,255,255,0) 25%,rgba(255,227,239,.7) 55%,rgba(215,227,239,1));border-radius:0}.letter-content{position:relative;width:100%;height:100%;z-index:3;text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:hidden;border-radius:0}.expanded .letter-content{overflow-y:auto;overflow-x:hidden;justify-content:flex-start;padding:3rem 0;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:rgba(212,175,55,.3) transparent}.expanded .letter-content::-webkit-scrollbar{width:8px}.expanded .letter-content::-webkit-scrollbar-track{background:transparent}.expanded .letter-content::-webkit-scrollbar-thumb{background-color:rgba(212,175,55,.3);border-radius:4px}.expanded .letter-content::-webkit-scrollbar-thumb:hover{background-color:rgba(212,175,55,.5)}.folded-paper-border{position:absolute;top:6%;right:10%;bottom:6%;left:10%;background:transparent;border:2px solid #f5deb3;z-index:1;display:flex;align-items:center;justify-content:center}.letter-text-content{position:relative;z-index:10;text-align:center;width:100%;max-width:90%}.letter-title{font-family:Cormorant Garamond,serif;font-size:clamp(16px,3vw,32px);font-weight:300;margin-bottom:clamp(12px,2vw,24px)}.letter-names,.letter-title{color:#F5DEB3;letter-spacing:2px}.letter-names{font-family:Imperial Script,cursive;font-size:clamp(20px,5vw,48px);font-weight:400}.letter-text-content p{color:#F5DEB3;font-size:clamp(14px,2vw,18px);line-height:1.6}.words{position:absolute;left:10%;width:80%;height:14%;background-color:#eeeff0}.words.line1{top:15%;width:20%;height:7%}.words.line2{top:30%}.words.line3{top:50%}.words.line4{top:70%}.closed .envelope-flap-img{transform:rotateX(0deg);transition:transform .4s ease .6s,z-index 1s;z-index:10}.closed .wax-seal-img{transform:translateX(-50%) rotateX(0deg);transition:transform .4s ease .6s,z-index 1s;z-index:11}.closed .letter{transform:translateY(0) scale(1);transition:transform .4s ease,z-index 1s;z-index:1}.opening .envelope-flap-img{transform:rotateX(180deg);transition:transform .4s ease,z-index .6s;z-index:1}.opening .wax-seal-img{transform:translateX(-50%) rotateX(180deg);transition:transform .4s ease,z-index 0s .204s;z-index:0}.opening .letter{transform:translateY(calc(var(--envelope-width) * -.214)) scale(1);transition:transform .4s ease .6s,z-index .6s;z-index:2}.sliding-out .envelope-flap-img{transform:rotateX(180deg);z-index:0}.sliding-out .wax-seal-img{transform:translateX(-50%) rotateX(180deg);z-index:-1}.sliding-out .letter{transform:translateY(calc(var(--envelope-height) * -3.5)) scale(1);transition:transform 1.5s ease-in,z-index 0s ease-in 1.2s;z-index:10}.expanded .envelope-flap-img{transform:rotateX(180deg);z-index:0}.expanded .wax-seal-img{transform:translateX(-50%) rotateX(180deg);z-index:-1}.expanded .letter{position:fixed!important;top:2.5%!important;left:2.5%!important;right:2.5%!important;bottom:2.5%!important;width:95vw!important;height:95vh!important;margin:0!important;transform:none!important;transition:transform .6s ease-out,width .6s ease-out,height .6s ease-out,top .6s ease-out,left .6s ease-out,right .6s ease-out,bottom .6s ease-out;z-index:1000;border-radius:0}@media (min-width:768px){.expanded .letter{width:min(59.375vw,56.25vh)!important;height:auto!important;aspect-ratio:10/16;max-height:90vh!important;position:fixed!important;top:50%!important;left:50%!important;right:auto!important;bottom:auto!important;transform:translate(-50%,-50%)!important;margin:0!important;transition:width .1s ease-out,height .1s ease-out,aspect-ratio .1s ease-out,top .6s ease-out .1s,left .6s ease-out .1s,transform .6s ease-out .1s;z-index:1000;border-radius:0}}@media (max-width:767px){.expanded .letter{top:1vw!important;left:1vw!important;right:1vw!important;bottom:1vw!important;width:auto!important;height:auto!important;border-radius:0!important}}.hearts{position:absolute;top:calc(var(--envelope-width) * .321);left:0;right:0;z-index:2}.closed .hearts,.opening .hearts{z-index:3}.expanded .hearts,.sliding-out .hearts{z-index:1}.heart{position:absolute;bottom:0;right:10%;width:calc(var(--envelope-width) * .22375);height:calc(var(--envelope-width) * .3575);object-fit:contain;pointer-events:none}.closed .heart{opacity:0;animation:none;top:auto;bottom:0}.opening .heart{opacity:1;top:0;bottom:auto;animation-fill-mode:forwards}.a1{left:20%;transform:scale(.6);animation:animate-0 var(--heart-duration) linear 1,sideSway var(--heart-sway-duration) ease-in-out 4 alternate;animation-fill-mode:forwards;animation-delay:var(--heart-delay)}.a1,.a2{opacity:1}.a2{left:55%;transform:scale(1);animation:animate-1 var(--heart-duration) linear 1,sideSway var(--heart-sway-duration) ease-in-out 2 alternate;animation-fill-mode:forwards;animation-delay:var(--heart-delay)}.a3{left:10%;transform:scale(.8);animation:animate-2 var(--heart-duration) linear 1,sideSway var(--heart-sway-duration) ease-in-out 6 alternate;animation-fill-mode:forwards;animation-delay:var(--heart-delay)}.a3,.a4{opacity:1}.a4{left:40%;transform:scale(.7);animation:animate-3 var(--heart-duration) linear 1,sideSway var(--heart-sway-duration) ease-in-out 3 alternate;animation-fill-mode:forwards;animation-delay:var(--heart-delay)}@keyframes sideSway{0%{margin-left:0}to{margin-left:50px}}.envelope-wrapper{width:100%;height:calc(var(--envelope-height) + 100px);display:flex;justify-content:center}.background-texture{margin:0;padding:0;overflow:hidden;background:#0A0A0A;z-index:-1}.background-texture,.background-texture__noise-layer{position:absolute;top:0;left:0;width:100%;height:100%}.background-texture__noise-layer{background-size:cover;background-position:50%;background-repeat:no-repeat}.background-texture__spotlight{background:radial-gradient(circle at center,rgba(47,47,47,.4) 0,rgba(10,10,10,0) 70%);mix-blend-mode:lighten}.background-texture__spotlight,.background-texture__vignette{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.background-texture__vignette{background:radial-gradient(circle at center,rgba(0,0,0,0) 25%,rgba(0,0,0,.7) 100%)}.background-texture__circle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:50%;background-color:rgba(255,255,255,.15);pointer-events:none;z-index:1}.open-letter-background{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;padding:0;overflow:hidden;background:#0A0A0A;z-index:-1}.open-letter-background__noise-layer{position:absolute;top:0;left:0;width:100%;height:100%;background-size:cover;background-position:50%;background-repeat:no-repeat}.open-letter-background__light-line{position:absolute;top:0;width:350px;height:100%;background:linear-gradient(90deg,transparent,rgba(107,107,107,.22),transparent);mix-blend-mode:lighten;filter:blur(25px);pointer-events:none;z-index:0;transition:left .3s ease-out;transform:translateX(-50%)}.greeting-container{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:auto;text-align:center;color:#F5DEB3;flex-shrink:0}.greeting-title{font-family:Cormorant Garamond,serif;font-size:clamp(24px,4vw,48px);font-weight:300;letter-spacing:2px;margin-bottom:clamp(16px,2vw,32px)}.greeting-names{font-family:Imperial Script,cursive;font-size:clamp(32px,8vw,72px);font-weight:400;letter-spacing:1px;margin-bottom:clamp(24px,4vw,48px)}.greeting-body{font-family:Cormorant Garamond,serif;font-size:clamp(16px,2.3vw,21px);font-weight:300;line-height:1.8;max-width:85%;margin:0 auto}.greeting-body p{margin:clamp(12px,1.5vw,20px) 0}.greeting-body p:first-child{margin-top:0}@media (max-width:767px){.greeting-body{font-size:clamp(17px,2.4vw,22px)}}.menu-item{background-color:transparent;border:2px solid #f5deb3;color:#F5DEB3;font-family:Cormorant Garamond,serif;font-size:clamp(14px,2.5vw,20px);font-weight:300;letter-spacing:2px;width:clamp(200px,50vw,420px);padding:clamp(11px,2.1vw,17px) clamp(30px,6vw,50px);height:clamp(51px,8.625vw,64px);display:flex;align-items:center;justify-content:center;border-radius:6px;cursor:pointer;transform:scale(1);box-shadow:none;transition:all .3s ease;outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;position:relative;z-index:1}@media (hover:hover){.menu-item:hover{background-color:rgba(245,222,179,.08);border-color:#F5DEB3;box-shadow:0 0 12px rgba(245,222,179,.2)}}.menu-item--pressed{background-color:rgba(245,222,179,.08);box-shadow:0 0 12px rgba(245,222,179,.2)}.menu-item:focus{outline:none}.menu-item:focus-visible{outline:none;box-shadow:0 0 16px rgba(245,222,179,.3)}.menu{gap:clamp(17px,2.66vw,24px)}.menu,.sub-view{display:flex;flex-direction:column;align-items:center;width:100%}.sub-view{justify-content:center;text-align:center;color:#F5DEB3}.sub-view-title{font-family:Cormorant Garamond,serif;font-size:clamp(24px,4vw,36px);font-weight:300;margin-bottom:clamp(1rem,3vw,2rem);margin-top:0;letter-spacing:1px}.sub-view-content{width:100%;max-width:85%}.sub-view-content p{font-family:Cormorant Garamond,serif;font-size:clamp(16px,2.5vw,20px);font-weight:300;line-height:1.7;margin:clamp(.75rem,2vw,1.5rem) 0;color:#F5DEB3}.sub-view-content p:first-child{margin-top:0}.sub-view-accent{font-weight:400;letter-spacing:.5px;font-style:italic}.sub-view-accent-large{font-family:Cormorant Garamond,serif;font-size:clamp(20px,3.5vw,28px);font-weight:300;letter-spacing:1px;margin:clamp(1.5rem,3vw,2rem) 0 clamp(.75rem,2vw,1rem)}.sub-view-detail-label{font-family:Cormorant Garamond,serif;font-size:clamp(14px,2.2vw,18px);font-weight:400;letter-spacing:1.5px;text-transform:uppercase;margin-top:clamp(1.25rem,2.5vw,2rem)!important;margin-bottom:clamp(.5rem,1.5vw,.75rem)!important;opacity:.9}.sub-view-detail{font-family:Cormorant Garamond,serif;font-size:clamp(15px,2.3vw,19px);font-weight:300;line-height:1.8;margin:clamp(.5rem,1.5vw,1rem) 0!important}.menu-button-container{display:flex;flex-direction:column;align-items:center;justify-content:center;--spacing-gap:clamp(10px,2.5vw,24px);gap:var(--spacing-gap);margin-top:auto;position:relative}.button-decoration-img{width:clamp(160px,40vw,336px);height:auto;object-fit:contain;object-position:center;pointer-events:none;margin-bottom:calc(var(--spacing-gap) * -2.5);position:relative;z-index:2}.menu-button{background-color:transparent;border:2px solid #f5deb3;color:#F5DEB3;font-family:Cormorant Garamond,serif;font-size:clamp(18px,3.5vw,28px);font-weight:300;letter-spacing:2px;width:clamp(200px,50vw,420px);padding:clamp(14px,3vw,24px) clamp(40px,8vw,70px);border-radius:6px;cursor:pointer;transform:scale(1);box-shadow:none;transition:all .3s ease;outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;position:relative;z-index:1}@media (hover:hover){.menu-button:hover{background-color:rgba(245,222,179,.08);border-color:#F5DEB3;box-shadow:0 0 12px rgba(245,222,179,.2)}}.menu-button--pressed{background-color:rgba(245,222,179,.08);box-shadow:0 0 12px rgba(245,222,179,.2)}.menu-button:focus{outline:none}.menu-button:focus-visible{outline:none;box-shadow:0 0 16px rgba(245,222,179,.3)}.content-box{position:absolute;top:6%;right:10%;bottom:6%;left:10%;background:transparent;border:2px solid #f5deb3;z-index:1;display:flex;flex-direction:column;align-items:center;overflow-y:hidden;overflow-x:hidden;padding:clamp(1rem,2vw,1.5rem) 1rem;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:rgba(245,222,179,.3) transparent}.content-box::-webkit-scrollbar{width:8px}.content-box::-webkit-scrollbar-track{background:transparent}.content-box::-webkit-scrollbar-thumb{background-color:rgba(245,222,179,.3);border-radius:4px}.content-box::-webkit-scrollbar-thumb:hover{background-color:rgba(245,222,179,.5)}.letter-description{font-size:clamp(14px,2vw,18px);line-height:1.6;max-width:80%;margin:2rem auto 0}.letter-description p{margin-top:1rem}.letter-description p:first-child{margin-top:0}.letter-corner{position:absolute;width:clamp(60px,10vw,150px);height:clamp(60px,10vw,150px);object-fit:contain;z-index:5;pointer-events:none}.letter-corner--top-left{top:2%;left:3%;transform:rotate(90deg)}.letter-corner--top-right{top:2%;right:3%;transform:rotate(180deg)}.letter-corner--bottom-left{bottom:2%;left:3%}.letter-corner--bottom-right{bottom:2%;right:3%;transform:rotate(270deg)}.rose-decoration{position:absolute;width:clamp(80px,12vw,180px);height:auto;object-fit:contain;z-index:5;pointer-events:none;left:50%;transform:translateX(-50%)}.rose-decoration--top{top:2%}.rose-decoration--bottom{bottom:2%}@media (min-width:768px){.rose-decoration{width:clamp(68px,10.2vw,153px)}}@media (max-width:767px){.letter-corner{width:clamp(105px,17.5vw,150px);height:clamp(105px,17.5vw,150px)}}.views-container{position:relative;flex:1 1}.content-view,.views-container{width:100%;display:flex;align-items:center;justify-content:center}.content-view{position:absolute;top:0;left:0;height:100%;transition:opacity .3s ease;opacity:1}.content-view.hidden{opacity:0;pointer-events:none}