/**
 * #.# People Header Module
 *
 * Styles for template-part/modules/people_header_module.php
**/

.people_header_module,
.people_header_module .container,
.people_header_module .container .row,
.people_header_module .container .row .col-lg-12{min-height: calc(100svh - 190px);}
.people_header_module{margin:0 25px}
.banner-role{padding:96px 0 20px 10px;font-size:18px;line-height:27px;color:var(--black)}
.banner-name-vert{color:var(--purple);position:absolute;top:150px;left:30px;transform:rotate(-90deg) translate(-100%,0);transform-origin:top left;font-family:var(--header);font-size:104px;font-style:normal;font-weight:400;line-height:100px;letter-spacing:.96px;text-transform:uppercase;text-align:right}
.people_header_module{position:relative;overflow:hidden;margin-top:-5px}
.people_header_media{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:1}
.people_header_media video,.people_header_media img{width:900px;height:810px;object-fit:cover;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0.9);opacity:0;transition:opacity .8s ease,transform .8s ease,width 1.8s ease,height 1.8s ease; }
.people_header_module.media-visible .people_header_media video,.people_header_module.media-visible .people_header_media img{opacity:1;transform:translate(-50%,-50%) scale(1)}
.people_header_module.media-expanded .people_header_media video,.people_header_module.media-expanded .people_header_media img{width:100%;height:100%}
.people_header_module .container{position:relative;z-index:2}
.banner-role{color:var(--black);transition:colour 2s ease}
.banner-name-vert{color:var(--purple);transition:colour 2s ease}

.people_qualifications {
  font-size: 18px;
  line-height: 27px;
  font-family: var(--content);
  top: -70px;
  position: relative;
}


/* Text colour changes when media is expanding/full */
@keyframes fadeToWhiteHeader {
  0% {
    color: var(--purple);
  }
  100% {
    color: var(--white);
  }
}
@keyframes fadeToWhiteRole {
  0% {
    color: var(--black);
  }
  100% {
    color: var(--white);
  }
}

.people_header_module.media-expanded .banner-role {animation: fadeToWhiteRole 1s ease 0.1s forwards;}
.people_header_module.media-expanded .banner-name-vert {animation: fadeToWhiteHeader 1s ease 0.1s forwards;}

@media (min-width: 1500px) {
  /* Fallback image only: anchor to top rather than centre on large screens */
  .people_header_module .people_header_media img {
    top: 0;
    transform: translate(-50%, 0) scale(0.9);
    object-position: top center;
  }
  .people_header_module.media-visible .people_header_media img {
    transform: translate(-50%, 0) scale(1);
  }
  .people_header_module.media-expanded .people_header_media img {
    transform: translate(-50%, 0);
  }
}

@media (max-width: 1536px) {

}

@media (max-width: 1366px) {

}

@media (max-width: 1280px) {

}

@media (max-width: 992px) {
  .banner-name-vert {top: 49px;left: 20px;font-size: 34px !important;line-height: 30px !important;}
  .banner-role {  padding: 8px 0px 15px 0px; font-size: 16px;}
  .people-video {margin-left: 13px;height:500px}
  .people-video video {object-fit: cover; width: 100%; height: 100%;}
  .people-video img {object-fit: cover;width: 100%;height: 100%;}
}
@media (max-width: 768px) {
  .people-video {margin-left: 13px;height:300px; }
  .people-video picture { height: 300px;}
}

@media (max-width: 600px) {

}

/* Short viewport height — shrink vertical name to fit (e.g. landscape phones, short windows) */
@media (max-height: 950px) {
  .banner-name-vert {
    font-size: clamp(40px, 8svh, 104px);
    line-height: clamp(36px, 7.5svh, 100px);
  }
  .banner-role {padding: 36px 0 20px 10px;}
  .banner-name-vert {top: 90px;}
}