@font-face{font-family:Pinyon;src:url('../fonts/PinyonScript-Regular.ttf') format('truetype');font-display:swap;font-weight:400}
@font-face{font-family:Cormorant;src:url('../fonts/CormorantGaramond[wght].ttf') format('truetype');font-display:swap;font-weight:300 700;font-style:normal}
@font-face{font-family:Cormorant;src:url('../fonts/CormorantGaramond-Italic[wght].ttf') format('truetype');font-display:swap;font-weight:300 700;font-style:italic}
:root{--paper:#fffdf9;--burgundy:#751b29;--gold:#b39d61;--ink:#51453e;--backdrop:#f5eee8}
*{box-sizing:border-box}html{background:var(--backdrop);color:var(--ink);scroll-behavior:smooth}body{margin:0;font-family:Cormorant,Georgia,serif;font-weight:400}a{color:inherit}svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}[hidden]{display:none!important}
a:focus-visible{outline:2px solid var(--gold);outline-offset:6px}button,a{-webkit-tap-highlight-color:transparent}.eyebrow{margin:0;font-size:12px;line-height:1.5;text-transform:uppercase;letter-spacing:.19em;color:#927846}.signature{font-family:Pinyon,cursive;font-size:37px;color:var(--burgundy);font-weight:400;margin:18px 0 0}.fine-rule{height:1px;width:66px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin:26px auto}
/* The paper envelope is built with CSS, keeping all assets local. */
.envelope-intro{position:relative;isolation:isolate;min-height:100svh;display:grid;place-items:center;overflow:hidden;padding:44px 22px;background:radial-gradient(ellipse at 50% 40%,#fffaf5 0%,#f6efe8 60%,#ede2d9 100%);text-align:center}
.invitation-ready{overflow:hidden}.invitation-ready .envelope-intro{position:fixed;inset:0;z-index:10;overflow-y:auto}.envelope-intro__inner{width:min(100%,480px);position:relative;z-index:1}.intro-flower{position:absolute;pointer-events:none;height:auto;opacity:.65}.intro-flower--left{top:-20px;left:-15px;width:min(52vw,360px)}.intro-flower--right{bottom:-12px;right:-8px;width:min(40vw,260px);opacity:.75}
.cover-names{font-family:Pinyon,cursive;color:var(--burgundy);font-size:clamp(52px,11vw,76px);line-height:1.3;margin:12px 0 38px;font-weight:400}.envelope{position:relative;width:100%;max-width:382px;height:238px;margin:0 auto;perspective:1100px;filter:drop-shadow(0 18px 17px #66433b20)}
.envelope::before{content:'';position:absolute;inset:0;border-radius:5px;background:#efe4d9;border:1px solid #d8c6b6}.envelope__letter{position:absolute;inset:16px 18px 12px;background:var(--paper);border:1px solid #d9c79f;padding:28px 10px;color:var(--burgundy);box-shadow:0 3px 15px #62463110;transition:transform .7s .45s cubic-bezier(.22,1,.36,1)}.envelope__letter span{font-size:11px;letter-spacing:.18em;text-transform:uppercase}.envelope__letter p{font-family:Pinyon,cursive;font-size:40px;margin:20px 0}
.envelope__pocket{position:absolute;inset:0;z-index:3;background:linear-gradient(145deg,#f8f0e8,#ede0d3);clip-path:polygon(0 0,50% 51%,100% 0,100% 100%,0 100%);border-radius:4px}.envelope__pocket::before,.envelope__pocket::after{content:'';position:absolute;bottom:0;width:55%;height:100%;background:#f3e8dd}.envelope__pocket::before{left:0;clip-path:polygon(0 0,100% 100%,0 100%);background:linear-gradient(135deg,#f7eee5,#e9dacb)}.envelope__pocket::after{right:0;clip-path:polygon(100% 0,100% 100%,0 100%);background:linear-gradient(225deg,#f9f1e9,#eddece)}
.envelope__flap{position:absolute;inset:0;z-index:4;background:linear-gradient(155deg,#fcf6ef,#e8d9c9);clip-path:polygon(0 0,100% 0,50% 53%);transform-origin:center top;backface-visibility:hidden;transition:transform .8s .1s cubic-bezier(.45,0,.18,1)}
.wax-seal{position:absolute;z-index:5;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-8deg);height:72px;width:72px;border-radius:47% 53% 48% 52% / 51% 46% 54% 49%;display:flex;align-items:center;justify-content:center;gap:3px;background:radial-gradient(circle at 35% 28%,#a34450,#751b29 62%,#541320);color:#e7c8a0;box-shadow:0 3px 5px #3e152e38,inset 0 0 0 4px #ad626833,inset 0 0 0 6px #43131c44;font-family:Pinyon,cursive;font-size:26px;transition:opacity .25s,transform .4s}.wax-seal i{font-family:Cormorant,serif;font-size:16px}.wax-seal::after{content:'';position:absolute;inset:11px;border:1px solid #d5aa7966;border-radius:50%}
.envelope-recipient{font-size:21px;line-height:1.4;margin:34px auto 23px;max-width:90%;overflow-wrap:anywhere}.envelope-recipient span{display:block;font-size:15px;font-style:italic;color:#948075;margin-bottom:4px}.envelope-recipient strong{color:var(--burgundy);font-weight:500}.open-invitation{display:inline-flex;align-items:center;justify-content:center;gap:20px;padding:14px 28px;min-height:50px;border:1px solid #68202c;background:var(--burgundy);color:#fff8f0;text-decoration:none;font-family:Cormorant,serif;font-size:18px;letter-spacing:.035em;border-radius:2px;box-shadow:0 7px 17px #751b2918;transition:background .2s,transform .2s}.open-invitation:hover{background:#631623;transform:translateY(-2px)}.open-invitation:active{transform:translateY(0)}.envelope-hint{margin:16px 0 0;font-size:14px;font-style:italic;color:#9a877a}
.is-opening .wax-seal{opacity:0;transform:translate(-50%,-70%) scale(1.15) rotate(5deg)}.is-opening .envelope__flap{transform:rotateX(180deg)}.is-opening .envelope__letter{transform:translateY(-90px)}.is-opening .envelope-intro__inner{animation:cover-away .55s .95s ease both}.is-opening{animation:background-away .45s 1.05s ease both;pointer-events:none}@keyframes cover-away{to{opacity:0;transform:translateY(-24px) scale(1.03)}}@keyframes background-away{to{opacity:0}}
/* A framed paper card with restrained reveal effects. */
.invitation{position:relative;isolation:isolate;width:calc(100% - 28px);max-width:660px;margin:26px auto 42px;padding:173px 23px 143px;text-align:center;background:var(--paper);box-shadow:0 12px 60px #62463112,0 1px 3px #62463108;overflow:hidden;outline:none}.invitation::after{content:'';position:absolute;inset:11px;border:1px solid #b39d6140;pointer-events:none;z-index:-1}.decorations{position:absolute;inset:0;z-index:-1;pointer-events:none}.floral{position:absolute;height:auto;display:block;opacity:.9}.floral--top-left{top:0;left:0;width:53%}.floral--top-right{top:0;right:0;width:29%}.floral--bottom-left{bottom:0;left:0;width:34%}.floral--bottom-right{bottom:0;right:0;width:32%}.invitation__content{position:relative}.invitation__content>.eyebrow{font-size:11px;margin-bottom:29px;letter-spacing:.15em}
.names{margin:0;color:var(--burgundy);font-weight:400;display:flex;flex-direction:column;align-items:center}.names__name{font-family:Pinyon,'Brush Script MT',cursive;font-size:76px;line-height:1;font-weight:400}.names__ampersand{font-family:Cormorant,serif;font-style:italic;font-size:37px;line-height:1;margin:9px 0 4px;color:var(--gold)}.personalization{font-size:20px;line-height:1.5;margin:28px auto 0;max-width:95%;overflow-wrap:anywhere;color:var(--burgundy)}.personalization span{display:block;font-size:15px;font-style:italic;color:#8e796c}.personalization strong{font-weight:500}.intro{font-style:italic;font-size:20px;line-height:1.6;margin:36px -5px 0}.intro span{display:block}.gold-rule{display:flex;align-items:center;justify-content:center;gap:15px;color:var(--gold);margin:34px auto 31px}.gold-rule span{height:1px;width:43px;background:var(--gold)}.gold-rule i{font-size:18px;font-style:normal;line-height:1}
.occasion p{margin:0}.weekday{font-size:13px;color:var(--burgundy);letter-spacing:.3em;padding-left:.3em}.date{color:var(--burgundy);font-size:40px;letter-spacing:.025em;padding-left:.025em;margin-top:12px!important;line-height:1.2;font-variant-numeric:lining-nums}.time{font-size:22px;color:var(--burgundy);font-style:italic;margin-top:16px!important}.venue{color:var(--burgundy);font-size:13px;letter-spacing:.16em;line-height:1.7;margin-top:25px!important}.location{font-size:22px;font-style:italic;margin-top:3px!important}
.guest-actions{display:flex;align-items:center;justify-content:center;gap:10px;margin:23px auto 0;flex-wrap:wrap}.guest-action{display:inline-flex;gap:7px;align-items:center;justify-content:center;min-height:44px;border:1px solid #b39d6166;padding:10px 13px;text-decoration:none;font-size:15px;line-height:1.1;border-radius:2px;transition:background .2s,color .2s}.guest-action:hover{background:#f5ece2;color:var(--burgundy)}.guest-action svg{width:17px;height:17px;color:#9c814b}
.rsvp{margin-top:51px;font-size:18px;line-height:1.5;font-style:italic}.rsvp p{margin:0}.rsvp>.eyebrow{font-style:normal;font-size:10px;letter-spacing:.14em;margin-bottom:13px}.rsvp__deadline{max-width:320px;margin-inline:auto!important}.contacts{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:22px}.contacts a{display:flex;flex-direction:column;gap:3px;align-items:center;justify-content:center;min-height:60px;min-width:138px;color:var(--burgundy);text-decoration:none;font-size:20px;font-style:italic;border-bottom:1px solid #b39d6159;padding:7px 0;transition:border-color .2s}.contacts a:hover{border-color:var(--burgundy)}.contacts .contact-number{font-style:normal;font-size:16px;white-space:nowrap;font-variant-numeric:lining-nums;letter-spacing:.01em}.rsvp .rsvp__hint{font-size:13px;color:#9a877a;margin-top:16px}.closing{margin-top:36px}.closing>p:first-of-type{font-style:italic;font-size:17px;margin:0;color:#948075}.closing .signature{font-size:36px;margin-top:8px}.closing .fine-rule{margin-bottom:22px}
.reveal{transition:opacity .8s ease,transform .8s cubic-bezier(.22,1,.36,1)}.reveal--pending{opacity:0;transform:translateY(14px)}.petals{position:fixed;inset:0;z-index:8;pointer-events:none;overflow:hidden;display:none}.just-opened .petals{display:block}.petals i{position:absolute;top:-30px;width:13px;height:21px;border-radius:90% 5% 90% 5%;background:#e9bfc8;opacity:0}.petals i:nth-child(1){left:12%;animation:petal-fall 2.7s .1s ease-out forwards}.petals i:nth-child(2){left:29%;animation:petal-fall 2.4s .3s ease-out forwards;background:#dac794}.petals i:nth-child(3){left:57%;animation:petal-fall 2.8s ease-out forwards}.petals i:nth-child(4){left:76%;animation:petal-fall 2.6s .2s ease-out forwards}.petals i:nth-child(5){left:89%;animation:petal-fall 2.7s .1s ease-out forwards;background:#dac794}@keyframes petal-fall{0%{opacity:0;transform:translate3d(0,-20px,0) rotate(0)}15%{opacity:.65}85%{opacity:.45}100%{opacity:0;transform:translate3d(55px,80vh,0) rotate(170deg)}}
/* Anonymous visitors receive no wedding details, including in source or metadata. */
.private-page{min-height:100svh;display:grid;place-items:center;padding:28px;background:radial-gradient(ellipse at 50% 35%,#fffaf5,#f2e9e1)}.private-note{position:relative;isolation:isolate;width:min(100%,530px);text-align:center;padding:115px 24px 66px;border:1px solid #b39d613b;background:#fffdf8bf;box-shadow:0 12px 60px #6246310a;overflow:hidden}.private-flower{position:absolute;left:0;top:0;width:47%;height:auto;opacity:.6;z-index:-1;pointer-events:none}.monogram{font-family:Pinyon,cursive;font-size:63px;color:var(--burgundy);line-height:1;margin-bottom:38px}.monogram span{font-family:Cormorant,serif;color:var(--gold);font-size:28px;font-style:italic;margin:0 8px}.private-note .eyebrow{font-size:10px}.private-note h1{font-size:32px;line-height:1.2;font-weight:400;color:var(--burgundy);margin:19px 0}.private-note__copy{font-size:19px;line-height:1.6;max-width:320px;margin:0 auto;color:#89786d}.private-note .signature{font-size:36px}
@media(min-width:600px){.envelope-intro{padding:45px}.envelope-intro__inner{max-width:450px}.envelope{height:250px;max-width:400px}.cover-names{font-size:78px;margin-bottom:38px}.envelope-recipient{font-size:24px;margin-top:32px}.invitation{margin:48px auto 60px;padding:208px 55px 159px}.invitation::after{inset:17px}.floral--top-left{width:45%}.floral--top-right{width:25%}.floral--bottom-left{width:29%}.floral--bottom-right{width:26%}.names__name{font-size:87px}.names__ampersand{font-size:40px;margin:10px 0 2px}.personalization{font-size:23px;margin-top:32px}.personalization span{font-size:17px}.intro{font-size:24px;margin-top:39px}.gold-rule{margin:36px auto}.date{font-size:47px}.weekday{font-size:15px}.time{font-size:25px}.venue{font-size:15px;letter-spacing:.2em}.location{font-size:25px}.guest-action{font-size:17px;padding:12px 19px}.guest-actions{gap:14px;margin-top:26px}.rsvp{font-size:21px;margin-top:57px}.rsvp__deadline{max-width:450px}.rsvp>.eyebrow{font-size:12px}.contacts{gap:32px;margin-top:24px}.contacts a{min-width:190px;font-size:24px}.contacts .contact-number{font-size:19px}.closing .signature{font-size:42px}}
@media(max-width:374px){.envelope-intro{padding-inline:20px}.envelope{height:213px}.cover-names{font-size:54px}.invitation{width:calc(100% - 22px);padding-inline:20px}.intro{font-size:19px}.date{font-size:38px}.venue{font-size:12px;letter-spacing:.13em}.contacts{gap:10px}.contacts a{min-width:132px}.contacts .contact-number{font-size:15px}.private-page{padding:18px}.private-note{padding-inline:20px}.private-note h1{font-size:29px}}
@media(max-height:700px) and (min-width:600px){.envelope-intro{padding-top:30px;padding-bottom:30px}.cover-names{font-size:60px;margin-bottom:20px}.envelope{height:190px;max-width:320px}.envelope-recipient{margin-top:20px;margin-bottom:17px}.envelope-hint{margin-top:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.reveal--pending{opacity:1;transform:none}.petals{display:none!important}}
@media print{html,body{background:#fff}.envelope-intro,.petals,.guest-actions,.rsvp__hint{display:none!important}.invitation{margin:0;width:100%;max-width:660px;box-shadow:none;print-color-adjust:exact}.reveal--pending{opacity:1;transform:none}}