/* ============================================================
   CASI.CSS — Blocco "caso reale completo"
   Spostato da style.css: usato solo da /casi-reali/ (via
   template-parts/casi/card-completo.php in loop, più .casi-index e
   .bio-section--casi-full) e da /supporto-decisionale/ (via
   template-parts/supporto/caso-guida.php, che riusa card-completo.php
   per il caso #6). Nessuna altra pagina carica questo file.
   ============================================================ */

/* ============================================================
   INDICE CASI — pagina /casi-reali/
   ============================================================ */

.casi-index {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
  max-width: 900px;
  margin: 0 auto;
}
.casi-index__item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  background: var(--color-bg-section);
  border-radius: var(--radius-md);
  padding: 14px 16px;
  text-decoration: none;
  transition: box-shadow var(--transition), transform var(--transition);
}
.casi-index__item:hover { box-shadow: var(--shadow-card-hover); transform: translateY(-2px); }
.casi-index__num { font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--color-heading-accent); }
.casi-index__title { font-size: 0.875rem; font-weight: 600; color: var(--color-text-headline); line-height: 1.35; }

/* ============================================================
   CASO COMPLETO — usata in /casi-reali/ e nel Supporto Decisionale
   ============================================================ */

.caso-full {
  max-width: 820px;
  margin: 0 auto var(--s8);
  padding-bottom: var(--s7);
  border-bottom: 1px solid var(--color-border);
  scroll-margin-top: calc(var(--header-h) + 16px);
}
.caso-full:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }

.caso-full__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s3);
  margin-bottom: var(--s3);
  flex-wrap: wrap;
}
.caso-full__num { font-size: 0.8125rem; font-weight: 700; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: 0.06em; }
.caso-full__area {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-primary);
  background: var(--color-primary-soft);
  padding: 4px 12px;
  border-radius: var(--radius-pill);
  text-decoration: none;
}
.caso-full__area:hover { text-decoration: underline; }

.caso-full__ponte {
  font-size: 0.75rem;
  font-style: italic;
  color: var(--color-text-muted);
  flex-basis: 100%;
}

.caso-full__domande {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--color-navy);
  background: transparent;
  border: 1px solid var(--color-border-dark);
  padding: 4px 12px;
  border-radius: var(--radius-pill);
  text-decoration: none;
}
.caso-full__domande:hover { text-decoration: underline; }

.caso-full__title { font-size: clamp(1.375rem, 3vw, 1.75rem); font-weight: 700; color: var(--color-text-headline); line-height: 1.25; margin-bottom: var(--s3); }
.caso-full__subtitle { font-size: 1.0625rem; color: var(--color-text-muted); font-style: italic; margin-bottom: var(--s3); }
.caso-full__cliente { font-size: 0.9375rem; color: var(--color-text-body); margin-bottom: var(--s6); }

.caso-full__body { display: flex; flex-direction: column; gap: var(--s5); margin-bottom: var(--s6); }
.caso-full__section p { font-size: 0.9375rem; color: var(--color-text-body); line-height: 1.7; margin: 0 0 8px; }
.caso-full__section p:last-child { margin-bottom: 0; }
.caso-full__section-label {
  display: block;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-heading-accent);
  margin-bottom: var(--s2);
}
.caso-full__durata { font-size: 0.8125rem; color: var(--color-text-muted); font-style: italic; }

.caso-full__kpi-strip {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s4);
  background: var(--color-bg-section);
  border-radius: var(--radius-lg);
  padding: var(--s5);
  margin-bottom: var(--s5);
}
.caso-full__kpi { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 180px; }
.caso-full__kpi-num { font-size: 1.375rem; font-weight: 700; color: var(--color-primary); }
.caso-full__kpi-desc { font-size: 0.875rem; color: var(--color-text-muted); line-height: 1.45; }
.caso-full__kpi--secondario { justify-content: center; }

.caso-full__quote {
  font-size: 1.0625rem;
  font-style: italic;
  color: var(--color-text-headline);
  border-left: 3px solid var(--color-accent);
  padding-left: var(--s5);
  margin: 0 0 var(--s5);
  line-height: 1.6;
}

.caso-full__footer { font-size: 0.875rem; color: var(--color-text-muted); }
.caso-full__area-label { font-weight: 600; margin-right: 4px; }
.caso-full__footer a { color: var(--color-primary); font-weight: 600; }
.caso-full__footer a:hover { text-decoration: underline; }

@media (max-width: 640px) {
  .caso-full__kpi-strip { flex-direction: column; }
}

/* Variante chiara: usata su /casi-reali/ per contenere i 7 .caso-full completi.
   .caso-full (title/body/quote/footer) è progettato per sfondo chiaro — i suoi
   colori (--color-text-headline, --color-text-body, ecc.) su sfondo verde pieno
   risultavano illeggibili (in alcuni casi identici allo sfondo). Stesso modulo
   "bio-section--casi" ma senza il verde pieno, per non toccare l'uso corretto
   su Per chi/Chi sono (dove il contenuto sono .caso-card bianche, non testo nudo). */
.bio-section--casi-full { background: var(--color-bg-section); }