@import url('/assets/homepage-owner-final-2026.css');
@import url('/assets/homepage-hero-seam-lock-2026.css?v=20260917-a');

/* Owner-approved 9:16 Chacha + Georgia scene. Netlify creates this real WebP at build time after SHA-256 validation. */
html body.hp-canonical-two-column #hpBoard .hp-left .hero{
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate!important;
  background-color:#0b2e50!important;
  background-image:url('/assets/chacha-hero-2026.webp?v=20260914-final')!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  background-position:60% center!important;
}

/* Never render a second/inset Chacha image inside the hero. */
html body.hp-canonical-two-column #hpBoard .hp-left .hero::before,
html body.hp-canonical-two-column #hpBoard .hp-left .hero .hp-owner-chacha{
  display:none!important;
}

/* Readability overlay only; the photo remains one continuous full-bleed scene. */
html body.hp-canonical-two-column #hpBoard .hp-left .hero::after{
  display:block!important;
  content:''!important;
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  pointer-events:none!important;
  background:
    linear-gradient(90deg,rgba(3,23,40,.78) 0%,rgba(3,23,40,.56) 30%,rgba(3,23,40,.22) 55%,rgba(3,23,40,.03) 82%,rgba(3,23,40,0) 100%),
    linear-gradient(180deg,rgba(3,23,40,.02) 16%,rgba(3,23,40,.07) 58%,rgba(3,23,40,.44) 100%)!important;
}

html body.hp-canonical-two-column #hpBoard .hp-left .hero h1,
html body.hp-canonical-two-column #hpBoard .hp-left .hero .sub,
html body.hp-canonical-two-column #hpBoard .hp-left .hero .greet,
html body.hp-canonical-two-column #hpBoard .hp-left .hero .trust,
html body.hp-canonical-two-column #hpBoard .hp-left .hero .hp-hero-meta,
html body.hp-canonical-two-column #hpBoard .hp-left .hero #hpHeroMeta,
html body.hp-canonical-two-column #hpBoard .hp-left .hero .top{
  position:relative!important;
  z-index:4!important;
}

html[dir='rtl'] body.hp-canonical-two-column #hpBoard .hp-left .hero{
  background-position:40% center!important;
}
html[dir='rtl'] body.hp-canonical-two-column #hpBoard .hp-left .hero::after{
  background:
    linear-gradient(270deg,rgba(3,23,40,.78) 0%,rgba(3,23,40,.56) 30%,rgba(3,23,40,.22) 55%,rgba(3,23,40,.03) 82%,rgba(3,23,40,0) 100%),
    linear-gradient(180deg,rgba(3,23,40,.02) 16%,rgba(3,23,40,.07) 58%,rgba(3,23,40,.44) 100%)!important;
}

@media(max-width:600px){
  html body.hp-canonical-two-column #hpBoard .hp-left .hero{background-position:62% center!important}
  html[dir='rtl'] body.hp-canonical-two-column #hpBoard .hp-left .hero{background-position:38% center!important}
}

#chatShell.full .chat-head .ava{background:#fff url('/assets/chacha-mascot.svg') center/contain no-repeat!important}