/* V28: continuous, vertically scrollable invitation. All approved art/assets remain intact. */
html{scroll-behavior:smooth;scroll-padding-top:0;background:#A9CBE7}
body.invitation-flow{margin:0!important;height:auto!important;min-height:100vh!important;overflow-x:hidden!important;overflow-y:auto!important;display:block!important;align-items:initial!important;justify-content:initial!important;background:#A9CBE7 url('assets/opening-background.png') center top / min(100vw,390px) 100vh no-repeat fixed!important}
.invitation-section{position:relative;display:block;width:min(100%,390px);margin:0 auto;flex:none;scroll-margin-top:0}
.cover.invitation-section{width:min(100%,390px);height:844px;min-height:844px;border-radius:0;overflow:hidden}
.opening-page.invitation-section{width:min(100%,390px);min-height:640px;height:auto;overflow:hidden;margin:0 auto;padding-top:8px;padding-bottom:24px;background:transparent!important;background-attachment:scroll;box-shadow:none}
.opening-page.invitation-section::before{display:none!important}
.opening-page .opening-art{width:100%;max-width:390px}
.opening-page .countdown::before{width:100%;}
.opening-page .floral-left-reference{max-width:76vw}
/* Mempelai page is compact and directly follows the countdown, not a separate screen. */
.mempelai-page.invitation-section{isolation:isolate;width:min(100%,390px);height:690px;min-height:690px;margin:0 auto;overflow:hidden;display:block;background:linear-gradient(180deg,rgba(31,75,117,.12),rgba(38,82,124,.2)),url('assets/background.png') center/cover;background-attachment:scroll;box-shadow:none;color:#5e4634}
.mempelai-page .lace-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:0;pointer-events:none;user-select:none}
.mempelai-content{position:absolute;z-index:2;left:19.2%;width:61.6%;top:29%;height:40%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:4px 8px;color:#5e4634;overflow:hidden}
.mempelai-content p,.mempelai-content h1,.mempelai-content h2{flex:0 0 auto}
.mempelai-content .bismillah{font-family:'Amiri',serif;font-size:clamp(16px,4.4vw,19px);line-height:1.25;margin:0 0 6px;color:#57402e}
.mempelai-content .intro{font-family:Georgia,serif;font-size:clamp(8.5px,2.45vw,10px);line-height:1.35;margin:0 0 8px;max-width:100%;color:#594738}
.mempelai-content .person-name{font-family:'Alex Brush','Cormorant Garamond',cursive;font-size:clamp(26px,7vw,32px);font-weight:400;line-height:.95;margin:0;color:#68442f;overflow-wrap:anywhere}
.mempelai-content .parent-line{font-family:Georgia,serif;font-size:clamp(7px,2.05vw,8.5px);line-height:1.25;margin:3px 0 6px;color:#715b47;overflow-wrap:anywhere}
.mempelai-content .and{font-family:'Cormorant Garamond',serif;font-size:17px;font-style:italic;line-height:1;margin:0 0 4px;color:#9b7b54}
.mempelai-page .photo-collage{position:absolute;z-index:4;right:3%;top:53%;width:18%;display:none;flex-direction:column;gap:4px;transform:rotate(8deg);pointer-events:none}
.mempelai-page .photo-collage.has-photos{display:flex}.mempelai-page .photo-collage img{width:100%;aspect-ratio:4/5;object-fit:cover;border:3px solid #fffaf0;box-shadow:0 3px 10px #0005;background:#e6ddce}
.mempelai-page .bottom-caption{position:absolute;z-index:3;bottom:2.5%;left:0;right:0;text-align:center;font:italic 12px 'Cormorant Garamond',serif;letter-spacing:1.2px;color:#f2e4c7;text-shadow:0 2px 6px #0008}
@media(min-width:600px){body.invitation-flow{padding:0!important}.cover.invitation-section,.opening-page.invitation-section,.mempelai-page.invitation-section{border-left:1px solid rgba(201,166,108,.28);border-right:1px solid rgba(201,166,108,.28)}}
@media(max-width:380px){.cover.invitation-section{height:100svh;min-height:640px}.opening-page.invitation-section{min-height:640px}.mempelai-page.invitation-section{height:660px;min-height:660px}.mempelai-content{top:29%;height:40%;left:19%;width:62%;padding:3px 6px}.mempelai-content .intro{margin-bottom:6px}.mempelai-content .parent-line{margin-bottom:5px}.mempelai-content .person-name{font-size:clamp(24px,6.7vw,29px)}}

/* V29: unified emerald background and a more compact, elevated bride/groom panel. */
.mempelai-page.invitation-section{
  height:560px;
  min-height:560px;
  margin-top:-10px;
  background:transparent!important;
  background-attachment:scroll;
}
.mempelai-page .lace-frame{
  width:88%;
  height:560px;
  left:6%;
  top:-60px;
  object-fit:fill;
}
.mempelai-content{
  left:23.5%;
  width:53%;
  top:82px;
  height:260px;
  padding:3px 6px;
  justify-content:center;
}
.mempelai-content .bismillah{margin-bottom:4px;line-height:1.15}
.mempelai-content .intro{line-height:1.25;margin-bottom:5px}
.mempelai-content .parent-line{line-height:1.2;margin:2px 0 5px}
.mempelai-content #memWomanParents{margin-bottom:11px;}
.mempelai-content .and{margin-top:2px;margin-bottom:5px}
.mempelai-page .photo-collage{top:48%;right:3%;width:17%;}
.mempelai-page .bottom-caption{bottom:2%;}
@media(max-width:380px){
  .mempelai-page.invitation-section{height:540px;min-height:540px;margin-top:-9px;}
  .mempelai-page .lace-frame{height:540px;top:-56px;}
  .mempelai-content{left:23.5%;width:53%;top:78px;height:250px;padding:2px 5px;}
  .mempelai-content .intro{margin-bottom:4px;}
  .mempelai-content .parent-line{margin-bottom:4px;}
  .mempelai-content #memWomanParents{margin-bottom:9px;}
  .mempelai-content .and{margin-top:2px;margin-bottom:4px;}
  .mempelai-content .person-name{font-size:clamp(23px,6.4vw,28px);}
}


/* V30: one stationary emerald texture layer behind Opening, Countdown and Mempelai. Cover keeps its own approved background. */
body.invitation-flow{background-image:url('assets/opening-background.png')!important;background-position:center top!important;background-size:min(100vw,390px) 100vh!important;background-repeat:no-repeat!important;background-attachment:fixed!important;}
.opening-page.invitation-section,.mempelai-page.invitation-section{background:transparent!important;}
.opening-page.invitation-section::before,.mempelai-page.invitation-section::before{display:none!important;}
.opening-page .countdown{margin-top:-60px;padding-top:12px;}
.mempelai-page.invitation-section{margin-top:-10px;}
.mempelai-content #memWomanParents{margin-bottom:12px;}
.mempelai-content .and{margin-top:3px;margin-bottom:5px;}
@media(max-width:380px){
  .opening-page .countdown{margin-top:-53px;padding-top:10px;}
  .mempelai-page.invitation-section{margin-top:-9px;}
  .mempelai-content #memWomanParents{margin-bottom:10px;}
  .mempelai-content .and{margin-top:3px;margin-bottom:4px;}
}

/* V31: tighten the vertical rhythm between verse, countdown, and bride/groom frame. */
.opening-page.invitation-section{min-height:520px!important;padding-bottom:8px!important;}
.opening-page .countdown{margin-top:-74px!important;padding-top:10px!important;}
.mempelai-page.invitation-section{margin-top:-18px!important;}
@media(max-width:380px){
  .opening-page.invitation-section{min-height:520px!important;padding-bottom:8px!important;}
  .opening-page .countdown{margin-top:-66px!important;padding-top:9px!important;}
  .mempelai-page.invitation-section{margin-top:-17px!important;}
}

/* V32: keep the pink floral ornament above the shared background and let it cascade into the bride/groom section. */
.opening-page.invitation-section{
  position:relative!important;
  z-index:5!important;
  overflow:visible!important;
}
.opening-page .floral-left-reference{
  z-index:20!important;
  width:286px!important;
  left:-8px!important;
  top:228px!important;
  pointer-events:none!important;
}
.mempelai-page.invitation-section{
  position:relative!important;
  z-index:1!important;
  margin-top:-36px!important;
  overflow:visible!important;
}
.mempelai-page .lace-frame{z-index:0!important;}
.mempelai-content,.mempelai-page .photo-collage,.mempelai-page .bottom-caption{position:absolute;}
@media(max-width:380px){
  .opening-page .floral-left-reference{width:278px!important;left:-8px!important;top:224px!important;}
  .mempelai-page.invitation-section{margin-top:-34px!important;}
}

/* V33: synchronize standalone index.html with the editor's narrow phone preview.
   Remove desktop-only section borders that appeared as unwanted hairline dividers. */
@media(min-width:600px){
  .opening-page.invitation-section,
  .mempelai-page.invitation-section{
    border:0!important;
    outline:0!important;
    box-shadow:none!important;
  }
}
.opening-page.invitation-section{
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}
/* Match the tighter mobile preview rhythm while retaining a visible breathing gap. */
.opening-page .countdown{
  margin-top:-66px!important;
  padding-top:9px!important;
}
.mempelai-page.invitation-section{
  margin-top:-42px!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}
@media(max-width:380px){
  .opening-page .countdown{margin-top:-66px!important;padding-top:9px!important;}
  .mempelai-page.invitation-section{margin-top:-42px!important;}
}

/* V34: desktop browser shows the phone invitation at a wider viewport than the editor preview.
   Relax only the desktop-index countdown overlap so it keeps the same small gap as the editor. */
@media(min-width:600px){
  .opening-page .countdown{
    margin-top:-42px!important;
    padding-top:9px!important;
  }
}

/* V35: clip the upper overflow of the combined Opening artwork at the Opening section boundary.
   This prevents the pearl tasbih from leaking into the Cover while keeping the artwork's approved
   position and allowing the separate pink floral ornament to cascade into the Mempelai section. */
.opening-page .opening-art-image{
  clip-path:inset(141px 0 0 0);
}
@media(max-width:380px){
  .opening-page .opening-art-image{
    clip-path:inset(135px 0 0 0);
  }
}


/* V36: three-photo wedding collage on the right, inspired by the reference.
   Keep it outside the editable text column so bride/groom names and parent details remain readable. */
.mempelai-page .photo-collage{
  top:43.5%!important;
  right:2.5%!important;
  width:18.5%!important;
  gap:4px!important;
  transform:rotate(8deg)!important;
  z-index:6!important;
}
.mempelai-page .photo-collage img{
  display:block;
  width:100%!important;
  aspect-ratio:4/5!important;
  object-fit:cover!important;
  border:3px solid #fffaf0!important;
  box-shadow:0 3px 10px #0005!important;
}
@media(max-width:380px){
  .mempelai-page .photo-collage{top:43%!important;right:2.5%!important;width:18%!important;gap:3px!important;}
  .mempelai-page .photo-collage img{border-width:2.5px!important;}
}


/* V37: elegant unified ivory photo mount; keeps the collage visually connected. */
.mempelai-page .photo-collage{
  top:43.5%!important; right:2.2%!important; width:20%!important;
  padding:5px 5px 7px!important; gap:4px!important;
  background:linear-gradient(145deg,#fffdf7 0%,#f2e7d3 100%)!important;
  border:1px solid rgba(201,166,108,.95)!important; border-radius:3px!important;
  box-shadow:0 6px 16px rgba(0,0,0,.32), inset 0 0 0 1px rgba(255,255,255,.9)!important;
  transform:rotate(5deg)!important; z-index:6!important;
}
.mempelai-page .photo-collage img{
  display:block; width:100%!important; aspect-ratio:4/5!important; object-fit:cover!important;
  border:2px solid #fffdf7!important; border-radius:1px!important;
  box-shadow:0 1px 3px rgba(48,30,12,.16)!important; background:#e9dfce!important;
}
@media(max-width:380px){.mempelai-page .photo-collage{top:43%!important;right:2%!important;width:20%!important;padding:4px 4px 6px!important;gap:3px!important;}}


/* V38: Luxury editorial photo collage inspired by the approved reference.
   Keep the text column clear; let the unified ivory/gold photo mount peek beyond
   the lower edge of the bride/groom panel so it can visually lead into the next section. */
.mempelai-page .mempelai-content{
  left:22.5%!important; width:51%!important;
}
.mempelai-page .photo-collage{
  top:43%!important; right:1.5%!important; width:25%!important;
  padding:5px 5px 7px!important; gap:4px!important;
  background:linear-gradient(145deg,#fffdf8 0%,#f3e8d5 58%,#e8d5b6 100%)!important;
  border:1px solid #c9a66c!important; border-radius:3px!important;
  box-shadow:0 7px 18px rgba(0,0,0,.34),inset 0 0 0 1px rgba(255,255,255,.92)!important;
  transform:rotate(5deg)!important; z-index:8!important;
}
.mempelai-page .photo-collage img{
  display:block; width:100%!important; aspect-ratio:4/5!important; object-fit:cover!important;
  border:2px solid #fffdf8!important; border-radius:1px!important;
  box-shadow:0 1px 3px rgba(64,43,20,.18)!important; background:#eee3d1!important;
}
@media(max-width:380px){
  .mempelai-page .mempelai-content{left:22%!important;width:51%!important;}
  .mempelai-page .photo-collage{top:42.5%!important;right:1%!important;width:25%!important;padding:4px 4px 6px!important;gap:3px!important;}
  .mempelai-page .photo-collage img{border-width:2px!important;}
}


/* V39 — Visible layout correction after preview review.
   Pull collage upward, enlarge it, and let the lower edge continue past the lace panel.
   Keep the text column clear and keep these rules last to override earlier versions. */
.mempelai-page .mempelai-content{
  left:20%!important;
  width:49%!important;
  z-index:2!important;
}
.mempelai-page .photo-collage{
  top:29%!important;
  right:.5%!important;
  width:28.5%!important;
  padding:5px 5px 8px!important;
  gap:4px!important;
  background:linear-gradient(145deg,#fffdf8 0%,#f4ead8 58%,#e6d2b0 100%)!important;
  border:1px solid #c7a36a!important;
  border-radius:3px!important;
  box-shadow:0 7px 18px rgba(0,0,0,.32),inset 0 0 0 1px rgba(255,255,255,.92)!important;
  transform:rotate(5deg)!important;
  z-index:8!important;
}
.mempelai-page .photo-collage img{
  display:block!important;
  width:100%!important;
  aspect-ratio:4/5!important;
  object-fit:cover!important;
  border:2px solid #fffdf8!important;
  border-radius:1px!important;
  box-shadow:0 1px 3px rgba(64,43,20,.18)!important;
  background:#eee3d1!important;
}
@media(max-width:380px){
  .mempelai-page .mempelai-content{left:19%!important;width:49%!important;}
  .mempelai-page .photo-collage{
    top:28%!important;right:.5%!important;width:29%!important;
    padding:4px 4px 7px!important;gap:3px!important;
  }
  .mempelai-page .photo-collage img{border-width:1.5px!important;}
}


/* V40 — restore readable typography and refine the luxury photo strip.
   Keep the names and parents inside the ivory panel; photos are smaller, with visible individual gold keylines. */
.mempelai-page .mempelai-content{
  left:22.5%!important;
  width:51%!important;
  z-index:2!important;
  overflow:hidden!important;
}
.mempelai-page .mempelai-content .intro,
.mempelai-page .mempelai-content .parent-line{
  max-width:100%!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  hyphens:none!important;
}
.mempelai-page .mempelai-content .person-name{
  overflow-wrap:normal!important;
  word-break:normal!important;
  white-space:normal!important;
  font-size:clamp(24px,6.5vw,30px)!important;
  line-height:1.02!important;
}
.mempelai-page .photo-collage{
  top:30%!important;
  right:1.5%!important;
  width:21.5%!important;
  padding:4px 4px 6px!important;
  gap:3px!important;
  background:linear-gradient(145deg,#fffdf8 0%,#f4ead8 56%,#e7d4b4 100%)!important;
  border:1px solid #c7a36a!important;
  border-radius:3px!important;
  box-shadow:0 5px 13px rgba(0,0,0,.26),inset 0 0 0 1px rgba(255,255,255,.92)!important;
  transform:rotate(4deg)!important;
  z-index:8!important;
}
.mempelai-page .photo-collage img{
  display:block!important;
  width:100%!important;
  aspect-ratio:3/4!important;
  object-fit:cover!important;
  border:1.5px solid #c9a66c!important;
  outline:1px solid rgba(255,253,248,.95)!important;
  outline-offset:-3px!important;
  border-radius:1px!important;
  box-shadow:0 1px 3px rgba(64,43,20,.18)!important;
  background:#fffaf0!important;
}
@media(max-width:380px){
  .mempelai-page .mempelai-content{left:22.5%!important;width:51%!important;padding-left:5px!important;padding-right:5px!important;}
  .mempelai-page .mempelai-content .person-name{font-size:clamp(23px,6.2vw,28px)!important;}
  .mempelai-page .photo-collage{top:30%!important;right:1.5%!important;width:21.5%!important;padding:3px 3px 5px!important;gap:3px!important;}
  .mempelai-page .photo-collage img{border-width:1.5px!important;}
}

/* V41 — centered invitation typography, inset gold detailing, and a raised photo strip. */
.mempelai-page .mempelai-content{
  left:20.5%!important;
  width:56.5%!important;
  padding:4px 9px!important;
  text-align:center!important;
  align-items:center!important;
  overflow:visible!important;
}
.mempelai-page .mempelai-content::before{
  content:"";
  position:absolute;
  inset:-7px -7px;
  border:1px solid rgba(190,145,72,.92);
  box-shadow:inset 0 0 0 1px rgba(255,251,238,.9),0 0 0 1px rgba(201,166,108,.14);
  pointer-events:none;
  z-index:-1;
}
.mempelai-page .mempelai-content .intro,
.mempelai-page .mempelai-content .parent-line{
  width:100%!important;
  text-align:center!important;
  text-wrap:pretty;
}
.mempelai-page .mempelai-content .person-name{
  max-width:100%!important;
  text-align:center!important;
  font-size:clamp(25px,6.7vw,31px)!important;
  line-height:1.04!important;
}
.mempelai-page .mempelai-content .and{
  position:relative!important;
  width:100%!important;
  text-align:center!important;
  margin:3px 0 6px!important;
}
.mempelai-page .mempelai-content .and::before,
.mempelai-page .mempelai-content .and::after{
  content:"";
  position:absolute;
  top:52%;
  width:22%;
  height:1px;
  background:linear-gradient(90deg,transparent,#c9a66c 35%,#e8cf9b 65%,transparent);
}
.mempelai-page .mempelai-content .and::before{left:5%;}
.mempelai-page .mempelai-content .and::after{right:5%;transform:scaleX(-1);}
.mempelai-page .photo-collage{
  top:17%!important;
  right:1.5%!important;
  width:21%!important;
  padding:4px 4px 6px!important;
  gap:3px!important;
  transform:rotate(4deg)!important;
  background:linear-gradient(145deg,#fffdf8 0%,#f5ead7 55%,#e8d4b1 100%)!important;
  border:1.5px solid #c9a66c!important;
  box-shadow:0 5px 13px rgba(0,0,0,.28),inset 0 0 0 1px rgba(255,255,255,.96)!important;
}
.mempelai-page .photo-collage img{
  aspect-ratio:3/4!important;
  border:1.5px solid #b98b43!important;
  outline:1px solid #fffdf7!important;
  outline-offset:-4px!important;
  box-shadow:0 1px 3px rgba(64,43,20,.2)!important;
}
@media(max-width:380px){
  .mempelai-page .mempelai-content{left:20.5%!important;width:56.5%!important;padding:3px 7px!important;}
  .mempelai-page .mempelai-content .person-name{font-size:clamp(23px,6.3vw,29px)!important;}
  .mempelai-page .photo-collage{top:17%!important;right:1.5%!important;width:21%!important;padding:3px 3px 5px!important;gap:3px!important;}
}


/* V42 — Event details page with an inset emerald texture, calendar strip and pulsing pink heart. */
.event-page.invitation-section{
  position:relative!important;isolation:isolate;width:min(100%,390px);min-height:890px;margin:0 auto!important;
  overflow:hidden;background:#A9CBE7 url('assets/event-background.png') center top/100% 100% no-repeat!important;
  color:#f7ecd5;padding:24px 17px 36px;box-shadow:none!important;
}
.event-page.invitation-section::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(169,203,231,.05),rgba(69,103,130,.08));pointer-events:none}
.event-inner{position:relative;z-index:1;width:100%;max-width:100%;margin:0 auto}
.calendar-strip{margin:0 0 28px;padding:12px 8px 13px;border:1px solid rgba(221,190,126,.68);border-radius:12px;background:rgba(255,248,239,.78);box-shadow:inset 0 0 0 1px rgba(255,246,221,.06),0 7px 20px rgba(0,0,0,.13);backdrop-filter:blur(2px)}
.calendar-month{font:600 22px 'Cormorant Garamond',serif;letter-spacing:4px;text-align:center;color:#f4dfb1;margin:0 0 11px;text-shadow:0 2px 8px #001c13}
.calendar-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:1px;align-items:stretch}
.calendar-day{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:3px;padding:4px 0 6px;color:#f2e8d4;text-align:center;border-radius:9px;position:relative}
.calendar-day span{font:italic 12px 'Cormorant Garamond',serif;color:#d9d0bd;white-space:nowrap}
.calendar-day b{font:500 22px 'Cormorant Garamond',serif;line-height:1;color:#f7edd8}
.heart-mark,.heart-spacer{height:17px;display:flex;align-items:center;justify-content:center;font-style:normal;line-height:1}
.heart-mark{font-family:Arial,sans-serif;font-size:17px;color:#ff5b91;text-shadow:0 0 5px rgba(255,76,139,.75),0 0 13px rgba(255,76,139,.48);animation:heartBlink 1.05s ease-in-out infinite}
.calendar-day.is-wedding-day{background:radial-gradient(ellipse at center,rgba(255,67,132,.26),rgba(255,67,132,.08) 62%,transparent 80%)}
.calendar-day.is-wedding-day b{color:#ffd5e1;text-shadow:0 0 9px rgba(255,92,145,.5)}
@keyframes heartBlink{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.78)}}
@media(prefers-reduced-motion:reduce){.heart-mark{animation:none}}
.event-heading{text-align:center;margin:0 auto 19px;max-width:330px}
.event-kicker{display:block;font:500 10px 'Cormorant Garamond',serif;letter-spacing:2.4px;color:#d8bd82;margin-bottom:4px}
.event-heading h2{font:500 31px 'Alex Brush','Cormorant Garamond',cursive;color:#fff0d1;margin:0;line-height:1.05;text-shadow:0 2px 8px rgba(0,0,0,.25)}
.event-heading h2 em{font-style:normal;color:#d7b56f;padding:0 3px}
.event-heading>p{font:13px/1.45 Georgia,serif;color:#f1e6d0;margin:9px auto 0;max-width:290px}
.event-heading-rule{display:flex;align-items:center;justify-content:center;gap:10px;color:#d4b16d;font-size:20px;margin:8px auto 0}
.event-heading-rule:before,.event-heading-rule:after{content:"";width:48px;height:1px;background:linear-gradient(90deg,transparent,#d4b16d)}
.event-heading-rule:after{transform:scaleX(-1)}
.event-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 14px}
.event-card{min-width:0;text-align:center;padding:15px 8px 16px;border:1px solid #d9ba7c;border-radius:12px;background:linear-gradient(145deg,rgba(255,249,235,.98),rgba(245,232,206,.96));color:#5e4634;box-shadow:0 7px 16px rgba(0,0,0,.17),inset 0 0 0 2px rgba(255,255,255,.45)}
.event-icon{color:#b68c48;font-size:24px;line-height:1;margin-bottom:7px}
.event-label{font:600 9px 'Cormorant Garamond',serif;letter-spacing:1.8px;color:#9a7845;margin:0 0 5px}
.event-card h3{font:600 23px 'Cormorant Garamond',serif;color:#553d2d;margin:0 0 5px;line-height:1.1}
.event-time{font:12px/1.4 Georgia,serif;color:#6e5944;margin:0}
.event-location{position:relative;text-align:center;padding:19px 17px 18px;border:1px solid #d5b579;border-radius:13px;background:linear-gradient(145deg,rgba(255,249,235,.98),rgba(243,228,199,.97));color:#5e4634;box-shadow:0 9px 22px rgba(0,0,0,.18),inset 0 0 0 3px rgba(255,255,255,.44)}
.location-pin{font:30px/1 Georgia,serif;color:#b48a45;margin:0 0 7px}
.event-location h3{font:600 22px/1.1 'Cormorant Garamond',serif;color:#553d2d;margin:0 auto 8px;max-width:285px}
.event-location>p:not(.event-label){font:12px/1.55 Georgia,serif;color:#715c47;margin:0 auto;white-space:pre-line;max-width:285px}
.event-map-link{display:inline-flex;align-items:center;justify-content:center;gap:7px;margin:13px auto 0;padding:9px 18px;border:1px solid #c8a05a;border-radius:30px;background:linear-gradient(110deg,#e8cf91,#c99b4c);color:#173a2a;text-decoration:none;font:600 12px 'Cormorant Garamond',serif;letter-spacing:.25px;box-shadow:0 3px 8px rgba(93,62,17,.17)}
.event-closing{max-width:300px;text-align:center;margin:18px auto 0;font:italic 13px/1.5 'Cormorant Garamond',serif;color:#f2e4c5}
.event-bottom-flourish{text-align:center;font-size:25px;line-height:1;color:#d5b579;margin:10px auto 0}
@media(max-width:380px){
 .event-page.invitation-section{min-height:860px;padding:21px 13px 32px}
 .calendar-strip{margin-bottom:23px;padding:10px 5px 11px}
 .calendar-month{font-size:20px;margin-bottom:9px}
 .calendar-day span{font-size:11px}.calendar-day b{font-size:20px}
 .event-heading h2{font-size:29px}.event-heading>p{font-size:12px}
 .event-cards{gap:8px}.event-card{padding:13px 5px 14px}.event-card h3{font-size:21px}.event-time{font-size:11px}
 .event-location{padding:17px 12px}.event-location h3{font-size:20px}.event-location>p:not(.event-label){font-size:11px}
}
@media(min-width:600px){.event-page.invitation-section{border:0!important;outline:0!important;box-shadow:none!important}}
/* V42: slim the collage slightly while keeping its gold mount and letting it lead into the next page. */
.mempelai-page .photo-collage{width:19%!important;top:18%!important;right:1.5%!important;}
@media(max-width:380px){.mempelai-page .photo-collage{width:19%!important;top:18%!important;right:1.5%!important;}}

/* V43 — tighten the transition into the event page while keeping the invitation's plain emerald base. */
.mempelai-page .photo-collage{
  top:40%!important;
  right:1.5%!important;
  width:19%!important;
}
.event-page.invitation-section{
  margin-top:-36px!important;
  background:#A9CBE7!important;
  padding-top:24px!important;
}
/* The patterned green is an inset decorative layer, not the full page/canvas background. */
.event-page.invitation-section::before{
  inset:0 9px!important;
  z-index:0!important;
  background-image:
    linear-gradient(180deg,rgba(36,80,123,.18),rgba(2,38,25,.30)),
    url('assets/event-background.png')!important;
  background-position:center top!important;
  background-size:100% 100%!important;
  background-repeat:no-repeat!important;
}
.event-inner{z-index:1!important;}
@media(max-width:380px){
  .mempelai-page .photo-collage{top:40%!important;right:1.5%!important;width:19%!important;}
  .event-page.invitation-section{margin-top:-36px!important;padding-top:24px!important;}
  .event-page.invitation-section::before{inset:0 8px!important;}
}

/* V45 — bring the patterned event background up to tuck slightly behind the lower edge of the photo collage. */
.mempelai-page .photo-collage{
  top:32%!important;
  right:1.5%!important;
  width:19%!important;
}
.event-page.invitation-section{
  margin-top:-112px!important;
  padding-top:22px!important;
}
@media(max-width:380px){
  .mempelai-page .photo-collage{top:32%!important;right:1.5%!important;width:19%!important;}
  .event-page.invitation-section{margin-top:-112px!important;padding-top:22px!important;}
}

/* V45: allow the collage to overlap the event texture cleanly without obscuring event content. */
.mempelai-page.invitation-section{position:relative!important;z-index:2!important;overflow:visible!important;}
.event-page.invitation-section{position:relative!important;z-index:1!important;}
.event-page.invitation-section::before{z-index:0!important;}
.event-inner{position:relative!important;z-index:1!important;}


/* V46 — lift the event section another 26px so the collage's lower edge meets the calendar's gold frame. Keep calendar spacing unchanged and remove the caption that visually fell into the calendar during overlap. */
.mempelai-page .bottom-caption{display:none!important;}
.event-page.invitation-section{margin-top:-138px!important;}
@media(max-width:380px){
  .event-page.invitation-section{margin-top:-138px!important;}
}


/* V47 — floral detailing inspired by the approved emerald, ivory and gold reference.
   Preserve the approved collage/calendar spacing and keep all decorative flowers behind text and photos. */
.floral-ornament{
  position:absolute!important;display:block!important;height:auto!important;max-width:none!important;
  pointer-events:none!important;user-select:none!important;object-fit:contain!important;
  filter:drop-shadow(0 3px 5px rgba(0,0,0,.22));
}
.mempelai-page .floral-mempelai-left{
  width:94px!important;left:-13px!important;top:48%!important;z-index:3!important;
  opacity:.96;transform:rotate(-3deg)!important;
}
.mempelai-page .floral-mempelai-right{
  width:91px!important;right:-17px!important;top:7%!important;z-index:3!important;
  opacity:.94;transform:scaleX(-1) rotate(4deg)!important;
}
.event-page .floral-event-left{
  width:70px!important;left:-22px!important;top:16%!important;z-index:1!important;
  opacity:.78;transform:rotate(-5deg)!important;
}
.event-page .floral-event-right{
  width:72px!important;right:-23px!important;bottom:3%!important;z-index:1!important;
  opacity:.82;transform:scaleX(-1) rotate(5deg)!important;
}
.event-inner{z-index:2!important}
@media(max-width:380px){
  .mempelai-page .floral-mempelai-left{width:84px!important;left:-12px!important;top:48%!important;}
  .mempelai-page .floral-mempelai-right{width:82px!important;right:-15px!important;top:7%!important;}
  .event-page .floral-event-left{width:62px!important;left:-20px!important;}
  .event-page .floral-event-right{width:64px!important;right:-21px!important;}
}


/* V48 — deliberate floral placement following the supplied reference.
   The opening's existing left floral remains the first bridge; the right floral
   begins at the countdown and ends beside the collage; the lower-left floral
   finishes at the event transition. A small pink bloom anchors the collage foot. */
.mempelai-page.invitation-section{overflow:visible!important;}
.mempelai-page .floral-mempelai-left{
  width:92px!important;left:-13px!important;top:35%!important;z-index:5!important;
  opacity:.96!important;transform:rotate(-3deg)!important;
}
.mempelai-page .floral-mempelai-right{
  width:108px!important;right:-14px!important;top:-18%!important;z-index:5!important;
  opacity:.96!important;transform:scaleX(-1) rotate(4deg)!important;
}
.event-page .floral-event-left,.event-page .floral-event-right{display:none!important;}
.mempelai-page .photo-collage{z-index:8!important;}
.mempelai-page .floral-collage-bridge{
  position:absolute!important;display:block!important;pointer-events:none!important;user-select:none!important;
  width:58px!important;height:auto!important;right:-1px!important;top:418px!important;
  z-index:10!important;filter:drop-shadow(0 2px 4px rgba(0,0,0,.22));
}
@media(max-width:380px){
  .mempelai-page .floral-mempelai-left{width:84px!important;left:-12px!important;top:35%!important;}
  .mempelai-page .floral-mempelai-right{width:98px!important;right:-13px!important;top:-17%!important;}
  .mempelai-page .floral-collage-bridge{width:53px!important;right:0!important;top:410px!important;}
}


/* V49 — restrained luxury botanical layout based on the user's approved direction.
   Keep the opening flower as the main cascade; reduce overlapping blooms around the names,
   let the right flower bridge countdown to collage, and use only one small bloom at the seam. */
.mempelai-page.invitation-section{overflow:visible!important;}
.mempelai-page .floral-mempelai-left{
  width:66px!important;left:-9px!important;top:52%!important;z-index:5!important;
  opacity:.92!important;transform:rotate(-3deg)!important;
}
.mempelai-page .floral-mempelai-right{
  width:80px!important;right:-10px!important;top:-7%!important;z-index:5!important;
  opacity:.92!important;transform:scaleX(-1) rotate(3deg)!important;
}
.mempelai-page .photo-collage{z-index:8!important;}
.mempelai-page .floral-collage-bridge{
  width:42px!important;height:auto!important;right:1px!important;top:458px!important;
  z-index:10!important;filter:drop-shadow(0 2px 4px rgba(0,0,0,.18))!important;
}
.event-page .floral-event-left,.event-page .floral-event-right{display:none!important;}
@media(max-width:380px){
  .mempelai-page .floral-mempelai-left{width:62px!important;left:-8px!important;top:52%!important;}
  .mempelai-page .floral-mempelai-right{width:76px!important;right:-9px!important;top:-7%!important;}
  .mempelai-page .floral-collage-bridge{width:39px!important;right:1px!important;top:458px!important;}
}

/* V50 — restrained premium floral composition.
   The opening bouquet remains the primary left-side cascade. Keep the right
   cluster slim as a countdown-to-collage bridge, the lower-left cluster as a
   small transition accent, and the pink bloom tucked onto the collage foot.
   No typography, collage dimensions, section spacing, or calendar rules change. */
.mempelai-page .floral-mempelai-left{
  width:43px!important;left:-7px!important;top:47%!important;z-index:3!important;
  opacity:.84!important;transform:rotate(-4deg)!important;
}
.mempelai-page .floral-mempelai-right{
  width:56px!important;right:-8px!important;top:-9%!important;z-index:3!important;
  opacity:.88!important;transform:scaleX(-1) rotate(3deg)!important;
}
.mempelai-page .photo-collage{z-index:8!important;}
.mempelai-page .floral-collage-bridge{
  width:34px!important;height:auto!important;right:0!important;top:424px!important;
  z-index:10!important;filter:drop-shadow(0 2px 3px rgba(0,0,0,.16))!important;
}
.event-page .floral-event-left,.event-page .floral-event-right{display:none!important;}
@media(max-width:380px){
  .mempelai-page .floral-mempelai-left{width:40px!important;left:-7px!important;top:47%!important;}
  .mempelai-page .floral-mempelai-right{width:52px!important;right:-7px!important;top:-8%!important;}
  .mempelai-page .floral-collage-bridge{width:32px!important;right:0!important;top:424px!important;}
}

/* V51 — refined floral composition: all ornaments stay inside the visible canvas.
   Flowers are anchored to the invitation panels instead of hanging behind the page/background. */
.opening-page.invitation-section{overflow:hidden!important;}
.opening-page .floral-left-reference{
  left:0!important;top:228px!important;width:clamp(190px,68vw,258px)!important;
  max-width:68vw!important;z-index:6!important;object-fit:contain!important;
  filter:drop-shadow(0 4px 5px rgba(0,0,0,.2))!important;
}
.mempelai-page.invitation-section{position:relative!important;isolation:isolate!important;overflow:hidden!important;}
.mempelai-page .lace-frame{z-index:0!important;}
.mempelai-page .floral-mempelai-left{
  width:clamp(48px,15vw,62px)!important;left:2px!important;top:48%!important;
  z-index:4!important;opacity:.96!important;transform:rotate(-3deg)!important;
}
.mempelai-page .floral-mempelai-right{
  width:clamp(54px,17vw,70px)!important;right:2px!important;top:1%!important;
  z-index:4!important;opacity:.96!important;transform:scaleX(-1) rotate(3deg)!important;
}
.mempelai-page .mempelai-content{z-index:5!important;}
.mempelai-page .photo-collage{z-index:8!important;}
.mempelai-page .floral-collage-bridge{
  width:clamp(30px,9vw,38px)!important;height:auto!important;right:3px!important;top:424px!important;
  z-index:9!important;filter:drop-shadow(0 2px 3px rgba(0,0,0,.2))!important;
}
.event-page.invitation-section{position:relative!important;overflow:hidden!important;isolation:isolate!important;}
.event-page .floral-event-left,.event-page .floral-event-right{display:none!important;}
@media(max-width:380px){
 .opening-page .floral-left-reference{left:0!important;top:224px!important;width:clamp(180px,70vw,238px)!important;max-width:70vw!important;}
 .mempelai-page .floral-mempelai-left{width:46px!important;left:1px!important;top:48%!important;}
 .mempelai-page .floral-mempelai-right{width:52px!important;right:1px!important;top:1%!important;}
 .mempelai-page .floral-collage-bridge{width:29px!important;right:2px!important;top:424px!important;}
}

/* V52 — one continuous plain emerald canvas after the cover.
   The cover keeps its original photographic background. All later sections share
   the same solid emerald base so section boundaries cannot cover floral artwork. */
html:has(body.invitation-flow){background:#A9CBE7!important;}
body.invitation-flow{
  background:#A9CBE7!important;
  background-image:none!important;
  background-attachment:scroll!important;
  overflow-x:clip!important;
}
/* Keep the cover design exactly as it was. */
.cover.invitation-section{background:url('assets/background.png') center/cover!important;}
/* Opening, couple panel, and event details are transparent over the shared canvas. */
.opening-page.invitation-section,
.mempelai-page.invitation-section,
.event-page.invitation-section{
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
}
.opening-page.invitation-section::before,
.mempelai-page.invitation-section::before,
.event-page.invitation-section::before{display:none!important;content:none!important;}
/* Let decorations cross section seams without being cut by a local viewport. */
.opening-page.invitation-section{
  position:relative!important;z-index:3!important;overflow:visible!important;
  isolation:auto!important;
}
.mempelai-page.invitation-section{
  position:relative!important;z-index:2!important;overflow:visible!important;
  isolation:auto!important;
}
.event-page.invitation-section{
  position:relative!important;z-index:1!important;overflow:visible!important;
  isolation:auto!important;
}
/* Stable decorative layer order: floral artwork above the continuous background,
   lace behind the copy, and the photo collage above the lace and floral accents. */
.opening-page .floral-left-reference{z-index:12!important;}
.mempelai-page .lace-frame{z-index:1!important;}
.mempelai-page .floral-mempelai-left,
.mempelai-page .floral-mempelai-right{z-index:6!important;}
.mempelai-page .mempelai-content{z-index:7!important;}
.mempelai-page .photo-collage{z-index:9!important;}
.mempelai-page .floral-collage-bridge{z-index:10!important;}
.event-page .event-inner{position:relative!important;z-index:2!important;}
/* Keep flower artwork comfortably inside the canvas; avoid hard clipping at edges. */
.opening-page .floral-left-reference{
  left:3px!important;max-width:68vw!important;object-fit:contain!important;
  filter:drop-shadow(0 3px 5px rgba(0,0,0,.18))!important;
}
.mempelai-page .floral-mempelai-left{left:4px!important;}
.mempelai-page .floral-mempelai-right{right:4px!important;}
.mempelai-page .floral-collage-bridge{right:5px!important;}
@media(max-width:380px){
  .opening-page .floral-left-reference{left:2px!important;max-width:70vw!important;}
  .mempelai-page .floral-mempelai-left{left:3px!important;}
  .mempelai-page .floral-mempelai-right{right:3px!important;}
  .mempelai-page .floral-collage-bridge{right:4px!important;}
}

/* V53 — understated botanical luxury + inset event texture.
   Remove detached pink bouquets that read as stickers. Keep the invitation's
   own opening artwork, lace frame, photo collage, gold accents and typography.
   The event-only leaf texture is inset from the phone edges and spans calendar
   through the closing line; the main emerald canvas remains visible as a margin. */
.opening-page .floral-left-reference,
.mempelai-page .floral-mempelai-left,
.mempelai-page .floral-mempelai-right,
.mempelai-page .floral-collage-bridge,
.event-page .floral-event-left,
.event-page .floral-event-right{
  display:none!important;
}
/* A single inset panel, rather than a full-bleed page background. */
.event-page.invitation-section{
  overflow:visible!important;
  isolation:isolate!important;
  background:transparent!important;
  padding-top:22px!important;
  padding-bottom:26px!important;
}
.event-page.invitation-section::before{
  display:block!important;
  content:""!important;
  position:absolute!important;
  inset:0 10px!important;
  z-index:-1!important;
  border:1px solid rgba(208,177,112,.42)!important;
  border-radius:12px!important;
  background:
    linear-gradient(180deg,rgba(36,80,123,.22),rgba(36,80,123,.38)),
    url('assets/event-background.png') center top / 100% 100% no-repeat!important;
  pointer-events:none!important;
}
.event-page .event-inner{
  position:relative!important;
  z-index:1!important;
  background:transparent!important;
}
/* A subtle gold hairline keeps the calendar refined without adding more flowers. */
.event-page .calendar-strip{
  border-color:rgba(220,190,126,.62)!important;
  box-shadow:0 0 0 1px rgba(255,245,215,.035) inset!important;
}
@media(max-width:380px){
  .event-page.invitation-section::before{inset:0 9px!important;}
}

/* V56 — fixes applied to the actual scrolling invitation (index.html), not only mempelai.html. */
.mempelai-page .mempelai-content::before,
.mempelai-page .mempelai-content::after{
  content:none!important; display:none!important; border:0!important; box-shadow:none!important;
}
.mempelai-page .mempelai-content{
  left:18.5%!important; width:63%!important;
  padding:5px 10px!important;
  display:flex!important; flex-direction:column!important;
  align-items:center!important; justify-content:center!important;
  gap:0!important; text-align:center!important; overflow:visible!important;
}
.mempelai-page .mempelai-content .bismillah{
  width:100%!important; font-family:'Amiri',serif!important;
  font-size:clamp(17px,4.6vw,20px)!important; line-height:1.35!important;
  color:#60452f!important; text-align:center!important; margin:0 0 7px!important;
}
.mempelai-page .mempelai-content .intro{
  width:100%!important; max-width:100%!important; font-family:'Cormorant Garamond',Georgia,serif!important;
  font-size:clamp(10px,2.7vw,11.5px)!important; line-height:1.35!important;
  letter-spacing:0!important; text-align:center!important; color:#5b4634!important; margin:0 0 9px!important;
}
.mempelai-page .mempelai-content .person-name{
  display:block!important; width:100%!important; max-width:100%!important;
  font-family:'Alex Brush',cursive!important; font-size:clamp(29px,7.4vw,34px)!important;
  font-weight:400!important; line-height:1.02!important; letter-spacing:.1px!important;
  text-align:center!important; color:#68452f!important; margin:0!important;
}
.mempelai-page .mempelai-content .parent-line{
  width:100%!important; font-family:'Cormorant Garamond',Georgia,serif!important;
  font-size:clamp(9px,2.35vw,10px)!important; line-height:1.32!important;
  text-align:center!important; color:#78624d!important; margin:3px 0 9px!important;
}
.mempelai-page .mempelai-content #memWomanParents{margin-bottom:10px!important;}
.mempelai-page .mempelai-content .and{
  position:relative!important; display:block!important; width:100%!important;
  font-family:'Cormorant Garamond',serif!important; font-size:16px!important;
  font-style:italic!important; line-height:1!important; text-align:center!important;
  color:#9a794c!important; margin:1px 0 7px!important;
}
.mempelai-page .mempelai-content .and::before,
.mempelai-page .mempelai-content .and::after{
  content:""!important; display:block!important; position:absolute!important; top:50%!important;
  width:18%!important; height:1px!important;
  background:linear-gradient(90deg,transparent,#c9a66c 45%,transparent)!important;
}
.mempelai-page .mempelai-content .and::before{left:6%!important;}
.mempelai-page .mempelai-content .and::after{right:6%!important;}
@media(max-width:380px){
 .mempelai-page .mempelai-content{left:18.5%!important;width:63%!important;padding:3px 8px!important;}
 .mempelai-page .mempelai-content .bismillah{font-size:clamp(16px,4.5vw,18px)!important;margin-bottom:5px!important;}
 .mempelai-page .mempelai-content .intro{font-size:clamp(9.5px,2.65vw,10.5px)!important;margin-bottom:7px!important;}
 .mempelai-page .mempelai-content .person-name{font-size:clamp(27px,7.1vw,31px)!important;}
 .mempelai-page .mempelai-content .parent-line{font-size:clamp(8.5px,2.3vw,9.5px)!important;margin-bottom:7px!important;}
}

/* V57 — generous inset around all couple copy + restrained gold botanical accents. */
.mempelai-page .mempelai-content{
  box-sizing:border-box!important;
  left:19.5%!important;
  width:61%!important;
  padding-left:12px!important;
  padding-right:12px!important;
  overflow:hidden!important;
}
.mempelai-page .mempelai-content .bismillah,
.mempelai-page .mempelai-content .intro,
.mempelai-page .mempelai-content .person-name,
.mempelai-page .mempelai-content .parent-line,
.mempelai-page .mempelai-content .and{
  box-sizing:border-box!important;
  max-width:100%!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
.mempelai-page .mempelai-content .intro{padding:0 2px!important;}
.mempelai-page .mempelai-content .parent-line{padding:0 1px!important;font-size:clamp(8px,2.15vw,9.5px)!important;}
.mempelai-page .mempelai-content .person-name{font-size:clamp(27px,7vw,32px)!important;}
.mempelai-page .gold-sprig{
  position:absolute!important; z-index:1!important; display:block!important;
  width:76px!important; height:44px!important; opacity:.8!important;
  background:url('assets/gold-sprig.svg') center/contain no-repeat!important;
  pointer-events:none!important;
}
.mempelai-page .gold-sprig-left{left:5%!important;bottom:9%!important;transform:rotate(-18deg)!important;}
.mempelai-page .gold-sprig-right{right:5%!important;top:7%!important;transform:rotate(165deg)!important;}
@media(max-width:380px){
 .mempelai-page .mempelai-content{left:19%!important;width:62%!important;padding-left:10px!important;padding-right:10px!important;}
 .mempelai-page .mempelai-content .intro{font-size:clamp(9px,2.55vw,10px)!important;}
 .mempelai-page .mempelai-content .parent-line{font-size:clamp(7.7px,2.1vw,8.8px)!important;}
 .mempelai-page .gold-sprig{width:58px!important;height:34px!important;}
 .mempelai-page .gold-sprig-left{left:4%!important;bottom:8%!important;}
 .mempelai-page .gold-sprig-right{right:4%!important;top:7%!important;}
}

/* V58 — trim the inset event-only texture to the actual event content.
   The leaf panel now ends just below the closing flourish instead of reserving
   an oversized 890px section with a large empty patterned area. */
.event-page.invitation-section{
  min-height:0!important;
  height:auto!important;
  padding-bottom:8px!important;
}
.event-page.invitation-section::before{
  inset:0 10px 0!important;
  border-radius:12px!important;
  background-size:100% 100%!important;
}
.event-page .event-inner{
  padding-bottom:0!important;
  margin-bottom:0!important;
}
.event-page .event-bottom-flourish{
  margin-bottom:0!important;
  padding-bottom:0!important;
}
@media(max-width:380px){
  .event-page.invitation-section{padding-bottom:7px!important;}
  .event-page.invitation-section::before{inset:0 9px 0!important;}
}


/* V59: independent event-page couple names + balanced long-name typography. */
.mempelai-page .mempelai-content .person-name{
  box-sizing:border-box!important;
  width:100%!important;
  max-width:100%!important;
  padding-left:8px!important;
  padding-right:8px!important;
  text-align:center!important;
  text-wrap:balance!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  line-height:1.02!important;
  font-size:clamp(22px,5.7vw,29px)!important;
}
.mempelai-page .mempelai-content .intro,
.mempelai-page .mempelai-content .parent-line{
  box-sizing:border-box!important;
  width:100%!important;
  max-width:100%!important;
  padding-left:7px!important;
  padding-right:7px!important;
  text-align:center!important;
  text-wrap:balance!important;
}
.event-heading #eventCoupleNames{
  max-width:100%!important;
  padding-inline:10px!important;
  box-sizing:border-box!important;
  text-align:center!important;
  text-wrap:balance!important;
  overflow-wrap:anywhere!important;
  line-height:1.08!important;
}

/* V60 — visually balance the couple copy within the ivory panel and gently draw attention to the location link. */
.mempelai-page .mempelai-content{
  top:calc(29% + 9px)!important;
}
@media(max-width:380px){
  .mempelai-page .mempelai-content{top:calc(29% + 7px)!important;}
}
.event-page .event-map-link{
  animation:locationSoftPulse 1.8s ease-in-out infinite;
  transform-origin:center;
  will-change:transform,box-shadow,filter;
}
@keyframes locationSoftPulse{
  0%,100%{box-shadow:0 3px 8px rgba(93,62,17,.17),0 0 0 0 rgba(232,207,145,0);filter:brightness(1);transform:scale(1)}
  50%{box-shadow:0 4px 13px rgba(93,62,17,.25),0 0 0 4px rgba(232,207,145,.16);filter:brightness(1.06);transform:scale(1.025)}
}
@media(prefers-reduced-motion:reduce){
  .event-page .event-map-link{animation:none!important;}
}

/* V61 — restore a stable content box for long couple names.
   V60 moved only the top edge while keeping a short fixed-height box; with long names,
   the flex content overflowed above and below the ivory panel. Keep the whole text group
   inside the lace frame and distribute the available vertical space evenly. */
.mempelai-page .mempelai-content{
  top:15%!important;
  height:70%!important;
  box-sizing:border-box!important;
  padding:12px 12px!important;
  justify-content:center!important;
  overflow:hidden!important;
  gap:0!important;
}
.mempelai-page .mempelai-content > *{
  flex-shrink:0!important;
  min-width:0!important;
}
.mempelai-page .mempelai-content .bismillah{
  font-size:clamp(15px,4.1vw,19px)!important;
  line-height:1.2!important;
  margin:0 0 5px!important;
}
.mempelai-page .mempelai-content .intro{
  font-size:clamp(9px,2.45vw,10.5px)!important;
  line-height:1.28!important;
  margin:0 0 7px!important;
}
.mempelai-page .mempelai-content .person-name{
  font-size:clamp(21px,5.8vw,28px)!important;
  line-height:1.05!important;
  text-wrap:balance!important;
  overflow-wrap:anywhere!important;
  margin:0!important;
}
.mempelai-page .mempelai-content .parent-line{
  font-size:clamp(7.5px,2vw,9px)!important;
  line-height:1.2!important;
  margin:3px 0 6px!important;
  text-wrap:balance!important;
  overflow-wrap:anywhere!important;
}
.mempelai-page .mempelai-content #memWomanParents{margin-bottom:7px!important;}
.mempelai-page .mempelai-content .and{
  line-height:1.1!important;
  margin:1px 0 5px!important;
}
@media(max-width:380px){
  .mempelai-page .mempelai-content{
    top:15%!important;
    height:70%!important;
    padding:10px 10px!important;
  }
  .mempelai-page .mempelai-content .bismillah{font-size:clamp(14px,4vw,17px)!important;}
  .mempelai-page .mempelai-content .intro{font-size:clamp(8.5px,2.35vw,9.5px)!important;}
  .mempelai-page .mempelai-content .person-name{font-size:clamp(20px,5.5vw,25px)!important;}
  .mempelai-page .mempelai-content .parent-line{font-size:clamp(7px,1.9vw,8.2px)!important;}
}

/* V62 — move the complete couple-text group upward into the ivory panel.
   The previous tall flex box centered short content too low, leaving a large top gap.
   Start content near the panel's inner top edge and use compact, consistent spacing. */
.mempelai-page .mempelai-content{
  top:18.5%!important;
  height:64%!important;
  box-sizing:border-box!important;
  padding:8px 12px 10px!important;
  justify-content:flex-start!important;
  align-items:center!important;
  gap:0!important;
  overflow:hidden!important;
}
.mempelai-page .mempelai-content .bismillah{
  margin:0 0 4px!important;
  line-height:1.16!important;
}
.mempelai-page .mempelai-content .intro{
  margin:0 0 6px!important;
  line-height:1.25!important;
}
.mempelai-page .mempelai-content .person-name{
  margin:0!important;
  line-height:1.02!important;
  max-width:100%!important;
  padding-inline:5px!important;
}
.mempelai-page .mempelai-content .parent-line{
  margin:2px 0 5px!important;
  line-height:1.18!important;
  max-width:100%!important;
}
.mempelai-page .mempelai-content #memWomanParents{margin-bottom:7px!important;}
.mempelai-page .mempelai-content .and{margin:0 0 4px!important;line-height:1!important;}
@media(max-width:380px){
  .mempelai-page .mempelai-content{top:18.5%!important;height:64%!important;padding:7px 9px 9px!important;}
  .mempelai-page .mempelai-content .bismillah{font-size:clamp(14px,4vw,17px)!important;}
  .mempelai-page .mempelai-content .intro{font-size:clamp(8.5px,2.35vw,9.5px)!important;}
  .mempelai-page .mempelai-content .person-name{font-size:clamp(20px,5.5vw,25px)!important;}
  .mempelai-page .mempelai-content .parent-line{font-size:clamp(7px,1.9vw,8.2px)!important;}
}


/* V64 — one continuous lace frame for RSVP form and live guestbook. */
.rsvp-page.invitation-section{width:min(100%,390px);margin:0 auto;position:relative;isolation:isolate;overflow:hidden;background:transparent!important;color:#5e4634;padding:18px 8px 18px;}
.rsvp-frame-card{position:relative;width:100%;height:700px;margin:0 auto;}
.rsvp-paper{position:absolute;z-index:1;left:19.5%;top:17%;width:61%;height:68%;box-sizing:border-box;padding:14px 10px 12px;background:linear-gradient(145deg,#fbf7ed,#f4ecdc);border-radius:2px;color:#4f3a2b;overflow:hidden;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;text-align:left;box-shadow:inset 0 0 14px rgba(156,125,75,.09);}
.rsvp-lace-art{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:3;pointer-events:none;user-select:none;}
#rsvpIntroView{display:flex;flex-direction:column;flex:0 0 auto;min-height:0;}
.rsvp-title{font:700 14px/1.12 Georgia,serif;text-align:center;color:#241c19;margin:0 0 6px;overflow-wrap:normal;}
.rsvp-date{font:9px/1.3 Georgia,serif;color:#62564a;margin:0 0 6px;text-align:center;}
.rsvp-venue-line{display:flex;align-items:flex-start;gap:5px;font:600 10px/1.25 Georgia,serif;color:#332b24;margin:0 0 3px;}
.rsvp-pin{font:10px/1.3 Arial,sans-serif;color:#9c7941;flex:0 0 auto;margin-top:1px;}
.rsvp-address{font:8px/1.32 Georgia,serif;color:#665849;white-space:pre-line;margin:0 0 7px 13px;overflow-wrap:anywhere;}
.rsvp-attendance-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:4px;}
.rsvp-choice{min-width:0;min-height:39px;border:1px solid rgba(204,187,157,.55);border-radius:7px;background:rgba(255,255,255,.72);color:#3f352d;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;box-shadow:0 2px 7px rgba(65,45,20,.06);cursor:pointer;font:9px Georgia,serif;}
.rsvp-choice span{font:15px/1 Arial,sans-serif}.rsvp-choice.is-present span{filter:saturate(.85)}.rsvp-choice:active{transform:scale(.98)}
.rsvp-form{display:flex;flex-direction:column;gap:4px;min-height:0;flex:0 0 auto;height:auto;padding-bottom:8px;border-bottom:1px solid rgba(177,143,87,.3);margin-bottom:7px;}
.rsvp-choice-summary{font:600 9px Georgia,serif;color:#7d633c;text-align:center;margin-bottom:1px;}
.rsvp-form label{font:8px Georgia,serif;color:#82786c;margin-top:2px;}
.rsvp-form input,.rsvp-form textarea{width:100%;min-width:0;box-sizing:border-box;border:0;border-bottom:1px solid #d9d0c2;background:rgba(255,255,255,.64);padding:5px 4px;color:#3d3026;font:9px Georgia,serif;outline:none;border-radius:3px;}
.rsvp-form textarea{resize:vertical;min-height:42px;max-height:72px;border:1px solid #e7dfd4;}
.rsvp-form input:focus,.rsvp-form textarea:focus{border-color:#b38b4e;box-shadow:0 0 0 2px rgba(201,166,108,.15)}
.rsvp-form-actions{display:flex;justify-content:space-between;gap:7px;margin-top:4px;}
.rsvp-form-actions button,.rsvp-success button{border:0;border-radius:7px;padding:6px 9px;font:600 8px Georgia,serif;cursor:pointer;}
#rsvpCancel{background:#f1ece4;color:#786d61}.rsvp-submit,.rsvp-success button{background:#211a24;color:#fff7eb;}
.rsvp-success{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:4px;padding:8px 2px 10px;border-bottom:1px solid rgba(177,143,87,.3);margin-bottom:7px;}
.rsvp-success[hidden],.rsvp-form[hidden],#rsvpIntroView[hidden]{display:none!important;}
.success-sparkle{color:#b89150;font-size:20px}.rsvp-success h3{font:700 12px Georgia,serif;margin:0;color:#3d3026}.rsvp-success p{font:9px/1.4 Georgia,serif;margin:0;color:#6e5d4b;}
.inline-guestbook{display:flex;flex-direction:column;min-height:0;flex:1;overflow:hidden;}
.inline-guestbook-heading{flex:0 0 auto;}
.guestbook-kicker{font:600 7px Georgia,serif;letter-spacing:1.7px;text-align:center;color:#aa8b54;margin:2px 0 2px;}
.inline-guestbook h2{font:700 13px/1.15 Georgia,serif;text-align:center;color:#2e2721;margin:0 0 3px;}
.guestbook-intro{font:8px/1.25 Georgia,serif;text-align:center;color:#756657;margin:0 0 5px;}
.guestbook-list{overflow-y:auto;min-height:40px;flex:1;display:flex;flex-direction:column;gap:5px;padding:1px 2px 3px;scrollbar-width:thin;}
.guestbook-empty{font:8px/1.4 Georgia,serif;color:#887968;text-align:center;margin:auto 0;padding:7px 2px;}
.guestbook-entry{position:relative;background:rgba(255,255,255,.66);border:1px solid #eee4d5;border-radius:6px;padding:6px 6px 5px;text-align:left;}
.guestbook-entry h3{font:600 9px Georgia,serif;color:#49372a;margin:0 0 3px;overflow-wrap:anywhere;padding-right:52px;}
.guestbook-attendance{position:absolute;right:5px;top:6px;font:7px Georgia,serif;border-radius:10px;padding:2px 4px;}
.guestbook-attendance.attending{background:#e4f0e3;color:#456b43}.guestbook-attendance.not-attending{background:#f6e5e1;color:#99554c}
.guestbook-entry p{font:8px/1.3 Georgia,serif;color:#6c5a4b;margin:0;white-space:pre-wrap;overflow-wrap:anywhere;}
@media(max-width:380px){.rsvp-page.invitation-section{padding:12px 5px 12px}.rsvp-frame-card{height:650px}.rsvp-paper{left:19.5%;width:61%;top:17%;height:68%;padding:11px 8px 9px}.rsvp-title{font-size:12px}.rsvp-date{font-size:8px}.rsvp-venue-line{font-size:9px}.rsvp-address{font-size:7px;margin-left:11px}.rsvp-choice{min-height:35px;font-size:8px}.rsvp-form textarea{min-height:38px;max-height:60px}.inline-guestbook h2{font-size:12px}.guestbook-intro{font-size:7px}}
@media(prefers-reduced-motion:reduce){.rsvp-choice{transition:none!important}}

/* V65 — compact, balanced RSVP frame: remove oversized floral overlay, keep a clean lace border. */
.rsvp-page.invitation-section{padding:12px 8px 12px!important;}
.rsvp-frame-card{height:600px!important;max-width:374px;}
.rsvp-paper{left:19.5%!important;top:22%!important;width:61%!important;height:61%!important;padding:12px 11px 10px!important;box-sizing:border-box!important;background:#f8f2e6!important;border-radius:2px!important;overflow:hidden!important;}
.rsvp-lace-art{z-index:3;object-fit:fill;}
#rsvpIntroView{position:relative;display:flex;flex-direction:column;flex:0 0 auto;min-height:0;}
.rsvp-title{font:700 clamp(9px,2.8vw,11px)/1.15 Georgia,serif!important;text-align:center!important;white-space:nowrap!important;overflow-wrap:normal!important;color:#4a3022!important;margin:0 0 5px!important;letter-spacing:-.15px;}
.rsvp-date{font:8px/1.25 Georgia,serif!important;text-align:center!important;margin:0 0 5px!important;color:#6e5947!important;}
.rsvp-venue-line{font:600 9px/1.25 Georgia,serif!important;justify-content:center;gap:4px;margin:0 0 3px!important;text-align:center;}
.rsvp-pin{font-size:9px!important;}
.rsvp-address{font:7.2px/1.3 Georgia,serif!important;text-align:center!important;margin:0 0 6px!important;white-space:normal!important;overflow-wrap:anywhere;}
.rsvp-attendance-actions{gap:6px!important;margin-top:3px!important;}
.rsvp-choice{min-height:33px!important;border-radius:6px!important;font:8px Georgia,serif!important;gap:2px!important;}
.rsvp-choice span{font:12px/1 Arial,sans-serif!important;}
.rsvp-form{gap:4px!important;padding-bottom:6px!important;margin-bottom:5px!important;}
.rsvp-form label{font-size:7.5px!important;}
.rsvp-form input,.rsvp-form textarea{font-size:8px!important;padding:4px!important;}
.rsvp-form textarea{min-height:36px!important;max-height:55px!important;}
.rsvp-form-actions button,.rsvp-success button{padding:5px 8px!important;font-size:7.5px!important;}
.rsvp-success{padding:6px 2px 7px!important;margin-bottom:5px!important;}
.rsvp-success h3{font-size:11px!important;}
.rsvp-success p{font-size:8px!important;}
.inline-guestbook h2{font-size:12px!important;margin-bottom:3px!important;}
.guestbook-kicker{font-size:6.5px!important;margin-top:1px!important;}
.guestbook-intro{font-size:7px!important;margin-bottom:4px!important;}
.guestbook-list{min-height:28px!important;}
.guestbook-empty{font-size:7.5px!important;padding:5px 2px!important;}
.guestbook-entry{padding:5px!important;}
.guestbook-entry h3{font-size:8.5px!important;}
.guestbook-entry p{font-size:7.5px!important;}
@media(max-width:380px){
 .rsvp-page.invitation-section{padding:10px 5px!important;}
 .rsvp-frame-card{height:570px!important;}
 .rsvp-paper{left:19.5%!important;top:22%!important;width:61%!important;height:61%!important;padding:10px 8px 8px!important;}
 .rsvp-title{font-size:9px!important;letter-spacing:-.25px!important;}
 .rsvp-date{font-size:7.5px!important;}
 .rsvp-venue-line{font-size:8px!important;}
 .rsvp-address{font-size:6.8px!important;}
 .rsvp-choice{min-height:31px!important;font-size:7.5px!important;}
 .inline-guestbook h2{font-size:11px!important;}
 .guestbook-intro{font-size:6.5px!important;}
}

/* V66 — keep RSVP title/date safely above lace artwork and fully inside the ivory panel. */
.rsvp-paper{z-index:2!important;}
.rsvp-paper > *{position:relative;z-index:4!important;}
.rsvp-lace-art{z-index:3!important;}
#rsvpIntroView{width:100%;box-sizing:border-box;padding-top:3px!important;}
.rsvp-title{display:block!important;visibility:visible!important;opacity:1!important;position:relative!important;z-index:5!important;width:100%!important;max-width:100%!important;font-size:clamp(9px,2.7vw,11px)!important;line-height:1.18!important;white-space:nowrap!important;letter-spacing:-.2px!important;margin:0 0 5px!important;}
.rsvp-date{display:block!important;visibility:visible!important;opacity:1!important;position:relative!important;z-index:5!important;margin:0 0 5px!important;}
.rsvp-venue-line,.rsvp-address,.rsvp-attendance-actions{position:relative!important;z-index:5!important;}
@media(max-width:380px){
 .rsvp-title{font-size:clamp(8.5px,2.55vw,9.7px)!important;letter-spacing:-.28px!important;}
 .rsvp-paper{padding-top:9px!important;}
}

/* V67 — FIX stacking: the lace PNG was covering RSVP title/date. Keep the decorative frame behind the ivory content panel. */
.rsvp-frame-card{isolation:isolate!important;position:relative!important;}
.rsvp-lace-art{position:absolute!important;z-index:1!important;inset:0!important;pointer-events:none!important;}
.rsvp-paper{position:absolute!important;z-index:2!important;}
.rsvp-paper > *{position:relative;z-index:auto!important;}
#rsvpIntroView{position:relative!important;z-index:1!important;}
.rsvp-title,.rsvp-date,.rsvp-venue-line,.rsvp-address,.rsvp-attendance-actions{visibility:visible!important;opacity:1!important;}

/* V68 — align RSVP ivory content panel exactly with the transparent opening in the lace PNG.
   The prior 22%/61% geometry placed the paper above the inner opening and let content spill across the lace. */
.rsvp-frame-card{position:relative!important;isolation:isolate!important;overflow:visible!important;}
.rsvp-lace-art{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:fill!important;z-index:1!important;pointer-events:none!important;}
.rsvp-paper{position:absolute!important;left:20.2%!important;top:28.7%!important;width:59.6%!important;height:53.7%!important;box-sizing:border-box!important;z-index:2!important;padding:8px 9px 7px!important;background:#f8f2e6!important;border-radius:1px!important;overflow:hidden!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;}
.rsvp-paper > *{position:relative!important;z-index:1!important;min-width:0!important;}
#rsvpIntroView{width:100%!important;box-sizing:border-box!important;padding:0!important;flex:0 0 auto!important;}
.rsvp-title{font:700 clamp(8px,2.45vw,10px)/1.15 Georgia,serif!important;white-space:normal!important;text-wrap:balance!important;overflow-wrap:anywhere!important;letter-spacing:-.15px!important;margin:0 0 4px!important;text-align:center!important;}
.rsvp-date{font:7.5px/1.2 Georgia,serif!important;margin:0 0 4px!important;text-align:center!important;}
.rsvp-venue-line{font:600 8px/1.2 Georgia,serif!important;justify-content:center!important;text-align:center!important;margin:0 0 2px!important;}
.rsvp-address{font:6.6px/1.25 Georgia,serif!important;text-align:center!important;margin:0 0 4px!important;white-space:normal!important;overflow-wrap:anywhere!important;}
.rsvp-attendance-actions{grid-template-columns:1fr 1fr!important;gap:5px!important;margin-top:2px!important;}
.rsvp-choice{min-height:29px!important;font:7.5px Georgia,serif!important;}
.rsvp-choice span{font:11px/1 Arial,sans-serif!important;}
.rsvp-form{gap:3px!important;padding-bottom:5px!important;margin-bottom:5px!important;}
.rsvp-form label{font-size:7px!important;}
.rsvp-form input,.rsvp-form textarea{font-size:7.5px!important;padding:3px!important;}
.rsvp-form textarea{min-height:32px!important;max-height:44px!important;}
.rsvp-form-actions button,.rsvp-success button{padding:4px 7px!important;font-size:7px!important;}
.rsvp-success{padding:5px 2px 5px!important;margin-bottom:4px!important;}
.rsvp-success h3{font-size:10px!important;}
.rsvp-success p{font-size:7.5px!important;}
.inline-guestbook{flex:1 1 auto!important;min-height:0!important;overflow:hidden!important;}
.inline-guestbook h2{font-size:11px!important;margin-bottom:2px!important;}
.guestbook-kicker{font-size:6px!important;margin:1px 0!important;}
.guestbook-intro{font-size:6.5px!important;line-height:1.2!important;margin:0 0 3px!important;}
.guestbook-list{flex:1 1 0!important;min-height:0!important;overflow-y:auto!important;}
.guestbook-empty{font-size:7px!important;padding:4px 2px!important;}
.guestbook-entry{padding:4px!important;}
.guestbook-entry h3{font-size:8px!important;}
.guestbook-entry p{font-size:7px!important;}
@media(max-width:380px){
 .rsvp-frame-card{height:570px!important;}
 .rsvp-paper{left:20.2%!important;top:28.7%!important;width:59.6%!important;height:53.7%!important;padding:7px 7px 6px!important;}
 .rsvp-title{font-size:clamp(7.6px,2.35vw,8.8px)!important;}
 .rsvp-date{font-size:7px!important;}
 .rsvp-venue-line{font-size:7.5px!important;}
 .rsvp-address{font-size:6.2px!important;}
 .rsvp-choice{min-height:27px!important;font-size:7px!important;}
 .inline-guestbook h2{font-size:10px!important;}
 .guestbook-intro{font-size:6px!important;}
}

/* V69 — RSVP title hierarchy and tighter transition from event section.
   Keep the approved V62 couple typography untouched. */
.rsvp-page.invitation-section{
  margin-top:-58px!important;
  padding-top:10px!important;
}
.rsvp-title{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  font:700 clamp(11px,3.15vw,13px)/1.16 Georgia,serif!important;
  text-align:center!important;
  white-space:nowrap!important;
  overflow-wrap:normal!important;
  letter-spacing:-.18px!important;
  margin:0 0 4px!important;
}
@media(max-width:380px){
  .rsvp-page.invitation-section{margin-top:-50px!important;padding-top:8px!important;}
  .rsvp-title{font-size:clamp(10px,3.05vw,11.6px)!important;letter-spacing:-.28px!important;}
}


/* V71 — Index full-page sync: lift the couple text group slightly on wider
   standalone index.html viewports. The editor iframe/phone preview remains unchanged. */
@media (min-width:450px){
  .mempelai-page .mempelai-content{
    top:calc(18.5% - 8px)!important;
  }
}


/* V71-CLOSING-01 — Penutup baru dibangun per elemen.
   Background mengikuti hijau polos area RSVP. Hanya elemen Penutup yang ditambahkan. */
.closing-page.invitation-section{
  width:min(100%,390px)!important;
  height:330px;
  min-height:330px;
  margin:0 auto!important;
  position:relative;
  overflow:hidden;
  background:#719FC5!important;
  color:#4f3a2b;
  isolation:isolate;
}
.closing-photo-mount{
  position:absolute;
  top:28px;
  left:50%;
  transform:translateX(-50%);
  width:166px;
  height:204px;
  padding:0;
  background:#fffdf8;
  border:0;
  box-shadow:0 3px 12px rgba(0,0,0,.16);
  z-index:2;
}
/* Inner photo opening: intentionally blank; the editor injects the selected image here. */
.closing-photo-slot{
  position:absolute;
  left:7px;
  top:7px;
  width:152px;
  height:145px;
  background:transparent;
  overflow:hidden;
}
.closing-photo-slot img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  transform-origin:center center;
}
@media(max-width:380px){
  .closing-page.invitation-section{height:315px;min-height:315px;}
  .closing-photo-mount{top:25px;width:160px;height:197px;}
  .closing-photo-slot{left:7px;top:7px;width:146px;height:139px;}
}


/* V74-CLOSING-FLOWERS — refine only the Penutup floral layer.
   The red bouquet is lifted so its upper blooms begin at the photo top,
   while the white calla arrangement sits behind the photo on the right,
   matching the supplied reference. Other pages and the photo frame geometry remain unchanged. */
.closing-page.invitation-section{
  background:#A9CBE7!important;
}
.closing-floral-red{
  position:absolute!important;
  width:340px!important;
  height:auto!important;
  left:-18px!important;
  top:2px!important;
  z-index:3!important;
  display:block!important;
  max-width:none!important;
  pointer-events:none!important;
  user-select:none!important;
  object-fit:contain!important;
  filter:drop-shadow(0 3px 5px rgba(0,0,0,.18));
}
.closing-floral-white{
  position:absolute!important;
  left:56%!important;
  top:4px!important;
  width:32%!important;
  height:auto!important;
  max-width:none!important;
  z-index:1!important;
  display:block!important;
  pointer-events:none!important;
  user-select:none!important;
  object-fit:contain!important;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.12));
}
.closing-photo-mount{z-index:2!important;}
@media(max-width:380px){
  .closing-floral-red{
    width:330px!important;
    left:-16px!important;
    top:2px!important;
  }
  .closing-floral-white{
    left:56%!important;
    top:3px!important;
    width:32%!important;
  }
}


/* V75 — Penutup layer order only.
   Reference composition: white calla remains behind the photo;
   red bouquet sits in front of/overlaps the left side of the photo.
   No geometry or other pages changed. */
.closing-floral-white{z-index:1!important;}
.closing-photo-mount{z-index:2!important;}
.closing-floral-red{z-index:3!important;}

/* V82 — WHITE FLOWER POSITION ONLY
   Baseline: V75. Preserve red bouquet, photo frame, text, paper, seal,
   RSVP, background, and all other pages. Adjust only the white calla
   arrangement to follow the supplied closing-page reference composition. */
.closing-floral-white{
  left:60%!important;
  top:2px!important;
  width:31%!important;
  z-index:1!important;
}
@media(max-width:380px){
  .closing-floral-white{
    left:60%!important;
    top:2px!important;
    width:31%!important;
  }
}


/* V83 — PENUTUP REFERENCE ALIGNMENT ONLY
   Existing elements only. Match the supplied reference:
   photo shifted left, white calla kept behind/right of photo,
   red bouquet positioned lower and slightly inward.
   No new elements; all other pages/files remain untouched. */
.closing-page.invitation-section{
  overflow:hidden!important;
}
.closing-photo-mount{
  left:43.5%!important;
  top:25px!important;
  width:162px!important;
  height:197px!important;
}
.closing-photo-slot{
  left:7px!important;
  top:7px!important;
  width:148px!important;
  height:139px!important;
}
.closing-floral-white{
  left:58.5%!important;
  top:2px!important;
  width:30%!important;
  z-index:1!important;
}
.closing-floral-red{
  width:320px!important;
  left:15px!important;
  top:50px!important;
  z-index:3!important;
}
@media(max-width:380px){
  .closing-photo-mount{
    left:43.5%!important;
    top:25px!important;
    width:162px!important;
    height:197px!important;
  }
  .closing-photo-slot{
    left:7px!important;
    top:7px!important;
    width:148px!important;
    height:139px!important;
  }
  .closing-floral-white{
    left:58.5%!important;
    top:2px!important;
    width:30%!important;
  }
  .closing-floral-red{
    width:320px!important;
    left:15px!important;
    top:50px!important;
  }
}


/* V84 — PENUTUP REFERENCE FINAL ALIGNMENT
   Only existing Penutup elements are adjusted.
   - Red bouquet slightly slimmer so it does not cover too much of the photo.
   - White calla remains behind the photo mount so its stem visually joins the photo.
   - Entire Penutup section is lifted until the white flower reaches the preceding box.
   No new elements and no other pages changed. */
.closing-page.invitation-section{
  margin-top:-20px!important;
}
.closing-floral-red{
  width:280px!important;
  left:3px!important;
  top:50px!important;
  z-index:3!important;
}
.closing-floral-white{
  z-index:1!important;
}
.closing-photo-mount{
  z-index:2!important;
}
@media(max-width:380px){
  .closing-page.invitation-section{
    margin-top:-20px!important;
  }
  .closing-floral-red{
    width:280px!important;
    left:3px!important;
    top:50px!important;
  }
}


/* V85 — PENUTUP "WE ARE GETTING MARRIED" TEXT
   Only the supplied closing text is added. Position and typography follow
   the supplied reference while preserving all existing Penutup elements. */
.closing-message{
  position:absolute!important;
  top:62px!important;
  right:4px!important;
  width:158px!important;
  z-index:4!important;
  color:#fffdf4!important;
  text-align:center!important;
  pointer-events:none!important;
}
.closing-message h2{
  margin:0!important;
  font-family:'Alex Brush','Great Vibes',cursive!important;
  font-size:31px!important;
  line-height:.88!important;
  font-weight:400!important;
  letter-spacing:.2px!important;
  color:#fffdf4!important;
  text-shadow:0 1px 2px rgba(0,0,0,.18)!important;
}
.closing-message p{
  margin:17px 0 0!important;
  font-family:Georgia,'Times New Roman',serif!important;
  font-size:7.7px!important;
  line-height:1.38!important;
  font-weight:400!important;
  letter-spacing:.05px!important;
  color:#fffdf4!important;
  text-align:left!important;
}
@media(max-width:380px){
  .closing-message{
    top:62px!important;
    right:3px!important;
    width:156px!important;
  }
  .closing-message h2{
    font-size:30px!important;
  }
  .closing-message p{
    font-size:7.4px!important;
    line-height:1.36!important;
    margin-top:16px!important;
  }
}


/* V86 — PENUTUP TEXT RE-ALIGNMENT TO SUPPLIED REFERENCE
   Adjust only the existing closing message. Keep all flowers, photo,
   RSVP and other pages/elements unchanged. */
.closing-message{
  top:125px!important;
  right:0!important;
  width:142px!important;
  z-index:4!important;
}
.closing-message h2{
  font-size:30px!important;
  line-height:.86!important;
}
.closing-message p{
  margin-top:15px!important;
  font-size:7.2px!important;
  line-height:1.35!important;
}
@media(max-width:380px){
  .closing-message{
    top:118px!important;
    right:0!important;
    width:140px!important;
  }
  .closing-message h2{font-size:29px!important;}
  .closing-message p{
    margin-top:14px!important;
    font-size:7px!important;
    line-height:1.34!important;
  }
}


/* V87 — PENUTUP COMPOSITION REFINEMENT
   Existing elements only. Refine the three-way composition to echo the supplied
   reference: photo as the left focal point, white calla as a bridge behind the
   photo, and the message separated cleanly on the right. No new elements and
   no other pages changed. */
.closing-photo-mount{
  left:42%!important;
  top:25px!important;
  width:156px!important;
  height:190px!important;
  z-index:2!important;
}
.closing-photo-slot{
  left:7px!important;
  top:7px!important;
  width:142px!important;
  height:133px!important;
}
.closing-floral-white{
  left:58%!important;
  top:0!important;
  width:29%!important;
  z-index:1!important;
}
.closing-floral-red{
  width:260px!important;
  left:-2px!important;
  top:50px!important;
  z-index:3!important;
}
.closing-message{
  top:132px!important;
  right:2px!important;
  width:130px!important;
  z-index:4!important;
}
.closing-message h2{
  font-size:29px!important;
  line-height:.88!important;
}
.closing-message p{
  margin-top:15px!important;
  font-size:7px!important;
  line-height:1.34!important;
}
@media(max-width:380px){
  .closing-photo-mount{
    left:42%!important;
    top:25px!important;
    width:152px!important;
    height:185px!important;
  }
  .closing-photo-slot{
    left:7px!important;
    top:7px!important;
    width:138px!important;
    height:129px!important;
  }
  .closing-floral-white{
    left:58%!important;
    top:0!important;
    width:29%!important;
  }
  .closing-floral-red{
    width:255px!important;
    left:-2px!important;
    top:50px!important;
  }
  .closing-message{
    top:128px!important;
    right:2px!important;
    width:128px!important;
  }
  .closing-message h2{font-size:28px!important;}
  .closing-message p{
    margin-top:14px!important;
    font-size:6.8px!important;
    line-height:1.33!important;
  }
}


/* V88 — PENUTUP PAPER + CLOSING TEXT
   Menambahkan hanya ornamen kertas yang diberikan pengguna dan teks di atasnya.
   Komposisi mengikuti referensi: kertas berada di bawah foto/pesan, seal di tengah
   tepi atas, dan bouquet tetap dapat overlap dari sisi kiri. */
.closing-paper-wrap{
  position:absolute!important;
  left:50%!important;
  top:304px!important;
  width:300px!important;
  height:175px!important;
  transform:translateX(-50%)!important;
  z-index:1!important;
  pointer-events:none!important;
}
.closing-paper-art{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:fill!important;
  z-index:0!important;
}
.closing-paper-text{
  position:absolute!important;
  left:27px!important;
  right:27px!important;
  top:43px!important;
  z-index:1!important;
  color:#5b4634!important;
  text-align:center!important;
  font-family:Georgia,'Times New Roman',serif!important;
}
.closing-paper-text p{
  margin:0!important;
  font-size:9px!important;
  line-height:1.42!important;
  font-weight:400!important;
}
.closing-paper-text .closing-thanks{
  margin-top:10px!important;
  font-size:10px!important;
}
.closing-names{
  margin-top:4px!important;
  font-family:'Alex Brush','Great Vibes','Cormorant Garamond',cursive!important;
  font-size:31px!important;
  line-height:1!important;
  color:#466B8C!important;
}
.closing-floral-red{z-index:3!important;}
.closing-photo-mount{z-index:2!important;}
.closing-floral-white{z-index:1!important;}
.closing-message{z-index:4!important;}
.closing-page.invitation-section{
  height:500px!important;
  min-height:500px!important;
}
@media(max-width:380px){
  .closing-paper-wrap{
    top:298px!important;
    width:292px!important;
    height:170px!important;
  }
  .closing-paper-text{
    left:25px!important;
    right:25px!important;
    top:41px!important;
  }
  .closing-paper-text p{
    font-size:8.5px!important;
    line-height:1.4!important;
  }
  .closing-paper-text .closing-thanks{
    margin-top:9px!important;
    font-size:9.5px!important;
  }
  .closing-names{
    font-size:29px!important;
  }
  .closing-page.invitation-section{
    height:490px!important;
    min-height:490px!important;
  }
}


/* V89 — PENUTUP FINAL REFERENCE CLEANUP
   Existing Penutup elements only. Align the message, paper, and red bouquet
   to the supplied reference without adding new decorative elements.
   - Small paragraph lifted and kept clear of the white calla.
   - Heading lifted and moved right with safe screen-side breathing room.
   - Paper moved upward.
   - Paper text moved downward to clear the round wax seal.
   - Red bouquet remains above/in front of the paper.
*/
.closing-message{
  top:105px!important;
  right:10px!important;
  width:112px!important;
  z-index:4!important;
}
.closing-message h2{
  font-size:28px!important;
  line-height:.88!important;
}
.closing-message p{
  margin-top:10px!important;
  font-size:6.9px!important;
  line-height:1.34!important;
  text-align:left!important;
}
.closing-paper-wrap{
  top:276px!important;
  z-index:1!important;
}
.closing-paper-text{
  top:54px!important;
}
.closing-floral-red{
  z-index:3!important;
}
.closing-floral-white{
  z-index:1!important;
}
.closing-photo-mount{
  z-index:2!important;
}
@media(max-width:380px){
  .closing-message{
    top:101px!important;
    right:9px!important;
    width:110px!important;
  }
  .closing-message h2{
    font-size:27px!important;
  }
  .closing-message p{
    margin-top:9px!important;
    font-size:6.7px!important;
    line-height:1.33!important;
  }
  .closing-paper-wrap{
    top:270px!important;
  }
  .closing-paper-text{
    top:53px!important;
  }
}


/* V90 — PENUTUP: BACKGROUND TEXTURE + FINAL FLOWER/PAPER POLISH
   Only the requested Penutup elements are adjusted.
   The supplied botanical texture is used as an additional background layer. */
.closing-page.invitation-section{
  background:#A9CBE7 url("assets/closing-background-texture.png") center center / cover no-repeat!important;
}
.closing-page.invitation-section::before{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(4,43,30,.10);
  z-index:0;
  pointer-events:none;
}
.closing-floral-white{
  left:57%!important;
  top:0!important;
  width:31%!important;
  transform:rotate(5deg)!important;
  transform-origin:35% 100%!important;
  z-index:1!important;
}
.closing-photo-mount{z-index:2!important;}
.closing-floral-red{z-index:3!important;}
.closing-message{z-index:4!important;}
.closing-paper-wrap{
  top:248px!important;
  z-index:1!important;
}
.closing-paper-text{
  top:54px!important;
}
@media(max-width:380px){
  .closing-floral-white{
    left:56%!important;
    top:0!important;
    width:31%!important;
    transform:rotate(5deg)!important;
    transform-origin:35% 100%!important;
  }
  .closing-paper-wrap{
    top:244px!important;
  }
  .closing-paper-text{
    top:53px!important;
  }
}


/* V91 — PENUTUP: TEXTURE STRIP + PAPER LIFT
   Requested final refinement:
   - Deep green base instead of a full-page texture.
   - Botanical texture only as a short decorative band immediately above paper.
   - Clear breathing room before the wax seal.
   - Paper lifted slightly; existing elements otherwise preserved.
*/
.closing-page.invitation-section{
  background:#A9CBE7!important;
  position:relative!important;
  overflow:hidden!important;
}

/* Short texture band only above the paper; it does not cover the whole page. */
.closing-page.invitation-section::before{
  content:""!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  top:210px!important;
  height:25px!important;
  background:url("assets/closing-background-texture.png") center center / cover no-repeat!important;
  opacity:.72!important;
  z-index:0!important;
  pointer-events:none!important;
}

/* Keep the paper above the texture strip and lift it slightly. */
.closing-paper-wrap{
  top:238px!important;
  z-index:1!important;
}
.closing-paper-text{
  top:54px!important;
}

/* Preserve intended flower/photo/message layer order. */
.closing-floral-white{z-index:1!important;}
.closing-photo-mount{z-index:2!important;}
.closing-floral-red{z-index:3!important;}
.closing-message{z-index:4!important;}

@media(max-width:380px){
  .closing-page.invitation-section::before{
    top:206px!important;
    height:24px!important;
  }
  .closing-paper-wrap{
    top:236px!important;
  }
  .closing-paper-text{
    top:53px!important;
  }
}


/* V92 — PENUTUP: LOWER BOTANICAL TEXTURE TO MATCH REFERENCE
   Only the Penutup background is refined.
   The botanical texture begins around the middle of the round wax seal
   and continues to the bottom, while the upper area remains deep green.
   Paper, seal, flowers, photo, message, typography, and all other pages
   remain unchanged.
*/
.closing-page.invitation-section::before{
  content:""!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  top:292px!important;
  bottom:0!important;
  height:auto!important;
  background:url("assets/closing-background-texture.png") center bottom / cover no-repeat!important;
  opacity:.72!important;
  z-index:0!important;
  pointer-events:none!important;
}
@media(max-width:380px){
  .closing-page.invitation-section::before{
    top:263px!important;
    bottom:0!important;
    height:auto!important;
    background-position:center bottom!important;
    background-size:cover!important;
  }
}


/* V93 — PENUTUP: RAISE TEXTURE TO ABOVE PAPER, BELOW TOP OF WAX SEAL
   Only the Penutup background texture position is changed.
   Texture begins just below the top edge of the round brown seal and
   continues behind/around the paper to the bottom. All other elements
   and all other pages remain unchanged.
*/
.closing-page.invitation-section::before{
  top:248px!important;
  bottom:0!important;
  height:auto!important;
  background-position:center bottom!important;
  background-size:cover!important;
}
@media(max-width:380px){
  .closing-page.invitation-section::before{
    top:246px!important;
    bottom:0!important;
    height:auto!important;
    background-position:center bottom!important;
    background-size:cover!important;
  }
}


/* V94 — OVERALL VISUAL POLISH
   Subtle refinement across the invitation without changing layout/content.
   Existing elements only: typography hierarchy, soft depth, restrained gold accents,
   and cleaner spacing. No structural changes. */

/* Shared premium text rendering */
.invitation-section{
  -webkit-font-smoothing:antialiased!important;
  text-rendering:optimizeLegibility!important;
}

/* Event page: slightly more editorial hierarchy and softer card depth. */
.event-page .event-heading h2{
  letter-spacing:.15px!important;
}
.event-page .event-heading-rule{
  opacity:.92!important;
}
.event-page .event-card,
.event-page .event-location{
  box-shadow:
    0 8px 20px rgba(0,0,0,.14),
    inset 0 0 0 1px rgba(255,255,255,.42)!important;
}
.event-page .event-card{
  transition:transform .2s ease,box-shadow .2s ease!important;
}
.event-page .event-icon{
  text-shadow:0 1px 5px rgba(201,166,108,.16)!important;
}

/* RSVP: warmer paper hierarchy and more premium controls. */
.rsvp-paper{
  background:
    linear-gradient(145deg,rgba(255,252,244,.99),rgba(246,237,220,.98))!important;
  box-shadow:
    inset 0 0 16px rgba(156,125,75,.075),
    0 5px 16px rgba(35,24,14,.07)!important;
}
.rsvp-title{
  letter-spacing:.15px!important;
}
.rsvp-choice{
  background:linear-gradient(145deg,rgba(255,255,255,.82),rgba(249,244,235,.72))!important;
  border-color:rgba(190,157,99,.42)!important;
  box-shadow:0 3px 9px rgba(65,45,20,.07),inset 0 1px rgba(255,255,255,.7)!important;
}
.rsvp-form input:focus,
.rsvp-form textarea:focus{
  border-color:#b99a64!important;
  box-shadow:0 2px 0 rgba(185,154,100,.12)!important;
}
.rsvp-submit{
  box-shadow:0 5px 13px rgba(74,48,23,.16),inset 0 1px rgba(255,255,255,.28)!important;
}

/* Closing: make the typography feel more intentional without moving elements. */
.closing-message h2{
  color:#fff8e9!important;
  text-shadow:0 1px 3px rgba(0,0,0,.22),0 0 10px rgba(230,204,153,.08)!important;
}
.closing-message p{
  color:#f4ead7!important;
}
.closing-paper-text{
  color:#5b4634!important;
}
.closing-paper-text p{
  letter-spacing:.02px!important;
}
.closing-paper-text .closing-thanks{
  color:#765b42!important;
  letter-spacing:.35px!important;
}
.closing-names{
  color:#466B8C!important;
  text-shadow:0 .5px 0 rgba(255,255,255,.32)!important;
}

/* Very small botanical-style divider accents, using existing heading rules only. */
.event-heading-rule:before,
.event-heading-rule:after{
  height:1px!important;
  opacity:.82!important;
}

/* Preserve reduced-motion accessibility. */
@media(prefers-reduced-motion:reduce){
  .event-page .event-card{transition:none!important;}
}


/* V95 — PENUTUP: NATURAL WHITE-FLORAL LAYERING
   Final micro-adjustment requested: let the lower stem of the white calla
   arrangement tuck subtly behind the photo frame, while keeping the blooms
   visible and preserving all other Penutup geometry and all other pages. */
.closing-floral-white{
  left:51%!important;
  top:0!important;
  width:31%!important;
  z-index:1!important;
}
.closing-photo-mount{
  z-index:2!important;
}
.closing-floral-red{
  z-index:3!important;
}
@media(max-width:380px){
  .closing-floral-white{
    left:50%!important;
    top:0!important;
    width:31%!important;
  }
}


/* V97 — FINAL FLOW / COVER GATE
   Cover is a true landing page: no scrolling to Opening until the CTA is clicked. */
body.invitation-flow.cover-locked{
  overflow-y:hidden!important;
  height:100vh!important;
  overscroll-behavior:none!important;
}
body.invitation-flow.cover-locked #cover{
  touch-action:none!important;
}
body.invitation-flow.cover-locked .invitation-section:not(#cover){
  visibility:hidden!important;
  pointer-events:none!important;
}
body.invitation-flow.cover-unlocked{
  overflow-y:auto!important;
  height:auto!important;
}

/* V97 — Opening music control at the lower-right corner. */
.opening-page .music-button{
  position:absolute!important;
  right:18px!important;
  bottom:18px!important;
  margin:0!important;
  width:48px!important;
  height:48px!important;
}
.opening-page .music-caption{
  position:absolute!important;
  right:14px!important;
  bottom:68px!important;
  margin:0!important;
  font-size:12px!important;
  text-align:right!important;
  opacity:.9!important;
}

/* V97 — closing message paragraph closer to the photo. */
.closing-message{
  right:18px!important;
  width:118px!important;
}
.closing-message p{
  max-width:118px!important;
}
@media(max-width:380px){
  .closing-message{
    right:17px!important;
    width:116px!important;
  }
  .closing-message p{max-width:116px!important;}
}


/* V98 — COVER LANDING HARDENING
   Keep the cover visibly present even when the page is opened directly.
   While locked, the cover becomes the only fixed viewport layer; after the
   CTA is clicked the rule no longer applies and the normal document flow resumes. */
body.invitation-flow.cover-locked{
  overflow:hidden!important;
  height:100vh!important;
  min-height:100vh!important;
  overscroll-behavior:none!important;
}
body.invitation-flow.cover-locked #cover{
  position:fixed!important;
  top:0!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  width:min(100%,390px)!important;
  height:100vh!important;
  min-height:640px!important;
  z-index:10000!important;
  visibility:visible!important;
  opacity:1!important;
  display:block!important;
  touch-action:none!important;
}
body.invitation-flow.cover-unlocked #cover{
  position:relative!important;
  top:auto!important;
  left:auto!important;
  transform:none!important;
  z-index:auto!important;
  height:844px!important;
  min-height:844px!important;
}
@media(max-width:380px){
  body.invitation-flow.cover-unlocked #cover{
    height:100svh!important;
    min-height:640px!important;
  }
}

/* V98 — Music control: persistent lower-right corner of the invitation viewport. */
.opening-page .music-button{
  position:fixed!important;
  right:16px!important;
  bottom:16px!important;
  left:auto!important;
  top:auto!important;
  margin:0!important;
  width:46px!important;
  height:46px!important;
  z-index:99999!important;
  border-radius:50%!important;
  display:grid!important;
  place-items:center!important;
}
.opening-page .music-caption{
  display:none!important;
}

/* V98 — Closing typography spacing. */
.closing-message{
  right:8px!important;
  width:118px!important;
}
.closing-message p{
  max-width:118px!important;
}
.closing-paper-text{
  top:67px!important;
}
@media(max-width:380px){
  .closing-message{
    right:7px!important;
    width:116px!important;
  }
  .closing-message p{max-width:116px!important;}
  .closing-paper-text{top:63px!important;}
}


/* V99 — CONSISTENT 390px INVITATION CANVAS
   The editor preview is a 390px phone canvas. On a desktop browser the public
   index keeps the exact same canvas width, preventing vw-based artwork from
   reflowing differently outside the editor iframe. */
html:has(body.invitation-flow){
  background:#A9CBE7!important;
}
body.invitation-flow{
  width:390px!important;
  max-width:390px!important;
  margin:0 auto!important;
  background:#A9CBE7!important;
}
@media(max-width:390px){
  body.invitation-flow{
    width:100%!important;
    max-width:390px!important;
  }
}
@media(min-width:391px){
  body.invitation-flow{
    margin-left:auto!important;
    margin-right:auto!important;
  }
}

/* Keep the music control anchored to the invitation canvas, not the wide desktop viewport. */
.opening-page .music-button{
  right:max(16px, calc((100vw - 390px)/2 + 16px))!important;
  bottom:16px!important;
}

/* V99 — CLOSING BRAND FOOTER */
.site-footer{
  position:relative;
  width:100%;
  min-height:104px;
  margin:0 auto;
  padding:20px 18px 24px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:9px;
  text-align:center;
  background:
    linear-gradient(180deg,rgba(3,48,31,.90),rgba(3,48,31,.94)),
    url('assets/closing-background-texture.png') center/cover;
  color:#f3ead7;
  border-top:1px solid rgba(225,197,132,.24);
  box-shadow:inset 0 10px 22px rgba(0,0,0,.07);
  font-family:'Cormorant Garamond',Georgia,serif;
}
.site-footer-credit{
  font-size:11px;
  line-height:1.2;
  letter-spacing:.65px;
  color:#f1e7d1;
}
.site-footer-credit strong{
  font-weight:600;
  color:#E9B9C8;
}
.site-footer-links{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:15px;
  flex-wrap:wrap;
}
.site-footer-link{
  display:inline-flex;
  align-items:center;
  gap:5px;
  color:#f5ecd9!important;
  text-decoration:none!important;
  font-size:9.5px;
  line-height:1;
  letter-spacing:.2px;
  opacity:.96;
  transition:opacity .2s ease, transform .2s ease;
}
.site-footer-link:hover,
.site-footer-link:focus-visible{
  opacity:1;
  transform:translateY(-1px);
}
.footer-icon{
  width:17px;
  height:17px;
  display:grid;
  place-items:center;
  border:1px solid rgba(231,201,121,.68);
  color:#E9B9C8;
  border-radius:50%;
  font-family:Arial,sans-serif;
  font-size:10px;
  line-height:1;
}
.footer-instagram{
  font-size:12px;
  font-weight:600;
}
@media(max-width:390px){
  .site-footer{min-height:100px;padding:19px 14px 23px;}
  .site-footer-links{gap:12px;}
  .site-footer-link{font-size:9px;}
}

/* V101 — CLOSING FOOTER CONTINUITY
   Continue the botanical texture from the closing page into the brand footer,
   with a dark veil so the ivory/gold links remain readable. */
.site-footer{
  background:
    linear-gradient(180deg,rgba(3,48,31,.86),rgba(3,48,31,.95)),
    url('assets/closing-background-texture.png') center/cover!important;
  background-attachment:scroll!important;
}
.site-footer:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(1,31,20,.10),rgba(1,31,20,.22));
  z-index:0;
}
.site-footer > *{
  position:relative;
  z-index:1;
}

/* V101 — OPENING REVEAL
   Standalone index reveals the Opening from its top edge downward, rather
   than visually sliding the new page upward from the bottom of the viewport. */
.opening-page.opening-reveal{
  animation:openingRevealTopDown 1050ms cubic-bezier(.22,.7,.2,1) both;
  transform-origin:top center;
}
@keyframes openingRevealTopDown{
  0%{clip-path:inset(0 0 100% 0);opacity:.96;}
  100%{clip-path:inset(0 0 0 0);opacity:1;}
}
@media (prefers-reduced-motion:reduce){
  .opening-page.opening-reveal{animation:none!important;clip-path:none!important;}
}

/* V102 — PUBLIC INDEX / EDITOR CANVAS CONSISTENCY
   The invitation remains a 390x844 design canvas. On a short desktop
   viewport, scale the locked cover uniformly instead of changing its
   internal height and breaking text/button positions. */
body.invitation-flow.cover-locked #cover{
  width:390px!important;
  height:844px!important;
  min-height:844px!important;
  max-height:844px!important;
  transform:translateX(-50%) scale(var(--cover-scale,1))!important;
  transform-origin:top center!important;
}
body.invitation-flow.cover-locked{
  --cover-scale:1;
}
@media (max-height:900px) and (min-width:391px){
  body.invitation-flow.cover-locked{
    --cover-scale:min(1, calc((100vh - 2px) / 844));
  }
}
@media (max-width:390px){
  body.invitation-flow.cover-locked #cover{
    width:100%!important;
    min-width:0!important;
    max-width:390px!important;
    transform:translateX(-50%) scale(1)!important;
  }
}


/* V103 — PUBLIC INDEX CANVAS CENTERING + COVER GUEST STACK
   Final correction: never constrain the BODY itself to 390px. The invitation
   canvas is 390px, while the page viewport remains full width. This prevents
   fixed Cover from being offset to the right on desktop browsers.
   Cover guest block is positioned below the gold frame, matching the approved
   editor mobile preview. */
html:has(body.invitation-flow){
  width:100%!important;
  min-width:0!important;
  overflow-x:hidden!important;
}
body.invitation-flow{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  position:relative!important;
  left:auto!important;
  right:auto!important;
}
body.invitation-flow.cover-locked #cover{
  left:50vw!important;
  margin:0!important;
  width:390px!important;
  height:844px!important;
  min-height:844px!important;
  max-height:844px!important;
  transform:translateX(-50%) scale(var(--cover-scale,1))!important;
  transform-origin:top center!important;
}
body.invitation-flow.cover-unlocked #cover{
  width:390px!important;
  max-width:390px!important;
  height:844px!important;
  min-height:844px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  transform:none!important;
  left:auto!important;
}

/* Match the previously approved mobile preview: guest text sits clearly
   below the gold frame, with the CTA beneath it. */
body.invitation-flow #cover .guest{
  top:674px!important;
  bottom:auto!important;
  width:100%!important;
  z-index:8!important;
  text-align:center!important;
}
body.invitation-flow #cover .guest div{
  font-size:12px!important;
  line-height:1.15!important;
  margin:0!important;
}
body.invitation-flow #cover .guest h2{
  margin:5px 8px 0!important;
  font-size:22px!important;
  line-height:1.05!important;
  font-weight:600!important;
}
body.invitation-flow #cover .button{
  bottom:49px!important;
  z-index:9!important;
}

/* Keep the cover fully centered on narrow phones too. */
@media(max-width:390px){
  body.invitation-flow{
    width:100%!important;
  }
  body.invitation-flow.cover-locked #cover{
    left:50%!important;
    width:100%!important;
    max-width:390px!important;
    transform:translateX(-50%)!important;
  }
  body.invitation-flow.cover-unlocked #cover{
    width:100%!important;
    max-width:390px!important;
  }
}


/* V104 — FINAL PUBLIC COVER POSITIONING
   Keep the invitation as a 390x844 mobile canvas while the desktop viewport
   remains full width. Center the locked cover against the actual viewport,
   not the document/body width. Scale the whole canvas uniformly when the
   browser viewport is shorter than the mobile canvas so internal coordinates
   never reflow or overlap.
*/
html:has(body.invitation-flow){
  width:100%!important;
  min-width:0!important;
  overflow-x:hidden!important;
}
body.invitation-flow{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  overflow-x:hidden!important;
}
body.invitation-flow.cover-locked #cover{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  top:50%!important;
  margin:0!important;
  width:390px!important;
  height:844px!important;
  min-width:390px!important;
  min-height:844px!important;
  max-width:390px!important;
  max-height:844px!important;
  transform:translate(-50%,-50%) scale(var(--cover-scale,1))!important;
  transform-origin:center center!important;
  z-index:10000!important;
}
body.invitation-flow.cover-locked{
  --cover-scale:min(1, calc(100vw / 390px), calc(100vh / 844px));
  overflow:hidden!important;
  height:100vh!important;
  min-height:100vh!important;
}
body.invitation-flow.cover-unlocked #cover{
  position:relative!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  margin-left:auto!important;
  margin-right:auto!important;
  width:min(100%,390px)!important;
  min-width:0!important;
  max-width:390px!important;
  height:844px!important;
  min-height:844px!important;
  max-height:none!important;
  transform:none!important;
}

/* The recipient block belongs below the visible lower edge of the gold
   frame. The CTA is kept beneath the recipient with a deliberate gap. */
body.invitation-flow #cover .guest{
  top:674px!important;
  bottom:auto!important;
  width:100%!important;
  z-index:8!important;
  text-align:center!important;
}
body.invitation-flow #cover .guest div{
  margin:0!important;
  line-height:1.15!important;
}
body.invitation-flow #cover .guest h2{
  margin:5px 8px 0!important;
  line-height:1.05!important;
}
body.invitation-flow #cover .button{
  top:auto!important;
  bottom:27px!important;
  z-index:9!important;
}

/* On a narrow phone, width is the limiting dimension; the same 390x844
   coordinate system is preserved and uniformly scaled only if necessary. */
@media(max-width:390px){
  body.invitation-flow.cover-locked #cover{
    left:50%!important;
    width:390px!important;
    min-width:390px!important;
    max-width:390px!important;
    transform:translate(-50%,-50%) scale(var(--cover-scale,1))!important;
  }
  body.invitation-flow.cover-unlocked #cover{
    width:100%!important;
    max-width:390px!important;
  }
}


/* V105 — FINAL PENUTUP TEXTURE + FOOTER CONTINUITY + MUSIC CONTROL
   User-approved direction:
   - Botanical leaf texture becomes the visual continuation of the closing page.
   - Remove the separate plain-green footer band.
   - Brand footer content is lifted onto the textured closing background.
   - Keep the existing closing artwork/layout intact.
   - Move only the small paragraph under "We Are Getting Married!" slightly
     toward the photo, while preserving a visible breathing gap.
   - Keep the music on/off control as a compact fixed control at the lower-right
     of the mobile invitation canvas.
*/
.closing-page.invitation-section{
  height:555px!important;
  min-height:555px!important;
  background:#A9CBE7!important;
  overflow:hidden!important;
}
.closing-page.invitation-section::before{
  top:248px!important;
  bottom:0!important;
  height:auto!important;
  background:url("assets/closing-background-texture.png") center bottom / cover no-repeat!important;
  opacity:.78!important;
  z-index:0!important;
  pointer-events:none!important;
}
.closing-message p{
  transform:translateX(-9px)!important;
  width:118px!important;
  max-width:118px!important;
}
@media(max-width:380px){
  .closing-message p{
    transform:translateX(-8px)!important;
    width:116px!important;
    max-width:116px!important;
  }
}
.site-footer{
  position:relative!important;
  z-index:8!important;
  margin-top:-55px!important;
  width:min(100%,390px)!important;
  min-height:110px!important;
  padding:16px 14px 24px!important;
  background:transparent!important;
  border-top:0!important;
  box-shadow:none!important;
  color:#f5ecd9!important;
}
.site-footer:before{
  display:none!important;
}
.site-footer > *{
  position:relative!important;
  z-index:1!important;
}
.site-footer-credit{
  color:#f7edd9!important;
  text-shadow:0 1px 3px rgba(0,0,0,.45)!important;
}
.site-footer-credit strong{
  color:#efd28a!important;
}
.site-footer-link{
  color:#fff5df!important;
  text-shadow:0 1px 3px rgba(0,0,0,.42)!important;
}
.footer-icon{
  color:#f0d17f!important;
  border-color:rgba(240,209,127,.78)!important;
  background:rgba(3,48,31,.20)!important;
}
body.invitation-flow .opening-page .music-button{
  position:fixed!important;
  left:auto!important;
  top:auto!important;
  right:max(14px, calc((100vw - 390px)/2 + 14px))!important;
  bottom:14px!important;
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  min-height:44px!important;
  margin:0!important;
  z-index:99999!important;
  border-radius:50%!important;
  display:grid!important;
  place-items:center!important;
  background:rgba(8,39,29,.92)!important;
  border:1px solid rgba(235,204,127,.88)!important;
  box-shadow:0 5px 16px rgba(0,0,0,.34), inset 0 1px rgba(255,255,255,.16)!important;
  color:#E9B9C8!important;
  -webkit-backdrop-filter:blur(4px)!important;
  backdrop-filter:blur(4px)!important;
}
body.invitation-flow .opening-page .music-icon{
  font:700 14px/1 Arial,sans-serif!important;
  color:#E9B9C8!important;
}
body.invitation-flow .opening-page .music-button.is-playing .music-icon{
  font-size:13px!important;
}
@media(max-width:390px){
  body.invitation-flow .opening-page .music-button{
    right:14px!important;
    bottom:14px!important;
  }
}
@media(max-width:380px){
  .closing-page.invitation-section{
    height:545px!important;
    min-height:545px!important;
  }
  .site-footer{
    margin-top:-55px!important;
    min-height:108px!important;
    padding:15px 12px 22px!important;
  }
}


/* V106 — PENUTUP FOOTER FINAL POSITION + GLOBAL MUSIC CONTROL
   - Lift the brand footer so it reads as the closing of the invitation,
     immediately below the paper ornament.
   - The botanical texture continues behind the footer; there is no separate
     plain-green footer band.
   - Music control is a direct body child, avoiding the Cover/Opening stacking
     context. It becomes visible as soon as the Cover is unlocked.
*/
body.invitation-flow{
  background:#A9CBE7 url("assets/closing-background-texture.png") center bottom / cover no-repeat!important;
}

/* Let the textured closing area carry the page all the way through the brand. */
.closing-page.invitation-section{
  height:520px!important;
  min-height:520px!important;
  background:#A9CBE7!important;
}
.closing-page.invitation-section::before{
  top:248px!important;
  bottom:0!important;
  background:url("assets/closing-background-texture.png") center bottom / cover no-repeat!important;
  opacity:.80!important;
}

/* Footer is visually part of the closing page, not a separate band. */
.site-footer{
  margin-top:-78px!important;
  width:min(100%,390px)!important;
  min-height:92px!important;
  height:92px!important;
  padding:8px 12px 15px!important;
  justify-content:flex-start!important;
  gap:8px!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.site-footer-credit{
  font-size:10.5px!important;
  line-height:1.2!important;
}
.site-footer-links{
  gap:13px!important;
}
.site-footer-link{
  font-size:8.8px!important;
}
.footer-icon{
  width:16px!important;
  height:16px!important;
  font-size:9px!important;
}

/* The global control is intentionally outside .opening-page so its fixed
   position cannot be hidden by the Cover's stacking context. */
body.invitation-flow .global-music-button{
  position:fixed!important;
  left:auto!important;
  top:auto!important;
  right:max(14px, calc((100vw - 390px)/2 + 14px))!important;
  bottom:14px!important;
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  min-height:44px!important;
  margin:0!important;
  padding:0!important;
  z-index:2147483000!important;
  border-radius:50%!important;
  display:grid!important;
  place-items:center!important;
  background:rgba(8,39,29,.94)!important;
  border:1px solid rgba(235,204,127,.9)!important;
  box-shadow:0 5px 16px rgba(0,0,0,.34),inset 0 1px rgba(255,255,255,.16)!important;
  color:#E9B9C8!important;
  cursor:pointer!important;
  -webkit-backdrop-filter:blur(4px)!important;
  backdrop-filter:blur(4px)!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transition:opacity .25s ease,visibility .25s ease!important;
}
body.invitation-flow.cover-unlocked .global-music-button{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
}
body.invitation-flow .global-music-button .music-icon{
  font:700 14px/1 Arial,sans-serif!important;
  color:#E9B9C8!important;
}
body.invitation-flow .global-music-caption{
  display:none!important;
}

@media(max-width:390px){
  body.invitation-flow .global-music-button{
    right:14px!important;
    bottom:14px!important;
  }
}
@media(max-width:380px){
  .closing-page.invitation-section{
    height:515px!important;
    min-height:515px!important;
  }
  .site-footer{
    margin-top:-72px!important;
    min-height:88px!important;
    height:88px!important;
    padding:7px 10px 13px!important;
  }
}


/* V109 — FINAL COVER CTA MICRO-ADJUSTMENT
   The guest block starts at 674px and its name extends to roughly 714px.
   Place the CTA immediately beneath it with a small, deliberate breathing
   gap, matching the approved editor/mobile composition without overlap. */
body.invitation-flow #cover .button{
  top:724px!important;
  bottom:auto!important;
}


/* V112 — restore the plain emerald base behind all invitation sections.
   Keep the approved Cover background and all section-specific artwork/overlays intact. */
body.invitation-flow{
  background-color:#638FB7!important;
  background-image:none!important;
  background-attachment:scroll!important;
}


/* V113 — UNIFIED EMERALD BACKGROUND + FULL BOTANICAL CLOSING FOOTER
   RSVP keeps its lace/paper artwork but uses the same deep emerald base as the
   closing section. The closing leaf texture continues behind the brand footer
   to the very bottom, removing the plain-green strip. Cover artwork is untouched. */
body.invitation-flow{
  background-color:#A9CBE7!important;
  background-image:none!important;
}
body.invitation-flow .rsvp-page.invitation-section{
  background-color:#A9CBE7!important;
}
body.invitation-flow .closing-page.invitation-section{
  background-color:#A9CBE7!important;
}
body.invitation-flow .closing-page.invitation-section::before{
  background-image:url("assets/closing-background-texture.png")!important;
  background-position:center bottom!important;
  background-size:100% 100%!important;
  background-repeat:no-repeat!important;
}
body.invitation-flow .site-footer{
  background-color:#A9CBE7!important;
  background-image:url("assets/closing-background-texture.png")!important;
  background-position:center bottom!important;
  background-size:100% 100%!important;
  background-repeat:no-repeat!important;
  background-attachment:scroll!important;
}
body.invitation-flow .site-footer:before{
  background:linear-gradient(180deg,rgba(1,31,20,.08),rgba(1,31,20,.20))!important;
}


/* V114 — MATCH FOOTER TEXTURE TO THE BOTANICAL BACKGROUND AROUND THE PAPER
   Use the same background asset, sizing, and color treatment for the closing
   page and its footer. Remove the darker footer overlay that caused a visible
   color seam. Cover styling remains untouched. */
body.invitation-flow .closing-page.invitation-section::before{
  background-image:url("assets/closing-background-texture.png")!important;
  background-position:center bottom!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  opacity:.80!important;
}
body.invitation-flow .site-footer{
  background-color:#A9CBE7!important;
  background-image:url("assets/closing-background-texture.png")!important;
  background-position:center bottom!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  background-attachment:scroll!important;
}
body.invitation-flow .site-footer:before{
  background:transparent!important;
  opacity:0!important;
}


/* V115 — SLIGHTLY EXTEND CLOSING PAPER DOWNWARD
   Extend only the ivory scalloped paper by about 7% vertically. Keep its top
   edge, wax seal, text positions, flowers, footer, Cover, and other pages intact.
*/
.closing-paper-wrap{
  height:187px!important;
}
@media(max-width:380px){
  .closing-paper-wrap{
    height:182px!important;
  }
}
/* V118 — Keep longer parent-name text comfortably inside the ivory lace frame.
   Compact vertical rhythm only; preserve the approved ornament, names, and frame. */
.mempelai-page .mempelai-content{
  top:16.5%!important;
  height:67%!important;
  padding:5px 10px 18px!important;
  justify-content:flex-start!important;
  overflow:hidden!important;
}
.mempelai-page .mempelai-content .bismillah{
  font-size:clamp(15px,4.1vw,18px)!important;
  line-height:1.12!important;
  margin:0 0 3px!important;
}
.mempelai-page .mempelai-content .intro{
  font-size:clamp(9px,2.45vw,10px)!important;
  line-height:1.22!important;
  margin:0 0 5px!important;
}
.mempelai-page .mempelai-content .person-name{
  font-size:clamp(25px,6.3vw,29px)!important;
  line-height:.96!important;
  margin:0!important;
}
.mempelai-page .mempelai-content .parent-line{
  font-size:clamp(7.5px,2vw,8.5px)!important;
  line-height:1.14!important;
  margin:1px 0 3px!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
.mempelai-page .mempelai-content #memWomanParents{margin-bottom:5px!important;}
.mempelai-page .mempelai-content .and{
  font-size:15px!important;
  line-height:1!important;
  margin:0 0 3px!important;
}
@media(max-width:380px){
  .mempelai-page .mempelai-content{top:16%!important;height:68%!important;padding:4px 8px 17px!important;}
  .mempelai-page .mempelai-content .bismillah{font-size:clamp(14px,3.9vw,16px)!important;}
  .mempelai-page .mempelai-content .intro{font-size:clamp(8.5px,2.35vw,9.2px)!important;}
  .mempelai-page .mempelai-content .person-name{font-size:clamp(23px,6.1vw,27px)!important;}
  .mempelai-page .mempelai-content .parent-line{font-size:clamp(7.2px,1.95vw,8px)!important;line-height:1.12!important;}
}


/* V123: blank ivory plaque with editable, sharp HTML verse text. */
.opening-art{position:relative;isolation:isolate;overflow:visible}
.opening-art-image{top:-70px!important;left:50%;transform:translateX(-50%);width:100%;height:auto;max-width:none;object-fit:contain}
.opening-verse-overlay{position:absolute;z-index:4;left:17%;top:48px;width:59%;height:330px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;color:#536F88;pointer-events:none;line-height:1.35}
.opening-verse-overlay p{box-sizing:border-box;width:100%;margin:0;overflow-wrap:anywhere}
.opening-verse-overlay .verse-bismillah{font-family:'Amiri',serif;font-size:clamp(15px,4.1vw,19px);font-weight:700;line-height:1.55;color:#466B8C;margin:0 0 7px}
.opening-verse-overlay .verse-arabic{font-family:'Amiri',serif;font-size:clamp(14px,3.7vw,17px);font-weight:700;line-height:1.72;color:#466B8C;margin:0 0 8px}
.opening-verse-overlay .verse-translation{font-family:Georgia,'Times New Roman',serif;font-size:clamp(9px,2.55vw,11px);font-weight:500;line-height:1.48;color:#40372c;margin:0 auto;max-width:96%}
.opening-verse-overlay .verse-reference{font-family:Georgia,'Times New Roman',serif;font-size:clamp(9px,2.4vw,10px);line-height:1.35;color:#554331;margin:7px 0 0;font-weight:600}
@media(min-width:600px){.opening-verse-overlay{left:17%;width:59%;top:48px}.opening-verse-overlay .verse-bismillah{font-size:19px}.opening-verse-overlay .verse-arabic{font-size:17px}.opening-verse-overlay .verse-translation{font-size:11px}}
@media(max-width:380px){.opening-art-image{top:-70px!important}.opening-verse-overlay{left:16%;width:60%;top:46px}.opening-verse-overlay .verse-bismillah{font-size:15px;margin-bottom:5px}.opening-verse-overlay .verse-arabic{font-size:13.5px;line-height:1.62;margin-bottom:6px}.opening-verse-overlay .verse-translation{font-size:9px;line-height:1.42}.opening-verse-overlay .verse-reference{font-size:9px;margin-top:5px}}

/* V125: opening artwork geometry aligned to Screenshot_81 reference.
   Keep the tasbih at the opening boundary, enlarge the plaque modestly,
   and center editable verse text fully inside the ivory area. */
.opening-page .opening-art{
  width:100%!important;
  max-width:390px!important;
  height:448px!important;
  flex:0 0 448px!important;
  margin:0 auto!important;
  overflow:visible!important;
  position:relative!important;
}
.opening-page .opening-art-image{
  position:absolute!important;
  left:50%!important;
  top:-139px!important;
  transform:translateX(-50%)!important;
  width:410px!important;
  max-width:none!important;
  height:auto!important;
  object-fit:contain!important;
  clip-path:inset(139px 0 0 0)!important;
}
.opening-page .opening-verse-overlay{
  left:22%!important;
  top:57px!important;
  width:56%!important;
  height:292px!important;
  padding:0!important;
  justify-content:flex-start!important;
  overflow:visible!important;
  line-height:1.32!important;
}
.opening-page .opening-verse-overlay .verse-bismillah{
  font-size:clamp(14px,3.9vw,17px)!important;
  line-height:1.45!important;
  margin:0 0 5px!important;
}
.opening-page .opening-verse-overlay .verse-arabic{
  font-size:clamp(12.5px,3.45vw,15px)!important;
  line-height:1.55!important;
  margin:0 0 6px!important;
}
.opening-page .opening-verse-overlay .verse-translation{
  font-size:clamp(9px,2.45vw,10px)!important;
  line-height:1.38!important;
  max-width:100%!important;
}
.opening-page .opening-verse-overlay .verse-reference{
  font-size:clamp(8.5px,2.25vw,9.5px)!important;
  line-height:1.25!important;
  margin:5px 0 0!important;
}
@media(max-width:380px){
  .opening-page .opening-art{height:448px!important;flex-basis:448px!important}
  .opening-page .opening-art-image{top:-139px!important;clip-path:inset(139px 0 0 0)!important}
  .opening-page .opening-verse-overlay{left:22%!important;top:57px!important;width:56%!important;height:292px!important}
  .opening-page .opening-verse-overlay .verse-bismillah{font-size:14px!important;margin-bottom:4px!important}
  .opening-page .opening-verse-overlay .verse-arabic{font-size:12.5px!important;line-height:1.48!important;margin-bottom:5px!important}
  .opening-page .opening-verse-overlay .verse-translation{font-size:9px!important;line-height:1.34!important}
  .opening-page .opening-verse-overlay .verse-reference{font-size:8.5px!important;margin-top:4px!important}
}


/* V126: compact vertical spacing and prevent verse clipping on mobile.
   Preserve the established panel/tasbih artwork and countdown styling. */
.opening-page .opening-art{
  height:420px!important;
  flex:0 0 420px!important;
}
.opening-page .opening-art-image{
  top:-139px!important;
  width:400px!important;
  clip-path:inset(139px 0 0 0)!important;
}
.opening-page .opening-verse-overlay{
  left:21%!important;
  top:61px!important;
  width:58%!important;
  height:276px!important;
  padding:0 2px!important;
  overflow:visible!important;
  line-height:1.28!important;
}
.opening-page .opening-verse-overlay .verse-bismillah{
  font-size:clamp(13px,3.6vw,15.5px)!important;
  line-height:1.35!important;
  margin:0 0 3px!important;
}
.opening-page .opening-verse-overlay .verse-arabic{
  font-size:clamp(11px,3.05vw,13px)!important;
  line-height:1.38!important;
  margin:0 0 4px!important;
}
.opening-page .opening-verse-overlay .verse-translation{
  font-size:clamp(8.2px,2.2vw,9.2px)!important;
  line-height:1.28!important;
  max-width:100%!important;
}
.opening-page .opening-verse-overlay .verse-reference{
  font-size:clamp(8px,2.05vw,8.8px)!important;
  line-height:1.2!important;
  margin:4px 0 0!important;
}
@media(max-width:380px){
  .opening-page .opening-art{height:412px!important;flex-basis:412px!important}
  .opening-page .opening-art-image{width:390px!important;top:-139px!important;clip-path:inset(139px 0 0 0)!important}
  .opening-page .opening-verse-overlay{left:20.5%!important;top:61px!important;width:59%!important;height:270px!important}
  .opening-page .opening-verse-overlay .verse-bismillah{font-size:12.8px!important;line-height:1.32!important;margin-bottom:3px!important}
  .opening-page .opening-verse-overlay .verse-arabic{font-size:10.8px!important;line-height:1.34!important;margin-bottom:4px!important}
  .opening-page .opening-verse-overlay .verse-translation{font-size:8.1px!important;line-height:1.25!important}
  .opening-page .opening-verse-overlay .verse-reference{font-size:7.8px!important;margin-top:3px!important}
}


/* V130: balanced vertical rhythm for editable Quran verse panel.
   Preserve the approved artwork, panel position, tasbih, flowers, and countdown. */
.opening-page .opening-verse-overlay {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-evenly !important;
  align-items: center !important;
  text-align: center !important;
  padding: 17px 3px 17px !important;
  gap: 0 !important;
  overflow: visible !important;
  line-height: 1.45 !important;
}
.opening-page .opening-verse-overlay p {
  width: 100% !important;
  flex: 0 0 auto !important;
  text-align: center !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}
.opening-page .opening-verse-overlay .verse-bismillah {
  font-size: clamp(12px, 3.15vw, 14px) !important;
  line-height: 1.65 !important;
  margin: 0 0 7px !important;
}
.opening-page .opening-verse-overlay .verse-arabic {
  font-size: clamp(10.8px, 2.85vw, 12.4px) !important;
  line-height: 1.78 !important;
  margin: 0 0 9px !important;
  letter-spacing: 0 !important;
  word-spacing: 0.02em !important;
}
.opening-page .opening-verse-overlay .verse-translation {
  font-size: clamp(8.1px, 2.08vw, 9px) !important;
  line-height: 1.52 !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 1px !important;
}
.opening-page .opening-verse-overlay .verse-reference {
  font-size: clamp(7.8px, 1.98vw, 8.6px) !important;
  line-height: 1.35 !important;
  margin: 7px 0 0 !important;
  padding: 0 !important;
  text-align: center !important;
}
@media (max-width: 380px) {
  .opening-page .opening-verse-overlay {
    left: 14% !important; width: 72% !important;
    top: 59px !important; height: 276px !important;
    padding: 16px 3px 16px !important;
  }
  .opening-page .opening-verse-overlay .verse-bismillah {
    font-size: 12px !important; line-height: 1.62 !important; margin-bottom: 7px !important;
  }
  .opening-page .opening-verse-overlay .verse-arabic {
    font-size: 10.7px !important; line-height: 1.72 !important; margin-bottom: 8px !important;
  }
  .opening-page .opening-verse-overlay .verse-translation {
    font-size: 8px !important; line-height: 1.48 !important;
  }
  .opening-page .opening-verse-overlay .verse-reference {
    font-size: 7.7px !important; line-height: 1.3 !important; margin-top: 6px !important;
  }
}


/* V134: keep the final translation lines clear of the lower-right floral ornament.
   Narrow the text measure and permit a preferred wrap after "kebesaran". */
.opening-page .opening-verse-overlay .verse-translation {
  width: 80% !important;
  max-width: 80% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 3px !important;
  padding-right: 3px !important;
  text-wrap: pretty;
}
@media (max-width: 380px) {
  .opening-page .opening-verse-overlay .verse-translation {
    width: 80% !important;
    max-width: 80% !important;
    line-height: 1.38 !important;
  }
}


/* V135: final balanced spacing for opening verse text. Keep artwork and page geometry unchanged. */
#opening .opening-verse-overlay {
  justify-content: center !important;
  align-items: center !important;
  padding: 12px 8px !important;
  gap: 0 !important;
  overflow: visible !important;
}
#opening .opening-verse-overlay > p { flex: 0 0 auto !important; text-align: center !important; }
#opening .opening-verse-overlay .verse-bismillah {
  margin: 0 0 4px !important;
  line-height: 1.48 !important;
}
#opening .opening-verse-overlay .verse-arabic {
  margin: 0 0 5px !important;
  line-height: 1.52 !important;
  padding: 0 5px !important;
  box-sizing: border-box !important;
}
#opening .opening-verse-overlay .verse-translation {
  width: 78% !important;
  max-width: 78% !important;
  margin: 0 auto !important;
  padding: 0 2px !important;
  line-height: 1.4 !important;
  box-sizing: border-box !important;
  text-wrap: pretty !important;
}
#opening .opening-verse-overlay .verse-reference {
  margin: 3px 0 0 !important;
  line-height: 1.22 !important;
  padding: 0 !important;
}
@media (max-width: 380px) {
  #opening .opening-verse-overlay { padding: 10px 7px !important; justify-content: center !important; }
  #opening .opening-verse-overlay .verse-bismillah { margin-bottom: 4px !important; line-height: 1.45 !important; }
  #opening .opening-verse-overlay .verse-arabic { margin-bottom: 4px !important; line-height: 1.48 !important; padding: 0 4px !important; }
  #opening .opening-verse-overlay .verse-translation { width: 77% !important; max-width: 77% !important; line-height: 1.36 !important; }
  #opening .opening-verse-overlay .verse-reference { margin-top: 3px !important; line-height: 1.2 !important; }
}

/* V136: sharpen the small couple-panel text while preserving typography, sizes, layout and names. */
.mempelai-content .intro,
.mempelai-content .parent-line {
  color: #49372B !important;
  opacity: 1 !important;
  text-shadow: none !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.mempelai-content .intro {
  color: #49372B !important;
}
.mempelai-content .parent-line {
  color: #5A4433 !important;
}


/* V137: clearer small couple captions + a subtle upward rebalance of the verse text.
   Keep font sizes, couple names, panel art, flowers, beads and countdown geometry unchanged. */
.mempelai-page .mempelai-content .intro,
.mempelai-page .mempelai-content .parent-line {
  color: #3F2D22 !important;
  opacity: 1 !important;
  font-weight: 500 !important;
  text-shadow: none !important;
  -webkit-text-stroke: 0.12px currentColor;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}
.mempelai-page .mempelai-content .intro { color: #3D2B20 !important; }
.mempelai-page .mempelai-content .parent-line { color: #493629 !important; }

/* Lift only the verse copy slightly inside the existing plaque; do not move the artwork. */
#opening .opening-verse-overlay > p {
  position: relative !important;
  top: -4px !important;
}
@media (max-width: 380px) {
  #opening .opening-verse-overlay > p { top: -3px !important; }
}


/* V138: stronger, explicit vertical correction for verse text.
   Move only the four editable text lines upward within the unchanged plaque;
   preserve panel artwork, its dimensions, flowers, beads and countdown. */
#opening .opening-verse-overlay > .verse-bismillah,
#opening .opening-verse-overlay > .verse-arabic,
#opening .opening-verse-overlay > .verse-translation,
#opening .opening-verse-overlay > .verse-reference {
  position: relative !important;
  top: -10px !important;
}
@media (max-width: 380px) {
  #opening .opening-verse-overlay > .verse-bismillah,
  #opening .opening-verse-overlay > .verse-arabic,
  #opening .opening-verse-overlay > .verse-translation,
  #opening .opening-verse-overlay > .verse-reference {
    top: -8px !important;
  }
}


/* V139 — CLOSING PAPER TEXT SPACING
   Lower the message so it clears the round wax seal; extend the paper slightly
   downward to retain balanced padding at the bottom. No other page is changed. */
.closing-paper-wrap{
  height:197px!important;
}
.closing-paper-text{
  top:76px!important;
}
@media(max-width:380px){
  .closing-paper-wrap{height:192px!important;}
  .closing-paper-text{top:72px!important;}
}


/* V143 — CLIENT COVER NOTICE PANEL
   Keep the emerald-and-gold identity; compact the title stack slightly and
   reserve a readable, discreet panel for the family visit information. */
body.invitation-flow #cover .names{
  font-size:61px!important;
  line-height:.86!important;
  margin-top:15px!important;
}
body.invitation-flow #cover .date{
  margin-top:13px!important;
}
body.invitation-flow #cover .date::after{
  margin-top:7px!important;
}
body.invitation-flow #cover .cover-notice{
  position:absolute!important;
  top:300px!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  width:318px!important;
  max-width:calc(100% - 54px)!important;
  box-sizing:border-box!important;
  padding:7px 10px 8px!important;
  color:#f8f0df!important;
  background:rgba(3,39,27,.86)!important;
  border:1px solid rgba(213,184,119,.82)!important;
  border-radius:8px!important;
  box-shadow:0 2px 10px rgba(0,0,0,.15),inset 0 0 0 1px rgba(255,246,218,.035)!important;
  font-family:'Cormorant Garamond',Georgia,serif!important;
  font-size:11px!important;
  font-weight:500!important;
  line-height:1.16!important;
  letter-spacing:.05px!important;
  text-align:center!important;
  z-index:7!important;
}
body.invitation-flow #cover .photo-box{
  top:245px!important;
  transform:translateX(-50%) scale(.94)!important;
  transform-origin:top center!important;
}
body.invitation-flow #cover .guest{
  top:700px!important;
}
body.invitation-flow #cover .button{
  bottom:20px!important;
}
@media(max-width:390px){
  body.invitation-flow #cover .cover-notice{
    width:318px!important;
    max-width:calc(100% - 54px)!important;
    font-size:10.8px!important;
    padding:7px 9px!important;
  }
}

/* V144 — Integrated cover notice, balanced portrait and compact CTA */
body.invitation-flow #cover .names{
  font-size:57px!important;
  line-height:.84!important;
  margin-top:12px!important;
}
body.invitation-flow #cover .date{
  margin-top:11px!important;
}
body.invitation-flow #cover .date::after{
  margin-top:6px!important;
}
/* Make the client notice feel printed into the botanical background,
   rather than a separate card pasted over the cover. */
body.invitation-flow #cover .cover-notice{
  top:296px!important;
  width:316px!important;
  max-width:calc(100% - 58px)!important;
  padding:7px 8px!important;
  color:#f5ecd7!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  font-size:11.1px!important;
  line-height:1.23!important;
  letter-spacing:.005em!important;
  text-align:center!important;
  text-shadow:0 1px 3px rgba(0,0,0,.82),0 0 7px rgba(0,0,0,.35)!important;
}
/* Delicate gold flourishes replace a rectangular notice border. */
body.invitation-flow #cover .cover-notice::before,
body.invitation-flow #cover .cover-notice::after{
  content:"✦  ─────────  ✦"!important;
  display:block!important;
  color:#c8a86b!important;
  font-size:9px!important;
  line-height:1!important;
  letter-spacing:.12em!important;
  text-shadow:0 1px 3px rgba(0,0,0,.7)!important;
}
body.invitation-flow #cover .cover-notice::before{margin:0 0 5px!important;}
body.invitation-flow #cover .cover-notice::after{margin:5px 0 0!important;}
body.invitation-flow #cover .photo-box{
  transform:translateX(-50%) scale(.87)!important;
  transform-origin:top center!important;
}
body.invitation-flow #cover .guest{
  top:690px!important;
  width:100%!important;
  text-align:center!important;
}
body.invitation-flow #cover .guest div{
  font-size:12px!important;
  line-height:1.1!important;
}
body.invitation-flow #cover .guest h2{
  margin:4px 8px 0!important;
  font-size:21px!important;
  line-height:1.05!important;
}
body.invitation-flow #cover .button{
  top:auto!important;
  bottom:24px!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  width:164px!important;
  min-width:0!important;
  height:48px!important;
  min-height:48px!important;
  padding:0 20px!important;
  border-radius:999px!important;
  font-size:13px!important;
  line-height:1!important;
  letter-spacing:.01em!important;
  box-shadow:0 3px 10px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.28)!important;
  z-index:9!important;
}
@media(max-width:390px){
  body.invitation-flow #cover .cover-notice{
    width:316px!important;
    max-width:calc(100% - 48px)!important;
    font-size:10.8px!important;
    line-height:1.22!important;
    padding:6px 5px!important;
  }
  body.invitation-flow #cover .photo-box{
    transform:translateX(-50%) scale(.87)!important;
  }
  body.invitation-flow #cover .button{
    width:158px!important;
    height:46px!important;
    min-height:46px!important;
    bottom:22px!important;
  }
}


/* V145 Romantic Pastel Royal — blue/pink recolor layer; preserves original structure and export controls. */
:root{--wedding-blue:#A9CBE7;--wedding-blue-deep:#466B8C;--wedding-pink:#E9B9C8;--wedding-ivory:#F8F1E8;--wedding-gold:#C9A66B;}
html:has(body.invitation-flow),body.invitation-flow{background-color:#A9CBE7!important;}
body.invitation-flow{background-image:linear-gradient(135deg,rgba(105,159,203,.48),rgba(230,183,200,.12)),url('assets/opening-background.png')!important;background-blend-mode:normal,luminosity!important;}
.cover.invitation-section{background-image:linear-gradient(135deg,rgba(121,177,220,.62),rgba(229,177,197,.22)),url('assets/background.png')!important;background-blend-mode:normal,luminosity!important;background-size:cover!important;}
.opening-page.invitation-section,.event-page.invitation-section,.mempelai-page.invitation-section,.rsvp-page.invitation-section,.closing-page.invitation-section{background-color:#A9CBE7!important;}
.closing-page.invitation-section{background-image:linear-gradient(135deg,rgba(121,177,220,.62),rgba(229,177,197,.24)),url('assets/closing-background-texture.png')!important;background-blend-mode:normal,luminosity!important;background-size:cover!important;}
.cover .cover-info-panel,.cover .cover-message-panel,.cover .family-notice,.cover-notice-panel{background:rgba(72,117,157,.20)!important;border-color:rgba(233,185,200,.68)!important;box-shadow:0 1px 8px rgba(34,68,103,.10)!important;}


/* V146 — cohesive powder-blue + blush-pink theme. Keep layout and interactions unchanged. */
:root{--pastel-blue:#A9CBE7;--pastel-blue-deep:#456782;--pastel-blue-mid:#85ACD0;--blush-pink:#E8B8C8;--ivory:#FFF8EF;--champagne:#C7A46A;}
html:has(body.invitation-flow),body.invitation-flow{background-color:#A9CBE7!important;background-image:url('assets/opening-background.png')!important;background-position:center top!important;background-size:min(100vw,390px) auto!important;background-repeat:repeat-y!important;background-attachment:scroll!important;}
.cover.invitation-section{background-color:#A9CBE7!important;background-image:linear-gradient(145deg,rgba(169,203,231,.18),rgba(232,184,200,.10)),url('assets/background.png')!important;background-blend-mode:normal,normal!important;background-size:cover!important;}
.opening-page.invitation-section,.mempelai-page.invitation-section,.event-page.invitation-section,.closing-page.invitation-section{background-color:transparent!important;}
.event-page.invitation-section{background-image:linear-gradient(180deg,rgba(169,203,231,.14),rgba(69,103,130,.12)),url('assets/event-background.png')!important;color:#405C78!important;}
.event-page.invitation-section::before{background:linear-gradient(180deg,rgba(255,248,239,.06),rgba(69,103,130,.10))!important;}
.calendar-strip{background:rgba(255,248,239,.76)!important;border-color:rgba(199,164,106,.72)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.36),0 7px 20px rgba(69,103,130,.10)!important;}
.calendar-month,.event-heading h2{color:#456782!important;text-shadow:none!important;}
.calendar-day,.calendar-day b,.calendar-day span{color:#456782!important;}
.event-kicker{color:#9D7181!important;}
.calendar-day.is-wedding-day{background:radial-gradient(ellipse at center,rgba(232,184,200,.48),rgba(232,184,200,.16) 62%,transparent 80%)!important;}
.calendar-day.is-wedding-day b{color:#A85F78!important;text-shadow:none!important;}
.mempelai-page.invitation-section{background-image:linear-gradient(180deg,rgba(169,203,231,.16),rgba(232,184,200,.10)),url('assets/background.png')!important;color:#456782!important;}
.mempelai-content,.mempelai-content .intro,.mempelai-content .parent-line{color:#456782!important;}
.mempelai-content .person-name{color:#9D6377!important;}
.mempelai-content .and{color:#C7A46A!important;}
.closing-page.invitation-section{background-image:url('assets/closing-background-texture.png')!important;}
body.invitation-flow #cover .cover-notice{color:#FFF8EF!important;text-shadow:0 1px 3px rgba(50,75,100,.38)!important;}
body.invitation-flow #cover .button{background:linear-gradient(135deg,#E8B8C8,#CF91A7)!important;border:1px solid #FFF0E8!important;color:#FFF8EF!important;box-shadow:0 3px 10px rgba(69,103,130,.18)!important;}
body.invitation-flow .global-music-button{background:#456782!important;border-color:#C7A46A!important;color:#FFF8EF!important;}


/* V147 — Soft powder-blue cover: micro-damask, clear typography, diagonal blush florals */
html:has(body.invitation-flow), body.invitation-flow { background-color:#A9CBE7 !important; }
.cover.invitation-section {
  background-color:#A9CBE7 !important;
  background-image:
    url('assets/floral-small-pink.png'),
    url('assets/floral-small-pink.png'),
    url('assets/background.png') !important;
  background-position: left 10px top 18px, right 10px bottom 22px, center center !important;
  background-size: 54px auto, 54px auto, cover !important;
  background-repeat: no-repeat !important;
}
.event-page.invitation-section { background-color:#A9CBE7 !important; }
.event-page.invitation-section::before {
  background:linear-gradient(180deg,rgba(169,203,231,.025),rgba(69,103,130,.045)) !important;
}
.calendar-strip {
  background:rgba(255,248,239,.76) !important;
  border-color:rgba(199,164,106,.62) !important;
  color:#456782 !important;
  backdrop-filter:none !important;
}


/* V148 — cover contrast and reference-inspired gold frame */
body.invitation-flow #cover .title{color:#3e5e79!important;text-shadow:0 1px 0 rgba(255,255,255,.48)!important;}
body.invitation-flow #cover .names{color:#fff8ec!important;text-shadow:0 2px 3px rgba(40,67,91,.48),0 0 2px rgba(255,255,255,.55)!important;}
body.invitation-flow #cover .date{color:#3e5e79!important;text-shadow:0 1px 0 rgba(255,255,255,.48)!important;}
body.invitation-flow #cover .cover-notice{color:#355570!important;text-shadow:0 1px 0 rgba(255,255,255,.5)!important;background:rgba(248,251,255,.22)!important;border-color:rgba(197,151,75,.78)!important;}
body.invitation-flow #cover .guest div{color:#a97743!important;text-shadow:0 1px 0 rgba(255,255,255,.55)!important;}
body.invitation-flow #cover .guest h2{color:#355570!important;text-shadow:0 1px 0 rgba(255,255,255,.55)!important;}
body.invitation-flow #cover .button{background:linear-gradient(135deg,#e9bdc8,#ca8f9f)!important;border:1.5px solid #fff1e7!important;color:#fffaf5!important;box-shadow:0 3px 8px rgba(54,77,99,.18),inset 0 1px rgba(255,255,255,.58)!important;}


/* V153 — Refined cover notice ornaments and blush name accents */
body.invitation-flow #cover .names{
  color:#FFF8EF!important;
  text-shadow:0 2px 3px rgba(40,67,91,.30),0 0 8px rgba(232,184,200,.72),0 0 2px rgba(255,255,255,.75)!important;
}
body.invitation-flow #cover .names .cover-and{
  display:inline-block!important;
  color:#E8A6BB!important;
  text-shadow:0 1px 2px rgba(157,83,106,.25),0 0 5px rgba(255,240,246,.8)!important;
}
body.invitation-flow #cover .cover-notice{
  top:263px!important;
  width:320px!important;
  max-width:calc(100% - 44px)!important;
  padding:4px 7px!important;
  margin:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  color:#355570!important;
  text-shadow:0 1px 0 rgba(255,255,255,.58)!important;
  font-size:10.8px!important;
  line-height:1.2!important;
  z-index:8!important;
}
body.invitation-flow #cover .cover-notice::before,
body.invitation-flow #cover .cover-notice::after{
  content:"✿ ───────── ✿"!important;
  display:block!important;
  color:#D98FA8!important;
  font-family:Georgia,serif!important;
  font-size:12px!important;
  font-weight:400!important;
  letter-spacing:.08em!important;
  line-height:1!important;
  text-shadow:0 1px 0 rgba(255,255,255,.72)!important;
}
body.invitation-flow #cover .cover-notice::before{margin:0 0 5px!important;}
body.invitation-flow #cover .cover-notice::after{margin:5px 0 0!important;}
@media(max-width:390px){
 body.invitation-flow #cover .cover-notice{top:263px!important;font-size:10.2px!important;line-height:1.18!important;max-width:calc(100% - 34px)!important;padding:3px 5px!important;}
}

/* V154 — readable date, balanced guest block, and refined blush accents */
body.invitation-flow #cover .date{
  color:#456782!important;
  text-shadow:0 1px 0 rgba(255,255,255,.52)!important;
  font-weight:600!important;
  letter-spacing:2.1px!important;
}
body.invitation-flow #cover .date::after{
  background:#C7A46A!important;
  width:42px!important;
  height:1.5px!important;
}
body.invitation-flow #cover .names{
  color:#FFF8EF!important;
  /* Keep the script lettering crisp; pink shadow is deliberately subtle. */
  text-shadow:0 2px 2px rgba(47,75,99,.22),0 0 5px rgba(232,184,200,.42),0 1px 0 rgba(255,255,255,.72)!important;
}
body.invitation-flow #cover .names .cover-and{
  color:#C77996!important;
  text-shadow:0 1px 2px rgba(157,83,106,.18)!important;
}
body.invitation-flow #cover .guest{
  left:0!important;
  width:100%!important;
  text-align:center!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
}
body.invitation-flow #cover .guest div{
  color:#B85F7A!important;
  font-size:12px!important;
  line-height:1.2!important;
  letter-spacing:1.2px!important;
  text-shadow:0 1px 0 rgba(255,255,255,.55)!important;
  margin:0!important;
}
body.invitation-flow #cover .guest h2{
  color:#456782!important;
  font-size:22px!important;
  line-height:1.1!important;
  font-weight:600!important;
  text-align:center!important;
  margin:5px 8px 0!important;
  text-shadow:0 1px 0 rgba(255,255,255,.58)!important;
}
body.invitation-flow #cover .button{
  width:165px!important;
  min-width:165px!important;
  padding:12px 14px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  font-size:13px!important;
  line-height:1.15!important;
  letter-spacing:.15px!important;
  color:#FFF9F5!important;
  background:linear-gradient(135deg,#DFA6B5 0%,#C77D95 100%)!important;
  border:1.5px solid #FFF0E7!important;
  box-shadow:0 3px 8px rgba(54,77,99,.16),inset 0 1px rgba(255,255,255,.62)!important;
}


/* V157 — Correct guest section placement in the actual invitation flow stylesheet.
   Lift the greeting and CTA so they sit in the balanced space beneath the portrait frame. */
body.invitation-flow #cover .guest{
  top:638px!important;
  bottom:auto!important;
}
body.invitation-flow #cover .guest div{
  color:#B85F7A!important;
  text-shadow:0 1px 0 rgba(255,255,255,.72)!important;
}
body.invitation-flow #cover .guest h2{
  color:#456782!important;
}
body.invitation-flow #cover .button{
  top:704px!important;
  bottom:auto!important;
  left:50%!important;
  transform:translateX(-50%)!important;
}
@media(max-width:390px){
  body.invitation-flow #cover .guest{top:638px!important;}
  body.invitation-flow #cover .button{top:704px!important;}
}

/* V165 — remove symbols baked above the frame; enlarge circle and align photo precisely. */
body.invitation-flow #cover .photo-box{
  top:332px!important;
  width:320px!important;
  height:310px!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  transform-origin:top center!important;
}
body.invitation-flow #cover .frame{
  position:absolute!important;
  left:0!important;
  top:0!important;
  width:320px!important;
  height:auto!important;
  object-fit:contain!important;
  z-index:2!important;
}
body.invitation-flow #cover .photo{
  position:absolute!important;
  top:26px!important;
  left:51px!important;
  width:218px!important;
  height:218px!important;
  border-radius:50%!important;
  overflow:hidden!important;
  z-index:1!important;
  background:rgba(142,174,199,.12)!important;
}
body.invitation-flow #cover .photo img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center 35%!important;
  border-radius:50%!important;
}
body.invitation-flow #cover .photo #photoPlaceholder{z-index:2!important;}
body.invitation-flow #cover .guest{top:632px!important;}
body.invitation-flow #cover .button{top:690px!important;bottom:auto!important;}
@media(max-width:390px){
  body.invitation-flow #cover .photo-box{top:332px!important;width:320px!important;height:310px!important;}
  body.invitation-flow #cover .frame{width:320px!important;top:0!important;}
  body.invitation-flow #cover .photo{top:26px!important;left:51px!important;width:218px!important;height:218px!important;}
  body.invitation-flow #cover .guest{top:632px!important;}
  body.invitation-flow #cover .button{top:690px!important;bottom:auto!important;}
}


/* V166 — lower and slightly enlarge the circle, align photo and guest block,
   and remove the lower pink divider symbols that collide with the frame. */
body.invitation-flow #cover .cover-notice::after{
  content:none!important;display:none!important;
}
body.invitation-flow #cover .photo-box{
  top:344px!important;
  width:330px!important;
  height:320px!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  transform-origin:top center!important;
}
body.invitation-flow #cover .frame{
  left:0!important;top:0!important;width:330px!important;height:auto!important;
  object-fit:contain!important;
}
body.invitation-flow #cover .photo{
  top:27px!important;left:52px!important;width:226px!important;height:226px!important;
  border-radius:50%!important;overflow:hidden!important;
}
body.invitation-flow #cover .photo img{
  width:100%!important;height:100%!important;display:block!important;
  object-fit:cover!important;object-position:center 35%!important;border-radius:50%!important;
}
body.invitation-flow #cover .guest{top:654px!important;bottom:auto!important;}
body.invitation-flow #cover .button{top:716px!important;bottom:auto!important;left:50%!important;transform:translateX(-50%)!important;}
@media(max-width:390px){
 body.invitation-flow #cover .photo-box{top:344px!important;width:330px!important;height:320px!important;}
 body.invitation-flow #cover .frame{width:330px!important;top:0!important;}
 body.invitation-flow #cover .photo{top:27px!important;left:52px!important;width:226px!important;height:226px!important;}
 body.invitation-flow #cover .guest{top:654px!important;}
 body.invitation-flow #cover .button{top:716px!important;bottom:auto!important;}
}

/* V167 — Keep both blush-pink notice dividers; move the circle, photo, greeting,
   and CTA down so the lower divider sits clearly above the floral frame. */
body.invitation-flow #cover .cover-notice::before,
body.invitation-flow #cover .cover-notice::after{
  content:"✿ ───────── ✿"!important;
  display:block!important;
  color:#D98FA8!important;
  font-family:Georgia,serif!important;
  font-size:12px!important;
  font-weight:400!important;
  letter-spacing:.08em!important;
  line-height:1!important;
  text-shadow:0 1px 0 rgba(255,255,255,.72)!important;
}
body.invitation-flow #cover .cover-notice::before{margin:0 0 5px!important;}
body.invitation-flow #cover .cover-notice::after{margin:5px 0 0!important;}
body.invitation-flow #cover .photo-box{top:362px!important;}
body.invitation-flow #cover .frame{top:0!important;}
body.invitation-flow #cover .photo{top:27px!important;left:52px!important;width:226px!important;height:226px!important;}
body.invitation-flow #cover .photo img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center 35%!important;border-radius:50%!important;}
body.invitation-flow #cover .guest{top:674px!important;}
body.invitation-flow #cover .button{top:736px!important;bottom:auto!important;}
@media(max-width:390px){
 body.invitation-flow #cover .photo-box{top:362px!important;}
 body.invitation-flow #cover .frame{top:0!important;}
 body.invitation-flow #cover .photo{top:27px!important;left:52px!important;width:226px!important;height:226px!important;}
 body.invitation-flow #cover .guest{top:674px!important;}
 body.invitation-flow #cover .button{top:736px!important;bottom:auto!important;}
}


/* V168 — mempelai page: same pastel palette, softer lace, clearer type hierarchy. */
.mempelai-page.invitation-section{
  background-color:#A9CBE7!important;
  background-image:linear-gradient(180deg,rgba(169,203,231,.10),rgba(169,203,231,.05)),url('assets/background.png')!important;
  background-position:center!important;background-size:cover!important;color:#456782!important;
}
.mempelai-page .lace-frame{filter:saturate(.78) contrast(.98) drop-shadow(0 2px 3px rgba(69,103,130,.06))!important;opacity:.96!important;}
.mempelai-content{color:#456782!important;}
.mempelai-content .bismillah{color:#456782!important;}
.mempelai-content .intro,.mempelai-content .parent-line{color:#456782!important;}
.mempelai-content .person-name{color:#7C5367!important;text-shadow:0 1px 0 rgba(255,255,255,.5)!important;}
.mempelai-content .and{color:#B85F7A!important;}
.mempelai-page .bottom-caption{color:#456782!important;text-shadow:0 1px 0 rgba(255,255,255,.55)!important;}
.mempelai-page .back-link{color:#456782!important;border-bottom-color:rgba(184,95,122,.55)!important;}
.mempelai-page .photo-collage{border-color:rgba(199,164,106,.78)!important;box-shadow:0 4px 12px rgba(69,103,130,.16),inset 0 0 0 1px rgba(255,255,255,.86)!important;}


/* V184 — remove the old lace frame from the integrated Mempelai section.
   Apply the approved ivory champagne card, upright serif names and straight gallery. */
#mempelai.invitation-section{
  background:
    radial-gradient(ellipse at 15% 16%,rgba(255,255,255,.22),transparent 42%),
    radial-gradient(ellipse at 88% 75%,rgba(241,194,204,.13),transparent 36%),
    linear-gradient(180deg,#b8d4e8 0%,#b3d0e6 55%,#bad6e8 100%)!important;
  overflow:hidden!important;
}
#mempelai .lace-frame{display:none!important}
#mempelai .gold-sprig{display:none!important}
#mempelai .mempelai-content{
  left:4.5%!important;top:18%!important;width:63%!important;height:62%!important;
  padding:18px 13px 16px!important;
  border:1px solid rgba(190,151,91,.9)!important;border-radius:8px!important;
  background:linear-gradient(145deg,rgba(255,252,244,.98),rgba(247,241,229,.98))!important;
  box-shadow:0 7px 22px rgba(53,83,107,.13),inset 0 0 0 3px rgba(255,255,255,.72)!important;
  color:#435e75!important;overflow:visible!important;justify-content:center!important;
}
#mempelai .mempelai-content:before{
  content:""!important;display:block!important;position:absolute!important;inset:5px!important;
  border:1px solid rgba(190,151,91,.32)!important;border-radius:4px!important;
  box-shadow:none!important;pointer-events:none!important;z-index:0!important;
}
#mempelai .mempelai-content>*{position:relative!important;z-index:1!important;flex-shrink:0!important}
#mempelai .bismillah{
  color:#49657d!important;font-family:'Amiri',serif!important;font-size:clamp(17px,4.5vw,20px)!important;
  line-height:1.35!important;margin:0 0 7px!important;text-align:center!important;
}
#mempelai .intro{
  color:#4e5961!important;font-family:'Cormorant Garamond',Georgia,serif!important;
  font-size:clamp(10px,2.7vw,11.5px)!important;line-height:1.38!important;letter-spacing:.05px!important;
  margin:0 0 12px!important;width:100%!important;text-align:center!important;
}
#mempelai .person-name{
  color:#405e78!important;font-family:'Cormorant Garamond',Georgia,serif!important;
  font-size:clamp(23px,6.1vw,29px)!important;font-weight:600!important;font-style:normal!important;
  line-height:1.02!important;letter-spacing:.1px!important;text-align:center!important;
  width:100%!important;margin:0!important;overflow-wrap:anywhere!important;word-break:normal!important;
}
#mempelai .parent-line{
  color:#62666a!important;font-family:'Cormorant Garamond',Georgia,serif!important;
  font-size:clamp(9px,2.35vw,10px)!important;font-weight:400!important;line-height:1.3!important;
  text-align:center!important;width:100%!important;margin:4px 0 10px!important;
}
#mempelai #memWomanParents{margin-bottom:12px!important}
#mempelai .and{
  color:#c18498!important;font-family:'Cormorant Garamond',Georgia,serif!important;font-style:normal!important;
  font-size:15px!important;line-height:1.1!important;margin:0 0 7px!important;width:100%!important;text-align:center!important;
}
#mempelai .and:before,#mempelai .and:after{
  content:""!important;position:absolute!important;top:52%!important;width:17%!important;height:1px!important;
  background:linear-gradient(90deg,transparent,rgba(196,158,101,.8),transparent)!important;
}
#mempelai .and:before{left:7%!important}#mempelai .and:after{right:7%!important}
#mempelai .photo-collage{
  position:absolute!important;z-index:8!important;top:25%!important;right:3.5%!important;width:26%!important;
  padding:5px!important;gap:5px!important;background:linear-gradient(145deg,#fffdf8,#f5eadd)!important;
  border:1px solid rgba(194,154,96,.95)!important;border-radius:5px!important;
  box-shadow:0 6px 16px rgba(46,70,90,.22),inset 0 0 0 2px rgba(255,255,255,.88)!important;
  transform:none!important;pointer-events:none!important;
}
#mempelai .photo-collage.has-photos{display:flex!important}
#mempelai .photo-collage img{
  display:block!important;width:100%!important;aspect-ratio:3/4!important;object-fit:cover!important;
  border:1px solid rgba(194,154,96,.8)!important;outline:1px solid rgba(255,255,255,.9)!important;
  outline-offset:-3px!important;border-radius:2px!important;box-shadow:none!important;background:#f6efe5!important;
}
#mempelai .bottom-caption{display:none!important}
@media(max-width:380px){
 #mempelai.invitation-section{height:660px!important;min-height:660px!important}
 #mempelai .mempelai-content{left:3.5%!important;width:64%!important;top:18%!important;height:62%!important;padding:14px 9px 12px!important;border-radius:7px!important}
 #mempelai .bismillah{font-size:clamp(16px,4.5vw,18px)!important;margin-bottom:5px!important}
 #mempelai .intro{font-size:clamp(9.5px,2.65vw,10.5px)!important;line-height:1.32!important;margin-bottom:8px!important}
 #mempelai .person-name{font-size:clamp(21px,5.9vw,25px)!important;line-height:1.03!important}
 #mempelai .parent-line{font-size:clamp(8.5px,2.3vw,9.5px)!important;line-height:1.25!important;margin:3px 0 7px!important}
 #mempelai #memWomanParents{margin-bottom:8px!important}
 #mempelai .and{margin-bottom:5px!important}
 #mempelai .photo-collage{top:27%!important;right:2.5%!important;width:26%!important;padding:4px!important;gap:4px!important}
}
@media(max-height:760px){
 #mempelai .mempelai-content{top:16%!important;height:66%!important;padding-top:10px!important;padding-bottom:10px!important}
 #mempelai .intro{margin-bottom:7px!important}
 #mempelai .parent-line{margin-bottom:6px!important}
 #mempelai #memWomanParents{margin-bottom:7px!important}
}


/* V185 — remove the visible inner blue slab behind the Mempelai section.
   The page uses the shared powder-blue canvas; only the ivory name card and photo frames remain. */
#mempelai.invitation-section{
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  border:0!important;
  outline:0!important;
  isolation:isolate!important;
}
#mempelai.invitation-section::before,
#mempelai.invitation-section::after{
  content:none!important;
  display:none!important;
  background:none!important;
  box-shadow:none!important;
}
#mempelai .mempelai-content{
  /* The ivory card is the only intentional panel on this page. */
  background:linear-gradient(145deg,#fffdf7 0%,#f7f1e7 100%)!important;
}
#mempelai .photo-collage{
  /* Retain a consistent gallery frame; no surrounding page/lace panel. */
  background:linear-gradient(145deg,#fffdf8,#f5eadd)!important;
}


/* V186 — Mempelai layout refined to match approved reference composition.
   Move card/gallery closer to countdown; enlarge ivory card; equalize gallery height.
   Keep existing real couple photos, copy, timer, cover and opening artwork. */
#mempelai.invitation-section{
  height:760px!important;
  min-height:760px!important;
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  overflow:hidden!important;
}
#mempelai .mempelai-content{
  left:3.5%!important;
  top:4.5%!important;
  width:64%!important;
  height:79%!important;
  padding:24px 17px 22px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:0!important;
  box-sizing:border-box!important;
}
#mempelai .bismillah{
  font-size:clamp(18px,4.7vw,22px)!important;
  line-height:1.32!important;
  margin:0 0 8px!important;
}
#mempelai .intro{
  font-size:clamp(10.5px,2.8vw,12px)!important;
  line-height:1.42!important;
  margin:0 0 16px!important;
}
#mempelai .person-name{
  font-size:clamp(24px,6.2vw,31px)!important;
  line-height:1.08!important;
  letter-spacing:.15px!important;
}
#mempelai .parent-line{
  font-size:clamp(9.5px,2.45vw,10.5px)!important;
  line-height:1.35!important;
  margin:5px 0 13px!important;
}
#mempelai #memWomanParents{margin-bottom:15px!important}
#mempelai .and{
  font-size:16px!important;
  margin:0 0 9px!important;
}
#mempelai .photo-collage{
  top:4.5%!important;
  right:3.5%!important;
  width:26%!important;
  height:79%!important;
  box-sizing:border-box!important;
  padding:6px!important;
  gap:7px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-between!important;
}
#mempelai .photo-collage img{
  width:100%!important;
  height:calc((100% - 14px)/3)!important;
  min-height:0!important;
  flex:0 0 calc((100% - 14px)/3)!important;
  aspect-ratio:auto!important;
  object-fit:cover!important;
}
@media(max-width:380px){
  #mempelai.invitation-section{height:700px!important;min-height:700px!important}
  #mempelai .mempelai-content{
    left:3%!important;top:3.5%!important;width:64.5%!important;height:81%!important;
    padding:16px 10px 15px!important;
  }
  #mempelai .bismillah{font-size:clamp(16px,4.6vw,19px)!important;margin-bottom:6px!important}
  #mempelai .intro{font-size:clamp(9.5px,2.7vw,10.5px)!important;line-height:1.35!important;margin-bottom:10px!important}
  #mempelai .person-name{font-size:clamp(21px,5.9vw,25px)!important;line-height:1.06!important}
  #mempelai .parent-line{font-size:clamp(8.5px,2.35vw,9.5px)!important;line-height:1.28!important;margin:4px 0 8px!important}
  #mempelai #memWomanParents{margin-bottom:9px!important}
  #mempelai .and{font-size:14px!important;margin-bottom:6px!important}
  #mempelai .photo-collage{
    top:3.5%!important;right:2.5%!important;width:27%!important;height:81%!important;
    padding:4px!important;gap:5px!important;
  }
  #mempelai .photo-collage img{
    height:calc((100% - 10px)/3)!important;
    flex-basis:calc((100% - 10px)/3)!important;
  }
}


