/* Hallmark · pre-emit critique: P5 H5 E4 S5 R4 V5
 * Hallmark · genre: modern-minimal · macrostructure: Marquee Hero · theme: custom "ForSign" (herdado de tokens.css)
 * tone: austero · anchor hue: 185 (verde-petróleo) · enrichment: E5 hand-built Tier A (ordem de assinatura em CSS)
 * nav: N5 · footer: Ft2 (parciais compartilhados do site — não rotacionam)
 * dobra: afirmação única sem botão + trilho dos quatro argumentos · divisor: régua grossa
 * abaixo da dobra: livro-razão de 4 argumentos, cada um com textura própria
 *   01 glosa (hoje/depois) · 02 acreditação (lista do auditor) · 03 híbrida (largura cheia + diagrama) · 04 TMA (linha do tempo)
 * motion: .reveal + nudge da seta (ambas já existiam no site) — nenhuma primitiva nova
 * Página escrita à mão: NÃO é gerada por tools/build-setores.py (o gerador pula o slug "saude").
 */

:root {
  /* Tokens locais desta página (gate 48: nada de valor solto no meio do CSS) */
  --text-marquee: clamp(2.6rem, 7.5vw + 0.5rem, 6.5rem);
  --rule-thick: 3px;
  --saude-rail: clamp(14rem, 22vw, 21rem);   /* coluna do numeral e do título no livro-razão */
}

/* ---------- Dobra: a afirmação ---------- */
.marquee {
  padding-block: calc(var(--nav-height) + var(--space-2xl)) var(--space-2xl);
  min-height: clamp(32rem, 78dvh, 46rem);
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: var(--space-lg);
  align-content: stretch;
}
.marquee__kicker {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--text-sm);
  color: var(--color-accent-deep);
}
.marquee h1 {
  align-self: center;
  font-size: var(--text-marquee);
  line-height: 0.98;
  letter-spacing: -0.035em;
  max-width: 15ch;
  text-wrap: balance;
}

/* Trilho: a dobra também é o índice — quatro argumentos, quatro cadeiras do hospital */
.rail {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  border-top: var(--rule-hair) solid var(--color-rule);
}
.rail__item {
  display: grid;
  grid-template-columns: 2.25rem minmax(0, 1fr);
  align-items: baseline;
  gap: var(--space-xs);
  padding-block: var(--space-sm);
  border-bottom: var(--rule-hair) solid var(--color-rule);
  min-height: 44px;
  text-decoration: none;
  transition: background-color var(--dur-short) var(--ease-out);
}
.rail__num {
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  font-variant-numeric: tabular-nums;
  color: var(--color-accent);
}
.rail__name {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--text-base);
  color: var(--color-ink);
}
.rail__who {
  grid-column: 2;
  font-size: var(--text-xs);
  color: var(--color-muted);
}
.rail__item:hover { background: var(--color-paper-2); }
.rail__item:hover .rail__name { text-decoration: underline; text-underline-offset: 0.18em; }
.rail__item:active { background: var(--color-paper-3); }

@media (min-width: 60rem) {
  .marquee { padding-block: calc(var(--nav-height) + var(--space-3xl)) var(--space-2xl); }
  .rail { grid-template-columns: repeat(4, minmax(0, 1fr)); border-bottom: var(--rule-hair) solid var(--color-rule); }
  .rail__item { border-bottom: 0; padding: var(--space-md) var(--space-md) var(--space-md) 0; }
  .rail__item + .rail__item { border-left: var(--rule-hair) solid var(--color-rule); padding-left: var(--space-md); }
}

/* Alvos de âncora: o trilho e o menu levam para cá, e a pílula do nav flutua por cima */
.arg, .hybrid, .route, .qa, .reading, .close { scroll-margin-top: calc(var(--nav-height) + var(--space-2xl)); }

/* Divisor duro entre a dobra e o resto */
.cut { border: 0; border-top: var(--rule-thick) solid var(--color-ink); margin: 0; }

