@font-face{font-family:Invitation;src:url('assets/cormorant.ttf') format('truetype');font-display:swap}
:root{--green:#46573e;--moss:#737e49;--ink:#3c4938;--muted:#707665;--paper:#fffef9;--ground:#f3f1e9;--serif:Invitation,'Palatino Linotype','Book Antiqua',Georgia,serif}
*{box-sizing:border-box}body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--serif);-webkit-font-smoothing:antialiased;background-image:url('assets/paper.svg')}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}a{color:inherit}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--green);outline-offset:6px}button{cursor:pointer}button:disabled{cursor:default}[hidden]{display:none!important}.masthead{height:100px;max-width:1280px;margin:auto;padding:0 6%;display:flex;align-items:center;justify-content:space-between}.little-monogram{font-size:24px;letter-spacing:2px}.little-monogram i{font-size:9px;font-style:normal;padding:0 10px;color:#7b855b}.header-date{font-family:Arial,sans-serif;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--muted)}main{min-height:calc(100svh - 172px)}.welcome{text-align:center;padding:22px 24px 10px;overflow:hidden}.eyebrow{font:10px/1.6 Arial,sans-serif;letter-spacing:3px;color:#67765e;margin:0 0 20px}h1{font-size:clamp(34px,4.3vw,53px);font-weight:400;line-height:1.1;letter-spacing:-1px;margin:0}h1 em{font-weight:400}.intro{font-size:17px;color:var(--muted);margin:18px 0 0}.stage{width:min(660px,100%);margin:47px auto 28px;perspective:1600px;aspect-ratio:1.62;position:relative}.envelope{position:absolute;inset:0;transform:rotate(-3deg);transition:transform 1.1s ease;filter:drop-shadow(0 20px 23px #343e2828)}.envelope-back,.front-flap,.bottom-flap,.inner-glimpse{position:absolute;background:var(--paper);background-image:url('assets/paper.svg');border:1px solid #e6e5db;border-radius:2px;inset:0;overflow:hidden}.envelope-back{box-shadow:inset 0 0 0 12px #f4f2e8}.back-leaves{position:absolute;width:32%;right:0;top:0;transform:rotate(90deg);opacity:.9}.inner-glimpse{inset:9% 7%;display:flex;flex-direction:column;justify-content:center;gap:18px;align-items:center;box-shadow:0 0 6px #3331}.inner-glimpse span{font-size:clamp(18px,4vw,40px);font-style:italic}.inner-glimpse i{font-size:.7em}.inner-glimpse small{letter-spacing:5px;font-size:10px}.bottom-flap{top:61%;transform-origin:bottom;z-index:2;box-shadow:0 -3px 6px #4e53320b}.bottom-flap img{position:absolute;width:36%;bottom:-8%;right:-2%;transform:rotate(180deg)}.front-flap{bottom:21%;z-index:3;transform-origin:top;box-shadow:0 5px 6px #353b341b;backface-visibility:visible}.front-leaves{position:absolute;top:-5%;left:-1%;width:38%;height:108%;object-fit:cover;object-position:top left;opacity:.92}.monogram{position:absolute;left:48%;top:20%;height:61%;display:flex;align-items:center;gap:14px;color:#526244;font-size:clamp(54px,13vw,119px);font-weight:400;line-height:1}.monogram-divider{width:1px;height:78%;background:#9b9f89;position:relative;display:block}.monogram-divider b{font-size:11px;position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);padding:7px 0;background:var(--paper);font-weight:400}.ribbon{position:absolute;inset:-3% 0 -3% 32%;width:18%;z-index:5;pointer-events:none}.ribbon-strip{position:absolute;left:38%;width:9%;background:linear-gradient(90deg,#536039,#b3b68a 18%,#8e995f 43%,#7b8651 78%,#4e5b32);box-shadow:1px 1px 2px #2d352d44}.ribbon-upper{top:0;height:52%;transform:rotate(1deg);transform-origin:bottom}.ribbon-lower{top:49%;height:51%;transform:rotate(-1deg);transform-origin:top}.bow{width:155%;height:96%;position:absolute;left:-23%;top:8%;overflow:visible;filter:drop-shadow(1px 2px 1px #353b3b45)}.open-hit{position:absolute;inset:0;border:0;background:transparent;z-index:8;border-radius:3px}.opening-caption{display:flex;flex-direction:column;align-items:center;gap:8px;color:#67735a}.opening-caption p{font-size:16px;font-style:italic;letter-spacing:.2px;margin:0}.touch-mark{font-size:25px}.caption-line{width:32px;height:1px;background:#b5bba6;margin:10px}.quiet-button{border:0;background:none;text-decoration:underline;text-underline-offset:4px;color:#5c684f;font-size:13px;padding:12px}.skip-opening{font-family:Arial,sans-serif;font-size:10px;letter-spacing:1px}.opening-caption,.skip-opening{transition:opacity .4s}.opening .opening-caption,.opening .skip-opening{opacity:0;pointer-events:none}.opening .envelope{transform:rotate(0)}.opening .loop-left{animation:untieLeft .85s ease forwards}.opening .loop-right{animation:untieRight .85s ease forwards}.opening .tail-left{animation:tailLeft 1s ease forwards}.opening .tail-right{animation:tailRight 1s ease forwards}.opening .bow-knot{animation:fadeKnot .7s ease forwards}.opening .ribbon-upper{animation:slideUp 1s .65s ease-in forwards}.opening .ribbon-lower{animation:slideDown 1s .65s ease-in forwards}.opening .front-flap{animation:openTop 1.15s 1.55s cubic-bezier(.3,.1,.3,1) forwards}.opening .bottom-flap{animation:openBottom 1s 2.2s cubic-bezier(.3,.1,.3,1) forwards}.opening .inner-glimpse{animation:liftPaper .9s 2.9s ease forwards}.opening .stage{transition:opacity .7s 3.3s;opacity:0}@keyframes untieLeft{to{transform:translate(-30px,-36px) rotate(-32deg);opacity:0}}@keyframes untieRight{to{transform:translate(40px,-25px) rotate(24deg);opacity:0}}@keyframes tailLeft{to{transform:translate(-36px,45px);opacity:0}}@keyframes tailRight{to{transform:translate(36px,45px);opacity:0}}@keyframes fadeKnot{to{opacity:0}}@keyframes slideUp{to{transform:translateY(-180%) rotate(-9deg);opacity:0}}@keyframes slideDown{to{transform:translateY(180%) rotate(10deg);opacity:0}}@keyframes openTop{70%{opacity:1}to{transform:rotateX(170deg);opacity:0}}@keyframes openBottom{70%{opacity:1}to{transform:rotateX(-160deg);opacity:0}}@keyframes liftPaper{to{transform:translateY(-20px) scale(1.06)}}
.invitation{padding:18px 24px 20px;text-align:center;animation:reveal 1.1s both}.paper{width:min(700px,100%);position:relative;margin:0 auto;background:var(--paper);background-image:url('assets/paper.svg');box-shadow:0 12px 70px #3e492316;overflow:hidden;border:1px solid #e4e5d9}.paper:after{content:'';position:absolute;inset:19px;border:1px solid #98a17c55;pointer-events:none}.paper-foliage{position:absolute;pointer-events:none;width:44%;z-index:1;opacity:.88}.paper-top{top:-15px;left:-18px}.paper-bottom{bottom:-18px;right:-20px;transform:rotate(180deg)}.paper-content{position:relative;z-index:2;padding:72px 48px 54px}.paper .eyebrow{font-size:9px;letter-spacing:2.6px;padding-left:50px}h2{font-size:clamp(49px,7vw,74px);font-weight:400;font-style:italic;line-height:.98;margin:38px 0 26px;display:flex;flex-direction:column;align-items:center;gap:0}h2:focus{outline:none}h2 i{font-size:32px;font-weight:400;line-height:1.2;color:#7e895f;margin:6px}.invitation-copy{font-size:18px;line-height:1.55;color:#616854;margin:0 0 28px}.date-block{display:flex;flex-direction:column;align-items:center;gap:10px;margin:24px auto 27px}.date-block>span{font:10px/1.4 Arial,sans-serif;letter-spacing:3px}.date-block strong{font-size:36px;font-weight:400;line-height:1.2;letter-spacing:3px;white-space:nowrap}.date-block i{font-size:26px;font-weight:400;color:#9aab87;margin:0 3px}.venue h3{font-size:27px;font-weight:400;margin:0 0 8px}.venue p{font-size:17px;line-height:1.6;margin:0;color:#656d5a}.map-link{font-family:Arial,sans-serif;font-size:10px;letter-spacing:1px;text-underline-offset:4px;display:inline-block;padding:14px}.small-leaf{display:block;font-size:31px;color:#7e8b65;margin:16px 0 8px}.presence-copy{font-size:17px;font-style:italic;margin:6px 0 20px}.rsvp-button{display:inline-flex;justify-content:center;align-items:center;gap:32px;min-height:51px;background:#4d6044;color:#fffef7;text-decoration:none;padding:16px 25px;font:11px/1.5 Arial,sans-serif;letter-spacing:1px;transition:background .2s,transform .2s;border:1px solid #4d6044}.rsvp-button:hover{background:#354a2f;transform:translateY(-2px)}.rsvp-button span{font-size:17px;line-height:1}.qr-details{margin:21px auto 0;max-width:240px}.qr-details summary{font:11px/1.7 Arial,sans-serif;cursor:pointer;color:#687359;padding:12px 2px;min-height:44px;text-underline-offset:4px}.qr-details[open] summary{margin-bottom:8px}.qr-details img{display:block;margin:auto;background:#fff;padding:0;max-width:100%;height:auto}.qr-details p{font:10px/1.5 Arial,sans-serif;color:#65705a}.signature{font-size:15px;font-style:italic;margin:30px 0 0}.signature span{display:block;font-size:23px;margin-top:7px}.replay{margin-top:22px}.no-script{padding:40px 24px;text-align:center}.no-script h2{font-size:40px}.no-script p{line-height:1.8}footer{min-height:72px;text-align:center;display:flex;align-items:center;justify-content:center;gap:18px;color:#737d65;font:8px/1.6 Arial,sans-serif;letter-spacing:2px;padding:20px}footer span{font-size:9px;color:#87906d}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}@keyframes reveal{from{opacity:0;transform:translateY(35px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1000px) and (min-height:900px){.welcome{padding-top:48px}.stage{margin-top:58px;margin-bottom:35px}}
@media(max-width:600px){.masthead{height:78px;padding:0 25px}.header-date{font-size:8px;letter-spacing:1.2px}.little-monogram{font-size:21px}.little-monogram i{padding:0 5px}.welcome{padding:30px 22px 20px}.eyebrow{font-size:8px;letter-spacing:2.5px;margin-bottom:20px}h1{font-size:37px;letter-spacing:-.7px}.intro{font-size:16px;max-width:250px;margin:18px auto 0;line-height:1.5}.stage{margin-top:54px;margin-bottom:39px}.monogram{gap:9px;left:49%;font-size:17vw}.monogram-divider b{font-size:7px;padding:4px 0}.opening-caption p{font-size:15px}.invitation{padding:8px 14px 16px}.paper-content{padding:58px 28px 43px}.paper:after{inset:12px}.paper-foliage{width:49%;opacity:.8}.paper .eyebrow{font-size:7px;letter-spacing:1.5px;padding-left:25px}h2{font-size:62px;margin-top:34px}.invitation-copy{font-size:17px;margin-bottom:25px}.date-block strong{font-size:30px;letter-spacing:1px}.date-block i{font-size:23px;margin:0 1px}.date-block>span{font-size:9px}.venue h3{font-size:26px}.venue p{font-size:16px}.presence-copy{font-size:16px}.rsvp-button{width:100%;max-width:280px;font-size:10px;padding:15px 18px;gap:22px}.signature{margin-top:24px}footer{font-size:7px;gap:12px;letter-spacing:1.5px}.desktop-break{display:none}}
@media(max-width:350px){h1{font-size:32px}.header-date{font-size:7px}h2{font-size:53px}.paper-content{padding-left:22px;padding-right:22px}.date-block strong{font-size:27px}}
/* The original inside heading: monogram, Ruth 1:16, parents and calligraphic names. */
@font-face{font-family:WeddingScript;src:url('assets/great-vibes.ttf') format('truetype');font-display:swap}
.paper-top{width:34%;top:-35px;left:-20px}
.paper-content{padding-top:70px}
.inside-monogram{display:flex;align-items:center;justify-content:center;gap:13px;font-size:83px;line-height:1;color:#596643;margin:12px 0 23px}
.inside-divider{height:65px;width:1px;background:#a9ae9780;position:relative}
.inside-divider b{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:9px;font-weight:400;background:var(--paper);padding:5px 0}
.verse{max-width:470px;margin:0 auto 72px;font-size:16px;line-height:1.4;color:#505644;font-style:normal}
.verse p{margin:0}.verse cite{font-style:normal;display:block;margin-top:5px}
.parents-blessing{font-size:15px;letter-spacing:1.1px;line-height:1.5;margin:0 0 17px}
.parents{display:flex;justify-content:space-between;gap:30px;max-width:410px;margin:0 auto;color:#505644;font-size:17px;line-height:1.1}
.parents p{margin:0;min-width:80px}
h2.couple-names{display:block;font-family:WeddingScript,var(--serif);font-size:66px;font-style:normal;font-weight:400;line-height:1.4;white-space:nowrap;margin:29px 0 24px;color:#596643}
.rsvp-button{gap:20px}
@media(max-width:600px){.paper-top{width:36%;top:-20px;left:-12px}.paper-content{padding-top:49px}.inside-monogram{font-size:68px;margin-top:10px;margin-bottom:22px;gap:10px}.inside-divider{height:54px}.verse{font-size:15px;line-height:1.4;margin-bottom:45px}.parents-blessing{font-size:12px;letter-spacing:.7px;margin-bottom:16px}.parents{font-size:16px;max-width:270px;gap:20px}h2.couple-names{font-size:clamp(36px,11vw,60px);margin:26px -10px 23px}.rsvp-button{font-size:10px;letter-spacing:.5px;gap:13px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important;transition-delay:0s!important}html{scroll-behavior:auto!important}}