/* V187 — refined Mempelai card based on approved visual reference.
   Slightly narrower card, generous inner padding, floral corner accents,
   crisp dark readable parent details, and photo strip matched to card height. */
#mempelai.invitation-section{
  height:760px!important;min-height:760px!important;
  background:transparent!important;background-image:none!important;
  overflow:hidden!important;
}
#mempelai .mempelai-content{
  left:6%!important;top:4.5%!important;width:59%!important;height:79%!important;
  padding:24px 19px 26px!important;box-sizing:border-box!important;
  border:1.3px solid rgba(196,154,91,.96)!important;border-radius:15px 15px 13px 13px!important;
  background:linear-gradient(145deg,#fffdf8 0%,#f7f0e5 100%)!important;
  box-shadow:0 5px 15px rgba(48,75,96,.12),inset 0 0 0 4px rgba(255,255,255,.78)!important;
  justify-content:center!important;align-items:center!important;gap:0!important;
}
#mempelai .mempelai-content:before{
  content:""!important;display:block!important;position:absolute!important;inset:6px!important;
  border:1px solid rgba(196,154,91,.48)!important;border-radius:10px!important;
  pointer-events:none!important;z-index:0!important;
}
#mempelai .mempelai-content>*{position:relative!important;z-index:1!important;flex-shrink:0!important}
#mempelai .bismillah{
  color:#3f5d76!important;font-family:'Amiri',serif!important;
  font-size:clamp(18px,4.7vw,22px)!important;line-height:1.32!important;margin:0 0 8px!important;
}
#mempelai .intro{
  color:#383b3e!important;font-family:'Cormorant Garamond',Georgia,serif!important;
  font-size:clamp(10.5px,2.8vw,12px)!important;font-weight:500!important;
  line-height:1.43!important;letter-spacing:.08px!important;margin:0 0 15px!important;
  text-shadow:0 0 .01px currentColor!important;
}
#mempelai .person-name{
  color:#3e5d78!important;font-family:'Cormorant Garamond',Georgia,serif!important;
  font-size:clamp(23px,5.8vw,29px)!important;font-weight:600!important;font-style:normal!important;
  line-height:1.08!important;letter-spacing:.1px!important;text-align:center!important;
  width:100%!important;margin:0!important;
}
#mempelai .parent-line{
  color:#45484a!important;font-family:'Cormorant Garamond',Georgia,serif!important;
  font-size:clamp(9.5px,2.5vw,10.8px)!important;font-weight:500!important;
  line-height:1.38!important;letter-spacing:.06px!important;text-align:center!important;
  width:100%!important;margin:5px 0 13px!important;text-shadow:0 0 .01px currentColor!important;
}
#mempelai #memWomanParents{margin-bottom:14px!important}
#mempelai .and{
  color:#c68197!important;font-family:'Cormorant Garamond',Georgia,serif!important;
  font-size:16px!important;font-style:italic!important;line-height:1.1!important;margin:0 0 9px!important;
}
#mempelai .and:before,#mempelai .and:after{
  content:""!important;position:absolute!important;top:52%!important;width:18%!important;height:1px!important;
  background:linear-gradient(90deg,transparent,rgba(197,157,94,.86),transparent)!important;
}
#mempelai .and:before{left:5%!important}#mempelai .and:after{right:5%!important}
#mempelai .photo-collage{
  top:4.5%!important;right:6%!important;width:29%!important;height:79%!important;
  box-sizing:border-box!important;padding:6px!important;gap:7px!important;
  display:flex!important;flex-direction:column!important;justify-content:space-between!important;
  border:1.3px solid rgba(196,154,91,.96)!important;border-radius:15px!important;
  background:linear-gradient(145deg,#fffdf8,#f5eadd)!important;
  box-shadow:0 5px 15px rgba(48,75,96,.14),inset 0 0 0 3px rgba(255,255,255,.82)!important;
}
#mempelai .photo-collage img{
  display:block!important;width:100%!important;height:calc((100% - 14px)/3)!important;
  min-height:0!important;flex:0 0 calc((100% - 14px)/3)!important;aspect-ratio:auto!important;
  object-fit:cover!important;border:1px solid rgba(196,154,91,.9)!important;
  outline:1px solid rgba(255,255,255,.95)!important;outline-offset:-4px!important;
  border-radius:5px!important;box-shadow:none!important;
}
/* Decorative blush/ivory floral corners are CSS-only and do not cover text. */
#mempelai .mempelai-content:after{
  content:"✿"!important;position:absolute!important;z-index:2!important;
  top:-13px!important;left:-9px!important;width:32px!important;height:32px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  color:#d99eaa!important;font-size:24px!important;line-height:1!important;
  text-shadow:9px 7px 0 rgba(255,248,237,.95),14px 13px 0 rgba(191,157,108,.75)!important;
  pointer-events:none!important;
}
#mempelai .photo-collage:after{
  content:"✿"!important;position:absolute!important;z-index:2!important;
  right:-8px!important;bottom:-11px!important;width:30px!important;height:30px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  color:#d99eaa!important;font-size:22px!important;line-height:1!important;
  text-shadow:-8px -6px 0 rgba(255,248,237,.95),-13px -12px 0 rgba(191,157,108,.75)!important;
  pointer-events:none!important;
}
@media(max-width:380px){
 #mempelai.invitation-section{height:700px!important;min-height:700px!important}
 #mempelai .mempelai-content{left:4%!important;top:3.5%!important;width:60%!important;height:81%!important;padding:17px 10px 16px!important;border-radius:12px!important}
 #mempelai .bismillah{font-size:clamp(16px,4.6vw,19px)!important;margin-bottom:6px!important}
 #mempelai .intro{font-size:clamp(9.5px,2.7vw,10.7px)!important;line-height:1.35!important;margin-bottom:10px!important}
 #mempelai .person-name{font-size:clamp(20px,5.5vw,24px)!important;line-height:1.06!important}
 #mempelai .parent-line{font-size:clamp(8.7px,2.35vw,9.7px)!important;line-height:1.3!important;margin:4px 0 8px!important}
 #mempelai #memWomanParents{margin-bottom:9px!important}
 #mempelai .and{font-size:14px!important;margin-bottom:6px!important}
 #mempelai .photo-collage{top:3.5%!important;right:4%!important;width:30%!important;height:81%!important;padding:4px!important;gap:5px!important;border-radius:12px!important}
 #mempelai .photo-collage img{height:calc((100% - 10px)/3)!important;flex-basis:calc((100% - 10px)/3)!important;border-radius:4px!important}
 #mempelai .mempelai-content:after{font-size:20px!important;width:26px!important;height:26px!important;top:-9px!important;left:-6px!important}
 #mempelai .photo-collage:after{font-size:19px!important;width:25px!important;height:25px!important;right:-6px!important;bottom:-8px!important}
}


