/* ============================================================
   RIET QUADEN MAKELAARS — team (nieuw in V2)

   Klein kantoor: twee gelijke kaarten, foto links, gegevens rechts. Zolang
   er nog geen foto's zijn staat er een nette lege plek met een silhouet, en
   niet een grijs gat.
   ============================================================ */

.team__kop {
  max-width: 44ch;
  margin-bottom: clamp(2.5rem, 1.5rem + 3vw, 4rem);
}

.team__eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: var(--fs-klein);
  font-weight: var(--gew-label);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--steungrijs);
  margin-bottom: 14px;
}
.team__stip {
  width: 26px;
  height: 3px;
  background: var(--rood);
}

.team__titel { margin-bottom: 14px; }
.team__intro {
  font-size: var(--fs-body-groot);
  color: var(--steungrijs);
  max-width: 52ch;
}

.team__lijst {
  display: grid;
  gap: clamp(1.25rem, 0.75rem + 2vw, 2.25rem);
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}

.teamlid {
  display: grid;
  grid-template-columns: 148px minmax(0, 1fr);
  gap: 22px;
  align-items: start;
  padding: 22px;
  background: rgba(255, 255, 255, .72);
  border: 1px solid rgba(24, 22, 23, .10);
  border-radius: var(--radius);
  box-shadow: var(--schaduw);
  /* de rode onderstreping uit het logo, als accent op de kaart */
  border-bottom: 3px solid var(--rood);
}

.teamlid__foto {
  aspect-ratio: 3 / 4;
  overflow: hidden;
  border-radius: 8px;
  background: var(--papier-diep);
  border: 1px solid rgba(24, 22, 23, .10);
}
.teamlid__foto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .6s var(--ease-luxe);
}
.teamlid:hover .teamlid__foto img { transform: scale(1.04); }

.teamlid__leeg {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  height: 100%;
  color: rgba(24, 22, 23, .34);
}
.teamlid__leeg svg {
  width: 52px;
  height: 52px;
  stroke: currentColor;
  stroke-width: 3;
  stroke-linecap: round;
  fill: none;
}
.teamlid__leeg-tekst {
  font-size: 0.8125rem;
  font-weight: var(--gew-label);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.teamlid__naam {
  font-size: 1.5rem;
  line-height: 1.15;
}
.teamlid__functie {
  margin-top: 4px;
  font-size: var(--fs-klein);
  font-weight: var(--gew-label);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--rood-diep);
}
.teamlid__tekst {
  margin-top: 12px;
  color: var(--steungrijs);
}
.teamlid__contact {
  margin-top: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.teamlid__link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-weight: var(--gew-body-vet);
  border-bottom: 1px solid transparent;
  transition: border-color .2s ease, color .2s ease;
  align-self: flex-start;
}
.teamlid__link:hover { border-bottom-color: var(--rood); color: var(--rood-diep); }
.teamlid__link:focus-visible { outline: 2px solid var(--rood); outline-offset: 3px; }

@media (max-width: 520px) {
  .teamlid { grid-template-columns: 1fr; }
  .teamlid__foto { aspect-ratio: 4 / 3; max-width: 240px; }
}