.board-page {
  --board-navy:#172e5c;
  --board-blue:#325d9c;
  font-family:IRanSansX,Tahoma,sans-serif;
  background:#f7f9fc;
  color:#526077;
  padding-bottom:84px
}
.board-page h1,.board-page h2,.board-page h3 {
  font-family:inherit;
  color:var(--board-navy)
}
.board-hero {
  padding:42px 0 48px;
  background:linear-gradient(115deg,#eaf0f9,#fff 75%);
  border-bottom:1px solid #e3e9f1
}
.board-crumb {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  font-size:13px;
  margin-bottom:30px
}
.board-crumb a {
  color:#64718a
}
.board-crumb span:last-child {
  color:var(--board-navy)
}
.board-eyebrow {
  display:inline-flex;
  align-items:center;
  gap:9px;
  font-size:13px;
  font-weight:bold;
  color:var(--board-blue);
  margin-bottom:14px
}
.board-eyebrow:before {
  content:"";
  width:24px;
  height:2px;
  background:currentColor
}
.board-hero h1 {
  font-size:clamp(30px,4vw,44px);
  font-weight:800;
  margin-bottom:16px
}
.board-hero p {
  max-width:660px;
  line-height:2;
  margin:0;
  font-size:15px
}
.board-content {
  padding-top:48px
}
.board-chair {
  display:grid;
  grid-template-columns:300px 1fr;
  max-width:960px;
  margin:0 auto;
  background:#fff;
  border:1px solid #e1e7f0;
  border-radius:24px;
  overflow:hidden;
  box-shadow:0 14px 45px #172e5c0b
}
.board-photo {
  position:relative;
  aspect-ratio:4/5;
  background:linear-gradient(145deg,#e7edf6,#f4f7fb);
  display:grid;
  place-items:center;
  overflow:hidden
}
.board-photo img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center top;
  z-index:1
}
.board-placeholder {
  text-align:center;
  color:#8a9ab3
}
.board-placeholder svg {
  display:block;
  width:104px;
  height:104px;
  margin:auto auto 16px
}
.board-placeholder span {
  font-size:12px
}
.board-chair-copy {
  padding:42px;
  align-self:center
}
.board-badge {
  display:inline-flex;
  align-items:center;
  gap:8px;
  border-radius:100px;
  padding:8px 16px;
  background:#edf2fa;
  color:var(--board-navy);
  font-size:13px;
  margin-bottom:20px
}
.board-name {
  font-size:25px;
  font-weight:800;
  margin-bottom:12px;
  line-height:1.7
}
.board-role {
  color:var(--board-blue);
  font-size:15px;
  margin-bottom:24px;
  font-weight:bold
}
.board-education {
  border-top:1px solid #e8edf4;
  padding-top:20px;
  display:flex;
  align-items:flex-start;
  gap:12px
}
.board-education i {
  color:var(--board-blue);
  margin-top:6px
}
.board-education dt {
  font-size:12px;
  color:#8692a5;
  font-weight:normal;
  margin-bottom:7px
}
.board-education dd {
  margin:0;
  font-size:14px;
  line-height:1.9;
  color:#43536b
}
.board-divider {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  margin:50px 0 30px
}
.board-divider:before,.board-divider:after {
  content:"";
  width:70px;
  height:1px;
  background:#d7e0ec
}
.board-divider h2 {
  font-size:20px;
  font-weight:bold;
  margin:0
}
.board-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:26px;
  max-width:1080px;
  margin:auto
}
.board-member {
  background:#fff;
  border:1px solid #e1e7f0;
  border-radius:20px;
  overflow:hidden;
  transition:transform .25s,box-shadow .25s
}
.board-member:hover {
  transform:translateY(-5px);
  box-shadow:0 16px 35px #172e5c12
}
.board-member .board-photo {
  aspect-ratio:5/4
}
.board-member-copy {
  padding:24px
}
.board-member .board-name {
  font-size:20px
}
.board-member .board-role {
  font-size:13px;
  margin-bottom:20px
}
.board-member dl {
  margin-bottom:0
}
.artamehr-submenu a[aria-current="page"] {
  background:#edf2fa;
  color:#172e5c;
  font-weight:bold
}
@media(max-width:991px) {
  .board-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .board-chair {
    grid-template-columns:260px 1fr
  }
  .board-chair-copy {
    padding:30px
  }
}
@media(max-width:575px) {
  .board-hero {
    padding:28px 0 34px
  }
  .board-content {
    padding-top:28px
  }
  .board-chair {
    grid-template-columns:1fr
  }
  .board-chair .board-photo {
    aspect-ratio:5/4
  }
  .board-chair-copy {
    padding:26px
  }
  .board-grid {
    grid-template-columns:1fr;
    gap:20px
  }
  .board-divider {
    margin:34px 0 24px
  }
  .board-name {
    font-size:23px
  }
  .board-page {
    padding-bottom:48px
  }
}
@media(prefers-reduced-motion:reduce) {
  .board-member {
    transition:none
  }
  .board-member:hover {
    transform:none
  }
}
.board-hero  {
  background: #f5f7fb url("../../img/board-bg.png?v=22")
    center center / cover no-repeat;
}
/* Soft full-width image blend without a hard image edge. */
.board-hero {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:#f1f6fc !important;
}
.board-hero::before {
  content:"";
  position:absolute;
  display:block;
  inset:0;
  top:0;
  left:0;
  width:100%;
  height:100%;
  border:0 !important;
  border-radius:0 !important;
  background:url("../../img/board-bg.png?v=22") left center / auto 100% no-repeat !important;
  -webkit-mask-image:linear-gradient(to right,#000 0%,#000 22%,rgba(0,0,0,.8) 35%,rgba(0,0,0,.3) 49%,transparent 65%) !important;
  mask-image:linear-gradient(to right,#000 0%,#000 22%,rgba(0,0,0,.8) 35%,rgba(0,0,0,.3) 49%,transparent 65%) !important;
  opacity:1 !important;
  z-index:-1;
  pointer-events:none;
}
.board-hero .container {
  position:relative;
  z-index:1;
}
@media(max-width:991px) {
  .board-hero::before {
    opacity:.7 !important;
  }
}
@media(max-width:767px) {
  .board-hero::before {
    background-size:auto 100% !important;
    opacity:.18 !important;
    -webkit-mask-image:linear-gradient(to right,#000,transparent 95%) !important;
    mask-image:linear-gradient(to right,#000,transparent 95%) !important;
  }
}
