/* ABOUT OVER THE HERO (14 Nov 2026, hiruni's idea)
   The About words now rise over the 3D hero while it is still pinned,
   instead of a cream sheet covering it. The About photo is not needed.
   Words are the same; only where they sit and their colours change. */
#about .ph{display:none!important}                                   /* no photo */
#about .grid{grid-template-columns:1fr!important}
#about .copy{max-width:600px}
@media (min-width:761px){
  #about.ab8::before{background:transparent!important;box-shadow:none!important}   /* no cream sheet: the 3D shows through */
  #about.ab8{color:#fff;--ink:#fff;--dim:rgba(255,255,255,.38);min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding-top:0!important;padding-bottom:0!important}
  #about .chap{color:rgba(255,255,255,.62)!important;border-color:rgba(255,255,255,.16)!important}
  #about .chap a{color:rgba(255,255,255,.62)!important}
  #about .ab8-h{color:#fff!important;text-shadow:0 2px 30px rgba(0,0,0,.35)}
  #about .ab8-h b{color:#9b9188!important}
  #about .ab8-h b span{color:var(--orange-ink,#ff5a1f)!important}
  #about .ab8-say{text-shadow:0 1px 18px rgba(0,0,0,.45)}
}
#top .screen.ab-on .capp,#top .screen.ab-on .h360-hint{opacity:0!important;transition:opacity .4s}   /* hero labels step away for the About words */
#top .screen.ab-on .prog{opacity:0!important}   /* hide the hero scroll bar line under About */