/* Signature finish: silk ivory, botanical sage and restrained antique gold. */
@font-face {
  font-family: "Signature Ethiopic";
  src: url("../fonts/EthiopicLeTewahedo-Regular.ttf") format("truetype");
  font-display: swap;
}
.signature-opening {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  overflow: hidden;
  color: #f0ecd9;
  background: transparent;
  perspective: 1400px;
  isolation: isolate;
  font-family: Georgia, "Signature Ethiopic", serif;
}
.signature-door { position: absolute; top: 0; bottom: 0; width: calc(50% + 1px); overflow: hidden; backface-visibility: hidden; will-change: transform;
  background: radial-gradient(ellipse at 12% 15%, #7d88604a, transparent 60%), repeating-linear-gradient(91deg, #ffffff03 0 1px, transparent 1px 4px), linear-gradient(115deg, #414c35, #596448 46%, #36412e);
  box-shadow: inset 0 0 70px #18201640, 0 0 45px #18201660;
}
.signature-door-left { left: 0; transform-origin: left center; border-right: 1px solid #c4b07e5c; }
.signature-door-right { right: 0; transform-origin: right center; background-color: #45503a; border-left: 1px solid #1c271e8c; }
.signature-door::after { content: ""; position: absolute; inset: -30%; background: linear-gradient(112deg, transparent 32%, #f8f2d918 47%, transparent 60%); transform: translateX(-15%); animation: signature-silk 4700ms ease both; }
.signature-engraving { position: absolute; inset: 0 auto 0 0; width: 200%; height: 100%; fill: none; stroke: #d8c48a; stroke-width: .75; opacity: .54; }
.signature-door-right .signature-engraving { left: -100%; }
.engraved-arch { stroke-width: .65; }
.engraved-leaves { fill: #c4b07e15; stroke-width: .6; }
.signature-deboss { position: absolute; top: 15%; font: italic clamp(150px, 38vw, 340px)/1 Georgia, serif; color: #26352022; text-shadow: 1px 1px 1px #d3dbba17, -1px -1px 1px #1020101f; }
.signature-door-left .signature-deboss { right: 13%; }
.signature-door-right .signature-deboss { left: 13%; top: 56%; }
.signature-seam { position: absolute; left: 50%; top: 0; bottom: 0; width: 1px; box-shadow: -4px 0 14px #16210f8a, 2px 0 3px #e9daa82e; }
.signature-composition {
  position: absolute;
  top: 23%;
  width: min(88%, 720px);
  padding: 0 12px;
  text-align: center;
  transition: opacity 420ms ease 130ms, transform 850ms cubic-bezier(.22,1,.36,1);
}
.signature-seal {
  position: absolute;
  top: 58%;
  left: calc(50% - 45px);
  width: 90px;
  height: 90px;
  margin-top: -45px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: conic-gradient(from 30deg, #9b793f, #ead7a5, #ae8e51, #f0dfae, #a48145, #d1b777, #9b793f);
  box-shadow: 0 10px 20px #12200db3, inset 0 0 0 2px #e7d2a081, inset 0 0 0 5px #96734173, inset 0 0 12px #725127;
  animation: signature-arrive 950ms cubic-bezier(.22,1,.36,1) both;
}
.signature-seal svg { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; stroke: #775b2f; stroke-width: .7; filter: drop-shadow(0 1px 0 #fff4cc8a); }
.signature-seal span { font-size: 28px; font-style: italic; letter-spacing: -.12em; padding-right: .12em; color: #755b30; text-shadow: 0 1px 0 #fff0c9ad; }
.signature-seal-rim { position: absolute; inset: 7px; border-radius: 50%; border: 1px solid #72572f40; background: radial-gradient(ellipse at 30% 25%, #fff5c44a, transparent 70%); }
.signature-ribbon { position: absolute; top: calc(58% - 17px); width: 50%; height: 34px; background: linear-gradient(#c0c8a980, #adb899 9%, #d8dfc0 44%, #abb694 90%, #71805c); box-shadow: 0 5px 12px #15210f61, inset 0 1px 0 #eaf0d4aa; }
.signature-ribbon-left { left: 0; transform-origin: left; }
.signature-ribbon-right { right: 0; transform-origin: right; }
.signature-eyebrow { margin: 0 0 30px; color: #d4c799; font: 9px/1.7 "Avenir Next", "Signature Ethiopic", sans-serif; letter-spacing: .24em; animation: signature-arrive 1000ms 120ms both; }
.signature-names { display: grid; gap: 7px; font-size: clamp(29px, 6.9vw, 55px); font-weight: 400; line-height: 1.12; letter-spacing: -.04em; text-shadow: 0 2px 12px #16261045; }
.signature-names span { animation: signature-arrive 1200ms 220ms cubic-bezier(.22,1,.36,1) both; }
.signature-names span:last-child { animation-delay: 380ms; }
.signature-names i { color: #d4bc7d; font-size: .57em; font-weight: 400; animation: signature-arrive 1000ms 300ms both; }
.signature-footer { position: absolute; top: 72%; text-align: center; transition: opacity 400ms ease, transform 700ms ease; }
.signature-rule { width: 30px; height: 1px; background: #d1b67699; margin: 0 auto 20px; animation: signature-arrive 1000ms 480ms both; }
.signature-date { margin: 0; color: #e0d6b6; font: 10px/1.6 "Avenir Next", "Signature Ethiopic", sans-serif; letter-spacing: .22em; text-transform: uppercase; animation: signature-arrive 1000ms 520ms both; }
.signature-skip { position: absolute; bottom: max(42px, env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%); border: 0; border-bottom: 1px solid #dbc58c59; background: transparent; color: #e7ddbc; padding: 14px 5px; min-height: 44px; white-space: nowrap; font: 11px "Avenir Next", "Signature Ethiopic", sans-serif; letter-spacing: .1em; cursor: pointer; }
.signature-skip span { margin-left: 10px; }
.signature-skip:focus-visible { outline: 2px solid #77805b; outline-offset: 5px; }
.signature-opening.is-revealing .signature-composition { opacity: 0; transform: translate3d(0,-22px,0); }
.signature-opening.is-revealing .signature-footer { opacity: 0; transform: translateY(14px); }
.signature-opening.is-revealing .signature-skip { opacity: 0; transition: opacity 250ms; }
.signature-opening.is-revealing .signature-seam { opacity: 0; transition: opacity 350ms 250ms; }
.signature-opening.is-revealing .signature-seal { animation: signature-unseal 850ms cubic-bezier(.4,0,.2,1) both; }
.signature-opening.is-revealing .signature-ribbon-left { animation: signature-unribbon-left 1150ms 120ms cubic-bezier(.65,0,.2,1) both; }
.signature-opening.is-revealing .signature-ribbon-right { animation: signature-unribbon-right 1150ms 120ms cubic-bezier(.65,0,.2,1) both; }
.signature-opening.is-revealing .signature-door-left { animation: signature-open-left 2250ms 300ms cubic-bezier(.65,.01,.18,1) both; }
.signature-opening.is-revealing .signature-door-right { animation: signature-open-right 2250ms 300ms cubic-bezier(.65,.01,.18,1) both; }
/* The doors provide the opening motion; keep the card itself edge-to-edge so
   no ivory letterbox flashes between the reveal and the settled invitation. */
body.signature-playing .canvas { scale: 1; opacity: .7; }
body.signature-playing.signature-revealing .canvas { scale: 1; opacity: 1; transition: opacity 1800ms ease 450ms; }
@keyframes signature-unseal { 0% { opacity: 1; transform: none; } 35% { opacity: 1; transform: translateY(-10px) scale(1.12) rotate(-8deg); } 100% { opacity: 0; transform: translateY(45px) scale(1.25) rotate(18deg); } }
@keyframes signature-unribbon-left { to { transform: translateX(-110%) rotate(-5deg); opacity: 0; } }
@keyframes signature-unribbon-right { to { transform: translateX(110%) rotate(5deg); opacity: 0; } }
@keyframes signature-open-left { 0% { transform: none; } 100% { transform: translateX(-105%) rotateY(-24deg); } }
@keyframes signature-open-right { 0% { transform: none; } 100% { transform: translateX(105%) rotateY(24deg); } }
@keyframes signature-arrive { from { opacity: 0; transform: translate3d(0,12px,0); } to { opacity: 1; transform: translate3d(0,0,0); } }
@keyframes signature-silk { to { transform: translateX(20%); } }

/* Preserve the card's authored positions and viewport/keyboard fitting. */
html.public-export .language-shell {
  border: 1px solid #a3ad8659 !important;
  border-radius: 16px !important;
  background: #f8faefd9 !important;
  box-shadow: 0 5px 18px #38412912 !important;
}
html.public-export .language-tabs { border: 0 !important; background: transparent !important; gap: 5px; }
html.public-export .language-tab { border-radius: 9px !important; transition: background 180ms, color 180ms; }
html.public-export .language-tab { min-height: 30px; padding: 7px 10px !important; }
html.public-export .language-tab.active { background: #61734a !important; color: #fffdf3 !important; outline: none !important; box-shadow: 0 2px 6px #3a452b20 !important; }
html.public-export .language-labels { color: #58644a; }
html.public-export .names { text-shadow: 0 1px 0 #fff8 !important; }
html.public-export .names h1 { -webkit-text-stroke: 0 !important; text-shadow: 0 1px 0 #ffffffe0 !important; }
html.public-export .names [data-text-key="bride"],
html.public-export .names [data-text-key="groom"] { color: #657049 !important; -webkit-text-stroke: 0 !important; text-shadow: 0 1px 1px #ffffffe0 !important; }
html.public-export .rsvp-title { color: #566442 !important; background: transparent !important; border-color: transparent !important; box-shadow: none !important; text-shadow: none !important; }
html.public-export .respect-time { color: #687257 !important; background: transparent !important; border-color: transparent !important; box-shadow: none !important; text-shadow: none !important; }
html.public-export .rsvp-panel {
  background: linear-gradient(145deg, #faf9efd9, #e7ebdcc7) !important;
  border: 1px solid #f9f7e9c9 !important;
  border-radius: 20px !important;
  box-shadow: 0 12px 32px #38412914, inset 0 1px 0 #ffffffa3 !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}
html.public-export .rsvp-input {
  font-family: "Avenir Next", "Signature Ethiopic", sans-serif !important;
  background: #fffffff0 !important;
  border: 1px solid #79825c42 !important;
  border-radius: 10px !important;
  color: #39452e !important;
  box-shadow: inset 0 1px 2px #36462605;
  text-transform: none !important;
  transition: border-color 180ms, box-shadow 180ms;
}
html.public-export .rsvp-input::placeholder { color: #6d745e !important; opacity: 1; }

html.public-export .rsvp-input:focus { border-color: #72805a !important; box-shadow: 0 0 0 3px #71805226; outline: none; }
html.public-export .rsvp-submit {
  background: linear-gradient(120deg, #536142, #738159) !important;
  color: #fffdf3 !important;
  border: 1px solid #f9f7de66 !important;
  box-shadow: 0 5px 12px #3a452b26 !important;
  border-radius: 12px !important;
  text-shadow: none !important;
  transition: filter 180ms, box-shadow 180ms;
}
html.public-export .rsvp-submit:hover { filter: brightness(1.08); box-shadow: 0 7px 18px #3a452b33 !important; }
html.public-export .rsvp-submit:disabled { opacity: .65; cursor: progress; }
html.public-export .rsvp-radio input { accent-color: #63744d; }
html.public-export .rsvp-radio label { border-radius: 10px !important; transition: background 180ms; }
html.public-export .rsvp-radio label:has(input:checked) { background: #dbe5cecf !important; }
html.public-export button:focus-visible { outline: 2px solid #596843; outline-offset: 3px; }
/* Clearer ink without moving the authored invitation text. */
html.public-export [data-text-key="ceremonyNote"],
html.public-export [data-text-key="invitation"],
html.public-export [data-text-key="time"],
html.public-export [data-text-key="day"],
html.public-export [data-text-key="month"],
html.public-export [data-text-key="year"],
html.public-export [data-text-key="venueAddress"],
html.public-export [data-text-key="venue"],
html.public-export .respect-time {
  color: #465238 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
html.public-export .rsvp-radio label { box-sizing: border-box; color: #39452e !important; }
html.public-export .rsvp-radio label span { font-size: inherit !important; }
html.public-export .rsvp-submit { touch-action: manipulation; }
html.public-export .rsvp-title,
html.public-export .respect-time {
  padding: 0 !important;
  border-width: 0 !important;
  backdrop-filter: none !important;
}
html.public-export .rsvp-title { margin: 4px 0 8px !important; }
html.public-export .respect-time { margin: 6px 0 0 !important; }
html.public-export .rsvp-message-block:has(.rsvp-message:empty) { display: none; }
@media (max-height: 600px) {
  .signature-composition { top: 13%; }
  .signature-seal { width: 64px; height: 64px; left: calc(50% - 32px); margin-top: -32px; top: 61%; }
  .signature-seal span { font-size: 23px; }
  .signature-ribbon { top: calc(61% - 12px); height: 24px; }
  .signature-eyebrow { margin-bottom: 12px; font-size: 8px; }
  .signature-names { font-size: 25px; gap: 3px; }
  .signature-footer { top: 77%; }
  .signature-rule { display: none; }
  .signature-skip { bottom: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .signature-opening { display: none; }
  html.public-export *, html.public-export *::before, html.public-export *::after { animation: none !important; transition: none !important; }
}