/* home hero with crossfading backgrounds A/B/D/E (D replaced C, Utrecht).
   Layout follows Fleur's round-2 mockup (hero-mockup-css-reference.css); text unchanged.
   The scrim is one fixed layer above all three photos, so contrast never depends on the frame. */
.hero.hero-cycle{background:#1c1630 !important;text-align:left}
.hero.hero-cycle::before,.hero.hero-cycle::after{display:none !important}
.hero-cycle .hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.hero-cycle .hero-bg-layer{position:absolute;inset:0;opacity:0;transition:opacity 1.5s ease-in-out;will-change:opacity}
.hero-cycle .hero-bg-layer.is-active{opacity:1}
.hero-cycle .hero-bg-layer img{display:block;width:100%;height:100%;object-fit:cover;object-position:right center}
.hero-cycle .hero-scrim{position:absolute;inset:0;background:
 linear-gradient(0deg,rgba(28,22,48,0.70) 0%,rgba(28,22,48,0) 26%),
 linear-gradient(90deg,rgba(28,22,48,0.8) 0%,rgba(28,22,48,0.8) 52%,rgba(40,28,66,0.45) 74%,rgba(40,28,66,0.08) 100%)}
.hero-cycle > .container{align-items:flex-start;max-width:1240px;margin:0 auto;padding:0 2rem;box-sizing:border-box}
.hero-cycle .hero-content{max-width:46rem;margin:0;text-align:left;animation:none}
.hero-cycle h1{text-shadow:none;font-size:3.4rem}
.hero-cycle .hero-subheading{margin-left:0;margin-right:0;max-width:40rem;text-shadow:none;text-wrap:pretty}
.hero-cycle .hero-cta-buttons,.hero-cycle .hero-trust-indicators{justify-content:flex-start}
.hero-cycle .cta-subtext,.hero-cycle .cta-subtext p{text-align:left;margin-left:0}
.hero-cycle .hero-agencies{text-align:left;left:max(2rem,calc((100vw - 1240px)/2 + 2rem));right:auto;padding:0}
.hero-cycle .hero-agencies-logos{justify-content:flex-start}
@media (max-width:767px){
 .hero-cycle .hero-bg-layer img{object-position:70% center}
 .hero-cycle .hero-bg-layer[data-bg="d"] img{object-position:90% center}
 .hero-cycle .hero-bg-layer[data-bg="e"] img{object-position:45% center}
 .hero-cycle .hero-scrim{background:linear-gradient(180deg,rgba(28,22,48,0.76) 0%,rgba(28,22,48,0.78) 60%,rgba(28,22,48,0.84) 100%)}
 .hero-cycle h1{font-size:2.35rem}
 .hero-cycle > .container{padding:0 1rem}
 .hero-cycle .hero-agencies{left:auto;padding:0}
 .hero-cycle .hero-trust-indicators{align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){
 .hero-cycle .hero-bg-layer{transition:none}
}
