:root{--cream:#f7f1e8;--wine:#8b3a4a;--blush:#e8c9cf;--gold:#c9a86a;--ink:#292322;--paper:#fffdfc;--line:rgba(41,35,34,.14)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font:400 15px/1.7 "DM Sans",sans-serif;overflow-x:hidden}.grain{position:fixed;z-index:20;inset:0;pointer-events:none;opacity:.1;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E")}.cover{position:fixed;z-index:30;inset:0;background:var(--cream);display:grid;place-items:center;text-align:center;transition:transform 1.25s cubic-bezier(.75,0,.2,1),opacity .8s}.cover:before,.paper-section:before{content:"";position:absolute;inset:18px;border:1px solid rgba(139,58,74,.18);pointer-events:none}.cover.open{transform:translateY(-105%);opacity:0}.cover-inner{position:relative;z-index:1;padding:34px}.eyebrow{margin:0 0 18px;color:var(--wine);font-size:10px;letter-spacing:.19em;font-weight:600}.cover-date,.final-date{font:20px/1 "DM Serif Display",serif;letter-spacing:.13em;color:var(--gold)}h1,h2,h3,p{margin-top:0}h1,h2{font-family:"DM Serif Display",serif;font-weight:400;line-height:1.08}.cover h1{font-size:clamp(45px,7vw,80px);margin:22px 0}.cover-rule{width:46px;height:1px;background:var(--gold);margin:25px auto}.cover-name{font:italic 19px "DM Serif Display",serif}.open-day{border:0;border-bottom:1px solid var(--wine);color:var(--wine);background:none;padding:10px 2px;cursor:pointer;font:600 13px "DM Sans",sans-serif;letter-spacing:.08em}.open-day span{font-size:18px;margin-left:8px}.cover-note{position:absolute;bottom:28px;font:26px "Parisienne",cursive;color:var(--wine);transform:rotate(-4deg)}.cover-flower{position:absolute;color:var(--blush);font-size:100px}.flower-one{top:10%;left:7%;transform:rotate(-28deg)}.flower-two{right:9%;bottom:12%;font-size:85px}.section-pad{padding:130px max(7vw,24px)}.paper-section{position:relative;background:var(--paper);padding:125px max(7vw,24px)}.hero{min-height:100svh;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:7vw;padding-top:80px}.hero-copy{max-width:570px}.hero-kicker{font:italic 19px "DM Serif Display",serif;margin:29px 0 12px}.hero h2{font-size:clamp(46px,6vw,82px);letter-spacing:-.035em;margin-bottom:31px}.hero em,.section-head em,.golden em,.cake-copy em{color:var(--wine);font-style:italic}.hero-birthday{font:18px/1.45 "DM Serif Display",serif}.hero-birthday strong{font-size:24px}.hero-date{font-size:11px;text-transform:uppercase;letter-spacing:.13em;color:#766966}.scroll-cue{display:inline-flex;gap:12px;color:var(--wine);text-decoration:none;text-transform:uppercase;letter-spacing:.15em;font-size:10px;margin-top:35px}.hero-photo-wrap{position:relative;max-width:480px;justify-self:end}.hero-photo{display:block;width:100%;height:min(70vh,680px);object-fit:cover;filter:saturate(.88) sepia(.08);box-shadow:15px 16px 0 var(--blush);animation:photoFloat 7s ease-in-out infinite}.photo-tag{position:absolute;z-index:1;top:34px;left:-58px;background:var(--paper);padding:12px 15px;font-size:10px;line-height:1.4;letter-spacing:.12em;text-transform:uppercase;box-shadow:0 4px 15px #3b29251a;transform:rotate(-7deg)}.photo-tag span{font:25px "Parisienne",cursive;color:var(--wine)}.photo-caption{position:absolute;right:-38px;bottom:36px;font:27px/1.05 "Parisienne",cursive;color:var(--wine);transform:rotate(-5deg)}.centered{text-align:center}.section-head h2{font-size:clamp(38px,5vw,60px);margin-bottom:50px}.morning{position:relative;display:grid;place-items:center;min-height:730px}.morning-paper{position:relative;z-index:1;width:min(690px,100%);padding:70px clamp(28px,7vw,92px);background:var(--paper);box-shadow:0 18px 45px #3b292519;transform:rotate(-1.2deg)}.morning h2{font-size:clamp(38px,5vw,58px);margin-bottom:28px}.large-copy{font:19px/1.8 "DM Serif Display",serif}.wishes-list{border-top:1px solid var(--line);margin-top:32px;padding-top:18px;display:grid;gap:9px;color:#615956;font-size:13px}.wishes-list span:before{content:"+";color:var(--gold);margin-right:9px}.handwrite{position:absolute;right:25px;bottom:-31px;font:32px "Parisienne",cursive;color:var(--wine)}.pressed-flower{position:absolute;color:var(--blush);font-size:160px;right:12%;top:12%}
.things-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;align-items:start}.thing-card{min-height:270px;padding:27px 22px;background:#f6e6df;box-shadow:4px 6px 13px #3b292516;transform:rotate(-1.5deg)}.thing-card:nth-child(2),.thing-card:nth-child(4){margin-top:52px;background:#ebe3d7}.thing-card:nth-child(3){background:#f0dce0}.thing-card span{color:var(--wine);font:14px "DM Serif Display",serif}.thing-card h3{font:25px "DM Serif Display",serif;margin:28px 0 12px}.thing-card p{font-size:12px;line-height:1.7}.last-card{transform:rotate(2deg)}.wish-grid{max-width:1000px;margin:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.wish-card{height:245px;border:1px solid #d9bfc2;background:#8b3a4a;color:#fffdfc;padding:20px;cursor:pointer;text-align:left;position:relative;overflow:hidden;transition:transform .55s,background .55s,color .55s}.wish-card:nth-child(even){background:#c9a86a}.wish-card:hover{transform:translateY(-7px) rotate(-1deg)}.card-letter{font:64px/1 "DM Serif Display",serif;opacity:.7;display:block}.wish-card>span:not(.card-letter){position:absolute;bottom:19px;left:20px;font-size:11px;letter-spacing:.1em}.wish-card p{position:absolute;inset:25px 20px auto;opacity:0;transform:translateY(12px);font:16px/1.55 "DM Serif Display",serif;transition:.45s}.wish-card.opened{background:var(--paper);color:var(--wine);transform:rotate(0)}.wish-card.opened .card-letter,.wish-card.opened>span:not(.card-letter){opacity:0}.wish-card.opened p{opacity:1;transform:none}.memories{overflow:hidden}.film-strip{display:flex;gap:13px;width:max-content;padding:14px;background:#292322;transform:rotate(-1.5deg);margin-left:-3vw}.film-strip figure{margin:0;width:220px;background:#f7f1e8;padding:7px 7px 11px}.film-strip figure:nth-child(2n){width:170px;margin-top:40px}.film-strip img{display:block;width:100%;height:245px;object-fit:cover;filter:saturate(.82)}.film-strip figure:nth-child(2n) img{height:190px}.film-strip figcaption{font:17px "Parisienne",cursive;color:var(--wine);padding:8px 2px 0}.golden{min-height:720px;display:flex;align-items:center;background:linear-gradient(115deg,#84503c,#c98c62 55%,#e1bb8e);color:#fffaf4}.golden .eyebrow{color:#ffe3aa}.golden-copy{max-width:590px}.golden h2{font-size:clamp(45px,6vw,76px);margin-bottom:35px}.golden p:not(.eyebrow){font-size:16px;max-width:510px;margin-bottom:20px}.letter-section{overflow:hidden}.envelope-wrap{position:relative;max-width:640px;height:430px;margin:0 auto}.envelope{position:absolute;z-index:2;left:50%;bottom:0;transform:translateX(-50%);width:min(580px,100%);height:310px;border:0;background:#dcb5a7;cursor:pointer;box-shadow:0 15px 25px #3b292524}.envelope:before,.envelope:after{content:"";position:absolute;bottom:0;width:0;height:0;border-style:solid}.envelope:before{left:0;border-width:155px 290px;border-color:transparent transparent #e8c9cf #e8c9cf}.envelope:after{right:0;border-width:155px 290px;border-color:transparent #efd3ce #efd3ce transparent}.envelope-flap{position:absolute;z-index:3;top:0;left:0;border-style:solid;border-width:155px 290px 0;border-color:#c99d94 transparent transparent;transform-origin:top;transition:transform .8s}.envelope-label{position:absolute;z-index:4;top:102px;left:50%;transform:translateX(-50%) rotate(-2deg);width:175px;padding:16px 8px;background:#fffaf2;color:var(--wine);font:21px/1.12 "DM Serif Display",serif}.envelope-label em{font:23px "Parisienne",cursive}.wax{position:absolute;z-index:5;top:125px;left:calc(50% - 17px);width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--wine);color:#fff;font:21px "Parisienne",cursive}.letter{position:absolute;z-index:1;left:50%;bottom:37px;transform:translateX(-50%);width:78%;height:365px;overflow:auto;padding:35px 44px;background:#fffdf8;box-shadow:0 0 0 1px #e6dccf;color:#453c37;font-size:13px;line-height:1.65;transition:transform .9s}.letter p{margin-bottom:13px}.letter-dear,.letter-english{font:29px "Parisienne",cursive!important;color:var(--wine)}.letter strong{font:18px "DM Serif Display",serif;color:var(--wine)}.envelope-wrap.open .envelope-flap{transform:rotateX(180deg);z-index:0}.envelope-wrap.open .letter{transform:translate(-50%,-185px)}
.things-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}.thing-card{min-height:270px;padding:27px 22px;background:#f6e6df;box-shadow:4px 6px 13px #3b292516;transform:rotate(-1.5deg)}.thing-card:nth-child(2),.thing-card:nth-child(4){margin-top:52px;background:#ebe3d7}.thing-card:nth-child(3){background:#f0dce0}.thing-card span{color:var(--wine);font:14px "DM Serif Display",serif}.thing-card h3{font:25px "DM Serif Display",serif;margin:28px 0 12px}.thing-card p{font-size:12px;line-height:1.7}.last-card{transform:rotate(2deg)}.wish-grid{max-width:1000px;margin:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.wish-card{height:245px;border:1px solid #d9bfc2;background:#8b3a4a;color:#fffdfc;padding:20px;cursor:pointer;text-align:left;position:relative;overflow:hidden;transition:.55s}.wish-card:nth-child(even){background:#c9a86a}.wish-card:hover{transform:translateY(-7px)}.card-letter{font:64px/1 "DM Serif Display",serif;opacity:.7;display:block}.wish-card>span:not(.card-letter){position:absolute;bottom:19px;left:20px;font-size:11px;letter-spacing:.1em}.wish-card p{position:absolute;inset:25px 20px auto;opacity:0;transform:translateY(12px);font:16px/1.55 "DM Serif Display",serif;transition:.45s}.wish-card.opened{background:var(--paper);color:var(--wine)}.wish-card.opened .card-letter,.wish-card.opened>span:not(.card-letter){opacity:0}.wish-card.opened p{opacity:1;transform:none}.memories{overflow:hidden}.film-strip{display:flex;gap:13px;width:max-content;padding:14px;background:#292322;transform:rotate(-1.5deg);margin-left:-3vw}.film-strip figure{margin:0;width:220px;background:#f7f1e8;padding:7px 7px 11px}.film-strip figure:nth-child(2n){width:170px;margin-top:40px}.film-strip img{display:block;width:100%;height:245px;object-fit:cover;filter:saturate(.82)}.film-strip figure:nth-child(2n) img{height:190px}.film-strip figcaption{font:17px "Parisienne",cursive;color:var(--wine);padding:8px 2px 0}.golden{min-height:720px;display:flex;align-items:center;background:linear-gradient(115deg,#84503c,#c98c62 55%,#e1bb8e);color:#fffaf4}.golden .eyebrow{color:#ffe3aa}.golden-copy{max-width:590px}.golden h2{font-size:clamp(45px,6vw,76px);margin-bottom:35px}.golden p:not(.eyebrow){font-size:16px;max-width:510px;margin-bottom:20px}.letter-section{overflow:hidden}.envelope-wrap{position:relative;max-width:640px;height:430px;margin:auto}.envelope{position:absolute;z-index:2;left:50%;bottom:0;transform:translateX(-50%);width:min(580px,100%);height:310px;border:0;background:#dcb5a7;cursor:pointer}.envelope:before,.envelope:after{content:"";position:absolute;bottom:0;width:0;height:0;border-style:solid}.envelope:before{left:0;border-width:155px 290px;border-color:transparent transparent #e8c9cf #e8c9cf}.envelope:after{right:0;border-width:155px 290px;border-color:transparent #efd3ce #efd3ce transparent}.envelope-flap{position:absolute;z-index:3;top:0;left:0;border-style:solid;border-width:155px 290px 0;border-color:#c99d94 transparent transparent;transform-origin:top;transition:.8s}.envelope-label{position:absolute;z-index:4;top:102px;left:50%;transform:translateX(-50%);width:175px;padding:16px;background:#fffaf2;color:var(--wine);font:21px/1.12 "DM Serif Display",serif}.wax{position:absolute;z-index:5;top:125px;left:calc(50% - 17px);width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--wine);color:#fff;font:21px "Parisienne",cursive}.letter{position:absolute;z-index:1;left:50%;bottom:37px;transform:translateX(-50%);width:78%;height:365px;overflow:auto;padding:35px 44px;background:#fffdf8;font-size:13px;line-height:1.65;transition:.9s}.letter-dear,.letter-english{font:29px "Parisienne",cursive!important;color:var(--wine)}.envelope-wrap.open .envelope-flap{transform:rotateX(180deg);z-index:0}.envelope-wrap.open .letter{transform:translate(-50%,-185px)}
.music{background:#eadadd}.player{max-width:760px;margin:40px auto 0;padding:30px;display:flex;align-items:center;gap:38px;background:#fffaf8}.record{width:190px;height:190px;flex:0 0 190px;border-radius:50%;background:repeating-radial-gradient(#312b2a 0 4px,#191515 5px 7px);display:grid;place-items:center}.record div{width:52px;height:52px;border-radius:50%;background:var(--blush);border:8px solid var(--gold)}.record.playing{animation:spin 4s linear infinite}.player-info{flex:1}.now-playing{font-size:9px;letter-spacing:.18em;color:var(--wine);margin-bottom:5px}.player h3{font:28px/1.1 "DM Serif Display",serif;margin:0}.player-info>p:not(.now-playing){font-size:12px;color:#766966;margin:4px 0 18px}input[type=range]{accent-color:var(--wine);width:100%;cursor:pointer}.player-controls{display:flex;align-items:center;gap:13px;margin-top:15px}.player-controls button{border:0;background:none;color:var(--wine);font-size:24px;cursor:pointer}.player-controls .play-button{width:43px;height:43px;border-radius:50%;background:var(--wine);color:#fff;font-size:16px}.volume{margin-left:auto;color:var(--wine);font-size:20px;display:flex;align-items:center;gap:7px}.volume input{width:70px}.cake-section{text-align:center;min-height:700px;overflow:hidden}.cake-copy h2{font-size:clamp(43px,5vw,64px)}.cake-scene{position:relative;width:290px;height:300px;margin:10px auto;border:0;background:none;cursor:pointer;display:block}.cake-plate{position:absolute;bottom:8px;left:18px;width:254px;height:20px;border-radius:50%;background:#d8c0ae}.cake-body{position:absolute;bottom:28px;left:37px;width:216px;height:110px;border-radius:15px 15px 32px 32px;background:#b94f61;border-bottom:9px solid #8b3a4a}.cake-body:before{content:"";position:absolute;top:0;left:0;width:100%;height:27px;border-radius:50%;background:#fff1e9}.cake-body i{position:relative;z-index:1;display:inline-block;width:14px;height:26px;margin:18px 13px;background:#f4d998;border-radius:0 0 9px 9px}.cake-top{position:absolute;bottom:129px;left:37px;width:216px;height:22px;border-radius:50%;background:#fff1e9}.candle{position:absolute;z-index:2;bottom:145px;left:138px;width:14px;height:68px;background:repeating-linear-gradient(45deg,#e9b5bd 0 5px,#fff6eb 6px 10px)}.wick{position:absolute;z-index:3;bottom:211px;left:144px;width:3px;height:11px;background:#3a2b27}.flame{position:absolute;z-index:4;bottom:220px;left:136px;width:20px;height:32px;border-radius:50%;background:#ffcc60;box-shadow:0 0 25px #f7a935;animation:flicker 1s infinite}.cake-section.blown .flame{opacity:0;transform:translateY(-20px);transition:.7s}.wish-result{opacity:0;transform:translateY(20px);transition:.7s}.wish-result p{font:34px "Parisienne",cursive;color:var(--wine);margin:12px 0 0}.wish-result span{font:14px "DM Serif Display",serif}.cake-section.blown .wish-result{opacity:1;transform:none}.confetti{position:fixed;z-index:50;pointer-events:none;inset:0;overflow:hidden}.confetti i{position:absolute;width:8px;height:14px;animation:fall 2.6s ease-in forwards}.final{display:grid;grid-template-columns:.85fr 1.15fr;gap:9vw;align-items:center;background:#322a29;color:#fffaf4}.final-photo img{width:100%;height:590px;display:block;object-fit:cover;filter:saturate(.8)}.final-copy{max-width:590px}.final .eyebrow{color:#e9c681}.before{font:italic 20px "DM Serif Display",serif}.final h2{font-size:clamp(34px,4vw,57px);margin:18px 0 38px}.final h3{font:clamp(30px,4vw,48px) "DM Serif Display",serif;color:#e8c9cf;margin:0}.final-date{margin:15px 0 32px}.final small{display:block;margin-top:55px;font:25px "Parisienne",cursive;color:#e8c9cf}.petals i{position:fixed;z-index:2;width:13px;height:18px;border-radius:100% 0 100% 0;background:#d79ba6;opacity:.65;animation:petal 14s linear infinite}.petals i:nth-child(1){left:8%}.petals i:nth-child(2){left:23%;animation-delay:-9s}.petals i:nth-child(3){left:47%;animation-delay:-5s}.petals i:nth-child(4){left:69%;animation-delay:-11s}.petals i:nth-child(5){left:84%;animation-delay:-7s}.petals i:nth-child(6){left:95%;animation-delay:-13s}.reveal{opacity:0;transform:translateY(24px);transition:.8s}.reveal.visible{opacity:1;transform:none}@keyframes photoFloat{50%{transform:translateY(-9px)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes flicker{50%{transform:scale(.8,1.1)}}@keyframes petal{from{top:-30px}to{top:110vh;transform:rotate(390deg) translateX(80px)}}@keyframes fall{to{transform:translateY(110vh) rotate(600deg);opacity:0}}
@media(max-width:720px){.section-pad,.paper-section{padding:88px 24px}.cover:before,.paper-section:before{inset:10px}.cover h1{font-size:48px}.cover-flower{font-size:65px}.hero{grid-template-columns:1fr;gap:48px;padding-top:105px}.hero h2{font-size:49px}.hero-photo-wrap{width:82%;justify-self:center;margin-right:20px}.hero-photo{height:470px}.photo-tag{left:-31px;top:22px}.photo-caption{right:-24px;font-size:22px}.morning{min-height:620px}.pressed-flower{right:-20px;top:9%;font-size:110px}.morning-paper{padding:50px 27px}.large-copy{font-size:17px}.things-grid{grid-template-columns:1fr 1fr;gap:15px}.thing-card{min-height:230px}.thing-card:nth-child(2),.thing-card:nth-child(4){margin-top:35px}.last-card{grid-column:1/3;width:calc(50% - 8px);justify-self:center;margin-top:-8px}.wish-grid{grid-template-columns:1fr 1fr}.wish-card{height:195px}.film-strip{margin-left:-24px}.film-strip figure{width:170px}.film-strip img{height:195px}.golden{min-height:620px}.envelope-wrap{height:375px}.envelope{height:235px}.envelope:before{border-width:118px 145px}.envelope:after{border-width:118px 145px}.envelope-flap{border-width:118px 145px 0}.envelope-label{top:67px}.wax{top:95px}.letter{width:90%;height:325px;padding:25px 28px}.envelope-wrap.open .letter{transform:translate(-50%,-145px)}.player{padding:22px;gap:21px}.record{width:112px;height:112px;flex-basis:112px}.record div{width:36px;height:36px;border-width:6px}.player h3{font-size:23px}.volume{display:none}.cake-section{min-height:620px}.final{grid-template-columns:1fr;padding:0 0 75px;gap:50px}.final-photo img{height:460px}.final-copy{padding:0 28px}.final h2{font-size:38px}.final small{margin-top:38px}}@media(max-width:390px){.hero h2{font-size:44px}.things-grid{gap:10px}.thing-card{padding:20px 16px}.wish-card{padding:15px}.card-letter{font-size:52px}}




.two-of-us{background:var(--cream);position:relative}.two-intro{max-width:680px;margin:0 auto 65px;text-align:center}.two-intro h2{font-size:clamp(46px,6vw,76px);margin:0 0 14px}.two-subtitle{font:italic 19px "DM Serif Display",serif;color:var(--wine);margin:0}.two-layout{max-width:1030px;margin:auto;display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(34px,7vw,100px);align-items:start}.two-photo{position:relative;padding:12px;background:var(--paper);box-shadow:9px 11px 0 var(--blush);transform:rotate(-2.5deg)}.two-photo img{display:block;width:100%;height:430px;object-fit:cover;filter:saturate(.84) sepia(.06)}.two-photo span{position:absolute;right:-18px;bottom:-25px;color:var(--wine);font:29px "Parisienne",cursive;transform:rotate(-6deg)}.two-story{max-width:570px;padding-top:10px}.two-story p{margin:0 0 20px;font-size:15px;line-height:1.85}.two-story .two-closing{margin-top:38px;color:var(--wine);font:34px/1.05 "Parisienne",cursive}.two-of-us .reveal{transition-delay:.08s}@media(max-width:720px){.two-intro{margin-bottom:46px}.two-layout{grid-template-columns:1fr;gap:54px}.two-photo{width:80%;margin:auto}.two-photo img{height:355px}.two-story{max-width:none}.two-story p{font-size:14px;line-height:1.8}.two-story .two-closing{font-size:31px;margin-top:31px}}


/* Mobile-first refinement: preserves the journal layout while prioritising 375–430px screens. */
img{max-width:100%;height:auto}html,body{overflow-x:clip}button,.scroll-cue{touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
@media(max-width:720px){
  body{font-size:15px;line-height:1.72}.section-pad,.paper-section{padding:76px 22px}.paper-section:before{inset:9px}.eyebrow{font-size:10px;letter-spacing:.16em;margin-bottom:14px}
  .cover{overflow:hidden}.cover-inner{width:min(100%,340px);padding:28px 18px}.cover h1{font-size:clamp(40px,12vw,48px);line-height:1.04;margin:18px 0}.cover-date{font-size:18px}.cover-name{font-size:18px}.open-day{min-height:44px;padding:10px 4px;font-size:13px}.cover-note{bottom:18px;max-width:calc(100% - 36px);font-size:23px}.cover-flower{font-size:54px}.flower-one{left:4%;top:7%}.flower-two{right:4%;bottom:11%}
  .hero{min-height:0;gap:38px;padding-top:92px;padding-bottom:76px}.hero-copy{max-width:100%}.hero-kicker{font-size:18px;margin:22px 0 10px}.hero h2{font-size:clamp(41px,11.5vw,49px);line-height:1.04;margin-bottom:25px}.hero-birthday{font-size:17px}.hero-birthday strong{font-size:22px}.scroll-cue{min-height:44px;align-items:center;margin-top:25px}.hero-photo-wrap{width:84%;max-width:315px;margin-right:0}.hero-photo{height:430px}.photo-tag{left:-14px;top:16px;padding:10px 12px}.photo-caption{right:-8px;bottom:25px;font-size:20px}
  .morning{min-height:0;padding-top:80px;padding-bottom:92px;overflow:hidden}.morning-paper{padding:42px 23px;transform:rotate(-.7deg)}.morning h2{font-size:clamp(36px,10vw,44px);line-height:1.05;margin-bottom:22px}.large-copy{font-size:17px;line-height:1.72}.wishes-list{margin-top:25px;padding-top:16px;font-size:13px;gap:10px}.handwrite{right:16px;bottom:-27px;font-size:28px}.pressed-flower{right:-10px;top:4%;font-size:88px;opacity:.75}
  .section-head h2{font-size:clamp(37px,10.5vw,46px);line-height:1.06;margin-bottom:36px}.things-grid{gap:13px}.thing-card{min-height:218px;padding:21px 17px}.thing-card:nth-child(2),.thing-card:nth-child(4){margin-top:28px}.thing-card h3{font-size:23px;margin:22px 0 10px}.thing-card p{font-size:12.5px;line-height:1.65}.last-card{width:calc(50% - 7px)}
  .memories{padding-bottom:70px}.film-strip{gap:11px;margin-left:-22px;padding:11px;transform:rotate(-1deg)}.film-strip figure{width:158px;padding:6px 6px 10px}.film-strip figure:nth-child(2n){width:142px;margin-top:28px}.film-strip img{height:184px}.film-strip figure:nth-child(2n) img{height:163px}.film-strip figcaption{font-size:10px;margin-top:7px}
  .two-intro{margin-bottom:39px}.two-intro h2{font-size:clamp(43px,12vw,52px)}.two-subtitle{font-size:18px;line-height:1.45}.two-layout{gap:46px}.two-photo{width:82%;max-width:300px;padding:10px;box-shadow:7px 9px 0 var(--blush)}.two-photo img{height:350px}.two-photo span{right:-10px;bottom:-22px;font-size:27px}.two-story{padding-top:0}.two-story p{font-size:15px;line-height:1.82;margin-bottom:21px}.two-story .two-closing{font-size:30px;line-height:1.1;margin-top:34px}
  .wish-grid{gap:13px}.wish-card{height:184px;min-height:44px;padding:17px}.wish-card:hover{transform:none}.wish-card>span:not(.card-letter){bottom:16px;left:17px;font-size:10px}.wish-card p{inset:20px 17px auto;font-size:15px;line-height:1.5}.card-letter{font-size:54px}
  .golden{min-height:0;padding-top:82px;padding-bottom:82px}.golden h2{font-size:clamp(42px,11.5vw,51px);line-height:1.05;margin-bottom:27px}.golden p:not(.eyebrow){font-size:15px;line-height:1.78;margin-bottom:18px}
  .envelope-wrap{height:385px;margin-top:2px}.envelope{height:230px;min-height:44px}.envelope:before,.envelope:after{border-width:115px calc(50vw - 22px)}.envelope-flap{border-width:115px calc(50vw - 22px) 0}.envelope-label{top:62px;font-size:14px}.wax{top:91px}.letter{width:92%;height:327px;padding:24px 25px;font-size:13px;line-height:1.62}.letter p{margin-bottom:10px}.envelope-wrap.open .letter{transform:translate(-50%,-143px)}
  .player{display:flex;flex-direction:column;align-items:stretch;padding:24px;gap:18px}.record{width:98px;height:98px;flex-basis:98px;align-self:center}.record div{width:34px;height:34px;border-width:5px}.player-info{width:100%}.player h3{font-size:25px;line-height:1.14}.player-info>p:not(.now-playing){margin-bottom:16px}input[type=range]#progress{height:26px}.player-controls{gap:10px;margin-top:14px}.player-controls button{width:44px;height:44px;display:grid;place-items:center;font-size:24px}.player-controls .play-button{width:46px;height:46px}.volume{display:none}
  .cake-section{min-height:0;padding-top:80px;padding-bottom:74px}.cake-copy h2{font-size:clamp(42px,11.5vw,51px)}.cake-scene{width:290px;max-width:100%;height:292px;min-height:44px;margin:4px auto}.wish-result{padding:0 8px}.wish-result p{font-size:25px}.wish-result span{font-size:13px;line-height:1.6}
  .final{gap:37px;padding:0 0 66px}.final-photo{width:100%}.final-photo img{height:420px}.final-copy{padding:0 22px}.before{font-size:18px}.final h2{font-size:clamp(34px,9.5vw,39px);line-height:1.1;margin:16px 0 29px}.final h3{font-size:33px;line-height:1.1}.final-date{margin:14px 0 24px}.final small{margin-top:34px;font-size:23px}
  .petals i{width:10px;height:14px;opacity:.45}.reveal{transform:translateY(16px);transition-duration:.6s}
}
@media(max-width:390px){
  .section-pad,.paper-section{padding-left:20px;padding-right:20px}.hero{padding-top:84px}.hero h2{font-size:41px}.hero-photo{height:405px}.photo-caption{font-size:18px}.morning-paper{padding:38px 20px}.things-grid{gap:10px}.thing-card{padding:19px 14px;min-height:214px}.thing-card h3{font-size:21px}.thing-card p{font-size:12px}.two-story p{font-size:14.5px}.wish-grid{gap:10px}.wish-card{padding:14px;height:178px}.wish-card>span:not(.card-letter){left:14px}.wish-card p{inset:18px 14px auto;font-size:14px}.envelope-wrap{height:372px}.letter{padding:22px 21px}.final-copy{padding:0 20px}
}
@media(min-width:721px){.open-day,.wish-card,.envelope,.cake-scene,.player-controls button{min-height:44px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.cover,.reveal,.wish-card,.record,.petals i,.confetti i,.flame,.hero-photo,.thing-card,.morning-paper,.two-photo{animation:none!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}.cover.open{transform:translateY(-105%);opacity:0}}

/* FIX — surat yang terbuka tidak boleh tertutup amplop.
   Sebelumnya .letter punya z-index:1, sedangkan .envelope-flap z-index:3 dan
   badan amplop (#envelope) z-index:2. Saat terbuka flap hanya diputar
   rotateX(180deg) sehingga kotak visualnya TETAP menutupi kertas surat
   (baris 44%-90% teks tertutup, dan teks tidak bisa di-scroll).
   Solusi: flap + label + segel lilin disembunyikan saat terbuka, dan kertas
   surat dinaikkan di atas badan amplop sehingga seluruh teks terlihat dan
   bisa di-scroll. */
.envelope-wrap.open .envelope-flap,
.envelope-wrap.open .envelope-label,
.envelope-wrap.open .wax{visibility:hidden}
.envelope-wrap.open .letter{z-index:6}
/* amplop tetap bisa dipakai menutup surat lewat strip di samping kertas */
.envelope-wrap.open .letter{cursor:pointer}

/* FIX (MOBILE ONLY) — section "LITTLE MOMENTS" (.memories > .film-strip).
   Masalah: di HP foto terpotong karena strip memakai width:max-content +
   margin negatif + transform:rotate, sementara .memories{overflow:hidden}.
   Jadi strip lebih lebar dari layar, bukan scroller, dan sisanya di-clip —
   kartu terpotong dan tidak bisa digeser.
   Solusi: khusus <=720px strip dijadikan carousel swipe horizontal memakai
   native horizontal scroll (overflow-x:auto) + CSS scroll-snap.
   Desktop (>=721px) tidak diubah sama sekali. */
@media(max-width:720px){
.memories{overflow:hidden}
.memories .film-strip{display:flex;flex-wrap:nowrap;width:100%;max-width:100%;margin-left:0;padding:11px;gap:12px;transform:none;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:11px;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}
.memories .film-strip::-webkit-scrollbar{width:0;height:0;display:none}
.memories .film-strip:focus-visible{outline:2px solid var(--wine);outline-offset:3px}
.memories .film-strip figure,
.memories .film-strip figure:nth-child(2n){flex:0 0 auto;width:clamp(190px,62vw,252px);margin:0;padding:6px 6px 10px;scroll-snap-align:center;scroll-snap-stop:always}
.memories .film-strip img,
.memories .film-strip figure:nth-child(2n) img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;filter:saturate(.82)}
.memories .film-strip figcaption{font-size:14px;line-height:1.25;margin-top:7px;padding:6px 2px 0;text-align:center;white-space:normal}
}