/* Proclick Invitation — design pack styles (original work, © Proclick) */
/* --- gatefold.css --- */
/* ---------- THE GATE-FOLD LETTER — emerald silk, ivory linen, gold-foil botanicals ---------- */
.pi.zc-gatefold { --ink: #183f32; --muted: #5f7468; --acc: #a8812f; --line: rgba(168,129,47,.42); --paper: #efe7d6; --foot: #3b4f44;
  --em: #0f4634; --em2: #0a3125;
  --g1: #fff2c4; --g2: #d2a64e; --g3: #8a6020; --g4: #f1d48a; --btn-bg: linear-gradient(135deg, #0d3f2f, #17614a 55%, #0b3528); --btn-ink: #f6eedb; --btn-r: 40px;
  --illu-bg: radial-gradient(70% 60% at 50% 40%, #fbf6ea, #eadfc6); --illu-ln: rgba(15,70,52,.3); --map-r: 14px;
  --gold-grad: linear-gradient(100deg, #8a6020 0%, #c99a42 18%, #fbecb8 32%, #d6ab55 46%, #95691f 62%, #e6c57a 80%, #fff1c2 90%, #a97e31 100%);
  color: var(--ink); font-family: 'Cormorant Garamond', 'El Messiri', serif; font-size: 19px; }
.pi-l-ar.zc-gatefold { font-family: 'El Messiri', 'Cormorant Garamond', serif; font-size: 17px; }
.zc-gatefold .gf-names .zc-amp em, .zc-gatefold .gf-dn, .zc-gatefold .gf-h .zc-ht, .zc-gatefold .zc-bism, .zc-gatefold .gf-rs, .zc-gatefold .gf-em .zc-cell b, .zc-gatefold .gf-wax b, .zc-gatefold .gf-sign i { background-image: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
.zc-gatefold .pi-sec { position: relative; }
.zc-gatefold svg { overflow: visible; }
/* linen paper used by every ivory piece of the suite */
.gf-main, .gf-card, .gf-ec { background: #f5efe1 url(lux/gf-linen.webp) center / cover; }
/* ---- cover: the opened gate-fold ---- */
.gf-cover { min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; justify-content: center; box-sizing: border-box; padding: 30px 10px 80px !important; }
.gf-fold { position: relative; width: 100%; max-width: 470px; margin: 0 auto; padding: 0 30px; box-sizing: border-box; }
.zc-gatefold .gf-flap { position: absolute; top: 18px; bottom: 18px; width: 44px; display: block; overflow: hidden; background: #0d3d2e url(lux/gf-silk.webp) center / cover;
  box-shadow: 0 8px 18px -10px rgba(0,0,0,.45); border: 1px solid rgba(210,166,78,.7); }
.zc-gatefold .gf-fl { left: 0; border-right: 0; border-radius: 3px 0 0 3px; }
.zc-gatefold .gf-fr { right: 0; border-left: 0; border-radius: 0 3px 3px 0; }
.gf-flap::after { content: ""; position: absolute; inset: 5px; border: 1px solid rgba(210,166,78,.45); }
.gf-fl::after { border-right: 0; } .gf-fr::after { border-left: 0; }
.gf-vine { position: absolute; left: 4px; right: 4px; top: 12px; bottom: 12px; width: calc(100% - 8px); height: calc(100% - 24px); opacity: .95; }
.gf-main { position: relative; z-index: 1; padding: 44px 22px 34px; text-align: center; box-shadow: 0 1px 0 rgba(255,255,255,.6) inset, 0 16px 30px -18px rgba(30,40,20,.55), 0 2px 6px rgba(30,40,20,.12);
  clip-path: polygon(0 1.2%, 4% .3%, 9% 1%, 15% .2%, 22% .9%, 30% .1%, 37% .8%, 45% .2%, 52% .9%, 60% .1%, 67% .7%, 74% .2%, 81% .9%, 88% .1%, 94% .8%, 100% .2%, 100% 98.9%, 95% 99.7%, 89% 99%, 82% 99.8%, 75% 99.1%, 68% 99.9%, 61% 99.2%, 54% 99.8%, 47% 99.1%, 40% 99.9%, 33% 99.2%, 26% 99.8%, 19% 99%, 12% 99.8%, 6% 99.1%, 0 99.8%); }
.gf-main::before { content: ""; position: absolute; inset: 10px; border: 1px solid rgba(168,129,47,.55); pointer-events: none; }
.gf-main::after { content: ""; position: absolute; inset: 14px; border: 1px solid rgba(168,129,47,.28); pointer-events: none; }
.gf-arch { position: absolute; left: 20px; right: 20px; top: 20px; width: calc(100% - 40px); height: 120px; pointer-events: none; }
.gf-mi { position: relative; z-index: 1; padding-top: 18px; }
.gf-crestw { width: 92px; height: 92px; margin: 0 auto 8px; }
.gf-crest { display: block; width: 100%; height: 100%; }
.zc-gatefold .zc-bism { font-family: 'Mirza', 'Amiri', serif; font-weight: 600; font-size: 25px; line-height: 1.6; margin: 0 0 6px; direction: rtl; }
.zc-gatefold .zc-guest { font-size: 17px; color: var(--muted); margin-bottom: 8px; font-style: italic; }
.zc-gatefold .zc-guest b { color: var(--em); font-style: normal; font-weight: 600; }
.zc-gatefold .zc-pre, .zc-gatefold .zc-inv { font-family: 'Marcellus', serif; font-size: 11.5px; letter-spacing: .28em; text-transform: uppercase; color: var(--muted); line-height: 1.85; }
.pi-l-ar.zc-gatefold .zc-pre, .pi-l-ar.zc-gatefold .zc-inv { font-family: 'El Messiri', serif; font-size: 17px; letter-spacing: 0; text-transform: none; }
.zc-gatefold .zc-pre > .pi-l2, .zc-gatefold .zc-inv > .pi-l2 { font-family: 'Marcellus', serif; font-size: 10.5px; letter-spacing: .22em; text-transform: uppercase; font-style: normal; }
.gf-names { margin: 14px 0 2px; line-height: 1; color: var(--em); }
.gf-names .zc-n { display: block; font-family: 'Parisienne', 'Great Vibes', cursive; font-weight: 400; font-size: clamp(48px, 14.5vw, 64px); line-height: 1.12; color: var(--em); }
.gf-names .zc-n.is-ar { font-family: 'Mirza', 'Amiri', serif; font-weight: 600; font-size: clamp(42px, 12.5vw, 56px); line-height: 1.4; }
.gf-names .zc-amp { display: block; margin: -2px 0; }
.gf-names .zc-amp em { font-family: 'Italiana', serif; font-style: normal; font-size: 30px; line-height: 1; }
.zc-gatefold .zc-names2 { font-family: 'Marcellus', serif; font-size: 14px; letter-spacing: .2em; color: var(--acc); margin: 6px 0 8px; text-transform: uppercase; }
.zc-gatefold .zc-names2.is-ar { font-family: 'Mirza', serif; letter-spacing: 0; font-size: 22px; text-transform: none; }
.zc-gatefold .zc-names2 i { font-style: normal; }
.zc-gatefold .zc-parents { font-size: 16px; color: var(--muted); margin: 6px 0 8px; font-style: italic; }
.gf-dw { margin: 12px auto 8px; max-width: 260px; }
.gf-div { display: block; width: 100%; height: auto; }
/* date: weekday | big Italiana numeral | month — separated by gold hairlines */
.gf-date { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 0; margin: 18px auto 4px; max-width: 300px; }
.gf-dl { font-family: 'Marcellus', serif; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--ink); padding: 6px 4px; }
.gf-dl em { display: block; font-style: normal; color: var(--muted); font-size: 11px; letter-spacing: .3em; margin-top: 2px; }
.pi-l-ar.zc-gatefold .gf-dl { font-family: 'El Messiri', serif; font-size: 16px; letter-spacing: 0; text-transform: none; }
.gf-dn { font-family: 'Italiana', serif; font-size: 64px; line-height: 1; padding: 0 18px; border-left: 1px solid var(--line); border-right: 1px solid var(--line); }
.gf-time { font-family: 'Marcellus', serif; font-size: 12px; letter-spacing: .26em; text-transform: uppercase; color: var(--acc); margin-top: 10px; }
.pi-l-ar.zc-gatefold .gf-time { font-family: 'El Messiri', serif; font-size: 16px; letter-spacing: 0; }
/* ---- sections ---- */
.gf-sec { padding: 20px 16px !important; }
.gf-card { position: relative; max-width: 440px; margin: 0 auto; box-sizing: border-box; padding: 40px 26px 34px; text-align: center; border-radius: 2px;
  box-shadow: 0 14px 26px -18px rgba(30,40,20,.5), 0 1px 3px rgba(30,40,20,.12); }
.gf-card > *:not(.gf-cn) { position: relative; z-index: 1; }
.zc-gatefold .gf-cn { position: absolute !important; display: block; width: 40px; height: 40px; pointer-events: none; z-index: 0; }
.gf-cn svg { display: block; width: 100%; height: 100%; }
.zc-gatefold .gf-tl { left: 10px; right: auto; top: 10px; bottom: auto; } .zc-gatefold .gf-tr { right: 10px; left: auto; top: 10px; bottom: auto; transform: scaleX(-1); }
.zc-gatefold .gf-bl { left: 10px; right: auto; bottom: 10px; top: auto; transform: scaleY(-1); } .zc-gatefold .gf-br { right: 10px; left: auto; bottom: 10px; top: auto; transform: scale(-1,-1); }
.gf-h { margin: 0 0 18px; }
.gf-h .zc-ht { font-family: 'Italiana', serif; font-weight: 400; font-size: 30px; letter-spacing: .06em; line-height: 1.2; }
.pi-l-ar.zc-gatefold .gf-h .zc-ht { font-family: 'Mirza', 'Amiri', serif; font-weight: 600; font-size: 28px; letter-spacing: 0; }
.zc-gatefold .gf-h .zc-ht > .pi-l2 { display: block; font-family: 'Marcellus', serif; font-size: 11px; letter-spacing: .28em; text-transform: uppercase; color: var(--muted); -webkit-text-fill-color: var(--muted); margin-top: 4px; }
.gf-h::after { content: ""; display: block; width: 44px; height: 1px; margin: 12px auto 0; background: var(--gold-grad); }
/* message: a vellum-light linen card under a pair of sprigs */
.gf-sprig1 { display: block; width: 120px; height: 30px; margin: 0 auto 8px; }
.gf-msgt { font-size: 21px; line-height: 1.6; font-style: italic; color: var(--ink); margin: 6px 0; }
.pi-l-ar.zc-gatefold .gf-msgt { font-style: normal; font-size: 18px; line-height: 1.9; }
/* countdown: emerald silk card, arched ivory windows */
.gf-em { position: relative; max-width: 440px; margin: 0 auto; padding: 34px 16px 30px; text-align: center; box-sizing: border-box; color: #efe5cc;
  background: #0d3d2e url(lux/gf-silk.webp) center / cover; border-radius: 2px; box-shadow: inset 0 0 0 6px rgba(9,40,30,.65), inset 0 0 0 7px rgba(210,166,78,.6), 0 14px 26px -16px rgba(0,0,0,.5); }
.gf-h-em .zc-ht > .pi-l2 { color: #cdbf9c !important; -webkit-text-fill-color: #cdbf9c !important; }
.zc-gatefold .gf-em .pi-cd { gap: 9px; }
.zc-gatefold .gf-em .zc-cell { position: relative; width: 68px; height: 94px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding-top: 14px; box-sizing: border-box; background: none; border: 0; }
.zc-gatefold .zc-cell .gf-cw { position: absolute; inset: 0; width: 100%; height: 100%; }
.zc-gatefold .gf-em .zc-cell b { position: relative; font-family: 'Italiana', serif; font-weight: 400; font-size: 32px; line-height: 1; font-variant-numeric: lining-nums tabular-nums;
  background-image: linear-gradient(180deg, #17614a, #0b3326); }
.zc-gatefold .gf-em .zc-cell span { position: relative; font-family: 'Marcellus', serif; font-size: 9px; letter-spacing: .18em; text-transform: uppercase; color: #6b5a2c; margin-top: 4px; }
.pi-l-ar.zc-gatefold .gf-em .zc-cell span { font-family: 'El Messiri', serif; font-size: 12px; letter-spacing: 0; }
.zc-gatefold .gf-em .pi-past { margin-top: 12px; font-style: italic; color: #efe5cc; }
/* details: enclosure cards */
.gf-encl { display: grid; gap: 14px; max-width: 440px; margin: 0 auto; }
.gf-ec { position: relative; padding: 26px 22px 22px; text-align: center; border-radius: 2px; border-top: 3px solid var(--em); box-shadow: 0 12px 22px -16px rgba(30,40,20,.5), 0 1px 3px rgba(30,40,20,.1); }
.gf-ec::before { content: ""; position: absolute; inset: 7px; top: 4px; border: 1px solid rgba(168,129,47,.35); pointer-events: none; }
.gf-ico { display: block; width: 40px; height: 40px; margin: 0 auto 8px; }
.gf-ico svg { display: block; width: 100%; height: 100%; }
.gf-ec h3 { font-family: 'Marcellus', serif; font-size: 12px; letter-spacing: .3em; text-transform: uppercase; color: var(--acc); font-weight: 400; margin-bottom: 8px; }
.pi-l-ar.zc-gatefold .gf-ec h3 { font-family: 'El Messiri', serif; font-size: 17px; font-weight: 600; letter-spacing: 0; text-transform: none; }
.gf-ec p { line-height: 1.5; position: relative; }
.gf-strong { font-family: 'Italiana', serif; font-size: 23px; color: var(--em); margin-top: 2px; }
.pi-l-ar.zc-gatefold .gf-strong { font-family: 'Mirza', serif; font-weight: 600; font-size: 21px; }
.zc-gatefold .zc-btn { position: relative; margin-top: 14px; color: var(--em); border: 1px solid rgba(15,70,52,.55); border-radius: 40px; font-family: 'Marcellus', serif; letter-spacing: .18em; }
.zc-gatefold .zc-btn-g { color: var(--em); }
.pi-l-ar.zc-gatefold .zc-btn { font-family: 'El Messiri', serif; letter-spacing: 0; }
.zc-gatefold .zc-btn-solid { color: var(--btn-ink); border: 1px solid rgba(210,166,78,.8); letter-spacing: .24em; }
.gf-map { max-width: 440px; margin: 16px auto 0; }
.pi.zc-gatefold .zc-map { background: #f5efe1; border: 1px solid rgba(168,129,47,.55); color: var(--em); }
/* programme: menu card with a gold vine stem; entries alternate sides */
.gf-menu { padding-left: 18px; padding-right: 18px; }
.gf-stem { position: relative; max-width: 340px; margin: 0 auto; }
.gf-stem::before { content: ""; position: absolute; left: 50%; top: 4px; bottom: 4px; width: 1.4px; margin-left: -.7px; background: linear-gradient(180deg, rgba(168,129,47,0), #b88d38 8%, #e9cb83 50%, #b88d38 92%, rgba(168,129,47,0)); }
.zc-gatefold .gf-tl { position: relative; margin: 0; padding: 0; list-style: none; }
.zc-gatefold .gf-tl li { position: relative; display: grid; grid-template-columns: 1fr 30px 1fr; align-items: center; padding: 11px 0; }
.zc-gatefold .gf-tl time { grid-column: 1; text-align: end; font-family: 'Marcellus', serif; font-size: 19px; letter-spacing: .04em; color: var(--em); padding-inline-end: 8px; }
.zc-gatefold .gf-tl .gf-sl { grid-column: 2; grid-row: 1; display: block; width: 30px; height: 20px; }
.gf-sl svg { display: block; width: 100%; height: 100%; }
.zc-gatefold .gf-tl li > span { grid-column: 3; text-align: start; padding-inline-start: 8px; font-size: 18px; line-height: 1.3; }
.zc-gatefold .gf-tl li:nth-child(even) time { grid-column: 3; grid-row: 1; text-align: start; padding: 0; padding-inline-start: 8px; }
.zc-gatefold .gf-tl li:nth-child(even) > span { grid-column: 1; grid-row: 1; text-align: end; padding: 0; padding-inline-end: 8px; }
/* gifts */
.gf-small { max-width: 380px; }
.gf-small .gf-ico { margin-bottom: 4px; }
/* photo (optional) and gallery: pointed-arch frames */
.gf-parch { width: 210px; max-width: 70%; margin: 0 auto; padding: 6px; border: 1px solid rgba(168,129,47,.8); border-radius: 105px 105px 3px 3px / 70px 70px 3px 3px; }
.gf-parch .zc-portrait { margin: 0; }
.gf-parch .zc-pic { aspect-ratio: 3 / 4; border-radius: 100px 100px 2px 2px / 66px 66px 2px 2px; overflow: hidden; }
.gf-cap { margin-top: 14px; font-style: italic; color: var(--muted); }
.gf-gal { max-width: 440px; margin: 0 auto; }
.gf-gal figure { padding: 4px; background: #f5efe1; border: 1px solid rgba(168,129,47,.5); box-sizing: border-box; border-radius: 60px 60px 2px 2px / 40px 40px 2px 2px; overflow: hidden; }
.gf-gal figure img { border-radius: 56px 56px 1px 1px / 37px 37px 1px 1px; }
/* RSVP: the reply card */
.gf-reply { max-width: 420px; padding-top: 30px; }
.gf-rs { font-family: 'Parisienne', cursive; font-size: 40px; line-height: 1.1; margin-bottom: 2px; }
.gf-h-rs .zc-ht { font-family: 'Parisienne', 'Great Vibes', cursive !important; font-size: 44px !important; letter-spacing: 0 !important; line-height: 1.25 !important; }
.pi-l-ar.zc-gatefold .gf-h-rs .zc-ht { font-family: 'Mirza', 'Amiri', serif !important; font-size: 30px !important; }
.zc-gatefold .gf-h-rs .zc-ht > .pi-l2 { font-family: 'Parisienne', cursive; font-size: 26px; letter-spacing: 0; text-transform: none; color: var(--acc); -webkit-text-fill-color: var(--acc); }
.zc-gatefold .pi-form label > span, .zc-gatefold .pi-form legend { font-family: 'Marcellus', serif; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); }
.pi-l-ar.zc-gatefold .pi-form label > span, .pi-l-ar.zc-gatefold .pi-form legend { font-family: 'El Messiri', serif; font-size: 15px; letter-spacing: 0; text-transform: none; }
.zc-gatefold .pi-form input, .zc-gatefold .pi-form select, .zc-gatefold .pi-form textarea { color: var(--ink); background: transparent; border: 0; border-bottom: 1px solid rgba(15,70,52,.4); border-radius: 0; }
.zc-gatefold .pi-form textarea { border: 1px solid rgba(15,70,52,.3); }
.zc-gatefold .pi-seg span { border-radius: 40px; border-color: rgba(15,70,52,.45); color: var(--ink); }
.zc-gatefold .pi-seg input:checked + span { background: var(--em); color: #f6eedb; border-color: var(--em); }
.zc-gatefold .zc-sub { color: var(--muted); font-style: italic; }
/* closing: an emerald wax seal with gold initials */
.gf-close { padding: 26px 14px 18px !important; }
.gf-closein { max-width: 380px; margin: 0 auto; text-align: center; }
.gf-wax { position: relative; width: 116px; height: 116px; margin: 0 auto 16px; display: flex; align-items: center; justify-content: center; border-radius: 50%;
  background: radial-gradient(circle at 38% 32%, #2e8a69, #136049 38%, #0a3a2b 72%, #062419); box-shadow: inset 0 -4px 8px rgba(0,0,0,.35), inset 0 3px 6px rgba(255,255,255,.18), 0 8px 16px -8px rgba(0,0,0,.55); }
.gf-wax svg { position: absolute; inset: 8px; width: calc(100% - 16px); height: calc(100% - 16px); opacity: .9; }
.gf-wax b { position: relative; font-family: 'Italiana', serif; font-weight: 400; font-size: 30px; letter-spacing: .02em; }
.gf-wax b i { font-style: normal; font-size: .6em; padding: 0 2px; }
.gf-closing { font-style: italic; font-size: 20px; color: var(--ink); }
.gf-sign { font-family: 'Parisienne', cursive; font-size: 42px; color: var(--em); margin-top: 6px; line-height: 1.3; }
.gf-sign i { font-style: normal; font-family: 'Italiana', serif; font-size: .6em; }
.pi-l-ar.zc-gatefold .gf-sign { font-family: 'Mirza', 'Amiri', serif; font-weight: 600; font-size: 32px; }
.zc-gatefold .pi-cue { border-color: var(--em); }
.zc-gatefold .pi-foot a { color: var(--foot); }
/* entrance: the suite unfolds — side flaps slide out from behind the card, cards open from the fold (scaleX), all 2D transform/opacity */
.zc-gatefold .pi-rv { transform: translate3d(0, 18px, 0); }
.zc-gatefold .pi-rv.in { transform: none; }
.zc-gatefold .gf-flap.pi-rv { transition: opacity .9s ease .25s, transform 1.2s cubic-bezier(.2,.8,.2,1) .25s; }
.zc-gatefold .gf-fl.pi-rv { transform: translate3d(34px, 0, 0); } .zc-gatefold .gf-fr.pi-rv { transform: translate3d(-34px, 0, 0); }
.zc-gatefold .gf-flap.pi-rv.in { transform: none; }
.zc-gatefold .gf-card.pi-rv, .zc-gatefold .gf-em.pi-rv { transform: scale(.94, .985); transition: opacity .9s ease, transform 1.1s cubic-bezier(.2,.75,.2,1); }
.zc-gatefold .gf-card.pi-rv.in, .zc-gatefold .gf-em.pi-rv.in { transform: none; }
.zc-gatefold .gf-ec.pi-rv:nth-child(2) { transition-delay: .12s; } .zc-gatefold .gf-ec.pi-rv:nth-child(3) { transition-delay: .24s; }
@media (prefers-reduced-motion: reduce) { .zc-gatefold .pi-rv, .zc-gatefold .gf-card.pi-rv, .zc-gatefold .gf-em.pi-rv, .zc-gatefold .gf-flap.pi-rv { transform: none; } }
.zc-gatefold .gf-tl li > span > *, .zc-gatefold .gf-tl li > span .pi-l2 { text-align: match-parent; }
.zc-gatefold .gf-h-em { padding: 0 16px; }
.zc-gatefold .gf-h-em .zc-ht { font-size: 21px; letter-spacing: .05em; }
.pi-l-ar.zc-gatefold .gf-h-em { padding: 0 16px; }
.zc-gatefold .gf-h-em .zc-ht { font-size: 21px; letter-spacing: .05em; }
.zc-gatefold .gf-details > .gf-h .zc-ht, .zc-gatefold .gf-galsec > .gf-h .zc-ht { background: none; color: var(--em); -webkit-text-fill-color: var(--em); text-shadow: 0 1px 12px rgba(255,250,235,.9); }
.zc-gatefold .gf-details > .gf-h .zc-ht > .pi-l2, .zc-gatefold .gf-galsec > .gf-h .zc-ht > .pi-l2 { color: #4c5f53; -webkit-text-fill-color: #4c5f53; }

/* --- henna.css --- */
/* HENNA NIGHT — opening is a pre-rendered film (lux/henna-open.mp4); live layers: the warm-gold initials on the bowl of henna, the wax seal, the hint.
   On the tap the initials rise a little and fade, the seal lifts and melts into a soft glow (transform/opacity only) — no crack, no crumbs. */
.pi.zc-henna .lxv-box, .zc-henna .lxv-box { background: #1b1311; }
.zc-henna .lxm { transition: opacity 1.1s cubic-bezier(.4, 0, .2, 1) .25s, transform 1.1s cubic-bezier(.4, 0, .2, 1) .25s; }
.zc-henna .is-open .lxm, .zc-henna.is-open .lxm, .zc-henna .is-play .lxm { opacity: 0; transform: translate(-50%, -58%) scale(1.12); }
.zc-henna .lxm span { font-family: 'Pinyon Script', 'Great Vibes', cursive; letter-spacing: 0; word-spacing: -.1em; background: none; -webkit-background-clip: border-box; background-clip: border-box; color: #fff0c8; -webkit-text-fill-color: #fff0c8; padding: .12em .25em; display: inline-block;
  text-shadow: 0 0 1px #4a2608, 0 1px 2px rgba(40, 15, 3, .95), 0 0 6px rgba(60, 25, 5, .6), 0 0 16px rgba(255, 205, 130, .6), 0 0 34px rgba(255, 190, 110, .4); }
.zc-henna .lxm.is-ar span { font-family: 'Aref Ruqaa', Amiri, serif; font-weight: 700; }
.zc-henna .lxs { transition: opacity 1.1s cubic-bezier(.4, 0, .2, 1) .05s, transform 1.6s cubic-bezier(.4, 0, .2, 1); }
.zc-henna .is-open .lxs, .zc-henna.is-open .lxs, .zc-henna .is-play .lxs { opacity: 0; transform: translate(-50%, -60%) scale(1.06); }
.zc-henna .lxs.is-crack .lxs-a, .zc-henna .lxs.is-crack .lxs-b { transform: none; opacity: 1; }
.zc-henna .lxs-cr { display: none; }
.zc-henna .lxs-halo { background: radial-gradient(circle, rgba(255, 220, 160, .5), rgba(255, 220, 160, 0) 62%); }
.zc-henna .is-open .lxs-halo, .zc-henna .is-play .lxs-halo { opacity: 0; transition: opacity 1s ease; }
@media (prefers-reduced-motion: reduce) { .zc-henna .lxs, .zc-henna .lxm { transition: opacity .6s ease; } }
/* the "tap" hint: a small black embroidered pill with a gold hairline and a red cross-stitch hem */
.pi-in-henna .pi-hint { bottom: 7%; text-shadow: none; }
.pi-in-henna .pi-hint-t { display: inline-block; padding: 9px 20px 10px; border-radius: 999px; background: rgba(26, 16, 14, .86); border: 1px solid rgba(201, 150, 58, .8); color: #f3e2bd;
  box-shadow: 0 8px 20px -10px rgba(0, 0, 0, .6), inset 0 0 0 3px rgba(26, 16, 14, .9), inset 0 0 0 4px rgba(179, 38, 42, .55); font-family: Cinzel, 'Cormorant Garamond', serif; font-weight: 400; font-size: 12.5px; letter-spacing: .2em; text-transform: uppercase; }
.pi-l-ar .pi-in-henna .pi-hint-t, .pi-in-henna .pi-hint-t .pi-l2 { letter-spacing: 0; text-transform: none; }
.pi-l-ar .pi-in-henna .pi-hint-t { font-family: 'Amiri', serif; font-size: 17px; }
.pi-in-henna .pi-hint-t > .pi-l2 { display: block; font-family: 'Amiri', serif; font-size: 14px; letter-spacing: 0; margin-top: 1px; }

/* ---- the inner card: cream panes with a red cross-stitch hem on embroidered linen, black embroidered panes, crimson, olive and gold ---- */
.pi.zc-henna { --hn-crim: #8e1418; --hn-crim2: #b3262a; --hn-ink: #2a1714; --hn-gold: #b98a3a; --hn-gold2: #e2b764; --hn-olive: #55652a; --hn-cream: #f6eedd; --hn-henna: #7b3a17; color: var(--hn-ink); font-family: 'Cormorant Garamond', Georgia, serif; }
.zc-henna .zc-card { position: relative; z-index: 2; padding: 0 0 30px; }
.zc-henna .hn-img { display: block; width: 100%; height: auto; pointer-events: none; }
.zc-henna .hn-cover { min-height: 100vh; min-height: 100svh; display: flex; align-items: center; justify-content: center; text-align: center; padding: 56px 20px; position: relative; }
.zc-henna .hn-cv { width: 100%; max-width: 420px; position: relative; }
.zc-henna .hn-sec { padding: 12px 20px; position: relative; }
.zc-henna .hn-pane { position: relative; max-width: 440px; margin: 10px auto; padding: 32px 22px 32px; text-align: center; border-radius: 3px; background: rgba(250, 245, 234, .9);
  box-shadow: 0 10px 30px rgba(60, 20, 10, .18), 0 1px 0 rgba(255, 255, 255, .6) inset; }
.zc-henna .hn-hem { position: absolute; inset: 8px; border: 1.6px dashed rgba(142, 20, 24, .55); border-radius: 2px; pointer-events: none; }
.zc-henna .hn-pane > *:not(.hn-hem):not(.hn-pband) { position: relative; z-index: 2; }
.zc-henna .hn-pband { display: block; width: calc(100% + 44px); margin: -32px -22px 16px; border-radius: 3px 3px 0 0; overflow: hidden; box-shadow: 0 2px 6px rgba(40, 10, 5, .35); position: relative; z-index: 3; line-height: 0; }
.zc-henna .hn-dark { background: rgba(26, 16, 14, .93); color: #f3e6cf; }
.zc-henna .hn-dark .hn-hem { border-color: rgba(201, 150, 58, .6); }
.zc-henna .hn-cpane { padding-bottom: 30px; }
.zc-henna .hn-mand { width: 116px; margin: 4px auto 2px; opacity: .92; }
.zc-henna .zc-bism { font: 700 21px/1.6 Amiri, serif; color: var(--hn-crim); margin: 0 0 6px; }
.zc-henna .hn-title { font: 700 44px/1.15 'Aref Ruqaa', Amiri, serif; color: var(--hn-crim); margin: 6px 0 0; text-shadow: 0 1px 0 rgba(255, 255, 255, .5); }
.zc-henna .hn-title .pi-l2 { font: 400 13.5px/1.6 Cinzel, serif; letter-spacing: .42em; text-transform: uppercase; color: var(--hn-olive); margin-top: 4px; text-shadow: none; opacity: 1; }
.pi-l-sv.zc-henna .hn-title, .pi-l-en.zc-henna .hn-title { font: 400 50px/1.15 'Pinyon Script', 'Great Vibes', cursive; }
.zc-henna .hn-pre { font: 400 11px/1.8 Cinzel, serif; letter-spacing: .22em; text-transform: uppercase; margin: 8px auto 2px; color: var(--hn-olive); text-wrap: balance; }
.zc-henna .hn-names { font: 400 50px/1.12 'Pinyon Script', 'Great Vibes', cursive; color: var(--hn-crim); margin: 8px 0 2px; font-weight: 400; }
.zc-henna .hn-names .zc-n { display: inline-block; } .zc-henna .hn-names .zc-amp { display: inline-block; font: italic 400 28px/1.1 'Cormorant Garamond', serif; color: var(--hn-gold); margin: 0 .25em; }
.zc-henna .zc-names2 { font: italic 500 19px 'Cormorant Garamond', serif; margin: 2px 0 6px; }
.zc-henna .zc-parents p, .zc-henna .zc-guest { font: italic 17px 'Cormorant Garamond', serif; margin: 4px 0; }
.zc-henna .hn-inv { font: italic 500 17.5px/1.45 'Cormorant Garamond', serif; color: #5a3a30; margin: 6px auto 2px; max-width: 290px; text-wrap: balance; }
.zc-henna .hn-div { width: 200px; max-width: 64%; margin: 12px auto; line-height: 0; }
.zc-henna .hn-dow { font: 400 12px/1.6 Cinzel, serif; letter-spacing: .3em; text-transform: uppercase; margin: 0; color: var(--hn-ink); }
.zc-henna .hn-cdate { font: 500 34px/1.15 'Cormorant Garamond', serif; margin: 2px 0; letter-spacing: .03em; color: var(--hn-crim); }
.zc-henna .hn-ctime { font: 400 12px/1.6 Cinzel, serif; letter-spacing: .18em; text-transform: uppercase; margin: 2px 0; }
.zc-henna .hn-cvenue { font: 400 11.5px/1.8 Cinzel, serif; letter-spacing: .18em; text-transform: uppercase; color: #5a3a30; margin: 10px 0 0; }
.zc-henna .hn-kick { font: 400 10.5px/1.6 Cinzel, serif; letter-spacing: .3em; text-transform: uppercase; margin: 2px 0; color: var(--hn-crim); }
.zc-henna .hn-dark .hn-kick { color: var(--hn-gold2); }
.zc-henna .hn-h { font: 400 26px/1.25 'Aref Ruqaa', 'Cormorant Garamond', serif; color: var(--hn-ink); margin: 2px 0 12px; font-weight: 400; }
.pi-l-sv.zc-henna .hn-h, .pi-l-en.zc-henna .hn-h { font: 400 40px/1.2 'Pinyon Script', 'Great Vibes', cursive; color: var(--hn-crim); }
.zc-henna .hn-dark .hn-h { color: #f3e6cf; }
.zc-henna .hn-msgt { font: italic 500 18.5px/1.6 'Cormorant Garamond', serif; margin: 4px 0 0; }
.zc-henna .hn-cyp { width: 40px; margin: 0 auto 8px; }
.zc-henna .hn-vref { font: 400 10.5px/1.6 Cinzel, serif; letter-spacing: .24em; text-transform: uppercase; color: var(--hn-crim); margin: 2px 0 12px; }
.zc-henna .hn-verse { font: 400 22px/2 Amiri, 'Amiri Quran', serif; color: var(--hn-ink); margin: 0 0 10px; direction: rtl; }
.zc-henna .hn-vtr { font: italic 500 15.5px/1.6 'Cormorant Garamond', serif; margin: 0; opacity: .9; }
.zc-henna .hn-quote { font: italic 500 22px/1.5 'Cormorant Garamond', serif; margin: 0 0 8px; color: #4a2a22; text-wrap: balance; }
.zc-henna .hn-vby { font: 400 32px/1.2 'Pinyon Script', cursive; color: var(--hn-crim); margin: 0; }
/* countdown on black embroidered cloth: cream numbers in gold-framed cells with a red cross-stitch hem */
.zc-henna .hn-cdd { font: italic 500 17px 'Cormorant Garamond', serif; margin: 0 0 12px; color: #e9d8b8; }
.zc-henna .hn-tail { font: italic 16px 'Cormorant Garamond', serif; margin: 12px 0 0; color: #d9c39a; }
.zc-henna .zc-cd { display: flex; justify-content: center; gap: 8px; direction: ltr; }
.zc-henna .zc-cell { position: relative; width: 62px; padding: 10px 0 8px; background: rgba(246, 238, 221, .07); border: 1px solid rgba(201, 150, 58, .6); display: flex; flex-direction: column; align-items: center; }
.zc-henna .hn-cell { position: absolute; inset: 3px; border: 1px dashed rgba(179, 38, 42, .75); pointer-events: none; }
.zc-henna .zc-cell b { position: relative; display: block; font: 500 30px/1 'Cormorant Garamond', serif; color: #f6e3bd; }
.zc-henna .zc-cell span { position: relative; display: block; font: 400 8.5px/1.3 Cinzel, serif; letter-spacing: .16em; text-transform: uppercase; margin-top: 4px; color: #d9c39a; }
.zc-henna .hn-calw { margin-top: 16px; }
.zc-henna .zc-btn { display: inline-block; padding: 11px 18px; border-radius: 0; font: 400 11px/1 Cinzel, serif; letter-spacing: .18em; text-transform: uppercase; color: #f8ecd6; background: var(--hn-crim); text-decoration: none; border: 1px solid var(--hn-crim); margin: 8px 4px 0; text-align: center; box-shadow: 0 6px 14px -8px rgba(80, 10, 10, .55); }
.zc-henna .zc-btn-g { background: rgba(255, 255, 255, .35); color: var(--hn-crim); }
.zc-henna .hn-dark .zc-btn-g { background: transparent; color: var(--hn-gold2); border-color: rgba(201, 150, 58, .7); }
.zc-henna .zc-btn .pi-l2 { text-align: center; }
.zc-henna .hn-item { margin: 10px 0; } .zc-henna .hn-item h3 { font: 400 10.5px/1.6 Cinzel, serif; letter-spacing: .26em; text-transform: uppercase; margin: 0 0 3px; color: var(--hn-crim); }
.zc-henna .hn-item p { margin: 1px 0; font-size: 17px; line-height: 1.45; } .zc-henna .hn-strong { font-weight: 500; font-size: 24px !important; }
.zc-henna .zc-map { max-width: 360px; margin: 16px auto 0; overflow: hidden; height: 180px; border: 1px solid rgba(142, 20, 24, .5); box-shadow: 0 0 0 4px rgba(250, 245, 234, .9), 0 0 0 5px rgba(185, 138, 58, .55); }
.zc-henna .zc-mapph { width: 100%; height: 100%; border: 0; background: linear-gradient(160deg, #faf5ea, #efe4cf); color: var(--hn-crim); font: 400 11px Cinzel, serif; letter-spacing: .14em; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; }
.zc-henna .zc-mapph svg { width: 26px; height: 26px; }
.zc-henna .zc-map iframe { width: 100%; height: 100%; border: 0; }
/* programme: a dotted cross-stitch rule with eight-point stars */
.zc-henna .hn-tl { list-style: none; margin: 6px auto 0; padding: 0; max-width: 340px; text-align: start; }
.zc-henna .hn-tl li { display: grid; grid-template-columns: 58px 24px 1fr; align-items: center; gap: 4px; padding: 8px 0; border-bottom: 1px dotted rgba(142, 20, 24, .35); }
.zc-henna .hn-tl li:last-child { border-bottom: 0; }
.zc-henna .hn-tl time { font: 400 14px Cinzel, serif; color: var(--hn-crim); text-align: center; }
.zc-henna .hn-node { width: 18px; height: 18px; display: block; } .zc-henna .hn-node img { width: 100%; height: 100%; display: block; }
.zc-henna .hn-tl span { font-size: 17px; line-height: 1.3; }
.zc-henna .hn-tl span .pi-l2 { font-family: Amiri, serif; font-size: 15px; color: #6a4a3e; }
/* reply form on black cloth */
.zc-henna .zc-form { text-align: start; max-width: 360px; margin: 14px auto 0; }
.zc-henna .zc-form input, .zc-henna .zc-form textarea, .zc-henna .zc-form select { border: 0; border-bottom: 1px solid rgba(201, 150, 58, .6); background: transparent; border-radius: 0; font: 400 17px 'Cormorant Garamond', serif; color: #f3e6cf; }
.zc-henna .zc-form select option { color: #2a1714; }
.zc-henna .zc-form legend, .zc-henna .zc-form label > span { font: 400 10px/1.6 Cinzel, serif; letter-spacing: .2em; text-transform: uppercase; color: #d9c39a; }
.zc-henna .zc-form button, .zc-henna .zc-form [type=submit] { background: linear-gradient(#c79a46, #a8782c); color: #2a1714; border: 0; border-radius: 0; font: 400 12px Cinzel, serif; letter-spacing: .26em; text-transform: uppercase; }
.zc-henna .zc-sub { font: italic 16px 'Cormorant Garamond', serif; margin: 2px 0 0; color: #e9d8b8; }
.zc-henna .hn-thx { width: 160px; margin: 10px auto; }
.zc-henna .pi-seg span { border-radius: 0; border-color: rgba(201, 150, 58, .6); background: transparent; color: #f3e6cf; font-family: Cinzel, serif; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; }
.zc-henna .pi-seg input:checked + span { background: var(--hn-crim); color: #fff; border-color: var(--hn-crim); }
.pi-l-ar.zc-henna .pi-seg span { font-family: Amiri, serif; font-size: 15px; letter-spacing: 0; text-transform: none; }
.zc-henna .zc-gal figure { overflow: hidden; border: 1px solid rgba(142, 20, 24, .45); box-shadow: 0 0 0 3px #faf5ea, 0 0 0 4px rgba(185, 138, 58, .5), 0 8px 18px rgba(60, 20, 10, .16); }
/* couple photo (off by default) framed in cream with a cross-stitch hem */
.zc-henna .hn-pic { margin: 0; }
.zc-henna .hn-pic .zc-pic { width: 220px; max-width: 72%; aspect-ratio: 3 / 4; margin: 0 auto; overflow: hidden; border: 1px solid rgba(142, 20, 24, .5); box-shadow: 0 0 0 5px #faf5ea, 0 0 0 6px rgba(185, 138, 58, .6), 0 12px 26px rgba(60, 20, 10, .2); }
.zc-henna .hn-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.zc-henna .zc-illu { --illu-bg: radial-gradient(ellipse at 50% 35%, #fffaf0, #efe2c9); --illu-ln: rgba(255, 250, 240, .55); }
.zc-henna .zc-illu { --cp1: #8a2a30; --cp2: #5e1118; --cp3: #3a080d; --cp4: #7a1f27; }
/* scratch-to-reveal */
.zc-henna .zc-scr { padding: 16px 20px 24px; }
.zc-henna .zc-scr-in { position: relative; max-width: 440px; margin: 0 auto; padding: 36px 20px 30px; background: rgba(250, 245, 234, .92); box-shadow: 0 10px 30px rgba(60, 20, 10, .18); outline: 1.6px dashed rgba(142, 20, 24, .55); outline-offset: -8px; }
.zc-henna .zc-scr-h { font: 400 40px/1.2 'Pinyon Script', cursive; color: var(--hn-crim); margin: 0; font-weight: 400; }
.zc-henna .zc-scr-v { font-family: 'Cormorant Garamond', serif; color: var(--hn-crim); }
/* closing */
.zc-henna .hn-close { padding: 26px 20px 30px; text-align: center; }
.zc-henna .hn-closein { position: relative; max-width: 420px; margin: 0 auto; padding: 18px 10px 20px; }
.zc-henna .hn-closein::before { content: ''; position: absolute; left: -24px; right: -24px; top: -10px; bottom: -16px; z-index: -1; pointer-events: none; background: radial-gradient(closest-side, rgba(250, 245, 234, .92), rgba(250, 245, 234, .7) 55%, rgba(250, 245, 234, 0)); }
.zc-henna .hn-closein .hn-div { opacity: 1; transform: none; }
.zc-henna .hn-closing { font: 400 10.5px/1.8 Cinzel, serif; letter-spacing: .3em; text-transform: uppercase; color: #6a4a3e; margin: 4px 0 0; }
.zc-henna .hn-sign { font: 400 44px/1.3 'Pinyon Script', cursive; color: var(--hn-crim); margin: 2px 0 0; }
.zc-henna .hn-sign i { font: italic 400 .55em 'Cormorant Garamond', serif; padding: 0 .3em; color: var(--hn-gold); }
.zc-henna .zc-foot { position: relative; } .zc-henna .zc-foot a { display: inline-block; padding: 4px 12px; border-radius: 20px; background: rgba(250, 245, 234, .85); color: var(--hn-ink); opacity: .75; }
/* Arabic */
.pi-l-ar.zc-henna, .pi-l-ar.zc-henna .hn-msgt, .pi-l-ar.zc-henna .hn-item p, .pi-l-ar.zc-henna .hn-cdate, .pi-l-ar.zc-henna .hn-tl span, .pi-l-ar.zc-henna .hn-quote, .pi-l-ar.zc-henna .hn-tail, .pi-l-ar.zc-henna .hn-cdd, .pi-l-ar.zc-henna .hn-inv, .pi-l-ar.zc-henna .hn-ctime, .pi-l-ar.zc-henna .zc-sub { font-family: Amiri, serif; font-style: normal; }
.pi-l-ar.zc-henna .hn-pre, .pi-l-ar.zc-henna .hn-kick, .pi-l-ar.zc-henna .hn-item h3, .pi-l-ar.zc-henna .zc-cell span, .pi-l-ar.zc-henna .zc-btn, .pi-l-ar.zc-henna .hn-vref, .pi-l-ar.zc-henna .hn-dow, .pi-l-ar.zc-henna .hn-cvenue, .pi-l-ar.zc-henna .hn-closing, .pi-l-ar.zc-henna .zc-form legend, .pi-l-ar.zc-henna .zc-form label > span, .pi-l-ar.zc-henna .hn-tl time { font-family: Amiri, serif; letter-spacing: 0; text-transform: none; font-size: 15px; }
.pi-l-ar.zc-henna .zc-cell span { font-size: 12px; }
.pi-l-ar.zc-henna .hn-names, .pi-l-ar.zc-henna .zc-scr-h, .pi-l-ar.zc-henna .hn-sign, .pi-l-ar.zc-henna .hn-vby { font-family: 'Aref Ruqaa', serif; }
.pi-l-ar.zc-henna .hn-names { font-size: 42px; line-height: 1.35; color: var(--hn-ink); } .pi-l-ar.zc-henna .zc-scr-h { font-size: 32px; } .pi-l-ar.zc-henna .hn-sign { font-size: 36px; } .pi-l-ar.zc-henna .hn-vby { font-size: 24px; }
.pi-l-ar.zc-henna .hn-cdate { font-size: 28px; } .pi-l-ar.zc-henna .hn-quote { font-size: 21px; }
.zc-henna .zc-n.is-ar { font-family: 'Aref Ruqaa', serif; font-size: .82em; }
.zc-henna .pi-l2 { display: block; font-size: .86em; opacity: .85; margin-top: 2px; }
.zc-henna .hn-names .pi-l2, .zc-henna .hn-h .pi-l2 { font-size: .62em; }
/* the card's plate sits exactly where the film's last frame is (no camera zoom at the hand-off); once open it breathes in very slowly */
.pi-t-henna .lx-cam, .pi-t-henna.lx-reveal .lx-cam { transform: scale(1); transition: transform 16s cubic-bezier(.3, 0, .3, 1) 1.2s; }
.pi-t-henna.is-opened .lx-cam { transform: scale(1.035); }
@media (prefers-reduced-motion: reduce) { .pi-t-henna.is-opened .lx-cam { transform: scale(1); } }
/* the cover rises over the film's last moments (the film already equals the linen plate there), so there is no blank moment */
.pi.zc-henna .pi-intro { transition: opacity .6s ease, visibility .6s; will-change: opacity; }
.pi.zc-henna.hn-early .pi-intro { opacity: 0; pointer-events: none; }
.pi.zc-henna.hn-early .pi-card { opacity: 1; transition: opacity .6s ease; }
.pi.zc-henna.hn-early .hn-cover .pi-rv { opacity: 1; transform: none; }
.zc-henna .hn-cover .pi-rv { transition: opacity .7s ease, transform .85s cubic-bezier(.2, .75, .2, 1); }
@media (prefers-reduced-motion: reduce) { .zc-henna .hn-cover .pi-rv { transition: opacity .4s !important; } }
/* drifting over the card: rose petals, white petals and a few soft gold glints (transform/opacity only) */
.zc-henna .pi-fx .fx-lxwhite { width: 26px; height: 26px; background-image: url(lux/vel-petal-1.webp); opacity: .9; }
.zc-henna .pi-fx .fx-lxwhite:nth-child(3n) { background-image: url(lux/lace-petal-2.webp); width: 30px; height: 30px; }
.zc-henna .pi-fx .fx-lxwhite:nth-child(3n+1) { background-image: url(lux/lace-petal-1.webp); width: 22px; height: 22px; }
.zc-henna .pi-fx .fx-lxwhite:nth-child(4n) { width: 7px; height: 7px; border-radius: 50%; background: radial-gradient(circle, #fff6dc 0%, #ffd98a 40%, rgba(255, 200, 110, 0) 72%); opacity: .95; }

/* --- irongate.css --- */
/* ---------- THE PALACE GATE — daylight: ivory stone, black wrought iron & gold leaf (night palette kept for ?scene=night) ---------- */
.pi.zc-irongate { --ink: #23201b; --muted: #6f6450; --acc: #9a6f24; --line: rgba(154,111,36,.36); --paper: #f4efe3; --foot: #23201b;
  --g1: #fff3c8; --g2: #dcb15a; --g3: #8e6220; --g4: #f6dc93; --btn-bg: linear-gradient(135deg, #8e6624, #ecd08a 45%, #b98a3a 70%, #8a6122); --btn-ink: #15130f; --btn-r: 2px;
  --illu-bg: radial-gradient(70% 60% at 50% 40%, #fbf6ea, #e9dfc8); --illu-ln: rgba(40,32,20,.35); --map-r: 2px;
  --gold-grad: linear-gradient(100deg, #6d4b13 0%, #a67a2b 18%, #d6aa55 32%, #a77a2a 46%, #6f4c15 62%, #b5863a 80%, #d9b062 90%, #7c5619 100%);
  --pane-bg: radial-gradient(120% 60% at 50% 0%, rgba(255,255,255,.55), rgba(255,255,255,0) 60%), linear-gradient(180deg, rgba(252,249,241,.94), rgba(244,238,224,.95));
  --pane-in: rgba(250,246,236,.95); --pane-rule: rgba(154,111,36,.8); --pane-rule2: rgba(30,28,26,.55);
  --hi: #2a241a; --field-bg: rgba(255,253,247,.85); --map-bg: rgba(255,253,247,.85); --node-ring: #f6f1e4; --node-core: #1c1b1a;
  --win: rgba(22,22,24,.9); --cell-lbl: #d8c38c; --seg-on-ink: #15130f; --close-sh: 0 1px 10px rgba(255,252,240,.9); --btn-line: rgba(154,111,36,.85);
  color: var(--ink); font-family: 'Cormorant Garamond', 'Amiri', serif; font-size: 19px; }
/* night variant (?scene=night): the card carries a hidden .ig-nt marker */
.pi.zc-irongate:has(.ig-nt) { --ink: #f3e9d2; --muted: #c4b48f; --acc: #dcb766; --line: rgba(220,183,102,.38); --paper: #0b1226; --foot: #f3e9d2; --btn-ink: #0d1430;
  --illu-bg: radial-gradient(70% 60% at 50% 40%, #1d2d57, #0a1124); --illu-ln: rgba(5,10,25,.55);
  --gold-grad: linear-gradient(100deg, #8a6222 0%, #d5ad58 18%, #fff3c8 32%, #dfb862 46%, #9a6d26 62%, #ecca7c 80%, #fff4cc 90%, #b88b3c 100%);
  --pane-bg: radial-gradient(120% 60% at 50% 0%, rgba(40,62,120,.38), rgba(40,62,120,0) 60%), linear-gradient(180deg, rgba(12,20,44,.93), rgba(7,12,28,.95));
  --pane-in: rgba(7,12,28,.9); --pane-rule: rgba(220,183,102,.75); --pane-rule2: rgba(220,183,102,.45);
  --hi: #fff3c8; --field-bg: rgba(4,8,20,.55); --map-bg: rgba(4,8,20,.6); --node-ring: #0b1226; --node-core: #0b1226;
  --win: rgba(9,16,38,.55); --cell-lbl: #c4b48f; --seg-on-ink: #0d1430; --close-sh: 0 1px 10px rgba(0,0,0,.6); --btn-line: rgba(220,183,102,.8); }
.pi-l-ar.zc-irongate { font-family: 'Amiri', 'Cormorant Garamond', serif; font-size: 18px; }
.zc-irongate .ig-names .zc-n, .zc-irongate .ig-h .zc-ht, .zc-irongate .ig-dd b, .zc-irongate .ig-sign, .zc-irongate .zc-bism { background-image: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
.zc-irongate .pi-sec { position: relative; }
/* panes: lacquered night-blue plaques framed in a double gold rule with forged corner scrolls */
.ig-pane, .ig-main { position: relative; max-width: 460px; margin: 0 auto; box-sizing: border-box; text-align: center;
  background: var(--pane-bg);
  border: 1px solid var(--pane-rule); box-shadow: inset 0 0 0 5px var(--pane-in), inset 0 0 0 6px var(--pane-rule2), 0 10px 22px -14px rgba(0,0,0,.5); }
.ig-pane { padding: 40px 26px 34px; }
.zc-irongate .ig-cn { position: absolute !important; display: block; width: 46px; height: 46px; pointer-events: none; z-index: 0; }
.ig-pane > *:not(.ig-cn), .ig-main > *:not(.ig-cn) { position: relative; z-index: 1; }
.ig-cn svg { display: block; width: 100%; height: 100%; }
.zc-irongate .ig-tl { left: 9px; right: auto; top: 9px; bottom: auto; } .zc-irongate .ig-tr { right: 9px; left: auto; top: 9px; bottom: auto; transform: scaleX(-1); } .zc-irongate .ig-bl { left: 9px; right: auto; bottom: 9px; top: auto; transform: scaleY(-1); } .zc-irongate .ig-br { right: 9px; left: auto; bottom: 9px; top: auto; transform: scale(-1,-1); }
/* cover: the gate's cresting standing on the plaque */
.ig-cover { min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; justify-content: center; box-sizing: border-box; padding: 40px 14px 84px !important; }
.ig-gate { position: relative; width: 100%; max-width: 460px; margin: 0 auto; }
.ig-crest { display: block; width: 100%; height: auto; margin-bottom: -2px; filter: none; }
.ig-main { padding: 26px 24px 30px; border-top: 0; }
.zc-irongate .zc-bism { font-family: 'Aref Ruqaa', 'Amiri', serif; font-weight: 700; font-size: 29px; line-height: 1.5; margin: 4px 0 6px; direction: rtl; }
.zc-irongate .zc-guest { font-size: 17px; color: var(--muted); margin-bottom: 8px; font-style: italic; }
.zc-irongate .zc-pre, .zc-irongate .zc-inv { font-family: 'Cinzel', serif; font-size: 11.5px; letter-spacing: .3em; text-transform: uppercase; color: var(--muted); line-height: 1.8; }
.pi-l-ar.zc-irongate .zc-pre, .pi-l-ar.zc-irongate .zc-inv { font-family: 'Amiri', serif; font-size: 19px; letter-spacing: 0; text-transform: none; }
.zc-irongate .zc-pre > .pi-l2, .zc-irongate .zc-inv > .pi-l2 { font-family: 'Cinzel', serif; font-size: 10.5px; letter-spacing: .24em; text-transform: uppercase; font-style: normal; }
.ig-names { margin: 16px 0 4px; line-height: 1.05; }
.ig-names .zc-n { font-family: 'Pinyon Script', 'Great Vibes', cursive; font-weight: 400; font-size: clamp(50px, 15vw, 66px); padding: 0 .12em; }
.ig-names .zc-n.is-ar { font-family: 'Aref Ruqaa', 'Amiri', serif; font-weight: 700; font-size: clamp(46px, 13.5vw, 62px); line-height: 1.45; padding: 0; }
.ig-names .zc-amp svg { display: block; width: 30px; height: 30px; margin: 2px auto; }
.zc-irongate .zc-names2 { font-family: 'Cinzel', serif; font-size: 15px; letter-spacing: .22em; color: var(--acc); margin: 4px 0 10px; text-transform: uppercase; }
.zc-irongate .zc-names2.is-ar { font-family: 'Aref Ruqaa', serif; letter-spacing: 0; font-size: 24px; text-transform: none; }
.zc-irongate .zc-parents { font-size: 16px; color: var(--muted); margin: 6px 0 10px; font-style: italic; }
.ig-div { margin: 14px auto 10px; max-width: 300px; }
.ig-scroll { display: block; width: 100%; max-width: 300px; height: auto; margin: 0 auto; }
.ig-medal { display: block; width: 100%; height: 100%; }
/* date: day inside the crest medallion, weekday and month on either side */
.ig-date { display: grid; grid-template-columns: 1fr 104px 1fr; align-items: center; margin: 20px 0 6px; }
.ig-dw, .ig-dm { font-family: 'Cinzel', serif; font-size: 12px; letter-spacing: .22em; text-transform: uppercase; padding: 9px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.ig-dm em { display: block; font-style: normal; color: var(--muted); font-size: 11px; margin-top: 2px; }
.pi-l-ar.zc-irongate .ig-dw, .pi-l-ar.zc-irongate .ig-dm { font-family: 'Amiri', serif; font-size: 17px; letter-spacing: 0; text-transform: none; }
.ig-dd { position: relative; width: 104px; height: 104px; display: flex; align-items: center; justify-content: center; }
.ig-dd .ig-medal { position: absolute; inset: 0; opacity: .95; }
.ig-dd .ig-medal ellipse { opacity: .16; }
.ig-dd b { position: relative; font-family: 'Cinzel', serif; font-weight: 600; font-size: 38px; line-height: 1; }
.ig-time { font-family: 'Cinzel', serif; font-size: 12.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--acc); margin-top: 10px; }
.pi-l-ar.zc-irongate .ig-time { font-family: 'Amiri', serif; font-size: 18px; letter-spacing: 0; }
/* sections */
.ig-sec { padding: 22px 14px !important; }
.ig-h { margin-bottom: 18px; }
.ig-h .ig-hm { display: block; width: 40px; height: 40px; margin: 0 auto 8px; }
.ig-h .zc-ht { font-family: 'Cinzel', serif; font-weight: 600; font-size: 19px; letter-spacing: .2em; text-transform: uppercase; }
.pi-l-ar.zc-irongate .ig-h .zc-ht { font-family: 'Aref Ruqaa', 'Amiri', serif; font-weight: 700; font-size: 27px; letter-spacing: 0; text-transform: none; }
.zc-irongate .ig-h .zc-ht > .pi-l2 { display: block; font-family: 'Cormorant Garamond', serif; font-size: 15px; letter-spacing: .08em; text-transform: none; font-weight: 400; }
.ig-msgt { font-size: 20px; line-height: 1.65; font-style: italic; margin: 16px 0; }
.pi-l-ar.zc-irongate .ig-msgt { font-style: normal; font-size: 19px; }
/* countdown: four little gate windows */
.zc-irongate .pi-cd { gap: 8px; }
.zc-irongate .zc-cell { position: relative; width: 70px; height: 92px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding-top: 12px; box-sizing: border-box; }
.zc-irongate .zc-cell .ig-win { position: absolute; inset: 0; width: 100%; height: 100%; }
.zc-irongate .zc-cell b { position: relative; font-family: 'Cinzel', serif; font-weight: 600; font-size: 26px; color: #fff3c8; font-variant-numeric: tabular-nums; }
.zc-irongate .zc-cell span { position: relative; font-family: 'Cinzel', serif; font-size: 9.5px; letter-spacing: .18em; text-transform: uppercase; color: var(--cell-lbl); margin-top: 3px; }
.pi-l-ar.zc-irongate .zc-cell span { font-family: 'Amiri', serif; font-size: 13px; letter-spacing: 0; }
.zc-irongate .pi-past { margin-top: 12px; font-style: italic; }
/* details */
.ig-item { padding: 18px 0; border-top: 1px solid var(--line); }
.ig-item:first-of-type { border-top: 0; padding-top: 4px; }
.ig-item h3 { font-family: 'Cinzel', serif; font-size: 12px; letter-spacing: .3em; text-transform: uppercase; color: var(--acc); font-weight: 500; margin-bottom: 8px; }
.pi-l-ar.zc-irongate .ig-item h3 { font-family: 'Amiri', serif; font-size: 19px; font-weight: 700; letter-spacing: 0; text-transform: none; }
.ig-item p { line-height: 1.55; }
.ig-strong { font-size: 21px; color: var(--hi); font-weight: 500; }
.ig-vgate { position: relative; width: 66px; height: 86px; margin: 4px auto 12px; }
.ig-vgate .ig-win { position: absolute; inset: 0; width: 100%; height: 100%; }
.ig-vgate span { position: absolute; left: 17px; top: 30px; width: 32px; height: 32px; }
.zc-irongate .zc-btn { color: var(--hi); border-color: var(--btn-line); }
.zc-irongate .zc-btn-solid { color: var(--btn-ink); letter-spacing: .26em; font-weight: 600; }
/* programme: one forged picket with a gold spear, collars as the hours */
.ig-tlw { position: relative; max-width: 320px; margin: 0 auto; padding-top: 26px; }
.ig-spear { position: absolute; left: 50%; top: 0; width: 14px; height: 26px; margin-left: -7px; background: linear-gradient(135deg, #fff3c8, #dcb15a 40%, #8e6220 70%, #f6dc93); clip-path: polygon(50% 0, 100% 62%, 64% 70%, 64% 100%, 36% 100%, 36% 70%, 0 62%); }
.zc-irongate .ig-tl { position: relative; }
.zc-irongate .ig-tlw .ig-tl::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 6px; width: 4px; margin-left: -2px; background: linear-gradient(90deg, #05070d, #3b4357 45%, #8d96aa 55%, #1a1e29); border-radius: 2px; }
.zc-irongate .ig-tl li { position: relative; display: grid; grid-template-columns: 1fr 34px 1fr; align-items: center; padding: 12px 0; }
.zc-irongate .ig-tl time { text-align: end; font-family: 'Cinzel', serif; font-size: 17px; color: var(--hi); letter-spacing: .06em; padding-inline-end: 6px; }
.zc-irongate .ig-tl li > span { text-align: start; padding-inline-start: 6px; font-size: 18px; line-height: 1.35; }
.ig-node { position: relative; display: block; width: 20px; height: 20px; margin: 0 auto; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff3c8, #dcb15a 45%, #7a5014); box-shadow: 0 0 0 3px var(--node-ring), 0 0 0 4px rgba(220,183,102,.55); }
.ig-node b { position: absolute; inset: 6px; border-radius: 50%; background: var(--node-core); }
/* photo (optional) and gallery */
.ig-arch { width: 220px; max-width: 72%; margin: 0 auto; padding: 6px; border: 1px solid rgba(220,183,102,.8); border-radius: 120px 120px 4px 4px; }
.ig-arch .zc-portrait { margin: 0; }
.ig-arch .zc-pic { aspect-ratio: 3 / 4; border-radius: 112px 112px 2px 2px; }
.ig-cap { margin-top: 14px; font-style: italic; color: var(--muted); }
.ig-gal figure { border: 1px solid rgba(220,183,102,.5); padding: 3px; box-sizing: border-box; }
/* RSVP on lacquer */
.zc-irongate .pi-form label > span, .zc-irongate .pi-form legend { font-family: 'Cinzel', serif; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); }
.pi-l-ar.zc-irongate .pi-form label > span, .pi-l-ar.zc-irongate .pi-form legend { font-family: 'Amiri', serif; font-size: 16px; letter-spacing: 0; text-transform: none; }
.zc-irongate .pi-form input, .zc-irongate .pi-form select, .zc-irongate .pi-form textarea { color: var(--ink); background: var(--field-bg); border: 1px solid rgba(180,135,55,.5); border-radius: 2px; }
.zc-irongate .pi-form select option { color: #1a1a1a; }
.zc-irongate .pi-seg span { border-radius: 2px; border-color: rgba(220,183,102,.55); color: var(--ink); }
.zc-irongate .pi-seg input:checked + span { background: var(--acc); color: var(--seg-on-ink); }
.zc-irongate .zc-sub { color: var(--muted); }
/* closing */
.ig-close { padding: 30px 14px 20px !important; }
.ig-closein { max-width: 380px; margin: 0 auto; text-align: center; }
.ig-closein .ig-crest { opacity: .95; margin-bottom: 14px; }
.ig-closing { font-style: italic; font-size: 19px; color: var(--ink); text-shadow: var(--close-sh); }
.ig-sign { font-family: 'Pinyon Script', 'Great Vibes', cursive; font-size: 40px; margin-top: 8px; line-height: 1.3; }
.ig-sign i { font-style: normal; font-family: 'Cormorant Garamond', serif; font-size: .55em; }
.pi-l-ar.zc-irongate .ig-sign { font-family: 'Aref Ruqaa', 'Amiri', serif; font-size: 32px; }
.zc-irongate .pi-cue { border-color: var(--acc); }
/* entrance: sections rise gently, the gate-window cells open from their hinge (transform/opacity only) */
.zc-irongate .pi-rv { transform: translate3d(0, 22px, 0); }
.zc-irongate .pi-rv.in { transform: none; }
.zc-irongate .ig-pane.pi-rv { transform: translate3d(0, 26px, 0) scale(.985); transition: opacity 1s ease, transform 1.1s cubic-bezier(.2,.75,.2,1); }
.zc-irongate .ig-pane.pi-rv.in { transform: none; }
@media (prefers-reduced-motion: reduce) { .zc-irongate .pi-rv, .zc-irongate .ig-pane.pi-rv { transform: none; } }

.pi.zc-irongate .zc-map { background: var(--map-bg); border: 1px solid rgba(220,183,102,.5); color: var(--acc); }
/* daylight: the iron window panes of the countdown/venue are black iron (CSS beats the SVG fill attribute) */
.zc-irongate .ig-win path { fill: var(--win); }
.zc-irongate .zc-btn-solid { color: var(--btn-ink); }
.ig-nt { display: none !important; }
/* film.mono: the couple's initials engraved in black iron on the gilded crest cartouche (daylight poster) */
.zc-irongate .lxm span { background: none; -webkit-background-clip: border-box; background-clip: border-box; color: #24190a; -webkit-text-fill-color: #24190a; text-shadow: 0 1px 0 rgba(255,238,190,.75), 0 -1px 0 rgba(60,38,8,.35); }

/* --- jewel.css --- */
/* ---------- THE JEWEL BOX — midnight velvet case, champagne satin, platinum & gold ---------- */
.pi.zc-jewel { --ink: #1b2340; --muted: #6d6a72; --acc: #b48a45; --line: rgba(160,124,62,.35); --paper: #f4ece0; --foot: #1b2340;
  --g1: #fff4d6; --g2: #d9b46a; --g3: #9a7030; --g4: #f1d89c; --btn-bg: linear-gradient(160deg, #1e2b5c, #0e1735 70%); --btn-ink: #f3dfae; --btn-r: 999px;
  --illu-bg: radial-gradient(70% 60% at 50% 40%, #fbf6ec, #e9dcc6); --illu-ln: rgba(255,255,255,.6); --map-r: 14px;
  --plat: linear-gradient(100deg, #8d97ad 0%, #e8edf6 22%, #ffffff 34%, #b9c2d3 50%, #f2f5fa 68%, #9aa4b8 84%, #e6ebf3 100%);
  --gold-grad: linear-gradient(100deg, #9a7030 0%, #d9b46a 20%, #fff4d6 34%, #e2bf76 48%, #a77a35 64%, #edd093 82%, #fff2cf 92%, #b88d45 100%);
  color: var(--ink); font-family: 'Cormorant Garamond', 'Amiri', serif; font-size: 19px; }
.pi-l-ar.zc-jewel { font-family: 'Amiri', 'Cormorant Garamond', serif; font-size: 18px; }
.zc-jewel .pi-sec { position: relative; }
.zc-jewel .jw-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
/* velvet: midnight-blue case with a soft sheen on the rim and a gold inlay line */
.jw-case, .jw-velvet { position: relative; max-width: 440px; margin: 0 auto; box-sizing: border-box; text-align: center; color: #efe6d2; border-radius: 26px;
  background: radial-gradient(130% 70% at 30% 0%, rgba(90,116,190,.30), rgba(90,116,190,0) 55%), radial-gradient(90% 60% at 80% 100%, rgba(4,8,22,.55), rgba(4,8,22,0) 70%), url(lux/jewel-velvet.webp) 0 0 / 128px 128px, #121c3e;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06), inset 0 0 0 7px rgba(8,13,32,.55), inset 0 0 0 8px rgba(217,180,106,.55), inset 0 2px 24px rgba(150,170,230,.18), 0 18px 34px -18px rgba(30,24,40,.55); }
.jw-velvet { padding: 36px 24px 34px; }
.zc-jewel .jw-c { position: absolute !important; width: 9px; height: 9px; transform: rotate(45deg); background: var(--gold-grad); box-shadow: 0 0 0 2px rgba(8,13,32,.9); z-index: 1; }
.zc-jewel .jw-c1 { top: 3.5px; left: 50%; margin-left: -4.5px; } .zc-jewel .jw-c2 { bottom: 3.5px; left: 50%; margin-left: -4.5px; }
.zc-jewel .jw-c3 { top: 50%; left: 3.5px; margin-top: -4.5px; right: auto; } .zc-jewel .jw-c4 { top: 50%; right: 3.5px; margin-top: -4.5px; left: auto; }
.jw-case > *:not(.jw-c), .jw-velvet > *:not(.jw-c) { position: relative; z-index: 2; }
/* satin: champagne silk card, ivory sheen, a hairline gold frame */
.jw-satin { position: relative; max-width: 420px; margin: 0 auto; box-sizing: border-box; padding: 10px; border-radius: 6px; text-align: center; color: var(--ink);
  background: linear-gradient(115deg, #efe2cb 0%, #fbf5ea 18%, #e9d9bd 34%, #f8f0e2 52%, #e4d2b4 70%, #fbf6ec 86%, #ecdfc8 100%);
  box-shadow: 0 1px 0 rgba(255,255,255,.7) inset, 0 16px 30px -18px rgba(70,52,30,.5), 0 2px 6px -2px rgba(70,52,30,.25); }
.jw-satin-in { position: relative; padding: 30px 18px 28px; border: 1px solid rgba(180,138,69,.55); box-shadow: inset 0 0 0 3px rgba(255,250,240,.6), inset 0 0 0 4px rgba(180,138,69,.28); border-radius: 3px; }
/* cover */
.jw-cover { min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; justify-content: center; box-sizing: border-box; padding: 34px 16px 84px !important; }
.jw-case { padding: 30px 22px 34px; }
.jw-crown { position: relative; width: 76px; height: 76px; margin: 2px auto 10px; }
.jw-brill { display: block; width: 100%; height: 100%; }
.zc-jewel .jw-glint { position: absolute; display: block; width: 22px; height: 22px; top: 6%; right: 8%; opacity: 0; transform: scale(.2) rotate(0deg); pointer-events: none; }
.zc-jewel .jw-glint svg { display: block; width: 100%; height: 100%; }
.zc-jewel .pi-rv.in .jw-glint, .zc-jewel .pi-rv.in + .jw-glint, .zc-jewel .in > .jw-glint { animation: jwGlint 1.6s .5s ease-out 1 both; }
@keyframes jwGlint { 0% { opacity: 0; transform: scale(.2) rotate(0deg); } 35% { opacity: 1; transform: scale(1) rotate(45deg); } 100% { opacity: 0; transform: scale(.3) rotate(90deg); } }
.zc-jewel .zc-bism { font-family: 'El Messiri', 'Amiri', serif; font-weight: 400; font-size: 25px; line-height: 1.6; margin: 0 0 6px; direction: rtl; color: #e9d3a0; }
.zc-jewel .zc-guest { font-size: 17px; color: #c9bfae; font-style: italic; margin-bottom: 6px; }
.zc-jewel .jw-case .zc-guest b { color: #f4e3b8; font-style: normal; }
.zc-jewel .zc-pre, .zc-jewel .zc-inv { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 10.5px; letter-spacing: .42em; text-transform: uppercase; line-height: 2; color: #c7c2bd; }
.zc-jewel .zc-pre > .pi-l2, .zc-jewel .zc-inv > .pi-l2 { font-family: 'Jost', sans-serif; font-size: 10px; letter-spacing: .3em; text-transform: uppercase; }
.pi-l-ar.zc-jewel .zc-pre, .pi-l-ar.zc-jewel .zc-inv { font-family: 'Tajawal', sans-serif; font-size: 16px; letter-spacing: 0; text-transform: none; }
/* names: thin couture capitals in platinum, a gold diamond as the ampersand, a light sheen passes once */
.jw-names { position: relative; overflow: hidden; margin: 14px 0 6px; padding: 4px 0; line-height: 1; }
.jw-names .zc-n { display: block; font-family: 'Italiana', 'Cormorant Garamond', serif; font-weight: 400; font-size: clamp(46px, 14vw, 62px); letter-spacing: .08em; text-transform: uppercase; background-image: var(--plat); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; padding: 2px 0; }
.jw-names .zc-n.is-ar { font-family: 'El Messiri', 'Amiri', serif; font-weight: 600; letter-spacing: 0; font-size: clamp(42px, 12.5vw, 56px); line-height: 1.5; text-transform: none; }
.jw-names .jw-amp { display: block; margin: 6px auto 8px; width: 34px; }
.jw-names .jw-amp svg { display: block; width: 34px; height: 29px; }
.jw-sheen { position: absolute; top: 0; bottom: 0; left: 0; width: 34%; background: linear-gradient(100deg, rgba(255,255,255,0), rgba(255,255,255,.22) 50%, rgba(255,255,255,0)); transform: translateX(-120%) skewX(-18deg); opacity: 0; pointer-events: none; z-index: 3; }
.zc-jewel .jw-names.in .jw-sheen { animation: jwSheen 2.2s 1s cubic-bezier(.4,0,.2,1) 1 both; }
@keyframes jwSheen { 0% { opacity: 1; transform: translateX(-120%) skewX(-18deg); } 90% { opacity: 1; } 100% { opacity: 0; transform: translateX(400%) skewX(-18deg); } }
.zc-jewel .zc-names2 { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 13px; letter-spacing: .32em; text-transform: uppercase; color: #e2c98f; margin: 6px 0 8px; }
.zc-jewel .zc-names2.is-ar { font-family: 'El Messiri', serif; font-size: 22px; letter-spacing: 0; text-transform: none; }
.zc-jewel .jw-case .zc-parents { font-size: 16px; color: #c9bfae; font-style: italic; margin: 4px 0 8px; }
/* the date on the satin cushion, with the ring slit */
.jw-cushion { position: relative; margin: 20px -8px 16px; padding: 18px 12px 16px; border-radius: 16px; color: var(--ink);
  background: radial-gradient(120% 90% at 50% 0%, #fffaf0 0%, rgba(255,250,240,0) 60%), linear-gradient(180deg, #f3e6cf, #e2cfae 55%, #d8c19b);
  box-shadow: inset 0 2px 3px rgba(255,255,255,.8), inset 0 -6px 14px rgba(120,88,40,.28), 0 6px 14px -8px rgba(0,0,0,.6); }
.jw-slit { position: absolute; left: 50%; top: 9px; width: 54px; height: 3px; margin-left: -27px; border-radius: 3px; background: linear-gradient(180deg, rgba(110,80,36,.5), rgba(255,255,255,.7)); }
.jw-dow { font-family: 'Jost', sans-serif; font-weight: 400; font-size: 11px; letter-spacing: .4em; text-transform: uppercase; color: #8a6a35; margin-top: 4px; }
.jw-dnum { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 6px 0 4px; font-family: 'Italiana', serif; font-size: 34px; line-height: 1.1; color: #18213f; }
.jw-dnum .jw-mon { font-size: 22px; letter-spacing: .14em; text-transform: uppercase; }
.jw-dnum i svg { display: block; width: 13px; height: 11px; }
.pi-l-ar.zc-jewel .jw-dow, .pi-l-ar.zc-jewel .jw-time { font-family: 'Tajawal', sans-serif; letter-spacing: 0; font-size: 15px; }
.pi-l-ar.zc-jewel .jw-dnum .jw-mon { font-family: 'El Messiri', serif; letter-spacing: 0; font-size: 22px; }
.jw-time { font-family: 'Jost', sans-serif; font-weight: 400; font-size: 11.5px; letter-spacing: .32em; text-transform: uppercase; color: #8a6a35; }
/* sections */
.jw-sec { padding: 22px 14px !important; }
.jw-h { margin-bottom: 16px; }
.jw-hg { position: relative; display: block; width: 30px; height: 26px; margin: 0 auto 8px; }
.jw-hg .jw-gem { display: block; width: 30px; height: 26px; }
.jw-hg .jw-glint { width: 16px; height: 16px; top: -6px; right: -8px; }
.zc-jewel .jw-h .zc-ht { font-family: 'Italiana', serif; font-size: 25px; letter-spacing: .2em; text-transform: uppercase; }
.zc-jewel .jw-velvet .jw-h .zc-ht { background-image: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
.zc-jewel .jw-satin .jw-h .zc-ht { color: #1b2340; }
.pi-l-ar.zc-jewel .jw-h .zc-ht { font-family: 'El Messiri', serif; font-weight: 600; font-size: 25px; letter-spacing: 0; text-transform: none; }
.zc-jewel .jw-h .zc-ht > .pi-l2 { display: block; font-family: 'Jost', sans-serif; font-size: 11px; letter-spacing: .3em; text-transform: uppercase; font-weight: 300; margin-top: 6px; }
.zc-jewel .jw-velvet .jw-h .zc-ht > .pi-l2 { color: #d5cbb8; -webkit-text-fill-color: #d5cbb8; }
.jw-rule { display: flex; align-items: center; gap: 10px; max-width: 220px; margin: 0 auto; }
.jw-rule > i { flex: 1; height: 1px; background: linear-gradient(90deg, rgba(180,138,69,0), rgba(180,138,69,.8)); }
.jw-rule > i:last-child { background: linear-gradient(270deg, rgba(180,138,69,0), rgba(180,138,69,.8)); }
.jw-rule .jw-gem { width: 18px; height: 16px; }
.jw-flip .jw-gem { transform: rotate(180deg); }
.jw-msgt { font-size: 20px; line-height: 1.7; font-style: italic; margin: 16px 0; color: #222a47; }
.pi-l-ar.zc-jewel .jw-msgt { font-style: normal; font-size: 19px; }
/* countdown: emerald-cut stones */
.zc-jewel .pi-cd { gap: 7px; }
.zc-jewel .zc-cell { position: relative; width: 68px; height: 88px; display: flex; flex-direction: column; align-items: center; justify-content: center; box-sizing: border-box; }
.zc-jewel .zc-cell .jw-emer { position: absolute; inset: 0; width: 100%; height: 100%; }
.zc-jewel .zc-cell b { position: relative; font-family: 'Italiana', serif; font-weight: 400; font-size: 30px; color: #fff3d6; font-variant-numeric: tabular-nums; line-height: 1.1; }
.zc-jewel .zc-cell span { position: relative; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 9px; letter-spacing: .24em; text-transform: uppercase; color: #cfc4b0; margin-top: 4px; }
.pi-l-ar.zc-jewel .zc-cell span { font-family: 'Tajawal', sans-serif; font-size: 12px; letter-spacing: 0; }
.zc-jewel .pi-past { margin-top: 12px; font-style: italic; }
/* the certificate */
.jw-cert .jw-satin-in { padding-top: 22px; text-align: start; }
.jw-certh { text-align: center; padding-bottom: 14px; margin-bottom: 6px; border-bottom: 1px solid rgba(180,138,69,.45); }
.jw-certh .jw-brill { width: 48px; height: 48px; margin: 0 auto 6px; }
.jw-certh .jw-brill path, .jw-certh .jw-brill circle { stroke: #6f7a92; }
.jw-certk { font-family: 'Italiana', serif; font-size: 24px; letter-spacing: .22em; text-transform: uppercase; color: #1b2340; }
.pi-l-ar.zc-jewel .jw-certk { font-family: 'El Messiri', serif; letter-spacing: 0; font-weight: 600; }
.jw-certk > .pi-l2 { font-family: 'Jost', sans-serif; font-size: 10.5px; letter-spacing: .3em; }
.jw-certn { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 11px; letter-spacing: .34em; text-transform: uppercase; color: #8a6a35; margin-top: 4px; }
.jw-certn i { font-style: normal; }
.jw-row { display: grid; grid-template-columns: auto 1fr; grid-template-areas: "l d" "v v"; align-items: end; column-gap: 8px; padding: 12px 2px 10px; border-bottom: 1px dashed rgba(180,138,69,.0); }
.jw-rl { grid-area: l; font-family: 'Jost', sans-serif; font-weight: 500; font-size: 10.5px; letter-spacing: .3em; text-transform: uppercase; color: #8a6a35; }
.pi-l-ar.zc-jewel .jw-rl { font-family: 'Tajawal', sans-serif; font-size: 15px; letter-spacing: 0; font-weight: 700; }
.jw-dots { grid-area: d; height: 1px; margin-bottom: 5px; background-image: radial-gradient(circle, rgba(140,104,48,.65) .8px, transparent 1.2px); background-size: 6px 2px; background-repeat: repeat-x; }
.jw-rv { grid-area: v; display: block; font-size: 19px; line-height: 1.45; margin-top: 4px; color: #18213f; }
.jw-rv b { font-weight: 600; } .jw-rv em { display: block; font-size: 16px; color: var(--muted); }
.jw-btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 18px 0 4px; }
.zc-jewel .zc-btn { border-radius: 999px; border-color: rgba(27,35,64,.55); color: #1b2340; font-family: 'Jost', sans-serif; letter-spacing: .2em; }
.zc-jewel .zc-btn-solid { color: var(--btn-ink); border: 1px solid #d9b46a; box-shadow: inset 0 0 0 3px #0e1735, inset 0 0 0 4px rgba(217,180,106,.5); letter-spacing: .3em; font-weight: 500; }
.jw-stamp { position: absolute !important; right: 14px; bottom: 12px; width: 34px; height: 34px; border-radius: 50%; display: flex; align-items: center; justify-content: center; border: 1px solid rgba(180,138,69,.6); box-shadow: inset 0 0 0 3px rgba(255,250,240,.5), inset 0 0 0 4px rgba(180,138,69,.35); }
.pi-l-ar .jw-stamp, [dir=rtl] .jw-stamp { right: auto; left: 14px; }
.jw-stamp svg { width: 16px; height: 14px; }
.jw-cert .jw-btns { margin-bottom: 30px; }
.pi.zc-jewel .zc-map { background: #f7f0e4; border: 1px solid rgba(180,138,69,.5); color: #8a6a35; border-radius: 12px; margin-bottom: 26px; }
/* programme: a fine chain with brilliants, hours above their lines */
.jw-neck { position: relative; max-width: 330px; margin: 0 auto; padding-top: 14px; text-align: start; }
.jw-clasp { position: absolute; top: 0; inset-inline-start: 10px; width: 12px; height: 12px; margin-inline-start: -2px; border-radius: 50%; border: 2px solid #d9b46a; box-sizing: border-box; }
.zc-jewel .jw-tl { position: relative; padding-inline-start: 34px; }
.zc-jewel .jw-tl::before { content: ""; position: absolute; top: 0; bottom: 14px; inset-inline-start: 14px; width: 2px; background-image: radial-gradient(ellipse 1px 2px at 50% 50%, #f1d89c 70%, transparent 75%); background-size: 2px 5px; background-repeat: repeat-y; }
.zc-jewel .jw-tl li { position: relative; display: block; padding: 10px 0 14px; }
.zc-jewel .jw-node { position: absolute; inset-inline-start: -30px; top: 12px; width: 22px; height: 22px; }
.zc-jewel .jw-node svg { display: block; width: 100%; height: 100%; }
.zc-jewel .jw-tl time { display: block; font-family: 'Italiana', serif; font-size: 24px; letter-spacing: .08em; color: #f3dca6; line-height: 1.2; }
.zc-jewel .jw-tl li > span { display: block; font-size: 18px; line-height: 1.4; color: #e9e2d4; margin-top: 2px; }
/* optional photo: an oval locket */
.jw-locket { max-width: 250px; margin: 0 auto; text-align: center; }
.jw-bail { display: block; width: 40px; height: 34px; margin: 0 auto -4px; }
.jw-oval { padding: 7px; border-radius: 50%; background: var(--gold-grad); box-shadow: 0 14px 26px -14px rgba(60,40,10,.6); }
.jw-oval .zc-portrait { margin: 0; }
.jw-oval .zc-pic { aspect-ratio: 3 / 4; border-radius: 50%; overflow: hidden; box-shadow: inset 0 0 0 2px rgba(255,255,255,.4); }
.jw-cap { margin-top: 12px; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 11px; letter-spacing: .34em; text-transform: uppercase; color: #6b5a3c; }
.pi-l-ar.zc-jewel .jw-cap { font-family: 'Tajawal', sans-serif; letter-spacing: 0; font-size: 15px; }
.jw-gal figure { border-radius: 10px; overflow: hidden; box-shadow: 0 0 0 1px rgba(217,180,106,.8), 0 0 0 4px rgba(8,13,32,.6); }
/* RSVP on satin */
.zc-jewel .pi-form { text-align: start; }
.zc-jewel .pi-form label > span, .zc-jewel .pi-form legend { font-family: 'Jost', sans-serif; font-weight: 500; font-size: 10.5px; letter-spacing: .28em; text-transform: uppercase; color: #8a6a35; }
.pi-l-ar.zc-jewel .pi-form label > span, .pi-l-ar.zc-jewel .pi-form legend { font-family: 'Tajawal', sans-serif; font-size: 15px; letter-spacing: 0; text-transform: none; }
.zc-jewel .pi-form input, .zc-jewel .pi-form select, .zc-jewel .pi-form textarea { color: #18213f; background: rgba(255,252,246,.55); border: 0; border-bottom: 1px solid rgba(27,35,64,.45); border-radius: 0; }
.zc-jewel .pi-form textarea { border: 1px solid rgba(27,35,64,.3); border-radius: 4px; }
.zc-jewel .pi-seg span { border-radius: 999px; border-color: rgba(27,35,64,.4); color: #1b2340; }
.zc-jewel .pi-seg input:checked + span { background: linear-gradient(160deg, #1e2b5c, #0e1735); color: #f3dfae; border-color: #0e1735; }
.zc-jewel .zc-sub { color: var(--muted); font-style: italic; }
.jw-thx .jw-ring { width: 64px; height: 64px; margin: 0 auto 6px; display: block; }
/* closing */
.jw-close { padding: 34px 14px 22px !important; }
.jw-closein { position: relative; max-width: 360px; margin: 0 auto; text-align: center; }
.jw-closein .jw-ring { display: block; width: 92px; height: 92px; margin: 0 auto 10px; }
.jw-closein .jw-glint { top: 0; right: 36%; width: 24px; height: 24px; }
.jw-closein .jw-glint path { fill: #fffbe9; }
.jw-closing { font-style: italic; font-size: 20px; color: #2a2f4a; }
.jw-sign { font-family: 'Italiana', serif; font-size: 30px; letter-spacing: .14em; text-transform: uppercase; margin-top: 8px; line-height: 1.3; color: #1b2340; }
.jw-sign i { font-style: normal; font-size: .6em; color: #a77a35; }
.pi-l-ar.zc-jewel .jw-sign { font-family: 'El Messiri', serif; letter-spacing: 0; text-transform: none; font-weight: 600; }
.zc-jewel .zc-foot a { color: #1b2340; }
.zc-jewel .pi-cue { border-color: #d9b46a; }
/* entrance: cases rise and settle like a lid coming to rest; small stones glint once (transform/opacity only) */
.zc-jewel .pi-rv { transform: translate3d(0, 18px, 0); }
.zc-jewel .pi-rv.in { transform: none; }
.zc-jewel .jw-velvet.pi-rv, .zc-jewel .jw-satin.pi-rv { transform: translate3d(0, 30px, 0) scale(.97); transform-origin: 50% 100%; transition: opacity .9s ease, transform 1.1s cubic-bezier(.18,.9,.25,1.04); }
.zc-jewel .jw-velvet.pi-rv.in, .zc-jewel .jw-satin.pi-rv.in { transform: none; }
.zc-jewel .jw-crown.pi-rv { transform: translate3d(0, 10px, 0) scale(.6) rotate(-30deg); transition: opacity 1s ease, transform 1.3s cubic-bezier(.2,.8,.2,1.1); }
.zc-jewel .jw-crown.pi-rv.in { transform: none; }
@media (prefers-reduced-motion: reduce) { .zc-jewel .pi-rv, .zc-jewel .jw-velvet.pi-rv, .zc-jewel .jw-satin.pi-rv, .zc-jewel .jw-crown.pi-rv { transform: none; } .zc-jewel .jw-glint, .zc-jewel .jw-sheen { animation: none !important; } }

[dir=rtl] .zc-jewel .jw-tl .pi-l2, [dir=rtl] .zc-jewel .jw-row .pi-l2, .zc-jewel[dir=rtl] .jw-tl .pi-l2, .zc-jewel[dir=rtl] .jw-row .pi-l2 { text-align: right; }
.zc-jewel .jw-tl li > span:dir(rtl) > .pi-l2, .zc-jewel .jw-row > span:dir(rtl) > .pi-l2 { text-align: right; }

/* --- lace.css --- */
/* THE LACE LETTER v3 — opening is a pre-rendered film (lux/lace-open.mp4); the only live layers are the wax seal and the hint.
   The seal does not crack here: on the tap it lifts a little and melts away into a soft glow (transform/opacity only). */
.pi.zc-lace .lxv-box, .zc-lace .lxv-box { background: #e4dccd; }
.zc-lace .lxs { transition: opacity 1.4s cubic-bezier(.4, 0, .2, 1) .15s, transform 1.9s cubic-bezier(.4, 0, .2, 1); }
.zc-lace .is-open .lxs, .zc-lace.is-open .lxs, .zc-lace .is-play .lxs { opacity: 0; transform: translate(-50%, -58%) scale(1.07); }
.zc-lace .is-open .lxs-halo, .zc-lace .is-play .lxs-halo { opacity: 0; transition: opacity 1s ease; }
.zc-lace .lxs-halo { background: radial-gradient(circle, rgba(255, 236, 190, .5), rgba(255, 236, 190, 0) 62%); }
@media (prefers-reduced-motion: reduce) { .zc-lace .lxs { transition: opacity .6s ease; } }

/* ---- inner card ---- */
.pi.zc-lace { --lc-ink: #5d4426; --lc-gold: #a8844a; --lc-gold2: #c9a768; --lc-paper: rgba(255, 251, 244, .95); color: var(--lc-ink); font-family: 'Cormorant Garamond', Georgia, serif; }
.pi.zc-lace.pi-env-blush { --lc-ink: #6a4740; --lc-gold: #b0806b; --lc-gold2: #d0a492; --lc-paper: rgba(255, 249, 247, .95); }
.pi.zc-lace.pi-env-sage { --lc-ink: #47513a; --lc-gold: #9c8c58; --lc-gold2: #bfb07a; --lc-paper: rgba(253, 253, 247, .95); }
.zc-lace .zc-card { position: relative; z-index: 2; padding: 0 0 30px; }
.zc-lace .lc-cover { min-height: 100vh; min-height: 100svh; display: flex; align-items: center; justify-content: center; text-align: center; padding: 60px 26px; position: relative; }
.zc-lace .lc-cv { max-width: 520px; position: relative; }
.zc-lace .lc-cv::before { content: ''; position: absolute; left: -40px; right: -40px; top: -70px; bottom: -110px; z-index: -1; background: radial-gradient(closest-side, rgba(255, 251, 243, .88), rgba(255, 251, 243, .78) 50%, rgba(255, 251, 243, .42) 74%, rgba(255, 251, 243, 0)); } /* soft ivory glow so the live text reads over the photo's flowers */
.zc-lace .zc-bism { font: 700 22px/1.6 Amiri, serif; color: var(--lc-gold); margin: 0 0 10px; }
.zc-lace .lc-pre { font: 400 12px/1.7 Cinzel, serif; letter-spacing: .24em; text-transform: uppercase; margin: 0 0 4px; }
.zc-lace .lc-names { font: 400 60px/1.15 'Pinyon Script', cursive; color: #8a6634; margin: 6px 0; font-weight: 400; }
.zc-lace .lc-names .zc-n { display: inline-block; } .zc-lace .lc-names .zc-amp { display: inline-block; font-size: .58em; padding: 0 .2em; color: var(--lc-gold2); }
.zc-lace .zc-names2 { font: italic 500 20px 'Cormorant Garamond', serif; margin: 0 0 6px; }
.zc-lace .lc-rule { width: 200px; max-width: 70%; margin: 12px auto; color: var(--lc-gold); line-height: 0; }
.zc-lace .lc-rule svg { width: 100%; height: auto; }
.zc-lace .lc-cdate { font: italic 500 20px/1.4 'Cormorant Garamond', serif; margin: 6px 0 2px; }
.zc-lace .lc-ctime, .zc-lace .lc-cvenue, .zc-lace .lc-cdress { font: 400 15px/1.6 'Cormorant Garamond', serif; margin: 2px 0; letter-spacing: .03em; }
.zc-lace .lc-cvenue { font-weight: 600; }
.zc-lace .zc-parents p, .zc-lace .zc-guest { font: italic 17px 'Cormorant Garamond', serif; margin: 4px 0; }
.zc-lace .lc-sec { padding: 34px 20px; }
/* the lace panel: ivory paper, scalloped edges top and bottom (static gradients), an eyelet line and a gold hairline */
.zc-lace .lc-panel { position: relative; max-width: 520px; margin: 14px auto; padding: 40px 24px 36px; background: var(--lc-paper); text-align: center; box-shadow: 0 14px 34px rgba(90, 62, 28, .14); }
.zc-lace .lc-panel::before, .zc-lace .lc-panel::after { content: ''; position: absolute; left: 0; right: 0; height: 12px; background-repeat: repeat-x; background-size: 16px 12px; }
.zc-lace .lc-panel::before { top: -11px; background-image: radial-gradient(circle at 8px 12px, var(--lc-paper) 7.6px, rgba(255, 255, 255, 0) 8.2px); }
.zc-lace .lc-panel::after { bottom: -11px; background-image: radial-gradient(circle at 8px 0, var(--lc-paper) 7.6px, rgba(255, 255, 255, 0) 8.2px); }
.zc-lace .lc-lace { position: absolute; inset: 8px; pointer-events: none; border: 1px solid rgba(168, 132, 74, .45); }
.zc-lace .lc-lace::before { content: ''; position: absolute; inset: 5px; border: 1.6px dotted rgba(168, 132, 74, .5); }
.zc-lace .lc-acc { position: absolute; width: 112px; height: auto; pointer-events: none; z-index: 2; }
.zc-lace .lc-acc-tl { left: -26px; top: -40px; transform: rotate(-12deg); }
.zc-lace .lc-acc-tr { right: -24px; top: -42px; transform: rotate(14deg); }
.zc-lace .lc-acc-br { right: -22px; bottom: -36px; transform: rotate(160deg); width: 96px; }
.zc-lace .lc-acc-b { left: 50%; bottom: -46px; margin-left: -56px; }
.zc-lace .lc-acc-t { left: 50%; top: -52px; margin-left: -56px; width: 112px; }
.zc-lace .lc-kick { font: 400 11px/1.6 Cinzel, serif; letter-spacing: .26em; text-transform: uppercase; margin: 0; opacity: .8; }
.zc-lace .lc-h { font: 400 42px/1.2 'Pinyon Script', cursive; color: #8a6634; margin: 2px 0 0; font-weight: 400; }
.zc-lace .lc-msgt { font: italic 500 19px/1.65 'Cormorant Garamond', serif; margin: 6px 0 0; }
.zc-lace .lc-cdd { font: italic 500 17px 'Cormorant Garamond', serif; margin: 0 0 12px; }
.zc-lace .lc-tail { font: italic 16px 'Cormorant Garamond', serif; margin: 12px 0 0; opacity: .85; }
.zc-lace .zc-cd { display: flex; justify-content: center; gap: 9px; direction: ltr; }
.zc-lace .zc-cell { width: 66px; padding: 12px 0 9px; border-radius: 33px / 40px; background: linear-gradient(#fffdf8, #f6ecdb); box-shadow: inset 0 0 0 1px rgba(168, 132, 74, .55), inset 0 0 0 4px #fffdf8, inset 0 0 0 5px rgba(168, 132, 74, .3); }
.zc-lace .zc-cell b { display: block; font: 600 28px/1.15 'Cormorant Garamond', serif; color: #7a5a2e; }
.zc-lace .zc-cell span { display: block; font: 400 9.5px/1.4 Cinzel, serif; letter-spacing: .14em; text-transform: uppercase; margin-top: 3px; }
.zc-lace .lc-calw { margin-top: 18px; }
.zc-lace .zc-btn { display: inline-block; padding: 11px 24px; border-radius: 30px; font: 400 12px/1 Cinzel, serif; letter-spacing: .2em; text-transform: uppercase; color: #fffaf0; background: linear-gradient(135deg, #b8955a, #9a763d); text-decoration: none; box-shadow: 0 6px 16px rgba(120, 85, 35, .25); margin: 8px 4px 0; }
.zc-lace .zc-btn-g { background: transparent; color: #7a5a2e; box-shadow: inset 0 0 0 1px rgba(168, 132, 74, .8); }
.zc-lace .lc-item { margin: 16px 0 0; } .zc-lace .lc-item h3 { font: 400 11px/1.6 Cinzel, serif; letter-spacing: .24em; text-transform: uppercase; margin: 0 0 4px; color: var(--lc-gold); }
.zc-lace .lc-item p { margin: 2px 0; font-size: 17px; line-height: 1.5; } .zc-lace .lc-strong { font-weight: 600; font-size: 19px !important; }
.zc-lace .zc-map { margin: 18px 0 0; border-radius: 6px; overflow: hidden; height: 190px; box-shadow: inset 0 0 0 1px rgba(168, 132, 74, .4); }
.zc-lace .zc-mapph { width: 100%; height: 100%; border: 0; background: #f6eddc; color: #7a5a2e; font: 400 12px Cinzel, serif; letter-spacing: .14em; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; }
.zc-lace .zc-mapph svg { width: 26px; height: 26px; }
.zc-lace .zc-map iframe { width: 100%; height: 100%; border: 0; }
.zc-lace .lc-tl { list-style: none; margin: 14px auto 0; padding: 0; max-width: 340px; text-align: start; position: relative; }
.zc-lace .lc-tl::before { content: ''; position: absolute; top: 8px; bottom: 8px; inset-inline-start: 74px; width: 1px; background: linear-gradient(rgba(168, 132, 74, 0), rgba(168, 132, 74, .7), rgba(168, 132, 74, 0)); }
.zc-lace .lc-tl li { display: flex; align-items: center; gap: 14px; padding: 9px 0; }
.zc-lace .lc-tl time { width: 58px; flex: none; font: 600 18px 'Cormorant Garamond', serif; text-align: end; color: #7a5a2e; }
.zc-lace .lc-node { width: 9px; height: 9px; flex: none; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #fff4dc, #c49a58); box-shadow: 0 0 0 3px #fffaf0, 0 0 0 4px rgba(168, 132, 74, .45); position: relative; z-index: 1; }
.zc-lace .lc-tl span { font-size: 17px; }
/* the lace envelope with the verse / the love quote */
.zc-lace .lc-envsec { padding: 30px 14px 40px; }
.zc-lace .lc-env { position: relative; max-width: 470px; margin: 0 auto; padding: 0 9% 24%; }
.zc-lace .lc-env-img { position: absolute; left: 0; bottom: 0; width: 100%; height: auto; z-index: 0; }
.zc-lace .lc-vcard { position: relative; z-index: 1; margin-top: 4%; padding: 34px 22px 30px; background: #fffcf5; text-align: center; box-shadow: 0 10px 26px rgba(80, 55, 25, .18), inset 0 0 0 7px #fffcf5, inset 0 0 0 8px rgba(168, 132, 74, .55), inset 0 0 0 11px #fffcf5, inset 0 0 0 11.8px rgba(168, 132, 74, .35); transform: translateY(26px); transition: transform 1.4s cubic-bezier(.2, .7, .2, 1) .2s; }
.zc-lace .lc-env.in .lc-vcard { transform: none; }
.zc-lace .lc-acc-v { left: 50%; top: -48px; margin-left: -44px; width: 88px; }
.zc-lace .lc-vref { font: 400 11px/1.6 Cinzel, serif; letter-spacing: .2em; text-transform: uppercase; color: var(--lc-gold); margin: 6px 0 10px; }
.pi-l-ar.zc-lace .lc-vref { font: 700 15px Amiri, serif; letter-spacing: 0; }
.zc-lace .lc-verse { font: 400 22px/2 Amiri, 'Amiri Quran', serif; color: #5b4122; margin: 0 0 10px; direction: rtl; }
.zc-lace .lc-vtr { font: italic 500 15.5px/1.6 'Cormorant Garamond', serif; margin: 0; opacity: .9; }
.zc-lace .lc-quote { font: italic 500 23px/1.5 'Cormorant Garamond', serif; margin: 0 0 12px; color: #6b4f2a; }
.zc-lace .is-quote .lc-vtr { font: 400 30px 'Pinyon Script', cursive; color: #8a6634; font-style: normal; }
/* scratch section in lace */
.zc-lace .zc-scr { padding: 26px 16px 34px; }
.zc-lace .zc-scr-in { position: relative; max-width: 520px; margin: 0 auto; padding: 34px 18px 30px; background: var(--lc-paper); box-shadow: 0 14px 34px rgba(90, 62, 28, .14); }
.zc-lace .zc-scr-h { font: 400 42px/1.2 'Pinyon Script', cursive; color: #8a6634; margin: 0; font-weight: 400; }
.zc-lace .zc-scr-coin { box-shadow: inset 0 0 0 1px rgba(168, 132, 74, .6), inset 0 0 0 4px #fffdf8, inset 0 0 0 5px rgba(168, 132, 74, .35), 0 0 0 4px rgba(255, 252, 245, .9), 0 0 0 5px rgba(168, 132, 74, .25), 0 8px 18px rgba(80, 55, 25, .16); }
.zc-lace .zc-scr-v { font-family: 'Cormorant Garamond', serif; color: #7a5a2e; }
.zc-lace .zc-scr-cell small { font-family: Cinzel, serif; }
/* closing */
.zc-lace .lc-close { padding: 40px 20px 30px; text-align: center; }
.zc-lace .lc-closein { position: relative; padding-top: 70px; }
.zc-lace .lc-acc-c { left: 50%; top: -10px; margin-left: -60px; width: 120px; }
.zc-lace .lc-closing { font: italic 500 19px 'Cormorant Garamond', serif; margin: 0; }
.zc-lace .lc-sign { font: 400 46px/1.3 'Pinyon Script', cursive; color: #8a6634; margin: 4px 0 0; }
.zc-lace .lc-sign i { font-style: normal; font-size: .6em; padding: 0 .2em; color: var(--lc-gold2); }
.zc-lace .zc-form { text-align: start; max-width: 360px; margin: 16px auto 0; }
.zc-lace .zc-form input, .zc-lace .zc-form textarea, .zc-lace .zc-form select { border: 0; border-bottom: 1px solid rgba(168, 132, 74, .6); background: transparent; border-radius: 0; font: 400 17px 'Cormorant Garamond', serif; color: var(--lc-ink); }
.zc-lace .zc-sub { font: italic 16px 'Cormorant Garamond', serif; margin: 6px 0 0; }
.zc-lace .lc-thx { width: 160px; margin: 10px auto; color: var(--lc-gold); }
.zc-lace .zc-foot a { color: var(--lc-ink); opacity: .7; }
/* Arabic */
.pi-l-ar.zc-lace, .pi-l-ar.zc-lace .lc-msgt, .pi-l-ar.zc-lace .lc-item p, .pi-l-ar.zc-lace .lc-cdate, .pi-l-ar.zc-lace .lc-tl span { font-family: Amiri, serif; font-style: normal; }
.pi-l-ar.zc-lace .lc-pre, .pi-l-ar.zc-lace .lc-kick, .pi-l-ar.zc-lace .lc-item h3, .pi-l-ar.zc-lace .zc-cell span, .pi-l-ar.zc-lace .zc-btn { font-family: Amiri, serif; letter-spacing: 0; text-transform: none; font-size: 15px; }
.pi-l-ar.zc-lace .lc-names, .pi-l-ar.zc-lace .lc-h, .pi-l-ar.zc-lace .zc-scr-h, .pi-l-ar.zc-lace .lc-sign { font-family: 'Aref Ruqaa', serif; }
.pi-l-ar.zc-lace .lc-names { font-size: 52px; line-height: 1.35; } .pi-l-ar.zc-lace .lc-h, .pi-l-ar.zc-lace .zc-scr-h { font-size: 34px; }
.pi-l-ar.zc-lace .lc-quote { font-family: Amiri, serif; font-style: normal; font-size: 21px; }
.zc-lace .zc-n.is-ar { font-family: 'Aref Ruqaa', serif; font-size: .86em; }
.zc-lace .pi-l2 { display: block; font-size: .86em; opacity: .85; margin-top: 2px; }

/* couple photo / illustration in a lace oval */
.zc-lace .lc-pic { margin: 0; }
.zc-lace .lc-pic .zc-pic { width: 210px; max-width: 70%; aspect-ratio: 3 / 4; margin: 0 auto; border-radius: 50%; overflow: hidden; box-shadow: 0 0 0 6px #fffaf2, 0 0 0 7px rgba(168, 132, 74, .6), 0 0 0 12px #fffaf2, 0 0 0 13px rgba(168, 132, 74, .35), 0 12px 26px rgba(80, 55, 25, .2); }
.zc-lace .lc-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.zc-lace .zc-illu { --illu-bg: radial-gradient(ellipse at 50% 35%, #fffaf0, #efe0c6); --illu-ln: rgba(255, 250, 238, .55); }
.zc-lace .zc-illu { --cp1: #d8bd7f; --cp2: #b08c4f; --cp3: #7f5f2c; --cp4: #c9a766; }
.zc-lace .lc-p-photo { padding-bottom: 48px; }

.is-out .lcs-names { opacity: 0; transition: opacity .5s ease; }
.lcs-names::before { content: ''; position: absolute; left: -12%; right: -12%; top: -34%; bottom: -34%; z-index: -1; pointer-events: none; background: radial-gradient(closest-side, rgba(255, 251, 243, .72), rgba(255, 251, 243, .5) 55%, rgba(255, 251, 243, 0)); } /* soft local ivory glow so the live names read over the photo */
/* v1.8 gallery poster: the closed envelope, sized to the 390px poster box (no loader, no viewport units) */
.pi-poster .lcs-load { display: none; }
.pi-poster .lcs-stage { width: 390px; height: 866.67px; }

/* v3 ornate panels: cream cotton paper, a fine double gold hairline and four gold filigree corners (cut from our own card render) */
.zc-lace .lc-panel { background: #f6f0e5 url(lux/lace-paper.webp) center / 360px auto; box-shadow: 0 1px 0 rgba(255, 255, 255, .7) inset, 0 10px 28px -14px rgba(84, 60, 28, .35), 0 2px 6px rgba(84, 60, 28, .08); padding: 54px 30px 46px; }
.zc-lace .lc-panel::before, .zc-lace .lc-panel::after { display: none; }
.zc-lace .lc-lace { inset: 12px; border: 1px solid rgba(176, 138, 70, .55); }
.zc-lace .lc-lace::before { inset: 4px; border: .8px solid rgba(176, 138, 70, .4); }
.zc-lace .lc-co { position: absolute; width: 74px; height: 88px; background: url(lux/lace-gold-corner.webp) no-repeat center / contain; pointer-events: none; z-index: 1; }
.zc-lace .lc-co-tr { top: 6px; right: 6px; }
.zc-lace .lc-co-tl { top: 6px; left: 6px; transform: scaleX(-1); }
.zc-lace .lc-co-br { bottom: 6px; right: 6px; transform: scaleY(-1); }
.zc-lace .lc-co-bl { bottom: 6px; left: 6px; transform: scale(-1, -1); }
.zc-lace .lc-crest { display: block; width: 132px; height: 69px; margin: -18px auto 4px; background: url(lux/lace-gold-crest.webp) no-repeat center / contain; }
.zc-lace .lc-panel > *:not(.lc-co):not(.lc-lace):not(.lc-acc) { position: relative; z-index: 2; }
.zc-lace .lc-cv::before { background: radial-gradient(closest-side, rgba(250, 245, 236, .55), rgba(250, 245, 236, .3) 60%, rgba(250, 245, 236, 0)); }

/* v3: the white rose petals that keep drifting over the card — real petals (our own) at a size that reads, with a soft shadow baked into the image (no filter) */
.zc-lace .pi-fx .fx-lxwhite { width: 34px; height: 34px; background-image: url(lux/lace-petal-1.webp); opacity: .95; }
.zc-lace .pi-fx .fx-lxwhite:nth-child(3n) { background-image: url(lux/lace-petal-2.webp); width: 40px; height: 40px; }
.zc-lace .pi-fx .fx-lxwhite:nth-child(3n+1) { width: 28px; height: 28px; }
.zc-lace .pi-fx .fx-lxwhite:nth-child(5n) { background-image: url(lux/lace-petal-3.webp); }
.zc-lace .pi-fx .fx-lxwhite:nth-child(4n) { background-image: url(lux/lace-petal-2.webp); }

/* v3: the save-the-date coins and the verse card sit on the same cream paper with a fine gold double hairline */
.zc-lace .zc-scr-in, .zc-lace .lc-vcard { background: #f6f0e5 url(lux/lace-paper.webp) center / 360px auto; box-shadow: inset 0 0 0 10px #f6f0e5, inset 0 0 0 11px rgba(176, 138, 70, .55), inset 0 0 0 14px #f6f0e5, inset 0 0 0 14.8px rgba(176, 138, 70, .4), 0 10px 28px -14px rgba(84, 60, 28, .35); }
.zc-lace .zc-scr-in { padding: 40px 22px 34px; }

/* v1.9.2 polish: the cover pre-line sits comfortably inside the gold frame on narrow phones, and the names arrive sooner after the film */
.zc-lace .lc-pre { font-size: 10.5px; letter-spacing: .12em; max-width: 270px; margin-left: auto; margin-right: auto; text-wrap: balance; }
.pi.zc-lace .pi-intro { transition: opacity .6s ease, visibility .6s; }
/* the film's last half second already equals the plate: let the cover text rise over it instead of waiting for the film to end */
.pi.zc-lace.lc-early .pi-intro { opacity: 0; pointer-events: none; }
.pi.zc-lace.lc-early .pi-card { opacity: 1; transition: opacity .6s ease; } /* v1.9.3: the core keeps the card at opacity 0 until the film ends; let it come up with the early cue */
.pi.zc-lace.lc-early .lc-cover .pi-rv { opacity: 1; transform: none; }
.zc-lace .lc-cover .pi-rv { transition: opacity .6s ease, transform .75s cubic-bezier(.2,.75,.2,1); }
@media (prefers-reduced-motion: reduce) { .zc-lace .lc-cover .pi-rv { transition: opacity .4s !important; } }

/* --- lanterns.css --- */
/* ---------- NIGHT OF LANTERNS — ivory plaster horseshoe niches in teal zellige, gold voussoirs, brass lanterns ---------- */
.pi.zc-lanterns { --ink: #133d3e; --muted: #5f6f66; --acc: #a77a2a; --line: rgba(167,122,42,.38); --paper: #f4ead6; --foot: #fbf3e2;
  --g1: #fbeab0; --g2: #d8b062; --g3: #8f6a22; --g4: #f0d18a; --teal: #0f4a4a; --ivo: #f6eedd;
  --btn-bg: linear-gradient(180deg, #1c7a74, #0d4546); --btn-ink: #fbeab0; --btn-r: 3px;
  --illu-bg: radial-gradient(70% 60% at 50% 45%, #fff6dc, #ecdcb8); --illu-ln: rgba(15,74,74,.4); --map-r: 3px;
  --gold-ink: linear-gradient(100deg, #7a5717 0%, #b88a35 22%, #e2bd6a 38%, #9b7024 55%, #c99c45 74%, #6f4e15 100%);
  color: var(--ink); font-family: 'Cormorant Garamond', 'Amiri', serif; font-size: 19px; }
.pi-l-ar.zc-lanterns { font-family: 'Amiri', 'Cormorant Garamond', serif; font-size: 18px; }
.zc-lanterns .ln-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.zc-lanterns .ln-names .zc-n, .zc-lanterns .ln-h .zc-ht, .zc-lanterns .ln-sign, .zc-lanterns .zc-bism, .zc-lanterns .ln-strong { background-image: var(--gold-ink); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
.zc-lanterns .pi-sec { position: relative; }
/* the niche: a rectangular alfiz framing a horseshoe arch, set in teal zellige; ivory plaster inside */
.ln-w { max-width: 460px; margin: 0 auto; }
.ln-niche { position: relative; background: #0f4a4a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 44 44'%3E%3Crect width='44' height='44' fill='%230f4a4a'/%3E%3Cpath d='M22.0 8.5L26.0 12.5L31.5 12.5L31.5 18.0L35.5 22.0L31.5 26.0L31.5 31.5L26.0 31.5L22.0 35.5L18.0 31.5L12.5 31.5L12.5 26.0L8.5 22.0L12.5 18.0L12.5 12.5L18.0 12.5Z' fill='%23166a66' stroke='%23c9a24e' stroke-opacity='.75' stroke-width='.8'/%3E%3Cpath d='M24.3 16.5L25.2 18.8L27.5 19.7L26.6 22.0L27.5 24.3L25.2 25.2L24.3 27.5L22.0 26.6L19.7 27.5L18.8 25.2L16.5 24.3L17.4 22.0L16.5 19.7L18.8 18.8L19.7 16.5L22.0 17.4Z' fill='%23e9dcbf' fill-opacity='.85'/%3E%3Cpath d='M0.0 -13.5L4.0 -9.5L9.5 -9.5L9.5 -4.0L13.5 0.0L9.5 4.0L9.5 9.5L4.0 9.5L0.0 13.5L-4.0 9.5L-9.5 9.5L-9.5 4.0L-13.5 0.0L-9.5 -4.0L-9.5 -9.5L-4.0 -9.5Z' fill='%23166a66' stroke='%23c9a24e' stroke-opacity='.75' stroke-width='.8'/%3E%3Cpath d='M2.3 -5.5L3.2 -3.2L5.5 -2.3L4.6 0.0L5.5 2.3L3.2 3.2L2.3 5.5L0.0 4.6L-2.3 5.5L-3.2 3.2L-5.5 2.3L-4.6 0.0L-5.5 -2.3L-3.2 -3.2L-2.3 -5.5L-0.0 -4.6Z' fill='%23e9dcbf' fill-opacity='.85'/%3E%3Cpath d='M44.0 -13.5L48.0 -9.5L53.5 -9.5L53.5 -4.0L57.5 0.0L53.5 4.0L53.5 9.5L48.0 9.5L44.0 13.5L40.0 9.5L34.5 9.5L34.5 4.0L30.5 0.0L34.5 -4.0L34.5 -9.5L40.0 -9.5Z' fill='%23166a66' stroke='%23c9a24e' stroke-opacity='.75' stroke-width='.8'/%3E%3Cpath d='M46.3 -5.5L47.2 -3.2L49.5 -2.3L48.6 0.0L49.5 2.3L47.2 3.2L46.3 5.5L44.0 4.6L41.7 5.5L40.8 3.2L38.5 2.3L39.4 0.0L38.5 -2.3L40.8 -3.2L41.7 -5.5L44.0 -4.6Z' fill='%23e9dcbf' fill-opacity='.85'/%3E%3Cpath d='M0.0 30.5L4.0 34.5L9.5 34.5L9.5 40.0L13.5 44.0L9.5 48.0L9.5 53.5L4.0 53.5L0.0 57.5L-4.0 53.5L-9.5 53.5L-9.5 48.0L-13.5 44.0L-9.5 40.0L-9.5 34.5L-4.0 34.5Z' fill='%23166a66' stroke='%23c9a24e' stroke-opacity='.75' stroke-width='.8'/%3E%3Cpath d='M2.3 38.5L3.2 40.8L5.5 41.7L4.6 44.0L5.5 46.3L3.2 47.2L2.3 49.5L0.0 48.6L-2.3 49.5L-3.2 47.2L-5.5 46.3L-4.6 44.0L-5.5 41.7L-3.2 40.8L-2.3 38.5L-0.0 39.4Z' fill='%23e9dcbf' fill-opacity='.85'/%3E%3Cpath d='M44.0 30.5L48.0 34.5L53.5 34.5L53.5 40.0L57.5 44.0L53.5 48.0L53.5 53.5L48.0 53.5L44.0 57.5L40.0 53.5L34.5 53.5L34.5 48.0L30.5 44.0L34.5 40.0L34.5 34.5L40.0 34.5Z' fill='%23166a66' stroke='%23c9a24e' stroke-opacity='.75' stroke-width='.8'/%3E%3Cpath d='M46.3 38.5L47.2 40.8L49.5 41.7L48.6 44.0L49.5 46.3L47.2 47.2L46.3 49.5L44.0 48.6L41.7 49.5L40.8 47.2L38.5 46.3L39.4 44.0L38.5 41.7L40.8 40.8L41.7 38.5L44.0 39.4Z' fill='%23e9dcbf' fill-opacity='.85'/%3E%3Cpath d='M22 -5L27 0L22 5L17 0Z' fill='%230b3a3b' stroke='%23c9a24e' stroke-opacity='.6' stroke-width='.6'/%3E%3Cpath d='M0 17L5 22L0 27L-5 22Z' fill='%230b3a3b' stroke='%23c9a24e' stroke-opacity='.6' stroke-width='.6'/%3E%3Cpath d='M44 17L49 22L44 27L39 22Z' fill='%230b3a3b' stroke='%23c9a24e' stroke-opacity='.6' stroke-width='.6'/%3E%3Cpath d='M22 39L27 44L22 49L17 44Z' fill='%230b3a3b' stroke='%23c9a24e' stroke-opacity='.6' stroke-width='.6'/%3E%3C/svg%3E") 0 0 / 44px 44px repeat; border: 1px solid rgba(201,162,78,.9); box-shadow: 0 0 0 1px rgba(15,74,74,.5), 0 16px 30px -20px rgba(40,25,5,.65); padding-bottom: 8.5%; }
.ln-crown { position: absolute; left: 0; top: 0; width: 100%; height: auto; display: block; pointer-events: none; }
.ln-crown .ln-ivo { fill: #f6eedd; }
.ln-in { position: relative; margin: 0 8.5%; padding: 25% 7% 30px; text-align: center; box-sizing: border-box; }
.ln-in::before { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin-top: 87.5%; z-index: 0;
  background: linear-gradient(90deg, transparent 4px, rgba(201,162,78,.6) 4px, rgba(201,162,78,.6) 5px, transparent 5px, transparent calc(100% - 5px), rgba(201,162,78,.6) calc(100% - 5px), rgba(201,162,78,.6) calc(100% - 4px), transparent calc(100% - 4px)),
    linear-gradient(0deg, transparent 4px, rgba(201,162,78,.6) 4px, rgba(201,162,78,.6) 5px, transparent 5px), #f6eedd;
  border-left: 2px solid #c9a24e; border-right: 2px solid #c9a24e; border-bottom: 2px solid #c9a24e; }
.ln-in > * { position: relative; z-index: 1; }
/* cover */
.ln-cover { min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; justify-content: center; box-sizing: border-box; padding: 30px 12px 80px !important; }
.ln-big .ln-in { padding-top: 13%; }
.ln-pend { width: 46px; height: 80px; margin: 0 auto 4px; transform-origin: 50% 0; animation: ln-sway 5.5s ease-in-out infinite; }
.ln-lant { display: block; width: 100%; height: 100%; }
@keyframes ln-sway { 0%, 100% { transform: rotate(-3deg); } 50% { transform: rotate(3deg); } }
.zc-lanterns .zc-bism { font-family: 'Aref Ruqaa', 'Amiri', serif; font-weight: 700; font-size: 27px; line-height: 1.6; margin: 2px 0 4px; direction: rtl; }
.zc-lanterns .zc-guest { font-size: 17px; color: var(--muted); margin-bottom: 6px; font-style: italic; }
.zc-lanterns .zc-guest b { color: var(--ink); font-style: normal; }
.zc-lanterns .zc-pre, .zc-lanterns .zc-inv { font-family: 'Marcellus', serif; font-size: 12px; letter-spacing: .26em; text-transform: uppercase; color: #4c6a63; line-height: 1.85; }
.pi-l-ar.zc-lanterns .zc-pre, .pi-l-ar.zc-lanterns .zc-inv { font-family: 'Amiri', serif; font-size: 19px; letter-spacing: 0; text-transform: none; }
.zc-lanterns .zc-pre > .pi-l2, .zc-lanterns .zc-inv > .pi-l2 { font-family: 'Marcellus', serif; font-size: 10.5px; letter-spacing: .22em; text-transform: uppercase; font-style: normal; }
.ln-names { margin: 12px 0 2px; line-height: 1.08; }
.ln-names .zc-n { font-family: 'Parisienne', 'Great Vibes', cursive; font-weight: 400; font-size: clamp(46px, 13.5vw, 60px); padding: 0 .14em; display: inline-block; }
.ln-names .zc-n.is-ar { font-family: 'Aref Ruqaa', 'Amiri', serif; font-weight: 700; font-size: clamp(42px, 12.5vw, 56px); line-height: 1.5; padding: 0; }
.ln-amp { display: block; width: 26px; height: 26px; margin: 2px auto; }
.ln-amp svg, .ln-hs svg { display: block; width: 100%; height: 100%; }
.zc-lanterns .zc-names2 { font-family: 'Marcellus', serif; font-size: 15px; letter-spacing: .2em; color: var(--acc); margin: 4px 0 8px; text-transform: uppercase; }
.zc-lanterns .zc-names2.is-ar { font-family: 'Aref Ruqaa', serif; letter-spacing: 0; font-size: 24px; text-transform: none; }
.zc-lanterns .zc-parents { font-size: 16px; color: var(--muted); margin: 6px 0 10px; font-style: italic; }
.ln-div { margin: 14px auto 10px; max-width: 280px; }
.ln-band { display: block; width: 100%; height: auto; }
/* date: the day inside a teal khatam star */
.ln-date { display: grid; grid-template-columns: 1fr 96px 1fr; align-items: center; margin: 18px 0 4px; }
.ln-dw, .ln-dm { font-family: 'Marcellus', serif; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; padding: 8px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--ink); }
.ln-dm em { display: block; font-style: normal; color: var(--muted); font-size: 11px; margin-top: 2px; }
.pi-l-ar.zc-lanterns .ln-dw, .pi-l-ar.zc-lanterns .ln-dm { font-family: 'Amiri', serif; font-size: 17px; letter-spacing: 0; text-transform: none; }
.ln-dd { position: relative; width: 96px; height: 96px; display: flex; align-items: center; justify-content: center; }
.ln-kh { position: absolute; inset: 0; width: 100%; height: 100%; }
.ln-dd b { position: relative; font-family: 'Marcellus', serif; font-weight: 400; font-size: 36px; line-height: 1; color: #fbeab0; }
.ln-time { margin-top: 12px; }
.ln-time span { display: inline-block; font-family: 'Marcellus', serif; font-size: 12.5px; letter-spacing: .22em; text-transform: uppercase; color: #fbeab0; background: linear-gradient(180deg, #1c7a74, #0d4546); border: 1px solid #c9a24e; padding: 7px 16px 6px; border-radius: 30px; }
.pi-l-ar.zc-lanterns .ln-time span { font-family: 'Amiri', serif; font-size: 17px; letter-spacing: 0; padding: 4px 16px; }
/* sections */
.ln-sec { padding: 22px 12px !important; }
.ln-h { margin-bottom: 16px; }
.ln-hs { display: block; width: 34px; height: 34px; margin: 0 auto 8px; }
.ln-h .zc-ht { font-family: 'Marcellus', serif; font-weight: 400; font-size: 21px; letter-spacing: .16em; text-transform: uppercase; }
.pi-l-ar.zc-lanterns .ln-h .zc-ht { font-family: 'Reem Kufi', 'Amiri', serif; font-weight: 600; font-size: 26px; letter-spacing: 0; text-transform: none; line-height: 1.5; }
.zc-lanterns .ln-h .zc-ht > .pi-l2 { display: block; font-family: 'Cormorant Garamond', serif; font-size: 15px; letter-spacing: .06em; text-transform: none; font-style: italic; color: var(--muted); -webkit-text-fill-color: var(--muted); }
.ln-msgt { font-size: 20px; line-height: 1.65; font-style: italic; margin: 14px 0; color: var(--ink); }
.pi-l-ar.zc-lanterns .ln-msgt { font-style: normal; font-size: 19px; }
/* countdown: four brass lanterns, the numbers glowing in their glass */
.zc-lanterns .pi-cd { gap: 4px; justify-content: center; }
.zc-lanterns .zc-cell { position: relative; width: 62px; height: 118px; padding: 0 !important; box-sizing: border-box; background: none !important; }
.zc-lanterns .zc-cell .ln-cl { position: absolute; left: 3px; top: 0; width: 56px; height: 97px; }
.ln-halo { position: absolute; left: 50%; top: 50px; width: 70px; height: 70px; margin: -35px 0 0 -35px; border-radius: 50%; background: radial-gradient(circle, rgba(255,207,110,.55), rgba(255,207,110,0) 68%); animation: ln-glow 2.6s ease-in-out infinite; }
.zc-cell:nth-child(2) .ln-halo { animation-delay: -.7s; } .zc-cell:nth-child(3) .ln-halo { animation-delay: -1.4s; } .zc-cell:nth-child(4) .ln-halo { animation-delay: -2s; }
@keyframes ln-glow { 0%, 100% { opacity: .65; } 45% { opacity: 1; } 60% { opacity: .8; } }
.zc-lanterns .zc-cell b { position: absolute; left: 0; right: 0; top: 41px; text-align: center; font-family: 'Marcellus', serif; font-weight: 400; font-size: 19px; letter-spacing: -.02em; color: #3f2405; text-shadow: 0 0 6px rgba(255,246,210,.9); font-variant-numeric: tabular-nums; line-height: 1; }
.zc-lanterns .pi-cd span > .pi-l2 { display: none; }
.zc-lanterns .zc-cell span { position: absolute; bottom: 0; left: -4px; right: -4px; text-align: center; line-height: 1.2; font-family: 'Marcellus', serif; font-size: 9.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--ink); }
.pi-l-ar.zc-lanterns .zc-cell span { font-family: 'Amiri', serif; font-size: 13px; letter-spacing: 0; }
.zc-lanterns .pi-past { margin-top: 12px; font-style: italic; }
/* details */
.ln-item { padding: 18px 0; border-top: 1px dashed rgba(167,122,42,.45); }
.ln-item:first-of-type { border-top: 0; padding-top: 2px; }
.ln-item h3 { font-family: 'Marcellus', serif; font-size: 12px; letter-spacing: .28em; text-transform: uppercase; color: #3f7a73; font-weight: 400; margin-bottom: 8px; }
.pi-l-ar.zc-lanterns .ln-item h3 { font-family: 'Reem Kufi', 'Amiri', serif; font-size: 18px; font-weight: 500; letter-spacing: 0; text-transform: none; }
.ln-item p { line-height: 1.55; }
.ln-strong { font-size: 22px; font-weight: 600; }
.ln-fount { display: block; width: 110px; height: auto; margin: 2px auto 10px; }
.zc-lanterns .zc-btn { color: var(--teal); border-color: rgba(15,74,74,.7); }
.zc-lanterns .zc-btn-g { color: #7a5717; border-color: #c9a24e; }
.zc-lanterns .zc-btn-solid { color: var(--btn-ink); letter-spacing: .24em; border: 1px solid #c9a24e; }
.pi.zc-lanterns .zc-map { background: #efe4cc; border: 1px solid #c9a24e; color: var(--teal); }
/* programme: each hour inside a little horseshoe window */
.zc-lanterns .ln-tl { position: relative; max-width: 330px; margin: 0 auto; text-align: start; }
.zc-lanterns .ln-tl li:not(:last-child) time::after { content: ""; position: absolute; left: 50%; top: 100%; height: 18px; border-left: 1px dashed #c9a24e; }
.ln-tl span > .pi-l2, .ln-item p > .pi-l2, .ln-msgt > .pi-l2, .ln-closing > .pi-l2, .ln-cap > .pi-l2 { font-family: 'Cormorant Garamond', serif; font-style: italic; color: var(--muted); }
.ln-dw > .pi-l2, .ln-dm > .pi-l2 { display: block; font-size: 10px; letter-spacing: .18em; opacity: .75; margin-top: 2px; font-family: 'Marcellus', serif; }
.ln-time span > .pi-l2 { display: block; margin-top: 1px; font-family: 'Marcellus', serif; font-size: .8em; opacity: .85; }
.zc-lanterns .ln-tl li { position: relative; display: grid; grid-template-columns: 62px 1fr; align-items: center; column-gap: 14px; padding: 8px 0; }
.zc-lanterns .ln-tl time { grid-column: 1; grid-row: 1; position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; width: 62px; height: 56px; padding-top: 10px; box-sizing: border-box; font-family: 'Marcellus', serif; font-size: 15px; color: #fbeab0;
  background: linear-gradient(180deg, #1c7a74, #0d4546); border: 1.5px solid #c9a24e; border-radius: 31px 31px 4px 4px / 34px 34px 4px 4px; box-shadow: inset 0 0 0 3px #0f4a4a, inset 0 0 0 4px rgba(201,162,78,.6); }
.zc-lanterns .ln-tl .ln-nd { display: none; }
.zc-lanterns .ln-tl li > span { grid-column: 2; grid-row: 1; font-size: 19px; line-height: 1.35; }
/* photo (optional) and gallery */
.ln-pic { width: 210px; max-width: 74%; margin: 0 auto; padding: 6px; border: 1.5px solid #c9a24e; border-radius: 120px 120px 4px 4px; background: #0f4a4a; }
.ln-pic .zc-portrait { margin: 0; }
.ln-pic .zc-pic { aspect-ratio: 3 / 4; border-radius: 114px 114px 2px 2px; }
.ln-cap { margin-top: 14px; font-style: italic; color: var(--muted); }
.ln-gal figure { border: 1px solid #c9a24e; padding: 3px; box-sizing: border-box; background: #fbf5e8; border-radius: 40px 40px 2px 2px; overflow: hidden; }
.ln-gal figure img { border-radius: 37px 37px 0 0; }
/* RSVP on plaster */
.zc-lanterns .pi-form label > span, .zc-lanterns .pi-form legend { font-family: 'Marcellus', serif; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: #3f7a73; }
.pi-l-ar.zc-lanterns .pi-form label > span, .pi-l-ar.zc-lanterns .pi-form legend { font-family: 'Amiri', serif; font-size: 16px; letter-spacing: 0; text-transform: none; }
.zc-lanterns .pi-form input, .zc-lanterns .pi-form select, .zc-lanterns .pi-form textarea { color: var(--ink); background: #fffaf0; border: 1px solid rgba(15,74,74,.35); border-bottom: 2px solid #c9a24e; border-radius: 3px; }
.zc-lanterns .pi-seg label > span { border-radius: 3px; border-color: rgba(15,74,74,.45); color: var(--ink); }
.zc-lanterns .pi-seg input:checked + span, .zc-lanterns .pi-seg input:checked + span .pi-l2 { background: #0f4a4a; color: #fbeab0; border-color: #c9a24e; }
.zc-lanterns .zc-sub { color: var(--muted); }
.zc-lanterns .pi-seg label > span > span, .zc-lanterns .pi-seg .pi-l2 { display: block; border: 0 !important; background: none !important; padding: 0 !important; margin-top: 2px; color: inherit; box-shadow: none !important; }
/* closing: a gilded arcade over an ivory plaster ledge */
.ln-close { padding: 26px 12px 18px !important; }
.ln-closein { max-width: 400px; margin: 0 auto; text-align: center; }
.ln-arc3 { display: block; width: 78%; height: auto; margin: 0 auto -1px; }
.ln-closeb { background: #0f4a4a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 44 44'%3E%3Crect width='44' height='44' fill='%230f4a4a'/%3E%3Cpath d='M22.0 8.5L26.0 12.5L31.5 12.5L31.5 18.0L35.5 22.0L31.5 26.0L31.5 31.5L26.0 31.5L22.0 35.5L18.0 31.5L12.5 31.5L12.5 26.0L8.5 22.0L12.5 18.0L12.5 12.5L18.0 12.5Z' fill='%23166a66' stroke='%23c9a24e' stroke-opacity='.75' stroke-width='.8'/%3E%3Cpath d='M24.3 16.5L25.2 18.8L27.5 19.7L26.6 22.0L27.5 24.3L25.2 25.2L24.3 27.5L22.0 26.6L19.7 27.5L18.8 25.2L16.5 24.3L17.4 22.0L16.5 19.7L18.8 18.8L19.7 16.5L22.0 17.4Z' fill='%23e9dcbf' fill-opacity='.85'/%3E%3Cpath d='M0.0 -13.5L4.0 -9.5L9.5 -9.5L9.5 -4.0L13.5 0.0L9.5 4.0L9.5 9.5L4.0 9.5L0.0 13.5L-4.0 9.5L-9.5 9.5L-9.5 4.0L-13.5 0.0L-9.5 -4.0L-9.5 -9.5L-4.0 -9.5Z' fill='%23166a66' stroke='%23c9a24e' stroke-opacity='.75' stroke-width='.8'/%3E%3Cpath d='M2.3 -5.5L3.2 -3.2L5.5 -2.3L4.6 0.0L5.5 2.3L3.2 3.2L2.3 5.5L0.0 4.6L-2.3 5.5L-3.2 3.2L-5.5 2.3L-4.6 0.0L-5.5 -2.3L-3.2 -3.2L-2.3 -5.5L-0.0 -4.6Z' fill='%23e9dcbf' fill-opacity='.85'/%3E%3Cpath d='M44.0 -13.5L48.0 -9.5L53.5 -9.5L53.5 -4.0L57.5 0.0L53.5 4.0L53.5 9.5L48.0 9.5L44.0 13.5L40.0 9.5L34.5 9.5L34.5 4.0L30.5 0.0L34.5 -4.0L34.5 -9.5L40.0 -9.5Z' fill='%23166a66' stroke='%23c9a24e' stroke-opacity='.75' stroke-width='.8'/%3E%3Cpath d='M46.3 -5.5L47.2 -3.2L49.5 -2.3L48.6 0.0L49.5 2.3L47.2 3.2L46.3 5.5L44.0 4.6L41.7 5.5L40.8 3.2L38.5 2.3L39.4 0.0L38.5 -2.3L40.8 -3.2L41.7 -5.5L44.0 -4.6Z' fill='%23e9dcbf' fill-opacity='.85'/%3E%3Cpath d='M0.0 30.5L4.0 34.5L9.5 34.5L9.5 40.0L13.5 44.0L9.5 48.0L9.5 53.5L4.0 53.5L0.0 57.5L-4.0 53.5L-9.5 53.5L-9.5 48.0L-13.5 44.0L-9.5 40.0L-9.5 34.5L-4.0 34.5Z' fill='%23166a66' stroke='%23c9a24e' stroke-opacity='.75' stroke-width='.8'/%3E%3Cpath d='M2.3 38.5L3.2 40.8L5.5 41.7L4.6 44.0L5.5 46.3L3.2 47.2L2.3 49.5L0.0 48.6L-2.3 49.5L-3.2 47.2L-5.5 46.3L-4.6 44.0L-5.5 41.7L-3.2 40.8L-2.3 38.5L-0.0 39.4Z' fill='%23e9dcbf' fill-opacity='.85'/%3E%3Cpath d='M44.0 30.5L48.0 34.5L53.5 34.5L53.5 40.0L57.5 44.0L53.5 48.0L53.5 53.5L48.0 53.5L44.0 57.5L40.0 53.5L34.5 53.5L34.5 48.0L30.5 44.0L34.5 40.0L34.5 34.5L40.0 34.5Z' fill='%23166a66' stroke='%23c9a24e' stroke-opacity='.75' stroke-width='.8'/%3E%3Cpath d='M46.3 38.5L47.2 40.8L49.5 41.7L48.6 44.0L49.5 46.3L47.2 47.2L46.3 49.5L44.0 48.6L41.7 49.5L40.8 47.2L38.5 46.3L39.4 44.0L38.5 41.7L40.8 40.8L41.7 38.5L44.0 39.4Z' fill='%23e9dcbf' fill-opacity='.85'/%3E%3Cpath d='M22 -5L27 0L22 5L17 0Z' fill='%230b3a3b' stroke='%23c9a24e' stroke-opacity='.6' stroke-width='.6'/%3E%3Cpath d='M0 17L5 22L0 27L-5 22Z' fill='%230b3a3b' stroke='%23c9a24e' stroke-opacity='.6' stroke-width='.6'/%3E%3Cpath d='M44 17L49 22L44 27L39 22Z' fill='%230b3a3b' stroke='%23c9a24e' stroke-opacity='.6' stroke-width='.6'/%3E%3Cpath d='M22 39L27 44L22 49L17 44Z' fill='%230b3a3b' stroke='%23c9a24e' stroke-opacity='.6' stroke-width='.6'/%3E%3C/svg%3E") 0 0 / 44px 44px repeat; border: 1px solid #c9a24e; padding: 8px; }
.ln-closeb > div { background: #f6eedd; margin: 0; box-shadow: inset 0 0 0 4px #f6eedd, inset 0 0 0 5px rgba(201,162,78,.55); }
.ln-closing { font-style: italic; font-size: 19px; padding: 20px 18px 4px; color: var(--ink); }
.ln-sign { font-family: 'Parisienne', 'Great Vibes', cursive; font-size: 40px; line-height: 1.35; padding: 0 12px 16px; }
.ln-sign i { font-style: normal; font-family: 'Cormorant Garamond', serif; font-size: .55em; }
.pi-l-ar.zc-lanterns .ln-sign { font-family: 'Aref Ruqaa', 'Amiri', serif; font-size: 32px; }
.zc-lanterns .pi-cue { border-color: #fbeab0; }
.zc-lanterns .zc-foot a, .zc-lanterns .zc-foot b { color: #fbf3e2; text-shadow: 0 1px 6px rgba(40,25,5,.6); }
/* entrance: the niche rises out of the warm light; headings' stars turn into place (transform/opacity only, small elements) */
.zc-lanterns .ln-niche.pi-rv { transform: translate3d(0, 30px, 0); transition: opacity 1.05s ease, transform 1.15s cubic-bezier(.2,.75,.2,1); }
.zc-lanterns .ln-niche.pi-rv.in { transform: none; }
.zc-lanterns .ln-h.pi-rv .ln-hs { transform: rotate(-45deg) scale(.6); opacity: 0; transition: transform 1.2s cubic-bezier(.2,.8,.2,1) .25s, opacity .8s ease .25s; }
.zc-lanterns .ln-h.pi-rv.in .ln-hs { transform: none; opacity: 1; }
@media (prefers-reduced-motion: reduce) { .zc-lanterns .pi-rv, .zc-lanterns .ln-niche.pi-rv { transform: none; } .ln-pend, .ln-halo { animation: none; } }

/* optional initials (mono_on): a small teal enamel medallion hung on the centre lantern's glass (one small static layer) */
.lxv-lanterns .lxm { aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center; border-radius: 50%; box-sizing: border-box;
  background: radial-gradient(circle at 40% 35%, #1f827b, #0d4243 70%); border: 1.5px solid #e2bd6a; box-shadow: 0 0 0 2px rgba(15,60,60,.55), 0 0 12px 2px rgba(255,196,96,.55); }
.lxv-lanterns .lxm span { background: linear-gradient(170deg, #fff6d8 0%, #f0d38c 45%, #c99a45 70%, #fbe7b0 100%); -webkit-background-clip: text; background-clip: text; text-shadow: none; transform: translateY(.04em); }

/* --- letter.css --- */
/* THE SEALED LETTER — live envelope (stills + transform/opacity) and its letterpress stationery card. © Proclick */
.pi-in-letter { background: transparent; }
.ltr { position: absolute; inset: 0; }
.ltr-stage { position: absolute; inset: 0; opacity: 0; transform: translateY(16px); transition: opacity .9s ease, transform 1.1s cubic-bezier(.2,.7,.25,1); }
.ltr-ready .ltr-stage { opacity: 1; transform: none; }
.ltr-env { position: absolute; left: 50%; top: 45.6%; width: min(92cqw, 40.47cqh, 460px); aspect-ratio: 1000 / 2150; transform: translate(-50%, -50%); }
.ltr-cam { position: absolute; inset: 0; transform-origin: 50% 50%; }
.ltr-l { position: absolute; display: block; max-width: none; -webkit-user-drag: none; user-select: none; pointer-events: none; }
/* tall portrait stills (1000 x 2150 body units); boxes include each still's soft shadow margin */
.ltr-back  { left: -7%; top: -2.3256%; width: 114%; height: 107.907%; z-index: 1; }
.ltr-flapo { left: -3%; top: -54.884%; width: 106%; height: 56.279%; z-index: 2; transform-origin: 50% 97.521%; transform: scaleY(0); visibility: hidden; }
.ltr-cardw { left: 1%; top: 0%; width: 98%; height: 102.326%; z-index: 3; transform-origin: 0 0; }
.ltr-card  { display: block; width: 100%; height: 100%; }
.ltr-front { left: -3%; top: -.9302%; width: 106%; height: 102.791%; z-index: 4; }
.ltr-sweep { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 5; overflow: hidden; pointer-events: none; }
.ltr-sweep i { position: absolute; left: 0; top: 0; width: 100%; height: 46%; opacity: 0; transform: translateY(-100%);
  background: linear-gradient(180deg, rgba(24,14,6,0) 0%, rgba(24,14,6,.26) 42%, rgba(24,14,6,.14) 64%, rgba(24,14,6,0) 100%); }
.ltr-flapc { left: -4%; top: -.9302%; width: 108%; height: 57.674%; z-index: 6; transform-origin: 50% 1.613%; }
.ltr-sealbox { position: absolute; left: 25%; top: 36%; width: 50%; height: 26%; z-index: 8; cursor: pointer; outline: none; -webkit-tap-highlight-color: transparent; }
.ltr .ltr-seal { z-index: 7; }
.ltr .ltr-seal .lxs-h img { filter: none; }
.ltr.is-crack .ltr-seal .lxs-halo, .is-crack .ltr-seal .lxs-halo { animation: none; opacity: 0; }
.is-flap2 .ltr-seal { opacity: 0; transition: opacity .3s ease; }
/* the opening (all eased, transform/opacity only):
   camera eases back so the open flap has room → flap folds up at its hinge (closed still → open still at the fold) with a soft
   shadow sweeping down the body → card rises out of the pocket → envelope drops away as the card grows onto the inner card's first sheet */
.is-cam .ltr-cam { transform: translateY(17cqh) scale(.56); transition: transform 1.9s cubic-bezier(.45,.05,.25,1); }
.is-flap .ltr-flapc { transform: scaleY(0); transition: transform .62s cubic-bezier(.5,0,.8,.45); }
.is-flap .ltr-sweep i { animation: ltrSweep 1.35s cubic-bezier(.4,0,.3,1) forwards; }
@keyframes ltrSweep { 0% { opacity: 0; transform: translateY(-100%); } 25% { opacity: 1; } 70% { opacity: .6; } 100% { opacity: 0; transform: translateY(150%); } }
.is-flap2 .ltr-flapc { visibility: hidden; }
.is-flap2 .ltr-flapo { visibility: visible; transform: scaleY(1); transition: transform .78s cubic-bezier(.15,.6,.3,1); }
.is-card .ltr-cardw { transform: translateY(-50%); transition: transform 1.55s cubic-bezier(.42,.05,.22,1); }
.is-drop .ltr-sink { transform: translateY(130cqh); opacity: 0; transition: transform 1s cubic-bezier(.45,0,.7,.45), opacity .45s ease .3s; }
.is-drop .ltr-flapo { transform: translateY(130cqh) scaleY(1); }
.is-drop .ltr-sweep { opacity: 0; }
.ltr.is-grow .ltr-cardw, .is-grow .ltr-cardw { transition: transform 1.3s cubic-bezier(.55,0,.2,1); }
/* hand-off: keep the intro (its card still sits exactly on the first sheet) until the real card is in, then fade it quickly */
.pi-intro.pi-in-letter.is-done { transition: opacity .45s ease .95s, visibility 0s linear 1.4s; }
.ltr-load { position: absolute; left: 50%; top: 50%; width: 44px; height: 44px; margin: -22px; transition: opacity .5s; pointer-events: none; }
.ltr-load i { position: absolute; inset: 0; border-radius: 50%; border: 1px solid rgba(214,180,110,.25); border-top-color: #d6b46e; animation: ltrSpin 1s linear infinite; }
.ltr-ready .ltr-load { opacity: 0; visibility: hidden; }
@keyframes ltrSpin { to { transform: rotate(360deg); } }
.pi-in-letter .pi-hint { bottom: max(2.4%, 10px); }
.pi-in-letter .pi-hint-t { text-shadow: 0 1px 2px rgba(20,12,6,.55), 0 0 14px rgba(20,12,6,.45); }
.ltr-tap { display: block; width: 8px; height: 8px; margin: 10px auto 0; border-radius: 50%; background: #e9cf8c; opacity: .7; animation: ltrTap 1.8s ease-in-out infinite; }
@keyframes ltrTap { 0%, 100% { transform: scale(.7); opacity: .35; } 50% { transform: scale(1.15); opacity: .9; } }
/* white butterflies */
.ltr-bfs { position: absolute; left: 50%; top: 8%; width: 0; height: 0; z-index: 8; pointer-events: none; }
.ltr-bf { position: absolute; top: 0; width: calc(42px * var(--s)); height: calc(32px * var(--s)); margin: calc(-16px * var(--s)) 0 0 calc(-21px * var(--s)); opacity: 0; visibility: hidden; }
.is-bf .ltr-bf { visibility: visible; animation: ltrFly var(--du) cubic-bezier(.33,.12,.6,1) var(--dl) forwards; }
.ltr-bw { position: absolute; inset: 0; transform: rotate(var(--r)); }
.ltr-w { position: absolute; top: 0; bottom: 0; width: 50%; background: url(lux/bf-white.webp) no-repeat; background-size: 200% 100%; }
.is-bf .ltr-w { animation: ltrBeat var(--fl) ease-in-out infinite alternate; }
.ltr-wl { left: 0; background-position: 0 50%; transform-origin: 100% 50%; }
.ltr-wr { right: 0; background-position: 100% 50%; transform-origin: 0 50%; }
@keyframes ltrBeat { from { transform: scaleX(1); } to { transform: scaleX(.3); } }
@keyframes ltrFly { 0% { opacity: 0; transform: translate(0, 0) scale(.35); } 12% { opacity: 1; } 50% { transform: translate(var(--mx), var(--my)) scale(.85); } 82% { opacity: 1; } 100% { opacity: 0; transform: translate(var(--x), var(--y)) scale(1); } }
@media (prefers-reduced-motion: reduce) { .ltr-bf { display: none; } }

/* ---------- the inner card: letterpress stationery suite ---------- */
.pi.zc-letter { --ink: #2c2b33; --muted: #75705f; --acc: #a8833a; --line: rgba(168,131,58,.42); --paper: #fbf7ef; --foot: #fff;
  --btn-r: 0; --btn-bg: #2c2b33; --btn-ink: #f4e9cf; --map-r: 0;
  --illu-bg: radial-gradient(60% 55% at 50% 45%, #fffdf8, #efe7d8); --illu-ln: rgba(255,255,255,.5);
  --gold-grad: linear-gradient(100deg, #7d5a1c 0%, #c39a48 20%, #f3dc9a 33%, #c7983f 47%, #8c6522 62%, #d9b25e 78%, #f2dc9e 88%, #a67a2a 100%);
  color: var(--ink); font-family: 'Cormorant Garamond', 'Amiri', serif; font-size: 19px; }
.pi-l-ar.zc-letter { font-family: 'Amiri', 'Cormorant Garamond', serif; }
.zc-letter .pi-card { padding: 28px 14px 0; }
.zl-suite { max-width: 450px; margin: 0 auto; display: flex; flex-direction: column; gap: 22px; }
.zl-sheet { position: relative; margin: 0; padding: 46px 12% 42px !important; text-align: center; background: #fbf7ef url(lux/ltr-paper.webp) 0 0 / 320px 320px; box-shadow: 0 1px 0 rgba(255,255,255,.6) inset, 0 26px 44px -26px rgba(20,14,8,.6), 0 3px 8px -4px rgba(20,14,8,.35); }
.zl-frame { position: absolute; inset: 12px; border: 1px solid var(--line); pointer-events: none; }
.zl-frame::after { content: ''; position: absolute; inset: 4px; border: .5px solid rgba(168,131,58,.28); }
.zl-main { padding-top: 40px !important; padding-bottom: 60px !important; }
.zl-vellum { background: rgba(252,250,245,.86); }
.zl-vellum .zl-frame { inset: 10px; border-style: dashed; border-color: rgba(168,131,58,.3); }
.zc-letter .zc-names .zc-n, .zc-letter .zl-dmy b, .zc-letter .zl-h .zc-ht, .zc-letter .zl-mi { background-image: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
/* monogram in a fine gold wreath (pressed, letterpress) */
.zl-mono { position: relative; width: 112px; height: 112px; margin: 0 auto 18px; }
.zl-wreath { position: absolute; inset: 0; width: 100%; height: 100%; }
.zl-mi { direction: ltr; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 1px; font-family: 'Cinzel', serif; font-size: 26px; letter-spacing: .02em; line-height: 1; }
.zl-mi em { font-family: 'Pinyon Script', cursive; font-style: normal; font-size: 22px; margin: 0 3px; }
.zl-mono.is-ar .zl-mi { direction: rtl; font-family: 'Aref Ruqaa', 'Amiri', serif; font-weight: 700; font-size: 30px; }
.zc-letter .zc-bism { font-family: 'Amiri', serif; font-weight: 700; font-size: 23px; color: var(--acc); margin-bottom: 10px; direction: rtl; }
.zc-letter .zc-guest { font-style: italic; color: var(--muted); margin-bottom: 8px; }
.zc-letter .zc-pre, .zc-letter .zc-inv { font-family: 'Cinzel', serif; font-size: 11px; letter-spacing: .3em; text-transform: uppercase; color: var(--muted); line-height: 1.9; }
.pi-l-ar.zc-letter .zc-pre, .pi-l-ar.zc-letter .zc-inv { font-family: 'Amiri', serif; font-size: 19px; letter-spacing: 0; text-transform: none; line-height: 1.7; }
.zc-letter .zc-pre > .pi-l2, .zc-letter .zc-inv > .pi-l2 { font-family: 'Cormorant Garamond', serif; font-style: italic; text-transform: none; letter-spacing: .02em; font-size: 15px; }
.zl-names { margin: 18px 0 10px; line-height: 1.02; }
.zl-names .zc-n { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: clamp(44px, 12.5vw, 58px); letter-spacing: .14em; text-transform: uppercase; padding-inline-start: .14em; }
.zl-names .zc-n.is-ar { font-family: 'Amiri', serif; font-weight: 700; font-size: clamp(46px, 13vw, 60px); letter-spacing: 0; padding: 0; line-height: 1.5; text-transform: none; }
.zl-names .zc-amp { font-family: 'Pinyon Script', cursive; font-size: 40px; color: var(--acc); margin: -2px 0 2px; line-height: 1; }
.zl-names .zc-amp i { font-style: normal; }
.zc-letter .zc-names2 { font-family: 'Cinzel', serif; font-size: 14px; letter-spacing: .32em; text-transform: uppercase; color: var(--acc); margin-bottom: 10px; }
.zc-letter .zc-names2.is-ar { font-family: 'Amiri', serif; font-size: 22px; letter-spacing: 0; }
.zc-letter .zc-names2 i { font-style: normal; font-family: 'Pinyon Script', cursive; text-transform: none; }
.zc-letter .zc-parents { font-style: italic; color: var(--muted); font-size: 17px; margin: 4px 0 8px; }
.zl-rule { display: block; position: relative; width: 150px; height: 9px; margin: 22px auto; }
.zl-rule::before, .zl-rule::after { content: ''; position: absolute; top: 4px; width: 62px; height: 1px; background: var(--line); }
.zl-rule::before { left: 0; } .zl-rule::after { right: 0; }
.zl-rule b { position: absolute; left: 50%; top: 0; width: 7px; height: 7px; margin-left: -4.5px; border: 1px solid var(--acc); transform: rotate(45deg); }
.zl-date { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.zl-dow { font-family: 'Cinzel', serif; font-size: 12px; letter-spacing: .4em; text-transform: uppercase; color: var(--muted); }
.pi-l-ar.zc-letter .zl-dow { font-family: 'Amiri', serif; font-size: 18px; letter-spacing: 0; }
.zl-dmy { display: flex; align-items: center; gap: 14px; }
.zl-dmy span { font-family: 'Cinzel', serif; font-size: 12px; letter-spacing: .26em; text-transform: uppercase; min-width: 74px; padding: 6px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.pi-l-ar.zc-letter .zl-dmy span { font-family: 'Amiri', serif; font-size: 17px; letter-spacing: 0; }
.zl-dmy b { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 58px; line-height: 1; }
.zl-dmy .pi-l2, .zl-dow .pi-l2 { display: block; font-size: 9px; opacity: .7; margin-top: 2px; letter-spacing: .18em; font-family: 'Cinzel', serif; }
.zl-at { font-style: italic; color: var(--muted); }
.zl-at > .pi-l2 { display: inline; margin: 0 .4em; }
.zl-place { margin-top: 18px; font-family: 'Cinzel', serif; font-size: 13px; letter-spacing: .26em; text-transform: uppercase; color: var(--ink); line-height: 1.7; }
.zl-place span { display: block; font-family: 'Cormorant Garamond', serif; font-style: italic; text-transform: none; letter-spacing: .02em; font-size: 16px; color: var(--muted); }
.pi-l-ar.zc-letter .zl-place { font-family: 'Amiri', serif; font-size: 18px; letter-spacing: 0; }
.zc-letter .pi-cue { bottom: 20px; }
.zl-h { margin-bottom: 18px; }
.zl-h .zc-ht { display: block; font-family: 'Cinzel', serif; font-weight: 400; font-size: 15px; letter-spacing: .34em; text-transform: uppercase; line-height: 1.6; padding-inline-start: .34em; }
.pi-l-ar.zc-letter .zl-h .zc-ht { font-family: 'Amiri', serif; font-weight: 700; font-size: 25px; letter-spacing: 0; padding: 0; }
.zl-h .zc-ht > .pi-l2 { font-family: 'Cormorant Garamond', serif; font-size: 15px; letter-spacing: .04em; text-transform: none; -webkit-text-fill-color: var(--muted); color: var(--muted); padding: 0; }
.zl-h::after { content: ''; display: block; width: 46px; height: 1px; margin: 12px auto 0; background: var(--acc); box-shadow: 0 4px 0 -0px rgba(168,131,58,.35); }
.zl-quote { font-size: 21px; line-height: 1.7; font-style: italic; }
.pi-l-ar.zc-letter .zl-quote { font-style: normal; font-size: 21px; }
.zl-quote > .pi-l2 { color: var(--muted); }
.zl-sig { margin-top: 16px; font-family: 'Pinyon Script', cursive; font-size: 30px; color: var(--acc); }
.pi-l-ar.zc-letter .zl-sig { font-family: 'Aref Ruqaa', 'Amiri', serif; font-size: 25px; }
.zl-cap { font-family: 'Cinzel', serif; font-size: 11px; letter-spacing: .32em; text-transform: uppercase; color: var(--muted); margin-top: 16px; }
.pi-l-ar.zc-letter .zl-cap { font-family: 'Amiri', serif; font-size: 17px; letter-spacing: 0; }
.zl-pic .zc-pic { width: 200px; aspect-ratio: 4 / 5; margin: 0 auto; border: 8px solid #fffdf8; outline: 1px solid var(--line); box-shadow: 0 14px 26px -16px rgba(30,20,10,.55); }
.zl-count .pi-cd { gap: 0; }
.zl-count .zc-cell { flex: 1; max-width: 76px; padding: 4px 0 !important; }
.zl-count .zc-cell + .zc-cell { border-inline-start: 1px solid var(--line) !important; }
.zl-count .pi-cd b { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 38px; color: var(--ink); line-height: 1.1; }
.zl-count .pi-cd span { font-family: 'Cinzel', serif; font-size: 9px; letter-spacing: .24em; text-transform: uppercase; color: var(--acc); }
.pi-l-ar.zc-letter .zl-count .pi-cd span { font-family: 'Amiri', serif; font-size: 14px; letter-spacing: 0; }
.zl-count .pi-cd span > .pi-l2 { display: none; }
.zl-item { padding: 14px 0; }
.zl-item + .zl-item { border-top: 1px solid var(--line); }
.zl-item h3 { font-family: 'Cinzel', serif; font-weight: 400; font-size: 10.5px; letter-spacing: .34em; text-transform: uppercase; color: var(--acc); margin-bottom: 6px; }
.pi-l-ar.zc-letter .zl-item h3 { font-family: 'Amiri', serif; font-weight: 700; font-size: 17px; letter-spacing: 0; }
.zl-item h3 > .pi-l2 { font-size: 9.5px; }
.zl-strong { font-size: 21px; font-weight: 600; }
.zc-letter .zc-btn { color: var(--ink); border: 1px solid var(--ink); background: transparent; }
.zc-letter .zc-btn-solid { color: var(--btn-ink); background: var(--btn-bg); border-color: var(--btn-bg); }
.zc-letter .zl-map { border: 1px solid var(--line); }
.zl-tl { text-align: center; }
.zl-tl li { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 12px 0; position: relative; }
.zl-tl li + li { padding-top: 22px; }
.zl-tl .zl-dot { position: absolute; top: 0; left: 50%; width: 5px; height: 5px; margin-left: -2.5px; background: var(--acc); transform: rotate(45deg); }
.zl-tl li:first-child .zl-dot { display: none; }
.zl-tl time { order: -1; font-family: 'Cinzel', serif; font-size: 13px; letter-spacing: .2em; color: var(--acc); }
.zl-tl span { font-size: 20px; line-height: 1.35; }
.zl-tl span > .pi-l2 { display: block; font-style: italic; color: var(--muted); font-size: 16px; }
.zl-reply { max-width: 92%; align-self: center; padding-top: 54px !important; background: #f6efe2 url(lux/ltr-paper.webp) 0 0 / 320px 320px; }
.zl-notch { position: absolute; left: 0; right: 0; top: 0; height: 34px; background: linear-gradient(to bottom right, transparent 49.5%, rgba(168,131,58,.18) 50%, transparent 51%) left / 50% 100% no-repeat, linear-gradient(to bottom left, transparent 49.5%, rgba(168,131,58,.18) 50%, transparent 51%) right / 50% 100% no-repeat; pointer-events: none; }
.zl-reply .zc-sub { margin-bottom: 8px; }
.zc-letter .zc-form { text-align: start; margin-top: 10px; }
.zc-letter .zc-form label > span, .zc-letter .zc-form legend { font-family: 'Cinzel', serif; font-size: 10.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--muted); }
.pi-l-ar.zc-letter .zc-form label > span, .pi-l-ar.zc-letter .zc-form legend { font-family: 'Amiri', serif; font-size: 16px; letter-spacing: 0; }
.zc-letter .zc-form input:not([type=radio]), .zc-letter .zc-form select, .zc-letter .zc-form textarea { background: transparent; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; color: var(--ink); font: inherit; }
.zc-letter .pi-seg span { border-radius: 0; border-color: var(--line); }
.zc-letter .pi-seg input:checked + span { background: var(--ink); color: #f4e9cf; border-color: var(--ink); }
.zc-letter .zc-thanks .zl-mono { margin-top: 6px; }
.zl-close { padding-bottom: 50px !important; }
.zl-closing { font-style: italic; font-size: 20px; color: var(--muted); }
.zc-letter .zc-foot { padding: 30px 0 34px; }
.zc-letter .zl-gal figure { border: 6px solid #fffdf8; box-shadow: 0 10px 20px -14px rgba(30,20,10,.5); }
/* v1.8 gallery poster: the closed letter shows at once (no fade-in, no loader) */
.pi-poster .ltr-stage { opacity: 1; transform: none; transition: none; }
.pi-poster .ltr-load { display: none; }
/* v1.9.8: the couple silhouette colour */
.zc-letter .zc-illu { --cp1: #d8bd7f; --cp2: #b08c4f; --cp3: #7f5f2c; --cp4: #c9a766; }

/* --- moon.css --- */
/* ---------- MOONLIT VOWS — midnight navy, moon-silver and soft gold; crescents, four-point stars, the lunar cycle ---------- */
.pi.zc-moon { --ink: #eef0f7; --muted: #aeb6cf; --acc: #e3c682; --line: rgba(205,196,170,.28); --paper: #0b1330; --foot: #eef0f7;
  --g1: #fff4d2; --g2: #e3c27a; --g3: #9c7633; --g4: #f6e3ab; --btn-bg: linear-gradient(120deg, #c9d0e3 0%, #ffffff 30%, #d8c48f 62%, #f4e6bd 100%); --btn-ink: #0b1330; --btn-r: 40px;
  --illu-bg: radial-gradient(70% 60% at 50% 35%, #26355f, #0b1330); --illu-ln: rgba(5,10,25,.55); --map-r: 18px;
  --gold-grad: linear-gradient(100deg, #9c7633 0%, #e3c27a 20%, #fff4d2 36%, #e7c987 50%, #a8823c 66%, #f2dda0 84%, #fff6dc 94%, #c19a55 100%);
  --moon-grad: linear-gradient(100deg, #aeb6cf 0%, #f4f5fa 22%, #ffffff 36%, #c3c9db 52%, #f7f1e1 70%, #b7bfd5 86%, #eef0f7 100%);
  color: var(--ink); font-family: 'Cormorant Garamond', 'Amiri', serif; font-size: 19px; }
.pi-l-ar.zc-moon { font-family: 'Amiri', 'Cormorant Garamond', serif; font-size: 18px; }
.zc-moon .mn-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.zc-moon .pi-sec { position: relative; }
.zc-moon .mn-names .zc-n, .zc-moon .mn-dd b, .zc-moon .mn-h .zc-ht, .zc-moon .mn-tl time { background-image: var(--moon-grad); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
.zc-moon .zc-bism, .zc-moon .mn-amp, .zc-moon .mn-sign, .zc-moon .zc-names2, .zc-moon .mn-q { background-image: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
/* ---- cover: no frame at all, the names written in moonlight on the night sky of the plate ---- */
.mn-cover { min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; justify-content: flex-end; box-sizing: border-box; padding: 25vh 18px 84px !important; padding: 25svh 18px 84px !important;
  background: radial-gradient(90% 46% at 50% 66%, rgba(6,10,28,.5), rgba(6,10,28,0) 72%); }
.mn-head { max-width: 440px; margin: 0 auto; text-align: center; text-shadow: 0 1px 14px rgba(4,8,24,.55); }
.zc-moon .zc-bism { font-family: 'Aref Ruqaa', 'Amiri', serif; font-weight: 700; font-size: 26px; line-height: 1.6; margin-bottom: 10px; direction: rtl; text-shadow: none; }
.zc-moon .zc-guest { font-size: 17px; font-style: italic; color: var(--muted); margin-bottom: 12px; }
.zc-moon .zc-guest b { color: var(--ink); font-weight: 500; }
.zc-moon .zc-pre, .zc-moon .zc-inv { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 11px; letter-spacing: .44em; text-transform: uppercase; color: var(--muted); line-height: 2; }
.pi-l-ar.zc-moon .zc-pre, .pi-l-ar.zc-moon .zc-inv { font-family: 'El Messiri', 'Amiri', serif; font-weight: 400; font-size: 17px; letter-spacing: 0; text-transform: none; }
.zc-moon .zc-pre > .pi-l2, .zc-moon .zc-inv > .pi-l2 { display: block; font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: 16px; letter-spacing: .04em; text-transform: none; }
.mn-names { margin: 12px 0 4px; line-height: 1; }
.mn-names .zc-n { font-family: 'Italiana', 'Cormorant Garamond', serif; font-weight: 400; font-size: clamp(42px, 13vw, 60px); letter-spacing: .14em; text-transform: uppercase; padding-inline-start: .14em; text-shadow: none; }
.mn-names .zc-n.is-ar { font-family: 'El Messiri', 'Amiri', serif; font-weight: 600; letter-spacing: 0; padding: 0; font-size: clamp(44px, 13vw, 60px); line-height: 1.35; }
.mn-names .zc-amp { margin: -6px 0 -10px; line-height: 1; }
.mn-amp { display: inline-block; font-family: 'Parisienne', cursive; font-size: 46px; text-shadow: none; }
.zc-moon .zc-names2 { font-family: 'Parisienne', cursive; font-size: 30px; margin: 4px 0 8px; text-shadow: none; }
.zc-moon .zc-names2.is-ar { font-family: 'El Messiri', serif; font-size: 24px; }
.zc-moon .zc-parents { font-size: 16px; font-style: italic; color: var(--muted); margin: 8px 0; }
.mn-div { margin: 12px auto 10px; max-width: 280px; }
.mn-phases { display: block; width: 100%; height: auto; overflow: visible; }
/* date: month above, the day inside a planetary orbit, weekday and year below */
.mn-date { display: flex; flex-direction: column; align-items: center; margin-top: 10px; }
.mn-dm, .mn-dw { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 12px; letter-spacing: .46em; text-transform: uppercase; color: var(--ink); padding-inline-start: .46em; }
.mn-dw { color: var(--muted); }
.mn-dw i { font-style: normal; color: var(--acc); margin: 0 .2em; }
.mn-dw em { font-style: normal; }
.pi-l-ar.zc-moon .mn-dm, .pi-l-ar.zc-moon .mn-dw { font-family: 'El Messiri', serif; font-size: 18px; letter-spacing: 0; padding: 0; text-transform: none; }
.mn-dd { position: relative; width: 200px; height: 92px; display: flex; align-items: center; justify-content: center; margin: 2px 0; }
.mn-orbit { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.mn-dd b { position: relative; font-family: 'Marcellus', serif; font-weight: 400; font-size: 54px; letter-spacing: .04em; line-height: 1; text-shadow: none; }
.mn-time { margin-top: 8px; font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: 19px; color: var(--acc); }
.pi-l-ar.zc-moon .mn-time { font-family: 'Amiri', serif; font-style: normal; font-size: 18px; }
.zc-moon .pi-cue { border-color: var(--acc); }
/* ---- panes: night glass with a domed top, a crescent emblem resting on the crown ---- */
.mn-sec { padding: 34px 14px 16px !important; }
.mn-pane { position: relative; max-width: 440px; margin: 0 auto; box-sizing: border-box; padding: 44px 24px 32px; text-align: center;
  border: 1px solid rgba(214,200,160,.5); border-radius: 220px 220px 14px 14px / 64px 64px 14px 14px;
  background-color: rgba(9,15,40,.8);
  background-image: radial-gradient(1px 1px at 18% 12%, rgba(255,255,255,.7), transparent), radial-gradient(1px 1px at 72% 22%, rgba(255,255,255,.55), transparent), radial-gradient(1.2px 1.2px at 40% 64%, rgba(255,240,200,.6), transparent), radial-gradient(1px 1px at 86% 78%, rgba(255,255,255,.5), transparent), radial-gradient(1px 1px at 8% 88%, rgba(255,255,255,.45), transparent), radial-gradient(120% 50% at 50% 0%, rgba(80,100,160,.28), rgba(80,100,160,0) 70%);
  background-size: 160px 190px, 160px 190px, 160px 190px, 160px 190px, 160px 190px, 100% 100%;
  box-shadow: inset 0 0 0 4px rgba(9,15,40,.0), inset 0 1px 0 rgba(255,255,255,.06), 0 18px 30px -22px rgba(0,0,0,.7); }
.mn-cap { position: absolute; left: 50%; top: 0; width: 46px; height: 46px; margin: -24px 0 0 -23px; border-radius: 50%; background: #0b1330; box-shadow: 0 0 0 1px rgba(214,200,160,.5); display: block; }
.mn-emb { display: block; width: 100%; height: 100%; overflow: visible; }
.mn-h { display: flex; align-items: center; justify-content: center; gap: 12px; margin-bottom: 22px; }
.mn-h::before, .mn-h::after { content: ''; flex: 0 0 26px; height: 1px; background: linear-gradient(90deg, rgba(227,198,130,0), rgba(227,198,130,.85)); }
.mn-h::after { transform: scaleX(-1); }
.mn-h .zc-ht { font-family: 'Italiana', serif; font-weight: 400; font-size: 21px; letter-spacing: .2em; line-height: 1.35; text-transform: uppercase; padding-inline-start: .2em; }
.pi-l-ar.zc-moon .mn-h .zc-ht { font-family: 'El Messiri', serif; font-weight: 600; font-size: 25px; letter-spacing: 0; padding: 0; }
.zc-moon .mn-h .zc-ht > .pi-l2 { display: block; font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: 15px; letter-spacing: .05em; text-transform: none; padding: 0; margin-top: 2px; }
/* message */
.mn-q { display: block; font-family: 'Playfair Display', serif; font-size: 64px; line-height: .6; height: 26px; }
.mn-msgt { font-size: 20px; line-height: 1.7; font-style: italic; margin: 10px 0 20px; }
.pi-l-ar.zc-moon .mn-msgt { font-style: normal; font-size: 19px; line-height: 1.85; }
.mn-msg .mn-phases { max-width: 220px; margin: 0 auto; }
/* countdown: four moon dials, each a phase of the lunar cycle */
.zc-moon .pi-cd { gap: 6px; }
.zc-moon .zc-cell { position: relative; width: 74px; height: 74px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.zc-moon .mn-dial { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.zc-moon .zc-cell b { position: relative; font-family: 'Marcellus', serif; font-weight: 400; font-size: 24px; line-height: 1; color: #fbfaf5; font-variant-numeric: tabular-nums; }
.zc-moon .zc-cell span { position: relative; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 8.5px; letter-spacing: .26em; text-transform: uppercase; color: var(--acc); margin-top: 5px; padding-inline-start: .26em; }
.pi-l-ar.zc-moon .zc-cell span { font-family: 'El Messiri', serif; font-size: 12px; letter-spacing: 0; padding: 0; }
.zc-moon .pi-past { margin-top: 14px; font-style: italic; }
/* details: an almanac, label on one side and the value on the other */
.mn-row { display: grid; grid-template-columns: 92px 1fr; gap: 14px; align-items: start; padding: 18px 0; border-top: 1px solid var(--line); text-align: start; }
.mn-row:first-of-type { border-top: 0; padding-top: 2px; }
.mn-row h3 { font-family: 'Jost', sans-serif; font-weight: 400; font-size: 10.5px; letter-spacing: .3em; text-transform: uppercase; color: var(--acc); padding-top: 6px; line-height: 1.6; }
.mn-row h3 > .pi-l2 { display: block; font-family: 'Cormorant Garamond', serif; font-style: italic; letter-spacing: .02em; text-transform: none; font-size: 14px; color: var(--muted); }
.pi-l-ar.zc-moon .mn-row h3 { font-family: 'El Messiri', serif; font-size: 16px; letter-spacing: 0; text-transform: none; padding-top: 2px; }
.mn-val p { line-height: 1.5; }
.mn-strong { font-size: 21px; color: #fbfaf5; font-weight: 500; }
.mn-comp { display: block; width: 44px; height: 44px; margin: 0 0 8px; }
.zc-moon .zc-btn { color: var(--ink); border-color: rgba(214,200,160,.7); border-radius: 40px; font-family: 'Jost', sans-serif; font-weight: 400; font-size: 11.5px; letter-spacing: .24em; }
.zc-moon .mn-val .zc-btn { padding: 8px 18px; min-height: 40px; }
.zc-moon .zc-btn-solid { color: var(--btn-ink); font-weight: 500; letter-spacing: .3em; }
.pi.zc-moon .zc-map { background: rgba(5,9,26,.7); border: 1px solid rgba(214,200,160,.45); color: var(--acc); }
/* programme: a constellation — the hours as stars joined by a fine dotted line */
.mn-tlw { position: relative; max-width: 340px; margin: 0 auto; }
.zc-moon .mn-tl { position: relative; }
.zc-moon .mn-tl::before { content: ''; position: absolute; top: 14px; bottom: 14px; inset-inline-start: 99px; width: 0; border-inline-start: 1px dotted rgba(227,198,130,.7); }
.zc-moon .mn-tl li { position: relative; display: grid; grid-template-columns: 86px 28px 1fr; align-items: center; gap: 0; padding: 11px 0; text-align: start; }
.zc-moon .mn-tl time { text-align: end; font-family: 'Italiana', serif; font-size: 23px; letter-spacing: .04em; padding-inline-end: 6px; }
.zc-moon .mn-tl li > span { padding-inline-start: 8px; font-size: 18px; line-height: 1.35; }
.zc-moon .mn-tl li:nth-child(even) .mn-node { transform: scale(.72); }
.mn-node { display: block; width: 20px; height: 20px; margin: 0 auto; position: relative; }
.mn-node svg { display: block; width: 100%; height: 100%; overflow: visible; }
/* photo (optional): a full-moon porthole inside its orbit */
.mn-port { position: relative; max-width: 300px; margin: 0 auto; text-align: center; }
.mn-port > .mn-orbit { position: absolute; left: -6%; right: -6%; top: 38%; width: 112%; height: auto; inset-inline: auto; pointer-events: none; }
.mn-ring { width: 230px; height: 230px; margin: 0 auto; padding: 5px; border-radius: 50%; border: 1px solid rgba(214,200,160,.75); box-sizing: border-box; }
.mn-ring .zc-portrait { margin: 0; height: 100%; }
.mn-ring .zc-pic { width: 100%; height: 100%; border-radius: 50%; overflow: hidden; }
.mn-ring .zc-pic img { width: 100%; height: 100%; object-fit: cover; }
.mn-cap2 { margin-top: 16px; font-family: 'Parisienne', cursive; font-size: 26px; color: var(--acc); }
.pi-l-ar.zc-moon .mn-cap2 { font-family: 'El Messiri', serif; font-size: 20px; }
/* gallery: domed windows */
.mn-gal figure { border-radius: 90px 90px 6px 6px / 50px 50px 6px 6px; overflow: hidden; border: 1px solid rgba(214,200,160,.45); }
/* RSVP */
.zc-moon .pi-form { text-align: start; }
.zc-moon .pi-form label > span, .zc-moon .pi-form legend { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 10.5px; letter-spacing: .3em; text-transform: uppercase; color: var(--muted); }
.pi-l-ar.zc-moon .pi-form label > span, .pi-l-ar.zc-moon .pi-form legend { font-family: 'El Messiri', serif; font-size: 15px; letter-spacing: 0; text-transform: none; }
.zc-moon .pi-form input, .zc-moon .pi-form select, .zc-moon .pi-form textarea { color: var(--ink); background: rgba(4,8,24,.55); border: 0; border-bottom: 1px solid rgba(214,200,160,.55); border-radius: 0; }
.zc-moon .pi-form textarea { border: 1px solid rgba(214,200,160,.4); border-radius: 12px; }
.zc-moon .pi-form select option { color: #1a1a1a; }
.zc-moon .pi-seg label > span { border-radius: 40px; border-color: rgba(214,200,160,.55); color: var(--ink); }
.zc-moon .pi-seg input:checked + span { background: var(--btn-bg); color: #0b1330; border-color: transparent; }
.zc-moon .pi-seg label > span { flex-direction: column; }
.zc-moon .pi-seg label > span span { display: block; min-height: 0; padding: 0; margin-top: 2px; border: 0; border-radius: 0; background: none; font-size: 12.5px; opacity: .75; }
.zc-moon .pi-seg input:checked + span * { color: #0b1330; opacity: .8; }
.zc-moon .zc-sub { color: var(--muted); }
.mn-thx { width: 64px; height: 64px; margin: 0 auto 10px; }
/* closing */
.mn-close { padding: 40px 14px 20px !important; }
.mn-closein { max-width: 380px; margin: 0 auto; text-align: center; }
.mn-moon { display: block; width: 210px; height: auto; margin: 0 auto 8px; overflow: visible; }
.mn-closing { font-style: italic; font-size: 19px; line-height: 1.6; color: var(--ink); text-shadow: 0 1px 12px rgba(0,0,0,.6); }
.pi-l-ar.zc-moon .mn-closing { font-style: normal; }
.mn-sign { font-family: 'Parisienne', cursive; font-size: 40px; line-height: 1.35; margin: 6px 0 16px; }
.mn-sign i { font-style: normal; font-family: 'Cormorant Garamond', serif; font-size: .5em; }
.pi-l-ar.zc-moon .mn-sign { font-family: 'El Messiri', serif; font-size: 30px; }
.mn-closein .mn-phases { max-width: 220px; margin: 0 auto; }
.zc-moon .zc-foot a, .zc-moon .zc-foot b { text-shadow: 0 1px 6px rgba(0,0,0,.6); }
/* entrance: rise out of the dark like stars appearing; the tiny stars in the ornaments twinkle (opacity only, small svg paths) */
.zc-moon .pi-rv { transform: translate3d(0, 16px, 0); transition: opacity 1.4s ease, transform 1.4s cubic-bezier(.2,.75,.2,1); }
.zc-moon .pi-rv.in { transform: none; }
.zc-moon .mn-pane.pi-rv { transform: translate3d(0, 30px, 0); }
.zc-moon .mn-pane.pi-rv.in { transform: none; }
.zc-moon .mn-tw { animation: mnTw 3.2s ease-in-out infinite; }
.zc-moon .mn-tw2 { animation-delay: -1.1s; animation-duration: 2.6s; }
.zc-moon .mn-tw3 { animation-delay: -2s; animation-duration: 3.8s; }
@keyframes mnTw { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { .zc-moon .pi-rv, .zc-moon .mn-pane.pi-rv { transform: none; } .zc-moon .mn-tw { animation: none; } }

/* --- rosewall.css --- */
/* ---------- THE ROSE WALL — ivory paper, blush garden roses, sage leaves, pearls & soft rose-gold ---------- */
.pi.zc-rosewall { --ink: #3e4a3b; --muted: #6f7d69; --acc: #a88347; --blush: #c98c80; --sage: #5f775c; --line: rgba(168,131,71,.4); --paper: #fbf6ef; --foot: #4b5847;
  --g1: #f6e2c6; --g2: #c9a265; --g3: #9a7337; --g4: #e8cf9f; --btn-bg: linear-gradient(135deg, #b98a74, #e9c3b2 42%, #c99a80 68%, #a7775f); --btn-ink: #fffaf5; --btn-r: 40px;
  --illu-bg: radial-gradient(70% 60% at 50% 40%, #fbefe9, #efdcd2); --illu-ln: rgba(255,255,255,.6); --map-r: 18px;
  --rg: linear-gradient(100deg, #7f4f3c 0%, #b67a63 22%, #e2b4a0 38%, #ae735c 54%, #8c5a44 70%, #c99179 86%, #e6bda9 100%);
  color: var(--ink); font-family: 'Cormorant Garamond', 'Amiri', serif; font-size: 19px; line-height: 1.55; }
.pi-l-ar.zc-rosewall { font-family: 'Amiri', 'Cormorant Garamond', serif; font-size: 18px; }
.zc-rosewall .pi-sec { position: relative; z-index: 1; }
.zc-rosewall .zc-names .zc-n, .zc-rosewall .rw-dd b, .zc-rosewall .rw-mono, .zc-rosewall .rw-sign { background-image: var(--rg); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
/* entrance: each block blooms in (small rise + soft scale), corner sprays settle a beat later */
.zc-rosewall .pi-rv { transform: translate3d(0, 16px, 0) scale(.975); transform-origin: 50% 0; transition: opacity 1.2s ease, transform 1.3s cubic-bezier(.2,.75,.2,1); }
.zc-rosewall .pi-rv.in { transform: none; }
.zc-rosewall .rw-sp { position: absolute; width: 74px; height: 74px; pointer-events: none; z-index: 2; opacity: 0; transform: scale(.7); transition: opacity 1s ease .35s, transform 1.2s cubic-bezier(.2,.8,.2,1) .35s; }
.zc-rosewall .pi-rv.in > .rw-sp, .zc-rosewall .rw-tile.is-in > .rw-sp, .zc-rosewall .rw-tile:not(.zc-blk) > .rw-sp { opacity: 1; transform: none; }
.zc-rosewall .rw-sp svg { display: block; width: 100%; height: 100%; }
.zc-rosewall .rw-sp-a { left: -14px; top: -16px; transform-origin: 0 0; }
.zc-rosewall .rw-sp-b { right: -14px; bottom: -16px; transform-origin: 100% 100%; }
.zc-rosewall .rw-sp-b svg { transform: rotate(180deg); }
/* ---- cover: an ivory paper card hung with a rose garland and pearl strand ---- */
.rw-cover { min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; justify-content: center; box-sizing: border-box; padding: 118px 16px 80px !important; }
.rw-card { position: relative; max-width: 460px; width: 100%; margin: 0 auto; box-sizing: border-box; padding: 78px 26px 36px; text-align: center; border-radius: 6px;
  background: linear-gradient(180deg, rgba(255,252,247,.95), rgba(251,245,237,.93)); box-shadow: 0 18px 40px -22px rgba(80,70,50,.45), 0 0 0 1px rgba(168,131,71,.28); }
.rw-card::before { content: ''; position: absolute; inset: 9px; border: 1px solid rgba(168,131,71,.42); border-radius: 3px; pointer-events: none; }
.rw-card::after { content: ''; position: absolute; inset: 13px; border: 1px solid rgba(201,140,128,.28); border-radius: 2px; pointer-events: none; }
.rw-garland { position: absolute; left: -9%; top: -70px; width: 118%; height: auto; display: block; pointer-events: none; z-index: 2; }
.rw-in { position: relative; z-index: 1; }
.zc-rosewall .zc-bism { font: 400 22px/1.6 'Mirza', 'Amiri', serif; color: var(--sage); margin-bottom: 8px; }
.zc-rosewall .zc-guest { font: italic 400 18px/1.4 'Cormorant Garamond', serif; color: var(--muted); margin-bottom: 10px; }
.zc-rosewall .zc-guest b { font-style: normal; color: var(--ink); }
.zc-rosewall .zc-pre { font: 400 12px/1.6 'Italiana', 'El Messiri', serif; letter-spacing: .32em; text-transform: uppercase; color: var(--sage); }
.rw-names { margin: 10px 0 6px !important; font: 400 64px/1.02 'Allura', 'Mirza', cursive; }
.rw-names .zc-n { padding: 0 .12em; }
.rw-names .zc-n.is-ar { font: 600 50px/1.35 'Mirza', 'Amiri', serif; }
.rw-names .zc-amp { width: 34px; height: 34px; margin: 2px auto; }
.rw-names .zc-amp svg { width: 100%; height: 100%; display: block; }
.zc-rosewall .zc-names2 { font: italic 400 20px/1.4 'Cormorant Garamond', serif; color: var(--muted); }
.zc-rosewall .zc-names2.is-ar { font: 400 22px/1.5 'Mirza', serif; font-style: normal; }
.zc-rosewall .zc-parents { margin-top: 12px; font-size: 15px; color: var(--muted); font-style: italic; }
.zc-rosewall .zc-parents p + p { margin-top: 2px; }
.rw-sprig { display: block; width: 100%; max-width: 230px; height: auto; margin: 0 auto; }
.rw-div { margin: 18px 0 12px; }
.zc-rosewall .zc-inv { font-style: italic; font-size: 18px; color: var(--ink); max-width: 330px; margin: 0 auto; }
.rw-date { display: flex; flex-direction: column; align-items: center; margin-top: 22px; }
.rw-dw, .rw-dm { font: 400 13px/1.4 'Italiana', 'El Messiri', serif; letter-spacing: .3em; text-transform: uppercase; color: var(--sage); }
.pi-l-ar .rw-dw, .pi-l-ar .rw-dm, .pi-l-ar.zc-rosewall .zc-pre { letter-spacing: 0; font-family: 'El Messiri', serif; font-size: 15px; }
.rw-dm em { font-style: normal; color: var(--acc); }
.rw-dd { position: relative; display: block; width: 132px; height: 132px; margin: 4px 0; }
.rw-dd .rw-wreath { position: absolute; inset: 0; width: 100%; height: 100%; }
.rw-dd b { position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-58%); font: 400 46px/1 'Italiana', 'Cormorant Garamond', serif; }
.rw-time { margin-top: 6px; font: italic 500 17px/1.4 'Cormorant Garamond', serif; color: var(--blush); }
.rw-cover .pi-cue { border-color: var(--sage); }
/* ---- section tiles: rounded ivory cards with rose sprays on two corners ---- */
.rw-sec { padding: 22px 18px !important; }
.rw-tile { position: relative; max-width: 440px; margin: 0 auto; box-sizing: border-box; padding: 34px 24px 30px; text-align: center; border-radius: 22px;
  background: radial-gradient(120% 70% at 50% 0%, rgba(255,253,250,.95), rgba(251,243,236,.92) 70%, rgba(248,238,230,.92)); box-shadow: 0 14px 34px -24px rgba(80,70,50,.5), inset 0 0 0 1px rgba(168,131,71,.3), inset 0 0 0 7px rgba(255,252,247,.92), inset 0 0 0 8px rgba(201,140,128,.25); }
.rw-h { font: 400 15px/1.5 'Italiana', 'El Messiri', serif; letter-spacing: .34em; text-transform: uppercase; color: var(--sage); }
.pi-l-ar .rw-h { letter-spacing: 0; font: 600 21px/1.5 'El Messiri', serif; }
.rw-h .pi-l2 { display: block; font-size: .8em; letter-spacing: .2em; color: var(--muted); }
.rw-hs { margin: 6px 0 16px; }
.rw-hs .rw-sprig { max-width: 170px; }
/* message: a quotation on the open paper, between two sprigs */
.rw-quote { max-width: 400px; margin: 0 auto; padding: 18px 22px; text-align: center; background: radial-gradient(80% 70% at 50% 50%, rgba(255,252,247,.94), rgba(255,252,247,.78) 70%, rgba(255,252,247,0)); }
.rw-msgt { font: italic 400 19px/1.65 'Cormorant Garamond', serif; color: var(--ink); margin: 12px 0 !important; }
.pi-l-ar .rw-msgt { font: 400 19px/1.8 'Amiri', serif; }
/* countdown: four pearl-rimmed medallions */
.zc-rosewall .pi-cd { gap: 6px; }
.zc-rosewall .zc-cell { width: 70px; height: 70px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.zc-rosewall .zc-cell .rw-pc { position: absolute; inset: 0; width: 100%; height: 100%; }
.zc-rosewall .zc-cell b { position: relative; font: 400 26px/1 'Italiana', 'Cormorant Garamond', serif; color: var(--ink); font-variant-numeric: tabular-nums; margin-top: 4px; }
.zc-rosewall .zc-cell > span { position: relative; font: 500 9px/1.4 'Jost', 'Tajawal', sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--blush); }
.pi-l-ar .zc-rosewall .zc-cell span, .pi-l-ar.zc-rosewall .zc-cell > span { letter-spacing: 0; font-size: 11px; }
.zc-rosewall .pi-past { font-style: italic; color: var(--muted); }
/* details */
.rw-item + .rw-item { margin-top: 22px; padding-top: 22px; border-top: 1px solid transparent; border-image: linear-gradient(90deg, transparent, rgba(168,131,71,.5), transparent) 1; }
.rw-item h3 { font: 400 13px/1.5 'Italiana', 'El Messiri', serif; letter-spacing: .3em; text-transform: uppercase; color: var(--blush); margin-bottom: 4px; }
.pi-l-ar .rw-item h3 { letter-spacing: 0; font: 600 17px/1.5 'El Messiri', serif; }
.rw-item p { font-size: 18px; }
.rw-strong { font-weight: 600; color: var(--ink); }
.rw-mirror { width: 92px; height: 112px; margin: 0 auto 12px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: radial-gradient(60% 55% at 50% 45%, #fff, #f7ece3); box-shadow: 0 0 0 1px rgba(168,131,71,.55), 0 0 0 5px rgba(255,252,247,.9), 0 0 0 6px rgba(201,140,128,.35); }
.rw-fount { width: 62px; height: auto; }
.zc-rosewall .zc-btn { color: var(--sage); border-color: rgba(95,119,92,.55); border-radius: 40px; }
.zc-rosewall .zc-btn-g { color: var(--blush); border-color: rgba(201,140,128,.6); }
.zc-rosewall .zc-btn-solid { color: var(--btn-ink); border: 0; box-shadow: 0 8px 18px -10px rgba(150,90,70,.7); }
.zc-rosewall .zc-map { box-shadow: 0 0 0 1px rgba(168,131,71,.4); }
.zc-rosewall .zc-mapph { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; border: 0; color: var(--sage); font: 500 13px/1.4 'Jost', 'Tajawal', sans-serif; letter-spacing: .12em; text-transform: uppercase;
  background: radial-gradient(70% 70% at 50% 45%, #f7f3ea, #e7ecdf); cursor: pointer; }
.zc-rosewall .zc-mapph svg { width: 30px; height: 30px; color: var(--blush); }
/* programme: a climbing rose vine, times alternating either side of the stem */
.rw-vine { position: relative; padding: 4px 0; }
.rw-vine::before { content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 2px; margin-left: -1px; background: linear-gradient(180deg, rgba(127,151,115,0), #8ea283 8%, #8ea283 92%, rgba(127,151,115,0)); }
.rw-tl li { position: relative; display: grid; grid-template-columns: 1fr 30px 1fr; align-items: center; min-height: 54px; }
.rw-tl li + li { margin-top: 6px; }
.rw-tl time { grid-column: 1; text-align: right; padding-right: 10px; font: 400 22px/1 'Italiana', 'Cormorant Garamond', serif; color: var(--blush); }
.rw-tl .rw-node { grid-column: 2; grid-row: 1; justify-self: center; width: 22px; height: 28px; display: block; }
.rw-tl .rw-node svg { width: 100%; height: 100%; display: block; }
.rw-tl span { grid-column: 3; grid-row: 1; text-align: left; padding-left: 10px; font-size: 17px; line-height: 1.35; }
.rw-tl li:nth-child(even) time { grid-column: 3; text-align: left; padding: 0 0 0 10px; }
.rw-tl li:nth-child(even) span { grid-column: 1; text-align: right; padding: 0 10px 0 0; }
.rw-tl li time, .rw-tl li span { grid-row: 1; }
[dir="rtl"] .rw-tl time, .pi-l-ar .rw-tl time { text-align: left; padding: 0 0 0 10px; }
[dir="rtl"] .rw-tl span, .pi-l-ar .rw-tl span { text-align: right; padding: 0 10px 0 0; }
[dir="rtl"] .rw-tl li:nth-child(even) time, .pi-l-ar .rw-tl li:nth-child(even) time { text-align: right; padding: 0 10px 0 0; }
[dir="rtl"] .rw-tl li:nth-child(even) span, .pi-l-ar .rw-tl li:nth-child(even) span { text-align: left; padding: 0 0 0 10px; }
/* gallery & photo */
.rw-gal figure { border-radius: 14px; box-shadow: 0 0 0 1px rgba(168,131,71,.35); }
.rw-oval { width: 210px; height: 270px; margin: 0 auto; border-radius: 50%; overflow: hidden; box-shadow: 0 0 0 1px rgba(168,131,71,.6), 0 0 0 6px rgba(255,252,247,.95), 0 0 0 7px rgba(201,140,128,.45); }
.rw-oval .zc-pic, .rw-oval .zc-illu { width: 100%; height: 100%; }
.rw-oval .zc-portrait { margin: 0; height: 100%; } /* v1.9.8: the couple's backdrop fills the whole oval */
.rw-cap { margin-top: 14px; font: italic 400 17px/1.4 'Cormorant Garamond', serif; color: var(--muted); }
/* RSVP form */
.zc-rosewall .zc-form label { display: block; text-align: start; margin-top: 14px; }
.zc-rosewall .zc-form label > span, .zc-rosewall .zc-form legend { display: block; font: 500 11px/1.5 'Jost', 'Tajawal', sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--sage); margin-bottom: 6px; }
.pi-l-ar .zc-rosewall .zc-form label > span, .pi-l-ar.zc-rosewall .zc-form label > span, .pi-l-ar.zc-rosewall .zc-form legend { letter-spacing: 0; font-size: 14px; }
.zc-rosewall .zc-form fieldset { border: 0; padding: 0; margin: 16px 0 0; text-align: start; }
.zc-rosewall .zc-form input:not([type=radio]), .zc-rosewall .zc-form select, .zc-rosewall .zc-form textarea { width: 100%; box-sizing: border-box; padding: 11px 14px; font: 400 17px/1.4 'Cormorant Garamond', 'Amiri', serif; color: var(--ink);
  background: #fffdf9; border: 1px solid rgba(168,131,71,.38); border-radius: 12px; outline: none; -webkit-appearance: none; appearance: none; }
.zc-rosewall .zc-form input:focus, .zc-rosewall .zc-form select:focus, .zc-rosewall .zc-form textarea:focus { border-color: var(--blush); }
.zc-rosewall .zc-seg { display: flex; gap: 8px; }
.zc-rosewall .zc-seg label { flex: 1; margin: 0; }
.zc-rosewall .zc-seg input { position: absolute; opacity: 0; pointer-events: none; }
.zc-rosewall .zc-seg label > span { display: flex; flex-direction: column; justify-content: center; min-height: 48px; box-sizing: border-box; text-align: center; padding: 10px 6px; border-radius: 40px; border: 1px solid rgba(201,140,128,.5); color: var(--blush); font: 500 12px/1.3 'Jost', 'Tajawal', sans-serif; letter-spacing: .1em; text-transform: uppercase; margin: 0 !important; }
.zc-rosewall .zc-seg label > span .pi-l2 { display: block; font-size: .85em; opacity: .85; margin-top: 2px; }
.zc-rosewall .zc-seg input:checked + span { background: linear-gradient(135deg, #c99a86, #efcfc1 50%, #c8927c); color: #fff; border-color: transparent; }
.zc-rosewall .pi-thanks-t { font: italic 400 20px/1.5 'Cormorant Garamond', serif; }
.zc-rosewall .pi-form-msg { color: var(--blush); font-style: italic; }
.zc-rosewall .zc-sub { color: var(--muted); }
/* closing: the wreath again, holding the couple's initials */
.rw-close { padding: 30px 18px 18px !important; text-align: center; }
.rw-closein { max-width: 400px; margin: 0 auto; padding: 24px 18px; background: radial-gradient(70% 60% at 50% 45%, rgba(255,252,247,.94), rgba(255,252,247,.7) 70%, rgba(255,252,247,0)); }
.rw-cw { position: relative; width: 168px; height: 168px; margin: 0 auto 10px; }
.rw-cw .rw-wreath { width: 100%; height: 100%; display: block; }
.rw-mono { position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-60%); font: 400 46px/1 'Allura', 'Mirza', cursive; white-space: nowrap; }
.rw-mono i { font: italic 400 .5em 'Cormorant Garamond', serif; padding: 0 .12em; }
.rw-closing { font: italic 400 19px/1.5 'Cormorant Garamond', serif; color: var(--muted); }
.pi-l-ar .rw-closing { font: 400 19px/1.7 'Amiri', serif; }
.rw-sign { margin-top: 6px !important; font: 400 40px/1.2 'Allura', 'Mirza', cursive; }
.rw-sign i { font: italic 400 .5em 'Cormorant Garamond', serif; }
.zc-rosewall .zc-foot { padding: 6px 0 30px; font: 400 12px/1.5 'Jost', 'Tajawal', sans-serif; letter-spacing: .12em; }
@media (prefers-reduced-motion: reduce) { .zc-rosewall .rw-sp { opacity: 1; transform: none; transition: none; } }
/* initials on the film's gold medallion (mono_on): a touch of depth so the gold reads on the ivory rose (small static element) */
.pi-in-rosewall .lxm span { filter: drop-shadow(0 1px 1.2px rgba(74,48,22,.6)) drop-shadow(0 0 6px rgba(255,250,240,.7)); }

/* --- silk.css --- */
/* SILK RIBBON — opening is a pre-rendered film (lux/silk-open.mp4); live layers: the gold initials, the wax seal on the knot, the hint.
   On the tap the initials fade and the seal lifts a little and melts into a soft glow (transform/opacity only) — no crack, no crumbs. */
.pi.zc-silk .lxv-box, .zc-silk .lxv-box { background: #ece4d8; }
.zc-silk .lxm { transition: opacity 1.3s cubic-bezier(.4, 0, .2, 1) .1s; }
.zc-silk .lxm span { font-family: Allura, 'Great Vibes', cursive; letter-spacing: 0; word-spacing: -.14em; background: linear-gradient(172deg, #f6e3b0 0%, #d8b26a 34%, #a77a35 58%, #e9cd8e 82%, #b88c45 100%); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; text-shadow: none; filter: none; padding: .12em .25em; display: inline-block; }
.zc-silk .lxm.is-ar span { font-family: 'Aref Ruqaa', Amiri, serif; font-weight: 700; }
.zc-silk .lxs { transition: opacity 1.4s cubic-bezier(.4, 0, .2, 1) .1s, transform 1.9s cubic-bezier(.4, 0, .2, 1); }
.zc-silk .is-open .lxs, .zc-silk.is-open .lxs, .zc-silk .is-play .lxs { opacity: 0; transform: translate(-50%, -60%) scale(1.06); }
.zc-silk .lxs.is-crack .lxs-a, .zc-silk .lxs.is-crack .lxs-b { transform: none; opacity: 1; }
.zc-silk .lxs-cr { display: none; }
.zc-silk .lxs-halo { background: radial-gradient(circle, rgba(255, 236, 200, .45), rgba(255, 236, 200, 0) 62%); }
.zc-silk .is-open .lxs-halo, .zc-silk .is-play .lxs-halo { opacity: 0; transition: opacity 1s ease; }
@media (prefers-reduced-motion: reduce) { .zc-silk .lxs, .zc-silk .lxm { transition: opacity .6s ease; } }
/* the "tap" hint: a small ivory silk pill with a blush hairline, low on the card so it never covers the bow */
.pi-in-silk .pi-hint { bottom: 6.5%; text-shadow: none; }
.pi-in-silk .pi-hint-t { display: inline-block; padding: 9px 20px 10px; border-radius: 999px; background: rgba(253, 249, 243, .95); border: 1px solid rgba(201, 143, 128, .7); color: #4f3626;
  box-shadow: 0 8px 20px -10px rgba(90, 55, 40, .45); font-family: 'Cormorant Garamond', serif; font-weight: 600; font-size: 14.5px; letter-spacing: .2em; text-transform: uppercase; }
.pi-l-ar .pi-in-silk .pi-hint-t, .pi-in-silk .pi-hint-t .pi-l2 { letter-spacing: 0; text-transform: none; }
.pi-l-ar .pi-in-silk .pi-hint-t { font-family: 'Amiri', serif; font-size: 17px; }
.pi-in-silk .pi-hint-t > .pi-l2 { display: block; font-family: 'Amiri', serif; font-size: 14px; letter-spacing: 0; margin-top: 1px; }

/* ---- the inner card: ivory silk panels, a blush satin sash across one corner, a fine double gold hairline, embroidered rosebuds ---- */
.pi.zc-silk { --sk-ink: #5e4532; --sk-gold: #a8834a; --sk-gold2: #c9a66a; --sk-blush: #c98f80; --sk-script: #8c6639; color: var(--sk-ink); font-family: 'Cormorant Garamond', Georgia, serif; }
.zc-silk .sk-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.zc-silk .zc-card { position: relative; z-index: 2; padding: 0 0 30px; }
.zc-silk .sk-cover { min-height: 100vh; min-height: 100svh; display: flex; align-items: center; justify-content: center; text-align: center; padding: 70px 30px; position: relative; }
.zc-silk .sk-cv { max-width: 480px; position: relative; }
.zc-silk .sk-cv::before { content: ''; position: absolute; left: -36px; right: -36px; top: -60px; bottom: -70px; z-index: -1; pointer-events: none; background: radial-gradient(closest-side, rgba(252, 248, 241, .86), rgba(252, 248, 241, .62) 58%, rgba(252, 248, 241, 0)); }
.zc-silk .zc-bism { font: 700 22px/1.6 Amiri, serif; color: var(--sk-gold); margin: 0 0 10px; }
.zc-silk .sk-pre { font: 400 11.5px/1.75 Italiana, Cinzel, serif; letter-spacing: .2em; text-transform: uppercase; margin: 0 auto 6px; max-width: 280px; text-wrap: balance; }
.zc-silk .sk-names { font: 400 62px/1.12 Allura, 'Great Vibes', cursive; color: var(--sk-script); margin: 8px 0 4px; font-weight: 400; }
.zc-silk .sk-names .zc-n { display: inline-block; } .zc-silk .sk-names .zc-amp { display: block; font: italic 400 24px/1.1 'Cormorant Garamond', serif; color: var(--sk-blush); margin: 2px 0; }
.zc-silk .zc-names2 { font: italic 500 19px 'Cormorant Garamond', serif; margin: 2px 0 6px; }
.zc-silk .zc-parents p, .zc-silk .zc-guest { font: italic 17px 'Cormorant Garamond', serif; margin: 4px 0; }
.zc-silk .sk-rw { width: 230px; max-width: 74%; margin: 12px auto; line-height: 0; }
.zc-silk .sk-rib { width: 100%; height: auto; }
.zc-silk .sk-cdate { font: italic 500 21px/1.4 'Cormorant Garamond', serif; margin: 6px 0 2px; }
.zc-silk .sk-ctime, .zc-silk .sk-cvenue { font: 400 15.5px/1.6 'Cormorant Garamond', serif; margin: 2px 0; letter-spacing: .03em; }
.zc-silk .sk-cvenue { font-weight: 600; }
.zc-silk .sk-sec { padding: 26px 18px; }
.zc-silk .sk-panel { position: relative; overflow: hidden; max-width: 500px; margin: 10px auto; padding: 50px 28px 44px; text-align: center; border-radius: 3px;
  background: linear-gradient(118deg, #fbf7f0 0%, #f4ece0 22%, #fdfaf4 41%, #efe5d6 63%, #faf5ec 82%, #f2e9dc 100%);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .8) inset, 0 14px 30px -16px rgba(92, 64, 36, .38), 0 2px 6px rgba(92, 64, 36, .08); }
.zc-silk .sk-frame { position: absolute; inset: 11px; pointer-events: none; border: 1px solid rgba(176, 138, 74, .55); border-radius: 2px; }
.zc-silk .sk-frame::before { content: ''; position: absolute; inset: 4px; border: .8px solid rgba(176, 138, 74, .35); }
.zc-silk .sk-sash { position: absolute; top: 26px; left: -52px; width: 190px; height: 17px; transform: rotate(-45deg); pointer-events: none; z-index: 1;
  background: linear-gradient(180deg, #f2d4ca 0%, #e2b2a3 36%, #f9e6df 54%, #d6a091 80%, #c48b7c 100%); box-shadow: 0 2px 4px rgba(120, 70, 55, .18); }
[dir=rtl] .zc-silk .sk-sash, .zc-silk[dir=rtl] .sk-sash { left: auto; right: -52px; transform: rotate(45deg); }
.zc-silk .sk-panel > *:not(.sk-sash):not(.sk-frame) { position: relative; z-index: 2; }
.zc-silk .sk-sp { width: 104px; margin: -14px auto 4px; line-height: 0; } .zc-silk .sk-sprig { width: 100%; height: auto; }
.zc-silk .sk-kick { font: 400 11px/1.6 Italiana, Cinzel, serif; letter-spacing: .26em; text-transform: uppercase; margin: 0; color: var(--sk-gold); }
.zc-silk .sk-h { font: 400 44px/1.2 Allura, 'Great Vibes', cursive; color: var(--sk-script); margin: 2px 0 10px; font-weight: 400; }
.zc-silk .sk-msgt { font: italic 500 19px/1.65 'Cormorant Garamond', serif; margin: 6px 0 0; }
.zc-silk .sk-vref { font: 400 11px/1.6 Italiana, Cinzel, serif; letter-spacing: .22em; text-transform: uppercase; color: var(--sk-gold); margin: 4px 0 12px; }
.zc-silk .sk-verse { font: 400 22px/2 Amiri, 'Amiri Quran', serif; color: #5b4122; margin: 0 0 10px; direction: rtl; }
.zc-silk .sk-vtr { font: italic 500 15.5px/1.6 'Cormorant Garamond', serif; margin: 0; opacity: .9; }
.zc-silk .sk-quote { font: italic 500 23px/1.5 'Cormorant Garamond', serif; margin: 0 0 8px; color: #6b4d30; }
.zc-silk .sk-vby { font: 400 34px/1.2 Allura, cursive; color: var(--sk-script); margin: 0; }
.zc-silk .sk-cdd { font: italic 500 17px 'Cormorant Garamond', serif; margin: 0 0 14px; }
.zc-silk .sk-tail { font: italic 16px 'Cormorant Garamond', serif; margin: 12px 0 0; opacity: .85; }
.zc-silk .zc-cd { display: flex; justify-content: center; gap: 6px; direction: ltr; }
.zc-silk .zc-cell { position: relative; width: 72px; height: 72px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.zc-silk .sk-hoop { position: absolute; inset: 0; width: 100%; height: 100%; }
.zc-silk .zc-cell b { position: relative; display: block; font: 600 25px/1 'Cormorant Garamond', serif; color: #7a5631; margin-top: 4px; }
.zc-silk .zc-cell span { position: relative; display: block; font: 400 8.5px/1.3 Italiana, Cinzel, serif; letter-spacing: .12em; text-transform: uppercase; margin-top: 3px; }
.zc-silk .sk-calw { margin-top: 18px; }
.zc-silk .zc-btn { display: inline-block; padding: 11px 24px; border-radius: 30px; font: 400 12px/1 Italiana, Cinzel, serif; letter-spacing: .2em; text-transform: uppercase; color: #fffaf3; background: linear-gradient(135deg, #d7a798, #b9806f); text-decoration: none; box-shadow: 0 6px 16px rgba(140, 80, 60, .22); margin: 8px 4px 0; border: 0; }
.zc-silk .zc-btn-g { background: transparent; color: #7a5631; box-shadow: inset 0 0 0 1px rgba(168, 131, 74, .8); }
.zc-silk .sk-item { margin: 18px 0 0; } .zc-silk .sk-item h3 { font: 400 11px/1.6 Italiana, Cinzel, serif; letter-spacing: .24em; text-transform: uppercase; margin: 0 0 4px; color: var(--sk-gold); }
.zc-silk .sk-item p { margin: 2px 0; font-size: 17px; line-height: 1.5; } .zc-silk .sk-strong { font-weight: 600; font-size: 19px !important; }
.zc-silk .zc-map { margin: 18px 0 0; border-radius: 4px; overflow: hidden; height: 190px; box-shadow: inset 0 0 0 1px rgba(168, 131, 74, .4); }
.zc-silk .zc-mapph { width: 100%; height: 100%; border: 0; background: #f4eadf; color: #7a5631; font: 400 12px Italiana, Cinzel, serif; letter-spacing: .14em; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; }
.zc-silk .zc-mapph svg { width: 26px; height: 26px; }
.zc-silk .zc-map iframe { width: 100%; height: 100%; border: 0; }
.zc-silk .sk-tl { list-style: none; margin: 10px auto 0; padding: 0; max-width: 330px; text-align: start; position: relative; }
.zc-silk .sk-tl::before { content: ''; position: absolute; top: 10px; bottom: 10px; inset-inline-start: 79px; border-inline-start: 1.2px dashed rgba(201, 143, 128, .75); }
.zc-silk .sk-tl li { display: flex; align-items: center; gap: 10px; padding: 8px 0; }
.zc-silk .sk-tl time { width: 58px; flex: none; font: 600 18px 'Cormorant Garamond', serif; text-align: end; color: #7a5631; }
.zc-silk .sk-node { width: 22px; height: 26px; flex: none; position: relative; z-index: 1; background: #f8f2e9; border-radius: 50%; }
.zc-silk .sk-node svg { width: 100%; height: 100%; display: block; }
.zc-silk .sk-tl span { font-size: 17px; }
.zc-silk .zc-form { text-align: start; max-width: 360px; margin: 16px auto 0; }
.zc-silk .zc-form input, .zc-silk .zc-form textarea, .zc-silk .zc-form select { border: 0; border-bottom: 1px solid rgba(168, 131, 74, .6); background: transparent; border-radius: 0; font: 400 17px 'Cormorant Garamond', serif; color: var(--sk-ink); }
.zc-silk .zc-sub { font: italic 16px 'Cormorant Garamond', serif; margin: 2px 0 0; }
.zc-silk .sk-thx { width: 200px; margin: 10px auto; }
.zc-silk .zc-gal figure { border-radius: 3px; overflow: hidden; box-shadow: 0 0 0 4px #fbf7f0, 0 0 0 5px rgba(168, 131, 74, .4), 0 8px 18px rgba(92, 64, 36, .16); }
.zc-silk .zc-foot a { color: var(--sk-ink); opacity: .7; }
/* couple photo (off by default) in an oval silk mat */
.zc-silk .sk-pic { margin: 0; }
.zc-silk .sk-pic .zc-pic { width: 210px; max-width: 70%; aspect-ratio: 3 / 4; margin: 0 auto; border-radius: 50%; overflow: hidden; box-shadow: 0 0 0 6px #fbf6ef, 0 0 0 7px rgba(168, 131, 74, .6), 0 0 0 12px #fbf6ef, 0 0 0 13px rgba(201, 143, 128, .5), 0 12px 26px rgba(92, 64, 36, .2); }
.zc-silk .sk-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.zc-silk .zc-illu { --illu-bg: radial-gradient(ellipse at 50% 35%, #fffaf3, #f0dfd3); --illu-ln: rgba(255, 250, 240, .55); }
.zc-silk .zc-illu { --cp1: #d3a08b; --cp2: #ad7562; --cp3: #7a4b3c; --cp4: #c38e79; }
/* scratch-to-reveal in silk */
.zc-silk .zc-scr { padding: 24px 16px 32px; }
.zc-silk .zc-scr-in { position: relative; max-width: 500px; margin: 0 auto; padding: 38px 20px 32px; background: linear-gradient(118deg, #fbf7f0, #f2e9dc 50%, #faf5ec); box-shadow: inset 0 0 0 11px #faf5ec, inset 0 0 0 12px rgba(176, 138, 74, .5), 0 14px 30px -16px rgba(92, 64, 36, .38); }
.zc-silk .zc-scr-h { font: 400 42px/1.2 Allura, cursive; color: var(--sk-script); margin: 0; font-weight: 400; }
.zc-silk .zc-scr-v { font-family: 'Cormorant Garamond', serif; color: #7a5631; }
/* closing: the loose satin ribbon above the last words */
.zc-silk .sk-close { padding: 30px 20px 30px; text-align: center; }
.zc-silk .sk-closein { position: relative; max-width: 440px; margin: 0 auto; }
.zc-silk .sk-closein::before { content: ''; position: absolute; left: -30px; right: -30px; top: 20%; bottom: -30px; z-index: -1; pointer-events: none; background: radial-gradient(closest-side, rgba(252, 248, 241, .9), rgba(252, 248, 241, .7) 55%, rgba(252, 248, 241, 0)); }
.zc-silk .zc-foot { position: relative; } .zc-silk .zc-foot a { display: inline-block; padding: 4px 12px; border-radius: 20px; background: rgba(252, 248, 241, .8); }
.zc-silk .zc-btn { text-align: center; } .zc-silk .zc-btn .pi-l2 { text-align: center; }
.zc-silk .sk-ribimg { display: block; width: 230px; max-width: 64%; height: auto; margin: 0 auto 6px; }
.zc-silk .sk-closing { font: italic 500 19px 'Cormorant Garamond', serif; margin: 0; }
.zc-silk .sk-sign { font: 400 48px/1.3 Allura, cursive; color: var(--sk-script); margin: 4px 0 0; }
.zc-silk .sk-sign i { font: italic 400 .5em 'Cormorant Garamond', serif; padding: 0 .3em; color: var(--sk-blush); }
/* Arabic */
.pi-l-ar.zc-silk, .pi-l-ar.zc-silk .sk-msgt, .pi-l-ar.zc-silk .sk-item p, .pi-l-ar.zc-silk .sk-cdate, .pi-l-ar.zc-silk .sk-tl span, .pi-l-ar.zc-silk .sk-quote, .pi-l-ar.zc-silk .sk-closing, .pi-l-ar.zc-silk .sk-tail, .pi-l-ar.zc-silk .sk-cdd { font-family: Amiri, serif; font-style: normal; }
.pi-l-ar.zc-silk .sk-pre, .pi-l-ar.zc-silk .sk-kick, .pi-l-ar.zc-silk .sk-item h3, .pi-l-ar.zc-silk .zc-cell span, .pi-l-ar.zc-silk .zc-btn, .pi-l-ar.zc-silk .sk-vref { font-family: Amiri, serif; letter-spacing: 0; text-transform: none; font-size: 15px; }
.pi-l-ar.zc-silk .zc-cell span { font-size: 12px; }
.pi-l-ar.zc-silk .sk-names, .pi-l-ar.zc-silk .sk-h, .pi-l-ar.zc-silk .zc-scr-h, .pi-l-ar.zc-silk .sk-sign, .pi-l-ar.zc-silk .sk-vby { font-family: 'Aref Ruqaa', serif; }
.pi-l-ar.zc-silk .sk-names { font-size: 50px; line-height: 1.35; } .pi-l-ar.zc-silk .sk-h, .pi-l-ar.zc-silk .zc-scr-h { font-size: 33px; } .pi-l-ar.zc-silk .sk-sign { font-size: 38px; } .pi-l-ar.zc-silk .sk-vby { font-size: 26px; }
.pi-l-ar.zc-silk .sk-quote { font-size: 21px; }
.zc-silk .zc-n.is-ar { font-family: 'Aref Ruqaa', serif; font-size: .82em; }
.zc-silk .pi-l2 { display: block; font-size: .86em; opacity: .85; margin-top: 2px; }
.zc-silk .sk-names .pi-l2, .zc-silk .sk-h .pi-l2 { font-size: .62em; }
/* the cover text rises over the film's last half second (the film already equals the plate there), so there is no blank moment */
.pi.zc-silk .pi-intro { transition: opacity .6s ease, visibility .6s; will-change: opacity; }
.pi.zc-silk.sk-early .pi-intro { opacity: 0; pointer-events: none; }
.pi.zc-silk.sk-early .pi-card { opacity: 1; transition: opacity .6s ease; } /* the core keeps the card at opacity 0 until the film has ended; let it come up with the early cue */
.pi.zc-silk.sk-early .sk-cover .pi-rv { opacity: 1; transform: none; }
.zc-silk .sk-cover .pi-rv { transition: opacity .7s ease, transform .85s cubic-bezier(.2, .75, .2, 1); }
@media (prefers-reduced-motion: reduce) { .zc-silk .sk-cover .pi-rv { transition: opacity .4s !important; } }
/* the petals that keep drifting over the card (our own petal cut-outs, soft shadow baked in; transform/opacity only) */
.zc-silk .pi-fx .fx-lxwhite { width: 30px; height: 30px; background-image: url(lux/lace-petal-1.webp); opacity: .9; }
.zc-silk .pi-fx .fx-lxwhite:nth-child(3n) { background-image: url(lux/lace-petal-2.webp); width: 36px; height: 36px; }
.zc-silk .pi-fx .fx-lxwhite:nth-child(3n+1) { width: 24px; height: 24px; }
.zc-silk .pi-fx .fx-lxwhite:nth-child(5n) { background-image: url(lux/lace-petal-3.webp); }

/* --- stainedglass.css --- */
/* STAINED GLASS — opening is a pre-rendered film (lux/sg-open.mp4); live layers: the gold initials on the glass medallion, the wax seal, the hint.
   On the tap the initials fade and the seal lifts a little and melts into a soft glow (transform/opacity only) — no crack, no crumbs. */
.pi.zc-stainedglass .lxv-box, .zc-stainedglass .lxv-box { background: #ad8e62; }
.zc-stainedglass .lxm { transition: opacity .9s cubic-bezier(.4, 0, .2, 1) .05s; }
.zc-stainedglass .lxm span { font-family: Allura, 'Great Vibes', cursive; letter-spacing: 0; word-spacing: -.14em; background: linear-gradient(172deg, #d9b468 0%, #9a6a24 34%, #6e4813 58%, #b58a3e 82%, #7a5218 100%); filter: drop-shadow(0 0 1px rgba(255, 246, 220, .9)) drop-shadow(0 1px 1.5px rgba(70, 45, 10, .35)); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; text-shadow: none; padding: .12em .25em; display: inline-block; }
.zc-stainedglass .lxm.is-ar span { font-family: 'Aref Ruqaa', Amiri, serif; font-weight: 700; }
.zc-stainedglass .lxs { transition: opacity 1.1s cubic-bezier(.4, 0, .2, 1) .05s, transform 1.6s cubic-bezier(.4, 0, .2, 1); }
.zc-stainedglass .is-open .lxs, .zc-stainedglass.is-open .lxs, .zc-stainedglass .is-play .lxs { opacity: 0; transform: translate(-50%, -60%) scale(1.06); }
.zc-stainedglass .lxs.is-crack .lxs-a, .zc-stainedglass .lxs.is-crack .lxs-b { transform: none; opacity: 1; }
.zc-stainedglass .lxs-cr { display: none; }
.zc-stainedglass .lxs-halo { background: radial-gradient(circle, rgba(255, 238, 200, .5), rgba(255, 238, 200, 0) 62%); }
.zc-stainedglass .is-open .lxs-halo, .zc-stainedglass .is-play .lxs-halo { opacity: 0; transition: opacity 1s ease; }
@media (prefers-reduced-motion: reduce) { .zc-stainedglass .lxs, .zc-stainedglass .lxm { transition: opacity .6s ease; } }
/* the "tap" hint: a small pearl-glass pill with a gold hairline, low on the doors */
.pi-in-stainedglass .pi-hint { bottom: 7%; text-shadow: none; }
.pi-in-stainedglass .pi-hint-t { display: inline-block; padding: 9px 20px 10px; border-radius: 999px; background: rgba(253, 250, 241, .94); border: 1px solid rgba(169, 132, 70, .75); color: #4b5530;
  box-shadow: 0 8px 20px -10px rgba(70, 55, 25, .5), inset 0 0 0 3px rgba(255, 255, 255, .5); font-family: Cinzel, 'Cormorant Garamond', serif; font-weight: 400; font-size: 12.5px; letter-spacing: .2em; text-transform: uppercase; }
.pi-l-ar .pi-in-stainedglass .pi-hint-t, .pi-in-stainedglass .pi-hint-t .pi-l2 { letter-spacing: 0; text-transform: none; }
.pi-l-ar .pi-in-stainedglass .pi-hint-t { font-family: 'Amiri', serif; font-size: 17px; }
.pi-in-stainedglass .pi-hint-t > .pi-l2 { display: block; font-family: 'Amiri', serif; font-size: 14px; letter-spacing: 0; margin-top: 1px; }

/* ---- the inner card: arched panes of pearl glass held in fine lead came, olive and gold type on ivory, glass roses ---- */
.pi.zc-stainedglass { --sg-ink: #46502c; --sg-olive: #55612f; --sg-gold: #9c7a3c; --sg-gold2: #c9a96a; --sg-sage: #8e9a6c; --sg-blush: #c4907e; color: var(--sg-ink); font-family: 'Cormorant Garamond', Georgia, serif; }
.zc-stainedglass .sg-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.zc-stainedglass .zc-card { position: relative; z-index: 2; padding: 0 0 30px; }
.zc-stainedglass .sg-cover { min-height: 100vh; min-height: 100svh; display: flex; align-items: center; justify-content: center; text-align: center; padding: 64px 44px; position: relative; }
.zc-stainedglass .sg-cv { max-width: 300px; position: relative; }
.zc-stainedglass .sg-cv::before { content: ''; position: absolute; left: -34px; right: -34px; top: -50px; bottom: -56px; z-index: -1; pointer-events: none; background: radial-gradient(closest-side, rgba(255, 252, 244, .8), rgba(255, 251, 240, .55) 60%, rgba(255, 251, 240, 0)); }
.zc-stainedglass .zc-bism { font: 700 21px/1.6 Amiri, serif; color: var(--sg-gold); margin: 0 0 8px; }
.zc-stainedglass .sg-pre { font: 400 11px/1.8 Cinzel, serif; letter-spacing: .22em; text-transform: uppercase; margin: 0 auto 4px; color: var(--sg-olive); text-wrap: balance; }
.zc-stainedglass .sg-names { font: 400 60px/1.08 Allura, 'Great Vibes', cursive; color: var(--sg-olive); margin: 6px 0 2px; font-weight: 400; }
.zc-stainedglass .sg-names .zc-n { display: inline-block; } .zc-stainedglass .sg-names .zc-amp { display: block; font: italic 400 26px/1.1 'Cormorant Garamond', serif; color: var(--sg-gold); margin: 0; }
.zc-stainedglass .zc-names2 { font: italic 500 19px 'Cormorant Garamond', serif; margin: 2px 0 6px; }
.zc-stainedglass .zc-parents p, .zc-stainedglass .zc-guest { font: italic 17px 'Cormorant Garamond', serif; margin: 4px 0; }
.zc-stainedglass .sg-inv { font: italic 500 18px/1.45 'Cormorant Garamond', serif; margin: 8px auto 2px; max-width: 250px; text-wrap: balance; }
.zc-stainedglass .sg-rw { width: 190px; max-width: 70%; margin: 10px auto 8px; line-height: 0; }
.zc-stainedglass .sg-sprig { width: 100%; height: auto; display: block; }
.zc-stainedglass .sg-dow { font: 400 11.5px/1.6 Cinzel, serif; letter-spacing: .3em; text-transform: uppercase; margin: 0; color: var(--sg-gold); }
.zc-stainedglass .sg-cdate { font: 500 24px/1.3 'Cormorant Garamond', serif; margin: 2px 0; letter-spacing: .02em; }
.zc-stainedglass .sg-ctime, .zc-stainedglass .sg-cvenue { font: 400 15.5px/1.6 'Cormorant Garamond', serif; margin: 2px 0; letter-spacing: .03em; }
.zc-stainedglass .sg-cvenue { font: 400 11.5px/1.8 Cinzel, serif; letter-spacing: .16em; text-transform: uppercase; color: var(--sg-olive); margin-top: 6px; }
.zc-stainedglass .sg-sec { padding: 22px 16px; position: relative; }
.zc-stainedglass .sg-pane { position: relative; max-width: 480px; margin: 14px auto; padding: 62px 26px 40px; text-align: center; border-radius: 200px 200px 6px 6px / 110px 110px 6px 6px;
  background: linear-gradient(162deg, rgba(255, 253, 247, .95) 0%, rgba(246, 242, 229, .94) 34%, rgba(253, 250, 242, .95) 58%, rgba(241, 238, 222, .94) 100%);
  box-shadow: 0 0 0 1.6px #8a7a4c, 0 0 0 5px rgba(253, 250, 240, .92), 0 0 0 6.2px rgba(169, 132, 70, .6), 0 18px 30px -18px rgba(60, 52, 24, .5); }
.zc-stainedglass .sg-pane::before { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: .55;
  background: radial-gradient(120% 60% at 18% 8%, rgba(255, 228, 214, .5), rgba(255, 228, 214, 0) 60%), radial-gradient(90% 50% at 88% 30%, rgba(214, 232, 208, .5), rgba(214, 232, 208, 0) 60%), radial-gradient(100% 60% at 50% 100%, rgba(255, 238, 200, .55), rgba(255, 238, 200, 0) 65%); }
.zc-stainedglass .sg-lead { position: absolute; inset: 9px; pointer-events: none; border: 1px solid rgba(156, 122, 60, .55); border-radius: 192px 192px 3px 3px / 104px 104px 3px 3px; }
.zc-stainedglass .sg-lead::after { content: ''; position: absolute; left: 50%; top: -9px; width: 1px; height: 26px; background: linear-gradient(rgba(156, 122, 60, .7), rgba(156, 122, 60, 0)); }
.zc-stainedglass .sg-shine { position: absolute; inset: 0; border-radius: inherit; overflow: hidden; pointer-events: none; }
.zc-stainedglass .sg-shine::before { content: ''; position: absolute; top: -10%; bottom: -10%; left: 0; width: 46%; transform: translate3d(-130%, 0, 0) skewX(-16deg); background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 250, 232, .55), rgba(255, 255, 255, 0)); }
.zc-stainedglass .sg-pane.in .sg-shine::before { animation: sgShine 2.6s cubic-bezier(.4, 0, .2, 1) .5s 1 both; }
@keyframes sgShine { from { transform: translate3d(-130%, 0, 0) skewX(-16deg); } to { transform: translate3d(330%, 0, 0) skewX(-16deg); } }
@media (prefers-reduced-motion: reduce) { .zc-stainedglass .sg-pane.in .sg-shine::before { animation: none; } }
.zc-stainedglass .sg-pane > *:not(.sg-lead):not(.sg-shine) { position: relative; z-index: 2; }
.zc-stainedglass .sg-sp { width: 132px; margin: -18px auto 6px; line-height: 0; }
.zc-stainedglass .sg-kick { font: 400 10.5px/1.6 Cinzel, serif; letter-spacing: .26em; text-transform: uppercase; margin: 0; color: var(--sg-gold); }
.zc-stainedglass .sg-h { font: 400 46px/1.15 Allura, 'Great Vibes', cursive; color: var(--sg-olive); margin: 2px 0 10px; font-weight: 400; }
.zc-stainedglass .sg-msgt { font: italic 500 19px/1.65 'Cormorant Garamond', serif; margin: 6px 0 0; }
.zc-stainedglass .sg-vref { font: 400 10.5px/1.6 Cinzel, serif; letter-spacing: .24em; text-transform: uppercase; color: var(--sg-gold); margin: 2px 0 12px; }
.zc-stainedglass .sg-verse { font: 400 22px/2 Amiri, 'Amiri Quran', serif; color: #4a5229; margin: 0 0 10px; direction: rtl; }
.zc-stainedglass .sg-vtr { font: italic 500 15.5px/1.6 'Cormorant Garamond', serif; margin: 0; opacity: .9; }
.zc-stainedglass .sg-quote { font: italic 500 23px/1.5 'Cormorant Garamond', serif; margin: 0 0 8px; color: #4f5a30; }
.zc-stainedglass .sg-vby { font: 400 34px/1.2 Allura, cursive; color: var(--sg-gold); margin: 0; }
.zc-stainedglass .sg-cdd { font: italic 500 17px 'Cormorant Garamond', serif; margin: 0 0 14px; }
.zc-stainedglass .sg-tail { font: italic 16px 'Cormorant Garamond', serif; margin: 12px 0 0; opacity: .85; }
.zc-stainedglass .zc-cd { display: flex; justify-content: center; gap: 5px; direction: ltr; }
.zc-stainedglass .zc-cell { position: relative; width: 72px; height: 76px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding-top: 6px; }
.zc-stainedglass .sg-round { position: absolute; inset: 0; width: 100%; height: 100%; }
.zc-stainedglass .zc-cell b { position: relative; display: block; font: 600 24px/1 'Cormorant Garamond', serif; color: var(--sg-olive); margin-top: 2px; }
.zc-stainedglass .zc-cell span { position: relative; display: block; font: 400 8px/1.3 Cinzel, serif; letter-spacing: .12em; text-transform: uppercase; margin-top: 3px; color: var(--sg-gold); }
.zc-stainedglass .sg-calw { margin-top: 18px; }
.zc-stainedglass .zc-btn { display: inline-block; padding: 11px 24px; border-radius: 30px; font: 400 11.5px/1 Cinzel, serif; letter-spacing: .18em; text-transform: uppercase; color: #fffbf0; background: linear-gradient(135deg, #7f8c58, #55612f); text-decoration: none; box-shadow: 0 6px 16px rgba(60, 70, 30, .25), inset 0 0 0 1px rgba(233, 208, 150, .55); margin: 8px 4px 0; border: 0; text-align: center; }
.zc-stainedglass .zc-btn-g { background: rgba(255, 252, 244, .7); color: var(--sg-olive); box-shadow: inset 0 0 0 1px rgba(156, 122, 60, .8); }
.zc-stainedglass .zc-btn .pi-l2 { text-align: center; }
/* the venue sits inside a real leaded-glass frame (border-image of our glass frame; the pearl window stretches with the text) */
.zc-stainedglass .sg-details { text-align: center; }
.zc-stainedglass .sg-details > .sg-sp { margin-top: 0; }
.zc-stainedglass .sg-frame { max-width: 350px; margin: 4px auto 0; border-style: solid; border-width: 60px 61px 82px 60px; border-image: url(lux/sg-frame.webp) 121 123 166 121 fill stretch; filter: drop-shadow(0 14px 18px rgba(60, 50, 20, .28)); }
.zc-stainedglass .sg-fin { padding: 6px 2px 2px; min-height: 230px; display: flex; flex-direction: column; justify-content: center; }
.zc-stainedglass .sg-item { margin: 8px 0; } .zc-stainedglass .sg-item h3 { font: 400 10.5px/1.6 Cinzel, serif; letter-spacing: .24em; text-transform: uppercase; margin: 0 0 3px; color: var(--sg-gold); }
.zc-stainedglass .sg-item p { margin: 1px 0; font-size: 17px; line-height: 1.45; } .zc-stainedglass .sg-strong { font-weight: 600; font-size: 19px !important; color: var(--sg-olive); }
.zc-stainedglass .sg-item .zc-btn { padding: 9px 16px; font-size: 10.5px; }
.zc-stainedglass .zc-map { max-width: 350px; margin: 16px auto 0; border-radius: 120px 120px 6px 6px / 60px 60px 6px 6px; overflow: hidden; height: 190px; box-shadow: 0 0 0 1.5px #8a7a4c, 0 0 0 5px rgba(253, 250, 240, .9), 0 0 0 6px rgba(169, 132, 70, .55); }
.zc-stainedglass .zc-mapph { width: 100%; height: 100%; border: 0; background: linear-gradient(160deg, #fbf8ef, #efeadb); color: var(--sg-olive); font: 400 11px Cinzel, serif; letter-spacing: .14em; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; }
.zc-stainedglass .zc-mapph svg { width: 26px; height: 26px; }
.zc-stainedglass .zc-map iframe { width: 100%; height: 100%; border: 0; }
/* small glass ornaments (our own renders) */
.zc-stainedglass .sg-orn { display: block; height: auto; margin: 0 auto; pointer-events: none; }
.zc-stainedglass .sg-o-clock { width: 84px; margin: -40px auto 4px; }
.zc-stainedglass .sg-o-couple { width: 112px; margin: -30px auto 2px; }
.zc-stainedglass .sg-o-gift { width: 92px; margin: -30px auto 2px; }
.zc-stainedglass .sg-o-garland { width: 330px; max-width: 88%; margin: 0 auto -34px; position: relative; z-index: 3; }
.zc-stainedglass .zc-blk .sg-orn.pi-rv { opacity: 1; transform: none; }
/* programme: a lead line with glass roses */
.zc-stainedglass .sg-tl { list-style: none; margin: 10px auto 0; padding: 0; max-width: 320px; text-align: start; position: relative; }
.zc-stainedglass .sg-tl::before { content: ''; position: absolute; top: 12px; bottom: 12px; inset-inline-start: 79px; width: 0; border-inline-start: 1.6px solid rgba(138, 122, 76, .75); box-shadow: 1px 0 0 rgba(255, 250, 235, .8); }
.zc-stainedglass .sg-tl li { display: flex; align-items: center; gap: 10px; padding: 8px 0; }
.zc-stainedglass .sg-tl time { width: 58px; flex: none; font: 600 18px 'Cormorant Garamond', serif; text-align: end; color: var(--sg-olive); }
.zc-stainedglass .sg-node { width: 24px; height: 24px; flex: none; position: relative; z-index: 1; background: #faf6ec; border-radius: 50%; }
.zc-stainedglass .sg-node svg { width: 100%; height: 100%; display: block; }
.zc-stainedglass .sg-tl span { font-size: 17px; }
.zc-stainedglass .sg-div { width: 250px; max-width: 70%; margin: 0 auto 4px; line-height: 0; }
.zc-stainedglass .sg-div img { width: 100%; height: auto; display: block; }
.zc-stainedglass .zc-form { text-align: start; max-width: 360px; margin: 16px auto 0; }
.zc-stainedglass .zc-form input, .zc-stainedglass .zc-form textarea, .zc-stainedglass .zc-form select { border: 0; border-bottom: 1px solid rgba(156, 122, 60, .6); background: transparent; border-radius: 0; font: 400 17px 'Cormorant Garamond', serif; color: var(--sg-ink); }
.zc-stainedglass .zc-form legend, .zc-stainedglass .zc-form label > span { font: 400 10.5px/1.6 Cinzel, serif; letter-spacing: .16em; text-transform: uppercase; color: var(--sg-gold); }
.zc-stainedglass .zc-seg span { font-family: 'Cormorant Garamond', serif; font-size: 16px; }
.zc-stainedglass .zc-sub { font: italic 16px 'Cormorant Garamond', serif; margin: 2px 0 0; }
.zc-stainedglass .sg-thx { width: 160px; margin: 10px auto; }
.zc-stainedglass .zc-gal figure { border-radius: 60px 60px 4px 4px / 40px 40px 4px 4px; overflow: hidden; box-shadow: 0 0 0 1.5px #8a7a4c, 0 0 0 4px #fbf8ef, 0 0 0 5px rgba(169, 132, 70, .5), 0 8px 18px rgba(60, 50, 20, .16); }
/* couple photo (off by default) in an arched glass window */
.zc-stainedglass .sg-pic { margin: 0; }
.zc-stainedglass .sg-pic .zc-pic { width: 210px; max-width: 70%; aspect-ratio: 3 / 4; margin: 0 auto; border-radius: 110px 110px 6px 6px / 80px 80px 6px 6px; overflow: hidden; box-shadow: 0 0 0 1.6px #8a7a4c, 0 0 0 6px #fbf8ef, 0 0 0 7.2px rgba(169, 132, 70, .65), 0 12px 26px rgba(60, 50, 20, .2); }
.zc-stainedglass .sg-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.zc-stainedglass .zc-illu { --illu-bg: radial-gradient(ellipse at 50% 35%, #fffdf6, #e9ecd9); --illu-ln: rgba(255, 252, 240, .55); }
.zc-stainedglass .zc-illu { --cp1: #d8bd7f; --cp2: #b08c4f; --cp3: #7f5f2c; --cp4: #c9a766; }
/* scratch-to-reveal in glass */
.zc-stainedglass .zc-scr { padding: 24px 16px 32px; }
.zc-stainedglass .zc-scr-in { position: relative; max-width: 480px; margin: 0 auto; padding: 44px 20px 32px; border-radius: 200px 200px 6px 6px / 110px 110px 6px 6px; background: linear-gradient(162deg, #fffdf7, #f2eee0 50%, #fbf8ef); box-shadow: 0 0 0 1.6px #8a7a4c, 0 0 0 5px rgba(253, 250, 240, .92), 0 0 0 6.2px rgba(169, 132, 70, .6), 0 18px 30px -18px rgba(60, 52, 24, .5); }
.zc-stainedglass .zc-scr-h { font: 400 42px/1.2 Allura, cursive; color: var(--sg-olive); margin: 0; font-weight: 400; }
.zc-stainedglass .zc-scr-v { font-family: 'Cormorant Garamond', serif; color: var(--sg-olive); }
/* closing */
.zc-stainedglass .sg-close { padding: 30px 20px 30px; text-align: center; }
.zc-stainedglass .sg-closein { position: relative; max-width: 420px; margin: 0 auto; }
.zc-stainedglass .sg-closein::before { content: ''; position: absolute; left: -30px; right: -30px; top: -10px; bottom: -30px; z-index: -1; pointer-events: none; background: radial-gradient(closest-side, rgba(255, 252, 244, .92), rgba(255, 251, 240, .7) 55%, rgba(255, 251, 240, 0)); }
.zc-stainedglass .sg-closein .sg-div { opacity: 1; transform: none; }
.zc-stainedglass .sg-closing { font: italic 500 19px 'Cormorant Garamond', serif; margin: 4px 0 0; }
.zc-stainedglass .sg-sign { font: 400 50px/1.3 Allura, cursive; color: var(--sg-olive); margin: 4px 0 0; }
.zc-stainedglass .sg-sign i { font: italic 400 .5em 'Cormorant Garamond', serif; padding: 0 .3em; color: var(--sg-gold); }
.zc-stainedglass .zc-foot { position: relative; } .zc-stainedglass .zc-foot a { display: inline-block; padding: 4px 12px; border-radius: 20px; background: rgba(255, 252, 244, .82); color: var(--sg-ink); opacity: .75; }
/* Arabic */
.pi-l-ar.zc-stainedglass, .pi-l-ar.zc-stainedglass .sg-msgt, .pi-l-ar.zc-stainedglass .sg-item p, .pi-l-ar.zc-stainedglass .sg-cdate, .pi-l-ar.zc-stainedglass .sg-tl span, .pi-l-ar.zc-stainedglass .sg-quote, .pi-l-ar.zc-stainedglass .sg-closing, .pi-l-ar.zc-stainedglass .sg-tail, .pi-l-ar.zc-stainedglass .sg-cdd, .pi-l-ar.zc-stainedglass .sg-inv, .pi-l-ar.zc-stainedglass .sg-ctime { font-family: Amiri, serif; font-style: normal; }
.pi-l-ar.zc-stainedglass .sg-pre, .pi-l-ar.zc-stainedglass .sg-kick, .pi-l-ar.zc-stainedglass .sg-item h3, .pi-l-ar.zc-stainedglass .zc-cell span, .pi-l-ar.zc-stainedglass .zc-btn, .pi-l-ar.zc-stainedglass .sg-vref, .pi-l-ar.zc-stainedglass .sg-dow, .pi-l-ar.zc-stainedglass .sg-cvenue, .pi-l-ar.zc-stainedglass .zc-form legend, .pi-l-ar.zc-stainedglass .zc-form label > span { font-family: Amiri, serif; letter-spacing: 0; text-transform: none; font-size: 15px; }
.pi-l-ar.zc-stainedglass .zc-cell span { font-size: 12px; }
.pi-l-ar.zc-stainedglass .sg-names, .pi-l-ar.zc-stainedglass .sg-h, .pi-l-ar.zc-stainedglass .zc-scr-h, .pi-l-ar.zc-stainedglass .sg-sign, .pi-l-ar.zc-stainedglass .sg-vby { font-family: 'Aref Ruqaa', serif; }
.pi-l-ar.zc-stainedglass .sg-names { font-size: 48px; line-height: 1.35; } .pi-l-ar.zc-stainedglass .sg-h, .pi-l-ar.zc-stainedglass .zc-scr-h { font-size: 32px; } .pi-l-ar.zc-stainedglass .sg-sign { font-size: 38px; } .pi-l-ar.zc-stainedglass .sg-vby { font-size: 26px; }
.pi-l-ar.zc-stainedglass .sg-quote { font-size: 21px; }
.zc-stainedglass .zc-n.is-ar { font-family: 'Aref Ruqaa', serif; font-size: .82em; }
.zc-stainedglass .pi-l2 { display: block; font-size: .86em; opacity: .85; margin-top: 2px; }
.zc-stainedglass .sg-names .pi-l2, .zc-stainedglass .sg-h .pi-l2 { font-size: .62em; }
/* the card's plate sits exactly where the film's last frame is (no camera zoom at the hand-off); once open it breathes in very slowly */
.pi-t-stainedglass .lx-cam, .pi-t-stainedglass.lx-reveal .lx-cam { transform: scale(1); transition: transform 16s cubic-bezier(.3, 0, .3, 1) 1.2s; }
.pi-t-stainedglass.is-opened .lx-cam { transform: scale(1.035); }
@media (prefers-reduced-motion: reduce) { .pi-t-stainedglass.is-opened .lx-cam { transform: scale(1); } }
/* the cover text rises over the film's last half second (the film already equals the plate there), so there is no blank moment */
.pi.zc-stainedglass .pi-intro { transition: opacity .6s ease, visibility .6s; will-change: opacity; }
.pi.zc-stainedglass.sg-early .pi-intro { opacity: 0; pointer-events: none; }
.pi.zc-stainedglass.sg-early .pi-card { opacity: 1; transition: opacity .6s ease; } /* the core keeps the card at opacity 0 until the film has ended; let it come up with the early cue */
.pi.zc-stainedglass.sg-early .sg-cover .pi-rv { opacity: 1; transform: none; }
.zc-stainedglass .sg-cover .pi-rv { transition: opacity .7s ease, transform .85s cubic-bezier(.2, .75, .2, 1); }
@media (prefers-reduced-motion: reduce) { .zc-stainedglass .sg-cover .pi-rv { transition: opacity .4s !important; } }
/* drifting over the card: ivory petals and a few soft gold glints (transform/opacity only) */
.zc-stainedglass .pi-fx .fx-lxwhite { width: 28px; height: 28px; background-image: url(lux/lace-petal-1.webp); opacity: .9; }
.zc-stainedglass .pi-fx .fx-lxwhite:nth-child(3n) { background-image: url(lux/lace-petal-2.webp); width: 34px; height: 34px; }
.zc-stainedglass .pi-fx .fx-lxwhite:nth-child(3n+1) { width: 22px; height: 22px; }
.zc-stainedglass .pi-fx .fx-lxwhite:nth-child(4n) { width: 7px; height: 7px; border-radius: 50%; background: radial-gradient(circle, #fff8dc 0%, #ecc87e 40%, rgba(236, 200, 126, 0) 72%); opacity: .95; }
/* reply buttons: olive glass when chosen */
.zc-stainedglass .pi-seg span { border-radius: 40px; border-color: rgba(156, 122, 60, .55); background: rgba(255, 252, 244, .6); color: var(--sg-ink); font-family: 'Cormorant Garamond', serif; font-size: 16px; font-weight: 500; }
.zc-stainedglass .pi-seg input:checked + span { background: linear-gradient(135deg, #8a9763, #55612f); color: #fffbf0; border-color: transparent; box-shadow: inset 0 0 0 1px rgba(233, 208, 150, .55), 0 4px 12px rgba(60, 70, 30, .22); }
.pi-l-ar.zc-stainedglass .pi-seg span { font-family: Amiri, serif; }
/* section titles that sit straight on the glass window get a soft pearl veil so they read over the roses */
.zc-stainedglass .sg-vh { position: relative; display: block; width: fit-content; max-width: 100%; margin: 0 auto; padding: 4px 26px 0; }
.zc-stainedglass .sg-vh::before { content: ''; position: absolute; left: -10px; right: -10px; top: -14px; bottom: -6px; z-index: -1; pointer-events: none; background: radial-gradient(closest-side, rgba(255, 252, 244, .92), rgba(255, 251, 240, .7) 60%, rgba(255, 251, 240, 0)); }

/* --- zz-textclip.css --- */
/* ---------- v1.9.1: room for gold script swashes ----------
   Gold names and headings are painted with background-clip:text, which only paints inside the element's box,
   so script swashes, tails and Arabic marks reaching past the box were cut off. Extra padding widens the
   painted area and an equal negative margin keeps every line exactly where it was. */
.pi.zc-grand .zc-names .zc-n,
.pi.zc-grand .zg-h .zc-ht,
.pi.zc-grand .zg-dd b,
.pi.zc-grand .zg-sign,
.pi.zc-grand .zc-bism,
.pi.zc-archdoor .zc-names .zc-n,
.pi.zc-archdoor .za-wash b,
.pi.zc-archdoor .za-sign,
.pi.zc-palace .zc-names .zc-n,
.pi.zc-palace .zp-date b,
.pi.zc-palace .zp-h .zc-ht,
.pi.zc-palace .zp-sign,
.pi.zc-velvet .zv-mono span,
.pi.zc-velvet .zc-names .zc-n,
.pi.zc-velvet .zv-date b,
.pi.zc-velvet .zv-no,
.pi.zc-velvet .zv-sign,
.pi.zc-chateau .zc-names .zc-amp,
.pi.zc-chateau .zh-tag b,
.pi.zc-gatefold .gf-names .zc-amp em,
.pi.zc-gatefold .gf-h .zc-ht,
.pi.zc-gatefold .zc-bism,
.pi.zc-gatefold .gf-rs,
.pi.zc-gatefold .gf-em .zc-cell b,
.pi.zc-gatefold .gf-wax b,
.pi.zc-gatefold .gf-sign i,
.pi.zc-irongate .ig-names .zc-n,
.pi.zc-irongate .ig-h .zc-ht,
.pi.zc-irongate .ig-dd b,
.pi.zc-irongate .ig-sign,
.pi.zc-irongate .zc-bism,
.pi.zc-jewel .jw-names .zc-n,
.pi.zc-jewel .jw-velvet .jw-h .zc-ht,
.pi.zc-lanterns .ln-names .zc-n,
.pi.zc-lanterns .ln-h .zc-ht,
.pi.zc-lanterns .ln-sign,
.pi.zc-lanterns .zc-bism,
.pi.zc-lanterns .ln-strong,
.pi.zc-letter .zc-names .zc-n,
.pi.zc-letter .zl-dmy b,
.pi.zc-letter .zl-h .zc-ht,
.pi.zc-moon .mn-names .zc-n,
.pi.zc-moon .mn-dd b,
.pi.zc-moon .mn-h .zc-ht,
.pi.zc-moon .mn-tl time,
.pi.zc-moon .zc-bism,
.pi.zc-moon .mn-amp,
.pi.zc-moon .mn-sign,
.pi.zc-moon .zc-names2,
.pi.zc-moon .mn-q,
.pi.zc-rosewall .zc-names .zc-n,
.pi.zc-rosewall .rw-dd b,
.pi.zc-rosewall .rw-mono,
.pi.zc-rosewall .rw-sign { padding: .5em .3em; margin: -.5em -.3em; }
.pi.zc-archdoor .zc-names .zc-n { padding-block: calc(.5em + 0px) calc(.5em + 0px); padding-inline: calc(.3em + .1em) calc(.3em + .1em); }
.pi.zc-palace .zc-names .zc-n { padding-block: calc(.5em + 0px) calc(.5em + 0px); padding-inline: calc(.3em + .12em) calc(.3em + .12em); }
.pi.zc-velvet .zc-names .zc-n { padding-block: calc(.5em + 0px) calc(.5em + 0px); padding-inline: calc(.3em + .12em) calc(.3em + .12em); }
.pi.zc-irongate .ig-names .zc-n { padding-block: calc(.5em + 0px) calc(.5em + 0px); padding-inline: calc(.3em + .12em) calc(.3em + .12em); }
.pi.zc-irongate .ig-names .zc-n.is-ar { padding-block: calc(.5em + 0px) calc(.5em + 0px); padding-inline: calc(.3em + 0px) calc(.3em + 0px); }
.pi.zc-lanterns .ln-names .zc-n { padding-block: calc(.5em + 0px) calc(.5em + 0px); padding-inline: calc(.3em + .14em) calc(.3em + .14em); }
.pi.zc-lanterns .ln-names .zc-n.is-ar { padding-block: calc(.5em + 0px) calc(.5em + 0px); padding-inline: calc(.3em + 0px) calc(.3em + 0px); }
.pi.zc-lanterns .ln-sign { padding-block: calc(.5em + 0px) calc(.5em + 16px); padding-inline: calc(.3em + 12px) calc(.3em + 12px); }
.pi.zc-rosewall .zc-names .zc-n { padding-block: calc(.5em + 0px) calc(.5em + 0px); padding-inline: calc(.3em + .12em) calc(.3em + .12em); }
.pi.zc-letter .zc-names .zc-n { padding-block: calc(.5em + 0px) calc(.5em + 0px); padding-inline: calc(.3em + .14em) calc(.3em + 0px); }
.pi.zc-letter .zc-names .zc-n.is-ar { padding-block: calc(.5em + 0px) calc(.5em + 0px); padding-inline: calc(.3em + 0px) calc(.3em + 0px); }
.pi.zc-letter .zl-h .zc-ht { padding-block: calc(.5em + 0px) calc(.5em + 0px); padding-inline: calc(.3em + .34em) calc(.3em + 0px); }
.pi.zc-moon .mn-names .zc-n { padding-block: calc(.5em + 0px) calc(.5em + 0px); padding-inline: calc(.3em + .14em) calc(.3em + 0px); }
.pi.zc-moon .mn-names .zc-n.is-ar { padding-block: calc(.5em + 0px) calc(.5em + 0px); padding-inline: calc(.3em + 0px) calc(.3em + 0px); }
.pi.zc-moon .mn-h .zc-ht { padding-block: calc(.5em + 0px) calc(.5em + 0px); padding-inline: calc(.3em + .2em) calc(.3em + 0px); }
.pi.zc-moon .mn-tl time { padding-block: calc(.5em + 0px) calc(.5em + 0px); padding-inline: calc(.3em + 0px) calc(.3em + 6px); }
.pi.zc-jewel .jw-names .zc-n { padding-block: calc(.5em + 2px) calc(.5em + 2px); padding-inline: calc(.3em + 0px) calc(.3em + 0px); }
.pi.pi-l-ar.zc-letter .zl-h .zc-ht { padding: .5em .3em; }
.pi.pi-l-ar.zc-moon .mn-h .zc-ht { padding: .5em .3em; }
.pi.zc-chateau .zc-names .zc-amp { margin-top: calc(-2px - .5em); margin-bottom: calc(-2px - .5em); }
.pi.zc-moon .zc-names2 { padding-block: 0; margin-block: 4px 8px; }
.pi.zc-grand .zc-bism { padding-top: 0; margin-top: 0px; margin-bottom: calc(6px - .5em); }
.pi.zc-gatefold .zc-bism { padding-top: 0; margin-top: 0px; margin-bottom: calc(6px - .5em); }
.pi.zc-irongate .zc-bism { padding-top: 0; margin-top: 4px; margin-bottom: calc(6px - .5em); }
.pi.zc-lanterns .zc-bism { padding-top: 0; margin-top: 2px; margin-bottom: calc(4px - .5em); }
.pi.zc-moon .zc-bism { padding-top: 0; margin-top: 0px; margin-bottom: calc(10px - .5em); }
.pi.zc-rosewall .rw-sign { margin-top: calc(6px - .5em) !important; }
/* neighbours with negative margins: negative margins collapse to the most negative, so they carry the extra too */
.pi.zc-moon .mn-names .zc-n, .pi.zc-moon .mn-names .zc-n.is-ar { padding-block: 30px; margin-block: -30px; }
.pi.zc-moon .mn-names .zc-amp { margin-top: calc(-6px - 30px); margin-bottom: calc(-10px - 30px); }
.pi.zc-letter .zc-names .zc-n, .pi.zc-letter .zc-names .zc-n.is-ar { padding-block: 30px; margin-block: -30px; }
.pi.zc-letter .zl-names .zc-amp { margin-top: calc(-2px - 30px); }
/* the rosewall monogram is centred with translateY(-60%) of its own height: give back the extra padding */
.pi.zc-rosewall .rw-mono { transform: translateY(calc(-60% + 1.2 * .5em)); }
.pi.zc-moon .mn-q { box-sizing: content-box; }
/* bilingual headings (inline, with the second language as a block inside): no end-side room, so no empty extra line is created after the block */
.pi.zc-gatefold .gf-h .zc-ht.pi-bi,
.pi.zc-irongate .ig-h .zc-ht.pi-bi,
.pi.zc-jewel .jw-velvet .jw-h .zc-ht.pi-bi,
.pi.zc-lanterns .ln-h .zc-ht.pi-bi { padding-inline-end: 0; margin-inline-end: 0; }