/* Hallmark · macrostructure: Split Studio (lean: Narrative Workflow band) · tone: grounded, direct, dignified · anchor hue: brick 29° · page: Treatments
 * theme: studied-DNA via design.md "limestone and brick" (locked; pages share it) · nav: N1b · footer: Ft3 (verbatim from index.html)
 * Hallmark · pre-emit critique: P5 H5 E4 S5 R4 V4
 * contrast: pass (40–41) · slop: pass (42–45) · honest: pass (46) · chrome: pass (47) · tokens: pass (48) · responsive: pass (49) · icons: pass (30) · mobile: pass (34, 49, 50–57)
 * Page layer over tokens.css + site.css. Tokens only: no raw colours, fonts or off-scale spacing.
 * Shared-component candidates kept here per the Phase 3 brief: .facts (ledger), .squares (list),
 * .level (detail block), .stage__jump (stage-line jump link), .cta-band__copy.
 */

/* ── Stage line: each stage ends with a jump link to its section ──
 * site.css mutes the stage's last paragraph; the link now comes last, so restate it for the description. */
.stages .stage-line { margin-bottom: 0; }
.stages .stage > p:not([class]) { color: var(--color-on-ink-muted); }
.stage__jump { justify-self: start; margin-top: var(--space-2xs); }

/* ── Levels of care: one paper band, four ledgers divided by an ink rule ── */
.levels { padding-block: var(--space-3xl) var(--space-2xl); }
.level__grid {
  display: grid; gap: var(--space-lg);
  padding-block: var(--space-xl) var(--space-2xl);
  border-top: var(--rule-strong) solid var(--color-ink);
}
.level:first-child .level__grid { border-top: 0; padding-top: 0; }
.level:last-child .level__grid { padding-bottom: 0; }

.level__head { display: grid; gap: var(--space-xs); align-content: start; justify-items: start; }
.level__stage {
  display: inline-flex; align-items: center; gap: var(--space-2xs);
  font-size: var(--text-sm); font-weight: var(--weight-strong); color: var(--color-text-2);
}
.level__stage::before { content: ""; flex: none; width: 0.75rem; height: 0.75rem; background: var(--color-accent); } /* the stage line's square marker, in brick on paper */
.level__dose {
  font-family: var(--font-display); font-weight: var(--weight-h3); font-size: var(--text-lg);
  line-height: var(--leading-snug); color: var(--color-text-2); font-variant-numeric: tabular-nums; text-wrap: balance;
  overflow-wrap: anywhere; min-width: 0;
}
.level__body { display: grid; gap: var(--space-lg); align-content: start; }

/* Facts sheet: label + value rows on hairlines, under a 2px ink rule (same rule set as admissions.css and
 * family-program.css, so it can lift into site.css as one shared component) */
@media (min-width: 40rem) { .facts > div { grid-template-columns: minmax(0, 10rem) minmax(0, 1fr); } }
/* In a level, the level's own ink rule already heads the row, so the sheet drops its top rule */
.level__body .facts { border-top: 0; }
.level__body .facts > div:first-child { padding-top: 0; }

.squares { list-style: square; margin: 0; padding-left: var(--space-md); display: grid; gap: var(--space-2xs); max-width: var(--measure); }
.squares li::marker { color: var(--color-accent); }

@media (min-width: 60rem) {
  .level__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-2xl); }
}

/* ── Mental health (paper-2) · fitness (paper) · FAQ (paper-2): padding varies on purpose ── */
.mental .split__copy .squares { margin-block: var(--space-3xs); }
.fitness { padding-block: var(--space-2xl) var(--space-3xl); }
.faq-band { padding-block: var(--space-3xl) var(--space-2xl); }
.faq__a a:active { color: var(--color-accent-deep); } /* in-sentence links: site.css covers hover and focus */

/* ── Closing call band: the copy column stacks heading, line and link ── */