*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#26050d;color:#ffecef;font-family:"Libre Baskerville",serif;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;z-index:-3;background:radial-gradient(circle at 20% 20%,#a52b4d 0,transparent 27%),radial-gradient(circle at 80% 35%,#65132e 0,transparent 34%),radial-gradient(circle at 45% 90%,#9a2744 0,transparent 25%),#26050d}
.noise{position:fixed;inset:0;pointer-events:none;z-index:50;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.8' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.float{position:fixed;z-index:3;color:#ffb0c1aa;font:italic 15px "Playfair Display";pointer-events:none;animation:drift 6s ease-in-out infinite}.f1{left:6%;top:22%;font-size:25px}.f2{right:7%;top:13%}.f3{left:12%;top:66%;font-size:38px}.f4{right:8%;top:72%;animation-delay:1s}.f5{right:4%;top:43%;font-size:11px;animation-delay:2s}.f6{left:4%;top:84%;font-size:12px}.f7{right:22%;top:87%;animation-delay:3s}.f8{left:30%;top:8%;font-size:12px}
@keyframes drift{50%{transform:translateY(-22px) rotate(4deg)}}
.hero{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:10vw;position:relative}.tiny,.label{font:9px "DM Mono";letter-spacing:.22em;opacity:.5}.hero h1{font:400 clamp(105px,18vw,220px)/.72 "Playfair Display";letter-spacing:-.08em;margin:40px 0 30px}.hero h1 i,.chapter i,.quote i,.collage-title i,.last i{color:#ff9fb5}.ornament{color:#ff9fb5;opacity:.7}.hero p{line-height:1.9;opacity:.6;font-size:13px;margin:30px 0}button{border:1px solid #ffb2c544;background:#ff789b15;color:#fff1f4;border-radius:999px;padding:14px 23px;font:9px "DM Mono";cursor:pointer;transition:.35s}button:hover{background:#ffb3c7;color:#28050d;transform:translateY(-3px)}.hint{position:absolute;bottom:28px;font:9px "DM Mono";opacity:.3}
#story{max-width:1100px;margin:auto;padding:5vw 6vw 20vw}.chapter{min-height:85vh;display:flex;flex-direction:column;justify-content:center}.chapter h2,.quote h2,.collage-title h2,.last h2{font:400 clamp(52px,8vw,105px)/.88 "Playfair Display";letter-spacing:-.06em;margin:25px 0}.chapter p,.quote p,.last p{opacity:.5;line-height:2;font-size:13px}
.photo-scene{min-height:110vh;display:flex;align-items:center;justify-content:center;position:relative}.polaroid{width:min(66vw,540px);padding:12px 12px 58px;background:#f8ece7;box-shadow:0 40px 100px #090006aa;transform:rotate(-5deg);transition:.7s}.polaroid:hover{transform:rotate(0) scale(1.025)}.polaroid.p2{transform:rotate(5deg)}.polaroid.p2:hover{transform:rotate(0) scale(1.025)}.polaroid img{width:100%;display:block}.polaroid figcaption{color:#451321;font:italic 15px "Playfair Display";padding:13px 5px 0}.polaroid small{font:8px "DM Mono";letter-spacing:.14em;opacity:.55}.tape{position:absolute;width:130px;height:30px;background:#dba9a0bb;top:18%;left:calc(50% - 65px);z-index:2;transform:rotate(-4deg)}.scribble{position:absolute;right:9%;top:25%;color:#ffacbfaa;font:italic 17px "Playfair Display";transform:rotate(6deg);animation:drift 5s infinite}.second-note{left:7%;right:auto;transform:rotate(-6deg)}
.quote{min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;position:relative}.quote h2{font-size:clamp(48px,8vw,100px)}.tiny-heart{font-size:42px;color:#ff9fb5;animation:drift 4s infinite}.side-note{position:absolute;right:4%;top:30%;color:#ffafc0aa;font:italic 13px "Playfair Display";transform:rotate(5deg)}
.collage{min-height:140vh;position:relative;padding-top:10vw}.collage-title{text-align:center}.collage-title span{font:9px "DM Mono";letter-spacing:.2em;opacity:.45}.photo-card{position:absolute;width:min(48vw,440px);padding:9px;background:#f8ece7;box-shadow:0 35px 80px #090006aa}.photo-card img{width:100%;display:block}.a{left:6%;top:38%;transform:rotate(-6deg)}.b{right:6%;top:56%;transform:rotate(6deg)}.thread{position:absolute;top:40%;left:25%;width:50%;height:25%;border-top:1px solid #ffb0c044;border-bottom:1px solid #ffb0c044;transform:rotate(-5deg)}.tiny-note{position:absolute;color:#ffb0c0aa;font:italic 16px "Playfair Display"}.n1{left:48%;top:46%}.n2{left:17%;top:66%;font-size:30px}.n3{right:17%;top:75%;font-size:12px}
.huge{min-height:120vh}.huge h2{font-size:clamp(55px,9vw,110px);margin-bottom:10px}.when{font:italic clamp(85px,16vw,190px)/.8 "Playfair Display";color:#ff9fb5;text-shadow:0 0 80px #ff547e55;animation:pulse 4s infinite}@keyframes pulse{50%{transform:scale(1.03)}}
.last{min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:flex-end;text-align:right;position:relative}.last-heart{position:absolute;left:8%;top:35%;font-size:60px;color:#ff9fb5;animation:drift 5s infinite}
footer{min-height:100vh;border-top:1px solid #ffb2c51d;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}footer h2{font:400 clamp(90px,17vw,210px)/.75 "Playfair Display";color:#ff9fb5;letter-spacing:-.08em;margin:35px 0}footer>div:first-child{color:#ff9fb5;margin-bottom:20px}
.reveal{opacity:0;transform:translateY(60px);transition:1.1s cubic-bezier(.2,.8,.2,1)}.reveal.show{opacity:1;transform:none}
@media(max-width:700px){.float{font-size:10px!important}.scene,.photo-scene{min-height:90vh}.polaroid{width:88vw}.scribble{right:1%;top:15%;font-size:12px}.photo-card{width:75vw}.a{left:2%;top:40%}.b{right:2%;top:58%}.thread{left:20%;width:60%}.last{align-items:center;text-align:center}.last-heart{left:4%}}