/* ---------- Livro-razão: um argumento por bloco ---------- */
.arg { padding-block: var(--space-2xl) var(--space-3xl); }
.arg + .arg { border-top: var(--rule-hair) solid var(--color-rule); }
.arg__inner { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-lg); }
.arg__head { display: grid; gap: var(--space-xs); align-content: start; }
.arg__num {
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  font-variant-numeric: tabular-nums;
  color: var(--color-accent);
}
.arg__head h2 { font-size: var(--text-xl); max-width: 17ch; text-wrap: balance; }
.arg__who {
  font-size: var(--text-xs);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-muted);
}
.arg__body { display: grid; gap: var(--space-lg); min-width: 0; }
.arg__body p { color: var(--color-ink-2); max-width: 66ch; }

/* Par "hoje / com a ForSign" */
.beat { display: grid; gap: var(--space-xs); padding-top: var(--space-md); border-top: var(--rule-hair) solid var(--color-rule); }
.beat__label {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--text-sm);
  color: var(--color-ink);
}
.beat--now .beat__label { color: var(--color-muted); }
.beat--now p { color: var(--color-muted); }

/* Fio de links para a funcionalidade que sustenta a afirmação */
.threads { display: flex; flex-wrap: wrap; gap: var(--space-xs); }
.threads a {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 var(--space-sm);
  border: var(--rule-hair) solid var(--color-rule);
  border-radius: var(--radius-pill);
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--text-sm);
  line-height: 1;
  color: var(--color-ink);
  text-decoration: none;
  white-space: nowrap;
  transition: border-color var(--dur-short) var(--ease-out), background-color var(--dur-short) var(--ease-out);
}
.threads a:hover { border-color: var(--color-ink); background: var(--color-paper-2); }
.threads a:active { background: var(--color-paper-3); }

.proof {
  font-size: var(--text-sm);
  color: var(--color-muted);
  padding-left: var(--space-md);
  border-left: var(--rule-hair) solid var(--color-accent);
}

@media (min-width: 60rem) {
  .arg__inner { grid-template-columns: var(--saude-rail) minmax(0, 1fr); column-gap: var(--space-2xl); }
  .arg__head { position: sticky; top: calc(var(--nav-height) + var(--space-lg)); align-self: start; }
}

/* 02 · o que o auditor recebe — lista com régua, não cartão */
.audit { display: grid; border-top: var(--rule-hair) solid var(--color-rule); }
.audit > li {
  display: grid;
  gap: var(--space-3xs);
  padding-block: var(--space-md);
  border-bottom: var(--rule-hair) solid var(--color-rule);
}
.audit strong { font-family: var(--font-display); font-weight: 500; font-size: var(--text-base); }
.audit span { font-size: var(--text-sm); color: var(--color-ink-2); }
@media (min-width: 48rem) {
  .audit > li { grid-template-columns: minmax(0, 16rem) minmax(0, 1fr); align-items: baseline; column-gap: var(--space-lg); }
}

/* ---------- 03 · Assinatura híbrida: quebra de ritmo, largura cheia ---------- */
.hybrid { background: var(--color-paper-2); border-top: var(--rule-hair) solid var(--color-rule); padding-block: var(--space-2xl) var(--space-3xl); }
.hybrid__inner { display: grid; gap: var(--space-xl); }
.hybrid__head { display: grid; gap: var(--space-sm); }
.hybrid__head h2 { font-size: var(--text-3xl); max-width: 18ch; }
.hybrid__head .lede { max-width: 58ch; }
.hybrid__split { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-xl); }
.hybrid__text { display: grid; gap: var(--space-md); align-content: start; }
.hybrid__text p { color: var(--color-ink-2); max-width: 58ch; }
@media (min-width: 66rem) {
  .hybrid__split { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); column-gap: var(--space-2xl); }
}

