@import "https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500&family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400&family=Great+Vibes&display=swap";:root{--paper:#fdfbf7;--ink:#594632;--gold:#886126;--line:#cbb48c;--serif:"Cormorant Garamond", Georgia, serif;--sans:"Be Vietnam Pro", sans-serif;--script:"Great Vibes", cursive;color:var(--ink);background:var(--paper);font-family:var(--serif);font-synthesis:none;text-rendering:optimizelegibility}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}body.invitation-locked{overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit}a{color:inherit}p,h1,h2,h3,figure{margin:0}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:6px}::selection{background:#e8d9bd}.script{font-family:var(--script);font-weight:400}.eyebrow{font-family:var(--sans);letter-spacing:.2em;text-transform:uppercase;font-size:10px;line-height:1.9}.invitation{background:var(--paper);min-height:100svh;overflow:clip}.opening-stage{z-index:10;perspective:1800px;background:radial-gradient(at 50% 40%,#fffefa,#f4efe6);position:fixed;inset:0;overflow:hidden}.envelope-scene{aspect-ratio:640/420;width:min(560px,84vw);position:absolute;top:56%;left:50%;transform:translate(-50%,-50%)}.envelope-back{z-index:1;background:#ebe5d9;border:1px solid #e0d8c9;position:absolute;inset:0;box-shadow:0 24px 45px #59463226,0 2px 5px #59463215}.envelope-pocket{z-index:4;filter:drop-shadow(0 -2px 2px #59463212);position:absolute;inset:0}.envelope-pocket svg{width:100%;height:100%;display:block}.flap-hinge{z-index:5;transform-origin:top;filter:drop-shadow(0 5px 3px #59463222);width:100%;height:76.2%;position:absolute;top:0;left:0}.envelope-flap{width:100%;height:100%;display:block}.wax-seal{aspect-ratio:1;cursor:pointer;filter:drop-shadow(2px 4px 3px #433b3355);background:0 0;border:0;border-radius:50%;width:18%;padding:0;transition:filter .18s;position:absolute;top:56%;left:50%;transform:translate(-50%)}.wax-seal svg{width:100%;height:100%;display:block}.wax-seal:hover{filter:drop-shadow(2px 5px 4px #433b3366)brightness(1.08)}.opening-letter{z-index:3;background:var(--paper);transform-origin:50%;border:1px solid #dac9ad;width:94%;height:90%;position:absolute;bottom:5%;left:3%;box-shadow:0 2px 12px #59463218}.opening-letter:after{content:"";border:1px solid #cbb48c88;position:absolute;inset:10px}.letter-details{flex-direction:column;align-items:center;gap:20px;padding-top:14%;display:flex}.letter-details img{width:20%;height:auto}.letter-slot{background:#a13d32;border-radius:20px;width:65%;height:5px;box-shadow:inset 0 2px 3px #69271f77}.is-opening .flap-hinge{animation:.95s ease-in-out forwards open-flap,1.8s cubic-bezier(.4,0,.6,1) 2.5s forwards envelope-leaves}.is-opening .opening-letter{animation:3.5s cubic-bezier(.4,0,.18,1) .95s both extract-letter}.is-opening .letter-details{animation:.65s 2.35s both quiet-details}.is-opening .envelope-back,.is-opening .envelope-pocket{animation:1.8s cubic-bezier(.4,0,.6,1) 2.5s forwards envelope-leaves}.skip-opening{bottom:calc(28px + env(safe-area-inset-bottom));z-index:8;cursor:pointer;white-space:nowrap;background:#fdfbf7e8;border:1px solid #cbb48c;border-radius:28px;min-height:44px;padding:8px 14px;font-size:15px;position:absolute;left:50%;transform:translate(-50%)}.skip-opening span{padding-left:10px}@keyframes open-flap{0%{z-index:5;transform:rotateX(0)}49%{z-index:5}50%,to{z-index:2}to{transform:rotateX(180deg)}}@keyframes envelope-leaves{to{translate:0 110svh}}@keyframes extract-letter{0%{z-index:3;transform:translateY(0)scale(1)}35.99%{z-index:3;transform:translateY(var(--letter-pull,-112%)) scale(1)}36%{z-index:6;transform:translateY(var(--letter-pull,-112%)) scale(1)}52%{z-index:6;transform:translateY(-6svh)scale(1)}to{z-index:6;transform:translateY(-6svh)scale(12)}}@keyframes quiet-details{to{opacity:0}}.paper-page{background:var(--paper);max-width:1120px;margin:0 auto;padding:72px 64px 0;animation:.6s both reveal-paper;position:relative}@keyframes reveal-paper{0%{opacity:0}to{opacity:1}}.paper-page:before{content:"";opacity:.14;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' 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 filter='url(%23n)' opacity='.2' d='M0 0h160v160H0z'/%3E%3C/svg%3E");position:absolute;inset:0}.photo-chapter{text-align:center;position:relative}.happiness{width:64px;height:64px;margin:0 auto 28px;display:block}.photo-feed{width:clamp(210px,54vw,340px);margin:auto;position:relative}.feed-slot{z-index:2;background:#a13d32;border:1px solid #b9574b;border-radius:5px;width:calc(100% + 18px);height:8px;margin-left:-9px;position:relative;box-shadow:inset 0 3px 3px #69271f77,0 3px 5px #5946321f}.strip-window{margin:0 -9px;padding:0 9px 14px;overflow:hidden}.photo-strip{background:#fffefa;padding:10px 10px 1px;animation:4.5s cubic-bezier(.22,.7,.28,1) .3s both feed-photos;box-shadow:0 4px 9px #59463222}.photo-strip figure{margin-bottom:9px}.photo-strip img{aspect-ratio:2/3;object-fit:cover;width:100%;height:auto;display:block}.photo-strip figcaption{letter-spacing:.08em;padding:9px 0 3px;font-size:12px;font-style:italic}.photo-strip :where(figcaption) span{margin:0 8px}@keyframes feed-photos{0%{transform:translateY(calc(6px - 100%))}to{transform:translateY(0)}}.guest-invitation{padding:52px 0 76px}.guest-name{color:var(--gold);overflow-wrap:anywhere;max-width:650px;margin:10px auto 14px;font-size:clamp(30px,5vw,44px);line-height:1.4}.little-rule{color:var(--gold);align-items:center;gap:10px;width:100px;margin:0 auto 28px;display:flex}.little-rule:before,.little-rule:after{content:"";background:var(--line);flex:1;height:1px}h1{color:var(--gold);font-size:clamp(46px,6vw,76px);line-height:1.45}h1:focus{outline:none}.ampersand{margin:0 .1em;font-size:.75em}.couple-name{white-space:nowrap}.wedding-date,.event-date{color:var(--gold);letter-spacing:.09em;font-variant-numeric:lining-nums;font-size:29px;display:block}.wedding-date{margin-top:12px}.read-link{flex-direction:column;gap:12px;margin-top:32px;font-size:17px;font-style:italic;text-decoration:none;display:inline-flex}.read-link span{color:var(--gold);font-size:24px}.chapter{border-top:1px solid var(--line);text-align:center;padding:76px 0;scroll-margin-top:32px;position:relative}.chapter:before{content:"✧";background:var(--paper);width:36px;height:26px;color:var(--gold);position:absolute;top:-13px;left:calc(50% - 18px)}h2{color:var(--gold);text-transform:uppercase;letter-spacing:.015em;margin:16px 0 48px;font-size:clamp(32px,4vw,46px);font-weight:500;line-height:1.25}.families{grid-template-columns:1fr 1fr;gap:48px;max-width:740px;margin:auto;display:grid}h3{color:var(--gold);text-transform:uppercase;font-size:24px;font-weight:500}.families h3{margin-bottom:14px}.families p{font-size:19px;line-height:1.65}.families .family-address{margin-top:7px;font-size:16px}.families>div+div{border-left:1px solid var(--line);padding-left:24px}.children-label{margin-top:54px}.full-names{color:var(--gold);margin:22px 0 38px;font-size:clamp(36px,5vw,60px);line-height:1.65}.full-names span{font-size:.6em;line-height:1.3;display:block}.ceremony-details{font-size:20px;line-height:1.8}.ceremony-details>p:first-child{text-transform:uppercase;letter-spacing:.08em;font-size:17px}.ceremony-details .event-date{margin:8px 0}.ceremony-details .lunar-date{font-size:16px;font-style:italic}.ceremony-details h3{margin-top:24px}.ceremony:after{content:"";opacity:.65;pointer-events:none;z-index:-1;background:url(/botanical.svg) 50%/contain no-repeat;width:140px;height:260px;position:absolute;bottom:60px;left:-58px}.ceremony{isolation:isolate}.venue-grid{grid-template-columns:1fr 1fr;align-items:center;gap:44px;display:grid}.venue-illustration{mix-blend-mode:multiply;width:100%;height:auto;display:block}.venue-figure figcaption{margin-top:12px;font-size:15px;font-style:italic}.venue-copy h3{max-width:350px;margin:auto;font-size:clamp(28px,3.3vw,39px);line-height:1.15}.room{color:var(--gold);margin:13px 0;font-size:33px;line-height:1.5}.venue-address{max-width:310px;margin:0 auto 24px;font-size:18px;line-height:1.7}.venue-copy .event-date{font-size:27px}.reception-times{grid-template-columns:1fr 1fr;max-width:270px;margin:26px auto;font-size:18px;display:grid}.reception-times :where(p+p){border-left:1px solid var(--line)}.reception-times strong{color:var(--gold);margin-bottom:6px;font-size:26px;font-weight:500;display:block}.map-link{text-transform:uppercase;border:1px solid var(--gold);min-height:48px;color:var(--gold);border-radius:30px;justify-content:center;align-items:center;gap:24px;padding:8px 25px;font-size:17px;text-decoration:none;transition:background .18s;display:inline-flex;box-shadow:0 3px 5px #59463212}.map-link:hover{background:#f0e7d8}.countdown-section{padding-bottom:40px}.countdown{grid-template-columns:repeat(4,1fr);gap:16px;max-width:540px;margin:36px auto;display:grid}.countdown strong{min-height:80px;color:var(--gold);font-variant-numeric:tabular-nums;border:1px solid #cbb48c88;border-radius:4px;place-items:center;font-size:42px;font-weight:400;display:grid}.countdown span{margin-top:10px;font-size:17px;display:block}.invitation-note{font-size:21px;font-style:italic;line-height:1.7}.closing{text-align:center;color:var(--gold);padding:28px 16px 120px;position:relative}.closing>.script{font-size:40px;line-height:1.7}.closing .signature{font-size:46px}.footer-date{letter-spacing:.2em;margin-top:22px;font-size:14px;display:block}.music-dock{right:max(20px, env(safe-area-inset-right));bottom:calc(20px + env(safe-area-inset-bottom));z-index:20;position:fixed}.music-toggle{width:50px;height:50px;color:var(--gold);cursor:pointer;background:#fffdf8f2;border:1px solid #886126;border-radius:50%;place-items:center;display:grid;box-shadow:0 4px 12px #59463220}.music-toggle svg{width:25px;height:25px}.music-toggle.playing{box-shadow:0 0 0 5px #cbb48c22,0 4px 12px #59463220}.music-dock p{width:220px;font:12px / 1.6 var(--sans);background:var(--paper);border:1px solid var(--line);padding:12px;position:absolute;bottom:60px;right:0}.skip-motion .photo-strip,.skip-motion .paper-page{animation:none}@media (width>=1200px){.envelope-scene{width:min(680px,84vw)}.paper-page{box-shadow:0 0 50px #59463205}}@media (width<=700px){.envelope-scene{--letter-pull:-60%;aspect-ratio:2/3;width:min(76vw,300px,38svh)}.flap-hinge{height:61%}.wax-seal{width:22%;top:72%}.is-opening .flap-hinge{animation:.95s ease-in-out forwards open-flap,3.5s cubic-bezier(.4,0,.18,1) .95s both mobile-envelope-leaves}.is-opening .envelope-back,.is-opening .envelope-pocket{animation:3.5s cubic-bezier(.4,0,.18,1) .95s both mobile-envelope-leaves}.paper-page{padding:36px 24px 0}.happiness{width:52px;height:52px;margin-bottom:20px}.photo-feed{width:min(78vw,300px,100% - 18px)}.guest-invitation{padding:32px 0 44px}h1{max-width:370px;margin:auto;font-size:clamp(41px,10vw,60px)}h1 .couple-name{display:block}h1 .ampersand{margin:6px 0;font-size:.6em;line-height:1;display:block}.eyebrow{letter-spacing:.15em;font-size:9px}.chapter{padding:44px 0}h2{margin:12px 0 28px}.families{grid-template-columns:1fr;gap:24px}.families h3{margin-bottom:8px;font-size:20px}.families p{font-size:16px}.families .family-address{font-size:14px}.families>div+div{border-left:0;border-top:1px solid var(--line);padding:24px 0 0}.children-label{margin-top:32px}.full-names{margin:16px 0 28px;font-size:clamp(28px,7.8vw,40px);line-height:1.65}.venue-grid{grid-template-columns:1fr;gap:24px}.venue-figure{width:min(340px,100%);margin:auto}.venue-copy h3{max-width:280px;font-size:34px}.venue-address{font-size:18px}.room{font-size:clamp(27px,7.5vw,33px)}.countdown{gap:8px}.countdown strong{min-height:62px;font-size:34px}.countdown span{font-size:15px}.closing{padding:12px 0 96px}.closing>.script{font-size:34px}.closing .signature{font-size:39px}.music-dock{right:max(12px, env(safe-area-inset-right));bottom:calc(12px + env(safe-area-inset-bottom))}.music-toggle{width:44px;height:44px}.ceremony:after{opacity:.5;width:60px;left:-28px}}@media (width<=360px){.paper-page{padding-left:20px;padding-right:20px}}@keyframes mobile-envelope-leaves{0%{translate:0}36%{translate:0 32svh}to{translate:0 110svh}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.is-opening .flap-hinge,.is-opening .opening-letter,.is-opening .letter-details,.is-opening .envelope-back,.is-opening .envelope-pocket,.photo-strip,.paper-page{animation:none}.wax-seal,.map-link{transition:none}}