/* ── closing CTA ────────────────────────────────────────────────
   Centred, closing the pair the hero opened.
   ─────────────────────────────────────────────────────────────── */

.close {
  position: relative;
  /* clip-x lets the glow bleed vertically into its neighbours while
     never widening the document */
  overflow-x: clip;
  text-align: center;
  padding-block: calc(var(--section-y) - 8px) calc(var(--section-y) + 16px);
}

/* The shopfront glow from the hero photo, reduced to its light. */
.close::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(980px, 100%);
  height: 560px;
  transform: translate(-50%, -50%);
  background: radial-gradient(ellipse closest-side at center,
    rgba(196, 80, 26, .2), rgba(196, 80, 26, 0));
  pointer-events: none;
}

.close .wrap { position: relative; }

.close-h {
  font-family: var(--display);
  font-size: clamp(34px, 4.8vw, 58px);
  line-height: var(--lh-tight);
  letter-spacing: var(--tr-display);
  margin-bottom: var(--s-3);
}
.close-h span { color: var(--ink-2); }

.close-fine {
  margin-top: var(--s-2);
  font-size: var(--t-small);
  color: var(--ink-2);
}
.close-fine a {
  color: var(--ink-2);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}
.close-fine a:hover { color: var(--ink); }