/* V188 — compact Mempelai card with the user's supplied floral corner artwork.
   Keep the gallery aligned to the card; remove excessive empty top/bottom space. */
#mempelai.invitation-section{
  height:700px!important;
  min-height:700px!important;
  overflow:hidden!important;
}
#mempelai .mempelai-content{
  top:10%!important;
  height:70%!important;
  padding:20px 18px 19px!important;
  box-sizing:border-box!important;
  justify-content:center!important;
}
#mempelai .mempelai-content:after{
  content:""!important;
  position:absolute!important;
  z-index:4!important;
  top:-2px!important;left:-2px!important;
  width:clamp(72px,22vw,104px)!important;
  height:clamp(72px,22vw,104px)!important;
  background:url("assets/mempelai-flower-top-left.png") left top/contain no-repeat!important;
  text-shadow:none!important;
  color:transparent!important;
  pointer-events:none!important;
}
#mempelai .photo-collage{
  top:10%!important;
  height:70%!important;
}
#mempelai .photo-collage:after{
  content:none!important;
  display:none!important;
}
#mempelai .photo-collage:before{
  content:""!important;
  position:absolute!important;
  z-index:4!important;
  right:-3px!important;bottom:-3px!important;
  width:clamp(78px,23vw,110px)!important;
  height:clamp(78px,23vw,110px)!important;
  background:url("assets/mempelai-flower-bottom-right.png") right bottom/contain no-repeat!important;
  pointer-events:none!important;
}
@media(max-width:380px){
 #mempelai.invitation-section{height:660px!important;min-height:660px!important}
 #mempelai .mempelai-content{top:9%!important;height:72%!important;padding:16px 10px 15px!important}
 #mempelai .mempelai-content:after{width:clamp(62px,21vw,80px)!important;height:clamp(62px,21vw,80px)!important}
 #mempelai .photo-collage{top:9%!important;height:72%!important}
 #mempelai .photo-collage:before{width:clamp(66px,22vw,86px)!important;height:clamp(66px,22vw,86px)!important}
}


