body, html {
	margin: 0 !important;
	padding: 0 !important;
	height: 100% !important;
	/* font-family: 'Arial', sans-serif !important; */
	/* background: #f8f9fa !important; */
	/* overflow: hidden !important; */
}

.ef-hero-section {
	height: 100vh !important;
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	text-align: center !important;
	position: relative !important;
	overflow: visible !important;
}

.ef-bg-elements {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	height: 150% !important;
	z-index: 1 !important;
	overflow: hidden !important;
}

.ef-content-overlay {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	height: 100% !important;
	background: rgba(255, 255, 255, 0.2) !important;
	z-index: 2 !important;
}

.bg-element {
	position: absolute !important;
	opacity: 0.08 !important;
	mix-blend-mode: multiply !important;
}

.ef-hero-content {
	position: relative;
	z-index: 3;
	max-width: 800p;
	padding: 20px;
}

.ef-hero-content h1 {
	/* font-size: 4.5rem; */
	margin: 0;
	/* color: rgba(39, 60, 150); */
	animation: float 3s ease-in-out infinite;
	/* text-shadow: 0px 0px 30px rgba(51, 49, 126, 0.5); */
}

.ef-hero-content p {
	/* color: rgba(39, 60, 150, 0.5) !important; */
	/* font-size: 1.2rem !important; */
	margin: 1rem 0 !important;
}

@keyframes float {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-10px); }
}

.ef-cta-button {
	padding: 16px 40px !important;
	font-size: 1.2rem !important;
	background: linear-gradient(135deg, #ffffff, #f0f0f0) !important;
	color: #2a5298 !important;
	border: none !important;
	border-radius: 50px !important;
	cursor: pointer !important;
	position: relative !important;
	overflow: hidden !important;
	transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1) !important;
	transform-style: preserve-3d !important;
	display: none !important;
}

.ef-cta-button::before {
	content: '' !important;
	position: absolute !important;
	top: 0 !important;
	left: -100% !important;
	width: 100% !important;
	height: 100% !important;
	background: linear-gradient(
		120deg,
		transparent,
		rgba(42, 82, 152, 0.1),
		transparent
	) !important;
	transition: 0.6s !important;
}

.ef-cta-button:hover {
	transform: translateY(-3px) scale(1.05) !important;
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.15) !important;
}

.ef-cta-button:hover::before {
	left: 100% !important;
}

.ef-scroll-indicator {
	position: absolute !important;
	bottom: 100px !important;
	left: 50% !important;
	transform: translateX(-50%) !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	gap: 8px !important;
	z-index: 3 !important;
}

.ef-scroll-track {
	width: 2px;
	height: 60px;
	background: rgba(39, 60, 150, 0.507);
	position: relative;
	border-radius: 2px;
}

.ef-scroll-dot {
	width: 8px;
	height: 8px;
	background: rgba(39, 60, 150, 0.507);
	border-radius: 50%;
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	animation: scrollPulse 2s infinite;
}

@keyframes scrollPulse {
	0% {
		top: 0;
		opacity: 1;
		transform: translateX(-50%) scale(1);
	}
	50% {
		transform: translateX(-50%) scale(1.2);
	}
	100% {
		top: 100%;
		opacity: 0;
		transform: translateX(-50%) scale(0.5);
	}
}

.ef-scroll-label {
	color: rgba(39, 60, 150, 0.507);
	font-weight: 500;
	letter-spacing: 1px;
	animation: labelFade 2s infinite;
}

@keyframes labelFade {
	0%, 100% { opacity: 0.6; }
	50% { opacity: 1; }
}