/* Vertical floral backgrounds supplied for the wedding invitation. */
#invitation .section,
#invitation .closing {
  background-color: #fcf9fd !important;
  background-image: url('floral-vertical-1.png') !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  /* Preserve the watercolor artwork without stretching it. */
  background-size: cover !important;
}

#invitation .verse,
#invitation #rsvp,
#invitation #guestbook {
  background-image: url('floral-vertical-2.png') !important;
}

#invitation #event,
#invitation #gallery,
#invitation #gift {
  background-image: url('floral-vertical-3.png') !important;
}

/* Closing section fills the entire footer while keeping the floral composition centered. */
#invitation .closing {
  background-image: url('closing-floral-frame.png') !important;
  background-position: center center !important;
  background-size: cover !important;
}

/* The standalone decorative fragments are replaced by the full floral frame. */
#invitation .verse::before,
#invitation .verse::after {
  background: none !important;
}

#invitation .closing {
  color: #5b204d;
}

#invitation .closing h2,
#invitation .closing p:not(.eyebrow) {
  color: #5b204d;
}

/* JN identity: replace the previous gold accents with lavender and plum. */
:root { --gold: #9a63aa; }

.gold-line {
  background: linear-gradient(90deg, transparent, #9a63aa, transparent) !important;
}

.eyebrow,
#invitation .verse cite,
#invitation .closing .eyebrow {
  color: #86518f !important;
}

.envelope-card::before { border-color: #cfb6d8 !important; }

.wax-seal {
  background: radial-gradient(circle at 30% 25%, #eadcf0, #9b6bad 44%, #5b204d) !important;
  border-color: #eadcf0 !important;
  color: #fff !important;
  box-shadow: 0 3px 7px #4a1f2a55 !important;
}

.gold-button {
  background: linear-gradient(110deg, #4b1844, #7b3e74, #4b1844) !important;
}

.ampersand,
.envelope-card h1 span,
.hero h1 em,
.closing em,
.date-line strong,
.divider,
.time {
  color: #9a63aa !important;
}

.event-card { border-color: #cfb6d8 !important; }
.event-card::before { border-color: #e1d1e6 !important; }
.outline-button { border-color: #b996c2 !important; }
.music-button { border-color: #c5a7cf !important; }
.result-card { border-color: #cfb6d8 !important; }
.bank { border-left-color: #9a63aa !important; }

/* Keep the seal's intentional tilted shape while the cover copy animates in. */
.envelope-screen.cover-ready .wax-seal {
  animation: none;
  transform: rotate(-9deg);
}

/* Restore the original calligraphic ampersand on the envelope cover. */
.envelope-card h1 span {
  font-family: 'Great Vibes', cursive !important;
  font-size: 40px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: .65 !important;
}

/* The greeting now sits in place of the removed seal, with a calm visual gap. */
.envelope-card .to { margin: 8px 0 16px !important; }

/* Keep reading content inside the clear center of the floral frame. */
#invitation .section .copy,
#invitation .verse blockquote {
  max-width: min(700px, 76%);
}

/* The chosen Scripture is longer, so it stays graceful and readable on every screen. */
#invitation .verse blockquote {
  font-size: clamp(22px, 3vw, 34px);
  line-height: 1.38;
}

/* Portrait gallery previews preserve faces rather than cropping from the top. */
.gallery-grid img {
  background: #f7f1f8;
  object-fit: contain;
  object-position: center;
}

.gallery-item {
  align-items: center;
  background: #f7f1f8;
  display: flex;
  justify-content: center;
  position: relative;
  transition: box-shadow .35s ease, transform .35s cubic-bezier(.2,.8,.2,1);
}

.gallery-item img {
  transition: filter .45s ease, transform .55s cubic-bezier(.2,.8,.2,1);
}

.reveal.is-visible .gallery-item {
  animation: gallery-reveal .72s both;
}

.reveal.is-visible .gallery-item:nth-child(1) { animation-delay: .08s; }
.reveal.is-visible .gallery-item:nth-child(2) { animation-delay: .17s; }
.reveal.is-visible .gallery-item:nth-child(3) { animation-delay: .26s; }
.reveal.is-visible .gallery-item:nth-child(4) { animation-delay: .35s; }

.gallery-item:hover,
.gallery-item:focus-visible,
.gallery-item:active {
  box-shadow: 0 15px 30px #6a38602b;
  outline: none;
  transform: translateY(-5px);
}

.gallery-item:hover img,
.gallery-item:focus-visible img,
.gallery-item:active img {
  filter: saturate(1.06) brightness(1.02);
  transform: scale(1.025);
}

@keyframes gallery-reveal {
  from { opacity: 0; transform: translateY(22px) scale(.975); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 760px) {
  #invitation .section,
  #invitation .closing {
    background-position: center top !important;
  }

  #invitation .verse {
    padding-block: 76px;
  }

  #invitation .verse blockquote {
    font-size: clamp(20px, 5.5vw, 25px);
    line-height: 1.4;
    max-width: 76%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .reveal.is-visible .gallery-item { animation: none; }
  .gallery-item,
  .gallery-item img { transition: none; }
}