/* ============================================================
   08 — prelegenci
   Lista jest dziś pusta i taka bywa do jesieni — sekcja musi wyglądać
   celowo także wtedy, gdy zawiera samą notę.
   ============================================================ */

.ai-prelegenci__lista {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  margin-top: var(--ai-s6);
}

.ai-prelegenci__osoba {
  position: relative;
  padding: var(--ai-s4);
  background: var(--ai-card);
  border: 1px solid var(--ai-line);
  border-radius: var(--ai-r-lg);
}

.ai-prelegenci__zdjecie {
  display: block;
  width: 96px;
  height: 96px;
  margin-bottom: var(--ai-s3);
  object-fit: cover;
  border-radius: 50%;
}

.ai-prelegenci__zdjecie--brak {
  display: grid;
  place-items: center;
  font-family: var(--ai-font-display, inherit);
  font-size: 1.5rem;
  line-height: 1;
  color: var(--ai-rose);
  background: var(--ai-tint);
  border: 1px dashed var(--ai-line);
}

.ai-prelegenci__osoba h3 { margin: 0 0 4px; }

.ai-prelegenci__firma {
  margin: 0 0 var(--ai-s2);
  font-family: var(--ai-font-body);
  font-size: var(--ai-size-label);
  font-weight: 600;
  letter-spacing: var(--ai-ls-label);
  text-transform: uppercase;
  color: var(--ai-rose);
}

.ai-prelegenci__bio p {
  margin: 0;
  font-size: var(--ai-size-small);
}

/* Nota „lista w budowie" — ramka przerywana mówi: to miejsce czeka na treść */
.ai-prelegenci__nota {
  margin: var(--ai-s5) 0 0;
  padding: 20px 24px;
  max-width: var(--ai-miara);
  border: 1px dashed var(--ai-magenta);
  border-radius: var(--ai-r-lg);
  font-size: var(--ai-size-body);
  line-height: 1.65;
  color: var(--ai-heading);
}

@media (max-width: 900px) {
  .ai-prelegenci__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .ai-prelegenci__lista { grid-template-columns: 1fr; }
}

/* Odnośnik do profilu — ikona w stałym rogu kafla. W tekście rozjeżdżałby wiersze,
   bo nazwiska mają różną długość; tutaj każdy kafel wygląda tak samo.
   38 px to minimum, przy którym cel dotykowy nie wymaga celowania. */
.ai-prelegenci__linkedin {
  position: absolute;
  top: var(--ai-s4);
  right: var(--ai-s4);
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid var(--ai-line);
  border-radius: 50%;
  color: var(--ai-rose);
  background: var(--ai-card);
  transition: color .15s ease, background-color .15s ease, border-color .15s ease;
}

.ai-prelegenci__linkedin svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

.ai-prelegenci__linkedin:hover,
.ai-prelegenci__linkedin:focus-visible {
  color: var(--ai-on-accent);
  background: var(--ai-rose);
  border-color: var(--ai-rose);
}

/* Ruch tylko dla tych, którzy go chcą. */
@media (prefers-reduced-motion: reduce) {
  .ai-prelegenci__linkedin { transition: none; }
}

/* --- wolne miejsce „wkrótce" ---------------------------------
   Ramka przerywana i wyszarzona treść — ten sam język, którym nota
   pod listą mówi „to miejsce czeka na treść". Kafel nie udaje osoby. */

.ai-prelegenci__osoba--tba {
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: transparent;
  border-style: dashed;
  border-color: var(--ai-magenta);
}

.ai-prelegenci__tba-znak {
  width: 96px;
  height: 96px;
  margin: 0 0 var(--ai-s3);
  display: grid;
  place-items: center;
  border: 1px dashed var(--ai-magenta);
  border-radius: 50%;
  font-family: var(--ai-font-display, inherit);
  font-size: 2rem;
  line-height: 1;
  color: var(--ai-rose);
}

.ai-prelegenci__tba-tekst {
  margin: 0;
  font-size: var(--ai-size-small);
  color: var(--ai-heading);
}
