.mb-route { padding: var(--mb-band) var(--mb-inset) 0; }
.mb-route__head { display: grid; gap: 1rem 3rem; margin-bottom: clamp(2rem, 4vw, 3rem); }
.mb-route__head h2 { margin: 0; max-width: 12ch; }
.mb-route__head p { margin: 0; max-width: 34rem; color: var(--mb-loam-muted); font-size: var(--mb-size-lede); }
.mb-route__layout { display: grid; gap: 2rem; margin-bottom: 2rem; }

.mb-week { display: grid; gap: 0; margin: 0; border-top: 1.5px solid var(--mb-loam); }
.mb-week__day { padding: 1rem 0; border-bottom: 1px solid var(--mb-rule); }
.mb-week__name { display: flex; align-items: center; gap: .5rem; margin: 0 0 .75rem; font-size: var(--mb-size-small); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.mb-week__name .mb-icon { color: var(--mb-clay); }
.mb-week__stops { display: grid; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.mb-week__caption { padding-top: .75rem; color: var(--mb-loam-muted); font-size: .9375rem; }

.mb-stop { display: grid; grid-template-columns: auto 1fr; column-gap: .75rem; padding: .75rem; background: var(--mb-white); border: 1.5px solid var(--mb-bottle); }
.mb-stop--biweekly { border-style: dashed; background: transparent; }
.mb-stop__icon { grid-row: span 3; color: var(--mb-bottle); }
.mb-stop__street { font-family: var(--mb-display); font-weight: 400; font-size: 1.125rem; line-height: 1.2; }
.mb-stop__work { font-size: .875rem; color: var(--mb-loam-muted); }
.mb-stop__cadence { font-size: var(--mb-size-small); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--mb-bottle); }
.mb-stop--biweekly .mb-stop__cadence { color: var(--mb-clay); }

.mb-route__side { display: grid; gap: 1.5rem; align-content: start; }
.mb-route__photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.mb-route__print { width: 100%; border: 1.5px solid var(--mb-loam); }

.mb-start { display: grid; gap: 2rem; align-items: center; margin: var(--mb-band) var(--mb-inset) 0; padding: clamp(2rem, 5vw, 4rem); background: var(--mb-oat-deep); border: 1.5px solid var(--mb-loam); }
.mb-start__print { width: min(16rem, 60%); }
.mb-start__copy h2 { max-width: 13ch; }
.mb-start__copy p { max-width: 30rem; color: var(--mb-loam-muted); font-size: var(--mb-size-lede); }
.mb-start__actions { display: flex; flex-wrap: wrap; gap: .75rem; margin: 1.5rem 0 0; }

@media (min-width: 64rem) {
  .mb-route__head { grid-template-columns: 5fr 7fr; align-items: end; }
  .mb-route__head .mb-folio { grid-column: 1 / -1; }
  .mb-route__layout { grid-template-columns: 8fr 4fr; }
  .mb-week { grid-template-columns: repeat(5, minmax(0, 1fr)); column-gap: .75rem; }
  .mb-week__day { border-bottom: 0; }
  .mb-week__caption { grid-column: 1 / -1; }
  .mb-start { grid-template-columns: auto 1fr; gap: 4rem; }
}
