/* print.css — impressão e geração do PDF.
   Carregado por último para vencer a cascata: o tema é controlado por
   data-theme no <html>, então as variáveis precisam ser reescritas aqui
   independentemente do tema ativo na tela. Sem isso, imprimir no tema
   escuro (o padrão) produz texto quase branco em papel branco.

   O PDF do funil é gerado deste arquivo — ver DESIGN.md §5. */

@media print {

  /* ---------- 1. tema forçado ----------
     Reescreve os tokens nos dois seletores porque data-theme="dark"
     e data-theme="light" têm a mesma especificidade da regra que
     sobrescrevem em tokens.css. */
  :root:not([data-pdf="fiel"]),
  :root:not([data-pdf="fiel"])[data-theme="dark"],
  :root:not([data-pdf="fiel"])[data-theme="light"] {
    --bg: #ffffff;
    --surface: #ffffff;
    --surface-alt: #ffffff;
    --text: #0d1b2a;
    --muted: #44515f;
    --border: #b9c2cc;
    --brand: #031653;
    --accent: #031653;          /* amarelo não imprime legível */
    --interactive: #031653;
    --highlight-bg: #ffffff;
    --highlight-ink: #031653;
    --badge-bg: #ffffff;
    --badge-ink: #031653;
    --btn-bg: #ffffff;
    --btn-ink: #031653;
    --success: #0d1b2a;
    --success-ink: #0d1b2a;
    --accent-ink: #031653;
    --shadow: none;
  }

  /* Mundo Agenda: trilho e régua são navegação de tela. */
  .content::before,
  .part-intro::before,
  .regua {
    display: none !important;
  }
  .content {
    padding-left: 0 !important;
  }
  .section-heading span {
    position: static !important;
    transform: none !important;
    display: inline-grid !important;
    margin-right: 8pt;
  }
  .quando b {
    font-size: 20pt;
  }

  html, body {
    font-size: 11pt;
  }

  html:not([data-pdf="fiel"]),
  :root:not([data-pdf="fiel"]) body {
    background: #fff !important;
    color: var(--text) !important;
  }

  /* ---------- 1b. modo fiel (?pdf=fiel) ----------
     PDF com a identidade da tela: hero navy, amarelo e superfícies
     coloridas sobrevivem. As regras de "papel" acima e abaixo são
     todas condicionadas a :not([data-pdf="fiel"]); aqui só forçamos
     a impressão das cores de fundo (o Chrome as descarta por padrão)
     e devolvemos respiro lateral ao hero, que no papel perde o
     padding fluido da tela. */
  :root[data-pdf="fiel"],
  :root[data-pdf="fiel"] * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  /* Capa de livro: o hero navy ocupa a primeira página inteira,
     com o texto centrado verticalmente. */
  :root[data-pdf="fiel"] .hero {
    padding: 30pt 24pt !important;
    min-height: 240mm !important;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  /* O hero navy vira capa branca; os textos claros dele precisam
     de tinta escura ou somem no papel. */
  :root:not([data-pdf="fiel"]) .eyebrow {
    color: var(--brand) !important;
  }
  :root:not([data-pdf="fiel"]) .hero-title {
    color: var(--brand) !important;
  }
  :root:not([data-pdf="fiel"]) .hero-lead {
    color: var(--text) !important;
  }
  :root:not([data-pdf="fiel"]) .hero-lead em {
    color: var(--brand) !important;
    font-weight: 700;
  }

  /* ---------- 2. chrome de navegação ----------
     Nada que sirva à navegação na tela existe no papel. */
  .site-header,
  .sidebar,
  .reading-progress,
  .urgency-bar,
  .search-overlay,
  .hero-actions,
  .hero-visual,
  .icon-button,
  .menu-button {
    display: none !important;
  }

  /* ---------- 3. layout ----------
     A sidebar é position:fixed com 290px reservados no .content;
     sem isto, cada página desperdiça essa margem. */
  .content {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .section,
  .part-intro,
  .hero {
    padding: 10pt 0 !important;
    min-height: auto !important;
  }

  :root:not([data-pdf="fiel"]) .section,
  :root:not([data-pdf="fiel"]) .part-intro,
  :root:not([data-pdf="fiel"]) .hero {
    background: #fff !important;
    color: var(--text) !important;
  }

  /* Redundante desde que a tela também alinha à esquerda, mas mantido
     como garantia caso a regra de tela mude. */
  .section-heading,
  .section-heading h2,
  .lead {
    text-align: left !important;
  }

  :root:not([data-pdf="fiel"]) .section.alt,
  :root:not([data-pdf="fiel"]) .section.highlight {
    background: #fff !important;
  }

  /* ---------- 4. quebras de página ----------
     Formato livro: o hero é a capa, cada .part-intro abre um
     capítulo em página própria e cada .section começa em página
     nova. Seções maiores que a folha seguem fluindo nas páginas
     seguintes, como um capítulo de livro. */
  .part-intro {
    break-before: page;
    border-top: 2pt solid var(--brand);
    padding-top: 14pt !important;
  }

  .section {
    break-before: page;
  }

  /* break-inside: avoid só em blocos que cabem numa página.
     Aplicá-lo a .section (que pode ser mais alta que a folha) faz o
     motor empurrar a seção inteira para a página seguinte e deixar
     70% da anterior em branco — verificado no PDF renderizado. */
  .callout,
  .swap-note,
  .merge-diagram,
  .worked-grid article,
  .cards article,
  .timeline article,
  .example-data,
  .formula-strip,
  .glossary,
  .interactive-checklist label,
  .hero-countdown,
  tr {
    break-inside: avoid;
  }

  h1, h2, h3 {
    break-after: avoid;
  }

  :root:not([data-pdf="fiel"]) h1,
  :root:not([data-pdf="fiel"]) h2,
  :root:not([data-pdf="fiel"]) h3 {
    color: var(--brand) !important;
    -webkit-text-fill-color: var(--brand) !important;
  }

  h2 { font-size: 15pt; }
  h3 { font-size: 12pt; }

  /* ---------- 4b. grids que assumem altura de viewport ----------
     Vários grids usam `1fr` em linhas ou dependem de align-items:center.
     No papel, uma folha é bem mais alta que larga: a linha estica e
     abre vazios de meia página. Verificado no PDF renderizado. */
  .formula-strip,
  .swap-note,
  .merge-grid,
  .comparison,
  .example-data,
  .worked-grid,
  .cards,
  .overview-grid,
  .result-grid,
  .mindmap,
  .flow,
  .layer-flow,
  .timeline,
  .interactive-checklist {
    align-items: start !important;
    align-content: start !important;
    grid-auto-rows: min-content !important;
    gap: 8pt !important;
  }

  /* A seta central da comparação só faz sentido em 3 colunas. */
  .comparison-arrow,
  .split-arrow {
    align-self: center;
  }

  /* ---------- 5. tipografia de leitura no papel ---------- */
  p, li, td, th {
    orphans: 3;
    widows: 3;
  }

  .lead,
  .hero-lead,
  p {
    max-width: 68ch;
  }

  /* Valores fiscais alinham na vírgula — ver DESIGN.md §3.
     No papel isto importa mais que na tela: o leitor confere a soma. */
  .result-grid strong,
  .grand-total strong,
  .worked-grid strong,
  .example-data b,
  .formula-strip strong,
  .timeline b,
  table td,
  table th {
    font-variant-numeric: tabular-nums;
  }

  /* ---------- 6. superfícies e bordas ----------
     Gradientes e sombras viram tinta desperdiçada ou blocos pretos. */
  :root:not([data-pdf="fiel"]) .card,
  :root:not([data-pdf="fiel"]) .cards article,
  :root:not([data-pdf="fiel"]) .callout,
  :root:not([data-pdf="fiel"]) .glossary,
  :root:not([data-pdf="fiel"]) .worked-grid article,
  :root:not([data-pdf="fiel"]) .timeline article,
  :root:not([data-pdf="fiel"]) .interactive-checklist label,
  :root:not([data-pdf="fiel"]) .hero-countdown,
  :root:not([data-pdf="fiel"]) .formula-strip,
  :root:not([data-pdf="fiel"]) .example-data {
    background: #fff !important;
    box-shadow: none !important;
    border: 1pt solid var(--border) !important;
  }

  :root:not([data-pdf="fiel"]) th,
  :root:not([data-pdf="fiel"]) .grand-total,
  :root:not([data-pdf="fiel"]) .button,
  :root:not([data-pdf="fiel"]) .section-heading span,
  :root:not([data-pdf="fiel"]) .part-intro span {
    background: #fff !important;
    background-image: none !important;
    color: var(--brand) !important;
    -webkit-text-fill-color: var(--brand) !important;
    border: 1pt solid var(--brand) !important;
  }

  /* ---------- 7. conteúdo que só existe expandido ----------
     <details> na sidebar já saiu; estes são os do corpo. */
  details {
    display: block !important;
  }

  details > summary {
    display: block !important;
    font-weight: 700;
  }

  details:not([open]) > *:not(summary) {
    display: revert !important;
  }

  /* Regressão conhecida: .timeline-scrub article fica em opacity:.5
     até o GSAP aplicar .is-active. Na impressão o GSAP não roda,
     então os 4 marcos sairiam esmaecidos.
     Idem para os alvos do fromTo(autoAlpha:0) em animations.js:
     abaixo da primeira dobra ninguém rola, então cards, headings e
     diagramas imprimiriam invisíveis (visibility:hidden inline)
     mas ainda ocupando a própria altura — meia página em branco. */
  .timeline-scrub article,
  .reveal,
  [class*="reveal"],
  .section .cards article,
  .section-heading,
  .split-diagram,
  .split-parts {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    filter: none !important;
    animation: none !important;
    transition: none !important;
  }

  /* ---------- 8. links ----------
     O destino precisa viajar com o papel — mas só o que é externo.
     Âncoras internas (#secao) não significam nada impressas. */
  a {
    text-decoration: underline;
  }

  :root:not([data-pdf="fiel"]) a {
    color: var(--brand) !important;
  }

  a[href^="http"]::after {
    content: " (" attr(href) ")";
    font-size: 8pt;
    font-weight: 400;
    color: var(--muted);
    word-break: break-all;
  }

  a[href^="#"]::after,
  a[href^="["]::after {
    content: "";
  }

  /* ---------- 9. checklist ----------
     Impresso serve para preencher à mão; a caixa precisa ter contorno. */
  .interactive-checklist input[type="checkbox"] {
    -webkit-appearance: none;
    appearance: none;
    width: 10pt;
    height: 10pt;
    border: 1pt solid var(--text);
    border-radius: 2pt;
    display: inline-block;
    vertical-align: middle;
  }

  /* O formulário não funciona no papel; o checklist de ação sim —
     é a razão de o contador imprimir. */
  /* Índice mobile e formulário não funcionam no papel. */
  .capture,
  .toc {
    display: none !important;
  }

  .action-steps li {
    break-inside: avoid;
  }

  :root:not([data-pdf="fiel"]) .action-steps li {
    border: 1pt solid var(--border) !important;
  }

  :root:not([data-pdf="fiel"]) .reassure {
    border: 1pt solid var(--text) !important;
    background: #fff !important;
  }

  .interactive-checklist input[type="checkbox"]:checked::after {
    content: "×";
    display: block;
    text-align: center;
    line-height: 10pt;
    font-size: 10pt;
  }

  /* ---------- 10. rodapé ---------- */
  .site-footer {
    padding: 14pt 0 !important;
    text-align: left;
    break-inside: avoid; /* as duas linhas viajam juntas, sem página órfã */
  }

  :root:not([data-pdf="fiel"]) .site-footer {
    background: #fff !important;
    color: var(--text) !important;
    border-top: 1pt solid var(--border);
  }

  .site-footer .brand-cta {
    display: none !important;
  }

  /* ---------- 11. página ---------- */
  @page {
    margin: 16mm 14mm;
  }

  @page :first {
    margin-top: 12mm;
  }
}