/* Image Overlay + Board Member block definitions.
   Scoped under .bt-overlay / .bt-member so the site header/footer are untouched. */

/* --- Image Overlay: an image cropped to a shape ------------------------- */
.bt-overlay {
  width: var(--bt-overlay-size, 200px);
  max-width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  margin: 0 auto;
}
.bt-overlay--circle  { border-radius: 50%; }
.bt-overlay--rounded { border-radius: 12px; }
.bt-overlay--square  { border-radius: 0; }
.bt-overlay img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* --- Board Member: photo + name + role + optional email ------------------ */
.bt-member { text-align: center; margin-bottom: 2.5rem; }
.bt-member--large  .bt-overlay { width: 260px; }
.bt-member--medium .bt-overlay { width: 180px; }
.bt-member--small  .bt-overlay { width: 120px; }
.bt-member h3 { font-size: 1.2rem; margin: 1rem 0 0.35rem; }
.bt-member p  { font-size: 0.9rem; margin: 0 0 0.4rem; }
.bt-member a  { text-decoration: underline; }
/* Hide the email line when no address was given. */
.bt-member p:has(> a:empty:only-child) { display: none; }

@media (max-width: 719px) {
  .bt-member--large .bt-overlay { width: 200px; }
}