/* V189 — shorten and lift the Mempelai card; move lower floral accent onto card corner. */
#mempelai.invitation-section{
  height:660px!important;
  min-height:660px!important;
}
#mempelai .mempelai-content{
  top:5.5%!important;
  height:66%!important;
}
#mempelai .photo-collage{
  top:5.5%!important;
  height:66%!important;
}
#mempelai .photo-collage:before{
  content:none!important;
  display:none!important;
}
#mempelai .mempelai-content{
  position:absolute!important;
}
#mempelai .mempelai-content .v189-flower-bottom{
  display:block!important;
  position:absolute!important;
  right:-3px!important;
  bottom:-3px!important;
  width:clamp(76px,22vw,108px)!important;
  height:clamp(76px,22vw,108px)!important;
  object-fit:contain!important;
  z-index:4!important;
  pointer-events:none!important;
}
@media(max-width:380px){
 #mempelai.invitation-section{height:620px!important;min-height:620px!important}
 #mempelai .mempelai-content{top:4.5%!important;height:68%!important}
 #mempelai .photo-collage{top:4.5%!important;height:68%!important}
 #mempelai .mempelai-content .v189-flower-bottom{width:clamp(66px,22vw,88px)!important;height:clamp(66px,22vw,88px)!important}
}


/* V190 — floral corner alignment and delicate countdown ornaments. */
#mempelai .mempelai-content:after{
  width:clamp(86px,25vw,112px)!important;
  height:clamp(86px,25vw,112px)!important;
  top:-2px!important;
  left:-2px!important;
}
#mempelai .mempelai-content .v189-flower-bottom{
  right:-8px!important;
  bottom:-3px!important;
  width:clamp(86px,25vw,112px)!important;
  height:clamp(86px,25vw,112px)!important;
}
@media(max-width:380px){
 #mempelai .mempelai-content:after,
 #mempelai .mempelai-content .v189-flower-bottom{
   width:clamp(72px,24vw,92px)!important;
   height:clamp(72px,24vw,92px)!important;
 }
 #mempelai .mempelai-content .v189-flower-bottom{right:-7px!important}
}


