/* sections */
.band { padding: var(--s9) 0; border-top: 1px solid var(--line); }
.band.alt { background: var(--paper); }
.grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--s5); row-gap: var(--s6); }
.intro { grid-column: 1 / span 7; }
.intro h2 { margin-bottom: var(--s4); }
.intro p { font-size: 1.125rem; max-width: 56ch; margin: 0; }
figure { margin: 0; }
.shot { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.shot img { width: 100%; }
.shot-wide { grid-column: 1 / -1; }
.caption { font-size: var(--t-small); color: var(--muted); margin: var(--s3) 0 0; }
.points { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--s5); row-gap: var(--s5); margin: 0; padding: 0; list-style: none; }
.points li { border-top: 2px solid var(--ink); padding-top: var(--s4); }
.points h3 { margin-bottom: var(--s2); }
.points p { margin: 0; }

.split-text { grid-column: 1 / span 5; align-self: center; }
.split-text h2 { margin-bottom: var(--s5); }
.split-text p { max-width: 46ch; }
.split-text p:last-child { margin-bottom: 0; }
.split-text .note { color: var(--muted); font-size: var(--t-small); }
.split-shot { grid-column: 7 / span 6; }

.pair { grid-column: span 6; display: flex; flex-direction: column; }
.pair h2 { font-size: clamp(1.5rem, 1.1rem + 1.2vw, 2rem); margin-bottom: var(--s3); }
.pair > p { max-width: 46ch; }
.pair figure { margin-top: auto; }
.pair .shot img { aspect-ratio: 5 / 4; object-fit: contain; }

@media (max-width: 960px) {
  .intro, .split-text, .split-shot { grid-column: 1 / -1; }
  .split-shot { max-width: 560px; }
  .points { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .band { padding: var(--s8) 0; }
  .pair { grid-column: 1 / -1; }
}