/* Header-menu landing pages use the same image stage as AI, Data, Robotics and
   Infrastructure. Content can still grow when translations need more room. */
body.interior-v2.bs-menu-hero :is(.hero-image,.independent-hero.hero-art,.page-hero,.te-hero,.lab-hero) {
  box-sizing:border-box;
  height:auto!important;
  aspect-ratio:auto!important;
  min-height:620px!important;
}
body.interior-v2.bs-menu-hero :is(.hero-image,.independent-hero.hero-art,.page-hero,.te-hero,.lab-hero) :is(.bg,.ch-art) {
  height:100%;
}
/* Keep the highlighted topic legible over each menu page's hero artwork. */
body.interior-v2.bs-menu-hero :is(.hero-image,.independent-hero,.page-hero,.te-hero) h1 :is(.grad-text,.hero-keyword) {
  background:none!important;-webkit-background-clip:initial!important;background-clip:initial!important;
  color:#5bd0ff!important;-webkit-text-fill-color:#5bd0ff!important;
  text-shadow:0 2px 16px rgba(2,15,39,.5);
}
body.interior-v2.bs-menu-hero :is(.hero-image,.independent-hero,.page-hero,.te-hero).hero-art--light h1 :is(.grad-text,.hero-keyword),
body.interior-v2.bs-menu-hero :is(.hero-image,.independent-hero,.page-hero,.te-hero).bs-hero--light h1 :is(.grad-text,.hero-keyword) {
  color:#075b91!important;-webkit-text-fill-color:#075b91!important;text-shadow:none;
}
/* The capability gradient in base.css has higher specificity, so the capability heroes on
   this list pin their keyword to the one capability accent, #3BB0C9, used on all eight
   capability pages (29 Sep; AI, Robotics, Data and Infrastructure in capability-priority.css,
   Digital Engineering in base.css). */
body.interior-v2.bs-menu-hero .hero-image.capability-hero.capability-hero--systems:not(.bs-hero--light) h1 .hero-keyword,
body.interior-v2.bs-menu-hero .hero-image.capability-hero.capability-hero--localisation:not(.bs-hero--light) h1 .hero-keyword,
body.interior-v2.bs-menu-hero .hero-image.capability-hero.capability-hero--managed:not(.bs-hero--light) h1 .hero-keyword {
  background:none!important;
  background-image:none!important;
  -webkit-background-clip:initial!important;
  background-clip:initial!important;
  color:#3BB0C9!important;
  -webkit-text-fill-color:#3BB0C9!important;
  text-shadow:0 2px 16px rgba(2,15,39,.5);
}
/* Keep the primary action consistent with the site's blue capability CTAs.
   These rules change only the buttons, not each page's artwork or accent. */
body.interior-v2.bs-menu-hero:is(.pg-industry-consumer,.pg-industry-energy-sustainability,.pg-industry-agriculture) :is(.independent-hero,.cta-band) .btn-primary {
  background:#005da7!important;
  color:#fff!important;
  box-shadow:0 18px 34px -20px rgba(0,87,184,.65);
}
body.interior-v2.bs-menu-hero:is(.pg-industry-consumer,.pg-industry-energy-sustainability,.pg-industry-agriculture) :is(.independent-hero,.cta-band) .btn-primary:hover,
body.interior-v2.bs-menu-hero:is(.pg-industry-consumer,.pg-industry-energy-sustainability,.pg-industry-agriculture) :is(.independent-hero,.cta-band) .btn-primary:focus-visible {
  background:#004a85!important;
  color:#fff!important;
}
body.interior-v2.bs-menu-hero:is(.pg-industry-consumer,.pg-industry-energy-sustainability,.pg-industry-agriculture) :is(.independent-hero,.cta-band) .btn-primary .arrow {
  color:#c4e4f2!important;
}
/* These industry heroes have their own accents. Keep the shared menu colour
   from replacing the intended title gradients and primary actions. */
