/* Finishing touches on the Claude Design export, kept here so they survive re-exports. */

/* Final scene signature: J | J in gold leaf, flanked by fine gold rules, with a
   slow glint of light passing across it now and then. */
.invitation .final-monogram {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  padding-left: .26em; /* balances the trailing letter-spacing */
  font-size: 30px;
  font-weight: 500;
  letter-spacing: .26em;
  text-indent: 0;
  /* Glint layer on top of a gold-leaf base (bright above, deep below, like foil). */
  background:
    linear-gradient(105deg, transparent 42%, rgba(255, 250, 232, .95) 50%, transparent 58%) no-repeat,
    linear-gradient(180deg, #fff3cc 0%, #f2d692 30%, #dcb062 55%, #f4d997 76%, #b0843a 100%);
  background-size: 300% 100%, 100% 100%;
  background-position: 130% 0, 0 0;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  text-shadow: none;
  filter:
    drop-shadow(0 1px 0 rgba(70, 45, 10, .65))
    drop-shadow(0 0 12px rgba(226, 190, 110, .22))
    drop-shadow(0 3px 10px rgba(0, 0, 0, .75));
  animation: jj-gold-glint 8s ease-in-out 6s infinite;
}
.invitation .final-monogram::before,
.invitation .final-monogram::after {
  content: "";
  width: 30px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(226, 199, 152, .85));
}
.invitation .final-monogram::after {
  background: linear-gradient(270deg, transparent, rgba(226, 199, 152, .85));
}
@keyframes jj-gold-glint {
  0%, 74% { background-position: 130% 0, 0 0; }
  100% { background-position: -30% 0, 0 0; }
}
@media (prefers-reduced-motion: reduce) {
  .invitation .final-monogram { animation: none; }
}