:root{--ivory:#f8f2e8;--champagne:#e8d7ba;--maroon:#692d37;--soft:#a86e71}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#e9ddca;color:var(--maroon);font-family:"Cormorant Garamond",serif}.invitation{max-width:560px;min-height:100vh;margin:auto;overflow:hidden;background:var(--ivory);box-shadow:0 0 45px rgba(87,55,46,.17)}.envelope-stage{height:100svh;min-height:620px;display:grid;place-items:center;position:relative;overflow:hidden;background:radial-gradient(circle at 50% 40%,#fffdf8,#f3e7d5)}.envelope{width:min(88%,470px);aspect-ratio:1.45;position:relative;filter:drop-shadow(0 19px 21px rgba(86,49,47,.19));perspective:1000px}.envelope-front{position:absolute;inset:0;z-index:4;background:linear-gradient(145deg,#f5e6d0,#dfc7a3);clip-path:polygon(0 0,50% 57%,100% 0,100% 100%,0 100%)}.envelope-letter{position:absolute;z-index:2;inset:7% 7% 0;background:#fffaf1;text-align:center;padding-top:10%;box-shadow:inset 0 0 0 1px rgba(183,149,111,.32)}.envelope-letter p{margin:0;font:44px/1 "Great Vibes",cursive}.envelope-letter i{font:21px "Cormorant Garamond",serif;margin:0 6px}.envelope-flap{position:absolute;z-index:5;inset:0;background:linear-gradient(145deg,#f9ecd9,#e6cba9);clip-path:polygon(0 0,100% 0,50% 57%);transform-origin:top;transition:transform 1s cubic-bezier(.65,0,.2,1);backface-visibility:hidden}.seal{position:absolute;z-index:6;left:50%;top:48%;translate:-50% -50%;width:27%;aspect-ratio:1;border:0;border-radius:50%;padding:4px;background:radial-gradient(circle,#fff5e9,#b78480);cursor:pointer;box-shadow:0 4px 9px rgba(78,38,43,.3)}.seal img,.small-seal img{width:100%;height:100%;border-radius:50%;object-fit:cover}.tap{position:absolute;bottom:11%;font-size:11px;letter-spacing:.16em;text-transform:uppercase}.pages{opacity:0;pointer-events:none;transition:opacity .55s .65s}.invitation.open .pages{opacity:1;pointer-events:auto}.invitation.open .envelope-flap{transform:rotateX(178deg)}.invitation.open .envelope-front{transform:translateY(115%);transition:transform .9s .4s cubic-bezier(.7,0,.3,1)}.invitation.open .seal,.invitation.open .tap{opacity:0;transition:opacity .25s}.invitation.open .envelope-stage{height:0;min-height:0;transition:height .05s 1.35s}.page{min-height:100svh;padding:76px 28px 58px;position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;background:radial-gradient(circle at 50% 5%,#fffdfa 0,var(--ivory) 62%,#f3e4ce)}.page:before{content:"";position:absolute;inset:15px;border:1px solid rgba(205,172,130,.55);border-radius:28px;pointer-events:none}.welcome{justify-content:center}.arabic{font:600 27px/1.25 "Noto Naskh Arabic",serif;color:#967254;margin:0 0 30px}.invite{text-transform:uppercase;letter-spacing:.21em;font-size:11px;margin:0 0 20px}.hosts{font:600 29px/1.1 "Cormorant Garamond",serif;margin:0}.hosts span,.family{font-size:19px;font-weight:400}.copy{max-width:290px;font-size:20px;line-height:1.22;margin:42px 0 23px}.welcome h1{font:62px/.85 "Great Vibes",cursive;margin:0;color:var(--maroon)}.welcome h1 em{font:31px "Cormorant Garamond",serif;margin:0 7px}.family{line-height:1.25;margin:35px 0 0}.scroll{position:absolute;bottom:29px;font-size:10px;letter-spacing:.16em;text-transform:uppercase}.scroll span{font-size:14px;margin-left:7px}.events{justify-content:center}.events header p{text-transform:uppercase;font-size:11px;letter-spacing:.2em;margin:0 0 8px}.events h2{font:51px/1 "Great Vibes",cursive;margin:0 0 32px}.event-grid{display:grid;gap:15px;width:100%;max-width:430px}.event-card{padding:23px 16px 19px;border:1px solid rgba(190,149,113,.55);border-radius:21px;background:rgba(255,252,245,.78);box-shadow:0 9px 17px rgba(151,108,86,.09)}.event-name{font:39px/1 "Great Vibes",cursive;margin:0 0 12px}.date{font-size:17px;font-weight:600;margin:0}.time{font-size:19px;font-style:italic;margin:4px 0}.rule{width:32px;border-top:1px solid var(--champagne);margin:13px auto}.venue{font-size:24px;font-weight:600;margin:0}.place{font-size:17px;margin:2px 0 15px}.actions{display:flex;justify-content:center;gap:9px}.actions a{border-radius:30px;padding:7px 10px;border:1px solid rgba(105,45,55,.4);color:var(--maroon);background:#fffaf3;font:11px Georgia,serif;text-decoration:none}.dress{margin:20px 0 5px;display:flex;align-items:center;justify-content:center;gap:8px}.dress p{margin:0 5px 0 0;font-size:17px}.dress span{width:17px;height:17px;border-radius:50%;border:1px solid rgba(0,0,0,.14)}.dress i{height:17px;border-left:1px solid #d4c3aa;margin:0 3px}.wine{background:#6e2938}.burgundy{background:#78131a}.maroon{background:#4a2b2b}.white{background:#fff}.grey{background:#777276}.black{background:#171516}.closing{justify-content:center}.closing-inner{max-width:385px}.closing-inner>p:first-child{font-size:19px;font-style:italic;margin:0 0 22px}.closing h2{font:45px/1.02 "Great Vibes",cursive;margin:0}.thanks{margin:45px 0 29px}.small-seal{width:75px;height:75px;margin:auto;border-radius:50%;box-shadow:0 4px 11px rgba(78,38,43,.22)}.petals{position:fixed;z-index:10;inset:0;overflow:hidden;pointer-events:none}.petal{position:absolute;top:-30px;width:7px;height:12px;border-radius:75% 18% 72% 22%;background:linear-gradient(135deg,rgba(255,255,255,.94),rgba(234,210,208,.65));clip-path:polygon(50% 0,88% 21%,100% 64%,62% 100%,15% 84%,0 37%);box-shadow:inset -1px -2px 2px rgba(171,132,132,.22);animation:fall linear infinite}.music-toggle{position:fixed;z-index:20;top:max(15px,env(safe-area-inset-top));right:15px;width:38px;height:38px;border:1px solid rgba(105,45,55,.38);border-radius:50%;background:rgba(255,252,246,.88);color:var(--maroon);font-size:21px;cursor:pointer;box-shadow:0 2px 8px rgba(91,67,61,.14)}@keyframes fall{to{transform:translate3d(var(--drift),110vh,0) rotate(440deg)}}@media(min-width:561px){body{padding:16px}.invitation{border-radius:10px}.envelope-stage{height:calc(100svh - 32px)}}
:root{--signature:"Alex Brush",cursive}.envelope-letter p,.welcome h1,.events h2,.event-name,.closing h2{font-family:var(--signature)!important}.envelope-letter p{font-size:51px!important}.page{background-color:var(--ivory)!important;background-image:radial-gradient(rgba(139,100,68,.07) .55px,transparent .75px),linear-gradient(118deg,rgba(255,255,255,.56),rgba(224,197,157,.15),rgba(255,255,255,.5))!important;background-size:5px 5px,100% 100%!important}.welcome{justify-content:flex-start!important;padding-top:71px!important}.welcome h1{font-size:72px!important;word-spacing:.12em;margin-top:9px!important;display:flex;flex-direction:column;align-items:center;gap:9px}.welcome h1 em{font-size:26px!important;font-style:normal;margin:0!important}.events h2{font-size:58px!important}.event-name{font-size:47px!important}.closing h2{font-size:52px!important}.arabic{font-family:"Noto Naskh Arabic",serif!important;font-weight:600!important;letter-spacing:.02em}.welcome .arabic{margin-bottom:37px!important}.welcome .invite{margin-bottom:29px!important}.welcome .hosts{line-height:1.18!important}.welcome .copy{margin:48px 0 31px!important}.welcome .family{margin-top:42px!important;line-height:1.38!important}.sharing{position:absolute;bottom:68px;margin:0;font-size:19px;font-style:italic}.events header p{font:58px/1 var(--signature)!important;text-transform:none!important;letter-spacing:0!important;margin-bottom:32px!important}.event-card .date{font-size:22px!important;line-height:1.12}.event-card .time{font-size:25px!important;line-height:1.1}
@import url('https://fonts.googleapis.com/css2?family=Alex+Brush&display=swap');
.petal{box-shadow:inset -1px -2px 2px rgba(117,83,64,.24),0 1px 3px rgba(105,45,55,.15)!important}.petal.champagne{background:linear-gradient(135deg,rgba(239,207,160,.78),rgba(197,150,103,.46))!important}.petal.ivory{background:linear-gradient(135deg,rgba(255,252,244,.96),rgba(229,214,192,.65))!important}.petal.blush{background:linear-gradient(135deg,rgba(181,112,122,.53),rgba(132,62,73,.28))!important}.seal{animation:sealGlow 2.45s ease-in-out infinite}.seal-crack{position:absolute;z-index:3;inset:0;border-radius:50%;pointer-events:none;opacity:0;background:linear-gradient(127deg,transparent 47%,rgba(255,247,218,.98) 48%,rgba(101,44,52,.8) 49.5%,transparent 51%),linear-gradient(48deg,transparent 48%,rgba(255,247,218,.95) 49%,rgba(101,44,52,.75) 50.4%,transparent 52%);clip-path:polygon(45% 0,56% 0,54% 23%,69% 39%,57% 53%,72% 70%,59% 100%,44% 100%,45% 72%,31% 55%,43% 39%,35% 19%)}.seal.cracked{animation:sealBreak .62s ease-in forwards}.seal.cracked .seal-crack{animation:crackFlash .62s ease-out forwards}@keyframes sealGlow{0%,100%{box-shadow:0 4px 12px rgba(78,38,43,.38),0 0 13px rgba(255,229,177,.6),0 0 32px rgba(231,186,123,.28)}50%{box-shadow:0 4px 14px rgba(78,38,43,.42),0 0 30px rgba(255,238,194,1),0 0 61px rgba(231,179,104,.72),0 0 95px rgba(243,214,158,.3)}}@keyframes sealBreak{30%{transform:translateX(-4px) rotate(-2deg)}55%{transform:translateX(5px) rotate(2deg) scale(1.06)}100%{transform:scale(1.12);opacity:.2}}@keyframes crackFlash{20%{opacity:0}48%,100%{opacity:1}}