/* Divorce hero showcase — animated background texture + 3-version text/image crossfade.
   Layout is unchanged; this only layers behind the content and swaps text/image. */

/* (1) faint animated homes texture on the blue hero bg — monotone, barely-there */
.hero-section-divorce { position: relative; overflow: hidden; }
.dv-hero-texture {
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: url("../img/hero-homes.jpg") center / cover no-repeat;
  filter: grayscale(1) contrast(1.06);
  opacity: .12; mix-blend-mode: soft-light;
  animation: dvHeroPan 46s ease-in-out infinite alternate;
}
@keyframes dvHeroPan {
  from { transform: scale(1.06) translate(0, 0); }
  to   { transform: scale(1.15) translate(-2.5%, -1.5%); }
}
/* keep the real hero content above the texture */
.hero-section-divorce > .container { position: relative; z-index: 1; }

/* (2) 3-version crossfade — stacked photo layers inside the image mask.
   They sit over the ::before (old baked photo) and under the ::after highlight. */
.dv-show .hero-image-mask .dv-slide-img {
  position: absolute; inset: 0; background-size: cover; background-position: center;
  opacity: 0; transition: opacity 1s ease; will-change: opacity;
}
.dv-show .hero-image-mask .dv-slide-img.is-active { opacity: 1; }

/* text crossfade */
.hero-title.dv-fade, .hero-subtitle.dv-fade { transition: opacity .45s ease; }
.hero-title.dv-out,  .hero-subtitle.dv-out  { opacity: 0; }

/* slide dots */
.dv-hero-dots {
  position: absolute; left: 0; right: 0; bottom: 14px; z-index: 5;
  display: flex; gap: 8px; justify-content: center;
}
.dv-hero-dots button {
  width: 9px; height: 9px; border-radius: 50%; border: 0; padding: 0; cursor: pointer;
  background: rgba(255, 255, 255, .45); transition: background .3s, transform .3s;
}
.dv-hero-dots button:hover { transform: scale(1.2); }
.dv-hero-dots button.is-active { background: #fff; }

@media (prefers-reduced-motion: reduce) {
  .dv-hero-texture { animation: none; }
  .dv-slide-img, .hero-title.dv-fade, .hero-subtitle.dv-fade { transition: none; }
}
