/* Shared portrait framing keeps the council consistent across both pages. */
#main .council-portrait {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: auto !important;
  aspect-ratio: 4 / 5;
  background: #f0f4fa;
  border: 0;
  border-radius: 8px;
}
#main .council-portrait img {
  position: absolute;
  display: block;
  width: var(--portrait-width);
  max-width: none;
  height: auto;
  left: var(--portrait-left);
  top: var(--portrait-top);
  aspect-ratio: auto;
  object-fit: initial;
  border: 0;
  border-radius: 0;
  mix-blend-mode: multiply;
}
.council-portrait[data-person="ben"] {
  --portrait-width: 294.12%;
  --portrait-left: -101.47%;
  --portrait-top: -3.53%;
}
.council-portrait[data-person="branden"] {
  --portrait-width: 153.85%;
  --portrait-left: -26.92%;
  --portrait-top: -3.08%;
}
.council-portrait[data-person="kayden"] {
  --portrait-width: 128.57%;
  --portrait-left: -14.29%;
  --portrait-top: -24.57%;
}
.council-portrait[data-person="duru"] {
  --portrait-width: 114.57%;
  --portrait-left: -15.71%;
  --portrait-top: -25.14%;
}
.home-council-portraits {
  gap: 16px;
  align-items: start;
}
.home-council-person { margin: 0; min-width: 0; }
.home-council-person figcaption {
  margin-top: 12px;
  color: var(--blc-navy, #162d4b);
  font: 600 13px/1.45 var(--plex);
}
.home-council > a {
  display: inline-flex;
  justify-content: flex-start;
  gap: 12px;
  margin-top: 12px;
  padding: 12px 0;
}
.home-council > a span { transition: transform 180ms ease; }
.home-council > a:hover span { transform: translateX(4px); }
#main .blc-person-photo.council-portrait { border-radius: 0; }
@media (max-width: 480px) {
  .home-council-portraits { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 16px; }
  .home-council-person figcaption { font-size: 14px; margin-top: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .home-council > a span { transition: none; }
}