/* A ordem de assinatura — desenho em CSS (Tier A), não captura de tela */
.order {
  display: grid;
  gap: 0;
  background: var(--color-paper);
  border: var(--rule-hair) solid var(--color-rule);
  border-radius: var(--radius-lg);
  padding: clamp(1rem, 3vw, 1.75rem);
  align-content: start;
}
.order__cap {
  font-size: var(--text-xs);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-muted);
  padding-bottom: var(--space-sm);
  border-bottom: var(--rule-hair) solid var(--color-rule);
}
.step {
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1fr);
  column-gap: var(--space-sm);
  padding-block: var(--space-md);
  border-bottom: var(--rule-hair) solid var(--color-rule-2);
}
.step__ord {
  /* display, não mono: JetBrains Mono abre um vão feio antes do indicador ordinal "ª" */
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--text-sm);
  font-variant-numeric: tabular-nums;
  color: var(--color-muted);
  padding-top: 0.1em;
}
.step__who { font-family: var(--font-display); font-weight: 500; font-size: var(--text-base); }
.step__how { font-size: var(--text-sm); color: var(--color-ink-2); }
.step__mark {
  margin-top: var(--space-xs);
  height: 2.25rem;
  border: var(--rule-hair) dashed var(--color-rule);
  border-radius: var(--radius-sm);
  display: grid;
  align-items: center;
  padding-inline: var(--space-sm);
  font-size: var(--text-xs);
  color: var(--color-muted);
}
.step--cert .step__ord { color: var(--color-accent); }
.step--cert .step__mark {
  border-style: solid;
  border-color: var(--color-accent);
  background: var(--color-accent-soft);
  color: var(--color-accent-deep);
  font-family: var(--font-mono);
}
.order__out {
  display: grid;
  gap: var(--space-2xs);
  padding-top: var(--space-md);
}
.order__out strong { font-family: var(--font-display); font-weight: 500; font-size: var(--text-base); }
.order__out span { font-size: var(--text-sm); color: var(--color-ink-2); }

.note {
  display: grid;
  gap: var(--space-2xs);
  padding: var(--space-md);
  background: var(--color-paper);
  border: var(--rule-hair) solid var(--color-rule);
  border-radius: var(--radius-md);
}
.note strong { font-family: var(--font-display); font-weight: 500; font-size: var(--text-sm); }
.note p { font-size: var(--text-sm); color: var(--color-ink-2); max-width: 62ch; }

/* ---------- 04 · TMA: linha do tempo do atendimento ---------- */
.beats { display: grid; grid-template-columns: minmax(0, 1fr); border-top: var(--rule-hair) solid var(--color-rule); }
.beats > li {
  display: grid;
  gap: var(--space-2xs);
  padding-block: var(--space-md);
  border-bottom: var(--rule-hair) solid var(--color-rule);
}
.beats__when {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--text-xs);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-accent);
}
.beats strong { font-family: var(--font-display); font-weight: 500; font-size: var(--text-base); }
.beats p { font-size: var(--text-sm); color: var(--color-ink-2); }
@media (min-width: 60rem) {
  .beats { grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: var(--rule-hair) solid var(--color-rule); }
  .beats > li { border-bottom: 0; padding: var(--space-md) var(--space-lg) var(--space-md) 0; }
  .beats > li + li { border-left: var(--rule-hair) solid var(--color-rule); padding-left: var(--space-lg); }
}

/* ---------- Como o documento chega e volta: tabela, não cartões ---------- */
.route { padding-block: var(--space-2xl) var(--space-3xl); border-top: var(--rule-hair) solid var(--color-rule); display: grid; gap: var(--space-lg); }
.route h2 { font-size: var(--text-xl); max-width: 22ch; }
.route__table { display: grid; border-top: var(--rule-hair) solid var(--color-ink); }
.route__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-2xs);
  padding-block: var(--space-md);
  border-bottom: var(--rule-hair) solid var(--color-rule);
}
.route__name { font-family: var(--font-display); font-weight: 500; font-size: var(--text-base); }
.route__what { font-size: var(--text-sm); color: var(--color-ink-2); max-width: 62ch; }
.route__link { justify-self: start; }
@media (min-width: 60rem) {
  .route__row { grid-template-columns: minmax(0, 11rem) minmax(0, 1fr) minmax(0, 12rem); column-gap: var(--space-lg); align-items: baseline; }
  .route__link { justify-self: end; }
}