/* V192 — match the top-left floral accent scale to the lower-right accent. */
#mempelai .mempelai-content:after{
  width:clamp(86px,25vw,112px)!important;
  height:clamp(86px,25vw,112px)!important;
}
#mempelai .mempelai-content .v189-flower-bottom{
  width:clamp(86px,25vw,112px)!important;
  height:clamp(86px,25vw,112px)!important;
}
@media(max-width:380px){
 #mempelai .mempelai-content:after,
 #mempelai .mempelai-content .v189-flower-bottom{
   width:clamp(72px,24vw,92px)!important;
   height:clamp(72px,24vw,92px)!important;
 }
}


/* V193 — floral corner sizing is based on trimmed transparent PNGs for equal visible scale. */
#mempelai .mempelai-content:after{
  background-image:url("assets/mempelai-flower-top-left.png")!important;
  background-position:left top!important;background-size:100% 100%!important;background-repeat:no-repeat!important;
  width:clamp(86px,25vw,112px)!important;height:clamp(86px,25vw,112px)!important;
}
#mempelai .mempelai-content .v189-flower-bottom{
  width:clamp(86px,25vw,112px)!important;height:clamp(86px,25vw,112px)!important;
  object-fit:fill!important;
}
@media(max-width:380px){
 #mempelai .mempelai-content:after,
 #mempelai .mempelai-content .v189-flower-bottom{
   width:clamp(72px,24vw,92px)!important;height:clamp(72px,24vw,92px)!important;
 }
}


