/* ==========================================================================
   Scheda persona e archivio dei formatori

   La scheda persona è copiata dall'originale /chi-siamo/fabio-mariani/. Valori
   esatti da research/assets/uploads__elementor__css__post-1265.css:

     d30aa7c  contenitore boxed, --margin-top/-bottom:50px
     0db6767  --flex-direction:row, --padding:0
     2cd2b67  --width:50%  (colonna del testo)
     0bbca98  --width:50%, --border-radius:20px, --padding:20px,
              background-color:#00BF630D, --flex-grow:0 --flex-shrink:0
     5b21ed9  titolo: Poppins 30px / 1.2em / peso 500 / #242068  (a 767px → 25px)
     9ee9d2a  testo: Montserrat 15px peso 500 #777777, margin-top:-14px
     09d4bb1  immagine: border-radius:20px
     sotto 1024px: 0db6767 --flex-direction:column
   ========================================================================== */

.formatore-riga {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: var(--ph-widget-gap);
  margin-block: var(--ph-section-gap);
}

.formatore-riga__testo {
  /* 50%, e questa è la colonna che cede quando la somma supera il 100%:
     nell'originale il riquadro della foto è --flex-shrink:0. */
  flex: 1 1 50%;
  min-width: 0;
}

.formatore-riga__media {
  flex: 0 0 50%;
  padding: 20px;
  border-radius: var(--ph-radius-lg);
  /* #00BF630D del contenitore 0bbca98. */
  background: rgba(0, 191, 99, 0.05);
}

.formatore-riga__media img,
.formatore__foto {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--ph-radius-lg);
}

.formatore-riga__media figure {
  margin: 0;
}

/* Sì, un h1 a 30px peso 500: è il widget titolo della pagina originale, non un
   titolo di pagina. Non va portato alla scala di --ph-h1. */
.formatore__nome {
  margin: 0;
  font-size: var(--ph-section-title);
  font-weight: 500;
  line-height: 1.2em;
  color: var(--ph-heading-section);
}

/* margin:-14px del widget di testo: il primo paragrafo risale sotto il titolo. */
.formatore__testo {
  margin-top: -14px;
}

/* I titoli interni al racconto ("Il Cambiamento") sono widget titolo identici a
   quello del nome: Poppins 30px / 1.2em / peso 500 / #242068 (b69adba di
   post-1265.css), non i titoli grandi del corpo di pagina. */
.formatore__testo h2 {
  margin-top: 32px;
  font-size: var(--ph-section-title);
  font-weight: 500;
  line-height: 1.2em;
  color: var(--ph-heading-section);
}

@media (max-width: 1024px) {
  .formatore-riga {
    flex-direction: column;
  }

  .formatore-riga__media {
    flex: 1 1 auto;
  }
}

/* --------------------------------------------------------------------------
   Le due sezioni in fondo: appuntamenti e corsi.

   Nell'originale non ci sono — le pagine persona erano solo testo e foto — ma
   sono la ragione per cui queste pagine sono diventate un CPT. Restano
   silenziose: nessun fondo colorato, solo il ritmo verticale del sito.
   -------------------------------------------------------------------------- */

.formatore-eventi,
.formatore-corsi {
  padding-block: var(--ph-section-y) 0;
}

/* --------------------------------------------------------------------------
   Archivio /formatori/ e archivi delle tassonomie.

   L'originale non ha nessuna di queste pagine: qui non c'è niente da copiare, e
   il layout riusa i componenti comuni del tema (card-grid, filter-bar).
   -------------------------------------------------------------------------- */

.card-grid--formatori {
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  padding-block: 40px;
}

.card__media--portrait {
  aspect-ratio: 4 / 5;
  background: var(--ph-primary-pale);
}

.card__prossimo,
.card__luogo,
.card__corso {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 10px;
  font-size: 14px;
  color: var(--ph-text-muted);
}

.card__meta--data {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--ph-accent-ink);
  text-transform: none;
  letter-spacing: 0;
  font-size: 14px;
}

.card__meta-icon {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
}

.filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-block: 32px 8px;
}

.filter-bar__item {
  padding: 8px 18px;
  border: 1px solid var(--ph-border);
  border-radius: 999px;
  font-family: var(--ph-font-heading);
  font-size: 14px;
  font-weight: 500;
  color: var(--ph-text);
}

.filter-bar__item:hover,
.filter-bar__item.is-current {
  background: var(--ph-primary);
  border-color: var(--ph-primary);
  color: var(--ph-white);
}

/* --------------------------------------------------------------------------
   Blocco dei docenti dentro la pagina di un evento
   -------------------------------------------------------------------------- */

.event-formatori {
  margin: 40px 0;
  padding: 28px;
  background: var(--ph-surface);
  border-radius: var(--ph-radius-lg);
}

.event-formatori__title {
  margin: 0 0 20px;
  font-size: var(--ph-h5);
}

.event-formatori__list {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
}

.event-formatori__link {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px;
  background: var(--ph-white);
  border-radius: var(--ph-radius);
  transition: transform var(--ph-transition), box-shadow var(--ph-transition);
}

.event-formatori__link:hover {
  transform: translateY(-2px);
  box-shadow: var(--ph-shadow-card);
}

.event-formatori__avatar {
  flex: 0 0 auto;
}

.event-formatori__img {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
}

.event-formatori__testo {
  display: flex;
  flex-direction: column;
}

.event-formatori__nome {
  font-family: var(--ph-font-heading);
  font-weight: 600;
  color: var(--ph-primary);
}

.event-formatori__ruolo {
  font-size: 13px;
  color: var(--ph-text-muted);
}

@media (prefers-reduced-motion: reduce) {
  .event-formatori__link {
    transition: none;
  }

  .event-formatori__link:hover,
  .event-formatori__link:focus-within {
    transform: none;
  }
}