/* Plum & Pearl. Isolated artwork, curved paper folds and mobile stationery. */
.opening-overlay.op-plum{display:grid;place-items:center;padding:60px 38px 38px;background:#4B203E;color:#FAF6EF;isolation:isolate}
.op-plum:before{content:'';position:absolute;inset:0;z-index:-1;background:url('/themes/plum-pearl/artwork.webp') left center/300% 100% no-repeat;pointer-events:none}
.pp-stage{width:100%;max-width:348px;display:flex;flex-direction:column;align-items:center;gap:38px;perspective:1600px}
.pp-wrap{position:relative;width:100%;aspect-ratio:2/3;transform-style:preserve-3d;filter:drop-shadow(0 15px 14px #180a1d66)}
.pp-sheet,.pp-wrap-back{position:absolute;inset:0;background:#FAF6EF url('/themes/plum-pearl/artwork.webp') right center/300% 100% no-repeat;border:1px solid #C7AC78}
.pp-sheet{overflow:hidden;transition:transform 1.4s cubic-bezier(.2,.6,.2,1) 1.2s}
.pp-wrap-back{z-index:1;background-position:center;transition:opacity .45s .3s}
.pp-reveal-copy{position:absolute;inset:18% 15% 17%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;color:#4B203E}
.pp-reveal-copy p{font:10px/1.8 Georgia,serif;letter-spacing:1.2px;margin:8px 0}
.pp-reveal-copy strong{font:400 clamp(28px,calc(8 * min(1vw, 4.4px)),43px)/1.04 'Cormorant Garamond',Georgia,serif;display:flex;flex-direction:column;width:100%;overflow-wrap:anywhere}
.pp-reveal-copy em{font:italic .7em/1.2 Georgia,serif;color:#94703F}
.pp-flap{position:absolute;top:0;bottom:0;width:50%;z-index:2;transform-style:preserve-3d;backface-visibility:hidden;transition:transform 2.1s cubic-bezier(.25,.1,.15,1) .25s;will-change:transform}
.pp-flap svg{width:100%;height:100%;display:block;overflow:visible}
.pp-flap-left{left:0;transform-origin:left center;filter:drop-shadow(3px 0 3px #70522b40)}
.pp-flap-right{right:0;transform-origin:right center;filter:drop-shadow(-3px 0 3px #70522b40)}
.pp-seal{position:absolute;z-index:4;top:50%;left:50%;transform:translate(-50%,-50%);width:clamp(64px,19vw,86px);aspect-ratio:1;border:3px double #E9CE91;border-radius:50%;background:radial-gradient(circle at 32% 22%,#DDB873,#AC7C36 62%,#744C20);box-shadow:inset 0 0 0 4px #916426,inset 0 0 0 5px #E8CD92,0 5px 10px #23102870;color:#FFF4D6;padding:12px;transition:opacity .25s,transform .35s}
.pp-seal:before,.pp-seal:after{content:'❧';position:absolute;bottom:9%;font:25px Georgia,serif;color:#F0DBA8;left:12%;transform:rotate(-45deg)}
.pp-seal:after{left:auto;right:12%;transform:scaleX(-1) rotate(-45deg)}
.pp-seal span{display:flex;flex-direction:column;align-items:center;justify-content:center;font:400 25px/.9 Georgia,serif;height:100%}
.pp-seal b{font-weight:400;max-width:100%;overflow-wrap:anywhere}
.pp-seal i{font:10px/1 Georgia,serif;margin:3px}
.pp-enter{font:17px/1.4 'Cormorant Garamond',Georgia,serif;background:#32162f66;border:1px solid #D8BB82;border-radius:30px;color:#FFF4DF;padding:12px 28px;min-height:46px;min-width:80%;box-shadow:none;transition:opacity .2s}
.pp-enter span{padding-inline-start:18px}
.pp-skip{position:absolute;top:16px;right:16px;color:#FFF4DF;background:#32162f99;border:1px solid #C7AC7877;padding:7px 12px;border-radius:24px;font:11px/1.6 Georgia,serif;z-index:6;min-height:36px}
.op-plum button:focus-visible{outline:3px solid #FFF4DF;outline-offset:5px}
.op-plum.is-opening :is(.pp-seal,.pp-enter){opacity:0;visibility:hidden;pointer-events:none}
.op-plum.is-opening .pp-seal{transform:translate(-50%,-50%) scale(1.15)}
.op-plum.is-opening .pp-wrap-back{opacity:0;pointer-events:none}
.op-plum.is-opening .pp-flap-left{transform:rotateY(-145deg)}
.op-plum.is-opening .pp-flap-right{transform:rotateY(145deg)}
.op-plum.is-opening .pp-sheet{transform:scale(1.045)}
/* Inner stationery uses separate, proportionate corners, never a stretched frame. */
body[data-theme=plum] #invitation{--pp-rule:#C7AC7880;background:var(--paper,#FAF6EF);color:var(--base-text,#4B203E);container-type:inline-size}
body[data-theme=plum] #invitation .topbar{height:56px;padding:0 28px;background:var(--paper);border:0;color:var(--base-text)}
body[data-theme=plum] #invitation .topbar :is(a,button,.monogram){color:var(--base-text)}
body[data-theme=plum] #invitation .topbar button{border:0;background:transparent;padding:8px}
body[data-theme=plum] #invitation :is(.pp-hero,.pp-section){position:relative;isolation:isolate;background:transparent;overflow:hidden;text-align:center;margin:0;padding:100px 28px 110px;min-height:0;border:0}
body[data-theme=plum] #invitation :is(.pp-hero,.pp-section):before,body[data-theme=plum] #invitation :is(.pp-hero,.pp-section):after{content:none}
.pp-flower{position:absolute;display:block;width:140px;aspect-ratio:1;pointer-events:none;z-index:-1;background:url('/themes/plum-pearl/floral-corner.webp') center/contain no-repeat}
.pp-flower-tl{top:0;left:0}.pp-flower-tr{top:0;right:0;transform:scaleX(-1)}
.pp-flower-br{bottom:0;right:0;transform:rotate(180deg)}.pp-flower-bl{bottom:0;left:0;transform:scaleY(-1)}
body[data-theme=plum] #invitation .pp-hero .pp-flower{width:145px}
body[data-theme=plum] #invitation .pp-hero-copy{padding:0;position:relative;min-width:0}
body[data-theme=plum] #invitation .pp-inner-monogram{font:400 24px/1.4 'Cormorant Garamond',Georgia,serif;letter-spacing:4px;margin:0 auto;color:var(--base-text)}
.pp-family{font:10px/1.9 Georgia,serif;letter-spacing:2px;margin:36px auto 0;max-width:270px;text-transform:uppercase;overflow-wrap:anywhere}
body[data-theme=plum] #invitation .pp-names{font:400 66px/1.05 'Cormorant Garamond',Georgia,serif;color:var(--base-heading);margin:35px 0 30px;overflow-wrap:anywhere}
body[data-theme=plum] #invitation .pp-names span{display:block;font:inherit;color:inherit;line-height:inherit}
body[data-theme=plum] #invitation .pp-names em{display:block;font:italic 43px/1.1 Georgia,serif;color:#A88A57;margin:3px auto}
.pp-welcome{font:400 20px/1.6 'Cormorant Garamond',Georgia,serif;margin:0 auto 22px;max-width:310px;overflow-wrap:anywhere}
.pp-date{font:400 26px/1.4 'Cormorant Garamond',Georgia,serif;letter-spacing:1px;margin:22px auto 28px;color:var(--base-text)}
.pp-divider{display:flex;align-items:center;justify-content:center;gap:12px;color:#94703F;width:70%;max-width:240px;margin:23px auto;font:16px/1 Georgia,serif}
.pp-divider:before,.pp-divider:after{content:'';flex:1;height:1px;background:linear-gradient(90deg,transparent,#C7AC78)}
.pp-divider:after{transform:rotate(180deg)}
body[data-theme=plum] #invitation :is(.pp-frame-copy,.pp-hero-copy)>.pp-divider{width:120px;max-width:45%;margin:24px auto}
body[data-theme=plum] #invitation .pp-explore{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:11px 22px;border:1px solid var(--base-text);border-radius:28px;font:15px/1.4 'Cormorant Garamond',Georgia,serif;text-decoration:none;color:var(--base-text)}
.pp-guest{font:14px/1.7 'Cormorant Garamond',Georgia,serif;margin:20px 0}.pp-guest strong{display:block;font-size:17px;font-weight:400}
.pp-portrait{width:120px;height:150px;object-fit:cover;border-radius:70px 70px 4px 4px;border:1px solid #C7AC78;margin:20px auto 0}
body[data-theme=plum] #invitation .pp-frame-copy{position:relative;max-width:100%;min-width:0}
body[data-theme=plum] #invitation .pp-section>.pp-divider{width:120px;margin:28px auto 0}
body[data-theme=plum] #invitation .section h2{font:400 35px/1.2 'Cormorant Garamond',Georgia,serif;color:var(--base-heading);margin:10px 0 26px;overflow-wrap:anywhere}
body[data-theme=plum] #invitation .section h3{color:var(--base-heading);overflow-wrap:anywhere}
body[data-theme=plum] #invitation .small{font:10px/1.9 Georgia,serif;letter-spacing:1.5px;color:var(--base-muted);margin:0 auto 14px;max-width:100%;overflow-wrap:anywhere}
body[data-theme=plum] #invitation .section p{color:var(--base-text);line-height:1.65}
body[data-theme=plum] #invitation .quote{font-size:25px;line-height:1.6;margin:0}
body[data-theme=plum] #invitation .pp-events{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;margin:28px 0 0}
body[data-theme=plum] #invitation .pp-events .pp-event,body[data-theme=plum] #invitation .pp-events .pp-event:last-child,body[data-theme=plum] #invitation .pp-events .pp-event:only-child{grid-column:auto;justify-self:stretch;width:100%;min-width:0;outline:0;outline-offset:0;border:1px solid #BB9C68;border-radius:9px;background:transparent;box-shadow:none;padding:22px;text-align:start;color:var(--base-text)}
body[data-theme=plum] #invitation .pp-event h3{font:400 30px/1.2 'Cormorant Garamond',Georgia,serif;margin:0 0 10px;color:var(--base-heading)}
body[data-theme=plum] #invitation .pp-event .event-date{font:18px/1.5 'Cormorant Garamond',Georgia,serif;color:var(--base-text);margin:0}
.pp-event-details{margin:18px 0;text-align:start;font:17px/1.5 'Cormorant Garamond',Georgia,serif}
.pp-event-details>div{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;margin:11px 0;align-items:start}
.pp-event-details dt{display:flex;align-items:center;justify-content:center;padding-top:2px}
.pp-event-details svg,.pp-venue-address svg{display:block;flex:none;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.4}
.pp-event-details dd{margin:0;overflow-wrap:anywhere}.pp-event-details strong{font-weight:400}.pp-event-details dd span{display:block;font-size:15px;margin-top:3px}
.pp-event-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px;justify-content:flex-start}
body[data-theme=plum] #invitation .pp-event-actions :is(a,button){flex:1 1 115px;display:flex;align-items:center;justify-content:center;text-align:center;min-width:0;min-height:42px;border:1px solid #A18256;border-radius:6px;padding:9px 10px;background:transparent;color:var(--base-text);font:14px/1.4 'Cormorant Garamond',Georgia,serif;text-decoration:none;white-space:normal;overflow-wrap:anywhere}
body[data-theme=plum] #invitation .pp-event-actions a{border-color:var(--base-text)}
body[data-theme=plum] #invitation #venue h2{margin-bottom:8px}
body[data-theme=plum] #invitation .pp-venue-subtitle{font:18px/1.6 'Cormorant Garamond',Georgia,serif;margin:0 auto 15px}
body[data-theme=plum] #invitation .pp-venue{width:100%;margin:24px auto 22px;max-width:100%}
body[data-theme=plum] #invitation .pp-venue img{display:block;width:100%;height:auto;aspect-ratio:4/3;max-height:250px;object-fit:cover;border:1px solid #C7AC78;border-radius:8px}
.pp-venue-list{max-width:100%}.pp-venue-details+.pp-venue-details{border-top:1px solid var(--pp-rule);margin-top:25px;padding-top:25px}
body[data-theme=plum] #invitation .pp-venue-details h3{font:400 29px/1.3 'Cormorant Garamond',Georgia,serif;margin:0 0 10px}
body[data-theme=plum] #invitation .pp-venue-event{font:11px/1.8 Georgia,serif;letter-spacing:1px;margin:0 auto 8px}
body[data-theme=plum] #invitation .pp-venue-address{display:flex;align-items:flex-start;justify-content:center;gap:9px;font:17px/1.5 'Cormorant Garamond',Georgia,serif;margin:8px auto 20px;overflow-wrap:anywhere}
.pp-venue-address span{min-width:0}.pp-venue-address svg{margin-top:3px}
body[data-theme=plum] #invitation .pp-directions{display:inline-flex;align-items:center;justify-content:center;min-height:44px;max-width:100%;border:1px solid var(--base-text);border-radius:7px;background:var(--base-primary);color:var(--base-on-primary);padding:11px 26px;font:16px/1.4 'Cormorant Garamond',Georgia,serif;text-decoration:none}
body[data-theme=plum] #invitation .pp-venue-pending{font:18px/1.6 'Cormorant Garamond',Georgia,serif;margin:16px 0 0}
body[data-theme=plum] #invitation .counter{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:28px}
body[data-theme=plum] #invitation .counter>div{min-width:0;padding:16px 2px;background:transparent;border:1px solid #C7AC78;border-radius:6px}
body[data-theme=plum] #invitation .counter strong{font-size:30px;color:var(--base-text)}
body[data-theme=plum] #invitation .counter span{font-size:8px;letter-spacing:.5px;color:var(--base-muted)}
body[data-theme=plum] #invitation :is(.form-box,.upload-panel,.moment,.message,.date-under,.scratch-wrap){background:transparent;box-shadow:none;min-width:0;max-width:100%}
body[data-theme=plum] #invitation :is(.form-box,.upload-panel){padding:20px 16px;border:1px solid var(--pp-rule);border-radius:8px}
body[data-theme=plum] #invitation :is(input,select,textarea){max-width:100%;box-sizing:border-box}
body[data-theme=plum] #invitation .timeline{margin:28px 0 0;max-width:100%}
body[data-theme=plum] #invitation .moment{margin:0;padding:22px 0;border:0;border-bottom:1px solid var(--pp-rule);text-align:center}
body[data-theme=plum] #invitation .moment:last-child{border-bottom:0}
body[data-theme=plum] #invitation .moment:before{content:none}
body[data-theme=plum] #invitation :is(.moment,.form-box,.upload-panel,.counter) p:empty{display:none}
body[data-theme=plum] #invitation .date-under{color:var(--base-text)}
body[data-theme=plum] #invitation .guest-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
body[data-theme=plum] #invitation .guest-actions .button{max-width:100%;padding:13px 16px;letter-spacing:1px}
body[data-theme=plum] #invitation .contacts{display:flex;flex-direction:column;gap:18px;margin-top:22px}
body[data-theme=plum] #invitation footer.dark{position:relative;background:var(--paper);color:var(--base-text);padding:45px 28px;border:0;--ui-surface:var(--base-surface);--ui-text:var(--base-text);--ui-muted:var(--base-muted);--ui-heading:var(--base-heading);--ui-link:var(--base-link);--ui-primary:var(--base-primary);--ui-on-primary:var(--base-on-primary)}
body[data-theme=plum] #invitation footer .script{font:400 32px/1.3 'Cormorant Garamond',Georgia,serif;color:var(--base-heading);overflow-wrap:anywhere}
body[data-theme=plum][dir=rtl] #invitation :is(.pp-hero-copy,.pp-frame-copy){font-family:'Noto Nastaliq Urdu',serif;line-height:2.2;letter-spacing:0}
body[data-theme=plum][dir=rtl] #invitation :is(.pp-names,.section h2,.pp-event h3,.pp-venue-details h3){font-family:'Noto Nastaliq Urdu',serif;font-size:30px;line-height:2}
body[data-theme=plum][dir=rtl] #invitation :is(.pp-family,.pp-welcome,.pp-date,.small,.pp-explore,.pp-event-details,.pp-venue-address,.pp-venue-subtitle,.pp-directions,.pp-event-actions a,.pp-event-actions button,.pp-event .event-date){font-family:'Noto Nastaliq Urdu',serif;line-height:2.2;letter-spacing:0}
body[data-theme=plum][dir=rtl] #invitation .pp-event-details dt{padding-top:10px}
body[data-theme=plum][dir=rtl] #invitation .pp-venue-address svg{margin-top:10px}
@container(max-width:359px){body[data-theme=plum] #invitation .pp-names{font-size:54px}body[data-theme=plum] #invitation :is(.pp-hero,.pp-section){padding-inline:22px}body[data-theme=plum] #invitation .pp-event{padding:18px}body[data-theme=plum] #invitation .pp-flower{width:125px}body[data-theme=plum] #invitation .section h2{font-size:31px}body[data-theme=plum] #invitation .pp-event-actions :is(a,button){flex-basis:100px}}

.op-plum[lang=ur] :is(.pp-enter,.pp-skip,.pp-reveal-copy){font-family:'Noto Nastaliq Urdu',serif;line-height:2.2;letter-spacing:0}
.op-plum[lang=ur] .pp-reveal-copy strong{font-family:'Noto Nastaliq Urdu',serif;font-size:28px;line-height:2}
@media(max-width:359px){.opening-overlay.op-plum{padding-inline:30px}.pp-stage{gap:24px}.pp-reveal-copy strong{font-size:30px}}
@media(max-height:700px){.op-plum .pp-stage{width:min(100%,calc((100dvh - 165px) * 2 / 3));gap:22px}.pp-enter{font-size:15px;padding:10px 18px;white-space:nowrap}.pp-seal{width:68px}.pp-reveal-copy strong{font-size:30px}.pp-reveal-copy p{font-size:9px}}
@media(min-width:768px){.op-plum .pp-stage{width:min(100%,calc((min(900px,100dvh) - 180px) * 2 / 3))}}
@media(max-height:450px){.op-plum .pp-stage{width:calc((100dvh - 120px) * 2 / 3);gap:10px}.pp-seal{width:50px;padding:9px}.pp-seal span{font-size:17px}.pp-enter{font-size:12px;min-height:34px;padding:6px 16px}.pp-reveal-copy strong{font-size:18px}.pp-reveal-copy p{font-size:7px}.pp-reveal-copy .pp-divider{margin:8px auto}}
@media(prefers-reduced-motion:reduce){.op-plum *{animation:none!important;transition:none!important}}
/* Accessible icon labels must not participate in the detail-row layout. */
body[data-theme=plum] #invitation .pp-event-details .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}
body[data-theme=plum] #invitation .pp-event-actions :is(a,button){margin:0;align-self:stretch;box-sizing:border-box}
/* The welcome follows the approved scalloped arch reference. Its artwork
   keeps its natural ratio; extra client copy continues on the same ivory. */
body[data-theme=plum] #invitation .topbar{position:absolute;inset:0 0 auto;z-index:4;height:54px;justify-content:flex-end;background:transparent}
body[data-theme=plum] #invitation .topbar>.monogram{display:none}
body[data-theme=plum] #invitation .pp-hero{padding:110px 54px 78px;min-height:150cqw;border:0}
body[data-theme=plum] #invitation .pp-welcome-art{position:absolute;inset:0;z-index:-1;pointer-events:none;background:url('/themes/plum-pearl/welcome.webp') center top/100% auto no-repeat}
body[data-theme=plum] #invitation .pp-family{margin:0 auto 28px;font-size:10px;letter-spacing:2px;max-width:190px}
body[data-theme=plum] #invitation .pp-names{margin:30px 0;font-size:64px;line-height:1}
body[data-theme=plum] #invitation .pp-welcome{font:10px/1.9 Georgia,serif;letter-spacing:1.5px;text-transform:uppercase;max-width:265px;margin:26px auto}
body[data-theme=plum] #invitation .pp-weekday{display:block;font:10px/1.8 Georgia,serif;letter-spacing:2px;text-transform:uppercase;margin-bottom:6px}
body[data-theme=plum] #invitation .pp-date{font-size:27px;margin:24px auto 28px;letter-spacing:0}
body[data-theme=plum][dir=rtl] #invitation :is(.pp-welcome,.pp-family,.pp-weekday){font-family:'Noto Nastaliq Urdu',serif;line-height:2.3;letter-spacing:0}
body[data-theme=plum][dir=rtl] #invitation .pp-names{font-size:32px;line-height:2}
@container(max-width:359px){body[data-theme=plum] #invitation .pp-hero{padding:90px 42px 65px}body[data-theme=plum] #invitation .pp-names{font-size:50px}body[data-theme=plum] #invitation .pp-welcome{font-size:9px;letter-spacing:1px}}
body[data-theme=plum] #invitation .pp-welcome-art{-webkit-mask-image:linear-gradient(#000 0,#000 calc(150cqw - 65px),transparent 150cqw);mask-image:linear-gradient(#000 0,#000 calc(150cqw - 65px),transparent 150cqw)}

/* Consistent contrast on the pearl paper, including the legacy dark footer. */
body[data-theme=plum] #invitation footer.dark{--ui-surface:var(--base-surface);--ui-text:var(--base-text);--ui-muted:var(--base-muted);--ui-heading:var(--base-heading);--ui-link:var(--base-link);--ui-primary:var(--base-primary);--ui-on-primary:var(--base-on-primary);--ui-hover:var(--base-hover);--ui-on-hover:var(--base-on-hover);--ui-field:var(--base-field);--ui-field-text:var(--base-field-text);--ui-placeholder:var(--base-placeholder);--ui-border:var(--base-border);--ui-field-border:var(--base-field-border);--ui-focus:var(--base-focus);--ui-error:var(--base-error);--ui-success:var(--base-success);}
body[data-theme=plum] #invitation footer p{color:var(--base-text)}
body[data-theme=plum] #invitation footer :is(.company-kicker,.company-follow){color:var(--base-muted)}
body[data-theme=plum] #invitation footer .invitation-company{border-top:0}
body[data-theme=plum] #invitation .pp-section{border-top:0;border-bottom:0}
body[data-theme=plum] #invitation .pp-event-heading{display:grid;grid-template-columns:minmax(0,1fr) 88px;gap:12px;align-items:center;margin-bottom:14px}
body[data-theme=plum] #invitation .pp-event-heading>div{min-width:0}
body[data-theme=plum] #invitation .pp-event-graphic{display:block;width:88px;height:auto;aspect-ratio:1;object-fit:contain;transform:scaleX(-1);pointer-events:none}
body[data-theme=plum][dir=rtl] #invitation .pp-event-graphic{transform:none}
body[data-theme=plum] #invitation :is(.pp-family,.pp-welcome,.pp-weekday){font-size:11px}
@container(max-width:359px){body[data-theme=plum] #invitation .pp-event-heading{grid-template-columns:minmax(0,1fr) 64px;gap:8px}body[data-theme=plum] #invitation .pp-event-graphic{width:64px}body[data-theme=plum] #invitation .pp-event h3{font-size:28px}}