/* V194 — scale both floral corners down so they frame the card without covering copy.
   Match their visible footprint to the photo gallery's restrained decorative scale. */
#mempelai .mempelai-content:after{
  width:clamp(58px,17vw,76px)!important;
  height:clamp(58px,17vw,76px)!important;
  top:-1px!important;
  left:-1px!important;
  background-size:100% 100%!important;
}
#mempelai .mempelai-content .v189-flower-bottom{
  width:clamp(58px,17vw,76px)!important;
  height:clamp(58px,17vw,76px)!important;
  right:-5px!important;
  bottom:-2px!important;
  object-fit:fill!important;
}
@media(max-width:380px){
 #mempelai .mempelai-content:after,
 #mempelai .mempelai-content .v189-flower-bottom{
   width:clamp(52px,16vw,64px)!important;
   height:clamp(52px,16vw,64px)!important;
 }
 #mempelai .mempelai-content .v189-flower-bottom{right:-4px!important}
}


/* V195 — calendar and event polish only: subtle panel, tighter transition,
   crisp typography, and restrained champagne/blush ornaments. */
.event-page.invitation-section{
  margin-top:-122px!important; /* lift event/calendar section 10px closer to the couple card */
  padding-top:18px!important;
  padding-left:13px!important;
  padding-right:13px!important;
  color:#343638!important;
  background-color:#A9CBE7!important;
}
.event-page.invitation-section::before{
  inset:0 9px 0!important;
  border:1px solid rgba(199,164,106,.22)!important;
  border-radius:12px!important;
  background:linear-gradient(180deg,rgba(255,250,241,.035),rgba(69,103,130,.025))!important;
  box-shadow:none!important;
  pointer-events:none!important;
}
.event-inner{
  background:transparent!important;
  padding-top:0!important;
}
.calendar-strip{
  margin-top:0!important;
  margin-bottom:20px!important;
  padding:10px 7px 11px!important;
  border:1px solid rgba(199,164,106,.68)!important;
  border-radius:12px!important;
  background:rgba(255,250,242,.84)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.58),0 4px 12px rgba(55,82,104,.07)!important;
  backdrop-filter:none!important;
}
.calendar-month{
  color:#435D75!important;
  font-size:20px!important;
  letter-spacing:3.4px!important;
  text-shadow:none!important;
  margin-bottom:8px!important;
}
.calendar-day{color:#343638!important}
.calendar-day span{
  color:#65717C!important;
  font-size:11px!important;
}
.calendar-day b{
  color:#435D75!important;
  font-size:19px!important;
}
.calendar-day.is-wedding-day{
  background:rgba(217,158,170,.13)!important;
}
.calendar-day.is-wedding-day b{color:#435D75!important}
.heart-mark{
  color:#D99EAA!important;
  text-shadow:0 0 4px rgba(217,158,170,.24)!important;
}
.event-heading{
  margin:0 auto 15px!important;
}
.event-kicker{
  color:#9A8058!important;
  letter-spacing:2.1px!important;
}
.event-heading h2{
  color:#435D75!important;
  text-shadow:none!important;
}
.event-heading h2 em{color:#D09AA5!important}
.event-heading>p{
  color:#343638!important;
  font-size:12px!important;
  line-height:1.5!important;
  text-shadow:none!important;
}
.event-heading-rule{
  color:#C5A36D!important;
  margin-top:7px!important;
  opacity:.88!important;
}
.event-heading-rule:before,.event-heading-rule:after{
  background:linear-gradient(90deg,transparent,#C5A36D,transparent)!important;
  height:1px!important;
}
.event-heading-rule span{color:#D99EAA!important;font-size:15px!important}
.event-cards{gap:8px!important;margin-bottom:12px!important}
.event-card,
.event-page .event-location{
  border-color:rgba(197,163,109,.86)!important;
  background:linear-gradient(145deg,rgba(255,252,245,.97),rgba(247,240,228,.97))!important;
  color:#343638!important;
  box-shadow:0 4px 12px rgba(55,82,104,.09),inset 0 0 0 1px rgba(255,255,255,.76)!important;
}
.event-icon{color:#C5A36D!important}
.event-label{
  color:#92784F!important;
  font-weight:600!important;
}
.event-card h3,.event-location h3{
  color:#435D75!important;
  text-shadow:none!important;
}
.event-time,.event-location>p:not(.event-label){
  color:#343638!important;
  text-shadow:none!important;
}
.event-map-link{
  background:linear-gradient(135deg,#D9B977,#C5A36D)!important;
  color:#fffdf7!important;
  border-color:rgba(174,137,71,.65)!important;
  box-shadow:0 3px 8px rgba(92,73,42,.12)!important;
}
.event-closing{
  color:#435D75!important;
  text-shadow:none!important;
}
.event-bottom-flourish{color:#C5A36D!important}
@media(max-width:380px){
  .event-page.invitation-section{
    margin-top:-122px!important;
    padding-top:18px!important;
    padding-left:11px!important;
    padding-right:11px!important;
  }
  .calendar-strip{margin-bottom:18px!important;padding:9px 5px 10px!important}
  .calendar-month{font-size:19px!important;letter-spacing:3px!important}
  .calendar-day span{font-size:10px!important}
  .calendar-day b{font-size:18px!important}
  .event-heading{margin-bottom:13px!important}
  .event-heading>p{font-size:11.5px!important}
  .event-card h3{font-size:20px!important}
  .event-location h3{font-size:19px!important}
  .event-location>p:not(.event-label){font-size:10.5px!important;line-height:1.48!important}
}


/* V196 — final micro-spacing polish for the calendar and event section only.
   Lift calendar 8px closer to the couple card and tighten intro-to-event-card spacing. */
.event-page.invitation-section{
  margin-top:-130px!important;
}
.event-heading{
  margin-bottom:11px!important;
}
@media(max-width:380px){
  .event-page.invitation-section{
    margin-top:-130px!important;
  }
  .event-heading{
    margin-bottom:10px!important;
  }
}


/* V197 — RSVP & guestbook redesign: remove lace art; unified soft-romantic luxury card. */
.rsvp-page.invitation-section{
  width:min(100%,430px)!important;
  margin:0 auto!important;
  padding:24px 14px 28px!important;
  box-sizing:border-box!important;
  overflow:visible!important;
  background:transparent!important;
  color:#343638!important;
}
.rsvp-frame-card{
  width:100%!important;
  max-width:402px!important;
  height:auto!important;
  min-height:0!important;
  margin:0 auto!important;
  position:relative!important;
  isolation:isolate!important;
  overflow:visible!important;
  border:1px solid rgba(197,163,109,.9)!important;
  border-radius:18px!important;
  padding:clamp(16px,4.5vw,22px)!important;
  box-sizing:border-box!important;
  background:linear-gradient(145deg,#FFFCF5 0%,#F8F1E5 100%)!important;
  box-shadow:0 8px 22px rgba(52,78,100,.11),inset 0 0 0 3px rgba(255,255,255,.75)!important;
}
.rsvp-frame-card:before{
  content:""!important;
  position:absolute!important;
  inset:5px!important;
  border:1px solid rgba(197,163,109,.36)!important;
  border-radius:13px!important;
  pointer-events:none!important;
  z-index:0!important;
}
.rsvp-paper{
  position:relative!important;
  inset:auto!important;
  left:auto!important;top:auto!important;
  width:100%!important;height:auto!important;
  min-height:0!important;
  padding:clamp(10px,3vw,15px)!important;
  box-sizing:border-box!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  gap:10px!important;
  overflow:visible!important;
  border:0!important;border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#343638!important;
  z-index:1!important;
}
.rsvp-paper>*{min-width:0!important;position:relative!important;z-index:1!important}
#rsvpIntroView{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:5px!important;width:100%!important;padding:0!important}
.rsvp-title{
  font:700 clamp(21px,5.6vw,26px)/1.15 Georgia,serif!important;
  letter-spacing:0!important;text-align:center!important;white-space:normal!important;
  color:#435D75!important;margin:0 0 2px!important;
}
.rsvp-date{font:12px/1.4 Georgia,serif!important;color:#5C6D7A!important;text-align:center!important;margin:0!important}
.rsvp-venue-line{justify-content:center!important;text-align:center!important;gap:6px!important;font:600 13px/1.35 Georgia,serif!important;color:#435D75!important}
.rsvp-pin{color:#C5A36D!important}
.rsvp-address{font:11px/1.5 Georgia,serif!important;color:#343638!important;text-align:center!important;margin:0!important}
.rsvp-attendance-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;margin:7px 0 0!important}
.rsvp-choice{
  display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
  min-height:54px!important;padding:8px!important;gap:3px!important;
  border:1px solid rgba(197,163,109,.62)!important;border-radius:11px!important;
  background:linear-gradient(145deg,#FFFFFF,#F7F0E5)!important;color:#435D75!important;
  box-shadow:0 3px 8px rgba(52,78,100,.06)!important;font:12px Georgia,serif!important;
}
.rsvp-choice span{font-size:16px!important;line-height:1!important}
.rsvp-choice b{font-weight:600!important}
.rsvp-choice.is-present{border-color:#C5A36D!important;background:linear-gradient(145deg,#FFFDF7,#F4EADB)!important}
.rsvp-form{display:flex!important;flex-direction:column!important;gap:8px!important;padding:4px 0!important;margin:0!important}
.rsvp-choice-summary{text-align:center!important;color:#435D75!important;font:600 13px Georgia,serif!important;padding:5px!important}
.rsvp-form label{font:600 12px/1.35 Georgia,serif!important;color:#435D75!important;margin:2px 0 0!important}
.rsvp-form input,.rsvp-form textarea{
  width:100%!important;box-sizing:border-box!important;border:1px solid #D8C9AC!important;border-radius:9px!important;
  background:rgba(255,255,255,.9)!important;color:#343638!important;font:13px/1.4 Georgia,serif!important;padding:10px!important;
}
.rsvp-form textarea{min-height:88px!important;max-height:160px!important;resize:vertical!important}
.rsvp-form-actions{display:flex!important;gap:8px!important;justify-content:flex-end!important;margin-top:3px!important}
.rsvp-form-actions button,.rsvp-success button{border:1px solid #D5C29D!important;border-radius:20px!important;padding:9px 15px!important;font:12px Georgia,serif!important;background:#F8F2E8!important;color:#435D75!important}
.rsvp-form-actions .rsvp-submit{background:linear-gradient(135deg,#D9B977,#C5A36D)!important;color:#fff!important;border-color:#C5A36D!important}
.rsvp-success{text-align:center!important;padding:12px 4px!important;color:#435D75!important}
.rsvp-success h3{font:700 19px Georgia,serif!important;color:#435D75!important;margin:5px 0!important}
.rsvp-success p{font:13px/1.5 Georgia,serif!important;color:#343638!important;margin:0!important}
.success-sparkle{color:#D99EAA!important;font-size:20px!important}
.inline-guestbook{
  display:flex!important;flex-direction:column!important;gap:8px!important;
  min-height:0!important;flex:0 0 auto!important;overflow:visible!important;
  border-top:1px solid rgba(197,163,109,.48)!important;padding-top:13px!important;margin-top:3px!important;
}
.inline-guestbook-heading{flex:0 0 auto!important;text-align:center!important}
.guestbook-kicker{font:600 9px Georgia,serif!important;letter-spacing:2px!important;color:#A58A5B!important;margin:0 0 4px!important}
.inline-guestbook h2{font:700 21px/1.2 Georgia,serif!important;color:#435D75!important;text-align:center!important;margin:0 0 4px!important}
.guestbook-intro{font:12px/1.45 Georgia,serif!important;color:#5B6267!important;text-align:center!important;margin:0 0 4px!important}
.guestbook-list{display:flex!important;flex-direction:column!important;gap:8px!important;overflow:visible!important;min-height:0!important;flex:0 0 auto!important;padding:0!important}
.guestbook-empty{font:12px/1.5 Georgia,serif!important;color:#68635D!important;text-align:center!important;margin:0!important;padding:12px 8px!important}
.guestbook-entry{
  position:relative!important;background:rgba(255,255,255,.72)!important;border:1px solid rgba(197,163,109,.38)!important;
  border-radius:10px!important;padding:11px 12px!important;text-align:left!important;
  box-shadow:0 2px 7px rgba(52,78,100,.035)!important;
}
.guestbook-entry h3{font:600 13px/1.3 Georgia,serif!important;color:#435D75!important;margin:0 0 5px!important;padding-right:86px!important;overflow-wrap:anywhere!important}
.guestbook-attendance{position:absolute!important;right:9px!important;top:9px!important;font:10px Georgia,serif!important;border-radius:12px!important;padding:4px 7px!important}
.guestbook-attendance.attending{background:#E6EEE9!important;color:#456B58!important}
.guestbook-attendance.not-attending{background:#F7E7EA!important;color:#986A76!important}
.guestbook-entry p{font:12px/1.5 Georgia,serif!important;color:#343638!important;margin:0!important;white-space:pre-wrap!important;overflow-wrap:anywhere!important}
.guestbook-pagination{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;padding-top:4px!important}
.guestbook-pagination[hidden]{display:none!important}
.guestbook-pagination button{border:1px solid rgba(197,163,109,.65)!important;border-radius:18px!important;padding:7px 11px!important;background:#FBF7EE!important;color:#435D75!important;font:11px Georgia,serif!important}
.guestbook-pagination button:disabled{opacity:.4!important}
.guestbook-pagination span{font:11px Georgia,serif!important;color:#5B6267!important;white-space:nowrap!important}
@media(max-width:380px){
  .rsvp-page.invitation-section{padding:18px 10px 22px!important}
  .rsvp-frame-card{padding:14px!important;border-radius:16px!important}
  .rsvp-paper{padding:8px!important;gap:8px!important}
  .rsvp-title{font-size:20px!important}
  .rsvp-date{font-size:11px!important}
  .rsvp-venue-line{font-size:12px!important}
  .rsvp-address{font-size:10px!important}
  .rsvp-choice{min-height:50px!important}
  .inline-guestbook h2{font-size:19px!important}
  .guestbook-entry{padding:10px!important}
  .guestbook-entry h3{font-size:12px!important}
  .guestbook-entry p{font-size:11px!important}
  .guestbook-pagination button{padding:7px 9px!important;font-size:10px!important}
}


/* Respect native hidden state for RSVP view switching and pagination. */
#rsvpIntroView[hidden],#rsvpForm[hidden],#rsvpSuccess[hidden],
#guestbookPagination[hidden]{display:none!important}


/* V198 — RSVP Soft Romantic Luxury + single-step attendance form. */
.rsvp-page.invitation-section{
  padding:22px 14px 28px!important;
  background:transparent!important;
}
.rsvp-frame-card{
  max-width:402px!important;
  padding:clamp(17px,4.4vw,23px)!important;
  border:1px solid rgba(197,163,109,.82)!important;
  border-radius:20px!important;
  background:linear-gradient(145deg,#FFFCF6 0%,#F8F1E6 100%)!important;
  box-shadow:0 8px 22px rgba(52,78,100,.10),inset 0 0 0 3px rgba(255,255,255,.78)!important;
}
.rsvp-frame-card:before{
  inset:5px!important;border:1px solid rgba(197,163,109,.32)!important;border-radius:15px!important;
}
.rsvp-frame-card:after{
  content:""!important;position:absolute!important;inset:0!important;z-index:0!important;pointer-events:none!important;
  background-image:url("assets/mempelai-flower-top-left.png"),url("assets/mempelai-flower-bottom-right.png")!important;
  background-repeat:no-repeat,no-repeat!important;
  background-position:left top,right bottom!important;
  background-size:64px 64px,64px 64px!important;
  opacity:.82!important;
}
.rsvp-paper{padding:clamp(13px,3.5vw,18px)!important;gap:12px!important;z-index:1!important}
.rsvp-kicker{
  color:#A58A5B!important;font:600 9px/1.4 Georgia,serif!important;letter-spacing:2.2px!important;
  text-align:center!important;margin:0 0 1px!important;
}
.rsvp-title{
  font:700 clamp(22px,5.7vw,27px)/1.13 Georgia,serif!important;
  color:#435D75!important;text-align:center!important;margin:0!important;letter-spacing:0!important;
}
.rsvp-date{font:12px/1.4 Georgia,serif!important;color:#5B6873!important;margin:0!important}
.rsvp-venue-line{font:600 13px/1.35 Georgia,serif!important;color:#435D75!important}
.rsvp-address{font:11px/1.5 Georgia,serif!important;color:#343638!important}
.rsvp-attendance-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;margin:8px 0 2px!important}
.rsvp-choice{
  min-height:52px!important;padding:8px 6px!important;border:1px solid rgba(197,163,109,.58)!important;
  border-radius:12px!important;background:rgba(255,255,255,.56)!important;color:#435D75!important;
  box-shadow:0 2px 7px rgba(52,78,100,.035)!important;transition:background .18s,border-color .18s,box-shadow .18s!important;
}
.rsvp-choice span{font-size:15px!important}
.rsvp-choice b{font:600 12px Georgia,serif!important}
.rsvp-choice.is-selected{
  border-color:#C5A36D!important;background:linear-gradient(145deg,#FFFDF7,#F2E7D5)!important;
  box-shadow:inset 0 0 0 1px rgba(197,163,109,.22),0 3px 8px rgba(52,78,100,.06)!important;
}
.rsvp-choice[data-attendance="Tidak Hadir"].is-selected{
  border-color:#D9A4AF!important;background:linear-gradient(145deg,#FFF9F9,#F6E5E9)!important;
}
.rsvp-form{
  display:flex!important;flex-direction:column!important;gap:7px!important;
  padding:13px 0 2px!important;margin:0!important;border-top:1px solid rgba(197,163,109,.38)!important;
}
.rsvp-form label{font:600 12px/1.35 Georgia,serif!important;color:#435D75!important;margin:2px 0 0!important}
.rsvp-optional{font-weight:400!important;color:#8B8580!important;font-size:10px!important}
.rsvp-form input,.rsvp-form textarea{
  width:100%!important;box-sizing:border-box!important;border:1px solid #D8C9AC!important;border-radius:10px!important;
  background:rgba(255,255,255,.82)!important;color:#343638!important;font:13px/1.45 Georgia,serif!important;padding:10px 11px!important;
}
.rsvp-form input:focus,.rsvp-form textarea:focus{outline:2px solid rgba(197,163,109,.25)!important;border-color:#C5A36D!important}
.rsvp-form textarea{min-height:78px!important;max-height:150px!important;resize:vertical!important}
.rsvp-form-actions{display:flex!important;justify-content:center!important;margin-top:5px!important}
.rsvp-form-actions .rsvp-submit{
  min-width:180px!important;border:1px solid #C5A36D!important;border-radius:24px!important;padding:11px 20px!important;
  background:linear-gradient(135deg,#D9B977,#C5A36D)!important;color:#FFFCF5!important;
  box-shadow:0 4px 10px rgba(92,73,42,.12)!important;font:600 12px Georgia,serif!important;letter-spacing:.2px!important;
}
.rsvp-success{padding:20px 8px!important}
.rsvp-success h3{color:#435D75!important;font:700 21px Georgia,serif!important}
.rsvp-success p{color:#343638!important;font:13px/1.5 Georgia,serif!important}
.inline-guestbook{position:relative!important;z-index:1!important}
#rsvpIntroView[hidden],#rsvpForm[hidden],#rsvpSuccess[hidden],#guestbookPagination[hidden]{display:none!important}
@media(max-width:380px){
 .rsvp-page.invitation-section{padding:18px 10px 22px!important}
 .rsvp-frame-card{padding:14px!important;border-radius:17px!important}
 .rsvp-frame-card:after{background-size:52px 52px,52px 52px!important}
 .rsvp-paper{padding:12px 8px!important;gap:10px!important}
 .rsvp-kicker{font-size:8px!important;letter-spacing:1.8px!important}
 .rsvp-title{font-size:21px!important}
 .rsvp-date{font-size:11px!important}
 .rsvp-venue-line{font-size:12px!important}
 .rsvp-address{font-size:10px!important}
 .rsvp-choice{min-height:49px!important}
 .rsvp-form input,.rsvp-form textarea{font-size:12px!important}
 .rsvp-form-actions .rsvp-submit{min-width:170px!important}
}


/* V199 — Romantic editorial closing page + readable powder-blue footer.
   Scope is limited to #penutup and the global site footer. */
#penutup.closing-page.invitation-section{
  width:min(100%,390px)!important;
  height:486px!important;min-height:486px!important;
  margin:0 auto!important;padding:0!important;position:relative!important;overflow:hidden!important;
  background-color:#A9CBE7!important;
  background-image:linear-gradient(180deg,rgba(235,244,250,.18),rgba(169,203,231,.08)),url('assets/closing-background-texture.png')!important;
  background-size:cover!important;background-position:center center!important;background-repeat:no-repeat!important;
  color:#344F68!important;
}
#penutup.closing-page.invitation-section::before{content:none!important;display:none!important}
#penutup .closing-floral-red,#penutup .closing-floral-white{display:none!important}
#penutup .closing-photo-mount{
  position:absolute!important;top:22px!important;left:50%!important;transform:translateX(-50%)!important;
  width:226px!important;height:177px!important;padding:0!important;box-sizing:border-box!important;
  background:#FFFCF5!important;border:1px solid #C8A76D!important;border-radius:2px!important;
  box-shadow:0 5px 15px rgba(49,76,99,.18),inset 0 0 0 3px rgba(255,255,255,.86)!important;
  z-index:2!important;overflow:hidden!important;
}
#penutup .closing-photo-slot{
  position:absolute!important;left:6px!important;top:6px!important;width:212px!important;height:140px!important;
  overflow:hidden!important;background:#E6EDF1!important;border:1px solid rgba(197,163,109,.5)!important;box-sizing:border-box!important;
}
#penutup .closing-photo-slot img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center center!important}
#penutup .closing-photo-caption{
  position:absolute!important;left:8px!important;right:8px!important;bottom:7px!important;text-align:center!important;
  color:#435D75!important;font:600 8px/1 Georgia,serif!important;letter-spacing:2.1px!important;
}
#penutup .closing-message{
  position:absolute!important;top:216px!important;left:25px!important;right:25px!important;width:auto!important;
  z-index:2!important;color:#435D75!important;text-align:center!important;pointer-events:none!important;
}
#penutup .closing-message-kicker{
  margin:0 0 5px!important;color:#A18451!important;font:600 8px/1.3 Georgia,serif!important;letter-spacing:2.1px!important;text-align:center!important;
}
#penutup .closing-message h2{
  margin:0!important;color:#3E5B76!important;font:600 26px/1.12 Georgia,'Times New Roman',serif!important;
  letter-spacing:.2px!important;text-shadow:none!important;
}
#penutup .closing-message-copy{
  max-width:320px!important;margin:10px auto 0!important;color:#344B60!important;
  font:12px/1.55 Georgia,'Times New Roman',serif!important;letter-spacing:0!important;text-align:center!important;
}
#penutup .closing-paper-wrap{
  position:absolute!important;left:25px!important;right:25px!important;top:343px!important;width:auto!important;height:116px!important;
  transform:none!important;box-sizing:border-box!important;overflow:visible!important;z-index:1!important;
  background:linear-gradient(145deg,#FFFCF6 0%,#F7F0E5 100%)!important;
  border:1px solid rgba(197,163,109,.9)!important;border-radius:15px!important;
  box-shadow:inset 0 0 0 3px rgba(255,255,255,.86),0 5px 14px rgba(55,81,102,.10)!important;
}
#penutup .closing-paper-wrap::before,#penutup .closing-paper-wrap::after{
  content:""!important;position:absolute!important;width:54px!important;height:54px!important;pointer-events:none!important;
  background-size:contain!important;background-repeat:no-repeat!important;opacity:.72!important;z-index:0!important;
}
#penutup .closing-paper-wrap::before{left:-4px!important;top:-5px!important;background-image:url('assets/floral-small-pink.png')!important}
#penutup .closing-paper-wrap::after{right:-4px!important;bottom:-5px!important;background-image:url('assets/floral-corner-bottom-right.png')!important}
#penutup .closing-paper-art{display:none!important}
#penutup .closing-paper-text{
  position:absolute!important;left:19px!important;right:19px!important;top:22px!important;z-index:1!important;
  color:#344B60!important;text-align:center!important;font-family:Georgia,'Times New Roman',serif!important;
}
#penutup .closing-paper-text>p:first-child{margin:0!important;font:11px/1.45 Georgia,'Times New Roman',serif!important;color:#344B60!important}
#penutup .closing-names{
  margin:6px 0 0!important;font-family:'Cormorant Garamond',Georgia,serif!important;font-size:24px!important;
  font-weight:600!important;line-height:1.05!important;letter-spacing:.25px!important;color:#405D78!important;text-shadow:none!important;
}
#penutup .closing-signoff{margin:4px 0 0!important;color:#9B7B55!important;font:italic 9px/1.25 Georgia,serif!important}

/* Footer: increase contrast on the same powder-blue texture; retain links and layout. */
body.invitation-flow .site-footer{
  background-color:#A9CBE7!important;background-image:url('assets/closing-background-texture.png')!important;
  background-position:center bottom!important;background-size:cover!important;background-repeat:no-repeat!important;
  border-top:1px solid rgba(65,94,119,.22)!important;box-shadow:none!important;
  color:#29465F!important;padding:14px 14px 22px!important;gap:8px!important;
}
body.invitation-flow .site-footer:before{background:transparent!important;opacity:0!important}
body.invitation-flow .site-footer-credit{
  color:#29465F!important;text-shadow:none!important;font-size:11px!important;font-weight:600!important;
  letter-spacing:.45px!important;line-height:1.35!important;
}
body.invitation-flow .site-footer-credit strong{color:#8B5F72!important;font-weight:700!important}
body.invitation-flow .site-footer-link{
  color:#29465F!important;text-shadow:none!important;opacity:1!important;font-size:10px!important;font-weight:600!important;
}
body.invitation-flow .footer-icon{color:#8B5F72!important;border-color:#B99A61!important;background:rgba(255,252,246,.48)!important}
@media(max-width:380px){
 #penutup.closing-page.invitation-section{height:474px!important;min-height:474px!important}
 #penutup .closing-photo-mount{top:18px!important;width:214px!important;height:169px!important}
 #penutup .closing-photo-slot{width:200px!important;height:132px!important}
 #penutup .closing-message{top:204px!important;left:20px!important;right:20px!important}
 #penutup .closing-message h2{font-size:24px!important}
 #penutup .closing-message-copy{font-size:11px!important;line-height:1.48!important;margin-top:8px!important}
 #penutup .closing-paper-wrap{top:331px!important;left:18px!important;right:18px!important;height:116px!important}
 #penutup .closing-paper-text{left:16px!important;right:16px!important;top:22px!important}
 #penutup .closing-paper-text>p:first-child{font-size:10px!important}
 #penutup .closing-names{font-size:22px!important}
 #penutup .closing-paper-wrap::before,#penutup .closing-paper-wrap::after{width:47px!important;height:47px!important}
 body.invitation-flow .site-footer{padding:13px 10px 22px!important}
 body.invitation-flow .site-footer-link{font-size:9.5px!important}
}


/* V200 — Fix closing-page overlap: one photo, one thank-you card, footer below. */
#penutup.closing-page.invitation-section{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:18px!important;
  width:min(100%,390px)!important;
  height:auto!important;
  min-height:0!important;
  margin:0 auto!important;
  padding:22px 18px 28px!important;
  box-sizing:border-box!important;
  position:relative!important;
  overflow:visible!important;
  background-color:#A9CBE7!important;
  background-image:linear-gradient(180deg,rgba(235,244,250,.10),rgba(169,203,231,.04)),url('assets/closing-background-texture.png')!important;
  background-size:cover!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
  color:#344B60!important;
}
#penutup.closing-page.invitation-section::before{content:none!important;display:none!important}
#penutup .closing-message{display:none!important}
#penutup .closing-photo-mount{
  position:relative!important;
  top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;
  transform:none!important;
  flex:0 0 auto!important;
  width:226px!important;height:177px!important;
  margin:0 auto!important;padding:0!important;
  box-sizing:border-box!important;
  background:#FFFCF5!important;
  border:1px solid #C8A76D!important;
  border-radius:3px!important;
  box-shadow:0 5px 15px rgba(49,76,99,.16),inset 0 0 0 3px rgba(255,255,255,.86)!important;
  overflow:hidden!important;
  z-index:2!important;
}
#penutup .closing-photo-slot{
  position:absolute!important;left:6px!important;top:6px!important;
  width:212px!important;height:140px!important;
  overflow:hidden!important;background:#E6EDF1!important;
  border:1px solid rgba(197,163,109,.5)!important;box-sizing:border-box!important;
}
#penutup .closing-photo-slot img{
  display:block!important;width:100%!important;height:100%!important;
  object-fit:cover!important;object-position:center center!important;
}
#penutup .closing-photo-caption{
  position:absolute!important;left:8px!important;right:8px!important;bottom:7px!important;
  text-align:center!important;color:#435D75!important;
  font:600 8px/1 Georgia,serif!important;letter-spacing:2.1px!important;
}
#penutup .closing-paper-wrap{
  position:relative!important;
  top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;
  transform:none!important;
  flex:0 0 auto!important;
  width:100%!important;max-width:350px!important;
  height:auto!important;min-height:0!important;
  margin:0 auto!important;padding:22px 19px 20px!important;
  box-sizing:border-box!important;overflow:visible!important;
  background:linear-gradient(145deg,#FFFCF6 0%,#F7F0E5 100%)!important;
  border:1px solid rgba(197,163,109,.88)!important;border-radius:16px!important;
  box-shadow:inset 0 0 0 3px rgba(255,255,255,.82),0 5px 14px rgba(55,81,102,.10)!important;
  z-index:1!important;
}
#penutup .closing-paper-wrap::before,#penutup .closing-paper-wrap::after{
  content:""!important;position:absolute!important;width:43px!important;height:43px!important;
  pointer-events:none!important;background-size:contain!important;background-repeat:no-repeat!important;
  opacity:.66!important;z-index:0!important;
}
#penutup .closing-paper-wrap::before{
  left:-3px!important;top:-3px!important;background-image:url('assets/floral-small-pink.png')!important;
}
#penutup .closing-paper-wrap::after{
  right:-3px!important;bottom:-3px!important;background-image:url('assets/floral-corner-bottom-right.png')!important;
}
#penutup .closing-paper-art{display:none!important}
#penutup .closing-paper-text{
  position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
  display:flex!important;flex-direction:column!important;align-items:center!important;
  width:100%!important;height:auto!important;gap:0!important;
  box-sizing:border-box!important;z-index:1!important;
  color:#344B60!important;text-align:center!important;
  font-family:Georgia,'Times New Roman',serif!important;
}
#penutup .closing-paper-kicker{
  margin:0 0 6px!important;color:#A18451!important;
  font:600 8px/1.4 Georgia,serif!important;letter-spacing:2px!important;
}
#penutup .closing-thanks{
  display:block!important;margin:0!important;color:#3E5B76!important;
  font:600 25px/1.12 Georgia,'Times New Roman',serif!important;
  letter-spacing:.1px!important;text-shadow:none!important;
}
#penutup .closing-paper-copy{
  margin:10px 0 0!important;color:#344B60!important;
  font:12px/1.55 Georgia,'Times New Roman',serif!important;
  max-width:290px!important;text-align:center!important;
}
#penutup .closing-paper-divider{
  display:flex!important;align-items:center!important;justify-content:center!important;
  gap:10px!important;width:100%!important;margin:12px 0 10px!important;
  color:#D5A0AD!important;font:12px/1 Georgia,serif!important;
}
#penutup .closing-paper-divider::before,#penutup .closing-paper-divider::after{
  content:""!important;display:block!important;width:48px!important;height:1px!important;
  background:linear-gradient(90deg,transparent,#C5A36D)!important;
}
#penutup .closing-paper-divider::after{background:linear-gradient(90deg,#C5A36D,transparent)!important}
#penutup .closing-paper-wish{
  margin:0!important;max-width:280px!important;color:#435D75!important;
  font:11px/1.5 Georgia,'Times New Roman',serif!important;text-align:center!important;
}
#penutup .closing-names{
  margin:10px 0 0!important;color:#405D78!important;
  font-family:'Cormorant Garamond',Georgia,serif!important;
  font-size:25px!important;font-weight:600!important;line-height:1.08!important;
  letter-spacing:.2px!important;text-shadow:none!important;
}
#penutup .closing-signoff{
  margin:5px 0 0!important;color:#9B7B55!important;
  font:italic 9px/1.35 Georgia,serif!important;
}
body.invitation-flow .site-footer{
  position:relative!important;
  width:min(100%,390px)!important;min-height:0!important;
  margin:0 auto!important;padding:14px 14px 24px!important;
  box-sizing:border-box!important;
  background-color:#A9CBE7!important;
  background-image:url('assets/closing-background-texture.png')!important;
  background-position:center bottom!important;background-size:cover!important;background-repeat:no-repeat!important;
  border-top:1px solid rgba(65,94,119,.24)!important;
  box-shadow:none!important;color:#29465F!important;
}
body.invitation-flow .site-footer:before{display:none!important}
body.invitation-flow .site-footer-credit{
  color:#29465F!important;text-shadow:none!important;font-size:11px!important;
  font-weight:600!important;letter-spacing:.35px!important;line-height:1.4!important;
}
body.invitation-flow .site-footer-credit strong{color:#8B5F72!important;font-weight:700!important}
body.invitation-flow .site-footer-link{
  color:#29465F!important;text-shadow:none!important;opacity:1!important;
  font-size:10px!important;font-weight:600!important;
}
body.invitation-flow .footer-icon{
  color:#8B5F72!important;border-color:#B99A61!important;
  background:rgba(255,252,246,.65)!important;
}
@media(max-width:380px){
  #penutup.closing-page.invitation-section{gap:15px!important;padding:18px 14px 23px!important}
  #penutup .closing-photo-mount{width:214px!important;height:169px!important}
  #penutup .closing-photo-slot{width:200px!important;height:132px!important}
  #penutup .closing-paper-wrap{padding:19px 15px 18px!important;border-radius:14px!important}
  #penutup .closing-paper-wrap::before,#penutup .closing-paper-wrap::after{width:37px!important;height:37px!important}
  #penutup .closing-thanks{font-size:23px!important}
  #penutup .closing-paper-copy{font-size:11px!important;line-height:1.5!important;margin-top:8px!important}
  #penutup .closing-paper-divider{margin:10px 0 8px!important}
  #penutup .closing-paper-wish{font-size:10.5px!important}
  #penutup .closing-names{font-size:23px!important}
  body.invitation-flow .site-footer{padding:12px 10px 22px!important}
  body.invitation-flow .site-footer-link{font-size:9.5px!important}
}


/* V201 — Final finishing touch: coordinate both closing-card floral corners. */
#penutup .closing-paper-wrap::before,
#penutup .closing-paper-wrap::after{
  width:48px!important;
  height:48px!important;
  background-image:url('assets/floral-corner-bottom-right.png')!important;
  background-size:contain!important;
  background-repeat:no-repeat!important;
  opacity:.76!important;
}
#penutup .closing-paper-wrap::before{
  left:-3px!important;
  top:-3px!important;
  right:auto!important;
  bottom:auto!important;
  transform:rotate(180deg)!important;
}
#penutup .closing-paper-wrap::after{
  right:-3px!important;
  bottom:-3px!important;
  left:auto!important;
  top:auto!important;
  transform:none!important;
}
@media(max-width:380px){
  #penutup .closing-paper-wrap::before,
  #penutup .closing-paper-wrap::after{
    width:40px!important;
    height:40px!important;
  }
}


/* V208 — improve readability of the cover notice on the powder-blue background. */
body.invitation-flow #cover .cover-notice{
  color:#FFFFFF!important;
  text-shadow:0 1px 3px rgba(48,75,98,.78),0 0 6px rgba(48,75,98,.38)!important;
}


/* V209 — samakan ukuran nama mempelai dengan teks informasi lain pada kartu. */
.mempelai-page .mempelai-content .person-name {
  font-size: 12px !important;
  line-height: 1.25 !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
}


/* V210 FIX: This stylesheet is actually linked by index.html. Match the couple names to the body copy. */
#mempelai .mempelai-content h1.person-name,
#mempelai .mempelai-content h2.person-name {
  font-family: Georgia, serif !important;
  font-size: 10px !important;
  font-weight: 400 !important;
  line-height: 1.22 !important;
  letter-spacing: 0 !important;
  margin: 0 0 3px !important;
  text-shadow: none !important;
  transform: none !important;
}


/* V211: larger full-name lines, justified edge-to-edge, without wrapping. */
#mempelai .mempelai-content .person-name,
.mempelai-page #mempelai .person-name {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: clamp(12px, 3.25vw, 14px) !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  text-align: justify !important;
  text-align-last: justify !important;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  letter-spacing: -0.15px !important;
}


/* V212: larger full names, centered naturally on one line. */
#mempelai .mempelai-content h1.person-name,
#mempelai .mempelai-content h2.person-name,
.mempelai-page #mempelai .mempelai-content .person-name {
  display:block!important;
  box-sizing:border-box!important;
  width:100%!important;
  max-width:100%!important;
  padding-left:2px!important;
  padding-right:2px!important;
  font-family:Georgia, "Times New Roman", serif!important;
  font-size:clamp(13px,3.6vw,15px)!important;
  font-weight:400!important;
  line-height:1.25!important;
  letter-spacing:0!important;
  text-align:center!important;
  text-align-last:center!important;
  white-space:nowrap!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  text-wrap:nowrap!important;
  margin:0 0 3px!important;
  text-shadow:none!important;
}

/* V213: compact the Mempelai card/gallery vertically to reduce excessive top/bottom whitespace. */
#mempelai.invitation-section{
  height:660px!important;
  min-height:660px!important;
}
#mempelai .mempelai-content{
  top:5.5%!important;
  height:70%!important;
  padding-top:12px!important;
  padding-bottom:12px!important;
}
#mempelai .photo-collage{
  top:5.5%!important;
  height:70%!important;
}
@media(max-width:380px){
  #mempelai.invitation-section{height:620px!important;min-height:620px!important}
  #mempelai .mempelai-content{
    top:5%!important;height:70%!important;padding:10px 8px!important;
  }
  #mempelai .photo-collage{top:5%!important;height:70%!important}
}


/* V214 FIX: visibly shorten the Mempelai card and photo gallery.
   Strong final overrides are intentional so older rules cannot restore the tall layout. */
#mempelai.invitation-section {
  height: 620px !important;
  min-height: 620px !important;
}
#mempelai .mempelai-content {
  top: 9% !important;
  height: 58% !important;
  min-height: 0 !important;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  box-sizing: border-box !important;
}
#mempelai .photo-collage {
  top: 9% !important;
  height: 58% !important;
  min-height: 0 !important;
  box-sizing: border-box !important;
}
@media (max-width: 380px) {
  #mempelai.invitation-section {
    height: 590px !important;
    min-height: 590px !important;
  }
  #mempelai .mempelai-content {
    top: 8% !important;
    height: 58% !important;
    padding: 9px 8px !important;
  }
  #mempelai .photo-collage {
    top: 8% !important;
    height: 58% !important;
  }
}


