/* A paper object built from CSS planes: no models, textures, fonts or render loop. */
.invitation-cover{background:#eee6df;color:#203c31;padding:28px 32px;background-image:radial-gradient(ellipse at 72% 38%,#fffaf4 0,transparent 62%),linear-gradient(125deg,#e6d8d3,transparent 60%)}
.invitation-cover::backdrop{background:#eee6df}
.invitation-open #app{height:0;overflow:hidden;visibility:hidden}
.letter-layout{min-height:100%;max-width:1440px;margin:auto;display:flex;flex-direction:column;position:relative}
.letter-top,.letter-bottom{display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:.2em;text-transform:uppercase;gap:20px}
.letter-top{padding-bottom:20px;border-bottom:1px solid #31523c24}
.letter-monogram{font:italic 27px var(--serif);letter-spacing:-.06em}
.letter-top button,.letter-skip{border:0;background:none;color:#623746;padding:12px 0;font-size:10px;letter-spacing:.12em;text-transform:uppercase;text-underline-offset:5px;text-decoration:underline}
.letter-main{flex:1;display:grid;grid-template-columns:1fr 1.1fr;align-items:center;gap:4%;padding:60px 5% 70px}
.letter-intro .eyebrow{color:#8c4a5c;font-size:9px;margin-bottom:26px}
.letter-intro h1{font:normal clamp(66px,7.6vw,118px)/.88 var(--serif);letter-spacing:-.065em;margin:0 0 28px}
.letter-intro h1 em{display:block;font-size:.52em;color:#8c4a5c;line-height:1.2;margin-left:1em}
.letter-message{font:italic 21px/1.6 var(--serif);max-width:290px;color:#75625e}
.letter-date{margin-top:35px;display:flex;align-items:center;gap:18px;font-size:10px;letter-spacing:.12em;text-transform:uppercase}
.letter-date span:first-child{font:44px/1 var(--serif);letter-spacing:-.04em;border-right:1px solid #31523c44;padding-right:18px}
.letter-date span:last-child{line-height:1.8}
.letter-stage{perspective:1400px;position:relative;padding:90px 0 45px;text-align:center;width:100%;min-width:0}
.envelope{position:relative;width:100%;aspect-ratio:1.48;transform:rotate(-7deg) rotateX(13deg) rotateY(-9deg);transform-style:preserve-3d;transition:transform 1.1s cubic-bezier(.22,1,.36,1);isolation:isolate}
.envelope-back{position:absolute;inset:0;background:linear-gradient(135deg,#264b3c,#103527);border-radius:5px;box-shadow:14px 32px 35px #152c272b,2px 6px 8px #152c2730}
.envelope-pocket{position:absolute;inset:0;z-index:3;border-radius:4px;background:linear-gradient(145deg,#365d49,#1a4031 70%);clip-path:polygon(0 0,50% 53%,100% 0,100% 100%,0 100%)}
.envelope-folds{position:absolute;inset:0;z-index:4;background:linear-gradient(32deg,transparent 49.7%,#b1b59630 50%,transparent 50.3%),linear-gradient(-32deg,transparent 49.7%,#071f1840 50%,transparent 50.3%);clip-path:polygon(0 0,50% 53%,100% 0,100% 100%,0 100%);pointer-events:none}
.envelope-flap{position:absolute;inset:0 0 auto;height:58%;z-index:5;transform-origin:50% 0;transform-style:preserve-3d;transition:transform .85s ease,z-index 0s .4s}
.envelope-flap::before{content:"";position:absolute;inset:0;background:linear-gradient(170deg,#41644e,#224735);clip-path:polygon(0 0,100% 0,50% 100%)}
.envelope-letter{position:absolute;inset:8% 7%;z-index:2;background:#fff9ed;border:1px solid #d8c8ac;box-shadow:0 2px 8px #0002;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;padding:20px;transition:transform 1s .5s cubic-bezier(.22,1,.36,1);color:#254735}
.envelope-letter::before{content:"";position:absolute;inset:10px;border:1px solid #b89d6570;pointer-events:none}
.envelope-letter small{font-size:8px;letter-spacing:.17em;text-transform:uppercase}
.envelope-letter strong{font:italic clamp(23px,2.8vw,41px)/1.05 var(--serif);font-weight:400}
.envelope-letter span{font-size:9px;letter-spacing:.12em}
.wax-seal{position:absolute;top:42%;left:50%;z-index:6;width:76px;height:76px;margin-left:-38px;border-radius:47% 52% 46% 50%;border:1px solid #b87586;background:radial-gradient(circle at 30% 20%,#a34d62,#773346 65%,#592434);box-shadow:2px 5px 7px #061c164d,inset 0 2px 3px #e8a7b57a,inset 0 -3px 4px #38121c80;color:#e5afbb;font:italic 25px var(--serif);text-shadow:0 1px #3d1723;transition:opacity .35s,transform .5s;cursor:pointer}
.wax-seal::before{content:"";position:absolute;inset:8px;border:1px solid #d08a9966;border-radius:50%;box-shadow:inset 0 1px 2px #36131b80}
.envelope-mark{position:absolute;bottom:12%;left:0;right:0;z-index:4;color:#d8d5b7;font-size:8px;letter-spacing:.3em;text-transform:uppercase;pointer-events:none}
.letter-stage-note{margin:50px 0 20px;font:italic 17px var(--serif);color:#78625f}
.letter-open{background:#773346;color:#fff6ef;border:1px solid #773346;border-radius:30px;padding:17px 30px;margin-top:50px;letter-spacing:.15em;font-size:10px;text-transform:uppercase;box-shadow:0 8px 20px #77334615;min-width:210px}
.letter-open:hover{background:#5e293b}.letter-open:disabled{opacity:.7;cursor:default}
.letter-bottom{border-top:1px solid #31523c24;padding-top:20px;color:#75625e;font-size:8px}
.letter-bottom i{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px;background:#773346}.letter-bottom i:nth-child(2){background:#b68592}.letter-bottom i:nth-child(3){background:#264d3d}
@media(min-width:761px) and (max-height:800px){.letter-main{padding:28px 5% 32px}.letter-intro h1{font-size:clamp(66px,7vw,100px)}.letter-stage{padding:50px 0 20px;max-width:480px;margin:auto}.letter-stage-note{margin-top:32px}.letter-message{font-size:19px}.letter-date{margin-top:25px}}
.is-opening .envelope{transform:rotate(0) rotateX(0) rotateY(0)}
.is-opening .wax-seal{opacity:0;transform:translateY(35px) rotate(18deg);pointer-events:none}
.is-opening .envelope-flap{transform:rotateX(-175deg);z-index:1}
.is-opening .envelope-letter{transform:translateY(-58%)}
.cover-leaving{opacity:0;transition:opacity .45s}
.reopen-letter{border:0;background:none;font-size:10px;color:inherit;text-decoration:underline;text-underline-offset:5px;cursor:pointer}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.letter-stage:not(.is-opening):hover .envelope{transform:rotate(-3deg) rotateX(6deg) rotateY(3deg)}}
@media(max-width:760px){.invitation-cover{padding:18px 22px}.letter-top{font-size:8px;padding-bottom:12px}.letter-main{grid-template-columns:1fr;gap:0;padding:36px 0 20px}.letter-intro{text-align:center}.letter-intro .eyebrow{margin-bottom:18px;font-size:8px}.letter-intro h1{font-size:clamp(57px,13vw,86px);line-height:.9;margin-bottom:18px}.letter-intro h1 em{display:inline;margin:0 7px;font-size:.65em}.letter-message{font-size:16px;margin:0 auto;max-width:260px}.letter-date{justify-content:center;margin-top:20px;font-size:8px}.letter-date span:first-child{font-size:33px}.letter-stage{max-width:350px;width:85%;margin:0 auto;padding:68px 0 16px}.wax-seal{width:58px;height:58px;margin-left:-29px;font-size:21px}.envelope-letter{gap:5px;padding:12px}.envelope-letter strong{font-size:23px}.envelope-letter small{font-size:6px}.envelope-letter span{font-size:7px}.letter-stage-note{margin:32px 0 16px;font-size:15px}.letter-bottom{font-size:7px;line-height:1.8;gap:10px}.letter-bottom>span:last-child{max-width:130px;text-align:right}}
@media(prefers-reduced-motion:reduce){.envelope,.envelope-letter,.envelope-flap,.wax-seal,.cover-leaving{transition:none!important}.envelope{transform:none}}
/* Photo prints retain normal scrolling and readable HTML. */
.gallery-card{border:7px solid #fffaf5;box-shadow:0 8px 20px #38212316;border-radius:2px}
.gallery-number{background:#fffaf5e8;font-size:9px;bottom:8px;left:8px}
.gallery-heading>p{font:italic 19px/1.5 var(--serif);color:#80606a}
.gallery-grid{gap:22px}
.gallery-card:nth-child(3n+1){transform:rotate(-1deg)}
.gallery-card:nth-child(3n+2){transform:rotate(1deg)}
.gallery-card:nth-child(2){grid-row:span 2}
.gallery-card:nth-child(2) img{object-position:center}
@media(max-width:760px){.gallery-grid{gap:12px}.gallery-card{border-width:5px}}
@keyframes guest-card-arrive{from{opacity:0;transform:perspective(800px) rotateX(9deg) translateY(16px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:no-preference){.guest-card{animation:guest-card-arrive .55s ease-out both}}

/* Spacing for the shorter invitation and consolidated wedding details. */
.site-header{top:0}
.hero{height:100svh}
.story>h2{max-width:1000px}
.story-media{margin-top:56px}
.story-media::after{display:none}
.celebration-extras{display:flex;justify-content:space-between;align-items:center;gap:32px;padding-top:36px;scroll-margin-top:100px}
.wedding-colours .detail-label{margin-bottom:12px}
.wedding-colours p{margin:0;color:#e9e7db;font-size:13px;line-height:2}
.colour-dot{display:inline-block;width:9px;height:9px;margin-right:6px;border-radius:50%;border:1px solid #ffffff66}
.dusty-pink{background:#b68592}.burgundy{background:#773346}.forest-green{background:#264d3d}
.celebration-extras .inline-action{flex:none}
.rsvp-card-top{justify-content:flex-end}
.attendance-options{margin-top:24px}
.site-footer{padding-bottom:70px}
@media(max-width:760px){.hero{height:auto}.hero-content{padding-bottom:42px}.letter-open{margin-top:34px}.celebration-extras{align-items:flex-start;flex-direction:column;gap:24px}.story-media{margin-top:36px}}