body.interior-v2.bs-menu-hero.pg-industry-consumer .independent-hero--consumer h1 .grad-text{
  background:linear-gradient(100deg,#FF9E16,#FFD166) text!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  text-shadow:none!important;
}
body.interior-v2.bs-menu-hero.pg-industry-bfsi .banking-hero h1 .grad-text{
  background:none!important;
  -webkit-background-clip:initial!important;
  background-clip:initial!important;
  color:#3BB0C9!important;
  -webkit-text-fill-color:#3BB0C9!important;
  text-shadow:none!important;
}
body.interior-v2.bs-menu-hero.pg-industry-public-sector .hero-image h1 .grad-text{
  background:none!important;
  -webkit-background-clip:initial!important;
  background-clip:initial!important;
  color:#3BB0C9!important;
  -webkit-text-fill-color:#3BB0C9!important;
  text-shadow:none!important;
}
body.interior-v2.bs-menu-hero.pg-industry-energy-sustainability .energy-hero h1 .grad-text{
  background:linear-gradient(100deg,#B8D94C,#55D8A7) text!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  text-shadow:none!important;
}
body.interior-v2.bs-menu-hero.pg-industry-consumer .independent-hero--consumer .btn-primary,
body.interior-v2.bs-menu-hero.pg-industry-consumer .cta-band .btn-primary{
  background:#FF9E16!important;
  color:#111!important;
  box-shadow:0 18px 34px -20px rgba(255,158,22,.6)!important;
}
body.interior-v2.bs-menu-hero.pg-industry-consumer .independent-hero--consumer .btn-primary:is(:hover,:focus-visible),
body.interior-v2.bs-menu-hero.pg-industry-consumer .cta-band .btn-primary:is(:hover,:focus-visible){
  background:#F4860B!important;
  color:#111!important;
}
body.interior-v2.bs-menu-hero.pg-industry-energy-sustainability .energy-hero .btn-primary,
body.interior-v2.bs-menu-hero.pg-industry-energy-sustainability .cta-band .btn-primary{
  background:#B6BD00!important;
  color:#111!important;
  box-shadow:0 18px 34px -20px rgba(182,189,0,.55)!important;
}
body.interior-v2.bs-menu-hero.pg-industry-energy-sustainability .energy-hero .btn-primary:is(:hover,:focus-visible),
body.interior-v2.bs-menu-hero.pg-industry-energy-sustainability .cta-band .btn-primary:is(:hover,:focus-visible){
  background:#D0D944!important;
  color:#111!important;
}
/* Banking: retain the quiet left half of the new photographic panorama for
   the copy while keeping the financial district visible on the right. */
@media(min-width:721px){
  body.interior-v2.bs-menu-hero.pg-industry-bfsi .hero-image.hero-art--dark:not(.bs-hero--custom) .bg img{
    object-position:15% 50%!important;
  }
}
@media(max-width:720px){
  body.interior-v2.bs-menu-hero.pg-industry-bfsi .hero-image .lead{
    width:100%!important;
    max-width:100%!important;
    min-width:0;
    white-space:normal;
    overflow-wrap:break-word;
  }
  body.interior-v2.bs-menu-hero.pg-industry-bfsi .hero-image.hero-art--dark:not(.bs-hero--custom) .bg img{
    object-position:48% 50%!important;
  }
  body.interior-v2.bs-menu-hero.pg-industry-bfsi .hero-image.hero-art--dark:not(.bs-hero--custom) .bg::after{
    background:linear-gradient(180deg,rgba(4,14,28,.55) 0%,rgba(4,14,28,.58) 54%,rgba(4,14,28,.08) 100%)!important;
  }
}
@media(min-width:1800px){
  body.interior-v2.bs-menu-hero :is(.hero-image,.independent-hero.hero-art,.page-hero,.te-hero,.lab-hero){min-height:720px!important;}
}
@media(max-width:1100px){
  body.interior-v2.bs-menu-hero :is(.hero-image,.independent-hero.hero-art,.page-hero,.te-hero,.lab-hero){min-height:580px!important;}
}
@media(max-width:720px){
  body.interior-v2.bs-menu-hero :is(.hero-image,.independent-hero.hero-art,.page-hero,.te-hero,.lab-hero){min-height:650px!important;}
  body.interior-v2.bs-menu-hero.pg-customer-stories .page-hero:not(.sp-motion){
    background-image:linear-gradient(180deg,rgba(3,17,34,.72),rgba(3,17,34,.78) 66%,rgba(3,17,34,.3)),var(--bs-hero-art)!important;
  }
  /* The civic panorama already puts its artwork beneath the copy on phones. */
  body.interior-v2.bs-menu-hero.pg-industry-public-sector .hero-image:not(.bs-hero--custom)>.container{padding-bottom:230px;}
  body.interior-v2.bs-menu-hero.pg-industry-public-sector .hero-image:not(.bs-hero--custom) .bg img,
  body.interior-v2.bs-menu-hero.pg-industry-public-sector .hero-image:not(.bs-hero--custom) .bg::after{height:300px!important;}
}

/* On wide displays these full-bleed boards have their visual subject on the
   right. Give the copy a wider outer rail so long headlines keep clear of it. */
@media(min-width:1561px){
  body.interior-v2.bs-menu-hero:is(
    .pg-systems,.pg-service-app-engineering,.pg-localisation,.pg-solution-managed-services,
    .pg-industry-bfsi,.pg-industry-consumer,.pg-industry-energy-sustainability,.pg-industry-agriculture
  ) :is(.hero-image,.independent-hero.hero-art)>.container{
    --maxw:1760px;
  }
}
@media(min-width:1101px){
  body.interior-v2.bs-menu-hero.pg-industry-bfsi .banking-hero .h1{
    max-width:min(700px,100%)!important;
    font-size:clamp(52px,3.75vw,72px);
  }
}
