@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Mrs+Saint+Delafield&display=swap');
:root{--cream:#f4eee3;--paper:#fbf7ee;--champagne:#d7c3a1;--ink:#574434;--muted:#796551;--rule:#b99e7655;--script:'Great Vibes','Monotype Corsiva','Segoe Script',cursive;--serif:'Cormorant Garamond',Georgia,serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:25px}body{margin:0;font:22px/1.6 var(--serif);color:var(--ink);background:var(--cream)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible{outline:2px solid #896b44;outline-offset:6px}#hero-title:focus{outline:none}[hidden]{display:none!important}img{display:block;max-width:100%}h1,h2,h3,p,figure{margin:0}h1,h2,h3{font-weight:400}h2{font:clamp(45px,5.3vw,70px)/1.3 var(--script)}h3{font:500 27px/1.4 var(--serif)}button:disabled{cursor:default}body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:30;opacity:.035;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='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23836445' filter='url(%23n)' opacity='.7' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
.eyebrow{text-transform:uppercase;font-size:14px;letter-spacing:.17em;color:var(--muted)}.flourish{display:block;font:35px/1.4 var(--serif);color:#9b7b51}.signature{font:37px/1.6 var(--script)}.site-header{position:absolute;inset:0 0 auto;z-index:3;display:flex;justify-content:space-between;align-items:center;padding:24px 5.5%;border-bottom:1px solid #a58a6530;background:linear-gradient(#f4eee3b3,#f4eee344)}.monogram{font:36px/1.2 var(--script);text-decoration:none;white-space:nowrap}.monogram span{font-size:25px}.site-header nav{display:flex;gap:28px}.site-header nav a{font-size:17px;text-decoration:none;min-height:44px;display:flex;align-items:center}.site-header nav a:hover{text-decoration:underline;text-underline-offset:6px}
.hero{position:relative;min-height:950px;min-height:max(900px,100svh);display:grid;place-items:center;isolation:isolate;padding:128px 24px 76px;overflow:hidden}.hero-landscape{position:absolute;inset:0;z-index:-2;background:linear-gradient(0deg,#f4eee3 0%,#f4eee300 27%,#f4eee326 75%,#f4eee380),url('assets/romantic-landscape.jpg') center 58%/cover;filter:saturate(.35) sepia(.12)}.hero::after{content:'';position:absolute;inset:16px;z-index:-1;border:1px solid #a58a6540;outline:1px solid #a58a6520;outline-offset:-7px;pointer-events:none}.hero-letter{position:relative;width:min(660px,100%);text-align:center;padding:26px 48px 25px;background:radial-gradient(ellipse,#fffaf2e8 45%,#fffaf2c7 65%,#fffaf250 88%,transparent 100%);border-radius:48% 48% 3px 3px}.hero-letter::before{content:'';position:absolute;inset:-12px 0 0;z-index:-1;background:linear-gradient(90deg,transparent,#fffaf235 30% 70%,transparent);filter:blur(12px);transform:rotate(-3deg)}.hero-letter>.flourish{margin:15px 0 12px}.hero h1{font:clamp(65px,7.5vw,102px)/1.2 var(--script);white-space:nowrap}.hero h1 span{font-size:.57em;padding:0 .1em}.hero-date{font-size:20px;letter-spacing:.055em;margin-top:17px}.cameo{position:relative;display:grid;place-items:center;width:232px;height:284px;margin:28px auto 24px;border:6px double #b79b6faa;border-radius:50%;background:linear-gradient(#eee7d6c7,#eee7d6b8),url('assets/romantic-garden.jpg') center/cover;box-shadow:0 0 0 7px #fffaf250,0 10px 24px #57443422;overflow:hidden}.cameo::after{content:'';position:absolute;inset:6px;border:1px solid #b79b6f66;border-radius:50%;pointer-events:none}.couple-art{position:relative;display:block;width:125px;height:162px;overflow:hidden;filter:grayscale(1) sepia(.55);mix-blend-mode:multiply;transform:scale(1.48)}.couple-art img{position:absolute;max-width:none;width:520px;height:auto;left:-180px;top:-122px}.hero-message{font:italic 25px/1.5 var(--serif)}.scroll-note{font-size:16px;letter-spacing:.03em;margin-top:28px}.scroll-note span{display:block;font-size:22px;margin-top:5px}
.letter-scroll{max-width:980px;margin:0 auto;background:linear-gradient(135deg,#fffaf2ef,#f7f0e4ef);position:relative;border-inline:1px solid var(--rule);box-shadow:0 25px 70px #77604413}.letter-scroll::before,.letter-scroll::after{content:'';position:absolute;top:0;bottom:0;width:10px;background:radial-gradient(circle at 50% 50%,transparent 2px,#b9a17d44 2px 2.7px,transparent 3px) 0 0/10px 13px;pointer-events:none;opacity:.6}.letter-scroll::before{left:8px}.letter-scroll::after{right:8px}.paper-section{position:relative;padding:70px 80px;scroll-margin-top:24px}.paper-section+.paper-section::before{content:'';position:absolute;left:80px;right:80px;top:0;height:28px;background:url('assets/lace.svg') repeat-x center top;background-size:80px 28px;opacity:.65}.section-heading{text-align:center;margin-bottom:34px}.section-heading h2{margin:10px 0}.section-heading .flourish{margin-top:13px}.story{padding-top:55px}.story-copy{max-width:560px;margin:auto;text-align:center;font-size:24px}.salutation{font:35px/1.5 var(--script);margin-bottom:16px}.story-copy .signature{margin-top:24px}.countdown-section{text-align:center;padding-top:72px;padding-bottom:72px;background:linear-gradient(90deg,#ddc9a414,transparent 30% 70%,#ddc9a414)}.countdown-section h2{margin:12px 0 25px}.countdown{display:flex;justify-content:center;gap:14px;margin:25px auto 22px;max-width:570px}.countdown>div{display:flex;flex-direction:column;justify-content:center;width:120px;min-height:138px;position:relative;border:1px solid var(--rule);border-radius:48% 48% 3px 3px;background:#fffcf344}.countdown>div::after{content:'';position:absolute;inset:5px;border:1px solid #b99e7626;border-radius:inherit;pointer-events:none}.countdown>div>span:first-child{font-size:55px;line-height:1.15;font-variant-numeric:tabular-nums}.countdown>div>span:last-child{font-size:16px;color:var(--muted)}.countdown-note{font-size:18px}.event-date{font-size:21px;letter-spacing:.025em}.henna-layout{display:grid;grid-template-columns:300px 1fr;gap:50px;align-items:center}.illustration-frame{position:relative;max-width:300px;margin:auto;text-align:center}.illustration-garden{height:340px;width:280px;border:6px double #baa17aa6;border-radius:48% 48% 4px 4px;background:linear-gradient(#f1e9d3bd,#f1e9d3cd),url('assets/romantic-garden.jpg') center/cover;display:grid;place-items:center;box-shadow:0 8px 20px #77604414;overflow:hidden}.illustration-garden .couple-art{transform:scale(1.65)}.illustration-frame figcaption{font:32px/1.6 var(--script);margin-top:14px}.illustration-frame::before{content:'❦';position:absolute;left:calc(50% - 14px);top:-24px;color:#a2875c;font-size:32px;background:var(--paper);z-index:1;padding:0 5px}.lead{font:italic 27px/1.45 var(--serif);margin-bottom:24px}.event-details{margin:0}.event-details>div{display:grid;grid-template-columns:60px 1fr;gap:18px;padding:17px 0;border-bottom:1px solid var(--rule)}dt{font-size:17px;color:var(--muted)}dd{margin:0;font-size:22px;line-height:1.45}dd span{font-size:19px;color:var(--muted)}.content-placeholder{font-size:19px;font-style:italic;margin-top:25px;color:var(--muted)}.house-painting{position:relative;max-width:810px;margin:0 auto}.house-painting img{width:100%;height:auto;aspect-ratio:1.55;object-fit:cover;border:7px double #af90678c;border-radius:45% 45% 2px 2px;box-shadow:0 12px 30px #77604419}.house-painting::before{content:'❦';position:absolute;left:calc(50% - 16px);top:-20px;font-size:35px;color:#aa8b60;background:var(--paper);padding:0 8px;z-index:1}.house-painting figcaption{text-align:center;font-size:17px;margin-top:16px;font-style:italic;color:var(--muted)}.wedding-invitation{font:italic 27px/1.5 var(--serif);text-align:center;margin:38px auto 42px;max-width:600px}.wedding-program{display:grid;grid-template-columns:1fr 1.15fr;gap:40px;align-items:center}.program-title h3{font:italic 31px/1.4 var(--serif);margin-top:12px}.timeline{margin:0;padding:0;list-style:none}.timeline li{position:relative;display:grid;grid-template-columns:66px 1fr;gap:18px;padding:18px 0 18px 18px;border-left:1px solid #b99e7666}.timeline li::before{content:'';position:absolute;width:7px;height:7px;border-radius:50%;background:#b1946e;left:-4px;top:32px}.timeline time{font-size:20px;font-variant-numeric:tabular-nums}.timeline li>span{font-size:21px;line-height:1.45}.arrival-copy{display:grid;grid-template-columns:1fr 1fr;gap:42px;margin-bottom:32px}.arrival-copy h3{margin-bottom:12px}.arrival-copy p{font-size:20px}.arrival-copy address{font-size:21px;line-height:1.65;font-style:normal}.parking-note{margin-top:15px;color:var(--muted)}.text-link{display:inline-block;font-size:18px;text-decoration:none;border-bottom:1px solid #b1946e;padding-bottom:3px;min-height:32px}.text-link:hover{border-bottom-color:var(--ink)}.arrival-copy .text-link{margin-top:20px}.map-frame{position:relative;padding:12px;background:#e8ddc8;border:5px double #af906799;box-shadow:0 10px 25px #77604415}.map-caption{display:flex;align-items:center;justify-content:space-between;font-size:15px;letter-spacing:.07em;padding:4px 8px 16px}.map-caption>span:nth-child(2){font-size:29px}.map-frame iframe{display:block;border:0;width:100%;height:410px;filter:sepia(.2) saturate(.5)}.map-note{text-align:center;font-size:16px;margin-top:17px}.map-note a{text-underline-offset:4px}.venue-source{text-align:center;font-size:15px;margin-top:10px;color:var(--muted)}.calendar-section,.photos-section{text-align:center}.calendar-section h2{font-size:clamp(44px,5vw,65px);margin:12px auto 22px;max-width:600px}.calendar-section>p:not(.eyebrow){font-size:21px}.calendar-actions{display:flex;flex-direction:column;align-items:center;gap:19px;margin:26px 0}.letter-button{display:inline-flex;align-items:center;justify-content:center;gap:20px;font:20px/1.4 var(--serif);color:var(--ink);text-decoration:none;background:linear-gradient(135deg,#f0e4ce,#e6d6b9);border:1px solid #a98c655e;padding:16px 26px;min-height:50px;box-shadow:inset 0 0 0 4px #f8f2e666;transition:background .3s,box-shadow .3s}.letter-button:hover:not(:disabled){background:#e6d6b9;box-shadow:inset 0 0 0 4px #f8f2e6a6}.letter-button:disabled{opacity:.65}.calendar-section .calendar-note{max-width:580px;margin:auto;font-size:17px!important;color:var(--muted)}.photos-section>.flourish{margin-bottom:16px}.photos-section h2{margin:12px 0 18px}.photos-section>p:not(.eyebrow){font-size:22px}.upload-placeholder{margin:28px auto 0;max-width:590px;padding:28px 24px 25px;background:linear-gradient(135deg,#eee5d433,#fff9ee77);border-block:1px solid var(--rule);position:relative}.upload-placeholder p{font-size:19px}.upload-placeholder>.letter-button{margin-top:20px}.upload-placeholder>#upload-note{font-size:16px;color:var(--muted);margin-top:12px}.small-seal{display:grid;place-items:center;width:58px;height:58px;border-radius:46% 49% 45% 51%;margin:0 auto 18px;background:radial-gradient(circle at 30% 20%,#e9d8b8,#c7ac80);box-shadow:inset 0 0 0 3px #bf9f744d,inset 0 0 0 5px #fff4;font:22px var(--script);color:#71583b}footer{text-align:center;padding:65px 24px 55px;background:linear-gradient(#f4eee3,#ece1cd)}footer .signature{font-size:50px}footer>p:nth-child(2){font-size:16px;letter-spacing:.08em;margin:10px 0 24px}footer .text-link{font-size:16px}.reveal{opacity:0;transform:translateY(20px);transition:opacity 1.1s ease,transform 1.1s ease}.reveal.is-visible{opacity:1;transform:none}
.intro-active{overflow:hidden}.letter-intro{position:fixed;inset:0;z-index:25;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;padding:24px;background:linear-gradient(#f4eee388,#f4eee370),url('assets/romantic-landscape.jpg') center 60%/cover;transition:opacity .8s ease 1.6s}.intro-caption{font:clamp(32px,4vw,49px)/1.5 var(--script);text-align:center}.envelope-scene{position:relative;width:min(680px,100%);height:390px;perspective:1400px;margin:28px 0}.envelope{position:absolute;width:560px;height:350px;left:50%;top:50%;transform:translate(-50%,-40%);filter:drop-shadow(0 18px 18px #68513b35);pointer-events:none}.envelope-back{position:absolute;inset:0;background:#d9c9ae;border:1px solid #c6b290;border-radius:3px}.envelope-pocket{position:absolute;inset:0;background:linear-gradient(32deg,transparent 49.8%,#cdbb9a 50%,transparent 50.5%),linear-gradient(-32deg,transparent 49.8%,#cdbb9a 50%,transparent 50.5%),linear-gradient(0deg,#e8dcc7,#f4ecdc);clip-path:polygon(0 0,50% 48%,100% 0,100% 100%,0 100%);z-index:3;border-radius:3px}.envelope-pocket::after{content:'';position:absolute;inset:12px;border:1px solid #fff8}.envelope-flap{position:absolute;inset:0;background:linear-gradient(160deg,#fffaf0,#e5d6bc);clip-path:polygon(0 0,100% 0,50% 61%);transform-origin:top center;transition:transform 1.1s cubic-bezier(.45,0,.25,1) .25s;z-index:4}.envelope-flap::after{content:'';position:absolute;inset:10px;background:url('assets/lace.svg') repeat center/80px 28px;opacity:.18;clip-path:polygon(0 0,100% 0,50% 59%)}.envelope-open{position:absolute;left:50%;top:50%;transform:translate(-50%,-40%);width:560px;height:350px;z-index:5;border:0;background:none;color:var(--ink);transition:opacity .45s}.seal{position:absolute;left:50%;top:55%;transform:translate(-50%,-50%) rotate(-7deg);width:80px;height:80px;border-radius:47% 51% 45% 52%;display:grid;place-content:center;background:radial-gradient(circle at 35% 25%,#e7d4b3,#c5aa7f 70%,#aa8b62);color:#71583b;font:27px/1 var(--script);box-shadow:inset 0 0 0 4px #c5aa7f,inset 0 0 0 6px #edddbd88,inset 1px 3px 7px #fff9,0 4px 8px #71533744;transition:transform .6s,opacity .6s}.seal i{font:italic 14px Georgia}.envelope-address{position:absolute;width:100%;left:0;bottom:45px;font:32px var(--script)}.letter-slip{position:absolute;inset:12px 30px 24px;padding:35px 20px;background:var(--paper);border:5px double #c5ae85;display:flex;flex-direction:column;align-items:center;gap:15px;transform:translateY(0);transition:transform 1.1s ease .6s;z-index:2}.letter-slip>span:first-child{font:48px var(--script)}.letter-slip>span:last-child{font-size:20px;letter-spacing:.06em}.tulle{position:absolute;right:-15px;top:38px;bottom:10px;width:150px;background:repeating-linear-gradient(8deg,#fff0 0 3px,#fff4 3px 4px),repeating-linear-gradient(98deg,#fff0 0 3px,#fff3 3px 4px);border-radius:45% 20% 40% 10%;transform:rotate(13deg);filter:drop-shadow(0 2px 2px #5744340d);opacity:.7;pointer-events:none;transition:opacity .8s,transform 1.4s;z-index:6}.intro-note{font-size:18px;margin-top:20px}.skip-intro{font:16px var(--serif);color:var(--muted);border:0;border-bottom:1px solid var(--rule);background:none;padding:12px;min-height:44px;margin-top:16px}.is-opening{opacity:0;pointer-events:none}.is-opening .seal{transform:translate(-50%,-20%) rotate(-15deg);opacity:0}.is-opening .envelope-open{opacity:0}.is-opening .envelope-flap{transform:rotateX(178deg)}.is-opening .letter-slip{transform:translateY(-135px)}.is-opening .tulle{opacity:0;transform:translateX(35px) rotate(18deg)}
@media(max-width:1000px){.letter-scroll{margin-inline:24px}.paper-section{padding:65px 55px}.paper-section+.paper-section::before{left:55px;right:55px}.henna-layout{grid-template-columns:260px 1fr;gap:30px}.illustration-garden{width:250px;height:310px}.hero{min-height:max(850px,100svh)}.hero-letter{padding-inline:30px}.wedding-program{gap:24px}.timeline li{gap:12px}.arrival-copy{gap:28px}}
@media(max-width:650px){body{font-size:20px}.site-header{padding:18px 22px}.monogram{font-size:31px}.site-header nav{gap:14px}.site-header nav a{font-size:15px}.hero{min-height:850px;padding:106px 20px 50px}.hero-landscape{background:linear-gradient(0deg,#f4eee3,#f4eee310 32%,#f4eee333 80%),url('assets/romantic-landscape.jpg') 44% center/cover}.hero-letter{padding:24px 12px;max-width:390px;background:radial-gradient(ellipse,#fffaf2ee 45%,#fffaf2c7 65%,#fffaf250 88%,transparent 100%)}.hero h1{font-size:clamp(44px,13.5vw,76px)}.hero-letter>.eyebrow{font-size:13px;letter-spacing:.1em}.hero-date{font-size:18px;letter-spacing:.01em}.hero-message{font-size:23px}.cameo{width:210px;height:262px;margin-top:25px}.couple-art{transform:scale(1.36)}.scroll-note{font-size:16px;margin-top:22px}.letter-scroll{margin-inline:10px}.letter-scroll::before{left:5px;width:6px}.letter-scroll::after{right:5px;width:6px}.paper-section{padding:58px 25px}.paper-section+.paper-section::before{left:24px;right:24px}.section-heading{margin-bottom:26px}.eyebrow{font-size:14px;letter-spacing:.09em}h2{font-size:clamp(40px,10.5vw,57px)}.story-copy{font-size:22px}.signature{font-size:32px}.countdown{gap:7px}.countdown>div{width:calc(25% - 5px);min-height:111px}.countdown>div>span:first-child{font-size:39px}.countdown>div>span:last-child{font-size:14px}.countdown-note{font-size:17px}.henna-layout{grid-template-columns:1fr;gap:26px}.illustration-garden{width:260px;height:310px}.illustration-garden .couple-art{transform:scale(1.5)}.lead{text-align:center;font-size:25px}.event-date{font-size:19px}.event-details>div{grid-template-columns:50px 1fr;gap:13px}.event-copy{max-width:400px;margin:auto}.content-placeholder{text-align:center;font-size:18px}.house-painting img{border-width:5px;aspect-ratio:1.2;object-position:50% 50%;border-radius:45% 45% 2px 2px}.house-painting figcaption{font-size:16px}.wedding-invitation{font-size:24px;margin:28px 0}.wedding-invitation br{display:none}.wedding-program{grid-template-columns:1fr;gap:20px}.program-title{text-align:center}.program-title h3{font-size:28px}.timeline{margin:0 7px}.timeline li{grid-template-columns:62px 1fr;gap:10px;padding:16px 0 16px 17px}.timeline li>span{font-size:20px}.arrival-copy{grid-template-columns:1fr;gap:28px}.arrival-copy h3{font-size:25px}.map-frame{padding:6px;border-width:4px}.map-frame iframe{height:350px}.map-caption{font-size:14px;letter-spacing:0;padding:6px 3px 12px}.map-caption>span:nth-child(2){font-size:24px}.map-note{font-size:16px}.calendar-section h2{font-size:clamp(40px,10.4vw,55px)}.calendar-section>p:not(.eyebrow){font-size:20px}.letter-button{font-size:19px;padding:15px 19px;gap:12px}.upload-placeholder{padding:24px 10px}.photos-section>p:not(.eyebrow){font-size:20px}footer{padding:45px 20px}.intro-caption{font-size:clamp(29px,7vw,40px)}.envelope-scene{height:290px;margin:20px 0}.envelope,.envelope-open{width:min(390px,100%);height:auto;aspect-ratio:1.6}.seal{width:65px;height:65px;font-size:24px;top:54%}.envelope-address{font-size:27px;bottom:28px}.tulle{width:80px;right:0;top:45px;bottom:5px}.letter-slip{inset:8px 18px 15px;padding:24px 10px}.letter-slip>span:first-child{font-size:35px}.letter-slip>span:last-child{font-size:17px}.is-opening .letter-slip{transform:translateY(-90px)}}
@media(max-width:380px){.site-header{padding:12px 16px;flex-direction:column;gap:3px}.monogram{font-size:29px}.site-header nav{gap:10px}.site-header nav a{font-size:14px}.paper-section{padding-inline:22px}.illustration-garden{width:240px}.countdown>div>span:first-child{font-size:34px}.hero-date{font-size:17px}.map-caption{font-size:13px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.letter-intro{display:none!important}.intro-active{overflow:auto}.reveal{opacity:1;transform:none}}

.couple-art{width:196px;height:258px;transform:none;filter:none;mix-blend-mode:normal}.couple-art img{position:static;width:100%;height:100%;object-fit:contain}.illustration-garden .couple-art{width:220px;height:285px;transform:none}@media(max-width:650px){.cameo .couple-art{width:185px;height:244px}.illustration-garden .couple-art{width:210px;height:280px;transform:none}}

/* Continuous woodland and translucent stationery. */
body{isolation:isolate;background:#e9e2d5}
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(#f4eee333,#f4eee342),url('assets/romantic-landscape.jpg') center 58%/cover;filter:saturate(.35) sepia(.12)}
.hero-landscape{display:none}.hero::after{display:none}
.letter-scroll{background:linear-gradient(90deg,transparent,#fffaf2bb 10%,#fffaf2bb 90%,transparent);border:0;box-shadow:none}
.letter-scroll::before,.letter-scroll::after{opacity:.25}
.paper-section,.countdown-section{background:transparent}
footer{background:linear-gradient(90deg,transparent,#fffaf2b0 20% 80%,transparent)}
.upload-placeholder{background:#fff9ee30}.map-frame{background:#eee4d5aa}
.hero{display:flex;flex-direction:column;justify-content:flex-start;min-height:1050px;padding-top:120px;overflow:hidden}
.hero-letter{isolation:isolate;background:radial-gradient(ellipse,#fffaf2ce 35%,#fffaf299 67%,#fffaf233 85%,transparent 100%);padding-top:10px}
.hero-letter>.flourish{margin:10px 0}.hero-date{margin-top:0;font-size:18px;letter-spacing:.12em}
.floral-spray{position:absolute;width:165px;height:400px;top:160px;object-fit:contain;opacity:.78;z-index:-1;pointer-events:none}
.floral-left{left:-30px;transform:rotate(-8deg)}.floral-right{right:-30px;transform:scaleX(-1) rotate(-8deg)}
.heart-date{position:relative;width:140px;height:119px;margin:15px auto 0;display:grid;place-items:center}
.heart-date svg{position:absolute;inset:0;width:100%;height:100%;fill:#fffaf277;stroke:#ac9370;stroke-width:1.2;filter:drop-shadow(0 3px 4px #77604418)}
.heart-date time{position:relative;font:23px/1.2 var(--script);text-align:center;transform:translateY(-7px)}.heart-date time span{font:17px var(--serif);letter-spacing:.12em}
.cameo{margin-top:20px}.henna-verse{font:italic 25px/1.45 var(--serif);color:#765b43}
.henna-layout{grid-template-columns:1.2fr 1fr;gap:38px}.henna-painting{margin:0;min-width:0}
.henna-painting img{width:100%;height:auto;aspect-ratio:1.08;object-fit:cover;border:5px double #aa906e99;border-radius:45% 45% 3px 3px;filter:saturate(.63)}
.henna-painting figcaption{font:italic 17px var(--serif);text-align:center;margin-top:14px}
.house-painting img{aspect-ratio:1.8;filter:saturate(.35) sepia(.1);border-radius:35% 35% 2px 2px;object-position:center}
.house-painting::before{background:#f9f2e6b3}

/* The same dimensional envelope travels from the entrance to the page. */
#letter-content{transition:opacity 1s ease}.intro-active #letter-content{opacity:0}.intro-active.letter-unfolded #letter-content{opacity:1}
.letter-intro{background:none;transition:none;gap:0;padding:24px;perspective:1800px}
.letter-intro[hidden]{display:none!important}
.intro-caption{font-size:clamp(30px,4vw,46px);margin:0 0 40px;transition:opacity .45s}
.envelope-scene{position:relative;width:min(790px,88vw);height:auto;aspect-ratio:1.62;perspective:1800px;margin:0;transform-origin:top left;flex-shrink:0;will-change:transform}
.envelope{position:absolute;inset:0;width:100%;height:100%;left:0;top:0;transform:rotateX(13deg) rotateY(-8deg) rotateZ(-3deg);transform-style:preserve-3d;filter:none;transition:transform 1.2s cubic-bezier(.22,.7,.2,1);pointer-events:none}
.envelope-back{border-radius:3px;background:linear-gradient(130deg,#e3d5bd,#cdbb9b);transform:translateZ(0);box-shadow:0 25px 40px #47352145,0 3px 0 #b5a07d}
.envelope-pocket{transform:translateZ(7px);box-shadow:inset 0 -3px 0 #c3b18f;z-index:3;background:linear-gradient(32deg,transparent 49.7%,#bda683 50%,#fffaf277 50.3%,transparent 50.7%),linear-gradient(-32deg,transparent 49.7%,#bda683 50%,#fffaf277 50.3%,transparent 50.7%),linear-gradient(120deg,#f5ecdb,#deceb0)}
.envelope-flap{background:none;clip-path:none;transform-style:preserve-3d;transform:translateZ(10px) rotateX(0deg);transform-origin:50% 0;z-index:4;transition:transform 1.35s cubic-bezier(.3,.05,.2,1) .35s}
.envelope-flap::after{display:none}.flap-front,.flap-lining{position:absolute;inset:0;clip-path:polygon(0 0,100% 0,50% 61%);backface-visibility:hidden}
.flap-front{background:linear-gradient(155deg,#fff8e9,#e0ceb0);filter:drop-shadow(0 3px 2px #735c3c33)}
.flap-front::after{content:'';position:absolute;inset:10px;background:url('assets/lace.svg') repeat center/80px 28px;opacity:.15}
.flap-lining{background:linear-gradient(#ece0cbcc,#ece0cbcc),url('assets/romantic-garden.jpg') center/cover;transform:rotateY(180deg)}
.letter-slip{inset:5% 5% 7%;padding:7% 10%;transform:translateZ(3px);background:linear-gradient(145deg,#fffbf2,#e9ddc6);border:4px double #bba17a;transition:transform 1.1s ease .8s;box-shadow:0 0 4px #735c3c33}
.letter-slip>span:first-child{font-size:clamp(30px,4.7vw,62px)}.letter-slip>span:last-child{font-size:clamp(14px,1.8vw,23px)}
.envelope-open{position:absolute;left:50%;top:52%;width:clamp(92px,13vw,132px);height:clamp(92px,13vw,132px);transform:translate(-50%,-50%) rotate(-7deg);padding:0;z-index:8;transition:opacity .4s,transform .5s;background:none;border:0;border-radius:50%}
.seal{position:absolute;inset:0;width:100%;height:100%;left:0;top:0;transform:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;border-radius:46% 50% 44% 49%;background:radial-gradient(ellipse at 30% 18%,#f0dfbd,#c7a879 70%,#ad8756);box-shadow:inset 0 0 0 4px #b9966466,inset 0 0 0 7px #fff1cc66,inset -5px -6px 9px #8e6b4533,0 6px 10px #57402855;text-shadow:0 1px 0 #fff6}
.seal-flower{width:36%;height:36%;background:url('assets/rose-engraving.svg') center/contain no-repeat;margin-top:-2px;opacity:.85}
.seal-initials{font:clamp(24px,3.3vw,36px)/1 var(--script)}.seal-initials i{font:italic .52em Georgia}
.seal-date{font:10px/1.5 var(--serif);letter-spacing:.1em;margin-top:5px}
.envelope-open:hover{transform:translate(-50%,-50%) rotate(-3deg) scale(1.04)}
.envelope-address{position:absolute;left:0;bottom:8%;width:100%;text-align:center;font:clamp(24px,3.5vw,40px) var(--script);z-index:7;pointer-events:none;transform:rotate(-3deg);transition:opacity .5s}
.tulle{top:3%;right:-2%;bottom:-7%;width:22%;opacity:.45;transform:rotate(13deg)}
.intro-note{margin-top:45px;font-size:19px;text-align:center;transition:opacity .45s}.skip-intro{transition:opacity .45s;margin-top:10px}
.unsealing .intro-caption,.unsealing .intro-note,.unsealing .skip-intro{opacity:0;pointer-events:none}
.is-open .envelope-open{opacity:0;pointer-events:none;transform:translate(-50%,-20%) rotate(-14deg) scale(.9)}
.is-open .envelope-flap{transform:translateZ(10px) rotateX(-174deg)}
.is-open .envelope{transform:rotateX(0deg) rotateY(0deg) rotateZ(0deg)}
.is-open .letter-slip{transform:translateY(-18%) translateZ(3px)}
.is-open .envelope-address{opacity:0}.is-open .tulle{opacity:0;transform:translateX(25px) rotate(20deg)}
.envelope-dock{position:relative;width:220px;height:136px;margin:35px auto 12px;flex-shrink:0;pointer-events:none}
.envelope-dock .envelope-scene{width:100%;height:100%;aspect-ratio:auto;margin:0;will-change:auto}
.envelope-dock .letter-slip{padding:15px 8px;gap:5px;border-width:2px}.envelope-dock .letter-slip>span:first-child{font-size:23px}.envelope-dock .letter-slip>span:last-child{font-size:11px}
.envelope-dock .envelope-back{box-shadow:0 8px 16px #47352125}.envelope-dock .envelope-open{display:none}
@media(max-width:1000px){.henna-layout{grid-template-columns:1fr 1fr;gap:28px}.floral-spray{width:140px}.floral-left{left:-12px}.floral-right{right:-12px}}
@media(max-width:650px){.hero{padding:100px 20px 45px;min-height:1050px}.hero-letter{background:radial-gradient(ellipse,#fffaf2ce 35%,#fffaf299 67%,#fffaf233 85%,transparent 100%)}.envelope-dock{width:170px;height:105px;margin:40px auto 12px}.envelope-dock .letter-slip>span:first-child{font-size:19px}.envelope-dock .letter-slip>span:last-child{font-size:9px}.envelope-dock .letter-slip{padding:9px 5px}.floral-spray{width:95px;height:350px;top:130px;opacity:.7}.floral-left{left:-23px}.floral-right{right:-23px}.heart-date{width:124px;height:105px}.heart-date time{font-size:22px}.hero-date{font-size:16px}.henna-layout{grid-template-columns:1fr;gap:24px}.henna-painting{max-width:420px;margin:auto}.henna-painting img{aspect-ratio:1.2}.henna-verse{font-size:24px}.house-painting img{aspect-ratio:1.5;border-radius:30% 30% 2px 2px}.envelope-scene{width:90vw;max-width:100%;height:auto;aspect-ratio:1.62}.intro-caption{margin-bottom:55px}.intro-note{margin-top:38px;font-size:17px}.letter-slip{padding:6% 10%}.envelope-address{font-size:24px;bottom:6%}.seal-date{font-size:9px}.tulle{right:0;top:3%;bottom:-7%;width:22%}}
@media(prefers-reduced-motion:reduce){.letter-intro:not([hidden]){display:flex!important}.intro-active{overflow:hidden}.intro-active #letter-content{opacity:0}.intro-active.letter-unfolded #letter-content{opacity:1}.envelope-scene{will-change:auto}}

.intro-caption,.intro-note,.skip-intro{color:#4f3e2f;text-shadow:0 1px 1px #fff9,0 0 12px #fffaf2}.intro-note,.skip-intro{background:radial-gradient(ellipse,#fffaf2b8,#fffaf266 60%,transparent 82%);padding:8px 22px}.skip-intro{border-bottom-color:#79655166}
@media(max-width:430px){.site-header{padding:12px 16px;flex-direction:column;gap:3px}.site-header nav{gap:16px}.hero{padding-top:125px}}

/* Quiet stationery; a single continuous envelope-to-page transition. */
.hero{min-height:max(730px,100svh);overflow:visible}
.hero-letter{margin-top:35px;padding:30px 24px 55px;background:radial-gradient(ellipse,#fffaf2a6,transparent 75%)}
.hero-letter::before{display:none}.hero-letter>.eyebrow{margin-bottom:22px}
.invitation-date{font:26px/1.5 var(--serif);margin:20px 0 4px;letter-spacing:.08em}
.hero-message{max-width:370px;margin:30px auto 0;font-size:24px}
.flourish:empty,.house-painting::before,.illustration-frame::before{display:none}
#letter-content{opacity:1;transition:none}.intro-active #letter-content{opacity:1}
.intro-active .site-header,.intro-active .hero-letter,.intro-active .letter-scroll,.intro-active footer{opacity:0}
.site-header,.hero-letter,.letter-scroll,footer{transition:opacity 1.5s ease}
.envelope-scene{container-type:inline-size;width:min(760px,88vw,112svh);aspect-ratio:1.62;perspective:1600px}
.envelope{transform:rotateX(8deg);transition:transform 1.8s cubic-bezier(.22,.65,.2,1)}
.envelope-back{background:linear-gradient(140deg,#ede3d1,#d6c5aa);box-shadow:0 22px 45px #47352130,0 2px 0 #bba889}
.envelope-pocket{background:linear-gradient(32deg,transparent 49.8%,#b7a58a66 50%,#fff8 50.2%,transparent 50.5%),linear-gradient(-32deg,transparent 49.8%,#b7a58a66 50%,#fff8 50.2%,transparent 50.5%),linear-gradient(125deg,#f4eddf,#e4d8c3)}
.envelope-pocket::after{inset:3%;border-color:#fff5}
.flap-front{background:linear-gradient(160deg,#faf5e9,#e7dbc6)}
.flap-front::after{inset:3%;background:url('assets/lace.svg') repeat-x center top/12cqw 4cqw;opacity:.18}
.flap-lining{background:linear-gradient(145deg,#e4d7c0,#f5ecdc);transform:rotateX(180deg)}
.envelope-flap{transition:transform 1.6s cubic-bezier(.24,.55,.2,1) .12s}
.letter-slip{padding:7% 8%;gap:2cqw;border:1px solid #bba17a66;transition:transform 1.7s cubic-bezier(.2,.65,.25,1) .4s}
.letter-slip>span:first-child,.envelope-dock .letter-slip>span:first-child{font-size:7cqw;line-height:1.25;white-space:nowrap}
.letter-slip>span:last-child,.envelope-dock .letter-slip>span:last-child{font-size:2.7cqw;line-height:1.4}
.envelope-open{top:50%;width:18%;height:auto;aspect-ratio:1;min-width:0;transform:translate(-50%,-50%);color:#71583b}
.envelope-open:hover{transform:translate(-50%,-50%) scale(1.025)}
.seal{border-radius:50%;overflow:hidden;padding:15%;gap:3%;background:radial-gradient(ellipse at 30% 20%,#e7d8bc,#c9ad83 74%,#b6976b);box-shadow:inset 0 0 0 1px #ad8f6480,inset 0 0 0 4px #e8d5ae,inset 0 0 0 5px #b99c7580,0 4px 9px #57402844;animation:wax-light 5s ease-in-out infinite}
.seal-initials{font:5cqw/1.25 var(--script);white-space:nowrap}.seal-initials i{font-size:.45em}
.seal-date{font:1.35cqw/1.5 var(--serif);letter-spacing:.04em;margin:0;white-space:nowrap}
@keyframes wax-light{0%,100%{filter:brightness(1)}50%{filter:brightness(1.075)}}
.is-open .seal{animation:none}.is-open .envelope-open{transform:translate(-50%,-68%) scale(.94);transition:opacity .45s,transform .6s;display:block}
.is-open .letter-slip{transform:translateY(-24%) translateZ(3px)}
.envelope-dock{width:220px;height:auto;aspect-ratio:1.62;z-index:5}
.envelope-dock .envelope-scene{width:100%;height:auto;aspect-ratio:1.62;overflow:visible}
.envelope-dock .letter-slip{padding:7% 8%;gap:2cqw;border-width:1px}
.small-seal{width:64px;height:64px;padding:12px;font-size:20px;line-height:1;white-space:nowrap;overflow:hidden;border-radius:50%}
.countdown>div{padding:18px 5px 12px}.countdown>div>span:first-child{font-size:clamp(29px,6vw,55px)}
@media(max-width:650px){.hero{min-height:max(680px,100svh)}.envelope-dock{width:170px;height:auto;aspect-ratio:1.62}.hero-letter{margin-top:24px}.hero-message{font-size:22px}.envelope-open{width:23%}.seal-initials{font-size:6.3cqw}.seal-date{font-size:1.7cqw}.invitation-date{font-size:23px}.countdown>div{padding-inline:3px}}
@media(prefers-reduced-motion:reduce){.seal{animation:none}.site-header,.hero-letter,.letter-scroll,footer{transition:none}}
.intro-active .site-header,.intro-active .hero-letter,.intro-active .letter-scroll,.intro-active footer{transition:none}.envelope-dock .envelope-back{box-shadow:0 8px 16px #47352125}.seal-date{color:#665039;font-weight:500}
.flap-lining{transform:rotateY(180deg)}.envelope-dock{margin-top:60px}.hero-letter>.eyebrow{color:#66513f}@media(max-width:650px){.envelope-dock{margin-top:55px}}
@media(max-width:650px){.seal-date{font-size:2.4cqw}}

/* Filmic warmth, translucent parchment, and readable raised letter. */
:root{--ink:#594332;--muted:#80644f}
body::before{inset:-14px;background:linear-gradient(#edcfaa30,#f0dac044),url('assets/romantic-landscape.jpg') center 58%/cover;filter:saturate(.46) sepia(.2);transform-origin:65% 35%;animation:woodland-breeze 22s ease-in-out infinite alternate;will-change:transform}
@keyframes woodland-breeze{from{transform:scale(1.018) translate3d(-3px,0,0) rotate(-.12deg)}to{transform:scale(1.035) translate3d(4px,-3px,0) rotate(.12deg)}}
.letter-scroll{background:linear-gradient(90deg,#fff8ee15,#fff8eed6 12%,#fff8eed6 88%,#fff8ee15)}
footer{background:linear-gradient(90deg,#fff8ee15,#fff8eed0 20% 80%,#fff8ee15)}
.hero-letter{width:min(660px,100%);background:linear-gradient(145deg,#fffdf6f2,#fff9eee8);border:1px solid #bca17a44;border-radius:3px;padding:42px 38px 45px;margin-top:32px;box-shadow:0 15px 42px #61452e1a,inset 0 0 0 6px #fffdf580;overflow:visible}
.hero h1{line-height:1.5;padding:.08em .15em;white-space:normal;overflow:visible}
.hero-letter>.eyebrow{margin-bottom:12px}.hero-message{margin-top:24px}
.envelope-scene{perspective:1200px;overflow:visible}
.envelope{transform:rotateX(16deg) rotateY(-5deg);transform-style:preserve-3d;transition:transform 2.2s cubic-bezier(.24,.65,.2,1)}
.envelope-back{box-shadow:0 30px 45px #48321e45,0 4px 0 #bdab8c}
.envelope-pocket{box-shadow:inset 0 -3px 0 #c6b290;transform:translateZ(9px)}
.flap-front{background:linear-gradient(155deg,#fff9ec,#deceb2);filter:drop-shadow(0 3px 2px #735c3c33)}
.flap-lining{background:linear-gradient(145deg,#e1d1b6,#f7eede)}
.envelope-flap{transition:transform 1.8s cubic-bezier(.26,.5,.16,1) .1s}
.is-open .envelope-flap{transform:translateZ(-2px) rotateX(-166deg);z-index:1}
.letter-slip,.envelope-dock .letter-slip{inset:5% 6% 7%;padding:7% 6%;gap:2cqw;background:linear-gradient(125deg,#fffef9,#fffaf0);border:1px solid #c8b38b88;overflow:visible;box-shadow:0 4px 12px #61452e24;transition:transform 1.9s cubic-bezier(.22,.65,.2,1) .3s}
.letter-slip>span:first-child,.envelope-dock .letter-slip>span:first-child{font-size:9cqw;line-height:1.6;flex-shrink:0;padding:0 2cqw}
.letter-slip>span:last-child,.envelope-dock .letter-slip>span:last-child{font:4cqw/1.6 var(--serif);letter-spacing:.04em;flex-shrink:0}
.is-open .letter-slip{transform:translateY(-54%) translateZ(4px)}
.envelope-dock{width:260px;margin-top:105px;overflow:visible}
.envelope-dock .envelope-back{box-shadow:0 12px 24px #61452e25}
.letter-intro{overflow:visible}
.henna-painting img{filter:saturate(.77) sepia(.05)}
.house-painting img{filter:saturate(.43) sepia(.16)}
@media(max-width:650px){.envelope-dock{width:220px;margin-top:95px}.hero-letter{padding:28px 18px 34px;margin-top:28px}.hero h1{font-size:clamp(40px,12vw,68px);line-height:1.5}.hero{padding-bottom:50px}.hero-message{font-size:22px}}
@media(prefers-reduced-motion:reduce){body::before{animation:none;transform:none;will-change:auto}}

/* Layered keepsakes inspired by the supplied stationery reference. */
body{background:#fcf9f2}
body::before{background:linear-gradient(#efd3ab18,#ebc69325),url('assets/romantic-landscape.jpg') center 58%/cover;filter:saturate(.65) sepia(.16)}
#letter-content{background:linear-gradient(90deg,#fffaf200,#fffdf5ed 18%,#fffdf5f5 50%,#fffdf5ed 82%,#fffaf200);min-height:100svh}
.letter-intro{background:linear-gradient(90deg,#fffaf233,#fffdf5de 20%,#fffdf5e8 50%,#fffdf5de 80%,#fffaf233)}
.intro-active #letter-content{background:none}
.hero-letter,.letter-scroll,footer{background:none;box-shadow:none;border:0}
.hero-letter{padding-top:28px;margin-top:20px}.hero-letter::before{display:none}
.letter-scroll::before,.letter-scroll::after{opacity:.18}
.envelope-dock{width:min(490px,78vw);margin-top:clamp(175px,24vw,260px);margin-bottom:12px}
.envelope-dock .envelope-scene{perspective:1400px}
.envelope-back{background:linear-gradient(135deg,#d4b58a,#b99a74);border-color:#b29975}
.envelope-pocket{background:linear-gradient(32deg,transparent 49.8%,#9a78554d 50%,#fff5 50.2%,transparent 50.5%),linear-gradient(-32deg,transparent 49.8%,#9a78554d 50%,#fff5 50.2%,transparent 50.5%),linear-gradient(120deg,#ddc39f,#b99a73);border:1px solid #aa8b66}
.flap-front{background:linear-gradient(155deg,#e4cfaf,#c2a27a)}
.flap-lining{background:linear-gradient(145deg,#c2a780,#ecddc3)}
.seal,.open-wax{color:#af9f87;background:radial-gradient(ellipse at 30% 20%,#fffefa,#f4f0e6 65%,#ded6c6);box-shadow:inset 0 0 0 2px #e4ded2,inset 0 0 0 5px #fffdf4,inset 0 0 0 6px #d2c7b580,inset -3px -4px 7px #bdb19d44,0 5px 9px #49392333;text-shadow:0 1px 0 #fff}
.seal{border-radius:48% 50% 46% 49%}.seal-date{color:#9c8c76}.seal-initials{color:#a69985}
.open-wax{position:absolute;left:50%;top:72%;width:15%;aspect-ratio:.86;border-radius:50%;display:flex;align-items:center;justify-content:center;font:4cqw/1 var(--script);transform:translate(-50%,-50%) translateZ(13px);z-index:6;opacity:0;transition:opacity .8s 1.2s;white-space:nowrap}.open-wax i{font:italic 1.7cqw Georgia;padding:0 .3cqw}.is-open .open-wax{opacity:1}
.letter-slip,.envelope-dock .letter-slip{inset:auto;left:43%;top:6%;width:51%;height:87%;padding:6% 4%;gap:2cqw;justify-content:flex-start;transform:translateY(0) translateZ(2px);border:5px double #a98a62;background:linear-gradient(#fffdf6,#f9f1e3);box-shadow:0 4px 14px #573e2b26;transition:transform 2.3s cubic-bezier(.22,.65,.2,1) .3s}
.letter-slip::before{content:'';position:absolute;inset:-2cqw;z-index:-1;background:repeating-linear-gradient(90deg,#b99b78 0 1.3cqw,#fcf5e8 1.3cqw 2.6cqw);border:1px solid #c8af8b}
.letter-slip::after{content:'';position:absolute;inset:0;background:#fffaf0;z-index:-1}
.letter-slip .card-kicker,.envelope-dock .letter-slip .card-kicker{font:2.3cqw/1.6 var(--serif);letter-spacing:.1em;text-transform:uppercase;padding:0}
.letter-slip .card-names,.envelope-dock .letter-slip .card-names{font:6.8cqw/1.4 var(--script);white-space:normal;text-align:center;padding:0 1cqw}
.card-names i{display:block;font:italic 3.5cqw/1.25 var(--serif)}
.letter-slip .card-place,.envelope-dock .letter-slip .card-place{font:2.4cqw/1.5 var(--serif);letter-spacing:.02em}
.portrait-slip{position:absolute;left:6%;top:5%;width:43%;height:88%;z-index:2;transform:translateY(0) rotate(-3deg) translateZ(3px);transition:transform 2.3s cubic-bezier(.2,.65,.2,1) .48s;filter:drop-shadow(0 5px 8px #5d462c38)}
.portrait-mat{height:100%;padding:4cqw 3cqw;background:#f8f2e7;border:5px double #cbbc9f;border-radius:49% 49% 46% 46%;outline:2px dotted #e4d9c7;outline-offset:3px}
.portrait-mat img{width:100%;height:100%;object-fit:cover;object-position:50% 37%;border-radius:50%;filter:sepia(.12) saturate(.85);border:1px solid #d4c6ae}
.date-slip{position:absolute;top:32%;left:30%;width:44%;height:36%;padding:3cqw 2cqw;display:flex;align-items:center;justify-content:center;border-radius:48% 48% 18% 18%;border:5px double #d1c2a7;outline:2px dotted #f0e4ce;outline-offset:2px;background:#fffcf3;z-index:2;transform:translateY(0) translateZ(5px);transition:transform 2.2s cubic-bezier(.22,.65,.2,1) .7s;box-shadow:0 3px 10px #58422b25}
.date-slip time{font:4.1cqw/1.6 var(--serif);white-space:nowrap;color:#755b43}
.is-open .letter-slip{transform:translateY(-70%) rotate(3deg) translateZ(5px)}
.is-open .portrait-slip{transform:translateY(-65%) rotate(-9deg) translateZ(8px)}
.is-open .date-slip{transform:translateY(-77%) rotate(-2deg) translateZ(12px)}
.is-open .envelope-flap{transform:translateZ(-2px) rotateX(-174deg)}
.nature-motion{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:0}.nature-motion~#letter-content{position:relative}
.wind-branch{position:absolute;width:clamp(90px,13vw,200px);height:auto;fill:#8a795c;opacity:.2;filter:blur(.3px);transform-origin:0 100%}.stem{fill:none;stroke:#827255;stroke-width:1.3}
.branch-left{bottom:-40px;left:-15px;animation:leaf-wind 9s ease-in-out infinite alternate}.branch-right{right:-15px;top:12%;transform:rotate(180deg);animation:leaf-wind-right 11s ease-in-out infinite alternate}
.leaves{transform-origin:35% 80%;animation:leaf-rustle 6s ease-in-out infinite alternate}
@keyframes leaf-wind{from{transform:rotate(-4deg)}to{transform:rotate(3deg)}}
@keyframes leaf-wind-right{from{transform:rotate(176deg)}to{transform:rotate(183deg)}}
@keyframes leaf-rustle{from{transform:skewX(-2deg)}to{transform:skewX(3deg)}}
.flying-bird{position:absolute;width:32px;height:18px;left:-70px;top:16%;fill:#756047;opacity:0;animation:bird-flight 32s linear infinite}.bird-two{width:23px;top:23%;animation-delay:2.8s;animation-duration:37s}
.wing-left,.wing-right{transform-origin:32px 21px;animation:wingbeat 1.5s ease-in-out infinite alternate}.wing-right{animation-direction:alternate-reverse}
@keyframes wingbeat{from{transform:scaleY(.5)}to{transform:scaleY(1)}}
@keyframes bird-flight{0%{transform:translate(-50px,35px);opacity:0}8%{opacity:.45}70%{opacity:.45}85%,100%{transform:translate(calc(100vw + 130px),-75px);opacity:0}}
@media(max-width:650px){.envelope-dock{width:80vw;max-width:400px;margin-top:180px}.hero-letter{padding-inline:10px}.letter-slip,.envelope-dock .letter-slip{border-width:3px}.portrait-mat{border-width:3px}.date-slip{border-width:3px}.wind-branch{opacity:.15}#letter-content{background:linear-gradient(90deg,#fffdf5b8,#fffdf5ed 12% 88%,#fffdf5b8)}.hero{padding-inline:18px}.letter-scroll{margin-inline:0}}
@media(prefers-reduced-motion:reduce){.wind-branch,.leaves,.flying-bird,.wing-left,.wing-right{animation:none!important}.flying-bird{display:none}.portrait-slip,.date-slip,.open-wax{transition:none}}
.envelope-scene .envelope .letter-slip>span.card-kicker{font:2.3cqw/1.6 var(--serif);letter-spacing:.1em;padding:0;white-space:nowrap}.envelope-scene .envelope .letter-slip>span.card-place{font:2.4cqw/1.5 var(--serif);letter-spacing:.02em}.envelope-scene .envelope .letter-slip>span.card-names{font:6.8cqw/1.3 var(--script);white-space:normal;padding:0 1cqw}.nature-motion{z-index:1}.flying-bird{opacity:0}.wind-branch{opacity:.13}

/* Reference palette: wine-red stationery on a warm ivory ground. */
:root{--cream:#fcf8f0;--paper:#fffcf5;--ink:#624b3d;--muted:#877362;--rule:#b39a7c55;--wine:#651e2c}
body{background:#fcf8f0}
body::before{opacity:.14;filter:saturate(.48) sepia(.17)}
#letter-content{background:linear-gradient(90deg,#fcf8f070,#fcf8f0eb 18% 82%,#fcf8f070)}
.letter-intro{background:#fcf8f0d9}
.site-header{background:linear-gradient(#fcf8f0dd,#fcf8f055);border-color:#c7b69b40}
.envelope-back{background:linear-gradient(130deg,#6d2734,#471520);border:1px solid #52212b;box-shadow:0 24px 38px #421c272f,0 3px 0 #40101e}
.envelope-pocket{border:1px solid #652634;background:linear-gradient(32deg,transparent 49.7%,#39121e77 50%,#a76a7455 50.3%,transparent 50.6%),linear-gradient(-32deg,transparent 49.7%,#39121e77 50%,#a76a7455 50.3%,transparent 50.6%),linear-gradient(125deg,#762c3b,#4e1727);box-shadow:inset 0 -3px 0 #39131f}
.envelope-pocket::after{border-color:#d8a5a41a}
.flap-front{background:linear-gradient(155deg,#823845,#541a29)}
.flap-front::after{opacity:.07}
.flap-lining{background:linear-gradient(145deg,#672533,#813c45)}
.envelope-dock .envelope-back{box-shadow:0 10px 24px #421c272b}
.letter-slip::before{background:repeating-linear-gradient(90deg,#772d39 0 1.3cqw,#fff9ee 1.3cqw 2.6cqw);border-color:#7d3340}
.letter-slip,.envelope-dock .letter-slip{border-color:#8f6d59;background:#fffcf4}
.letter-slip::after{background:#fffcf4}
.portrait-mat{background:#fbf6e9;border-color:#e1d6c3;outline-color:#e4dac8;box-shadow:inset 0 0 0 2px #fffdf7,inset 0 0 0 5px #ebe2d0}
.date-slip{background:#fffcf4;border-color:#e1d4be;outline-color:#e4d8c3;border-radius:48% 48% 25% 25%}
.envelope-florals{position:absolute;right:-11%;top:3%;width:35%;height:135%;object-fit:contain;object-position:top;z-index:7;pointer-events:none;opacity:0;transform:translate3d(-5%,12%,17px) rotate(-7deg) scale(.92);filter:drop-shadow(0 4px 4px #49362326);transition:transform 2.2s cubic-bezier(.2,.65,.2,1) .6s,opacity 1.2s ease .55s}
.is-open .envelope-florals{opacity:1;transform:translate3d(0,-24%,17px) rotate(-4deg) scale(1)}
.envelope-dock{margin-bottom:48px}
.hero-letter{padding-top:22px}.hero-letter>.eyebrow{letter-spacing:.14em}.hero h1{color:#654b3c}
.letter-button{background:linear-gradient(135deg,#762a3a,#551c2b);color:#fffbf2;border-color:#5b2130;box-shadow:inset 0 0 0 4px #ffffff0b}
.letter-button:hover:not(:disabled){background:#6b2636;box-shadow:inset 0 0 0 4px #ffffff12}
.timeline li::before{background:#884554}.countdown>div{background:#fffdf544;border-color:#c4ad8b66}
.nature-motion .wind-branch{opacity:.09}.flying-bird{fill:#8d7861}
@media(max-width:650px){#letter-content{background:#fcf8f0db}.envelope-dock{width:76vw;margin-bottom:42px}.envelope-florals{right:-10%;width:34%}.hero-letter{margin-top:6px}.site-header nav a{color:#786051}}
@media(prefers-reduced-motion:reduce){.envelope-florals{transition:none}}

/* Unified reference design: ivory stationery and burgundy engraved ink. */
:root{--cream:#fcf8f0;--paper:#fffdf6;--ink:#702638;--muted:#92606a;--rule:#8b3a4b30}
body{background:var(--cream);color:var(--ink)}
body::before,.nature-motion{display:none}
body::after{opacity:.018}
#letter-content,.letter-intro{background:var(--cream)}
.intro-active #letter-content{background:var(--cream)}
.hero h1,h2,h3,.hero-letter>.eyebrow,.henna-verse,.date-slip time,.site-header nav a,.card-names,.card-place,.card-kicker{color:var(--ink)}
.eyebrow,.hero-date,.countdown-note,.countdown>div>span:last-child,.event-date,.house-painting figcaption,.henna-painting figcaption,.content-placeholder,.parking-note,dt,dd span,.calendar-note,.map-note{color:var(--muted)}
.hero-message,.signature,.story-copy,.event-copy,.wedding-invitation,.timeline,.arrival-copy,.photos-section,.calendar-section{color:var(--ink)}
.letter-scroll::before,.letter-scroll::after{display:none}
.paper-section+.paper-section::before{background:none;height:1px;left:30%;right:30%;border-top:1px solid var(--rule)}
.countdown>div{border:0;border-radius:0;background:none;min-height:100px}.countdown>div::after{display:none}.countdown>div+div{border-left:1px solid var(--rule)}
.map-frame{background:#fffcf5;border-color:#8b3a4b44;box-shadow:none}.map-caption{color:var(--ink)}
.henna-painting img,.house-painting img{filter:none;border:0;border-radius:0;box-shadow:none;object-fit:contain;aspect-ratio:auto;mix-blend-mode:multiply}
.henna-painting{max-width:480px}.house-painting{max-width:850px}
.upload-placeholder{background:#fffcf555;border-color:var(--rule)}
.letter-intro{overflow:hidden}
.letter-intro .envelope-scene{transform:scale(2.05);transform-origin:50% 50%}
.envelope-dock .envelope-scene{transform-origin:top left}
.seal,.open-wax{background:radial-gradient(ellipse at 33% 20%,#fffefa 0%,#fffdf7 35%,#e8e2d5 67%,#fffdf8 76%,#d8d0c1 94%);border:1px solid #d5ccbc;box-shadow:inset 2px 3px 3px #fff,inset -4px -6px 7px #b6ac9855,0 3px 0 #c3b8a4,0 8px 13px #29111b55;outline:1px solid #fffaf0;outline-offset:-6px;border-radius:47% 51% 46% 49%}
.seal::before,.open-wax::before{content:'';position:absolute;inset:12%;border:1px solid #c9bea855;box-shadow:inset 0 1px 1px #fff,0 1px 0 #fff9;border-radius:50%;pointer-events:none}
.seal-initials,.open-wax{color:#c1b59f;text-shadow:-1px -1px 0 #fff,1px 2px 1px #998b735c}
.seal-date{color:#a3957e;text-shadow:0 1px 0 white}
.portrait-mat{border:6px double #e1d8c8;box-shadow:inset 0 0 0 3px #fffefa,inset 0 0 0 6px #e4dbc9,0 3px 0 #d1c6b1;outline:3px dotted #fffcf4;outline-offset:2px}
.date-slip{left:28%;top:32%;width:47%;height:47%;padding:0;background:none;border:0;outline:0;border-radius:0;box-shadow:none;filter:drop-shadow(0 4px 2px #48362430)}
.heart-paper{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.date-slip time{position:relative;font:4.1cqw/1.5 var(--serif);margin-top:0;transform:translateY(-2cqw);text-shadow:0 1px 0 #fff}
.is-open .date-slip{transform:translateY(-74%) rotate(-2deg) translateZ(12px)}
@media(max-width:650px){.letter-intro .envelope-scene{transform:scale(2.6)}.site-header nav a{color:var(--ink)}#letter-content{background:var(--cream)}.portrait-mat{border-width:4px}.countdown>div{min-height:95px}}

/* Measured reference composition: 540 x 960 master, proportional mobile scaling. */
:root{--cream:#fff9f3;--paper:#fef6ea;--wine:#511e25;--ink:#511e25}
body,#letter-content,.letter-intro,.intro-active #letter-content{background:#fff9f3}
.hero{padding:0 0 45px;min-height:0}.envelope-dock{width:min(80vw,540px);aspect-ratio:1.82;margin: min(50vw,337.5px) auto 0;height:auto}
.envelope-dock .envelope-scene,.envelope-scene{aspect-ratio:1.82}
.site-header{position:relative;padding:12px 5%;min-height:58px;display:flex;justify-content:center;gap:25px;border:0;background:none}
.site-header .monogram{font-size:26px}.site-header nav a{font-size:14px}.site-header nav{gap:20px}
/* Navigation remains available below the hero to preserve the reference's top whitespace. */
#letter-content{display:flex;flex-direction:column}#letter-content>header{order:2}#letter-content>main{order:1}#letter-content>footer{order:3}
.hero-letter{margin:62px auto 0;padding:0 25px 20px;width:min(620px,100%)}
.hero-letter>.eyebrow{font-size:13px;margin:0 0 12px;letter-spacing:.04em}.hero h1{font-size:clamp(35px,6.5vw,58px);line-height:1.4;padding:0}
.invitation-date{font-size:17px;margin-top:28px}.hero-date{font-size:14px}.hero-message{font-size:18px;max-width:350px;margin-top:22px}.scroll-note{font-size:14px;margin-top:20px}
.envelope-back{background:#511e25;border-color:#4b1b22}
.envelope-pocket{background:linear-gradient(32deg,transparent 49.7%,#2c0c1280 50%,#84464d44 50.3%,transparent 50.6%),linear-gradient(-32deg,transparent 49.7%,#2c0c1280 50%,#84464d44 50.3%,transparent 50.6%),linear-gradient(130deg,#622932,#3d1317);border-color:#47161d;box-shadow:inset 0 -2px 0 #2d0e14}
.envelope-pocket::after{display:none}.flap-front{background:linear-gradient(140deg,#642b33,#45171f)}.flap-lining{background:#511e25}
.letter-slip,.envelope-dock .letter-slip{left:44%;width:49%;height:100%;top:5%;padding:5% 4%;gap:2cqw;border:4px double #673d33}
.is-open .letter-slip{transform:translateY(-73%) translateZ(5px)}
.letter-slip::before{inset:-2.2cqw -2.2cqw -1cqw;background:repeating-linear-gradient(90deg,#61242c 0 1.8cqw,#fff9f3 1.8cqw 3.6cqw)}
.envelope-scene .envelope .letter-slip>span.card-names{font-size:6cqw;line-height:1.2}.card-names i{font-size:4cqw;line-height:1.4}
.portrait-slip{left:-3%;width:54%;height:109%;top:5%;filter:drop-shadow(0 2px 2px #513e292a)}
.is-open .portrait-slip{transform:translateY(-61%) rotate(-7deg) translateZ(8px)}
.portrait-mat{padding:0;border:0;background:none;box-shadow:none;outline:0;border-radius:0;position:relative}
.portrait-mat img:not(.relief-frame){position:absolute;left:27%;top:19%;width:61%;height:68%;object-fit:cover;object-position:50% 36%;border-radius:50%;border:0;filter:none}
.portrait-mat img.relief-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;border:0;border-radius:0;filter:none;z-index:1}
.date-slip{left:27%;width:47%;height:45%;top:38%;filter:drop-shadow(0 2px 1px #513e2920)}
.heart-paper{object-fit:fill}.date-slip time{font-size:4.7cqw;transform:translateY(1.5cqw);color:#684d40}
.is-open .date-slip{transform:translateY(-75%) translateZ(12px)}
.open-wax,.seal{background:url('assets/wax-relief-v8.png') center/100% 100% no-repeat;border:0;outline:0;box-shadow:none;border-radius:0;text-shadow:none;color:transparent;filter:drop-shadow(0 2px 2px #29111b33)}
.open-wax{width:14%;aspect-ratio:.73;top:75%;font-size:0}.open-wax i{font-size:0;padding:0}.seal::before,.open-wax::before{display:none}.seal-initials,.seal-date{visibility:hidden}
.envelope-open{width:15%;aspect-ratio:.73;height:auto}.seal{overflow:visible;padding:0}
.envelope-florals{right:-9%;top:1%;width:32%;height:173%;object-fit:fill}
.is-open .envelope-florals{transform:translate3d(0,-11%,17px) rotate(-3deg)}
@media(max-width:650px){.hero{padding:0 0 35px}.envelope-dock{width:80vw;margin:50vw auto 0}.hero-letter{margin-top:60px;padding-inline:22px}.hero h1{font-size:7.5vw}.hero-message{font-size:18px}.site-header{flex-direction:row}.envelope-open{width:23%}.letter-intro .envelope-scene{transform:scale(2.6)}}
/* Comparison pass 2: align measured reference anchors. */
.envelope-dock{width:min(80%,540px);max-width:none;aspect-ratio:1.77}.envelope-dock .envelope-scene{aspect-ratio:1.77}.is-open .letter-slip{transform:translateY(-77%) translateZ(5px)}.date-slip{left:28%;width:52%;top:40%}.hero-letter{margin-top:78px}.envelope-florals{height:175%;width:34%;right:-8%}@media(max-width:650px){.envelope-dock{width:80%;max-width:none}.hero-letter{margin-top:78px}}
/* Comparison pass 3: rear card alignment. */
.letter-slip,.envelope-dock .letter-slip{left:41%;width:54%}.is-open .letter-slip{transform:translateY(-74%) translateZ(5px)}

/* Table flatlay: retain the existing envelope and a single opening motion. */
.letter-intro{background:linear-gradient(#190d0740,#190d071a),url('assets/walnut-gold-v9.png') center/cover;isolation:isolate}
.letter-intro .envelope-scene{width:min(760px,78vw);transform:scale(1.16);transform-origin:center}
.letter-intro .envelope-open{width:19%}
.letter-intro .envelope-back{box-shadow:0 32px 45px #0009,0 5px 2px #220a11}
.letter-intro.table-opening{z-index:0;pointer-events:none}
#letter-content{position:relative;z-index:1;transition:background-color 2.8s ease;background-color:#fff9f3}
.intro-active #letter-content{background:transparent}
.letter-unfolded .hero-letter{transition:opacity 1.8s ease .9s}
.site-header{position:sticky;top:0;z-index:15;background:#fff9f3f5;backdrop-filter:blur(8px);border-bottom:1px solid #511e2526;box-shadow:0 4px 15px #511e2508}
html{scroll-padding-top:85px}
.henna-painting img,.house-painting img{filter:grayscale(1) sepia(1) saturate(2.4) hue-rotate(310deg) contrast(1.22);mix-blend-mode:multiply}
@media(max-width:650px){.letter-intro .envelope-scene{width:94vw;transform:scale(1.03)}.letter-intro .envelope-open{width:27%}.letter-intro{background-size:auto 100%;background-position:48% center}.site-header{gap:12px;padding:10px 12px}.site-header nav{gap:12px}.site-header nav a{font-size:14px}.site-header .monogram{font-size:25px}}
@media(prefers-reduced-motion:reduce){#letter-content,.hero-letter{transition:none!important}.site-header{backdrop-filter:none}}

.henna-painting img,.house-painting img{filter:url("assets/ink-filter.svg#wine")}

/* Signature lettering and restrained letterpress captions from the new reference. */
:root{--script:'Mrs Saint Delafield','Monotype Corsiva','Segoe Script',cursive;--ink:#511e25;--muted:#815a5f}
.hero h1{font-family:var(--script);font-size:clamp(58px,10vw,88px);line-height:1.35;font-weight:400}
h2{font-family:var(--script);font-size:clamp(52px,7vw,78px);line-height:1.4}
.signature{font-family:var(--script);line-height:1.5}
.eyebrow,.event-date,.hero-date,.invitation-date,.site-header nav a,.card-kicker,.card-place{font-family:var(--serif);font-variant-caps:small-caps;letter-spacing:.11em;font-weight:600}
.eyebrow{font-size:13px}.hero-date{font-size:15px}.invitation-date{font-size:18px}
.envelope-scene .envelope .letter-slip>span.card-names{font-family:var(--script);font-size:7cqw;line-height:1.25;letter-spacing:0;font-weight:400}
.hero-message{font-style:normal}.henna-verse{font-family:var(--serif);font-style:italic}
@media(max-width:650px){.hero h1{font-size:12vw}.site-header nav a{letter-spacing:.035em;font-size:13px}.site-header nav{gap:10px}h2{font-size:clamp(48px,12vw,65px)}}
.envelope-scene:not(.is-open) .letter-slip,.envelope-scene:not(.is-open) .portrait-slip,.envelope-scene:not(.is-open) .date-slip{visibility:hidden}.envelope-scene.is-open .letter-slip,.envelope-scene.is-open .portrait-slip,.envelope-scene.is-open .date-slip{visibility:visible}
/* Floral painting and centered ivory stationery, October 2026. */
.letter-intro{background:linear-gradient(135deg,#fff8e878,#fffaf060 55%,#f6ebd66b),url('assets/intro-flower-painting.jpg') center 55%/cover no-repeat}
.date-slip{left:24%;width:52%}
.is-open .date-slip{transform:translateY(-75%) translateZ(12px)}
.date-slip time{transform:translateY(-.6cqw);line-height:1.2;margin:0;text-align:center}
.small-seal{width:82px;height:112px;padding:0;border:0;border-radius:0;background:url('assets/wax-relief-v8.png') center/contain no-repeat;box-shadow:none;font-size:0;color:transparent;filter:drop-shadow(0 3px 3px #511e2520)}

/* Independent white-frame alternative: the original Site stays unchanged. */
.letter-intro::before{content:'';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(90vw,70svh);aspect-ratio:4/5;background:url('assets/ivory-rococo-frame.png') center/100% 100% no-repeat;filter:drop-shadow(0 12px 22px #30291f35);pointer-events:none}
.letter-intro .envelope-scene{width:min(63vw,49svh);transform:none;z-index:1;margin:0}
.letter-intro .envelope-open{width:23%}
.letter-intro .envelope-back{box-shadow:0 16px 24px #34241e40,0 3px 2px #220a11}