/* REVIVA public editorial heroes — one visual language, four distinct stories. */
.hero.visual.editorial-hero {
  --atlas-position: 0% 0%;
  min-height: calc(100svh - 76px);
  background: #100c08;
  isolation: isolate;
}

.hero.visual.editorial-hero::after {
  background-image:
    linear-gradient(90deg, rgba(5, 3, 2, .96) 0%, rgba(8, 5, 3, .82) 34%, rgba(8, 5, 3, .30) 68%, rgba(5, 3, 2, .10) 100%),
    linear-gradient(0deg, rgba(3, 2, 1, .46) 0%, transparent 52%),
    url('../img/reviva-public-heroes-atlas-v1.png');
  background-position: center, center, var(--atlas-position);
  background-repeat: no-repeat;
  background-size: 100% 100%, 100% 100%, 200% auto;
  opacity: 1;
  filter: saturate(.88) contrast(1.04);
}

.hero.visual.editorial-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .055);
}

.hero.visual.editorial-hero > * { z-index: 2; }
.hero.visual.editorial-hero.hero-rete { --atlas-position: 0% 0%; }
.hero.visual.editorial-hero.hero-enti { --atlas-position: 100% 0%; }
.hero.visual.editorial-hero.hero-emergenze { --atlas-position: 0% 100%; }
.hero.visual.editorial-hero.hero-bandi { --atlas-position: 100% 100%; }

.editorial-hero .h1 {
  max-width: 830px;
  text-wrap: balance;
  text-shadow: 0 3px 28px rgba(0, 0, 0, .38);
}

.editorial-hero .lead { max-width: 650px; }

.editorial-hero .floating-panel {
  align-self: end;
  margin-bottom: 3vh;
  background: rgba(17, 12, 8, .66);
  border-color: rgba(255, 255, 255, .16);
}

@media (max-width: 760px) {
  .hero.visual.editorial-hero {
    min-height: calc(100svh - 68px);
    padding-top: 120px;
    padding-bottom: 54px;
    align-items: end;
  }

  .hero.visual.editorial-hero::after {
    background-image:
      linear-gradient(0deg, rgba(5, 3, 2, .98) 0%, rgba(7, 4, 2, .78) 48%, rgba(7, 4, 2, .20) 100%),
      linear-gradient(90deg, rgba(5, 3, 2, .68) 0%, transparent 84%),
      url('../img/reviva-public-heroes-atlas-v1.png');
    background-size: 100% 100%, 100% 100%, auto 200%;
  }

  .editorial-hero .floating-panel { display: none; }
}
