/* v5 (Grok Bot): portrait screens get a zoomed-out, full-building frame of the channel with the copy below it */
@media (max-aspect-ratio: 4/5){
  .hero{height:auto;min-height:0;max-height:none;display:block;background:var(--cream)}
  .hero__stage{position:relative;inset:auto;width:100%;aspect-ratio:7/6;border-radius:0 !important;transform:none !important}
  .hero__media{inset:0}
  .hero__poster,.hero__video{object-position:100% 50%}
  .hero__veil{background:linear-gradient(180deg,rgba(10,30,40,.28) 0,rgba(10,30,40,0) 30%)}
  .hero__content{position:relative;left:auto;right:auto;top:auto;bottom:auto;display:block;padding:20px clamp(16px,5vw,40px) 6px}
  .hero__card{background:none;border:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;padding:0;border-radius:0;max-width:640px}
  .hero__card .eyebrow,.hero__card>p:first-child{display:block}
  .hero__title{font-size:clamp(1.9rem,1.2rem + 3.2vw,2.8rem)}
  .hero__sub{display:block;margin-top:.6rem;font-size:.92rem}
  .hero__ctas{margin-top:1rem;flex-wrap:nowrap;gap:10px}
  .hero__ctas .btn{flex:1 1 0;white-space:nowrap}
  .hero__caption{top:calc(100vw * 6 / 7 - 56px);bottom:auto;left:auto;right:10px;padding:4px;gap:0}
  .hero__caption > span{display:none}
}
.hero__caption:has(.hero__toggle[hidden]){display:none}
/* the fallback clip sits 1px inside the poster so its first frame never counts as a larger, later LCP paint */
.hero__kb{bottom:1px}
.hero.is-video-on .hero__poster{visibility:visible}