/* ==========================================================================
   Transactions — the full tombstone wall.
   Same .tombstone component as the home teaser (global.css); this page gives
   it more presence: an opening hairline that draws, Caslon serials set in CSS
   (no copy added), taller plates and a ruled foot for the advertising line.
   ========================================================================== */

.tx { padding-top: clamp(88px, 10vw, 152px); }

/* Opening rule: navy hairline with a short orange lead, drawn on reveal */
.tx__rule {
  position: relative;
  height: 1px;
  margin-bottom: clamp(48px, 6vw, 88px);
  background: var(--rule-strong);
  transform-origin: left center;
}
.tx__rule::before {
  content: ""; position: absolute; left: 0; top: 0;
  width: 56px; height: 1px; background: var(--orange);
}
html.js .tx__rule { transform: scaleX(0); filter: none; transition: transform 1.4s var(--ease) .1s, opacity .6s var(--ease); }
html.js .tx__rule.in { transform: none; }

/* Plates: taller; a lone final plate centres under the row above */
.tx .tombstone { min-height: 480px; }
@media (min-width: 981px) {
  .tx .tombstone:last-child:nth-child(3n + 1) { grid-column: 2; }
}
.tx .tombstone h3 { font-size: clamp(32px, 2.9vw, 44px); }

/* Foot: hairline, then the advertising line */
.tx__foot {
  margin-top: clamp(48px, 5vw, 72px);
  padding-top: 24px;
  border-top: 1px solid var(--rule);
}
.tx__foot .ad-disclaimer { margin-top: 0; }

@media (max-width: 980px) {
  .tx .tombstone { min-height: 0; }
}