#home-closing h2 { max-width: none; }

#home-closing .closing-line { display: block; text-wrap: balance; }
#home-closing .closing-line:first-child { color: var(--ink-soft); }
#home-closing .closing-line + .closing-line { margin-top: .58em; }
#home-closing .closing-ending { display: block; margin-top: .14em; }
#closing-flip:empty { display: none; }
#closing-flip:not(:empty) + .closing-fallback {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

/* Componentry's layout utilities in the site's existing stylesheet setup. */
#home-closing .swap-preview {
  display: inline-grid;
  vertical-align: baseline;
  padding: 0;
  border: 0;
  border-radius: .08em;
  background: transparent;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  user-select: none;
}
#home-closing .swap-preview > span { display: inline-grid; overflow: hidden; perspective: 800px; }
#home-closing .swap-preview > span > span {
  justify-content: center;
  grid-area: 1 / 1;
  display: inline-flex;
  align-items: baseline;
  gap: .012em;
  white-space: pre;
}
#home-closing .swap-preview [data-flip-word] {
  display: inline-block;
  backface-visibility: hidden;
  will-change: transform, opacity;
}
#home-closing .swap-preview [data-flip-word="first"]:not(:last-child) { position: relative; }
/* Join the stroke across the gaps at rest, then let it flip out with the letters. */
#home-closing .swap-preview [data-flip-word="first"]:not(:last-child)::after {
  content: "";
  position: absolute;
  inset-inline: 0 -.012em;
  top: .52em;
  height: 2px;
  background: currentColor;
}
@media (prefers-reduced-motion: reduce) {
  #closing-flip { display: none; }
  #closing-flip:not(:empty) + .closing-fallback {
    position: static;
    width: auto;
    height: auto;
    clip-path: none;
    white-space: normal;
  }
}
