/* For your office: the six jobs, October 17, 2026 */
.stage-index { aspect-ratio: 5 / 4; }
.index-card { position: absolute; left: 10%; right: 10%; top: 50%; transform: translateY(-50%); background: var(--card); border: 1px solid var(--rule); border-radius: 4px; padding: 20px 22px 10px; display: grid; gap: 6px; }
.index-card ol { list-style: none; margin: 0; padding: 0; display: grid; }
.index-card li + li { border-top: 1px solid var(--rule); }
.index-card a { display: flex; align-items: baseline; gap: 16px; min-height: 48px; padding: 12px 0; text-decoration: none; font-size: 17px; font-weight: 500; }
.index-card a:hover { text-decoration: underline; text-underline-offset: 4px; }
.index-card .n { font-family: var(--mono); font-size: 13px; font-weight: 400; color: var(--muted); }

.band-jobs { padding-top: 24px; }
.jobs { list-style: none; margin: 0; padding: 0; display: grid; }
.job { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 56px; padding: 64px 0; border-top: 1px solid var(--rule); align-items: start; scroll-margin-top: 90px; }
.job:first-child { border-top: 0; padding-top: 40px; }
.job-head { display: grid; gap: 18px; min-width: 0; }
.job-head .n { font-family: var(--mono); font-size: 14px; color: var(--muted); }
.job h2 { font-size: clamp(28px, 3vw, 40px); max-width: 18ch; }
.job-head .ex { margin-top: 10px; max-width: 460px; }
.job .rows dt { font-family: var(--mono); font-weight: 400; font-size: 13.5px; letter-spacing: 0.02em; color: var(--muted); padding-top: 3px; }
.job .rows dd { color: var(--ink); }
.job .rows .stops dt { display: flex; gap: 10px; align-items: baseline; }
.job .rows .stops dt::before { content: ""; width: 10px; height: 10px; flex: none; transform: translateY(1px); background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='%23FF5C1C' d='M6 0Q7 5 12 6Q7 7 6 12Q5 7 0 6Q5 5 6 0Z'/%3E%3C/svg%3E") center / contain no-repeat; }
.job .rows .stops dd { color: var(--muted); }

.fields > div { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
.fields > div:nth-child(-n+3) dt { font-size: 20px; }
.note a { color: var(--ink); text-underline-offset: 3px; }
.band-night .rows dd a { color: #E9E7E1; text-underline-offset: 3px; }
.band-night .head { max-width: 560px; }
.band-night .head > p { color: #CFCBC2; }
.band-night .actions { margin-top: 12px; }

@media (max-width: 1020px) {
  .job { grid-template-columns: minmax(0, 1fr); gap: 28px; }
}
@media (max-width: 760px) {
  .stage-index { aspect-ratio: auto; min-height: 460px; }
  .index-card { left: 0; right: 0; }
  .job { padding: 48px 0; }
  .job h2 { max-width: none; }
}
.job .rows { border-top: 0; }
.job .rows > div:first-child { padding-top: 6px; }
#fields .head { position: sticky; top: 104px; }
@media (max-width: 760px) { #fields .head { position: static; } }
.job .rows > div:last-child { border-bottom: 0; }
@media (max-width: 760px) {
  .fields > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .fields > div:nth-child(-n+3) dt { font-size: 18px; }
}

/* Jobs 04 to 06: one compact row of three */
.jobs-mini { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--rule); }
.job-mini { padding: 40px 28px 8px 0; display: grid; gap: 14px; align-content: start; min-width: 0; scroll-margin-top: 90px; }
.job-mini + .job-mini { padding-left: 28px; border-left: 1px solid var(--rule); }
.job-mini-head { display: grid; gap: 12px; }
.job-mini-head .n { font-family: var(--mono); font-size: 14px; color: var(--muted); }
.job-mini h3 { font-size: 24px; line-height: 1.15; }
.job-mini .rows { border-top: 0; }
.job-mini .rows > div { grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 14px 0; }
.job-mini .rows > div:last-child { border-bottom: 0; }
.job-mini .rows dt { font-family: var(--mono); font-weight: 400; font-size: 13px; letter-spacing: 0.02em; color: var(--muted); }
.job-mini .rows dd { color: var(--ink); font-size: 16px; }
.job-mini .rows .stops dt { display: flex; gap: 10px; align-items: baseline; }
.job-mini .rows .stops dt::before { content: ""; width: 10px; height: 10px; flex: none; transform: translateY(1px); background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='%23FF5C1C' d='M6 0Q7 5 12 6Q7 7 6 12Q5 7 0 6Q5 5 6 0Z'/%3E%3C/svg%3E") center / contain no-repeat; }
.job-mini .rows .stops dd { color: var(--muted); }
@media (max-width: 1020px) {
  .jobs-mini { grid-template-columns: minmax(0, 1fr); }
  .job-mini, .job-mini + .job-mini { padding: 32px 0 8px; border-left: 0; }
  .job-mini + .job-mini { border-top: 1px solid var(--rule); }
}