/* ---------- Logos, perguntas, blog, CTA ---------- */
.clients { padding-block: var(--space-2xl); border-top: var(--rule-hair) solid var(--color-rule); }
.clients__label { font-size: var(--text-sm); color: var(--color-muted); margin-bottom: var(--space-md); }
.clients__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: var(--rule-hair) solid var(--color-rule); border-left: var(--rule-hair) solid var(--color-rule); }
.clients__list li { display: grid; place-items: center; padding: var(--space-md); min-height: 5rem; border-right: var(--rule-hair) solid var(--color-rule); border-bottom: var(--rule-hair) solid var(--color-rule); }
.clients__list img { width: auto; max-width: 100%; max-height: 32px; height: auto; filter: grayscale(1); opacity: 0.72; transition: opacity var(--dur-short) var(--ease-out); }
.clients__list li:hover img { opacity: 1; }
@media (min-width: 40rem) { .clients__list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.qa { padding-block: var(--space-2xl) var(--space-3xl); border-top: var(--rule-hair) solid var(--color-rule); display: grid; gap: var(--space-lg); }
.qa h2 { font-size: var(--text-2xl); }
.qa dl { margin: 0; display: grid; border-top: var(--rule-hair) solid var(--color-rule); }
.qa dt { font-family: var(--font-display); font-weight: 600; font-size: var(--text-md); padding-top: var(--space-lg); max-width: 46ch; }
.qa dd { margin: 0; padding: var(--space-xs) 0 var(--space-lg); color: var(--color-ink-2); max-width: 68ch; border-bottom: var(--rule-hair) solid var(--color-rule); }
.qa dd a { color: var(--color-accent-deep); }

.reading { padding-block: var(--space-xl) var(--space-2xl); border-top: var(--rule-hair) solid var(--color-rule); display: grid; gap: var(--space-md); }
.reading h2 { font-size: var(--text-md); color: var(--color-muted); font-weight: 500; }
.reading ul { display: grid; border-top: var(--rule-hair) solid var(--color-rule); }
.reading li { border-bottom: var(--rule-hair) solid var(--color-rule); }
.reading a {
  display: flex;
  align-items: center;
  min-height: 3.25rem;
  padding-block: var(--space-sm);
  text-decoration: none;
  font-family: var(--font-display);
  font-weight: 500;
  color: var(--color-ink-2);
  transition: color var(--dur-short) var(--ease-out);
}
.reading a:hover { color: var(--color-accent-deep); text-decoration: underline; text-underline-offset: 0.18em; }
.reading a:active { color: var(--color-accent); }

.close { background: var(--color-paper-2); border-top: var(--rule-hair) solid var(--color-rule); padding-block: var(--space-3xl) var(--space-4xl); }
.close__inner { display: grid; gap: var(--space-lg); max-width: 56rem; }
.close h2 { font-size: var(--text-2xl); max-width: 20ch; }
.close .lede { max-width: 54ch; }
.close__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-md) var(--space-lg); }

/* ---------- Movimento reduzido ---------- */
@media (prefers-reduced-motion: reduce) {
  .rail__item,
  .threads a,
  .clients__list img,
  .reading a { transition-duration: 1ms; }
}

/* Valor literal da API dentro da prosa — outlier mono, terceiro slot da regra 2+1 */
.proof code { font-family: var(--font-mono); font-size: 0.92em; color: var(--color-ink-2); }

/* ============================================================
 * Ilustrações — desenho de linha em SVG + cartão que imita o produto.
 * Mesmo vocabulário da home (currentColor, stroke 1.4–2.2, sem preenchimento
 * colorido, aria-label na figure e aria-hidden no conteúdo).
 * ============================================================ */

/* Dobra · a assinatura que faltou */
.missing { display: grid; justify-items: start; margin-top: var(--space-md); }
.missing__field {
  display: grid;
  grid-template-columns: auto auto;
  grid-template-areas: "line line" "label state";
  align-items: center;
  gap: var(--space-2xs) var(--space-sm);
  padding: var(--space-sm) var(--space-md) var(--space-xs);
  border: var(--rule-hair) dashed var(--color-rule);
  border-radius: var(--radius-md);
  color: var(--color-muted);
}
.missing__line { grid-area: line; width: min(13.75rem, 60vw); height: auto; }
.missing__label { grid-area: label; font-size: var(--text-xs); }
.missing__state {
  grid-area: state;
  justify-self: end;
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  letter-spacing: 0.04em;
  color: var(--color-ink-2);
}

