/* Mughal Heritage: one mobile invitation on phones and desktop previews. */
.opening-overlay.op-mughal{display:grid;place-items:center;isolation:isolate;overflow:hidden;padding:0;background:#d6bd93;color:#173E32;perspective:1400px}
.mh-opening-board{position:relative;flex:none;width:max(100%,calc(100dvh * 2 / 3));aspect-ratio:2/3;direction:ltr;isolation:isolate;overflow:hidden;transition:transform 2.7s cubic-bezier(.2,.6,.2,1)}
.mh-facade,.mh-door{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none}
.mh-facade{z-index:3;mask:url('/themes/mughal-heritage/facade-mask.svg') center/100% 100% no-repeat;-webkit-mask:url('/themes/mughal-heritage/facade-mask.svg') center/100% 100% no-repeat}
.mh-garden-reveal{position:absolute;inset:32% 14% 8%;background:url('/themes/mughal-heritage/garden.webp') center/cover no-repeat;transition:transform 2.7s ease;z-index:0}
.mh-door{z-index:2;background:url('/themes/mughal-heritage/gateway.webp') center/100% 100% no-repeat;mask:url('/themes/mughal-heritage/door-mask.svg') center/100% 100% no-repeat;-webkit-mask:url('/themes/mughal-heritage/door-mask.svg') center/100% 100% no-repeat;backface-visibility:hidden;transition:transform 2.2s .2s cubic-bezier(.2,.6,.2,1),opacity 1.8s .5s}
.mh-door-left{clip-path:inset(0 50% 0 0);transform-origin:25% 60%}.mh-door-right{clip-path:inset(0 0 0 50%);transform-origin:75% 60%}
.mh-opening-copy{position:absolute;z-index:4;top:17%;left:25%;right:25%;text-align:center;color:#173E32;transition:opacity .35s}
.mh-opening-copy h2{font:400 40px/1.08 'Cormorant Garamond',Georgia,serif;margin:0;overflow-wrap:anywhere;color:#173E32}
.mh-opening-copy h2 span{display:block}.mh-opening-copy em{display:block;font:italic 28px/1.15 Georgia,serif;margin:3px}
.mh-seal{position:absolute;z-index:5;left:50%;top:63%;transform:translateX(-50%);width:70px;height:70px;border:3px double #74552a;border-radius:50%;padding:6px;background:radial-gradient(circle at 30% 25%,#efd69a,#c09b52);color:#403117;box-shadow:0 3px 12px #3a250b55;transition:opacity .3s,visibility .3s}
.mh-seal span{display:flex;align-items:center;justify-content:center;gap:5px;font:italic 22px/1 Georgia,serif}.mh-seal i{font-size:14px}
.mh-enter{position:absolute;z-index:5;bottom:5%;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;gap:18px;width:62%;max-width:310px;min-height:48px;padding:10px 18px;border:2px solid #b58c45;border-radius:28px;background:#fcf6e9;color:#173E32;box-shadow:0 3px 12px #40301133;font:18px/1.4 'Cormorant Garamond',Georgia,serif}
.mh-skip{position:absolute;z-index:6;top:10px;right:10px;min-height:36px;padding:7px 11px;border:1px solid #ac8545;border-radius:20px;background:#fcf6e9ed;color:#173E32;font:11px/1.5 Arial,sans-serif}
.op-mughal.is-opening .mh-door-left{transform:perspective(1200px) rotateY(-105deg);opacity:0}.op-mughal.is-opening .mh-door-right{transform:perspective(1200px) rotateY(105deg);opacity:0}
.op-mughal.is-opening .mh-garden-reveal{transform:scale(1.16)}.op-mughal.is-opening .mh-opening-board{transform:scale(1.08)}
.op-mughal.is-opening :is(.mh-enter,.mh-seal,.mh-opening-copy){visibility:hidden;opacity:0;pointer-events:none}
.op-mughal.is-opening :is(#openInvite,#openMonogram){display:none!important}
.op-mughal[lang=ur] :is(.mh-enter,.mh-skip,.mh-opening-copy h2){font-family:'Noto Nastaliq Urdu',serif;letter-spacing:0;line-height:1.9}.op-mughal[lang=ur] .mh-opening-copy h2{font-size:28px}
.op-mughal button:focus-visible{outline:3px solid #173E32;outline-offset:4px}
@media(min-width:768px){.op-mughal .mh-opening-board{width:max(100%,calc(min(900px,100dvh) * 2 / 3))}}
@media(max-height:540px){.mh-opening-copy h2{font-size:30px}.mh-opening-copy em{font-size:20px}.mh-seal{width:52px;height:52px}.mh-seal span{font-size:17px}.mh-enter{font-size:15px;min-height:40px;padding:6px 12px}}
@media(prefers-reduced-motion:reduce){.op-mughal *{animation:none!important;transition:none!important}}
/* The blank centre grows with content; garden and arch keep their proportions. */
body[data-theme=mughal] #invitation{--mh-rule:#ac854580;background:var(--paper);color:var(--base-text)}
body[data-theme=mughal] #invitation .topbar{background:var(--paper);color:var(--base-text);border:0;padding:12px 20px}
body[data-theme=mughal] #invitation :is(.mh-hero,.mh-section){position:relative;isolation:isolate;box-sizing:border-box;width:100%;max-width:100%;margin:0;padding:0;min-height:0;border-radius:0;outline:0;box-shadow:none;text-align:center;overflow:hidden;background:var(--paper);color:var(--base-text)}
body[data-theme=mughal] #invitation :is(.mh-hero,.mh-section):before,body[data-theme=mughal] #invitation :is(.mh-hero,.mh-section):after{content:none}
body[data-theme=mughal] #invitation .mh-hero{border-style:solid;border-color:transparent;border-width:calc(100cqw * .332) calc(100cqw * .0684) calc(100cqw * .762);border-image:url('/themes/mughal-heritage/stationery.webp') 340 70 780 70 fill / 1 / 0 stretch repeat}
.mh-hero-copy{padding:10px 10px 12px;min-width:0}.mh-family{font:14px/1.65 'Cormorant Garamond',Georgia,serif;margin:0 auto 18px;max-width:270px}
.mh-guest{font:14px/1.7 'Cormorant Garamond',Georgia,serif;margin:16px auto}.mh-guest strong{display:block;font-size:17px;font-weight:500;overflow-wrap:anywhere}
body[data-theme=mughal] #invitation .mh-names{font:400 clamp(38px,12cqw,56px)/1.05 'Cormorant Garamond',Georgia,serif;letter-spacing:0;margin:26px auto;max-width:100%;color:var(--base-heading);overflow-wrap:anywhere}
body[data-theme=mughal] #invitation .mh-names span{display:block;font:inherit;color:inherit;line-height:inherit}.mh-names em{display:block;font:italic 34px/1.2 Georgia,serif;margin:2px}
.mh-welcome{font:20px/1.55 'Cormorant Garamond',Georgia,serif;margin:20px auto;max-width:290px}.mh-date{font:22px/1.5 'Cormorant Garamond',Georgia,serif;margin:18px auto}
.mh-portrait{display:block;max-width:100%;width:210px;aspect-ratio:4/5;height:auto;object-fit:cover;margin:22px auto;border:1px solid #ac8545;padding:3px;border-radius:110px 110px 3px 3px}
.mh-divider{display:flex;align-items:center;justify-content:center;gap:12px;width:130px;max-width:60%;margin:24px auto;color:#9b763d;font:16px/1 Georgia,serif}.mh-divider:before,.mh-divider:after{content:'';height:1px;flex:1;background:linear-gradient(90deg,transparent,#ac8545)}.mh-divider:after{transform:rotate(180deg)}
body[data-theme=mughal] #invitation .mh-explore{display:inline-flex;align-items:center;justify-content:center;min-height:44px;max-width:100%;padding:10px 18px;border:1px solid #ac8545;border-radius:24px;font:15px/1.5 'Cormorant Garamond',Georgia,serif;color:var(--base-link);text-decoration:none}
body[data-theme=mughal] #invitation .mh-section{margin:20px 0;border:1px solid #ac854550;border-bottom:1px solid #ac8545;padding-bottom:30px}
.mh-cap{position:relative;width:100%;aspect-ratio:1024/340;background:url('/themes/mughal-heritage/stationery.webp') center top/100% auto no-repeat;mask-image:linear-gradient(#000 82%,transparent);-webkit-mask-image:linear-gradient(#000 82%,transparent);pointer-events:none}
body[data-theme=mughal] #invitation .mh-frame-copy{position:relative;padding:10px clamp(36px,11cqw,48px) 8px;min-width:0}
body[data-theme=mughal] #invitation .mh-section:before,body[data-theme=mughal] #invitation .mh-section:after{content:'';position:absolute;z-index:-1;top:0;bottom:0;width:calc(100cqw * .065);background:url('/themes/mughal-heritage/stationery.webp') left top/100cqw auto repeat-y;pointer-events:none}
body[data-theme=mughal] #invitation .mh-section:before{left:0}body[data-theme=mughal] #invitation .mh-section:after{right:0;transform:scaleX(-1)}
body[data-theme=mughal] #invitation .section h2{font:400 clamp(28px,8cqw,36px)/1.2 'Cormorant Garamond',Georgia,serif;margin:4px 0 24px;letter-spacing:0;color:var(--base-heading);overflow-wrap:anywhere}
body[data-theme=mughal] #invitation .section :is(p,.quote){color:var(--base-text);overflow-wrap:anywhere}.mh-section .small{font:10px/1.7 Georgia,serif;letter-spacing:1.2px}
body[data-theme=mughal] #invitation .mh-events{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;width:100%;margin:22px 0}
body[data-theme=mughal] #invitation .mh-event{box-sizing:border-box;width:100%;max-width:100%;margin:0;padding:18px;border:1px solid #ac8545;border-radius:12px;outline:0;background:transparent;color:var(--base-text);text-align:start}
.mh-event-heading{display:grid;grid-template-columns:minmax(0,1fr) 92px;gap:10px;align-items:center}.mh-event-heading>div{min-width:0}
body[data-theme=mughal] #invitation .mh-event h3{font:400 31px/1.2 'Cormorant Garamond',Georgia,serif;margin:0 0 12px;color:var(--base-heading);overflow-wrap:anywhere}
body[data-theme=mughal] #invitation .mh-event .event-date{font:17px/1.5 'Cormorant Garamond',Georgia,serif;margin:0;color:var(--base-text)}
.mh-event-graphic{display:block;width:92px;height:112px;object-fit:cover;object-position:center;border-radius:80px 80px 3px 3px;mask-image:linear-gradient(#000 78%,transparent);-webkit-mask-image:linear-gradient(#000 78%,transparent)}
.mh-event-details{margin:16px 0 0;font:16px/1.5 'Cormorant Garamond',Georgia,serif}.mh-event-details>div{display:grid;grid-template-columns:19px minmax(0,1fr);gap:9px;margin:10px 0}.mh-event-details dt,.mh-event-details dd{margin:0;min-width:0}.mh-event-details dd span,.mh-event-details dd strong{display:block;font-weight:400;overflow-wrap:anywhere}
.mh-event-details svg,.mh-venue-address svg{width:19px;height:19px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5}.mh-event-details .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.mh-event-actions{display:flex;flex-direction:column;gap:8px;margin-top:12px}
body[data-theme=mughal] #invitation .mh-event-actions :is(a,button){display:flex;align-items:center;justify-content:flex-start;width:100%;max-width:100%;min-height:44px;margin:0;padding:8px 0;border:0;border-top:1px solid var(--mh-rule);border-radius:0;background:transparent;color:var(--base-link);font:15px/1.5 'Cormorant Garamond',Georgia,serif;text-transform:none;letter-spacing:0;white-space:normal;text-align:start;text-decoration:none;overflow-wrap:anywhere}
body[data-theme=mughal] #invitation .mh-venue{width:100%;margin:24px auto;max-width:100%}.mh-venue img{display:block;width:100%;height:auto;aspect-ratio:4/3;max-height:250px;object-fit:cover;border:1px solid #ac8545;border-radius:3px}
body[data-theme=mughal] #invitation .mh-venue-subtitle{font:18px/1.5 'Cormorant Garamond',Georgia,serif;margin:0 auto 14px}.mh-venue-details+.mh-venue-details{border-top:1px solid var(--mh-rule);margin-top:22px;padding-top:22px}
body[data-theme=mughal] #invitation .mh-venue-details h3{font:400 28px/1.3 'Cormorant Garamond',Georgia,serif;margin:0 0 12px;color:var(--base-heading)}
.mh-venue-address{display:flex;justify-content:center;align-items:flex-start;gap:8px;font:17px/1.5 'Cormorant Garamond',Georgia,serif}.mh-venue-address span{min-width:0}.mh-venue-event{font:12px/1.5 Georgia,serif}
body[data-theme=mughal] #invitation .mh-directions{display:inline-flex;align-items:center;justify-content:center;min-height:44px;max-width:100%;padding:11px 24px;border:1px solid #ac8545;border-radius:26px;background:var(--base-primary);color:var(--base-on-primary);font:16px/1.4 'Cormorant Garamond',Georgia,serif;text-decoration:none}
body[data-theme=mughal] #invitation .counter{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:24px}.mh-section .counter>div{min-width:0;padding:12px 1px;border:1px solid var(--mh-rule);border-radius:4px}
body[data-theme=mughal] #invitation .counter strong{font-size:28px;color:var(--base-text)}body[data-theme=mughal] #invitation .counter span{font:8px/1.5 Arial,sans-serif;letter-spacing:0;color:var(--base-muted)}
body[data-theme=mughal] #invitation :is(.form-box,.upload-panel,.message,.moment,.date-under,.scratch-wrap){min-width:0;max-width:100%;background:transparent;box-shadow:none}
body[data-theme=mughal] #invitation .timeline{margin:24px 0;max-width:100%}.mh-section .moment{border:0;padding:18px 0;text-align:center}.mh-section .moment:before{content:none}
body[data-theme=mughal] #invitation .guest-actions{display:flex;flex-direction:column;gap:10px}.mh-section .guest-actions>.button{width:100%}
body[data-theme=mughal] #invitation .contacts{display:flex;flex-direction:column;gap:16px}.mh-section :is(input,textarea,select){max-width:100%;min-width:0}
body[data-theme=mughal] #invitation footer.dark{box-sizing:border-box;width:100%;margin:0;padding:44px 26px;border:1px solid #ac854580;background:var(--paper);color:var(--base-text);--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-border:var(--base-border)}
body[data-theme=mughal] #invitation footer .script{font:italic 32px/1.4 'Cormorant Garamond',Georgia,serif;color:var(--base-heading);letter-spacing:0;overflow-wrap:anywhere}body[data-theme=mughal] #invitation footer p{color:var(--base-text)}
body[data-theme=mughal][dir=rtl] #invitation :is(.mh-names,.mh-family,.mh-guest,.mh-welcome,.mh-date,.mh-frame-copy,.section h2,.mh-event h3,.mh-event-details,.mh-event-actions a,.mh-event-actions button,.mh-venue-details h3,.mh-explore){font-family:'Noto Nastaliq Urdu',serif;line-height:2;letter-spacing:0}
body[data-theme=mughal][dir=rtl] #invitation .mh-names{font-size:30px}body[data-theme=mughal][dir=rtl] #invitation .mh-event h3{font-size:26px}
@container invitation (max-width:359px){.mh-hero-copy{padding-inline:6px}body[data-theme=mughal] #invitation .mh-frame-copy{padding-inline:36px}body[data-theme=mughal] #invitation .mh-event{padding:14px}.mh-event-heading{grid-template-columns:minmax(0,1fr) 65px}.mh-event-graphic{width:65px;height:90px}body[data-theme=mughal] #invitation .mh-event h3{font-size:27px}body[data-theme=mughal] #invitation .counter strong{font-size:23px}}

/* Names belong entirely inside the upper blank mehrab, never over the doorway.
   The gateway canvas stays mobile-proportioned in the Studio preview and invitations. */
.op-mughal .mh-opening-board{container-type:inline-size}
.op-mughal .mh-opening-copy{
 box-sizing:border-box;
 top:12.5%;
 height:24%;
 left:23%;
 right:23%;
 padding:0 3px;
 display:flex;
 flex-direction:column;
 align-items:center;
 justify-content:center;
 overflow:hidden;
}
.op-mughal .mh-opening-copy h2{
 display:flex;
 flex-direction:column;
 align-items:center;
 justify-content:center;
 box-sizing:border-box;
 width:100%;
 max-width:100%;
 max-height:100%;
 min-height:0;
 margin:0;
 font-family:'Cormorant Garamond',Georgia,serif;
 font-weight:400;
 font-size:clamp(15px,min(var(--mh-opening-name-size,32px),6cqw),32px);
 line-height:1.08;
 text-align:center;
 overflow-wrap:anywhere;
 word-break:normal;
 hyphens:none;
}
.op-mughal .mh-opening-copy h2 span{
 display:block;
 width:100%;
 max-width:100%;
 min-width:0;
 text-align:center;
 text-wrap:balance;
 overflow-wrap:anywhere;
 word-break:normal;
}
.op-mughal .mh-opening-copy em{
 display:block;
 flex:none;
 font-size:.66em;
 line-height:1;
 margin:2px 0;
}
.op-mughal[lang=ur] .mh-opening-copy{top:11%;height:27%}
.op-mughal[lang=ur] .mh-opening-copy h2{
 font-family:'Noto Nastaliq Urdu',serif;
 font-size:clamp(14px,min(var(--mh-opening-name-size,26px),5cqw),26px);
 line-height:1.55;
}
