
.hero{background:#fcf9f3;min-height:695px;padding-top:70px;padding-bottom:50px;align-items:center}.hero-copy{align-self:center}.hero-collage{height:560px;margin:0;isolation:isolate}.polaroid-scene{width:100%;height:100%;position:relative}.lace-doily{position:absolute;width:92%;height:94%;top:1%;left:3%;transform:rotate(9deg);filter:drop-shadow(0 1px 1px #725e444d);z-index:0}.back-paper{position:absolute;left:12%;top:6%;width:68%;height:80%;background:#e2eaf0;border:1px solid #d7dfe3;transform:rotate(3deg);box-shadow:0 2px 5px #44342915}.instant-photo{position:absolute;left:15%;top:8%;width:70%;margin:0;padding:17px 17px 0;background:linear-gradient(110deg,#fffdf5,#f7f4e9);transform:rotate(-8deg);box-shadow:2px 16px 24px #4a33272b,0 0 1px #a99e86;z-index:2;transition:transform .5s}.instant-photo:hover{transform:rotate(-4deg) translateY(-6px)}.photo-window{width:100%;aspect-ratio:1/1.13;overflow:hidden;background:#c0d4dd;box-shadow:inset 0 1px 3px #282b3022}.photo-window img{width:100%;height:100%;object-fit:cover;object-position:59% 44%}.instant-photo figcaption{height:74px;display:flex;align-items:center;justify-content:space-between;gap:4px;padding:0 3px;color:#594338}.instant-photo figcaption span{font:42px/1 YutianScript,cursive}.instant-photo figcaption small{font:italic 9px Georgia,serif;max-width:80px;line-height:1.4;color:#96846d}.washi-tape{position:absolute;top:-15px;left:20px;width:78px;height:30px;background:repeating-linear-gradient(0deg,#f3eddcd9 0 1px,#f9f4e8d9 1px 3px);box-shadow:0 1px 2px #5139210a;transform:rotate(-8deg);clip-path:polygon(1% 4%,6% 0,10% 6%,15% 0,20% 5%,25% 0,30% 5%,35% 0,40% 6%,45% 0,50% 4%,55% 0,60% 5%,65% 0,70% 5%,75% 0,80% 6%,85% 0,90% 5%,95% 0,99% 5%,100% 95%,96% 100%,90% 95%,85% 100%,80% 95%,75% 100%,70% 95%,65% 100%,60% 95%,55% 100%,50% 95%,45% 100%,40% 95%,35% 100%,30% 95%,25% 100%,20% 95%,15% 100%,10% 95%,5% 100%,0 95%)}.silver-pin{position:absolute;left:-15px;top:28px;width:75px;height:16px;border:2.5px solid #a7a492;border-radius:20px;transform:rotate(-28deg);box-shadow:0 1px 1px #fff,inset 0 1px 1px #fff,0 3px 3px #271b302e}.silver-pin:after{content:'';position:absolute;width:42px;height:9px;right:0;top:1px;border:1.5px solid #c9c9b9;border-radius:12px}.pearl-loop{position:absolute;width:52%;top:-4%;right:-5%;transform:rotate(65deg);z-index:4;filter:drop-shadow(1px 2px 1px #51392130)}.key-charm{position:absolute;width:19%;right:-6%;top:35%;z-index:4;filter:drop-shadow(1px 3px 2px #51392130);transform:rotate(-11deg)}.ribbon{position:absolute;left:-9%;bottom:3%;width:49%;z-index:5;filter:drop-shadow(0 2px 1px #5c789526);transform:rotate(5deg)}.polaroid-collage .envelope{width:35%;top:auto;bottom:4%;left:-6%;z-index:4;transform:rotate(9deg)}.polaroid-collage .stamp{width:19%;right:-3%;bottom:0;z-index:4}.collage-note{bottom:-5px;left:36%;font:25px/1 YutianScript,cursive;transform:rotate(-4deg);color:#977d65}.polaroid-collage .envelope{bottom:5%;left:-15%;width:33%}.ribbon{bottom:8%;left:-9%;z-index:6}.polaroid-collage .stamp{right:-3%;bottom:4%;width:19%}
@media(max-width:1100px){.hero{min-height:650px}.hero-collage{height:500px}.instant-photo{padding:14px 14px 0}.instant-photo figcaption{height:65px}.instant-photo figcaption span{font-size:35px}}
@media(max-width:760px){.hero{padding-top:45px;gap:30px}.hero-copy{align-self:stretch}.hero-collage{width:90%;height:490px;margin-top:15px}.instant-photo figcaption{height:62px}.polaroid-collage .envelope{left:-10%}.collage-note{font-size:23px}.key-charm{right:-4%}.hero{padding-bottom:45px}}
.polaroid-collage .collage-note{display:none}.instant-photo figcaption{padding-right:55px}.instant-photo figcaption small{font-size:8px;max-width:76px;flex-shrink:0}

/* Keep the exact star lettering; blend away its white image canvas. */
.hero h1 img{mix-blend-mode:multiply}
.hero-copy{z-index:auto}.hero h1{mix-blend-mode:multiply}

.instant-photo{animation:polaroid-float 3.8s ease-in-out infinite;transform-origin:50% 5%;will-change:transform}.instant-photo:hover{animation-play-state:paused}.key-charm{animation:key-swing 3s ease-in-out infinite;transform-origin:50% 0%}@keyframes polaroid-float{0%,100%{transform:rotate(-9deg) translateY(0)}50%{transform:rotate(-3deg) translateY(-14px)}}@keyframes key-swing{0%,100%{transform:rotate(-16deg)}50%{transform:rotate(9deg)}}@media(prefers-reduced-motion:reduce){.instant-photo,.key-charm{animation:none}}
