/**
 * Team V2 — Figma node 2414:321
 * Management team grid with excerpt cards and read-more links on a light section surface.
 */

.team-v2 {
  position: relative;
  z-index: 1;
  background-color: var(--color-bg-section);
  padding-block: var(--space-2xl);
  padding-inline: var(--space-md);
  overflow-x: clip;
  overflow-y: visible;
}

/* Peach blob — left-edge decorative accent (2414:418) */
.team-v2__deco {
  display: none;
  position: absolute;
  pointer-events: none;
  z-index: 0;
  inline-size: 254px;
  block-size: 204px;
  inset-inline-start: -155px;
  inset-block-start: -43.53px;
}

.team-v2__deco-image {
  display: block;
  inline-size: 100%;
  block-size: 100%;
  max-inline-size: none;
  object-fit: contain;
}

.team-v2__inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3.625rem; /* 58px — title to grid (2414:342) */
  max-width: 80rem; /* 1280px */
  margin-inline: auto;
}

/* ── Section header (2414:343) ─────────────────────────────── */
.team-v2__header {
  inline-size: 100%;
  text-align: center;
}

.team-v2__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--fs-h2);
  font-weight: var(--fw-bold);
  line-height: var(--lh-h2);
  color: var(--color-text);
}

/* ── Member cards grid (2414:344, 2414:381) ─────────────────── */
.team-v2__grid {
  display: grid;
  grid-template-columns: 1fr;
  /* Keep cards at content height so an expanded bio doesn't stretch neighbors */
  align-items: start;
  gap: var(--space-xl);
  inline-size: 100%;
}

.team-v2__card {
  display: flex;
  flex-direction: column;
  background-color: var(--color-surface-teal);
  border-radius: 1.5rem; /* 24px — Figma card radius (2414:345) */
  padding: var(--space-xl);
}

.team-v2__card-content {
  display: flex;
  flex-direction: column;
  gap: var(--space-md); /* 16px — Figma stack gap (2414:347) */
  inline-size: 100%;
}

.team-v2__photo {
  flex-shrink: 0;
  inline-size: 10.375rem; /* 166px */
  block-size: 10.375rem;
  border-radius: 50%;
  object-fit: cover;
}

.team-v2__identity {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm); /* 8px — name to role (2414:349) */
}

.team-v2__name {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--fs-h3);
  font-weight: var(--fw-bold);
  line-height: var(--lh-h3);
  color: var(--color-text-on-dark);
}

.team-v2__role {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--fs-caption);
  font-weight: var(--fw-semibold);
  line-height: 1.5;
  color: var(--color-text-on-dark);
}

.team-v2__excerpt {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: var(--fw-regular);
  line-height: var(--lh-body);
  color: var(--color-text-on-dark);
}

/*
 * Bio panels — instant swap between excerpt and full bio (no animation).
 * Markup keeps both panels; JS toggles .team-v2__card--expanded on the card.
 */
.team-v2__bio-panel--full {
  display: none;
}

.team-v2__card--expanded .team-v2__bio-panel--excerpt {
  display: none;
}

.team-v2__card--expanded .team-v2__bio-panel--full {
  display: block;
}

/* Full bio stack — same type as excerpt; paragraphs keep readable gaps */
.team-v2__bio-full {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}

.team-v2__bio-full p {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: var(--fw-regular);
  line-height: var(--lh-body);
  color: var(--color-text-on-dark);
}

/* Read-more toggle with chevron (2414:353) — button, not a link */
.team-v2__read-more {
  display: inline-flex;
  align-items: center;
  gap: 0;
  align-self: flex-start;
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
  color: var(--color-text-on-dark);
  cursor: pointer;
  text-decoration: none;
  transition: opacity var(--transition-base);
}

.team-v2__read-more:hover,
.team-v2__read-more:focus-visible {
  opacity: 0.85;
}

.team-v2__read-more:focus-visible {
  outline: 2px solid var(--color-text-on-dark);
  outline-offset: 2px;
}

.team-v2__read-more-label {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: var(--fw-regular);
  line-height: var(--lh-body);
  text-decoration: underline;
  text-underline-position: from-font;
}

.team-v2__read-more-icon {
  display: inline-flex;
  flex-shrink: 0;
  inline-size: 1.25rem; /* 20px */
  block-size: 1.25rem;
}

.team-v2__card--expanded .team-v2__read-more-icon {
  transform: rotate(180deg);
}

.team-v2__read-more-icon img {
  display: block;
  inline-size: 100%;
  block-size: 100%;
}

/* ── Tablet (768px+) — two columns ─────────────────────────── */
@media (min-width: 768px) {
  .team-v2__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ── Desktop (1024px+) ────────────────────────────────────── */
@media (min-width: 1024px) {
  .team-v2 {
    padding-block: 5.5rem 10rem; /* 88px top, 160px bottom — Figma (2414:321) */
    padding-inline: 5rem; /* 80px */
  }

  .team-v2__deco {
    display: block;
  }

  .team-v2__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 4.25rem; /* 68px — row and column gap (2414:344) */
  }

  .team-v2__card {
    padding: 2.5rem; /* 40px — Figma card padding */
  }
}

/* Before testimonials-v1 — extra bottom room for owl overlap (2414:321 → 2128:391) */
@media (max-width: 767px) {
  .team-v2--before-testimonials {
    padding-block-end: 8rem; /* 128px — Figma gap above owl transition */
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .team-v2--before-testimonials {
    padding-block-end: 10rem; /* 160px — matches desktop owl clearance */
  }
}