.container { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: var(--gutter); }
.container--wide { max-width: var(--container-wide); }
.section { padding-block: var(--sp-16); }
.section--tight { padding-block: var(--sp-10); }
.section--alt { background: var(--color-background-secondary); }
.stack > * + * { margin-top: var(--sp-4); }
.stack-2 > * + * { margin-top: var(--sp-2); }
.stack-4 > * + * { margin-top: var(--sp-4); }
.stack-6 > * + * { margin-top: var(--sp-6); }
.stack-8 > * + * { margin-top: var(--sp-8); }
.row { display: flex; align-items: center; gap: var(--sp-3); }
.row--between { justify-content: space-between; }
.row--wrap { flex-wrap: wrap; }
.row--end { justify-content: flex-end; }
.grid { display: grid; gap: var(--sp-4); }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.grid-main-side { grid-template-columns: minmax(0, 1fr) 340px; }
.grid-side-main { grid-template-columns: 280px minmax(0, 1fr); }
.gap-6 { gap: var(--sp-6); }
.gap-2 { gap: var(--sp-2); }
/* R49: .mt-2, .mt-3 and .mb-2 are used in partials/dash/listing-detail and elsewhere and were
   never declared, so those elements sat flush against the one above them. */
.mt-2 { margin-top: var(--sp-2); }
.mt-3 { margin-top: var(--sp-3); }
.mt-4 { margin-top: var(--sp-4); }
.mt-6 { margin-top: var(--sp-6); }
.mt-8 { margin-top: var(--sp-8); }
.mb-2 { margin-bottom: var(--sp-2); }
.mb-4 { margin-bottom: var(--sp-4); }
.mb-6 { margin-bottom: var(--sp-6); }
.grow { flex: 1 1 auto; min-width: 0; }
.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--sp-6); margin-bottom: var(--sp-6); }
.section-head__title { font-size: var(--fs-h2); font-weight: 700; letter-spacing: -.01em; }
.section-head--center { flex-direction: column; align-items: center; text-align: center; }
.section-head--center .lead { text-align: center; }
.breadcrumb { display: flex; align-items: center; gap: var(--sp-2); font-size: var(--fs-sm); color: var(--color-text-muted); padding-block: var(--sp-5) var(--sp-2); }
.breadcrumb a:hover { color: var(--color-gold-primary); }
.breadcrumb span[aria-current] { color: var(--color-text-secondary); }
.page-head { padding-block: var(--sp-4) var(--sp-8); }
.page-head .lead { margin-top: var(--sp-3); }
