/* Small additions on top of the theme's style.css.
   Nothing here changes the colours or fonts of the existing design. */

/* ---- Case cards (Testimonies / Impending Cases) ----
   Same card height whatever the shape of the photo. */
.our-cases-area .single-cases .cases-img {
  aspect-ratio: 4 / 3;
  overflow: hidden;
}
.our-cases-area .single-cases .cases-img a,
.our-cases-area .single-cases .cases-img img {
  display: block;
  width: 100%;
  height: 100%;
}
.our-cases-area .single-cases .cases-img img {
  object-fit: cover;
  object-position: center 22%;
}

/* Cards in the same row line up, whatever the length of the text. */
.our-cases-area .single-cases {
  display: flex;
  flex-direction: column;
  height: calc(100% - 40px);
}
.our-cases-area .single-cases .cases-caption { flex: 1; }

/* ---- Person pages ---- */
.person-story p { text-align: left; }
.person-story h4 { margin-bottom: 12px; }
.person-story video,
.person-story img { max-width: 100%; }
.person-story video { width: 100%; height: auto; }

.gallery-item .gallery-thumb {
  display: block;
  width: 100%;
  height: 200px;
  margin-top: 30px;
  object-fit: cover;
  object-position: center 30%;
}
.gallery-item video {
  width: 100%;
  height: auto;
  margin-top: 30px;
}

.person-cta { text-align: center; }
.person-cta p { margin-bottom: 18px; }
.person-cta .genric-btn { margin: 0 6px 8px; }

/* Visible keyboard focus */
.cases-caption a:focus-visible,
.gallery-item a:focus-visible,
.person-cta a:focus-visible {
  outline: 3px solid #09cc7f;
  outline-offset: 3px;
}
