/* Página Reconhecimentos (Figma: frame Reconhecimentos 76:1914).
   Base em css/base.css; topo e abas em css/institucional.css. */
.rec-texto{margin-top:calc(22 * var(--u));max-width:calc(917 * var(--u));min-width:280px}

/* Filtro por ano */
.filtros{margin-top:calc(64 * var(--u));display:flex;flex-wrap:wrap;gap:9px}
.filtro{
  height:30px;padding:0 16px;border-radius:15px;background:#fff;
  font-family:var(--titulo);font-size:15px;text-transform:uppercase;color:var(--tinta);
  transition:background .4s ease, color .4s ease;
}
.filtro:hover{background:var(--pessego)}
.filtro.ativo{background:var(--grafite);color:var(--pessego)}

/* Cards dos guias */
.guias{margin-top:23px;display:flex;flex-direction:column;gap:3px;padding-bottom:calc(71 * var(--u))}
.guia{
  display:grid;grid-template-columns:calc(196 * var(--u)) minmax(0,1fr);align-items:start;
  min-height:192px;padding:26px calc(84 * var(--u)) 26px calc(42 * var(--u));
  background:#fff;border-radius:21px;transition:transform .5s cubic-bezier(.16,1,.3,1), box-shadow .5s ease;
}
.guia:hover{transform:translateY(-3px);box-shadow:0 18px 36px -26px rgba(59,58,60,.45)}
.guia[hidden]{display:none}
.guia-logo{width:max(110px, calc(134 * var(--u)));height:139px;display:flex;align-items:center;justify-content:center}
.guia-logo img{max-width:100%;max-height:100%;object-fit:contain}
.guia-logo-texto{font-family:var(--titulo);font-size:17px;line-height:1.2;text-align:center;color:var(--grafite)}
.guia-corpo{padding-top:11px}
.guia-topo{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.guia-nome{font-family:var(--titulo);font-weight:var(--peso-titulo);font-size:15px;color:var(--tinta)}
.guia-anos{flex:none;font-family:var(--titulo);font-size:15px;color:var(--tinta);white-space:nowrap}
.guia-texto{margin-top:12px;max-width:917px;font-size:max(16px, calc(18.5 * var(--u)));line-height:1.64;color:#000}
.rec-vazio{display:none;margin-top:24px;font-size:17px;color:var(--tinta-2)}
.rec-vazio.visivel{display:block}

@media (max-width:1024px){
  .filtros{margin-top:40px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:-20px;padding-right:20px}
  .filtros::-webkit-scrollbar{display:none}
  .filtro{flex:none}
  .guia{grid-template-columns:1fr;row-gap:12px;padding:24px}
  .guia-logo{height:90px;width:110px;justify-content:flex-start}
  .guia-corpo{padding-top:0}
  .guia-topo{flex-direction:column;gap:4px}
  .guias{padding-bottom:72px}
}
