/* The archive: one row per voyage between rails; the length as the big number, the first and the last picture. */
.voyages-list { list-style: none; margin: var(--s6) 0 0; padding: 0; }
.voy { position: relative; display: grid; grid-template-columns: 160px auto auto minmax(0, 1fr); gap: var(--s6); align-items: start; padding: var(--s6) 0; }
.voy::before, .voy:last-child::after { content: ""; position: absolute; left: 0; right: 0; height: 3px; background: var(--ink); }
.voy::before { top: 0; }
.voy:last-child::after { bottom: 0; }
.voy .len { margin: 0; font-family: var(--display); font-weight: 700; font-size: 96px; line-height: .9; }
.voy .len small { display: block; font-family: var(--text); font-size: 16px; line-height: 1.4; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; margin-top: var(--s4); }
.voy figure { margin: 0; text-align: center; }
.voy figure .work { width: 179.4px; }                    /* 64 x 2 */
.voy figcaption { font-size: 16px; font-weight: 600; margin-top: var(--s2); }
.voy .facts { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s2); }
.voy .facts h2 { font-size: 24px; font-weight: 700; line-height: 1.2; margin: 0 0 var(--s1); }
.voy .facts p { margin: 0; }
.voy .facts .status { font-weight: 700; }
.voy .facts a.brass { margin-top: var(--s3); }
.voy.one { grid-template-columns: 160px auto minmax(0, 1fr); }
@media (max-width: 1099px) {
  .voy.one { grid-template-columns: auto minmax(0, 1fr); }
  .voy { grid-template-columns: auto auto minmax(0, 1fr); gap: var(--s5) var(--s6); }
  .voy .len { grid-column: 1 / -1; }
  .voy .facts { grid-column: 1 / -1; }
}
@media (max-width: 560px) { .voy { grid-template-columns: 1fr 1fr; } .voy figure .work { width: 134.55px; } .voy .len { font-size: 72px; } }