.saniport-hero {
	position: relative;
	min-height: 640px;
	display: flex;
	align-items: center;
	color: var(--sp-white);
	overflow: hidden;
}

.saniport-hero-bg { position: absolute; inset: 0; z-index: 0; }
.saniport-hero-bg img, .saniport-hero-video {
	width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0;
}
.saniport-hero-bg img { transform: scaleX(-1); }

.saniport-hero-slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	transition: opacity 1.2s ease;
}
.saniport-hero-slide.is-active { opacity: 1; }
.saniport-hero-slide img { width: 100%; height: 100%; object-fit: cover; display: block; transform: scaleX(-1); }
.saniport-hero-overlay {
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(0,15,40,0.75), rgba(0,15,40,0.85));
	opacity: var(--overlay-opacity, 0.55);
}

.saniport-hero-content { position: relative; z-index: 1; padding: 100px 0 60px; text-align: left; }

.saniport-hero-title { font-size: clamp(1.7rem, 3.2vw, 2.6rem); color: var(--sp-white); max-width: 780px; }
.saniport-hero-subtitle { font-size: 1.15rem; color: rgba(255,255,255,0.9); max-width: 620px; }
.saniport-hero-desc { color: rgba(255,255,255,0.75); max-width: 600px; }

.saniport-hero-actions { display: flex; gap: 16px; flex-wrap: wrap; justify-content: flex-start; margin: 26px 0 40px; }

.saniport-hero-indicators {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
	max-width: 900px;
	background: rgba(0, 87, 184, 0.55);
	backdrop-filter: blur(6px);
	border-radius: var(--sp-radius);
	padding: 20px;
}
.saniport-hero-indicator { display: flex; align-items: center; gap: 12px; }
.saniport-hero-indicator-icon {
	width: 42px; height: 42px; flex-shrink: 0;
	display: flex; align-items: center; justify-content: center;
	background: rgba(255,255,255,0.15);
	border-radius: 50%;
}
.saniport-hero-indicator-text { display: flex; flex-direction: column; font-size: 0.85rem; }
.saniport-hero-indicator-text strong { color: var(--sp-white); }
.saniport-hero-indicator-text small { color: rgba(255,255,255,0.75); }

@media (max-width: 991px) {
	.saniport-hero-indicators { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 575px) {
	.saniport-hero { min-height: 560px; }
	.saniport-hero-indicators { grid-template-columns: 1fr; }
}