/* A complete first screen; taller content remains reachable before the cover arrives. */
#hero.keybridge-hero{position:relative;top:0;height:auto;min-height:100svh;min-height:100dvh}
#hero.keybridge-hero[data-hero-overlap]{position:sticky;top:var(--hero-sticky-top,0px)}
#hero.keybridge-hero>.hero-grid{position:relative;inset:auto;min-height:100svh;min-height:100dvh;grid-template-rows:minmax(min-content,1fr) auto}
body.hero-revealing:not(.nav-compact):not(.menu-open) .hcol a{transform:none;transition-delay:0s;transition-duration:.6s,.25s,.3s}
body.hero-revealing:not(.nav-compact):not(.menu-open) .hcol .hline{transform:scaleY(1);transition-delay:0s;transition-duration:.55s}
@media(max-width:720px){
 #hero.keybridge-hero{--hero-art-space:clamp(12rem,calc(100dvh - 26rem),calc(80vw + 5.5rem))}
 #hero.keybridge-hero .hcell--name{padding-top:var(--hero-art-space);padding-bottom:1.25rem}
 #hero.keybridge-hero .kb-particle-field{height:min(124vw,calc(var(--hero-art-space) + 3.5rem))}
 #hero.keybridge-hero .hpanel--one{padding:1.25rem min(1.35rem,6vw);gap:1.15rem}
 #hero.keybridge-hero :is(.hp-head,.hp-foot,.hp-reach,.hp-r){min-width:0;max-width:100%}
 #hero.keybridge-hero :is(.hp-motto,.hp-line,.hp-email-address){overflow-wrap:anywhere}
 #hero.keybridge-hero .hp-r>span{min-width:0;overflow-wrap:anywhere}
 #hero.keybridge-hero .hp-lead{display:block;max-width:100%;overflow-wrap:anywhere}
 #hero.keybridge-hero .hp-go{display:inline-block;margin-inline-start:.6rem}
}
@media(max-width:1100px),(pointer:coarse),(max-height:650px){
 /* The mobile opening is a paper cover, not a standalone gradient screen. */
 .keybridge-hero~.after-hero .rec{background:var(--rg,var(--paper))}
 .keybridge-hero~.after-hero .rec::before{display:none}
 .keybridge-hero~.after-hero .rec-grid{padding-top:clamp(2.5rem,7svh,4rem)}
 .keybridge-hero~.after-hero .rec-left{position:relative;top:auto}
}
@media(prefers-reduced-motion:reduce){
 #hero.keybridge-hero[data-hero-overlap]{position:relative;top:0}
}