/* ============================================================
   Mídia kit em PDF a partir da própria página creator.
   Cmd/Ctrl + P → "Salvar como PDF".
   Aqui, ao contrário do CV, os fundos coloridos FICAM:
   um mídia kit é peça de marca, não documento de RH.
   Ligue "gráficos de fundo" na caixa de impressão.
   ============================================================ */

@page { size: A4; margin: 0; }

@media print {
  .rev, html.js .rev { opacity:1 !important; transform:none !important; animation:none !important; }
  html.js .anim-l, html.js .anim-r, html.js .anim-u, html.js .anim-p {
    animation:none !important; opacity:1 !important; transform:none !important; }

  html, body { background: var(--cabare) !important; }
  .page { max-width:none !important; padding: 9mm !important; }

  /* navegação e nota de rodapé do site não vão para o papel */
  .framerow nav, .endnote { display:none !important; }
  .framerow { padding: 0 2mm 5mm !important; }

  /* cada bloco vira uma página ou pelo menos não se parte no meio */
  .panel, .field { break-inside: avoid; page-break-inside: avoid; }
  .heroshell { break-after: page; page-break-after: always; }
  #brands { break-before: page; page-break-before: always; }

  body { font-size: 10pt !important; line-height: 1.55 !important; }
  .d-xl { font-size: 42pt !important; }
  .d-lg { font-size: 27pt !important; }
  .d-md { font-size: 19pt !important; }
  .lab  { font-size: 8pt !important; }
  .bd   { font-size: 10pt !important; line-height: 1.5 !important; }

  .hero { aspect-ratio: 16/10 !important; }
  .about { grid-template-columns: .9fr 1.1fr !important; gap: 7mm !important; }
  .about .shot { aspect-ratio: 3/4 !important; }
  .layers-top { grid-template-columns: 1fr 1.2fr !important; gap: 7mm !important; }
  .timeline { grid-template-columns: repeat(3,1fr) !important; gap: 6mm !important; }
  /* a faixa rolável do celular vira grade no papel */
  .feed { display: grid !important; grid-template-columns: repeat(5, 1fr) !important;
    overflow: visible !important; margin: 0 !important; padding: 0 !important; gap: 4mm !important; }
  .feed .post { flex: none !important; }
  .feedhead { grid-template-columns: 1fr 1.1fr !important; }
  .brandrow { grid-template-columns: 1.25fr 1fr 1fr !important; }
  .post { break-inside: avoid; page-break-inside: avoid; }
  #posts { break-before: page; page-break-before: always; }
  .stats { grid-template-columns: repeat(3,1fr) !important; }

  .pill { break-inside: avoid; }
  a { text-decoration: none !important; }
  h1,h2,h3,.disp { break-after: avoid; page-break-after: avoid; }
}
