/* All menu banners share the HUD PGU typography and desktop canvas. */
body.subpage main :is(.hero.product-hero,.case-hero){
  box-sizing:border-box;
  position:relative;
  isolation:isolate;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  width:100%;
  height:580px;
  min-height:580px;
  padding:135px var(--page-gutter) 74px;
  overflow:hidden;
  text-align:left;
}
body.subpage main :is(.hero.product-hero,.case-hero) :is(.hero-content,.case-hero-inner){
  width:100%;
  max-width:1000px;
  min-width:0;
  margin:0;
}
body.subpage main :is(.hero.product-hero,.case-hero) h1{
  max-width:1000px;
  margin:0;
  font-family:inherit;
  font-size:clamp(38px,4.8vw,68px);
  font-weight:500;
  line-height:1.13;
  letter-spacing:-.035em;
  text-transform:uppercase;
  text-align:left;
}
html[lang=zh-CN] body.subpage main :is(.hero.product-hero,.case-hero) h1{
  line-height:1.4;
  letter-spacing:.01em;
}
/* These three-line headings remain English in the Chinese edition. */
html[lang=zh-CN] body.subpage main :is(.hero.engineering-hero,.case-hero) h1{line-height:1.13;letter-spacing:-.035em}
body.subpage main .hero.product-hero .hero-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:center;
}
body.subpage.has-custom-banner main .product-hero:before{
  background:linear-gradient(90deg,rgba(3,5,8,.64),rgba(3,5,8,.2) 58%,transparent 82%),linear-gradient(0deg,#080809,transparent 20%);
}
body.subpage main .case-hero .iris-breadcrumb{
  position:absolute;
  top:100px;
  left:var(--page-gutter);
  right:var(--page-gutter);
  margin:0;
  font-size:12px;
  line-height:1.6;
}
body.subpage main .case-hero .eyebrow{display:none}
body.subpage main .case-hero p{margin-top:28px;font-size:18px;line-height:1.8}
@media(max-width:800px){
  /* Match the existing HUD mobile canvas as well as its title size. */
  body.subpage main :is(.hero.product-hero,.case-hero){
    height:500px;
    min-height:500px;
    padding:135px 6vw 45px;
  }
  body.subpage main :is(.hero.product-hero,.case-hero) h1{
    font-size:clamp(32px,9.75vw,38px);
    line-height:1.12;
  }
  html[lang=zh-CN] body.subpage main :is(.hero.product-hero,.case-hero) h1{line-height:1.4}
  body.subpage main .case-hero .iris-breadcrumb{left:6vw;right:6vw}
}
