/* Resumos de Pediatria · Batistaz — mesmo "livro antigo" dos PDFs e do TOCE Lab */
:root {
  --papel: #ece3cf; --tinta: #2f2419; --tinta-2: #55432f; --fraco: #6a5741;
  --filete: #7a6549; --linha: #cfbf9e; --vinho: #7a2e25; --tom: rgba(120,88,45,.08);
  --cartao: #f4eddd; --topo: rgba(236,227,207,.95);
}
* { box-sizing: border-box; }
body {
  margin: 0; color: var(--tinta); font-family: "EB Garamond", Garamond, Georgia, serif; font-size: 18px; line-height: 1.5;
  background: linear-gradient(180deg, #efe7d5 0%, #e8ddc5 100%) fixed, var(--papel);
}
a { color: var(--vinho); }
h1, h2, h3 { font-weight: 500; line-height: 1.15; margin: 0; }
.rotulo { font-variant: small-caps; letter-spacing: .16em; color: var(--vinho); font-size: 15px; }

.topo { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; gap: 16px;
  padding: 10px max(16px, calc((100% - 1040px) / 2)); background: var(--topo); backdrop-filter: blur(8px); border-bottom: 1px solid var(--filete); }
.marca { display: flex; align-items: center; gap: 10px; color: var(--tinta); text-decoration: none; }
.marca svg { width: 30px; height: 40px; color: var(--tinta); }
.marca b { display: block; font-variant: small-caps; letter-spacing: .2em; font-size: 20px; font-weight: 500; }
.marca small { display: block; font-style: italic; color: var(--fraco); font-size: 14px; margin-top: -3px; }

main { max-width: 1040px; margin: 0 auto; padding: 28px 16px 48px; }
.carregando { text-align: center; color: var(--fraco); font-style: italic; }

.abertura { text-align: center; margin: 12px 0 20px; }
.abertura h1 { font-size: clamp(34px, 6vw, 50px); }
.abertura p { margin: 8px auto 0; max-width: 620px; font-style: italic; color: var(--tinta-2); }
.filete { width: 70px; margin: 14px auto 0; border-top: 1px solid var(--filete); }
.contagem-temas { text-align: center; color: var(--fraco); font-style: italic; font-size: 16px; margin: 0 0 8px; }

.botao { display: inline-flex; align-items: center; padding: 8px 16px; border: 1px solid var(--tinta-2); background: var(--tinta);
  color: var(--papel); font: inherit; font-size: 16px; text-decoration: none; border-radius: 2px; }
.botao.claro { background: transparent; color: var(--tinta); }
.botao:hover { background: var(--vinho); border-color: var(--vinho); color: var(--papel); }
.acoes { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }

.resumo-card { display: grid; grid-template-columns: 170px 1fr; gap: 28px; align-items: center; padding: 24px 0; border-bottom: 1px solid var(--linha); }
.resumo-card img { width: 100%; border: 1px solid var(--linha); box-shadow: 0 10px 22px rgba(58, 46, 34, .18); display: block; }
.resumo-card h2 { font-size: 30px; }
.resumo-card .sub { font-style: italic; color: var(--tinta-2); margin: 4px 0 14px; }
.resumo-card small { display: block; margin-top: 10px; color: var(--fraco); font-size: 14px; }
.resumo-card small + small { margin-top: 2px; }

.proximos { margin-top: 34px; }
.sessoes { list-style: none; margin: 6px 0 0; padding: 0; }
.sessao { display: grid; grid-template-columns: 1fr auto; gap: 16px; align-items: center; padding: 13px 0; border-bottom: 1px solid var(--linha); }
.sessao h3 { font-size: 21px; }
.sessao p { margin: 2px 0 0; font-size: 15px; color: var(--fraco); font-style: italic; }
.selo { font-variant: small-caps; letter-spacing: .1em; font-size: 14px; color: var(--fraco); white-space: nowrap; }

.rodape { max-width: 1040px; margin: 0 auto; padding: 18px 16px 34px; border-top: 1px solid var(--filete); text-align: center; color: var(--fraco); font-size: 14px; font-style: italic; }
.rodape p { margin: 4px 0; }

@media (max-width: 720px) {
  body { font-size: 17px; }
  .resumo-card { grid-template-columns: 1fr; gap: 16px; justify-items: start; }
  .resumo-card > a { width: 150px; }
  .resumo-card h2 { font-size: 25px; }
  .acoes .botao { width: 100%; justify-content: center; }
  .sessao { grid-template-columns: 1fr; gap: 4px; }
}