/* =========================================================
   Registros — o acervo de mídias
   Usa os tokens de app.css e as peças de diario.css (topo, busca, galeria, mídias).
   ========================================================= */

.acervo-filtros { display: flex; flex-wrap: wrap; gap: 12px; align-items: stretch; }
.acervo-filtros .diario-busca { flex: 1 1 340px; max-width: 560px; }
.acervo-select select {
  height: 46px; max-width: 100%; padding: 0 14px;
  border: 1px solid var(--linha-forte); background: var(--papel);
  font: inherit; font-size: 14.5px; color: var(--tinta); cursor: pointer;
}
.acervo-select select:focus { outline: 2px solid var(--tinta); outline-offset: -1px; }

.acervo-tipos { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.acervo-tipos a {
  display: inline-flex; align-items: baseline; gap: 8px; padding: 9px 14px;
  border: 1px solid var(--linha);
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--tinta);
  transition: border-color .2s ease, background .2s ease;
}
.acervo-tipos a span { color: var(--cinza); }
.acervo-tipos a:hover { border-color: var(--tinta); }
.acervo-tipos a[aria-current] { background: var(--tinta); border-color: var(--tinta); color: var(--papel); }
.acervo-tipos a[aria-current] span { color: var(--amarelo); }

/* ── Mês a mês ────────────────────────────────────────────── */
.acervo-mes { margin-top: clamp(40px, 5vw, 64px); }
.acervo-mes__titulo {
  display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap;
  padding-bottom: 12px; margin-bottom: 24px; border-bottom: 1px solid var(--tinta);
}
.acervo-mes__titulo span {
  font-family: var(--serif); font-weight: 400; font-size: clamp(30px, 3.6vw, 44px); line-height: 1; letter-spacing: -0.025em;
}
.acervo-mes__titulo small {
  font-family: var(--mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--cinza);
}

/* Fotos em colunas, cada uma na proporção original */
.acervo-grade { columns: 3 240px; column-gap: 20px; }
.acervo-foto { break-inside: avoid; margin: 0 0 26px; }
.acervo-foto .galeria__abrir { aspect-ratio: auto; }
.acervo-foto .galeria__abrir img { height: auto; }
.acervo-foto figcaption { display: grid; gap: 3px; padding-top: 10px; }

.acervo-meta { display: flex; flex-wrap: wrap; gap: 2px 12px; margin-top: 4px; font-size: 12.5px; color: var(--cinza); }
.acervo-meta a { color: var(--tinta); border-bottom: 1px solid var(--linha-forte); }
.acervo-meta a:hover { color: var(--coral); border-color: var(--coral); }

.acervo-mes .midias { margin-top: 8px; }

.acervo-vazio { margin-top: 40px; padding-top: 32px; border-top: 1px solid var(--linha); color: var(--cinza); }
.acervo-vazio__titulo {
  font-family: var(--serif); font-size: 26px; letter-spacing: -0.02em; color: var(--tinta); margin-bottom: 6px;
}
.acervo-vazio a { color: var(--coral); border-bottom: 1px solid currentColor; }

@media (max-width: 700px) {
  .acervo-filtros .diario-busca { flex-basis: 100%; }
  .acervo-select, .acervo-select select { width: 100%; }
  .acervo-grade { columns: 2 140px; column-gap: 12px; }
  .acervo-foto { margin-bottom: 18px; }
  .acervo-foto .galeria__descricao { display: none; }
  .acervo-mes .midia { grid-template-columns: 1fr; }
}