/* ==========================================================================
   MURAL DE DEPOIMENTOS — mur-
   Citações paradas em colunas de altura livre, com serviço, data e fonte.
   Tokens usados: --bg --fg --fg-2 --fg-muted --rule --rule-2 --accent
                  --accent-ink --display --radius-media --radius-pill
   ========================================================================== */

.mur-topo{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:24px 48px;flex-wrap:wrap;
}

/* O agregado: a média em corpo grande e, ao lado, de onde ela vem e até
   quando. Número sem fonte e sem data não entra — ver a ficha. */
.mur-agregado{display:flex;align-items:center;gap:14px}
.mur-nota-media{
  font-family:var(--display);font-weight:700;font-size:clamp(34px,3.6vw,48px);
  letter-spacing:-.03em;line-height:1;color:var(--fg);font-variant-numeric:tabular-nums;
}
.mur-agregado-t{font-size:12.5px;line-height:1.5;color:var(--fg-muted)}
.mur-agregado-l{color:var(--fg-2);text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:var(--rule-2);transition:color .25s}
.mur-agregado-l:hover{color:var(--accent-ink,var(--accent))}

/* ---------------------------------------------------------------- o mural
   COLUNAS CSS, e não grade: cada card tem a altura da própria citação, e as
   colunas se arrumam sem buraco. A leitura desce coluna a coluna — em
   depoimento, a ordem não carrega informação, então isso não custa nada. */
.mur-grade{
  columns:3 280px;column-gap:clamp(14px,1.6vw,20px);
  margin-top:clamp(34px,5vh,52px);
}
.mur-item{break-inside:avoid;margin-block-end:clamp(14px,1.6vw,20px)}

.mur-card{
  margin:0;display:grid;gap:22px;
  padding:clamp(22px,2.2vw,30px);
  border:1px solid var(--rule);border-radius:var(--radius-media);
  background:color-mix(in srgb,var(--fg) 4%,var(--bg));
}
.mur-citacao{margin:0}
.mur-citacao p{
  font-family:var(--display);font-weight:600;
  font-size:clamp(17px,1.35vw,19px);line-height:1.45;letter-spacing:-.01em;
  color:var(--fg);text-wrap:pretty;
}
.mur-citacao p::before{content:"“"}
.mur-citacao p::after{content:"”"}

.mur-pe{
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;gap:12px;
  padding-top:16px;border-top:1px solid var(--rule);
}
.mur-disco{
  display:grid;place-items:center;inline-size:34px;block-size:34px;
  border-radius:var(--radius-pill);border:1px solid var(--rule-2);
  font-family:var(--display);font-weight:700;font-size:11px;letter-spacing:.04em;
  color:var(--fg-2);
}
.mur-quem{display:grid;gap:2px;min-inline-size:0}
.mur-nome{font-size:14px;color:var(--fg)}
.mur-servico{font-size:12px;color:var(--fg-muted)}
.mur-fonte{
  font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-muted);
  white-space:nowrap;
}

.mur-nota{margin-top:8px}

@media(max-width:520px){
  .mur-pe{grid-template-columns:auto minmax(0,1fr)}
  .mur-fonte{grid-column:2}
}