/* Late-mortgage hero showcase — crossfade the eyebrow/headline/copy + the image between 3 versions. */
.lm-eyebrow.dv-fade, h1.dv-fade, p.dv-fade, img.dv-fade { transition: opacity .3s ease; }
.dv-out { opacity: 0 !important; }

/* nav row: prev arrow + dots + next arrow */
.dv-hero-nav { display: flex; align-items: center; gap: 14px; margin-top: 20px; }
.dv-hero-dots { display: flex; gap: 8px; }
.dv-hero-dots button {
  width: 9px; height: 9px; border-radius: 50%; border: 0; padding: 0; cursor: pointer;
  background: rgba(34, 73, 107, .28); transition: background .3s, transform .3s;
}
.dv-hero-dots button:hover { transform: scale(1.2); }
.dv-hero-dots button.is-active { background: var(--bs-primary, #22496B); }

.dv-hero-arrow {
  width: 34px; height: 34px; border-radius: 50%; padding: 0; cursor: pointer;
  border: 1px solid rgba(34, 73, 107, .28); background: #fff; color: var(--bs-primary, #22496B);
  font-size: 1.35rem; line-height: 1; display: flex; align-items: center; justify-content: center;
  transition: background .25s, border-color .25s, color .25s;
}
.dv-hero-arrow:hover, .dv-hero-arrow:focus-visible { background: var(--bs-primary, #22496B); border-color: var(--bs-primary, #22496B); color: #fff; }

@media (prefers-reduced-motion: reduce) {
  .lm-eyebrow.dv-fade, h1.dv-fade, p.dv-fade, img.dv-fade { transition: none; }
}

/* gradient wave that sweeps right -> left only while a slide is changing */
.dv-hero-show { position: relative; }
.dv-hero-show > .container { position: relative; z-index: 2; }
.dv-hero-wave { position: absolute; inset: 0; z-index: 1; pointer-events: none; overflow: hidden; }
.dv-hero-wave::before {
  content: ""; position: absolute; top: -45%; bottom: -45%; width: 62%; left: 125%;
  background: linear-gradient(90deg,
      rgba(0,0,0,0) 0%,
      rgba(34,73,107,.12) 46%,
      rgba(224,145,58,.11) 58%,
      rgba(0,0,0,0) 100%);
  transform: rotate(-16deg); transform-origin: center;
  filter: blur(3px); opacity: 0;
}
.dv-hero-wave.is-go::before { animation: dvWaveSweep 1.8s ease-in-out; }
@keyframes dvWaveSweep {
  0%   { left: 125%; opacity: 0; }
  16%  { opacity: 1; }
  84%  { opacity: 1; }
  100% { left: -80%; opacity: 0; }
}
@media (prefers-reduced-motion: reduce) { .dv-hero-wave { display: none; } }
