@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Italiana&family=Manrope:wght@400;500;600&display=swap');
:root{--paper:#f5f2e9;--ink:#354638;--gold:#a78b54;--line:#d9d2be}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:85px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Manrope,Arial,sans-serif;font-size:14px}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}header{height:90px;padding:0 6%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.monogram{font:30px 'Cormorant Garamond',Georgia,serif;letter-spacing:-2px}.monogram span{display:block;font:8px Manrope,Arial;letter-spacing:2px;margin-top:4px}nav{display:flex;gap:35px;font-size:11px}nav .nav-rsvp{border-bottom:1px solid var(--gold);padding-bottom:6px}.hero{min-height:780px;height:calc(100svh - 90px);max-height:1100px;text-align:center;padding:32px 6% 45px;background:radial-gradient(ellipse at 15% 45%,#e3e5d660,transparent 50%),radial-gradient(ellipse at 90% 70%,#e5dbc650,transparent 45%);position:relative}.hero-frame{border:1px solid var(--line);outline:1px solid var(--line);outline-offset:-9px;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;border-radius:45% 45% 0 0 / 18% 18% 0 0;padding:25px}.ornament{font-size:36px;color:var(--gold);margin-bottom:22px}.eyebrow{font-size:10px;letter-spacing:3px;font-weight:600;color:var(--gold)}.invite{font:italic 21px 'Cormorant Garamond',Georgia;margin:14px 0}h1{font:500 clamp(65px,7.5vw,112px)/.93 'Cormorant Garamond',Georgia;margin:12px 0 23px;letter-spacing:-3px}h1 em{font-weight:400}.amp{display:block;font:italic 32px 'Cormorant Garamond';color:var(--gold);margin:8px}.bride,.groom{display:block}.groom{font-size:.77em}.rule{height:1px;width:70px;background:var(--gold);margin:8px}.hero-date{font-size:12px;letter-spacing:3px;margin:16px 0}.location{font-size:9px;letter-spacing:1.7px}.button{border:1px solid var(--ink);background:var(--ink);color:var(--paper);padding:17px 25px;display:flex;align-items:center;justify-content:space-between;gap:35px;font-size:11px;letter-spacing:1px;cursor:pointer;transition:background .2s}.button:hover{background:#4e6051}.hero .button{margin-top:24px}.small{font:italic 15px 'Cormorant Garamond';opacity:.65;margin:18px}.scroll{position:absolute;bottom:13px;left:0;width:100%;font-size:8px;letter-spacing:3px}.celebration{text-align:center;padding:100px 7%}.celebration>p:not(.eyebrow){max-width:560px;margin:0 auto;line-height:1.9;color:#697269}.details{display:grid;grid-template-columns:repeat(3,1fr);max-width:1000px;margin:65px auto 0}.details>div{padding:10px 20px;border-right:1px solid var(--line)}.details>div:last-child{border:0}.details span{font-size:9px;letter-spacing:2px;color:var(--gold)}.details strong{display:block;font:29px 'Cormorant Garamond';margin:13px}.details p{font-size:11px;color:#697269}.venue{display:grid;grid-template-columns:1fr 1fr;background:#eae9de}.venue-art{background:#344b40;min-height:540px;padding:60px;position:relative;overflow:hidden}.arch{border:1px solid #b5a16a;border-radius:50% 50% 0 0;height:420px;max-width:350px;margin:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#e9dfc8;position:relative;z-index:1}.arch span{font-size:45px;color:#b5a16a}.arch p{font:30px/1.4 'Cormorant Garamond';text-align:center;letter-spacing:5px}.arch i{font:italic 55px 'Cormorant Garamond'}.waves{position:absolute;inset:65% -20% -70%;border:1px solid #b5a16a55;border-radius:50%;box-shadow:0 0 0 20px #b5a16a15,0 0 0 40px #b5a16a15,0 0 0 60px #b5a16a15,0 0 0 80px #b5a16a15}.venue-copy{padding:65px 13%;display:flex;flex-direction:column;justify-content:center}.venue-copy h3{margin:3px 0 16px}.venue-copy>p:not(.eyebrow){font-size:12px;line-height:1.9;color:#697269}.text-link{font-size:11px;border:0;border-bottom:1px solid var(--gold);padding:12px 0;background:none;text-align:left;cursor:pointer;width:fit-content}.rsvp{display:grid;grid-template-columns:1fr 1.1fr;gap:100px;padding:110px 10%;max-width:1400px;margin:auto}.rsvp>div>p:not(.eyebrow){line-height:1.9;color:#697269}.rsvp-note{font:25px 'Cormorant Garamond';margin-top:70px}.rsvp-note span{color:var(--gold);margin:0 15px}.form-card{background:#fcfaf5;border:1px solid var(--line);padding:38px}.form-card h3{font:500 28px/1.2 'Cormorant Garamond';margin:0}.form-intro{font-size:11px;color:#697269;margin-bottom:28px}form>label{display:block;font-size:10px;font-weight:600;margin:19px 0}label span{font-weight:400;color:#7b8076}input,select,textarea{width:100%;background:transparent;border:1px solid var(--line);border-radius:0;padding:13px;margin-top:8px;color:var(--ink);font-size:12px}fieldset{border:0;padding:0;margin:22px 0}legend{font-size:10px;font-weight:600;margin-bottom:10px}.choices{display:flex;gap:8px}.choices label{display:flex;align-items:center;gap:7px;flex:1;border:1px solid var(--line);padding:12px 8px;font-size:10px;cursor:pointer}.choices input{width:auto;margin:0;accent-color:var(--ink)}.choices .selected{background:#e9eddf;border-color:#788875}form .button{width:100%;margin-top:25px}.privacy{font-size:9px;color:#7b8076;line-height:1.7;margin-top:15px}.honeypot{position:absolute;left:-10000px}.error{color:#953e31;font-size:12px}.success{padding:45px 0;text-align:center}.success>span{font-size:45px;color:var(--gold)}.success p{line-height:1.8}footer{border-top:1px solid var(--line);padding:40px;text-align:center}footer p{font:italic 21px 'Cormorant Garamond'}footer>span{font-size:8px;letter-spacing:2px}@media(max-width:700px){header{height:75px;padding:0 6%}nav{gap:18px}nav>a:not(.nav-rsvp){display:none}.hero{height:auto;min-height:770px;padding:25px 5% 40px}.hero-frame{min-height:690px;padding:35px 12px}.location{font-size:8px;line-height:1.8;max-width:220px}h1{font-size:64px;letter-spacing:-2px}.invite{font-size:17px}.celebration{padding:70px 7%}.details{grid-template-columns:1fr;margin-top:30px}.details>div{border-right:0;border-bottom:1px solid var(--line);padding:24px}.venue{grid-template-columns:1fr}.venue-art{min-height:400px;padding:35px}.arch{height:330px;max-width:280px}.venue-copy{padding:45px 9% 60px}.rsvp{grid-template-columns:1fr;gap:35px;padding:70px 6%}.rsvp-note{margin-top:25px}.form-card{padding:25px}.choices label{font-size:9px}footer{padding:35px 15px}}
.letter-intro{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:auto;padding:35px 20px;text-align:center;isolation:isolate}.letter-intro:before{content:'';position:absolute;inset:20px;border:1px solid #b59b6740;pointer-events:none}.letter-kicker{font-size:9px;letter-spacing:4px;color:var(--gold);margin:0 0 35px}.letter-caption{margin-top:38px;text-align:center}.letter-caption h2{font:400 39px/1.07 Italiana,'Cormorant Garamond',serif;margin:0 0 16px}.letter-caption p{font-size:10px;letter-spacing:1.3px;margin:0 0 23px;color:#737769}.open-letter{margin:auto;min-width:230px;justify-content:center}.skip-letter{position:absolute;right:35px;bottom:28px;border:0;background:transparent;color:#77786b;font-size:10px;cursor:pointer;padding:12px;text-decoration:underline}.invitation-content{visibility:hidden}.invitation-visible{visibility:visible}.invitation-visible .hero-frame{animation:invitation-arrive 1.1s ease both}@keyframes invitation-arrive{from{opacity:0;transform:translateY(30px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
/* Phone-led opening inspired by the reference reel */
.letter-intro{background:radial-gradient(ellipse at 50% 30%,#fffdf7 0%,#eee4d2 65%,#e5d5bb 100%)}.phone-scene{width:min(300px,66vw);height:min(485px,68vh);perspective:1200px;position:relative;animation:phone-arrive 1.1s cubic-bezier(.2,.8,.2,1) both}.phone{position:absolute;inset:0;border:8px solid #292724;border-radius:42px;background:#151411;box-shadow:0 28px 55px #40332140,0 5px 10px #44341e50;transform:rotate(-5deg);transform-style:preserve-3d}.phone:before{content:'';position:absolute;inset:5px;border:1px solid #d8bc82;border-radius:34px;pointer-events:none;z-index:4}.phone-speaker{position:absolute;z-index:7;top:10px;left:50%;width:74px;height:18px;border-radius:15px;background:#111;transform:translateX(-50%)}.phone-screen{position:absolute;inset:7px;background:linear-gradient(140deg,#eee0c8,#b38c5a 48%,#efe3ce);border-radius:33px;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#4b3d2b}.phone-screen:before,.phone-screen:after{content:'✧';position:absolute;color:#fff7e2a8;font-size:65px}.phone-screen:before{top:60px;left:18px}.phone-screen:after{bottom:36px;right:16px;font-size:45px}.screen-glow{position:absolute;inset:0;background:radial-gradient(circle at 50% 36%,#fff8e888,transparent 42%);mix-blend-mode:screen}.screen-kicker{font-size:8px;letter-spacing:2.4px;position:relative}.phone-screen strong{font:42px/0.9 Italiana,'Cormorant Garamond',serif;letter-spacing:-1px;margin:18px 0;position:relative}.phone-screen strong em{font:italic 28px 'Cormorant Garamond';letter-spacing:0}.phone-screen small{font-size:8px;letter-spacing:2px;position:relative}.screen-ornament{font-size:31px;color:#8e6b3e;margin:18px;position:relative}.screen-tap{position:absolute;bottom:22px;border:1px solid #70533380;padding:8px 14px;border-radius:20px;font-size:8px;letter-spacing:1px;opacity:.8}.is-opening .phone{animation:phone-open 1.25s cubic-bezier(.2,.8,.2,1) forwards}.is-opening .phone-scene{animation:phone-depart .65s ease 1.25s forwards}.is-opening{animation:letter-depart .45s ease 1.5s forwards}.hero-location{display:flex;align-items:center;gap:12px;margin-top:18px;padding:10px 13px;border:1px solid #b69a6259;background:#fffdf480;width:min(510px,92vw);text-align:left}.hero-location .pin{font-size:25px;color:var(--gold)}.hero-location b{font-size:9px;letter-spacing:1.2px;display:block}.hero-location small{font-size:10px;color:#697269;display:block;margin-top:3px}.hero-location a{margin-left:auto;white-space:nowrap;font-size:9px;border-bottom:1px solid var(--gold);padding-bottom:4px}.location{display:none}h1,h2,.phone-screen strong{font-family:Italiana,'Cormorant Garamond',serif;font-weight:400}@keyframes phone-arrive{from{opacity:0;transform:translateY(35px) rotate(2deg) scale(.92)}to{opacity:1;transform:translateY(0) rotate(0) scale(1)}}@keyframes phone-open{0%{transform:rotate(-5deg) scale(1)}45%{transform:rotate(1deg) scale(1.08)}100%{transform:rotate(0) scale(1.03)}}@keyframes phone-depart{to{opacity:0;transform:translateY(-35px) scale(1.08)}}@media(max-width:700px){.phone-scene{height:min(420px,62vh);width:min(260px,64vw)}.hero-location{gap:8px}.hero-location b{font-size:8px}.hero-location a{font-size:8px}}@media(prefers-reduced-motion:reduce){.phone-scene,.phone,.is-opening .phone-scene{animation:none!important}.phone{transform:rotate(0)}
}


/* Parchment invitation opening inspired by the reference reel */
.phone-scene{width:min(350px,62vw);height:min(560px,72vh);perspective:1200px;animation:card-arrive 1.1s cubic-bezier(.2,.8,.2,1) both}.phone{border:1px solid #98715d;border-radius:3px;background:#f5e7d4;box-shadow:0 25px 55px #62422b38,0 0 0 7px #f2e2ce,0 0 0 8px #b8946e55;transform:rotate(-1deg)}.phone:before{inset:10px;border:1px solid #a7775d;border-radius:0}.phone-speaker{display:none}.phone-screen{inset:0;border-radius:2px;background:linear-gradient(160deg,#fff6e8,#f1dfcc);color:#7f4f4a;padding:45px 35px;justify-content:center}.phone-screen:before{content:'❦  ✿  ❧  ✿  ❦';top:16px;left:0;right:0;text-align:center;color:#9c6658;font-size:22px;letter-spacing:7px}.phone-screen:after{content:'❦  ✿  ❧  ✿  ❦';bottom:16px;left:0;right:0;text-align:center;color:#9c6658;font-size:22px;letter-spacing:7px}.screen-kicker{font:italic 19px 'Cormorant Garamond';letter-spacing:0;color:#9c5d55;position:relative}.phone-screen strong{font:19px/1.25 'Cormorant Garamond',serif;letter-spacing:0;margin:18px 0;color:#7b4b49;position:relative;font-weight:500}.phone-screen strong em{font:italic 18px 'Cormorant Garamond';letter-spacing:0}.phone-screen small{font:italic 17px 'Cormorant Garamond';letter-spacing:0;color:#9c5d55;position:relative}.screen-ornament{font:9px Manrope;letter-spacing:1.5px;color:#8c6254;margin:27px 0 0;position:relative}.screen-tap{bottom:28px;border:1px solid #a77963;padding:8px 16px;border-radius:0;font-size:8px;letter-spacing:1px;color:#8b5a50;background:#fff8eeaa}.is-opening .phone{animation:card-open 1.25s cubic-bezier(.2,.8,.2,1) forwards}.is-opening .phone-scene{animation:card-depart .65s ease 1.25s forwards}@keyframes card-arrive{from{opacity:0;transform:translateY(35px) rotate(3deg) scale(.92)}to{opacity:1;transform:translateY(0) rotate(-1deg) scale(1)}}@keyframes card-open{0%{transform:rotate(-1deg) scale(1)}45%{transform:rotate(0) scale(1.06)}100%{transform:rotate(0) scale(1.02)}}@keyframes card-depart{to{opacity:0;transform:translateY(-35px) scale(1.06)}}
