/* ==========================================================================
   Civil Legals — hero skyline
   Photo: Simon Ray on Unsplash (Unsplash License — free for commercial use,
   no attribution required). Replaces the flyer artwork as the hero backdrop.
   ========================================================================== */

.hero__bg { position: absolute; inset: 0; z-index: -2; background: var(--navy-900); }
.hero__bg img {
  display: block; width: 100%; height: 100%;
  object-fit: cover;
  object-position: center 42%;
  /* light grade: warm the stone, keep the sky calm */
  filter: saturate(.92) contrast(1.04) brightness(.9);
  transform: scale(1.02);
}
/* photo not yet uploaded (or blocked): keep the navy gradient — page works */
.hero__bg.is-missing { background: linear-gradient(120deg, var(--navy-900), var(--navy-800) 60%, var(--navy-700)); }

/* navy veil so the headline stays legible over the photograph */
.hero::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(100deg,
      rgba(7, 23, 51, .95) 0%,
      rgba(7, 23, 51, .88) 34%,
      rgba(7, 23, 51, .62) 62%,
      rgba(7, 23, 51, .42) 100%),
    linear-gradient(0deg, rgba(7, 23, 51, .55) 0%, rgba(7, 23, 51, 0) 45%),
    radial-gradient(120% 80% at 88% 6%, rgba(208, 28, 43, .34), transparent 60%);
}

/* portrait crops: pull the tower into frame on narrow screens */
@media (max-width: 700px) {
  .hero__bg img { object-position: 62% center; transform: scale(1.04); }
  .hero::before {
    background:
      linear-gradient(180deg,
        rgba(7, 23, 51, .82) 0%,
        rgba(7, 23, 51, .9) 42%,
        rgba(7, 23, 51, .96) 100%),
      radial-gradient(120% 60% at 80% 4%, rgba(208, 28, 43, .32), transparent 62%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero__bg img { transform: none; }
}