/* Letterpress card (core/invitation/002) — inv05_more w3 (INV-05 v1.1/v2.1, A1359, D-031/D-032/D-035).
   The families' words pressed into a thick cotton card: the blessing, the hosts, the invitation line, the names in
   script, then the main event's day, date and time (the venue is vn001's). The press is CSS: a light lip below-right
   and a faint dark lip above-left of every word, set by --iv002-dx/--iv002-dy (the light's lean; live.js moves them
   with its raking light and clears them in destroy). A blind-debossed frame runs 14 px inside the edge. A pressed
   eucalyptus sprig (euc-b) lies across the top-left corner; the top padding keeps the words clear of it (≥ 32 px). */
.iv002 {
  --iv002-dx: .6; --iv002-dy: 1; --iv002-sprig: min(56%, 270px);
  position: relative; padding: var(--k-section-pad) var(--k-gutter); background: var(--k-light-ground); color: var(--k-ink);
  text-align: center; touch-action: pan-y;
}
.iv002__card {
  position: relative; max-width: 540px; margin: 0 auto; container-type: inline-size;
  padding: calc(var(--iv002-sprig) * .58 + 34px) clamp(26px, 8vw, 56px) 62px;
  background: var(--k-grain), var(--k-card);
  box-shadow: 0 0 0 .5px rgb(74 63 53 / .07), 0 1px 1px rgb(74 63 53 / .08), 0 3px 2px -1px rgb(74 63 53 / .05), 8px 18px 36px rgb(74 63 53 / .11);
}
/* the blind-debossed frame: a groove pressed 14 px inside the edge, dark on its upper-left wall, lit below-right */
.iv002__card::before {
  content: ""; position: absolute; inset: 14px; pointer-events: none;
  box-shadow: inset 1px 1px 0 rgb(74 63 53 / .09), inset -1px -1px 0 rgb(255 255 255 / .85), 1px 1px 0 rgb(255 255 255 / .85), -1px -1px 0 rgb(74 63 53 / .06);
}
.iv002__inner {
  --iv002-lip: calc(var(--iv002-dx) * 1px) calc(var(--iv002-dy) * 1px) 0 rgb(255 255 255 / .9), calc(var(--iv002-dx) * -.6px) calc(var(--iv002-dy) * -.6px) 0 rgb(74 63 53 / .16);
  position: relative; z-index: 0;
}
.iv002__inner p, .iv002__inner h2 { text-shadow: var(--iv002-lip); }
.iv002-blessing { margin-bottom: 20px; font: 500 1.25rem/1.55 var(--k-font-body); color: var(--c-primary); overflow-wrap: anywhere; }
.iv002-blessing[lang="ar"], .iv002-blessing[lang="ur"], .iv002-blessing[lang="fa"] { font-family: "Geeza Pro", "Noto Naskh Arabic", "Amiri", serif; font-size: 1.5rem; }
.iv002-hosts { display: grid; gap: 12px; }
.iv002-host__names { display: block; padding-left: .2em; font: 400 .9rem/1.5 var(--k-font-display); letter-spacing: .2em; text-transform: uppercase; color: var(--k-ink); overflow-wrap: anywhere; }
.iv002-host__rel { display: block; margin-top: 2px; font: 500 .74rem/1.5 var(--k-font-body); letter-spacing: .06em; color: var(--k-ink-soft); }
.iv002-line { max-width: 22em; margin: 22px auto 0; font: 400 1.18rem/1.5 var(--k-font-display); color: var(--k-ink-soft); text-wrap: balance; }
.iv002-names {
  margin-top: 14px; color: var(--c-primary); overflow-wrap: anywhere; text-wrap: balance;
  font: 400 clamp(2rem, min(13cqi, calc(185cqi / var(--iv002-len, 8))), 4.4rem)/1.12 var(--k-font-script);
}
.iv002-names__n { display: block; }
.iv002-and { display: block; margin: 2px 0; font: 400 .82rem/1.6 var(--k-font-display); letter-spacing: .3em; padding-left: .3em; text-transform: uppercase; color: var(--k-ink-soft); }
.iv002__rule { width: 150px; margin: 22px auto 0; }
.iv002-when { display: grid; gap: 4px; margin-top: 18px; }
.iv002-when__day { padding-left: .26em; font: 500 .72rem/1.4 var(--k-font-body); letter-spacing: .26em; text-transform: uppercase; color: var(--c-secondary-dark); }
.iv002-when__date { font: 400 1.8rem/1.2 var(--k-font-display); color: var(--k-ink); }
.iv002-when__time { font: 500 .78rem/1.5 var(--k-font-body); letter-spacing: .14em; text-transform: uppercase; color: var(--k-ink-soft); }

/* the light (live) covers the card; the sprig lies above it */
.iv002__stage { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.iv002__sprig, .iv002__sprig-shadow { position: absolute; top: -30px; left: -26px; width: var(--iv002-sprig); height: auto; max-width: none; pointer-events: none; user-select: none; transform-origin: 30% 60%; }
.iv002__sprig { z-index: 3; transform: rotate(12deg); }
.iv002__sprig-shadow { z-index: 2; transform: translate(4px, 7px) rotate(12deg); opacity: .75; }

@media (min-width: 768px) {
  .iv002 { --iv002-sprig: 320px; }
  .iv002__sprig, .iv002__sprig-shadow { top: -42px; left: -64px; }
  .iv002-blessing { font-size: 1.375rem; }
}
