.board-hero, .profile-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: radial-gradient(ellipse at 94% 115%,#b9ded0,transparent 62%),#f0e7f3;
  color: #2e2548;
}
.board-hero::before, .profile-hero::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -230px;
  right: -80px;
  width: 620px;
  height: 480px;
  border: 1px solid #7b6e9b5c;
  border-radius: 47% 53% 61% 39%;
  box-shadow: 0 0 0 22px #75578d0c, 0 0 0 49px #75578d08, 0 0 0 82px #75578d05;
  transform: rotate(-17deg);
  pointer-events: none;
}
.board-hero-layout {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,.91fr);
  gap: clamp(25px,5vw,72px);
  align-items: center;
  padding-block: clamp(34px,6vw,80px);
}
.board-hero-single { grid-template-columns: minmax(0,720px); }
.board-hero-copy, .profile-heading, .profile-information { min-width: 0; }
.board-hero .crumbs, .profile-hero .crumbs { color: #5d506c; margin-bottom: 16px; }
.board-hero .kicker, .profile-hero .kicker { color: #59457c; margin-bottom: 12px; }
.board-hero h1, .profile-hero h1 {
  font-size: clamp(2.75rem,5.2vw,4.7rem);
  line-height: 1.02;
  letter-spacing: -.065em;
  overflow-wrap: anywhere;
  text-wrap: balance;
}
.board-hero h1 { max-width: 15ch; }
.board-intro { max-width: 52ch; margin-top: 16px; color: #50455f; font-size: clamp(1rem,1.5vw,1.16rem); }
.board-action { margin-top: 23px; }
.portrait-stage { background: #e3eee9; }
.portrait-stage img { width: 100%; height: 100%; object-fit: cover; object-position: center 24%; }
.portrait-initials { display: grid; place-items: center; width: 100%; height: 100%; font-size: clamp(2rem,7vw,6rem); font-weight: 800; color: #3d6759; }
.board-mosaic { display: flex; justify-content: center; align-items: center; isolation: isolate; padding: 9px 12px 17px; }
.board-mosaic-frame {
  width: 39%;
  aspect-ratio: 4/5;
  flex: 0 0 auto;
  overflow: hidden;
  border: 5px solid #fffaf4;
  border-radius: 18px;
  box-shadow: 0 17px 37px #352e522b;
  transform: rotate(-8deg) translateY(12px);
}
.board-mosaic-frame:nth-child(2) {
  z-index: 1;
  order: -1;
  margin-right: -7%;
  transform: rotate(-13deg) translateY(10px) scale(.88);
  border-color: #d8cdf0;
}
.board-mosaic-frame:first-child { z-index: 3; transform: rotate(-2deg) translateY(-8px); }
.board-mosaic-frame:nth-child(3) {
  z-index: 2;
  margin-left: -7%;
  transform: rotate(10deg) translateY(13px) scale(.9);
  border-color: #f9decf;
}
.board-directory { padding-block: clamp(26px,4.8vw,60px) clamp(42px,6.2vw,84px); scroll-margin-top: 96px; }
.board-jump { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: clamp(32px,4vw,54px); }
.board-jump a {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 8px 12px;
  border: 1px solid #e1d6ec;
  border-radius: 28px;
  background: #fffaf4;
  color: #4c3a66;
  font-size: .83rem;
  font-weight: 800;
  text-decoration: none;
}
.board-jump a:hover { background: #efe6f7; }
.board-jump svg { width: 13px; height: 13px; }
.board-group { --group-tint: #efe5f5; --group-ink: #5a3e79; --columns: 3; scroll-margin-top: 105px; }
.board-group + .board-group { margin-top: clamp(35px,5.8vw,78px); }
.board-group-bureau { --columns: 5; }
.board-group-conseil { --group-tint: #dceee5; --group-ink: #275749; }
.board-group-coordination { --group-tint: #fce6d7; --group-ink: #794537; --columns: 2; }
.board-group-reseau { --columns: 1; }
.board-group-heading { display: flex; align-items: center; gap: 13px; margin-bottom: 16px; }
.board-group-heading h2 { color: #332747; font-size: clamp(1.65rem,3.2vw,2.75rem); }
.board-group-heading p { margin-top: 5px; color: #574f61; font-size: .93rem; }
.board-group-icon {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 43px;
  height: 43px;
  border-radius: 12px;
  background: var(--group-tint,#e9dff1);
  color: var(--group-ink,#503875);
}
.board-group-icon svg { width: 21px; height: 21px; }
.board-people {
  display: grid;
  grid-template-columns: repeat(var(--columns),minmax(0,1fr));
  gap: clamp(8px,1.45vw,17px);
  padding: 0;
  margin: 0;
  list-style: none;
}
.board-group-coordination .board-people { max-width: 770px; }
.board-group-reseau .board-people { max-width: 290px; }
.board-people > li { min-width: 0; }
.board-person {
  display: flex;
  flex-direction: column;
  height: 100%;
  border: 1px solid #e6dce9;
  border-radius: 16px;
  background: #fffdf9;
  color: #312747;
  text-decoration: none;
  box-shadow: 0 8px 18px #251c3f0a;
  overflow: hidden;
}
.board-person:hover { color: #312747; border-color: #c6b3d9; }
.board-person-photo { aspect-ratio: 4/3; overflow: hidden; }
.board-person-photo img { object-position: center top; }
.board-person-copy { position: relative; flex: 1; padding: 14px 38px 15px 13px; }
.board-role {
  margin: 0 0 5px;
  color: var(--group-ink);
  font-size: .68rem;
  line-height: 1.33;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .055em;
}
.board-person h3 { margin: 0; font-size: clamp(1.01rem,1.65vw,1.36rem); overflow-wrap: anywhere; letter-spacing: -.042em; }
.board-profession { margin: 5px 0 0; color: #62586b; font-size: .83rem; line-height: 1.4; }
.board-person-link {
  position: absolute;
  right: 10px;
  top: 13px;
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 8px;
  background: var(--group-tint);
  color: var(--group-ink);
}
.board-person-link svg { width: 13px; height: 13px; }
.board-note { border-top: 1px solid #e5dae6; background: #f0e9f3; }
.board-note-layout { display: flex; gap: 15px; padding-block: clamp(25px,4.8vw,61px); }
.board-note h2 { color: #352749; font-size: clamp(1.5rem,2.9vw,2.35rem); }
.board-note .prose { max-width: 68ch; color: #564a61; }
.profile-layout {
  display: grid;
  grid-template: "heading portrait" auto "information portrait" auto / minmax(0,1fr) minmax(0,.78fr);
  gap: 16px clamp(27px,6.5vw,90px);
  padding-block: clamp(29px,5.4vw,75px) clamp(44px,6vw,88px);
}
.profile-heading { grid-area: heading; align-self: end; }
.profile-information { grid-area: information; align-self: start; }
.profile-portrait {
  grid-area: portrait;
  align-self: center;
  aspect-ratio: 1;
  border: 4px solid #fff9f2;
  border-radius: 23px;
  box-shadow: 9px 10px #cdbddd, 0 19px 43px #332a5122;
  overflow: hidden;
}
.profile-role {
  display: inline-flex;
  margin-top: 12px;
  padding: 5px 10px;
  border-radius: 7px;
  background: #e0d2ed;
  color: #4f3568;
  font-size: .84rem;
  font-weight: 800;
}
.profile-responsibilities { margin: 8px 0 0; padding-left: 18px; color: #564967; font-size: .94rem; font-weight: 650; }
.profile-facts {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 6px;
  margin: 0;
  padding: 7px;
  background: #fffaf5;
  border: 1px solid #e3d8e5;
  border-radius: 15px;
}
.profile-facts > div { padding: 9px 11px; border-radius: 9px; background: #f2ebf4; }
.profile-facts > div:only-child { grid-column: 1/-1; }
.profile-facts dt { font-size: .68rem; color: #604b78; font-weight: 800; }
.profile-facts dd { margin: 2px 0 0; font-size: .95rem; font-weight: 750; line-height: 1.39; }
.profile-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin-top: 17px; }
.profile-reading { padding-block: 33px 55px; }
.profile-reading article { max-width: 73ch; }
@media (prefers-reduced-motion: no-preference) {
  .board-hero-copy, .profile-heading { animation: splash-in .48s cubic-bezier(.17,.72,.3,1) both; }
  .board-mosaic, .profile-portrait { animation: splash-in .65s .05s cubic-bezier(.17,.72,.3,1) both; }
  .board-person, .board-person-photo img { transition: transform .28s ease, border-color .2s ease; }
  .board-person:hover .board-person-photo img { transform: scale(1.035); }
}
@media (max-width: 1019px) {
  .board-group-bureau { --columns: 3; }
}
@media (max-width: 739px) {
  .board-hero-layout { grid-template-columns: 1fr; gap: 24px; }
  .board-hero h1, .profile-hero h1 { font-size: clamp(2.35rem,8.5vw,3.65rem); text-wrap: initial; }
  .board-mosaic { width: min(90%,465px); justify-self: center; }
  .profile-layout { grid-template: "heading" auto "portrait" auto "information" auto / minmax(0,1fr); gap: 22px; }
  .profile-portrait { width: min(100%,460px); }
}
@media (max-width: 599px) {
  .board-group:not(.board-group-reseau) { --columns: 2; }
  .board-mosaic-frame { border-width: 3px; border-radius: 12px; }
  .board-person-copy { padding: 9px 8px 12px; }
  .board-person-link { display: none; }
  .board-role { font-size: .61rem; }
  .board-profession { font-size: .77rem; }
  .board-group-heading { gap: 9px; }
  .board-group-icon { width: 35px; height: 35px; border-radius: 9px; }
  .board-group-icon svg { width: 17px; height: 17px; }
  .board-group-heading p { font-size: .83rem; }
  .board-group-reseau .board-people { max-width: 190px; }
}
@media (max-width: 350px) {
  .profile-facts { grid-template-columns: 1fr; }
}