/* V215 — Opening ayat layout: balance top/bottom whitespace inside mihrab.
   Keep the combined artwork, tasbih, flowers, and verse wording unchanged. */
.opening-page .opening-verse-overlay {
  top: 61px !important;
  height: 275px !important;
  justify-content: flex-start !important;
}
.opening-page .opening-verse-overlay .verse-bismillah {
  margin-bottom: 5px !important;
}
.opening-page .opening-verse-overlay .verse-arabic {
  margin-bottom: 6px !important;
  line-height: 1.62 !important;
}
.opening-page .opening-verse-overlay .verse-reference {
  margin-top: 5px !important;
}
@media (max-width: 380px) {
  .opening-page .opening-verse-overlay {
    top: 58px !important;
    height: 260px !important;
  }
}


/* V217 — FIX LOCKED COVER FIT ON MOBILE VIEWPORT.
   The locked cover uses a 390x844 coordinate canvas. Previous narrow-screen
   overrides disabled scaling, so short phone viewports clipped the top/bottom.
   Scale the entire cover uniformly to fit both viewport width and dynamic height.
   This is scoped ONLY to the locked cover; pages after opening remain unchanged. */
body.invitation-flow.cover-locked {
  --cover-scale: min(1, calc(100vw / 390px), calc(100dvh / 844px));
  height: 100dvh !important;
  min-height: 100dvh !important;
  overflow: hidden !important;
}
body.invitation-flow.cover-locked #cover {
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  top: 50% !important;
  width: 390px !important;
  min-width: 390px !important;
  max-width: 390px !important;
  height: 844px !important;
  min-height: 844px !important;
  max-height: 844px !important;
  transform: translate(-50%, -50%) scale(var(--cover-scale, 1)) !important;
  transform-origin: center center !important;
}
@supports not (height: 100dvh) {
  body.invitation-flow.cover-locked {
    --cover-scale: min(1, calc(100vw / 390px), calc(100vh / 844px));
    height: 100vh !important;
    min-height: 100vh !important;
  }
}


