/* Footer */
.main-footer {
	background-color: var(--primary-color);
	border-radius: 20px;
	margin-bottom: 4vh;
	width: 92%;
	margin-inline: auto;
	color: white;
	padding: 2rem 0;
	position: relative;
	/* box-shadow: 0px 50px 100px 1px #1a4b8c6c; */
}

.linear {
	position: relative;
	background: linear-gradient(transparent 20%, #acd1ec 20%);
	width: 100vw;
	height: 100%;
	bottom: -15%;
	left: -7%;
	z-index: -1;
}

.footer-container {
	max-width: 1350px;
	margin: 0 auto;
	padding: 0 2rem;
	display: flex;
	/* align-items: center; */
	justify-content: space-between;
	gap: 2rem;
}

.footer-left {
	display: flex;
	flex-direction: column;
	width: 16%;
}

.footer-left img {
	width: 70px;
	height: 70px;
}

.foundation-info h3 {
	margin-bottom: 0.5rem;
}

.foundation-info p {
	font-style: italic;
	margin-bottom: 0.5rem;
	white-space: nowrap;
}

.foundation-info a {
	color: white;
	text-decoration: none;
	white-space: nowrap;
}

.footer-center {
	display: flex;
	justify-content: space-around;
	gap: 5rem;
}

.social-media,
.quick-links {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	white-space: nowrap;
}

.quick-links a:hover {
	text-decoration: underline;
	color: #fff5f3;
	font-weight: 500;
}

.social-media a:hover {
	text-decoration: underline;
	color: #fff5f3;
	font-weight: 500;
}

.social-media h3,
.quick-links h3 {
	margin-bottom: 0.8rem;
}

.footer-center a {
	color: white;
	text-decoration: none;
	display: flex;
	width: 30%;
	align-items: center;
	gap: 0.5rem;
}

.footer-right {
	display: flex;
	gap: 1rem;
	width: 46%;
}

.address h4 {
	margin-bottom: 0.5rem;
}

.map {
	width: 600px;
	height: auto;
	border-radius: 8px;
	overflow: hidden;
}

iframe {
	width: 100%;
	height: 100%;
}

.footer-bottom {
	margin-top: 2rem;
	padding: 1rem 2rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-text {
	white-space: nowrap;
	z-index: 100;
	position: absolute;
	left: 8%;
	bottom: -10%;
	color: var(--primary-color);
	font-size: 1rem;
}

.reach-us {
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	right: 10%;
	transform: translateY(18%);
	background: white;
	color: var(--primary-color);
	border: 3px solid var(--primary-color);
	padding: 0.5rem 2rem;
	width: fit-content;
	cursor: pointer;
	font-weight: 500;
	border-radius: 20px 0 20px 0;
	transition: all 300ms ease-in-out;
}

.reach-us:active {
	background: var(--primary-color);
	color: white;
	border: 3px solid var(--secondary-color);
}
.reach-us:hover {
	background: #FFF5F3;
}

@media screen and (max-width: 768px) {
	.footer-container {
		flex-direction: column;
		gap: 1rem;
		padding: 1rem;
	}

	.footer-left {
		width: 100%;
	}

	.footer-center {
		width: 100%;
	}

	.footer-right {
		width: 100%;
	}

	.footer-center {
		flex-direction: row;
		gap: 1rem;
	}

	.social-media,
	.quick-links {
		gap: 0.5rem;
	}

	.footer-center a {
		width: 100%;
	}

	.map {
		display: none;
	}

	.reach-us {
		position: static;
		margin-top: 1rem;
		padding: 0.25rem 1rem;
		margin-left: auto;
		transform: none;
		font-size: 0.875rem;
	}

	.main-footer {
		padding: 1rem 0;
		position: relative;
	}

	.footer-bottom {
		flex-direction: column;
		gap: 1rem;
		text-align: center;
	}

	.footer-text {
		left: 5%;
		bottom: -5%;
		font-size: 0.75rem;
	}
}

@media screen and (max-width: 600px) {

	.foundation-info h2 {
		font-size: 1.5rem;
	}

	.address p {
		display: none;
	}

	.main-footer {
		width: 100%;
		padding: 0;
	}

	.social-media h3,
	.quick-links h3 {
		margin-bottom: 0;
	}

    .reach-us {
        position: absolute;
        bottom: 0;
        right: 0;
    }
}

/* Existing styles... */

@media screen and (max-width: 768px) {
    .footer-container {
        flex-direction: column;
        gap: 1rem;
        padding: 1rem;
    }

    .footer-left {
        width: 100%;
    }

    .footer-center {
        width: 100%;
    }

    .footer-right {
        width: 100%;
    }

    .footer-center {
        flex-direction: row;
        gap: 1rem;
    }

    .social-media,
    .quick-links {
        gap: 0.5rem;
    }

    .footer-center a {
        width: 100%;
    }

    .map {
        width: 100%;
    }
}

@media screen and (max-width: 600px) {
    .foundation-info h2 {
        font-size: 1.5rem;
    }

    .address p {
        display: none;
    }

    .main-footer {
        width: 100%;
        padding: 0;
    }

    .social-media h3,
    .quick-links h3 {
        margin-bottom: 0;
    }

    .reach-us {
        position: static;
        margin-top: 1rem;
        padding: 0.25rem 1rem;
        margin-left: auto;
        transform: none;
        font-size: 0.875rem;
    }

    .footer-bottom {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }

    .footer-text {
        left: 5%;
        bottom: -5%;
        font-size: 0.75rem;
    }
}