/* ================= FOOTER STYLES ================= */
.site-footer {
	background: #0d1b2a;
	color: #d9d9d9;
	/* font-family: Arial, sans-serif; */
}

/* GRID WITH CUSTOM COLUMN WIDTHS */
.footer-container {
	max-width: 1250px;
	margin: auto;
	padding: 60px 20px;
	display: grid;
	/* grid-template-columns: 2fr 1fr 1fr 1fr 1fr; */
	/* MAGIC LINE */
	grid-template-columns: minmax(280px, 2fr) repeat(auto-fit, minmax(180px, 1fr));

	column-gap: 40px; /* EXTRA SPACE AFTER COMPANY */
}

/* COMPANY COLUMN */
.wide-col {
	padding-right: 30px;
}

.footer-logo {
	color: #ffffff;
	font-size: 26px;
	margin-bottom: 12px;
}

.footer-desc {
	font-size: 14px;
	line-height: 1.8;
	color: #bfc7cf;
	max-width: 380px;
}
.footer-logo-img {
	width: 100%;
	height: auto;
	margin-bottom: 20px;
}

/* HEADINGS */
.footer-col h4 {
	color: #ffffff;
	font-size: 16px;
	margin-bottom: 15px;
}

.footer-col h4::after {
	content: "";
	width: 28px;
	height: 2px;
	background: #1aa7ff;
	display: block;
	margin-top: 6px;
}

/* LINKS */
.footer-col ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.footer-col ul li {
	margin-bottom: 10px;
	font-size: 14px;
}

.footer-col ul li a {
	text-decoration: none;
	color: #bfc7cf;
	transition: 0.3s ease;
}

.footer-col ul li a:hover {
	color: #1aa7ff;
	padding-left: 6px;
}

.footer-contact li {
	color: #bfc7cf;
}

/* BOTTOM BAR */
.footer-bottom {
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	text-align: center;
	padding: 18px 10px;
	font-size: 13px;
	background: #0b1623;
	color: #aab4be;
}

/* ================= RESPONSIVE ================= */
@media (max-width: 1100px) {
	.footer-container {
		grid-template-columns: repeat(3, 1fr);
		row-gap: 40px;
	}

	.wide-col {
		grid-column: span 3;
		padding-right: 0;
	}

	.footer-desc {
		max-width: 100%;
	}
}

@media (max-width: 768px) {
	.footer-container {
		grid-template-columns: repeat(2, 1fr);
		text-align: center;
	}

	.wide-col {
		grid-column: span 2;
	}

	.footer-col h4::after {
		margin-left: auto;
		margin-right: auto;
	}
}

@media (max-width: 480px) {
	.footer-container {
		grid-template-columns: 1fr;
	}

	.wide-col {
		grid-column: span 1;
	}
}