

.lines {
  margin-top: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--gut);
  border-top: 1px solid var(--fg);
}
.lines li { padding-top: 18px; }
.lines li + li { border-left: 1px solid var(--rule-2); padding-left: var(--gut); margin-left: calc(var(--gut) * -1); }
.lines__t { font-weight: 500; font-size: var(--t-subhead); line-height: var(--lh-heading); letter-spacing: var(--tr-heading); max-width: 11em; text-wrap: balance; }

.notes { margin-top: clamp(72px, 10vw, 150px); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gut); }
.notes__head { grid-column: 1 / 4; padding-top: 16px; border-top: 1px solid var(--fg); }
.notes__list { grid-column: 4 / 13; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--gut); }
.notes__list li { border-top: 1px solid var(--rule-2); padding-top: 16px; }
.notes__list h4 { font-weight: 500; font-size: var(--t-lead); line-height: var(--lh-text); }
.notes__list p { margin-top: 10px; font-size: var(--t-body); line-height: var(--lh-body); max-width: 30ch; text-wrap: balance; }

.notes--who + .notes { margin-top: clamp(48px, 6vw, 96px); }
.notes__body { grid-column: 4 / 13; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--gut); border-top: 1px solid var(--rule-2); padding-top: 16px; }
.notes__body p { font-size: var(--t-body); line-height: var(--lh-body); max-width: 34em; text-wrap: pretty; }

.notes--who .notes__body { grid-template-columns: minmax(0, 1fr); row-gap: 14px; }

@media (max-width: 1023px) {
  .notes__head { grid-column: 1 / -1; margin-bottom: 20px; }
  .notes__list, .notes__body { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .lines { grid-template-columns: 1fr; border-top: 0; }
  .lines li { border-top: 1px solid var(--fg); padding: 16px 0 22px; }
  .lines li + li { border-left: 0; padding-left: 0; margin-left: 0; border-top-color: var(--rule-2); }
  .lines__t { max-width: none; }
  .notes__list { grid-template-columns: 1fr; row-gap: 28px; }
  .notes__body { grid-template-columns: 1fr; row-gap: 14px; }
}

@media (min-width: 641px) and (max-width: 1023px) {
  .lines { grid-template-columns: 1fr; border-top: 0; }
  .lines li { border-top: 1px solid var(--fg); padding: 16px 0 22px; }
  .lines li + li { border-left: 0; padding-left: 0; margin-left: 0; border-top-color: var(--rule-2); }
  .lines__t { max-width: none; }
}

@media (min-width: 1024px) {
  .notes__body { grid-template-columns: subgrid; }
  .notes__body p:first-child { grid-column: 1 / 4; }
  .notes__body p:last-child  { grid-column: 4 / 10; }

  .notes--who .notes__body { grid-template-columns: subgrid; row-gap: 0; }
  .notes--who .notes__body p:nth-child(1) { grid-column: 1 / 4; }
  .notes--who .notes__body p:nth-child(2) { grid-column: 4 / 7; }
  .notes--who .notes__body p:nth-child(3) { grid-column: 7 / 10; }
}
