/* ==========================================================
   MEHI ERP PREMIUM FOOTER V1
   FULL REPLACEMENT CSS
========================================================== */

:root{

	--footer-bg:#08111F;
	--footer-card:#0F172A;

	--footer-border:rgba(255,255,255,.08);

	--footer-text:#CBD5E1;
	--footer-light:#94A3B8;

	--primary:#2563EB;
	--secondary:#0EA5E9;

	--white:#FFFFFF;

}

/* ==========================================================
   CONTAINER
========================================================== */

.mehi-footer-container{

	width:100%;

	max-width:1700px;

	margin:auto;

	padding-left:30px;
	padding-right:30px;

}

/* ==========================================================
   CTA SECTION
========================================================== */

.mehi-footer-cta{

	padding:55px 0;

	background:
	linear-gradient(
		135deg,
		#07111F,
		#0F172A,
		#172554
	);

	position:relative;

	overflow:hidden;

}

.mehi-footer-cta:before{

	content:"";

	position:absolute;

	top:0;
	left:-120%;

	width:120%;
	height:100%;

	background:
	linear-gradient(
		90deg,
		transparent,
		rgba(255,255,255,.05),
		transparent
	);

	animation:footerShine 10s linear infinite;

}

@keyframes footerShine{

	100%{
		left:140%;
	}

}

.mehi-footer-cta .mehi-footer-container{

	display:flex;

	align-items:center;

	justify-content:space-between;

	gap:40px;

}

.footer-cta-content{

	max-width:760px;

}

.footer-cta-badge{

	display:inline-flex;

	align-items:center;

	padding:8px 14px;

	border-radius:999px;

	font-size:12px;

	font-weight:700;

	color:#fff;

	background:
	rgba(255,255,255,.08);

	border:
	1px solid rgba(255,255,255,.10);

}

.footer-cta-content h2{

	margin:18px 0 12px;

	font-size:42px;

	line-height:1.15;

	font-weight:800;

	color:#fff;

}

.footer-cta-content p{

	margin:0;

	font-size:16px;

	line-height:1.8;

	color:#CBD5E1;

}

.footer-cta-buttons{

	display:flex;

	align-items:center;

	gap:14px;

	flex-shrink:0;

}

.footer-demo-btn{

	height:54px;

	padding:0 28px;

	border-radius:16px;

	text-decoration:none;

	display:flex;

	align-items:center;

	justify-content:center;

	font-size:15px;

	font-weight:800;

	color:#fff;

	background:
	linear-gradient(
		135deg,
		#2563EB,
		#0EA5E9
	);

	box-shadow:
	0 15px 35px rgba(37,99,235,.20);

}

.footer-call-btn{

	height:54px;

	padding:0 28px;

	border-radius:16px;

	text-decoration:none;

	display:flex;

	align-items:center;

	justify-content:center;

	font-size:15px;

	font-weight:700;

	color:#fff;

	border:
	1px solid rgba(255,255,255,.12);

	background:
	rgba(255,255,255,.06);

	backdrop-filter:
	blur(15px);

}

/* ==========================================================
   MAIN FOOTER
========================================================== */

#mehi-footer{

	background:var(--footer-bg);

}

.footer-grid{

	display:grid;

	grid-template-columns:
	1.5fr
	1fr
	1fr
	1fr;

	gap:40px;

	padding:65px 0 50px;

}

/* ==========================================================
   COMPANY
========================================================== */

.footer-logo{

	display:flex;

	align-items:center;

	gap:14px;

	margin-bottom:20px;

}

.footer-logo img{

	height:58px;

	width:auto;

	object-fit:contain;

}

.footer-logo h3{

	margin:0;

	font-size:28px;

	font-weight:800;

	color:#fff;

}

.footer-logo span{

	font-size:12px;

	font-weight:700;

	color:#94A3B8;

}

.footer-about{

	margin:0;

	font-size:14px;

	line-height:1.9;

	color:#CBD5E1;

}

.footer-contact-short{

	margin-top:22px;

	display:flex;

	flex-direction:column;

	gap:10px;

}

.footer-contact-short a{

	color:#fff;

	text-decoration:none;

	font-size:14px;

	font-weight:600;

}

