@font-face {
  font-family: 'P3 Cardo';
  src: url('../fonts/Cardo-Regular.ttf') format('truetype');
  font-display: swap;
}
@font-face {
  font-family: 'P3 Great Vibes';
  src: url('../fonts/GreatVibes-Regular.ttf') format('truetype');
  font-display: swap;
}
.p3-copy-layer {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  container-type: inline-size;
  color: #76566a;
  text-align: center;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .75);
}
.p3-copy {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  font-family: 'P3 Cardo', Georgia, serif;
  line-height: 1.18;
  transform-origin: center;
}
.p3-copy > * { max-width: 100%; overflow-wrap: anywhere; }
.p3-copy--names { left: 17%; width: 66%; top: 27%; height: 47%; }
.p3-copy__name { font-size: clamp(22px, 8.4cqw, 44px); line-height: 1.13; }
.p3-copy__name.is-long { font-size: clamp(19px, 6.7cqw, 34px); }
.p3-copy__name.is-very-long { font-size: clamp(17px, 5.9cqw, 29px); }
.p3-copy__ampersand {
  font: clamp(26px, 10cqw, 52px)/1.05 'P3 Great Vibes', 'P3 Cardo', serif;
  margin: .03em 0 .08em;
  color: #a47386;
}
.p3-copy__date {
  font-size: clamp(12px, 3.4cqw, 17px);
  letter-spacing: .09em;
  margin-top: 1.25em;
}
.p3-copy--story { left: 19%; width: 62%; top: 34%; height: 35%; }
.p3-copy__story-title { margin: 0; font-size: clamp(24px, 8cqw, 42px); font-weight: 400; }
.p3-copy__story-body {
  max-width: 78%;
  margin: 1.5em 0 0;
  font-size: clamp(13px, 3.8cqw, 20px);
  line-height: 1.45;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden;
}
.p3-copy--events { left: 16%; width: 68%; top: 29%; height: 47%; }
.p3-copy__event-title { margin: 0; font-size: clamp(22px, 6.8cqw, 38px); font-weight: 400; }
.p3-copy__event-date { margin: .6em 0 1.1em; font-size: clamp(12px, 3.45cqw, 18px); letter-spacing: .035em; }
.p3-copy__event-detail { margin: .45em 0; font-size: clamp(13px, 3.9cqw, 20px); line-height: 1.35; }
.p3-copy__venue { margin: 1.1em 0 0; font-size: clamp(12px, 3.3cqw, 17px); line-height: 1.35; }
@media (prefers-reduced-motion: reduce) {
  .p3-copy-layer, .p3-copy-layer * { transition: none; }
}
