/* Dastaan: original illustrated couple, garden reveal and separate inner theme. */
.opening-overlay.op-dastaan{display:block;background:#FBF5E9;color:#303D32;padding:0;isolation:isolate;overflow:hidden}
.ds-scene{position:absolute;inset:0;transition:transform 2.6s cubic-bezier(.2,.5,.2,1)}
.ds-scene img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.ds-foliage{position:absolute;inset:0;pointer-events:none;background:url('/themes/dastaan/opening.webp') center/cover no-repeat;z-index:2;transition:transform 2s cubic-bezier(.2,.6,.2,1),opacity 1.8s}
.ds-foliage-left{-webkit-mask-image:linear-gradient(90deg,#000,transparent 29%);mask-image:linear-gradient(90deg,#000,transparent 29%);transform-origin:left center}
.ds-foliage-right{-webkit-mask-image:linear-gradient(270deg,#000,transparent 29%);mask-image:linear-gradient(270deg,#000,transparent 29%);transform-origin:right center}
.ds-opening-copy{position:absolute;top:13%;left:28px;right:28px;text-align:center;z-index:3;color:#303D32;text-shadow:0 1px 8px #FBF5E9;transition:opacity .4s}
.ds-opening-copy h2{font:400 clamp(30px,8vw,42px)/1.15 'Cormorant Garamond',Georgia,serif;margin:0;color:#243126;overflow-wrap:anywhere}
.ds-opening-copy em{font-style:normal;color:#755B2E}
.ds-opening-copy p{font:13px/1.6 Georgia,serif;letter-spacing:1.3px;margin:12px 0}
.ds-opening-copy .ds-opening-guest{font-size:12px;letter-spacing:0}
.ds-enter{position:absolute;bottom:5%;left:50%;transform:translateX(-50%);z-index:5;display:flex;align-items:center;justify-content:center;gap:22px;width:72%;min-height:48px;padding:12px 18px;border:1px solid #B99A60;border-radius:10px;background:#FBF5E9f5;color:#303D32;font:18px/1.4 'Cormorant Garamond',Georgia,serif;box-shadow:0 4px 16px #39443420}
.ds-skip{position:absolute;z-index:6;top:12px;right:12px;padding:8px 12px;min-height:36px;border:1px solid #B99A6099;border-radius:22px;background:#FBF5E9e8;color:#303D32;font:11px/1.5 Georgia,serif}
.ds-couple-trigger{position:absolute;left:20%;right:15%;top:40%;bottom:15%;border:0;background:transparent;z-index:4;border-radius:50%}
.op-dastaan button:focus-visible{outline:3px solid #303D32;outline-offset:4px}
.op-dastaan.is-opening .ds-foliage-left{transform:translateX(-40%) scale(1.12);opacity:0}
.op-dastaan.is-opening .ds-foliage-right{transform:translateX(40%) scale(1.12);opacity:0}
.op-dastaan.is-opening .ds-scene{transform:scale(1.13)}
.op-dastaan.is-opening :is(.ds-enter,.ds-couple-trigger,.ds-opening-copy){visibility:hidden;opacity:0;pointer-events:none}
.op-dastaan[lang=ur] :is(.ds-opening-copy,.ds-enter,.ds-skip){font-family:'Noto Nastaliq Urdu',serif;line-height:2;letter-spacing:0}
.op-dastaan[lang=ur] .ds-opening-copy h2{font-family:'Noto Nastaliq Urdu',serif;font-size:30px;line-height:2}
@media(max-height:540px){.ds-opening-copy{top:12%}.ds-opening-copy h2{font-size:26px}.ds-opening-copy p{font-size:10px;margin:6px}.ds-enter{min-height:36px;padding:6px 14px;font-size:15px}}
@media(prefers-reduced-motion:reduce){.op-dastaan *{transition:none!important;animation:none!important}}
/* Inner stationery uses separate, proportionate corners, never a stretched frame. */
body[data-theme=dastaan] #invitation{--ds-rule:#B99A6080;background:var(--paper,#FBF5E9);color:var(--base-text,#303D32);container-type:inline-size}
body[data-theme=dastaan] #invitation .topbar{height:56px;padding:0 28px;background:var(--paper);border:0;color:var(--base-text)}
body[data-theme=dastaan] #invitation .topbar :is(a,button,.monogram){color:var(--base-text)}
body[data-theme=dastaan] #invitation .topbar button{border:0;background:transparent;padding:8px}
body[data-theme=dastaan] #invitation :is(.ds-hero,.ds-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=dastaan] #invitation :is(.ds-hero,.ds-section):before,body[data-theme=dastaan] #invitation :is(.ds-hero,.ds-section):after{content:none}
.ds-flower{position:absolute;display:block;width:140px;aspect-ratio:1;pointer-events:none;z-index:-1;background:url('/themes/dastaan/corner.webp') center/contain no-repeat}
.ds-flower-tl{top:0;left:0}.ds-flower-tr{top:0;right:0;transform:scaleX(-1)}
.ds-flower-br{bottom:0;right:0;transform:rotate(180deg)}.ds-flower-bl{bottom:0;left:0;transform:scaleY(-1)}
body[data-theme=dastaan] #invitation .ds-hero .ds-flower{width:145px}
body[data-theme=dastaan] #invitation .ds-hero-copy{padding:0;position:relative;min-width:0}
body[data-theme=dastaan] #invitation .ds-inner-monogram{font:400 24px/1.4 'Cormorant Garamond',Georgia,serif;letter-spacing:4px;margin:0 auto;color:var(--base-text)}
.ds-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=dastaan] #invitation .ds-names{font:400 66px/1.05 'Cormorant Garamond',Georgia,serif;color:var(--base-heading);margin:35px 0 30px;overflow-wrap:anywhere}
body[data-theme=dastaan] #invitation .ds-names span{display:block;font:inherit;color:inherit;line-height:inherit}
body[data-theme=dastaan] #invitation .ds-names em{display:block;font:italic 43px/1.1 Georgia,serif;color:#A88A57;margin:3px auto}
.ds-welcome{font:400 20px/1.6 'Cormorant Garamond',Georgia,serif;margin:0 auto 22px;max-width:310px;overflow-wrap:anywhere}
.ds-date{font:400 26px/1.4 'Cormorant Garamond',Georgia,serif;letter-spacing:1px;margin:22px auto 28px;color:var(--base-text)}
.ds-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}
.ds-divider:before,.ds-divider:after{content:'';flex:1;height:1px;background:linear-gradient(90deg,transparent,#B99A60)}
.ds-divider:after{transform:rotate(180deg)}
body[data-theme=dastaan] #invitation :is(.ds-frame-copy,.ds-hero-copy)>.ds-divider{width:120px;max-width:45%;margin:24px auto}
body[data-theme=dastaan] #invitation .ds-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)}
.ds-guest{font:14px/1.7 'Cormorant Garamond',Georgia,serif;margin:20px 0}.ds-guest strong{display:block;font-size:17px;font-weight:400}
.ds-portrait{width:120px;height:150px;object-fit:cover;border-radius:70px 70px 4px 4px;border:1px solid #B99A60;margin:20px auto 0}
body[data-theme=dastaan] #invitation .ds-frame-copy{position:relative;max-width:100%;min-width:0}
body[data-theme=dastaan] #invitation .ds-section>.ds-divider{width:120px;margin:28px auto 0}
body[data-theme=dastaan] #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=dastaan] #invitation .section h3{color:var(--base-heading);overflow-wrap:anywhere}
body[data-theme=dastaan] #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=dastaan] #invitation .section p{color:var(--base-text);line-height:1.65}
body[data-theme=dastaan] #invitation .quote{font-size:25px;line-height:1.6;margin:0}
body[data-theme=dastaan] #invitation .ds-events{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;margin:28px 0 0}
body[data-theme=dastaan] #invitation .ds-events .ds-event,body[data-theme=dastaan] #invitation .ds-events .ds-event:last-child,body[data-theme=dastaan] #invitation .ds-events .ds-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=dastaan] #invitation .ds-event h3{font:400 30px/1.2 'Cormorant Garamond',Georgia,serif;margin:0 0 10px;color:var(--base-heading)}
body[data-theme=dastaan] #invitation .ds-event .event-date{font:18px/1.5 'Cormorant Garamond',Georgia,serif;color:var(--base-text);margin:0}
.ds-event-details{margin:18px 0;text-align:start;font:17px/1.5 'Cormorant Garamond',Georgia,serif}
.ds-event-details>div{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;margin:11px 0;align-items:start}
.ds-event-details dt{display:flex;align-items:center;justify-content:center;padding-top:2px}
.ds-event-details svg,.ds-venue-address svg{display:block;flex:none;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.4}
.ds-event-details dd{margin:0;overflow-wrap:anywhere}.ds-event-details strong{font-weight:400}.ds-event-details dd span{display:block;font-size:15px;margin-top:3px}
.ds-event-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px;justify-content:flex-start}
body[data-theme=dastaan] #invitation .ds-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=dastaan] #invitation .ds-event-actions a{border-color:var(--base-text)}
body[data-theme=dastaan] #invitation #venue h2{margin-bottom:8px}
body[data-theme=dastaan] #invitation .ds-venue-subtitle{font:18px/1.6 'Cormorant Garamond',Georgia,serif;margin:0 auto 15px}
body[data-theme=dastaan] #invitation .ds-venue{width:100%;margin:24px auto 22px;max-width:100%}
body[data-theme=dastaan] #invitation .ds-venue img{display:block;width:100%;height:auto;aspect-ratio:4/3;max-height:250px;object-fit:cover;border:1px solid #B99A60;border-radius:8px}
.ds-venue-list{max-width:100%}.ds-venue-details+.ds-venue-details{border-top:1px solid var(--ds-rule);margin-top:25px;padding-top:25px}
body[data-theme=dastaan] #invitation .ds-venue-details h3{font:400 29px/1.3 'Cormorant Garamond',Georgia,serif;margin:0 0 10px}
body[data-theme=dastaan] #invitation .ds-venue-event{font:11px/1.8 Georgia,serif;letter-spacing:1px;margin:0 auto 8px}
body[data-theme=dastaan] #invitation .ds-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}
.ds-venue-address span{min-width:0}.ds-venue-address svg{margin-top:3px}
body[data-theme=dastaan] #invitation .ds-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=dastaan] #invitation .ds-venue-pending{font:18px/1.6 'Cormorant Garamond',Georgia,serif;margin:16px 0 0}
body[data-theme=dastaan] #invitation .counter{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:28px}
body[data-theme=dastaan] #invitation .counter>div{min-width:0;padding:16px 2px;background:transparent;border:1px solid #B99A60;border-radius:6px}
body[data-theme=dastaan] #invitation .counter strong{font-size:30px;color:var(--base-text)}
body[data-theme=dastaan] #invitation .counter span{font-size:8px;letter-spacing:.5px;color:var(--base-muted)}
body[data-theme=dastaan] #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=dastaan] #invitation :is(.form-box,.upload-panel){padding:20px 16px;border:1px solid var(--ds-rule);border-radius:8px}
body[data-theme=dastaan] #invitation :is(input,select,textarea){max-width:100%;box-sizing:border-box}
body[data-theme=dastaan] #invitation .timeline{margin:28px 0 0;max-width:100%}
body[data-theme=dastaan] #invitation .moment{margin:0;padding:22px 0;border:0;border-bottom:1px solid var(--ds-rule);text-align:center}
body[data-theme=dastaan] #invitation .moment:last-child{border-bottom:0}
body[data-theme=dastaan] #invitation .moment:before{content:none}
body[data-theme=dastaan] #invitation :is(.moment,.form-box,.upload-panel,.counter) p:empty{display:none}
body[data-theme=dastaan] #invitation .date-under{color:var(--base-text)}
body[data-theme=dastaan] #invitation .guest-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
body[data-theme=dastaan] #invitation .guest-actions .button{max-width:100%;padding:13px 16px;letter-spacing:1px}
body[data-theme=dastaan] #invitation .contacts{display:flex;flex-direction:column;gap:18px;margin-top:22px}
body[data-theme=dastaan] #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=dastaan] #invitation footer .script{font:400 32px/1.3 'Cormorant Garamond',Georgia,serif;color:var(--base-heading);overflow-wrap:anywhere}
body[data-theme=dastaan][dir=rtl] #invitation :is(.ds-hero-copy,.ds-frame-copy){font-family:'Noto Nastaliq Urdu',serif;line-height:2.2;letter-spacing:0}
body[data-theme=dastaan][dir=rtl] #invitation :is(.ds-names,.section h2,.ds-event h3,.ds-venue-details h3){font-family:'Noto Nastaliq Urdu',serif;font-size:30px;line-height:2}
body[data-theme=dastaan][dir=rtl] #invitation :is(.ds-family,.ds-welcome,.ds-date,.small,.ds-explore,.ds-event-details,.ds-venue-address,.ds-venue-subtitle,.ds-directions,.ds-event-actions a,.ds-event-actions button,.ds-event .event-date){font-family:'Noto Nastaliq Urdu',serif;line-height:2.2;letter-spacing:0}
body[data-theme=dastaan][dir=rtl] #invitation .ds-event-details dt{padding-top:10px}
body[data-theme=dastaan][dir=rtl] #invitation .ds-venue-address svg{margin-top:10px}
@container(max-width:359px){body[data-theme=dastaan] #invitation .ds-names{font-size:54px}body[data-theme=dastaan] #invitation :is(.ds-hero,.ds-section){padding-inline:22px}body[data-theme=dastaan] #invitation .ds-event{padding:18px}body[data-theme=dastaan] #invitation .ds-flower{width:125px}body[data-theme=dastaan] #invitation .section h2{font-size:31px}body[data-theme=dastaan] #invitation .ds-event-actions :is(a,button){flex-basis:100px}}

body[data-theme=dastaan] #invitation .topbar{background:var(--paper);height:54px;border:0;padding:8px 24px}
body[data-theme=dastaan] #invitation .ds-hero{padding:54px 28px 45px;border:0;overflow:hidden}
.ds-hero-top-art{position:absolute;top:0;left:0;width:155px;aspect-ratio:1;background:url('/themes/dastaan/corner.webp') left top/contain no-repeat;z-index:-1;opacity:.8}
body[data-theme=dastaan] #invitation .ds-hero-copy{position:relative;padding:0;z-index:1}
body[data-theme=dastaan] #invitation .ds-family{font-size:10px;letter-spacing:2px;margin:15px auto 24px;max-width:240px}
body[data-theme=dastaan] #invitation .ds-names{font-size:62px;line-height:1;margin:25px 0}
body[data-theme=dastaan] #invitation .ds-names em{color:#92733F}
body[data-theme=dastaan] #invitation .ds-welcome{font:20px/1.6 'Cormorant Garamond',Georgia,serif;max-width:310px;margin:20px auto 10px}
body[data-theme=dastaan] #invitation .ds-date{font-size:22px;letter-spacing:0;margin:12px auto 0}
.ds-couple-vignette{position:relative;margin:15px -28px 8px;aspect-ratio:1.05;overflow:hidden;-webkit-mask-image:linear-gradient(transparent,#000 12%,#000 91%,transparent);mask-image:linear-gradient(transparent,#000 12%,#000 91%,transparent)}
.ds-couple-vignette img{display:block;width:100%;height:100%;object-fit:cover;object-position:center bottom}
body[data-theme=dastaan] #invitation .ds-explore{border-radius:8px;font-size:16px;min-height:44px;padding:12px 24px}
body[data-theme=dastaan] #invitation .ds-event-heading{display:grid;grid-template-columns:minmax(0,1fr) 112px;gap:12px;align-items:start;margin-bottom:15px}
.ds-event-heading>div{min-width:0}
.ds-event-graphic{display:block;width:112px;height:auto;aspect-ratio:1;object-fit:cover;border-radius:5px;-webkit-mask-image:radial-gradient(ellipse,#000 45%,transparent 73%);mask-image:radial-gradient(ellipse,#000 45%,transparent 73%)}
body[data-theme=dastaan] #invitation .ds-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=dastaan] #invitation .ds-event-actions :is(a,button){margin:0;align-self:stretch;box-sizing:border-box}
body[data-theme=dastaan] #invitation footer p{color:var(--base-text)}
body[data-theme=dastaan] #invitation footer :is(.company-kicker,.company-follow){color:var(--base-muted)}
body[data-theme=dastaan] #invitation footer .invitation-company{border:0}
body[data-theme=dastaan][dir=rtl] #invitation .ds-names{font-size:32px;line-height:2}
@container(max-width:359px){body[data-theme=dastaan] #invitation .ds-names{font-size:48px}body[data-theme=dastaan] #invitation .ds-event-heading{grid-template-columns:minmax(0,1fr) 82px;gap:8px}body[data-theme=dastaan] #invitation .ds-event-graphic{width:82px}.ds-couple-vignette{margin-inline:-22px}}
body[data-theme=dastaan] #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);}
/* Reuse the actual illustrated canopy without stretching or placing art behind names. */
body[data-theme=dastaan] #invitation .ds-hero-top-art{inset:0 0 auto;width:100%;height:260px;background:url('/themes/dastaan/welcome.webp') center top/100% auto no-repeat;opacity:1;-webkit-mask-image:linear-gradient(#000,transparent 92%);mask-image:linear-gradient(#000,transparent 92%)}

/* Keep the portrait and celebration link in a centered, vertical mobile-first flow. */
body[data-theme=dastaan] #invitation .ds-hero{
  padding-bottom:32px;
}
body[data-theme=dastaan] #invitation .ds-hero .ds-portrait{
  display:block;
  box-sizing:border-box;
  max-width:calc(100% - 32px);
  margin:20px auto 0;
}
body[data-theme=dastaan] #invitation .ds-hero .ds-explore{
  display:flex;
  box-sizing:border-box;
  width:max-content;
  max-width:100%;
  margin:20px auto 0;
  padding-inline:20px;
  text-align:center;
  white-space:normal;
}

/* Dastaan hero actions stay stacked even when optional portrait is present. */
body[data-theme=dastaan] #invitation .ds-hero .ds-hero-actions{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;width:100%;max-width:100%;margin:20px auto 0;min-width:0}
body[data-theme=dastaan] #invitation .ds-hero .ds-hero-actions .ds-portrait{display:block;flex:none;margin:0 auto;width:120px;height:150px;max-width:100%;object-fit:cover}
body[data-theme=dastaan] #invitation .ds-hero .ds-hero-actions .ds-explore{display:inline-flex;flex:none;align-items:center;justify-content:center;width:auto;max-width:100%;margin:0 auto;white-space:normal;text-align:center;min-height:44px}