/* Only scenery may crop. Lettering and characters fit inside a capped foreground stage. */
.kh-hero--illustrated{height:280px;background:#e7f6ff;isolation:isolate}
body.kh-site .kh-hero.kh-hero--illustrated:before,body.kh-site .kh-hero.kh-hero--illustrated:after{content:none!important;display:none!important}
.kh-hero--illustrated .kh-hero-background{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center;z-index:0;pointer-events:none}
.kh-hero--illustrated .kh-hero-stage{position:relative;z-index:1;box-sizing:border-box;width:calc(100% - 40px);max-width:1120px;height:100%;margin:0 auto;padding:12px 0}
.kh-hero--illustrated .kh-hero-picture{display:block;width:100%;height:100%}
.kh-hero--illustrated .kh-hero-art{display:block;width:100%;height:100%;object-fit:contain;object-position:center;pointer-events:none}
.kh-hero--illustrated .screen-reader-text{z-index:2}

/* The 80px header is fixed; the supplied 960:280 transparent art fits without a second text line. */
.kh-brand-text--concept{height:100%;justify-content:center}
.kh-brand-text--concept strong{display:block;line-height:0}
.kh-brand-text--concept .kh-brand-art{width:216px;height:63px;max-width:100%;object-fit:contain}

@media(max-width:799px){
 .kh-hero--illustrated{height:200px}
 .kh-hero--illustrated .kh-hero-stage{width:calc(100% - 28px)}
 .kh-brand-text--concept .kh-brand-art{width:164px;height:48px}
}