/* V220 — align closing-page floral accents precisely to the card corners.
   Keep both accents inside the rounded border so visible artwork sits on the corners. */
#penutup .closing-paper-wrap {
  position: relative !important;
  overflow: hidden !important;
}
#penutup .closing-paper-wrap::before,
#penutup .closing-paper-wrap::after {
  position: absolute !important;
  width: 48px !important;
  height: 48px !important;
  background-image: url('assets/floral-corner-bottom-right.png') !important;
  background-size: contain !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  opacity: .82 !important;
  pointer-events: none !important;
  z-index: 2 !important;
}
#penutup .closing-paper-wrap::before {
  left: 0 !important;
  top: 0 !important;
  right: auto !important;
  bottom: auto !important;
  transform: rotate(180deg) !important;
}
#penutup .closing-paper-wrap::after {
  right: 0 !important;
  bottom: 0 !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
}
@media (max-width: 380px) {
  #penutup .closing-paper-wrap::before,
  #penutup .closing-paper-wrap::after {
    width: 44px !important;
    height: 44px !important;
  }
}


/* V224 — portrait prewedding video, placed after Mempelai and before Acara */
.love-video-page {
  position: relative;
  min-height: 100svh;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 34px 18px;
  overflow: hidden;
  background: linear-gradient(155deg, #e7f1f8 0%, #f8edf0 58%, #f7f0e4 100%);
}
.love-video-inner {
  width: min(100%, 420px);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  text-align: center;
}
.love-video-kicker {
  margin: 0;
  color: #a88a57;
  font-size: 10px;
  letter-spacing: .24em;
  font-weight: 600;
}
.love-video-title {
  margin: 0 0 4px;
  color: #5c7f9c;
  font-family: inherit;
  font-size: clamp(22px, 6vw, 28px);
  font-weight: 500;
  line-height: 1.2;
}
.love-video-frame {
  width: 86%;
  max-width: 340px;
  max-height: 75svh;
  overflow: hidden;
  border: 1px solid #c9ab72;
  border-radius: 18px;
  padding: 5px;
  box-sizing: border-box;
  background: rgba(255,255,255,.72);
  box-shadow: 0 12px 30px rgba(75, 99, 120, .16);
}
.love-video-frame video {
  display: block;
  width: 100%;
  max-height: calc(75svh - 10px);
  aspect-ratio: 9 / 16;
  object-fit: contain;
  border-radius: 12px;
  background: #1c2630;
}
.love-video-page[data-video-size="half"] .love-video-frame { width: 58%; max-width: 230px; }
.love-video-page[data-video-size="three-quarter"] .love-video-frame { width: 86%; max-width: 340px; }
.love-video-page[data-video-size="full"] .love-video-frame { width: min(100%, 420px); max-width: 420px; }
.love-video-page[data-video-enabled="false"] { display: none !important; }
@media (max-height: 720px) {
  .love-video-page { padding-top: 18px; padding-bottom: 18px; }
  .love-video-inner { gap: 8px; }
  .love-video-frame, .love-video-page[data-video-size="full"] .love-video-frame { max-height: 68svh; }
  .love-video-frame video { max-height: calc(68svh - 10px); }
}

/* V225 — rapatkan transisi dari Mempelai, hilangkan panel krem */
#video-cinta.love-video-page {
  margin-top: -22px !important;
  min-height: 100svh;
  align-items: flex-start !important;
  justify-content: center !important;
  padding: 26px 18px 30px !important;
  background: #A9CBE7 !important;
  background-image: none !important;
}
#video-cinta .love-video-inner {
  margin: 0 auto;
  gap: 9px !important;
}
#video-cinta .love-video-title { margin-bottom: 1px !important; }
#video-cinta .love-video-frame {
  background: transparent !important;
  box-shadow: 0 7px 18px rgba(75, 99, 120, .14) !important;
  padding: 4px !important;
}
#video-cinta .love-video-frame video { border-radius: 12px; }
@media (max-height: 720px) {
  #video-cinta.love-video-page { padding-top: 18px !important; padding-bottom: 22px !important; }
}


/* V227 — balanced spacing, true responsive sizing, and full-frame video poster */
#video-cinta.love-video-page {
  margin-top: -34px !important;
  padding-top: 12px !important;
  padding-bottom: 20px !important;
}
#video-cinta .love-video-inner { transform: translateY(-10px); }
#video-cinta .love-video-frame { width: 86%; max-width: 340px; transition: width .2s ease, max-width .2s ease; }
#video-cinta[data-video-size="half"] .love-video-frame { width: 50% !important; max-width: 200px !important; }
#video-cinta[data-video-size="three-quarter"] .love-video-frame { width: 75% !important; max-width: 300px !important; }
#video-cinta[data-video-size="full"] .love-video-frame { width: 100% !important; max-width: 420px !important; }
#video-cinta .love-video-frame video { width: 100%; object-fit: cover; object-position: center; }
@media (max-height: 720px) {
  #video-cinta.love-video-page { padding-top: 8px !important; padding-bottom: 14px !important; }
  #video-cinta .love-video-inner { transform: translateY(-12px); }
}


/* V229 — tighter transition, restore kicker, and use requested video frame as poster */
#video-cinta.love-video-page {
  margin-top: -88px !important;
  padding-top: 0 !important;
  padding-bottom: 24px !important;
}
#video-cinta .love-video-inner {
  transform: translateY(-30px) !important;
  gap: 8px !important;
}
#video-cinta .love-video-kicker {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  color: #765b32 !important;
  font-weight: 700 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.55);
  letter-spacing: .22em !important;
}
#video-cinta .love-video-title {
  color: #3f6685 !important;
  font-weight: 600 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.58), 0 1px 2px rgba(39,73,101,.12);
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}
@media (max-height: 720px) {
  #video-cinta.love-video-page { margin-top: -88px !important; padding-top: 0 !important; padding-bottom: 16px !important; }
  #video-cinta .love-video-inner { transform: translateY(-34px) !important; }
}


/* V230 — keep video heading above the shared background layer without clipping; preserve decorative texture. */
body.invitation-flow {
  background-color: #A9CBE7 !important;
  background-image: linear-gradient(180deg, rgba(255,255,255,.035), rgba(169,203,231,.035)), url('assets/opening-background.png') !important;
  background-position: center top !important;
  background-size: min(100vw,390px) 100vh !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
}
/* The invitation pages share one base background; the soft texture layer above remains intact. */
#video-cinta.love-video-page {
  background: transparent !important;
  background-image: none !important;
  position: relative !important;
  z-index: 12 !important;
  margin-top: -118px !important;
  padding-top: 0 !important;
  padding-bottom: 24px !important;
  overflow: visible !important;
}
#mempelai.mempelai-page.invitation-section {
  overflow: visible !important;
  z-index: 2 !important;
}
#video-cinta .love-video-inner {
  position: relative !important;
  z-index: 13 !important;
  transform: translateY(-24px) !important;
  gap: 8px !important;
}
#video-cinta .love-video-kicker {
  display: block !important; visibility: visible !important; opacity: 1 !important;
  color: #765b32 !important; font-weight: 700 !important;
  letter-spacing: .22em !important;
}
#video-cinta .love-video-title {
  display: block !important; visibility: visible !important; opacity: 1 !important;
  color: #3f6685 !important; font-weight: 600 !important;
  line-height: 1.25 !important; overflow: visible !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.65), 0 1px 2px rgba(39,73,101,.12) !important;
}
@media (max-height: 720px) {
  #video-cinta.love-video-page { margin-top: -108px !important; padding-bottom: 16px !important; }
  #video-cinta .love-video-inner { transform: translateY(-22px) !important; }
}


/* V231 — visually balance the vertical gaps between Mempelai, Our Love Story, and Acara.
   Keep the continuous blue background, subtle texture, poster, and editor controls unchanged. */
#video-cinta.love-video-page {
  margin-top: -138px !important;
  min-height: 100svh !important;
  padding-top: 0 !important;
  padding-bottom: 24px !important;
  overflow: visible !important;
}
#video-cinta .love-video-inner {
  transform: translateY(-20px) !important;
  gap: 8px !important;
}
/* Acara starts closer to the end of the video content so its visual gap is comparable. */
.event-page.invitation-section {
  margin-top: -205px !important;
}
@media (max-height: 720px) {
  #video-cinta.love-video-page {
    margin-top: -128px !important;
    padding-bottom: 18px !important;
  }
  #video-cinta .love-video-inner { transform: translateY(-18px) !important; }
  .event-page.invitation-section { margin-top: -190px !important; }
}
@media (max-width: 380px) {
  #video-cinta.love-video-page { margin-top: -138px !important; }
  .event-page.invitation-section { margin-top: -205px !important; }
}