/* About hero: previous office photo + strong wash for readable text
   Badge centred. FULL FILE FORCE v=force6
   ============================================================================= */

#page-overview.about-premium-hero{
  /* Previous office hero photo (local) */
  --about-hero-photo:url("../zatra-hero-about.jpg");
  /* Balanced wash — office photo visible, copy still crisp */
  --about-hero-wash:linear-gradient(
    115deg,
    rgba(255,255,255,.76) 0%,
    rgba(255,255,255,.60) 42%,
    rgba(255,255,255,.48) 72%,
    rgba(255,255,255,.54) 100%
  );
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  border:0!important;
  border-bottom:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  background-color:#dbe4ee!important;
  background-image:none!important;
  min-height:0!important;
}

#page-overview.about-premium-hero::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  pointer-events:none!important;
  display:block!important;
  background-color:#dbe4ee!important;
  background-image:var(--about-hero-wash),var(--about-hero-photo)!important;
  background-size:cover!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
  border:0!important;
  border-radius:0!important;
  opacity:1!important;
  visibility:visible!important;
}

#page-overview.about-premium-hero > *{
  position:relative!important;
  z-index:1!important;
}

#page-overview.about-premium-hero .about-hero-shell,
#page-overview.about-premium-hero .about-hero-copy{
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  overflow:visible!important;
}

#page-overview.about-premium-hero .about-hero-shell::before,
#page-overview.about-premium-hero .about-hero-copy::before{
  display:none!important;
  content:none!important;
  background:none!important;
}

/* Hero copy text — high contrast over washed photo */
#page-overview.about-premium-hero .about-hero-copy,
#page-overview.about-premium-hero .about-hero-copy h1,
#page-overview.about-premium-hero .about-hero-copy p,
#page-overview.about-premium-hero #about-hero-title{
  color:#07111f!important;
  text-shadow:none!important;
}

/* Hero badge — centred */
#page-overview.about-premium-hero .about-hero-copy{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  text-align:center!important;
}

#page-overview.about-premium-hero .about-hero-copy > .retention-kicker,
#page-overview.about-premium-hero .retention-kicker{
  display:inline-flex!important;
  margin-left:auto!important;
  margin-right:auto!important;
  margin-inline:auto!important;
  align-self:center!important;
  justify-self:center!important;
  float:none!important;
}

/* =============================================================================
   Zatra story beat photos — force previous staff photos visible
   ============================================================================= */
#about-story .about-story-beat-media,
.about-story-section .about-story-beat-media{
  position:relative!important;
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  min-height:148px!important;
  height:auto!important;
  overflow:hidden!important;
  background:#101828!important;
}

#about-story .about-story-beat-media img,
.about-story-section .about-story-beat-media img{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  width:100%!important;
  height:100%!important;
  min-height:148px!important;
  max-height:none!important;
  object-fit:cover!important;
  object-position:center 22%!important;
  filter:none!important;
  transform:none!important;
}

#about-story .about-story-beat-card,
.about-story-section .about-story-beat-card{
  display:grid!important;
  grid-template-columns:minmax(148px,.95fr) minmax(0,1.35fr)!important;
  visibility:visible!important;
  opacity:1!important;
}

@media (max-width:980px){
  #about-story .about-story-beat-card,
  .about-story-section .about-story-beat-card{
    grid-template-columns:1fr!important;
  }
  #about-story .about-story-beat-media,
  .about-story-section .about-story-beat-media,
  #about-story .about-story-beat-media img,
  .about-story-section .about-story-beat-media img{
    min-height:180px!important;
    max-height:220px!important;
  }
}
