.end__stage {
  position: relative;
  height: 100vh;
  overflow: hidden;
}

.end__center {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: min(3.2vw, 4vh);
}

.end__title { margin: 0; line-height: 0; will-change: transform, opacity; }
/* The logo is drawn light for the dark page, and this section is always on the light one. */
.end__title img { display: block; width: auto; height: min(60vh, 110vw); filter: invert(1); }

.end__reach {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .4vh;
  will-change: transform, opacity;
}
.end__talk {
  margin: 0;
  font-family: var(--font-heading);
  font-size: min(2.25vh, 4.1vw);
  font-weight: 500;
  line-height: 1.2;
  color: var(--text-primary);
}

/* Gradient type on a gradient underline, which sweeps out and back in on hover. */
.end__cta {
  --sweep: linear-gradient(90deg, #DD6508, #E0467C 50%, #3A2FB0);
  position: relative;
  display: inline-block;
  padding-bottom: .3em;
  overflow: hidden;
  background: var(--sweep);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-family: var(--font-heading);
  font-size: min(3.25vh, 5.95vw); /* The address runs as wide as the logo above it. */
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -.01em;
  white-space: nowrap;
  transition: opacity var(--dur-micro) linear;
}
.end__cta::before, .end__cta::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1.5px;
  background: var(--sweep);
  transition: transform .85s cubic-bezier(1, 0, 0, 1);
}
.end__cta::before { transform: translateX(-105%); }
.end__cta:hover { opacity: .6; }
.end__cta:hover::before { transform: translateX(0); }
.end__cta:hover::after { transform: translateX(105%); }
.end__cta:focus-visible { outline-offset: 6px; }

.end__foot {
  position: absolute;
  left: var(--gutter);
  right: var(--gutter);
  bottom: 28px;
  color: var(--text-muted);
}