/* Curtir cards com contador (ver curtir.js). Cores da página: --cor (marca) e --suave. Cópia idêntica em cada pasta que usa. */
.curtivel { position: relative; }
.curtivel > h2, .curtivel > h3 { padding-right: 64px; }
.curtir {
  position: absolute; top: .6rem; right: .6rem; display: inline-flex; align-items: center; justify-content: center; gap: .3rem;
  min-width: 44px; height: 44px; padding: 0 10px; border: 0; border-radius: 999px;
  background: transparent; color: var(--suave); cursor: pointer; line-height: 1;
  font: 600 .9rem/1 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums;
  transition: color .15s ease, background-color .15s ease;
}
.curtir svg { flex: none; width: 24px; height: 24px; fill: transparent; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; transition: fill .15s ease; }
.curtir:hover { color: var(--cor); background: var(--faixa, rgba(127, 127, 127, .12)); }
.curtir:focus-visible { outline: 3px solid var(--destaque); outline-offset: 1px; }
.curtir[aria-pressed="true"] { color: var(--cor); }
.curtir[aria-pressed="true"] svg { fill: currentColor; }
.curtir--pulso svg { animation: curtir-pulso .35s ease-out; }
@keyframes curtir-pulso { 0% { transform: scale(1); } 40% { transform: scale(1.3); } 100% { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .curtir, .curtir svg { transition: none; } .curtir--pulso svg { animation: none; } }