/* mod_mlhero — hero with fixed content + rotating background images */
.mlhero{
	position:relative;overflow:hidden;
	min-height:var(--mlhero-h,560px);
	display:flex;align-items:center;
	background:linear-gradient(180deg,#163d56,#2f7d3a); /* fallback if no images */
	--mlhero-green:#2f8f3f;--mlhero-green-d:#2a8138;
}
.mlhero *{box-sizing:border-box;}

/* background slides */
.mlhero-slides{position:absolute;inset:0;z-index:0;}
.mlhero-slide{
	position:absolute;inset:0;opacity:0;transition:opacity .9s ease;
	background-size:cover;background-position:center;
}
.mlhero-slide.is-active{opacity:1;}

/* single dark gradient overlay above images, below content */
.mlhero-overlay{
	position:absolute;inset:0;z-index:1;
	background:linear-gradient(90deg,
		rgba(11,30,43,var(--mlhero-overlay,.8)) 0%,
		rgba(11,30,43,calc(var(--mlhero-overlay,.8) * .68)) 42%,
		rgba(11,30,43,.12) 78%,
		rgba(11,30,43,0) 100%);
}

/* fixed content */
.mlhero-inner{position:relative;z-index:2;width:100%;max-width:var(--nf-container,1200px);margin-inline:auto;padding-block:48px;padding-inline:clamp(1rem,4vw,2rem);}
.mlhero-content{max-width:640px;color:#fff;}
.mlhero-title{
	font-size:clamp(30px,5vw,56px);line-height:1.05;font-weight:800;letter-spacing:-.5px;
	margin:0 0 20px;text-shadow:0 2px 18px rgba(0,0,0,.25);
}
.mlhero-text{
	font-size:clamp(16px,2vw,19px);line-height:1.5;color:#e7eef2;margin:0 0 28px;max-width:520px;
}
.mlhero-actions{display:flex;gap:14px;flex-wrap:wrap;}
.mlhero-btn{
	display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:13.5px;letter-spacing:.4px;
	padding:14px 24px;border-radius:9px;text-transform:uppercase;text-decoration:none;transition:.16s;
}
.mlhero-btn svg{width:16px;height:16px;}
.mlhero-btn--primary{background:var(--mlhero-green);color:#fff;border:1px solid var(--mlhero-green);}
.mlhero-btn--primary:hover{background:var(--mlhero-green-d);color:#fff;}
.mlhero-btn--ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.7);}
.mlhero-btn--ghost:hover{background:rgba(255,255,255,.14);border-color:#fff;color:#fff;}

/* controls */
.mlhero-arrow{
	position:absolute;top:50%;transform:translateY(-50%);z-index:3;
	width:52px;height:52px;border-radius:50%;
	background:rgba(255,255,255,.10);border:1.5px solid rgba(255,255,255,.55);color:#fff;cursor:pointer;
	display:flex;align-items:center;justify-content:center;transition:.16s;
}
.mlhero-arrow:hover{background:rgba(255,255,255,.22);}
.mlhero-arrow svg{width:22px;height:22px;}
.mlhero-arrow--prev{left:22px;}
.mlhero-arrow--next{right:22px;}

.mlhero-dots{position:absolute;left:0;right:0;bottom:28px;z-index:3;display:flex;justify-content:center;gap:10px;}
.mlhero-dots button{
	width:11px;height:11px;border-radius:50%;border:none;background:rgba(255,255,255,.5);
	cursor:pointer;padding:0;transition:.16s;
}
.mlhero-dots button.is-active{background:#fff;width:13px;height:13px;}

.mlhero-btn:focus-visible,.mlhero-arrow:focus-visible,.mlhero-dots button:focus-visible{
	outline:3px solid #fff;outline-offset:2px;
}

@media (max-width:680px){
	.mlhero-arrow{display:none;}
	.mlhero-dots{bottom:20px;}
	.mlhero-inner{padding-block:40px;}
}
@media (prefers-reduced-motion:reduce){
	.mlhero-slide{transition:none;}
}

/* Separate height on mobile (uses --mlhero-h-mobile when set, else desktop height) */
@media (max-width:767px){
	.mlhero{min-height:var(--mlhero-h-mobile,var(--mlhero-h,560px));}
}