/* ==========================================================
   COLUMNS
========================================================== */

.footer-column h4{

	margin:0 0 20px;

	font-size:18px;

	font-weight:800;

	color:#fff;

}

.footer-column ul{

	margin:0;
	padding:0;

	list-style:none;

}

.footer-column li{

	margin-bottom:12px;

	color:#CBD5E1;

	font-size:14px;

	line-height:1.6;

}

.footer-column a{

	color:#CBD5E1;

	text-decoration:none;

	transition:.25s;

}

.footer-column a:hover{

	color:#fff;

	padding-left:4px;

}

/* ==========================================================
   SUPPORT BUTTONS
========================================================== */

.footer-buttons{

	margin-top:22px;

	display:flex;

	flex-direction:column;

	gap:10px;

}

.footer-whatsapp,
.footer-support{

	height:44px;

	border-radius:12px;

	text-decoration:none;

	display:flex;

	align-items:center;

	justify-content:center;

	font-size:14px;

	font-weight:700;

}

.footer-whatsapp{

	color:#fff;

	background:
	linear-gradient(
		135deg,
		#2563EB,
		#0EA5E9
	);

}

.footer-support{

	color:#fff;

	border:
	1px solid rgba(255,255,255,.10);

	background:
	rgba(255,255,255,.05);

}

/* ==========================================================
   BOTTOM BAR
========================================================== */

.footer-bottom{

	border-top:
	1px solid rgba(255,255,255,.06);

}

.footer-bottom-inner{

	min-height:58px;

	display:flex;

	align-items:center;

	justify-content:space-between;

	gap:20px;

}

.footer-copyright{

	font-size:13px;

	color:#94A3B8;

}

.footer-bottom-links{

	display:flex;

	align-items:center;

	gap:24px;

}

.footer-bottom-links a{

	text-decoration:none;

	font-size:13px;

	color:#94A3B8;

}

/* ==========================================================
   HOVER EFFECTS
========================================================== */

.footer-demo-btn,
.footer-call-btn,
.footer-whatsapp,
.footer-support{

	transition:.25s;

}

.footer-demo-btn:hover,
.footer-call-btn:hover,
.footer-whatsapp:hover,
.footer-support:hover{

	transform:translateY(-2px);

}

/* ==========================================================
   TABLET
========================================================== */

@media(max-width:1100px){

	.mehi-footer-cta .mehi-footer-container{

		flex-direction:column;

		align-items:flex-start;

	}

	.footer-grid{

		grid-template-columns:
		1fr
		1fr;

	}

}

/* ==========================================================
   MOBILE
========================================================== */

@media(max-width:768px){

	.mehi-footer-container{

		padding-left:18px;
		padding-right:18px;

	}

	.mehi-footer-cta{

		padding:40px 0;

	}

	.footer-cta-content h2{

		font-size:28px;

	}

	.footer-cta-buttons{

		width:100%;

		flex-direction:column;

	}

	.footer-demo-btn,
	.footer-call-btn{

		width:100%;

	}

	.footer-grid{

		grid-template-columns:
		1fr
		1fr;

		gap:28px;

		padding:45px 0 35px;

	}

	.footer-company{

		grid-column:
		1 / -1;

	}

	.footer-bottom-inner{

		padding:15px 0;

		flex-direction:column;

		text-align:center;

	}

	.footer-bottom-links{

		flex-wrap:wrap;

		justify-content:center;

		gap:14px;

	}

	.footer-logo h3{

		font-size:24px;

	}

}




/* ==========================================
   FOOTER JS CLASSES
========================================== */

.footer-active-link{

	color:#FFFFFF !important;

	font-weight:700;

}

.footer-visible{

	opacity:1 !important;

	transform:translateY(0) !important;

}

.footer-column,
.footer-company{

	opacity:0;

	transform:translateY(20px);

	transition:
	opacity .6s ease,
	transform .6s ease;

}

.footer-cta-badge{

	transition:.3s;

}

.footer-glow{

	box-shadow:
	0 0 0 0 rgba(37,99,235,.40),
	0 0 35px rgba(37,99,235,.25);

}