/* Treinamentos no celular: os slides deixam de ser uma imagem 1280x720 reduzida
   e viram blocos de leitura, com texto em tamanho normal e colunas empilhadas. */
@media (max-width: 700px) {
  html { --fit: 1 !important; }
  .deck { padding: 14px 0 72px; }
  .slide-wrap { width: auto !important; height: auto !important; margin: 0 12px 14px !important; }
  .slide {
    width: auto !important; height: auto !important; min-height: 0 !important;
    transform: none !important; border-radius: 16px !important;
  }
  .slide > .pad { padding: 28px 20px 26px !important; min-height: 0; }
  .slide * { max-width: 100%; }
  .slide { overflow-wrap: break-word; }
  .slide .glow, .slide .ghost { display: none !important; }
  .slide img, .slide svg { height: auto; }

  /* Tipografia */
  .s-kicker { font-size: 11px !important; }
  .s-title { font-size: 27px !important; margin-top: 12px !important; }
  .s-title.big { font-size: 32px !important; }
  .s-lead, .cover .sub { font-size: 16px !important; line-height: 1.5 !important; }
  .cover h1 { font-size: 40px !important; }
  .divider h2 { font-size: 34px !important; }
  .divider .ghostbg, .cover .glow { display: none !important; }
  .big-quote { font-size: 24px !important; }
  .bullets li { font-size: 16px !important; }
  .bullets li::before { top: 8px !important; }
  .cmp-list li, .usecase .p, .d-card .p, .gp, .lead-note, .stat .l, .slide .med-role, .slide .callout p { font-size: 14.5px !important; }
  .gnum { font-size: 34px !important; }
  .gh, .d-card .h { font-size: 18px !important; }
  .stat .n { font-size: 42px !important; }
  .stat .n .un { font-size: 22px !important; }

  /* Colunas viram uma pilha */
  .slide [class*="cols"], .slide .stats, .slide .tiles, .slide [class*="grid"]:not(.grid-bg), .slide [style*="grid-template-columns"] {
    grid-template-columns: 1fr !important; gap: 12px !important;
  }
  .slide [style*="display: flex"], .slide [style*="display:flex"] { flex-wrap: wrap; }
  .slide .flow { flex-direction: column !important; align-items: stretch !important; }
  .slide .flow .arrow { justify-content: center; }
  .slide [style*="position: absolute"]:not(.grid-bg), .slide [style*="position:absolute"]:not(.grid-bg) { position: static !important; }

  /* Rodapé do slide entra no fluxo */
  .s-foot { position: static !important; margin: 18px 0 0 !important; padding: 0 20px 18px; }
  .slide > .s-foot { padding: 0 20px 18px; }
  .slide .foot { position: static !important; margin: 18px 20px 18px !important; flex-wrap: wrap; gap: 8px; line-height: 1.4 !important; }
  /* Diagrama do ciclo do agente (workshop de IA): nós posicionados à mão, então reduz o bloco */
  .slide .agent-loop { max-width: none !important; zoom: .72; margin-left: auto; margin-right: auto; }
  .slide .cover-mark { position: static !important; margin: 22px 20px 0; width: 118px !important; }
  .slide .demo-tag { position: static !important; align-self: flex-start; margin: 0 0 14px; }

  /* Tabelas e código rolam de lado em vez de estourar o slide */
  .slide table { display: block; overflow-x: auto; font-size: 13px !important; }
  .slide pre, .slide .mock-body.code { overflow-x: auto; font-size: 12px !important; }
  .slide .mock-body, .slide .mock { min-width: 0; }

  /* Marcados pelo deck-mobile.js: o que estoura a largura do slide */
  .slide .dm-stack { grid-template-columns: minmax(0, 1fr) !important; grid-auto-flow: row !important; gap: 12px !important; }
  .slide .dm-stack > * { grid-column: auto !important; grid-row: auto !important; min-width: 0; }
  .slide .dm-wrap { flex-wrap: wrap !important; gap: 10px; }
  .slide .dm-wrap > * { min-width: 0; flex-shrink: 1; }
  .slide .dm-col { flex-direction: column !important; align-items: stretch !important; gap: 10px; }
  .slide .dm-col > * { width: auto !important; max-width: 100% !important; flex: none !important; }
  .slide .dm-grow { height: auto !important; min-height: 0 !important; max-height: none !important; }

  .deck-hint, body > .hint { display: none !important; }
  /* O contador por slide depende de ver 60% do slide, o que não acontece em slide alto */
  .deck-hud, #hud { display: none !important; }
}