/* Grid, top bar, clause rule + label row, inverted chapters. */
.wrap {
  width: 100%; max-width: 1440px; margin-inline: auto;
  padding-inline: var(--mar);
  display: grid; grid-template-columns: repeat(var(--cols), minmax(0, 1fr)); column-gap: var(--gut);
}
.wrap > * { grid-column: 1 / -1; min-width: 0; }
.top { border-bottom: 1px solid var(--ink); background: var(--paper); z-index: 20; }
.top__in { height: 48px; align-items: center; grid-template-columns: 1fr auto; }
.top__in .btn { grid-column: auto; justify-self: end; }
.top__in .label:first-child { grid-column: 1; }
.desk { display: none; }
@media (min-width: 900px) {
  .top { position: sticky; top: 0; }
  .top__in { height: 56px; grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .top__in .label:first-child { grid-column: 1 / 5; }
  .top__in .desk { grid-column: 5 / 9; }
  .top__in .btn { grid-column: 10 / 13; }
  .desk { display: inline; }
}
.clause { padding-top: var(--sec); }
.clause__rule { height: var(--rule); background: var(--ink); }
.clause__label { display: flex; gap: 24px; margin: 16px 0 32px; }
.clause__label > span:first-child { flex: none; white-space: nowrap; }
.clause--inv, .foot { background: var(--ink); color: var(--paper); }
.clause--inv { margin-top: var(--sec); padding-bottom: var(--sec); }
.clause--inv .clause__rule, .foot .clause__rule { background: var(--paper); }
.clause + .clause:not(.clause--inv) { padding-bottom: 0; }
#buy { padding-bottom: var(--sec); }
