@layer components {
  .team-page__article { position: relative; isolation: isolate; }
  .team-list { width: min(var(--content), 100%); margin-top: var(--page-title-content-gap); margin-inline: auto; }
  .team-page__editorial { margin-top: var(--space-l); }
  .team-member { display: grid; position: relative; isolation: isolate; grid-template-columns: 15.6875rem minmax(0, 1fr); gap: var(--space-m); align-items: start; }
  .team-member + .team-member { margin-top: var(--space-l); }
  .team-member--featured + .team-member { margin-top: calc(var(--space-l) + var(--space-m)); }
  .team-member:nth-child(n + 2)::before,
  .team-member:nth-child(3)::after { content: ""; position: absolute; z-index: -1; display: block; aspect-ratio: 1; background: center / contain no-repeat; pointer-events: none; }
  .team-member:nth-child(2)::before { top: 8.125rem; left: 0; width: 17.5625rem; background-image: url("../images/tache-rose.webp"); }
  .team-member:nth-child(3)::before { top: -17.0625rem; left: 56.4375rem; width: 27.4375rem; background-image: url("../images/tache-jaune.webp"); }
  .team-member:nth-child(3)::after { top: -4.25rem; left: 60.75rem; width: 20.5625rem; background-image: url("../images/tache-rose.webp"); }
  .team-member:nth-child(4)::before { top: -5.1875rem; left: -2.875rem; width: 16.0625rem; background-image: url("../images/tache-jaune.webp"); }
  .team-member:nth-child(5)::before { top: 5.375rem; left: -5.3125rem; width: 19rem; background-image: url("../images/tache-verte.webp"); }
  .team-member__decoration { position: absolute; z-index: -1; display: block; aspect-ratio: 1; background: center / contain no-repeat; pointer-events: none; }
  .team-member__decoration--blue { top: 2.75rem; left: -5.3125rem; width: 18.1875rem; background-image: url("../images/tache-bleue-equipe.png"); transform: rotate(90deg); }
  .team-member__decoration--orange { top: -16.5625rem; left: 63.5625rem; width: 20.8125rem; background-image: url("../images/tache-orange-2.webp"); }
  .team-member__portrait { width: 100%; aspect-ratio: 251 / 324; margin: 0; overflow: hidden; background: var(--color-light-gray); }
  .team-member__portrait img { width: 100%; height: 100%; object-fit: cover; }
  .team-member__content { min-width: 0; }
  .team-member__name { display: inline-block; margin: 0; padding: var(--space-xs) var(--space-s); background: var(--color-yellow); font-family: var(--font-body); font-size: var(--text-menu); font-weight: 400; line-height: var(--line-height-card); }
  .team-member--featured { position: relative; }
  .team-member--featured::before { content: ""; position: absolute; z-index: -1; inset: calc(-1 * var(--space-m)); background: url("../images/cv-avant.jpg") center / cover no-repeat; }
  .team-member--featured .team-member__name { background: var(--color-white); }
  .team-member__role { margin: var(--space-xs) 0 0; font-size: var(--text-meta); font-style: italic; line-height: var(--line-height-card); }
  .team-member__description { margin-top: var(--space-xs); }
  .team-member__description > :first-child { margin-top: 0; }
  .team-member__description > :last-child { margin-bottom: 0; }
  .team-member__links { display: flex; flex-wrap: wrap; gap: var(--space-xs) var(--space-s); margin: var(--space-xs) 0 0; padding: 0; list-style: none; }
  .team-member__links a { font-style: italic; }
  .team-member--featured .team-member__links a { display: inline-flex; min-height: 2.625rem; align-items: center; padding: var(--space-xs) var(--space-m); border-radius: var(--radius-pill); color: var(--color-white); background: var(--color-black); text-decoration: none; }
  .team-page__editorial h2.wp-block-heading { margin-inline: auto; }
}

@media (max-width: 48rem) {
  .team-member:nth-child(n + 2)::before,
  .team-member:nth-child(3)::after,
  .team-member__decoration { display: none; }
  .team-list { margin-top: var(--space-l); }
  .team-member { grid-template-columns: 1fr; gap: var(--space-s); }
  .team-member__portrait { width: min(15.6875rem, 70vw); }
  .team-member + .team-member { margin-top: var(--space-l); }
}