/* Header fixo (96px): âncoras (#slug do sumário, etc.) param ABAIXO da barra,
   não atrás dela. Sem isso o alvo rola para y=0 e o topo do título fica coberto. */
html { scroll-padding-top: calc(var(--vp-header-h) + 12px); }

/* site.css — camada do site SOBRE o design system (carregado após styles.css).
   A contenção de largura e o colapso de grades no mobile agora são do próprio
   design system (.vp-site @1440px + .vp-split/.vp-article--* que colapsam em
   ≤1024px). Aqui ficam só componentes de conteúdo que o DS não define e a troca
   de logo por tema. Sem !important; ganha por ordem de carga. */

/* E2 — blocos de artigo (citação e código) fora do vocabulário base do DS. */
.vp-quote {
  margin: 1.5em 0;
  padding-left: var(--vp-space-6);
  border-left: 3px solid var(--vp-accent);
  font: var(--vp-weight-display-md) var(--vp-text-title) / var(--vp-leading-heading) var(--vp-font-display);
  color: var(--vp-fg);
}
.vp-quote__autor {
  display: block;
  margin-top: 0.6em;
  font: var(--vp-weight-body) var(--vp-text-ui) / 1.4 var(--vp-font-body);
  color: var(--vp-fg-subtle);
}
.vp-code {
  display: block;
  margin: 1.5em 0;
  padding: var(--vp-space-5);
  overflow-x: auto;
  background: var(--vp-bg-elev);
  border: var(--vp-border-hair);
  border-radius: var(--vp-radius-md);
  font: 14px / 1.6 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  color: var(--vp-fg);
}

/* E8 — títulos das páginas de erro (404/500) com a fonte da marca. */
.vp-empty__title {
  margin: 0;
  font: var(--vp-weight-display) var(--vp-text-hero-sm) / var(--vp-leading-hero) var(--vp-font-display);
  color: var(--vp-fg);
}
.vp-empty__lead {
  margin: 0;
  font: var(--vp-weight-body) var(--vp-text-lead) / var(--vp-leading-body) var(--vp-font-body);
  color: var(--vp-fg-muted);
}

/* H2 — logo troca conforme o tema (branco no escuro, escuro no claro). */
.vp-logo__light { display: none; }
:root[data-theme="light"] .vp-logo__dark { display: none; }
:root[data-theme="light"] .vp-logo__light { display: inline; }

/* Artigo sem capa: o herói vira só o conteúdo (título+byline sobre o fundo escuro),
   sem forçar a altura da capa (evita um bloco escuro vazio). */
.vp-hero--no-cover { min-height: 0; }
.vp-hero--no-cover .vp-hero__content { justify-content: flex-start; }