/* 01 · o pacote que sai */
.pack {
  border: var(--rule-hair) solid var(--color-rule);
  border-radius: var(--radius-md);
  padding: var(--space-md);
  background: var(--color-paper);
  display: grid;
  gap: var(--space-xs);
}
.pack__cap {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--text-xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-muted);
}
.pack ul { display: grid; }
.pack li {
  display: grid;
  grid-template-columns: 1rem minmax(0, 1fr);
  align-items: center;
  gap: var(--space-2xs) var(--space-sm);
  padding-block: var(--space-xs);
  border-top: var(--rule-hair) solid var(--color-rule-2);
  color: var(--color-ink-2);
}
.pack li svg { color: var(--color-accent); }
.pack__name { font-family: var(--font-mono); font-size: var(--text-sm); color: var(--color-ink); overflow-wrap: anywhere; }
.pack__meta { grid-column: 2; font-size: var(--text-xs); color: var(--color-muted); }
@media (min-width: 46rem) {
  .pack li { grid-template-columns: 1rem minmax(0, 17rem) minmax(0, 1fr); }
  .pack__meta { grid-column: auto; justify-self: end; text-align: right; }
}

/* 02 · trecho da trilha */
.trail {
  border: var(--rule-hair) solid var(--color-rule);
  border-radius: var(--radius-md);
  padding: var(--space-md);
  background: var(--color-paper);
  display: grid;
  gap: var(--space-xs);
}
.trail__cap {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--text-xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-muted);
}
.trail ol { margin: 0; padding: 0; list-style: none; display: grid; }
.trail li {
  display: grid;
  grid-template-columns: 3.5rem minmax(0, 1fr);
  gap: var(--space-sm);
  align-items: baseline;
  padding-block: var(--space-xs);
  padding-left: var(--space-md);
  border-left: var(--rule-hair) solid var(--color-rule);
  font-size: var(--text-sm);
  color: var(--color-ink-2);
  position: relative;
}
.trail li::before {
  content: "";
  position: absolute;
  left: calc(var(--space-xs) / -2);
  top: 1.05em;
  width: var(--space-xs);
  height: var(--space-xs);
  border-radius: 50%;
  background: var(--color-rule);
}
.trail__end::before { background: var(--color-accent); }
.trail__end { color: var(--color-ink); }
.trail__t { font-family: var(--font-mono); font-size: var(--text-xs); color: var(--color-muted); }
.trail__out {
  margin-top: var(--space-2xs);
  padding-top: var(--space-sm);
  border-top: var(--rule-hair) solid var(--color-rule-2);
  font-size: var(--text-xs);
  color: var(--color-accent-deep);
}

/* 03 · a folha do PDF com as duas marcas */
.sheet {
  width: 100%;
  height: auto;
  margin-block: var(--space-sm) var(--space-xs);
  color: var(--color-ink-2);
}
.sheet__sig { color: var(--color-ink); }
.sheet__cert, .sheet__check, .sheet__certtext { color: var(--color-accent); }
.sheet__certtext { font-family: var(--font-mono); }

/* 04 · o que sai da recepção */
.strike {
  border: var(--rule-hair) solid var(--color-rule);
  border-radius: var(--radius-md);
  padding: var(--space-md);
  background: var(--color-paper);
  display: grid;
  gap: var(--space-sm);
}
.strike__cap {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--text-xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-muted);
}
.strike__out { display: flex; flex-wrap: wrap; gap: var(--space-2xs) var(--space-md); }
.strike__out li {
  font-size: var(--text-sm);
  color: var(--color-muted);
  text-decoration: line-through;
  text-decoration-thickness: 1px;
  text-decoration-color: var(--color-accent);
  text-underline-offset: 0;
}
.strike__in {
  padding-top: var(--space-sm);
  border-top: var(--rule-hair) solid var(--color-rule-2);
  font-family: var(--font-display);
  font-weight: 500;
  font-size: var(--text-base);
  color: var(--color-ink);
}
.strike__mark { color: var(--color-accent); }