/* Blocco casi clinici — griglia dinamica coi filtri per trattamento.
   Il widget comparativo usa le classi del blocco prima-dopo (b-pd__*),
   il cui CSS/JS viene accodato insieme a questo (inc/blocks.php). */

.b-cc__title {
  margin-bottom: var(--sp-3);
}

.b-cc__intro {
  max-width: 60ch;
  margin-inline: auto;
  color: var(--c-text-muted);
  margin-bottom: var(--sp-6);
}

.b-cc__filters {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--sp-2);
  margin-bottom: var(--sp-8);
}

.b-cc__filter {
  min-height: 40px;
  padding: 0.35em 1.1em;
  border: 1px solid rgb(13 43 74 / 0.12);
  border-radius: var(--radius-pill);
  background: var(--c-surface);
  color: var(--c-text-strong);
  font-size: var(--fs-sm);
  font-weight: 600;
  cursor: pointer;
  transition: border-color var(--transition), background var(--transition), color var(--transition);
}

.b-cc__filter:hover {
  border-color: var(--c-primary);
  color: var(--c-primary-dark);
  background: var(--c-primary-ghost);
}

.b-cc__filter.is-active {
  background: var(--c-primary-dark);
  border-color: var(--c-primary-dark);
  color: #fff;
}

.b-cc__case[hidden] {
  display: none;
}

.b-cc__meta {
  padding-top: var(--sp-4);
}

.b-cc__name {
  font-size: var(--fs-h4);
  margin-bottom: var(--sp-2);
}

.b-cc__tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-3);
  margin-bottom: var(--sp-2);
}

.b-cc__tag {
  display: inline-flex;
  padding: 0.2em 0.8em;
  border-radius: var(--radius-pill);
  background: var(--c-primary-light);
  color: var(--c-primary-dark);
  font-size: var(--fs-xs);
  font-weight: 600;
}

.b-cc__dur {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-1);
  color: var(--c-text-muted);
  font-size: var(--fs-sm);
}

.b-cc__desc {
  color: var(--c-text);
  margin: 0;
}

.b-cc__disclaimer {
  margin-top: var(--sp-8);
  font-size: var(--fs-sm);
  color: var(--c-text-muted);
}

/* Le foto dei casi usano la size `caso` (900×600): card in 3:2 */
.b-cc .b-pd__compare {
  aspect-ratio: 3 / 2;
}