/* surrobonds: konzentrierter öffentlicher Seitenabschluss.
   Bewusst nur auf die Einladung auf der Startseite begrenzt. */
.closing.closing--invitation {
  padding: clamp(54px, 6.8vw, 88px) 0 clamp(72px, 7vw, 104px);
  background: var(--bg);
}
.closing--invitation .closing-invitation {
  display: grid;
  grid-template-columns: minmax(0, 1.48fr) minmax(210px, .72fr);
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #f9f5ed;
  overflow: hidden;
  min-width: 0;
}
.closing--invitation .closing-invitation__copy {
  padding: clamp(28px, 4.3vw, 61px) clamp(26px, 5vw, 72px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
}
.closing--invitation .closing-invitation__eyebrow {
  display: block;
  font: italic 400 clamp(17px, 1.55vw, 21px)/1.35 var(--serif);
  color: var(--rust-dark);
  margin: 0 0 21px;
}
.closing--invitation h2 {
  font: 400 clamp(37px, 4.1vw, 59px)/1.09 var(--serif);
  letter-spacing: -.053em;
  max-width: 19ch;
  margin: 0;
  overflow-wrap: normal;
  text-wrap: balance;
}
.closing--invitation .closing-invitation__copy > p {
  margin: 19px 0 0;
  font: 400 16px/1.72 var(--sans);
  max-width: 52ch;
  color: #50625c;
}
.closing--invitation .closing-invitation__action {
  display: inline-flex;
  align-self: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-top: 28px;
  padding: 14px 20px;
  min-height: 51px;
  border-radius: 4px;
  font: 650 14px/1.4 var(--sans);
  white-space: normal;
}
.closing--invitation .closing-invitation__action span {
  font: 400 18px/1 var(--sans);
}
.closing--invitation .closing-invitation__art {
  min-width: 0;
  display: grid;
  place-items: center;
  background: #e5e9df;
  border-left: 1px solid var(--line);
  padding: clamp(20px, 4vw, 52px);
}
.closing--invitation .closing-invitation__art svg {
  display: block;
  width: min(100%, 275px);
  height: auto;
}
.closing--invitation .closing-invitation__arc {
  stroke: #315649;
  fill: none;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.closing--invitation .closing-invitation__arc--light {
  stroke: #6d866e;
}
.closing--invitation .closing-invitation__dot {
  fill: #ab604a;
}
@media (max-width: 780px) {
  .closing--invitation .closing-invitation {
    grid-template-columns: minmax(0, 1fr);
  }
  .closing--invitation .closing-invitation__art { display: none; }
  .closing--invitation h2 { max-width: 19ch; }
}
@media (max-width: 560px) {
  .closing.closing--invitation { padding: 55px 0 71px; }
  .closing--invitation .closing-invitation { border-radius: 14px; }
  .closing--invitation .closing-invitation__copy { padding: 28px 23px 31px; }
  .closing--invitation .closing-invitation__eyebrow { font-size: 17px; margin-bottom: 16px; }
  .closing--invitation h2 { font-size: clamp(32px, 8.8vw, 43px); line-height: 1.14; }
  .closing--invitation .closing-invitation__copy > p { font-size: 15px; line-height: 1.65; margin-top: 16px; }
  .closing--invitation .closing-invitation__action { margin-top: 24px; min-height: 48px; }
}
@media (max-width: 360px) {
  .closing--invitation .closing-invitation__copy { padding: 24px 19px 27px; }
  .closing--invitation h2 { font-size: 31px; }
  .closing--invitation .closing-invitation__action { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .closing--invitation .closing-invitation__action { transition: none; }
}
